:root {
/*  --divborder: solid 1px; */
  --divbordercolor: black;
  --divbordercolorred: red;
  --divbordercolorred: blue;
  
  --graystdcolor: #c0c0c0;
  --fontstdcolor: #202020;
  }

div
  {
  border: none;
  }
  
*
  {
  font-family: Calibri, Helvetica, sans-serif; 
  color: #202020;
  color: var(--fontstdcolor); 
  } 

a
  {
  color: #202020;
  text-decoration: underline;
  font-weight: bold; 
  }

a:hover
  {
  color: #8b0000;
  text-decoration: underline;
  font-weight: bold; 
  }


a.linkwhite
  {
  color: white;
  text-decoration: none; 
  }
  
a.linkblack
  {
  color: #202020;
  text-decoration: none; 
  }
  
a.linkwhite:hover 
  {
  color: white;
  text-decoration: underline; 
  }
     
.maindiv
  {
  overflow: hidden;
  display: block;
  margin: 0 auto 0 auto;
  padding: 0;
  max-width: 1000px;
  min-width: 300px;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  }

.divfixbottom
  {
  display: block;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 1001;
  height: 30px; 
  text-align: center;
  background-color: #c0c0c0;
  }

.textfixedbottom
 {
 color: white;
 }


/**************************************************************************************************
 *
 *   TITLE
 *
 **************************************************************************************************/
.titlewrapper
  {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: white;
  z-index: 1000;
  height: 60px; 
  }  
 


.titlediv
  {
  max-width: 1000px;
  width: 100%;
  margin: auto;
  height: 60px; 
  }  

.titletable
  {
  border: none; 
  border-collapse: collapse; 
  width: 100%; 
  margin:0; 
  padding:0;
  border: var(--divborder);
  border-color: var(--divbordercolorblue);
  }

.titletr
  {
  height: 50px;
  }

.titlelogotd
  {
  padding: 0 0 0 5px;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolorred);
  width: 50px; 
  background-image: url(pics/logo.jpg);
  background-size: 50px;
  }

.titletd
  {
  margin: 0;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  font-size: 35px;
  font-weight: normal;
  text-align: center;
  }

.titlesocialtd
  {
  margin: 0;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  width: 50px; 
  }




.fbdiv
  {
  overflow: hidden;
  display: block;
  float:right;
  margin: 10px 5px 10px 0;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  width: 30px; 
  height: 30px;
  background-image: url(pics/fbseul.jpg);
  background-size: 30px;
  }
  
.instadiv
  {
  overflow: hidden;
  display: block;
  float:right;
  margin: 10px 5px 10px 0;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  width: 30px; 
  height: 30px;
  background-image: url(pics/instaseul.jpg);
  background-size: 30px;
  }
  

/**************************************************************************************************
 *
 *   INFO TOP
 *
 **************************************************************************************************/
 .infoframe
  {
  overflow: hidden;
  width: 100%;
  border: none;
  padding: 0;
  margin: 0;
  background-color: #fdcf22;
  }
  
.menudivlimite
  {
  max-width: 1000px;
  width: 100%;
  height: 60px;
  overflow: hidden;
  display: inline-block;
  }
  
 .wrapperinfodiv
  {
  border: none;
  overflow: hidden;
  float: left;
  width: 50%;
  max-width: 500px;
  height: 100%;
  display: block;
  margin: 0 auto 0 auto;
  padding: 0;
  font-size: 22px;
  color: #1b5084;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  }
  
 .infodivb
  {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  overflow: hidden;
  width: 100%;
  display: block;
  margin: auto;
  vertical-align: middle;
  padding: 0;
  border: solid 0px;
  border-color: var(--divbordercolor);
  
  text-align: center;
  vertical-align: middle;
  line-height: 1.2; 
  
 
  font-weight: bold;
  color: #202020;
  }
  

/**************************************************************************************************
 *
 *   PICTURES TOP
 *
 **************************************************************************************************/
 .toppicturediv
  {
/*  background-image: url(../pics/top.jpg); */  
  background-color: #1b5084; 
  overflow: hidden;
  width: 100%;
  margin-top: 60px;
  border:  var(--divborder);;
  border-color: var(--divbordercolor);
  height: 300px; 
  }

.wrapperposterdiv
  {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0 auto 0 auto;
  padding: 0;
  max-width: 1000px;
  min-width: 300px;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  height: 280px; 
  margin: 10px auto;
  }
  

.posterdiv
  {
  position: relative;
 
  display: block;
  margin: 0 auto 0  30px;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  width: 200px; 
  height: 100%;
/*  background-image: url(/current/res:php?d=pics&r=aff2025.png);*/
  background-size:     contain;                     
  background-repeat:   no-repeat;
  background-position: center center; 
  }


/**************************************************************************************************
 *
 *   MENU UNDER PICTURE
 *
 **************************************************************************************************/
 .menuframe
  {
  overflow: hidden;
  width: 100%;
  border:  0px solid;
  border-color: var(--divbordercolor);
  height: 60px; 
  background-color:  #fdcf22;
  }
  
.menudiv
  {
  overflow: hidden;
  float: left;
  width: 19.8%;
  height: 100%;
  min-width: 150px;
  display: block;
  margin: 0 auto 0 auto;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  
  text-align: center;
  vertical-align: middle;
  line-height: 60px;   
  
  font-size: 20px;
  font-weight: normal;
  color: white;
  
  }


.menuframevertical
  {
  position: fixed;
  top: 60px;
  left: 0;
/*      
  position: absolute;
  top: 60px;
  left: 0px; */
  display: block;
  overflow: hidden;
  width: 100%;
  border:  var(--divborder);;
  border-color: var(--divbordercolor);

  background-color:  #ffffff;
  }

.menudivhorizontal
  {
  overflow: hidden;
  display: inline-block;
  background-color:  #c0c0c0;
  margin: 5px;
  padding: 0;
  border: none;
  border-color:black;
  font-size: 20px;
  font-weight: normal;
  color: black;
  }

.menudivvertical
  {
  overflow: hidden;
  display: block;
  width: 100%;
  background-color:  #ffffff;
  min-width: 150px;
  margin: 5px;
  padding: 0;
  border: none;
  border-color: black;
  font-size: 20px;
  font-weight: normal;
  color: black;
  }


/**************************************************************************************************
 *
 *   OVER ALL CONTENT
 *
 **************************************************************************************************/

.overallcontent
  {
  min-height: 500px;
  text-align: center;
  }


/**************************************************************************************************
 *
 *   CONTENT
 *
 **************************************************************************************************/



.contentdiv
  {
  overflow: hidden;
  display: block;
  float: left;
  max-width: 800px;
  min-width: 300px;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  font-size: 18px;
  margin: 0;
  padding: 0 20px 0 0;
  text-align: justify;
  }

.texttitle
  {
  font-size: 125%;
  font-weight: bold;
  margin: 10px 0;
  width: 100%;
  text-align:center;
  background-color: #ffffff;
  color: #000;
  }

.textsubtitle
  {
  font-size: 113%;
  margin-top: 40px;
  font-weight: bold;
  text-decoration: underline;
  }

.socialdiv
  {
  overflow: hidden;
  display: inline-block;
  text-align: center;
  padding: 5px;
  margin: 0;
  border: none;
  color: black;
  width: 160px;
  }


/**************************************************************************************************
 *
 *   SPONSORS
 *
 **************************************************************************************************/
 
.sponsordivpremium
  {
  overflow: hidden;
  display: inline-block;
  text-align: center;
  padding: 5px;
  margin: 0;
  width: 160px;
  height: 160px; 
  min-width: 160px;
  margin-left: 5px;
  border: solid 1px  black;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
  font-size: 10px;
  font-weight: bold;
  color: black;
  background-color: #ffffff;
  }

.sponsordivpremium .imgsponsor
  {
  max-width: 150px;;
  max-height: 80px; 
  }  
  
 .sponsordiv
  {
  overflow: hidden;
  display: inline-block;
  text-align: center;
  margin: auto;
  height: 90px; 
  width: 160px;
  min-width: 160px;
  margin-left: 5px;
  color: black;
  background-color: #ffffff;
  }
  
.sponsordiv .imgsponsor
  {
  max-width: 150px;;
  max-height: 80px; 
  }  

 .supporterdiv
  {
  overflow: hidden;
  display: inline-block;
  text-align: center;
  padding: 5px;
  margin: 0;
  height: 90px; 
  width: 80px;
  min-width: 80px;
  color: black;
  background-color: #ffffff;
  }
  
.supporterdiv .imgsponsor
  {
  max-width: 70px;
  }  
  
  .sponsorhr
  {
  border-top: 3px solid; 
  width: 150px; 
  margin: auto; 
  margin-top: 32px; 
  text-align: center; 
  }

  .sponsorsepar
  {
  display: block;
  text-align: center; 
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
  }

  .sponsorphone
  {
  overflow: hidden;      
  display: block;
  text-align: center; 
  font-size: 15px;
  font-weight: bold;
  }

 /**************************************************************************************************
 *
 *   COUNTDOWN, DATE ET REGISTERED
 *
 **************************************************************************************************/  

.inscriptions-banner {
    position: fixed;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999999;
    color: #fff;
    width: 350px;
    padding: 10px 20px;
    border-radius: 8px;
    font-family: "Arial Black";
    font-size: 17px;
    text-align: center; 
    pointer-events: none; /* si tu veux que ça ne bloque aucun clic en dessous */


    /* ombre noire autour des lettres */
    text-shadow: 
        2px 2px 4px black,
        -2px -2px 4px black,
        2px -2px 4px black,
        -2px 2px 4px black;

}



.dateframe
  {
  background-color: #1b5084; 
  height: 35px;
  text-align: center;
  }

.infodate
  {
  display: inline-block;
  margin: 5px;
/*  color: #ee492d;  red */
/*  color: #1b5084;  blue */
/*  color: #fdcf22;  yellow */
  color: orange;
  font-size: 23px;
  font-weight: bold;
  }

.infoinsc
  {
  display: inline-block;
  margin: 5px;
  color: orange;
  font-size: 23px;
  font-weight: bold;
  }

.infocounter
  {
  display: inline-block;
  color: orange;
  font-size: 23px;
  font-weight: bold;
  }


.infostar
  {
  display: inline-block;
  margin: 10px ;
  height: 20px;
  }


.countdownframe
  {
  height: 110px; 
  background-color: #ffffff; 
  background-image: url("res.php?d=pics&r=backcountdownblue.png");  
  background-repeat: repeat-x;  
  }

.countdowntd
  {
  margin: 0;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  font-size: 35px;
  font-weight: normal;
  text-align: center;
  }

.lateralcountdowntd
  {
  margin: 0;
  padding: 0;
  border: var(--divborder);
  border-color: var(--divbordercolor);
  width: 80px; 
  }
 
.countdown {
            font-size: 60px;
            width: 350px;
            background-color: #ffffff;
            display: flex;
            margin: auto;
            margin-top: 10px;
            justify-content: center;
            gap: 20px;
        }

        .countdown-time-unit {
            font-size: 100%;
            font-weight: bold;
            color: orange;
        }

        .countdown-label {
            font-size: 30%;
            color: navy;
        }

        .countdown-time-container {
            text-align: center;
        }
        
/**************************************************************************************************
 *
 *   BUTTONBOX
 *
 **************************************************************************************************/         
.overallbuttonboxes
  {
  display: block; 
  overflow: hidden; 
  width:100%; 
  text-align: center;      
  }

.overallbuttonbox
  {
  font-size: 15px; 
  display: inline-block; 
  width: 200px; 
  margin-left: 5px;
  text-align: center;
  }

.topbottompicbuttonbox
  {
  padding: 0; 
  margin: 0;
  width: 100%;
  height: 30px;
  }
  
.titlebuttonbox
  {
  background-color: #1b5084; 
  color: white; 
  margin: 0; 
  padding: 0 3px 0 3px; 
  font-weight: bold;
  }

.imagebuttonbox
  {
  width: 200px; 
  height: 150px;
  }
.overimagebuttonbox
  {
  width: 200px; 
  height: 150px;
  }

.textbuttonbox 
  {
  background-color: #1b5084; 
  color: white; 
  padding:  0 3px 0 3px;
  }  
  
 

/**************************************************************************************************
 *
 *   Album photo
 *
 **************************************************************************************************/        

.photo-container {
      display: inline-block;
      width: 200px;
      height: 200px;
      margin: 10px;
      overflow: hidden;
      border: none;
      box-sizing: border-box;
    }
    
    /* L'image s'adapte à la taille du container */
    .photo-container img {
      width: 200px;
      display: block;
      margin: 0 auto;
    }

/**************************************************************************************************
 *
 *   @media
 *
 **************************************************************************************************/        
        
@media only screen and (max-width: 900px) {
  .divhidden {
    display: none;
  }
  .divshow {
    display: block;
  }
  .menusmallscreenresize {
    width: 32%;
  }
  .titletd {
    font-size: 120%;
  } 
 } 

@media only screen and (max-width: 700px) {
.countdown {
    font-size: 40px;
    width: 250px;
  }
.countdownframe
  {
  height: 90px; 
  }
.contentdiv
  {
  font-size: 16px;      
  }
}


@media only screen and (max-width: 550px) {
 .countdown {
    font-size: 40px;
    width: 250px;
  }
.countdownframe
  {
  height: 70px; 
  }
.contentdiv
  {
  font-size: 15px;      
  }
}


@media only screen and (max-width: 570px) {
 .divhidden {
    display: none;
  }
  .divshow {
    display: block;
  }
  .menusmallscreenresize {
    width: 120px;
    }
  a.linkblack {
    font-size: 90%;
  } 
  .titletd {
    font-size: 100%;
  }
.countdown {
    font-size: 35px;
    width: 250px;
  }
.overallbuttonbox
  {
  width: 160px;
  }
.imagebuttonbox
  {
  width: 160px; 
  height: 150px;
  }
.overimagebuttonbox
  {
  width: 160px; 
  height: 150px;
  }
.dateframe
  {
  height: 70px;      
  }
.infostar
  {
  display: none;       
  }
.infodate
  {
  font-size: 25px;       
  }
.infocounter
  {
  font-size: 25px;       
  }
.infoinsc
  {
  font-size: 25px;       
  }
.cb-slideshow span div
  {
  height: 200px;      
  }
.toppicturediv  
  {
  height: 260px;      
  }
}


@media only screen and (max-width: 430px) {
 .divhidden {
    display: none;
  }
  .divshow {
    display: block;
  }
  .menusmallscreenresize {
    width: 120px;
    }
  a.linkblack {
    font-size: 90%;
  } 
  .titletd {
    font-size: 100%;
  }
.countdown {
    font-size: 35px;
    width: 250px;
  }
.overallbuttonbox
  {
  width: 160px;
  }
.imagebuttonbox
  {
  width: 160px; 
  height: 150px;
  }
.overimagebuttonbox
  {
  width: 160px; 
  height: 150px;
  }
.dateframe
  {
  height: 70px;      
  }
.infostar
  {
  display: none;       
  }
.infodate
  {
  font-size: 20px;       
  }
.infocounter
  {
  font-size: 20px;       
  }
.infoinsc
  {
  font-size: 20px;       
  }
.cb-slideshow span div
  {
  height: 190px;      
  }
.toppicturediv  
  {
  height: 190px;      
  }


      
}