body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-style: 
normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: 
none; color: #000000; background-attachment: fixed; background-repeat: repeat; 
background-color: #FFD9AF; text-align: justify; letter-spacing: normal; word-spacing: 
normal; white-space: normal; margin-left: 15px; margin-right: 15px;
}

/* Couleur scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: #660000 #dc8c6c;
}

 h2 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 24px; 
font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; 
text-transform: none; color: #000000}
 a:link { font-family: Verdana, Arial, Helvetica, 
sans-serif; font-size: 16px; font-style: normal; font-weight: normal; font-variant: 
normal; text-transform: none; color: #660000; text-decoration: none}
 a:active { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-style: 
normal; font-weight: normal; font-variant: normal; text-transform: none; color: 
#660000}
 a:visited { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 
16px; color: #993300; text-decoration: none}
 a:hover { font-family: Verdana, Arial, 
Helvetica, sans-serif; color: #993300; text-decoration: underline dotted}
 p { text-align: 
justify}
 td { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-style: 
normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: 
none; color: #000000; background-attachment: fixed; background-repeat: repeat; letter-spacing: normal; word-spacing: normal; white-space: normal}
mark {
  background-color: black;
  color: white;
}
.largeurecran {max-width:1000px;}
#scrollUp
{
position: fixed;
bottom : 10px;
left: -100px;
opacity: 0.6;
}

.audio audio {
   width: 230px;
   height: 20px;
}
#menu {
  position: fixed;
  left: 183px;
  top: 5px;
   width: 647px;
}

/* pull-down mainmenu css */
.mainmenu{
	float: left;
	width: 100%;
	padding: 0;
}
.mainmenu ul {
	float: left;
	width: 100%;
	list-style: none;
	line-height: 1;
	color:#660000;
	background: #DC8C6C;
	padding: 0;
	border: solid #660000;
	border-width: 1px 1px;
        border-radius:10px; 
	margin: 0 0 1em 0;
}

.mainmenu a, .mainmenu a:visited {
	display: block;
font-family:Verdana, Arial, Helvetica, sans-serif;font-size:0.8em;font-weight:bold;font-style:normal;text-decoration:underline;
	color: #660000;
	text-decoration: none;
	padding: 1em 1em;
}
.mainmenu ul ul a{
	width:100%;
	height:100%;
}
.mainmenu ul a{
	width:1%;
}


.mainmenu li  {
	float: left;
	margin:0;
	padding:0;
}

.mainmenu ul li {float:left; position:relative;  }
.mainmenu ul li a {white-space:nowrap;}
	
.mainmenu li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width:15em;	
	
	background: #F7CEA5;
	font-weight: normal;
	border-width: 1px;
	margin: 0;
}

.mainmenu li li {
	width:15em ;
}

.mainmenu li li a{
	width:13em ;
}

.mainmenu li ul  {
	margin: 0;
}
.mainmenu li ul ul {
	margin: -2.8em 0 0 13.5em;
}
.ul_ch, 
.mainmenu li:hover ul ul,
.mainmenu li li:hover ul ul,
.mainmenu li li li:hover ul ul,
.mainmenu li li li li:hover ul ul,
.mainmenu li li li li li:hover ul ul
{
	left: -999em;
}
.mainmenu li:hover ul,
.mainmenu li li:hover ul,
.mainmenu li li li:hover ul,
.mainmenu li li li li:hover ul,
.mainmenu li li li li li:hover ul
{
	left: auto;
}
.mainmenu li:hover>ul.ul_ch   
{
	left: auto;
}

.mainmenu li:hover{
	background: #660000;
        border-radius:10px; 
}

.mainmenu li:hover a,.mainmenu li:hover a:visited,.mainmenu li:hover a:hover,.mainmenu li a:hover{
	color:#F7CEA5;
}
.mainmenu li:hover li a, .mainmenu li li:hover li a, 
.mainmenu li li li:hover li a, .mainmenu li li li li:hover li a,
.mainmenu li:hover li a:visited, .mainmenu li li:hover li a:visited, 
.mainmenu li li li:hover li a:visited, .mainmenu li li li li:hover li a:visited
{
	color:#660000;
}
.mainmenu li li:hover, .mainmenu li li li:hover, 
.mainmenu li li li li:hover , .mainmenu li li li li li:hover , .mainmenu li li li li li li:hover 
{
	background: #660000;
	z-index:9999;
}
.mainmenu li li:hover a,.mainmenu li li li:hover a, 
.mainmenu li li li li:hover a, .mainmenu li li li li li:hover a
{
	color: #F7CEA5; 
}

.mainmenu ul ul a, .mainmenu ul ul a:visited,
.mainmenu li li a, .mainmenu li li a:visited
{
	color: #660000;
}
.mainmenu ul ul a:hover,
.mainmenu li:hover li:hover a,.mainmenu li:hover li:hover a:visited ,
.mainmenu li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover a:visited,
.mainmenu li:hover li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover li:hover a:visited ,
.mainmenu li:hover li:hover li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover li:hover li:hover a:visited,
.mainmenu li:hover li:hover li:hover li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover li:hover li:hover li:hover a:visited{
	color: #F7CEA5;
}
.mainmenu li:hover li:hover li a,.mainmenu li:hover li:hover li a:visited ,
.mainmenu li:hover li:hover li:hover li a,.mainmenu li:hover li:hover li:hover li a:visited,
.mainmenu li:hover li:hover li:hover li:hover li a,.mainmenu li:hover li:hover li:hover li:hover li a:visited,
.mainmenu li:hover li:hover li:hover li:hover li:hover li a,.mainmenu li:hover li:hover li:hover li:hover li:hover li a:visited{
	color: #660000;
}

/* end of mainmenu css */

/* style pop-up normal */

      /* Positionnez le pop-up */
      .login-popup {
        position: relative;
        text-align: center;
        width: 100%;
      }
      /* Masquez le pop-up */
      .form-popup {
        display: none;
        position: fixed;
        left: 45%;
        top: 10%;
        transform: translate(-45%, 5%);
        border: 2px solid #660000;
      }
      /* Styles pour le contenu du pop-up */
      .form-container {
        padding: 0px;
        background-color: #FFD9AF;
      }

/* style pop-up gauche */

      /* Positionnez le pop-up */
      .login-popupg {
        position: relative;
        text-align: center;
        width: 100%;
      }
      /* Masquez le pop-up */
      .form-popupg {
        display: none;
        position: fixed;
        left: 15%;
        top: 10%;
        transform: translate(-45%, 5%);
        border: 2px solid #660000;
      }
      /* Styles pour le contenu du pop-up */
      .form-containerg {
        padding: 0px;
        background-color: #FFD9AF;
      }


            /* Infobulle */ 
            
            /* Position et couleur bulle */
            a span{ 
                position:absolute;
                margin-bottom:0px; 
                margin-left:-50px;
                color:#000000; 
                background:#FFD9AF; 
                padding:3px; 
                border-radius:5px; 
      		border: 1px solid #660000;
		text-align: left;                
                /* Faire disparaire infobulle par défaut */
                /* On determine l'origine de la rotation */ 
                transform:scale(0) rotate(-180deg);
                /* Faire durer l'effet */
                transition:all .25s;
                /* Effet sur la transparence */ 
                opacity:0;
            }
            
            /* Apparition de la bulle avec le scale à 1 */ 
            a:hover span, a:focus span{ 
                transform:scale(1) rotate(0);
                /* Effet sur la transparence */ 
                opacity:1;
            }