/* Alterre menu déroulant */

#menu {
	font-family: 'Roboto Condensed', Helvetica, Arial, sans-serif;
	z-index: 150;
	position: absolute;
	top: 0px;
	left: 0;
	width: 100%;
	height: 42px;
	/*background-color: #004f9e;
	background-image: -webkit-linear-gradient(0deg,rgba(0,79,158,1.00) 0%,rgba(0,29,69,1.00) 100%);
	background-image: -moz-linear-gradient(0deg,rgba(0,79,158,1.00) 0%,rgba(0,29,69,1.00) 100%);
	background-image: -o-linear-gradient(0deg,rgba(0,79,158,1.00) 0%,rgba(0,29,69,1.00) 100%);
	background-image: linear-gradient(90deg,rgba(0,79,158,1.00) 0%,rgba(0,29,69,1.00) 100%);*/
	text-shadow: 1px 1px 2px rgba(0,16,37,0.24);
}
#menu a:hover { text-decoration: none; }
#menu ul {
	padding: 0px;
	margin: 0px;
}
#menu > ul {
	margin-right: auto;
	margin-left: auto;
	width: 90%;
	min-width: 980px;
	max-width:1400px;
}
#menu li {
	padding: 0px;
	list-style-type:none;
	list-style-image: none;
	float:left;
	line-height: normal;
	margin: 0px;
	width:12.5%;
	text-align:center;
	font-size: 18px;
	}
#accueil #menu li {width: 11%;}
@media only screen and (max-width : 1250px) {#menu li {font-size: 16px;}
#accueil #menu li {	width:11.5%;}
#accueil #menu #menu4 {width:15%;}
#menu #menu7 {width:10%;}
}
#menu li a {
	display: block;
	color: #FFFFFF;
	line-height: 30px;
	padding-top: 12px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
#menu #menu4 {margin-left:19%;}
#accueil #menu #menu4 {margin-left:22%;
width:13%;}

#menu li a:hover, #menu li:hover > a {
	background-color: #006DDC;
	padding-top: 15px;
}

/************* SOUS-MENU **********************/
#menu .sous_menu {
	font-family: Helvetica, Arial, sans-serif;
	display: none;
	list-style-type: none;
	width: 250px;
	position: absolute;
	visibility: hidden;
	box-shadow: 3px 4px 6px -3px rgba(34,42,50,0.21);
	-webkit-box-shadow: 3px 4px 6px -3px rgba(34,42,50,0.21);
	animation-duration: 0.2s;
	-webkit-animation-duration: 0.2s;
	animation-name: menuderoulant;
	-webkit-animation-name: menuderoulant;
	animation-timing-function: ease-in;
	-webkit-animation-timing-function: ease-in;
	background-image: -webkit-linear-gradient(270deg,rgba(0,109,220,1.00) 0%,rgba(148,176,204,1.00) 76.05%);
	background-image: -moz-linear-gradient(270deg,rgba(0,109,220,1.00) 0%,rgba(148,176,204,1.00) 76.05%);
	background-image: -o-linear-gradient(270deg,rgba(0,109,220,1.00) 0%,rgba(148,176,204,1.00) 76.05%);
	background-image: linear-gradient(180deg,rgba(0,109,220,1.00) 0%,rgba(148,176,204,1.00) 76.05%);
}
  @keyframes menuderoulant {
    from {margin-top:-5px;
	opacity:0;}
    to {margin-top:0;
	opacity:1;}
  }
  @-webkit-keyframes menuderoulant {
     from {margin-top:-5px;
	opacity:0;}
    to {margin-top:0;
	opacity:1;}
}
#menu li:hover > .sous_menu {
	display:block;
	visibility: visible;
	z-index: 200;
}

#menu li li {float:none;
width:auto!important;
text-align:left;
	font-size: 13px;
}
#menu li li a {
	padding: 7px 10px!important;
	border-bottom: 1px solid rgba(163,207,255,0.30);
	line-height: normal;
}
#menu li li:last-of-type a {border-bottom:none;}
#menu li li a:hover  { background-color: #1287ff;}

/************* 3 GROS BOUTONS **********************/
#menu #menu1, #menu #menu2, #menu #menu3 {
	position: absolute;
	width: 240px!important;
	height: 51px;
	top: 64px;
}
#menu #menu1:hover, #menu #menu2:hover, #menu #menu3:hover { background-position: 0 -51px; }
#menu #menu1 {
	background-image: url(../images/interface/menu_ressources.png);
	margin-left:230px;
	}
#menu #menu2 {
	background-image: url(../images/interface/menu_actions.png);
	margin-left: 485px;
	}
#menu #menu3 {
	background-image: url(../images/interface/menu_themes.png);
	margin-left:740px;
	}
@media only screen and (min-width : 1200px) {
	#menu #menu1 {margin-left:280px;}
	#menu #menu2 {margin-left:562px;}
	#menu #menu3 {margin-left:850px;}
	}
@media only screen and (min-width : 1400px) {
	#menu #menu1 {margin-left:320px;}
	#menu #menu2 {margin-left:640px;}
	#menu #menu3 {margin-left:950px;}}
@media only screen and (min-width : 1600px) {#menu #menu1 {margin-left:330px;}
	#menu #menu2 {margin-left:700px;}
#menu #menu3 {margin-left:1050px;}
}

#menu #menu1 > a, #menu #menu2 > a, #menu #menu3 > a {
	background-color: transparent!important;
padding-top:0;
line-height:normal;
height:51px;
}
#menu #menu1 span, #menu #menu2 span, #menu #menu3 span { display: none; }
#menu .sous_menu span {display:block!important;}

/************* SOUS-MENU RESSOURCES **********************/
#menu #menu1 .sous_menu {
	background-image: none;
	background-color: rgba(222,53,104,0.85);
}
#menu #menu1 .sous_menu li a:hover {background-color:#c1003a;}

/************* SOUS-MENU ACTIONS **********************/
#menu #menu2 .sous_menu {
	background-image: none;
	background-color: rgba(90,174,0,0.85);
}
#menu #menu2 .sous_menu li a:hover {background-color:#438100;}


/************* SOUS-MENU THEMES **********************/
#menu #menu3 .sous_menu {
	background-image: none;
	background-color: rgba(244,126,0,0.85);
}
#menu #menu3 .sous_menu li a:hover {background-color:#ce6100;}

#menu9, #menu10 { display: none; }

/************* RESEAUX SOCIAUX *****************/
#onglets_reseaux_sociaux{
	position: fixed;
	right:0;
	top: 260px;
	overflow: hidden;
	width: 48px;
	z-index:900;
}
/*#accueil #onglets_reseaux_sociaux{top: 271px;}*/
#onglets_reseaux_sociaux a {
	display: block;
	height: 39px;
	width: 48px;
	-webkit-transition-property: margin-left;
	-webkit-transition-duration: 0.6s;
	-moz-transition-property: margin-left;
	-moz-transition-duration: 0.6s;
	transition-property: margin-left;
	transition-duration: 0.6s;
	margin-bottom: 5px;
	margin-left:10px;
}
#onglets_reseaux_sociaux a:hover {margin-left:0px;}
#onglets_reseaux_sociaux span { display:none;}
.onglet_facebook {background-image: url(../images/interface/rs_facebook.png);}
.onglet_twitter {background-image: url(../images/interface/rs_twitter.png);}
.onglet_rss {background-image: url(../images/interface/rs_rss.png);}