/* CSS Document - rzn 2018-10-12 Chloé */
/* Gestion des menus */

@media (max-width:62em) {
div.accueil_menu_desktop {display:none;}
div.accueil_menu_mobile {display:block;}
div.accueil_menu_mobile a {display:block; font-size:1.5em; line-height:2em;}

#MenuBig {display:none;}
#MenuBig_ON {display:none;}
#MenuBig_OFF {display:none;}

#MenuSmall {position:absolute; left:5px; width:50px; top:5px; height:36px;}
#MenuPath {position:absolute; left:75px; width:calc(100% - 120px); top:5px; height:36px; line-height:36px;}

#MenuDiv {position:fixed; top:50px; left:20px; width:85%; height:calc(100% - 52px); background-color:#DDDDDD; border:2px solid #777777; background:linear-gradient(#DDDDDD,#BBBBBB); box-shadow:inset 0px 1px 1px #878787; z-index:11; display:none; overflow-y:scroll; -webkit-overflow-scrolling:touch;}

.menu {list-style-type:none;}
.menu li {font-size:1.2em; line-height:200%;}

.sub-menu {list-style-type:none;}
.sub-menu li {font-size:1em; line-height:150%;}
}

@media (min-width:63em) {
div.accueil_menu_mobile {display:none;}
.menu_1_accueil {display:none;}
.menu_1_site {display:block;}


#MenuSmall {display:none;}
#MenuPath {display:none;}

#MenuBig {position:absolute; top:0; left:0; width:200px; height:125px; display:block;}
#MenuBig_ON {position:absolute; top:10px; left:0; width:70px; height:50px; display:block; z-index:12;}
#MenuBig_OFF {position:absolute; top:10px; left:0; width:70px; height:50px; display:none; z-index:12;}

#MenuDiv {position:absolute; top:12px; left:10px; height:32px; width:calc(100% - 20px); display:block;}

.menu {font-family:"Raleway",sans-serif; width:100%; font-size:1em; list-style-type:none; position:absolute; margin:0; padding:0;}
.sub-menu {font-family:"Raleway",sans-serif; font-size:.75em; list-style-type:none; position:absolute; margin:0; padding:0 0 0 10px;}

.menu li {
  float:left;
  margin:0 3px;
  display:inline-block;}
.menu li a {
  display:block;
  font-weight:400; 
  min-width:90px;
  height:20px;
  line-height:16px;
  color:#999999;}
.menu li a.menuActif {
  color:#000000;
  text-decoration:underline;}  
.menu li:hover a {
  color:#000000;}
.menu li:hover .sub-menu a {
  color:#777777;
  line-height:20px;
  height:16px;}
.menu li:hover .sub-menu a:hover {
  color:#222222;}
.menu li .sub-menu {
  display:none;}
.menu li .sub-menu li {
  display:block;
  float:none;
  padding:5px 20px 5px 10px;
  background-color:#F1F1F1;}
.menu li .sub-menu li a {
  width:auto;
  min-width:120px;
  font-weight:400;}
.menu li .sub-menu li a.menuActif {
  color:#000000;
  text-decoration:underline;}  

.menu li a:hover + .sub-menu, .menu li .sub-menu:hover {
  display:block;
  z-index:99;}
}