//:root {
//   --mmo-bleu : #24AAD0;
//   --mmo-rose : #8F3D64;
//   --pal-bleu : #88CCFF;
//   --pal-mari : #444466;
//}


body {
   font-family : arial,verdana;
   margin  : 0 auto;
   padding : 0;
   background-color : #FFFFFF;
   min-width : 1024px;
   max-width : 3072px;
}

#entete {
   max-width : 3072px;
   height : 175px;
   margin : 0 auto;
   padding : 10px;
//   background-color : #24AAD0;
   background-color : #0D7DBC;
   vertical-align : middle;
   border-left : 0px solid blue;
   border-right : 0px solid blue;
   border-top : 0px solid blue;
   border-radius : 10px 10px 0 0;
}

#logol {
  float : left;
  margin : 5px 0 0 30px;
}

#logor {
  float : right;
  margin : 5px 30px 0 0;
}

#titres {
   margin : 0 auto;
   padding : 10px 0 10px 0;
   max-width : 1024px;
   text-align : center;
   font-weight : bold;
   font-style : italic;
   background-color : #FFF;
   border-radius : 10px;
   letter-spacing : 4px;
}

#titres p {
   font-size : 16pt;
   margin : 0;
}

.titre1 {
   font-size : 16pt;
   padding : 0 0 10px 0;
}

.titre2 {
   font-size : 16pt;
}

p.gauche {
   text-align: left;
   color : #0D7DBC;
   padding-left : 175px;
}

.milieu {
   text-align : center;
   color : #02B205;
   padding-left : 100px;
}

.droite {
   text-align : right;
   color : #D40D38;
   padding-right : 175px;
}
   

#menuhorz {
   max-width : 1024px;
   margin : 0 auto;
   padding : 15px 5px 10px 5px;
   color :  #0D7DBC;
}

ul#main, .submenu {
   padding : 0;
   margin  : 0;
   list-style-type:none;
   text-align : center;
}

ul#main > li {
   display : inline-block;
   margin : 0;
   position : relative;
   padding  : 4px 0px;
   background-color : #EEEEDD;
   border-left : 0px solid blue;
   border-top  : 0px solid blue;
   border-bottom : 0px solid blue;
   color : #FF0000;
}

ul#main > li > a {
   display : block;
   padding : 0px 12px;
   text-decoration : none;
//   color : #4488CC;
   color : #02B205;
}

#main > li:hover > a {
   background-color : #D40D38;
   color : #FFFFFF;
}

#main > li:hover > a.selfected {
   background-color : #FFFFFF;
   color : red;
}

.rondd {
   border-right : 0px solid blue;
   border-radius : 0 12px 12px 0;
}

.rondm {
   border-left : 0px solid blue;
   border-radius : 0;
}

.rondg {
   border-left : 0px solid blue;
   border-radius : 12px 0 0 12px;
}


#main ul {
  display : none;
}

.ligne {
   text-align : left;
   padding : 10px 0px;
}

.ligne > td {
   padding : 10px 20px;
}

#main li:hover ul {
   display : block;
   position : absolute;
   top : 22px;
   left : 0px;
   z-index : 100;
   padding : 0px 5px;
   border-radius : 4px;
   border : 1px solid #02B205;
}

ul.submenu {
   background-color : #EEEEDD;
   color : red;
}

ul.submenu li {
   margin : 0;
   padding : 3px 0px 0px 10px;
//   border-left : 0px solid green;
//   border-top : 0px solid blue;
//   border-right : 0px solid green;
   width : 250px;
   text-align : left;
}

ul.submenu li a {
   display : block;
   width : 100%;
   text-decoration : none;
   background-color : #EEEEDD;
   color : #02B205;
   padding : 0;
   margin : 0;
}

ul.submenu  li:hover a {
   background-color : #D40D38;
   color : white;
}

#data {
   max-width : 1024px;
//   min-height : 384px;
   max-height : 1024px;
   margin : 0 auto;
   padding : 25px 0px;
   border-left : 0px solid blue;
   border-right : 0px solid blue;
   text-align : center;
}

#piedpage {
   max-width : 3072px;
   margin : 0 auto;
   padding : 15px 10px;
   background-color : #0D7DBC;
   color : white;
   border : 0px solid blue;
}

#legende {
   max-width : 1024px;
   margin : 0 auto;
   font-size : 0.9em;
}

h2 {
   color : #0D7DBC;
}

.ligne a {
   color : #666666;
   text-decoration : none;
}

.ligne a:hover {
   color : #66AADD;
   text-decoration : none;
}

.txtima {
   float : left;
   padding : 10px 50px 10px 10px;
}

.txtbleu {
   font-size :40pt;
   color :  #02B205;
   font-weight:bold;
   letter-spacing : 2px;
}

.txtmage {
   font-size : 40pt;
   color : #D40D38;
   font-weight : bold;
   letter-spacing : 2px;
}

.txtgris {
   text-align : left;
   font-size : 24px;
   color : #888888;
}

div#piedpage > div > img {
   margin : 0 10px;
}

#regles {
   text-align : left }

ul#main > li > a.selfected {
   display : block;
   padding : 0px 12px;
   text-decoration : none;
//   color : #4488CC;
   color : #D40D38;
}
