/* ---------------------------------------------------------------------------------------



		CSS DU PLUGIN
		¯¯¯¯¯¯¯¯¯¯¯¯¯

		MODE HORIZONTAL


		Ce CSS écrase certaines données du stylesheet général.
		Vous pouvez le changer manuellement.

		Android 2.3 supporte mal position: fixed; et overflow: scroll;
		La classe "no-fixed" règle le problème.



--------------------------------------------------------------------------------------- */




/* Polices locales via font-face
--------------------------------------------------------------------------------------- */
	/* Utilisé pour les icônes */
	@font-face {
		font-family: 'guifx';
		src: url('font/guifx_v2_transports-webfont.eot');
		src: url('font/guifx_v2_transports-webfont.eot?#iefix') format('embedded-opentype'),
			 url('font/guifx_v2_transports-webfont.woff2') format('woff2'),
			 url('font/guifx_v2_transports-webfont.woff') format('woff'),
			 url('font/guifx_v2_transports-webfont.ttf') format('truetype'),
			 url('font/guifx_v2_transports-webfont.svg#guifx_v2_transportsregular') format('svg');
		font-weight: normal;
		font-style: normal;
	}


/* Styles généraux
--------------------------------------------------------------------------------------- */
	/* Animation du menu vertical */
	.vAnimationMargin #menu.mobile {
		-webkit-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}


/* Conteneurs
--------------------------------------------------------------------------------------- */
	#entete {position: relative; z-index: 5;}

	#vPage {height: 100%;}


	/* Overlay sur le site */
	.vMenuFiltre #vPage:before {
		content: ""; position: fixed; top: 0; right: 0; bottom: 100%; left: 0; z-index: 1;
		margin-bottom: 100%;
		background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQImWNgYGBoAAAAhQCBuMOYEwAAAABJRU5ErkJggg==);
		background: rgba(0,0,0,0.5);
		-webkit-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}
	.vMenuFiltre.vMenu-open #vPage:before {bottom: 0; margin-bottom: 0;}


/* Icônes
--------------------------------------------------------------------------------------- */
	#menu.mobile li.avecSousMenu > a:before {font: 400 20px/100% "guifx"; color: #fff; display: inline-block;}

	/* Flèche du sous-menu */
	#menu.mobile li.avecSousMenu > a:before {content: ">";}
	#menu.mobile li.avecSousMenu.actif > a:before {content: ",";}


/* Menu mobile
--------------------------------------------------------------------------------------- */
	/* Au chargement, le menu n'est pas affiché pour évité qu'il flash le temps que la classe soit ajoutée */
	#menu {display: none;}

	#menu.mobile {position: relative; z-index: -1;}

	.vMenu-open #menu.mobile  { z-index:0;}

	#menu.mobile li {position: relative;}
	#menu.mobile li a {
		display: block;
		padding: 20px;
		position: relative;
		font:700 14px 'Open Sans', sans-serif;
		text-decoration: none; outline: none;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		-webkit-tap-highlight-color: transparent;
		background: #090909;
		color: #fff;
		border-bottom: 1px solid rgba(240,240,240,.3);
	}
	/*#menu.mobile li a:hover  {background: #949494; outline: none;}*/
	#menu.mobile li a:active {background:#858585; outline: none;}
	#menu.mobile li a.actif  {outline: none; background: #949494;}
	#menu.mobile li:last-child a {border-bottom:0;}

	/* Lien avec flèche */
	#menu.mobile li.avecSousMenu > a {}
	#menu.mobile li.avecSousMenu > a:before {position: absolute; top: 50%; margin-top: -0.5em; right: 17px;}

	/* Sous-menu */
	/* Premier niveau */
	#menu.mobile ul ul { display: none;}
	#menu.mobile ul ul a { background: #2d2d2d;}
	/* Deuxième niveau */
	#menu.mobile ul ul ul a { background: #1e1e1e; border-bottom-color: #c5c5c5;}


	/* Certaines de ces règles sont écrasées par les règles ci-dessous */


/* Type 1
--------------------------------------------------------------------------------------- */
	.vMenu-h-1 {}

	/* Menu version bureau */
	/* Cache les liens dupliqués */
	.vMenu-h-1 #menu.bureau > ul > li > ul > li:first-child {display: none;}
	.vMenu-h-1 #menu.bureau > ul > li > ul > li > ul > li:first-child {display: none;}


/* Type 2
--------------------------------------------------------------------------------------- */
	.vMenu-h-2 {}

	/* Flèche du sous-menu */
	.vMenu-h-2 #menu.mobile li.avecSousMenu a:before {display: none;}

	/* Icône du + */
	.vMenu-h-2 #menu.mobile li .vWrapType2 a.vAfficherSousMenu span:before {
		display: block; content: "+"; font-family: "Courier"; font-weight: 700; font-size: 30px;
		position: absolute; top: 50%; margin-top: -8px; left: 50%; margin-left: -9.5px;
	}
	.vMenu-h-2 #menu.mobile li.actif > .vWrapType2 > a.vAfficherSousMenu span:before {content: "-";}


	/* Menu mobile */
	/* Lien avec + */
	.vMenu-h-2 #menu.mobile li.avecSousMenu > .vWrapType2 {position: relative;}
	.vMenu-h-2 #menu.mobile li.avecSousMenu > .vWrapType2 > a {margin-right: 50px; padding-right: 0;}
	.vMenu-h-2 #menu.mobile li.avecSousMenu > .vWrapType2 > a.vAfficherSousMenu {
		position: absolute; top: 0; right: 0; bottom: 0;
		width: 50px; display: block; margin: 0; padding-left: 0;
		text-align: center; vertical-align: middle;

		border-left: 1px dashed #777;
	}
	.vMenu-h-2 #menu.mobile li.avecSousMenu > .vWrapType2 > a.vAfficherSousMenu span {
		position: absolute; top: 0; right: 0; bottom: 0; left: 0;

		border-left: 1px dashed #484848;
	}


	/* Menu version bureau */
	/* Cache les liens créés */
	.vMenu-h-2 #menu.bureau a.vAfficherSousMenu {display: none;}
	.vMenu-h-2 #menu.mobile li.avecSousMenu > .vWrapType2 {}


/* Ouverture du menu
--------------------------------------------------------------------------------------- */
	.vMenu-open #menu.mobile {display: block;}
	.vMenu-open #logoMenu {background:#000;}
	.vMenu-open #logo, .vMenu-open .btnDemandeInfo {display: none;}


/* Icone hamburger
--------------------------------------------------------------------------------------- */
	#iconeMenu {
		position: absolute;
		left: 0; top: 0;
		height: 50px; width: 62px;
		padding: 15px 20px;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
		cursor: pointer; outline: none;
		background: transparent;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
		-webkit-tap-highlight-color: transparent;
		z-index: 50;
	}
	.vMenu-droit #iconeMenu {left: auto; right: 0;}
	#iconeMenu:selection {background: transparent;}

	#iconeMenu > span {padding: 7px 0; display: block; position: relative;}

	#iconeMenu > span span:before,
	#iconeMenu > span span:after,
	#iconeMenu > span span {
		height: 3px; width: 100%;
		background-color: #000; content: "";
		border: none; display: block;
		-webkit-transition: transform 0.5s ease;
		transition: transform 0.5s ease;
	}

	#iconeMenu > span span:before {position: absolute; top: 0;}
	#iconeMenu > span span:after {position: absolute; bottom: 0;}
	#iconeMenu > span span {}

	/* Animation de l'icône */
	.csstransforms.vMenu-open #iconeMenu > span {position: relative; top: -1px;}
	.csstransforms.vMenu-open #iconeMenu > span span:before {
		top: 50%;
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.csstransforms.vMenu-open #iconeMenu > span span:after {
		top: 50%; bottom: auto;
		-ms-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.csstransforms.vMenu-open #iconeMenu > span span {background: none;}

	.csstransforms.vMenu-open #iconeMenu > span span:before,
	.csstransforms.vMenu-open #iconeMenu > span span:after {background-color: #fff;}


/* ==================================================================================== */
/*  Media Queries for Responsive Design  */
/* ==================================================================================== */

	/* Tablette portrait
	--------------------------------------------------------------------------------------- */
	@media only screen and (min-width: 768px) {
		#iconeMenu {width:71px;}
		#iconeMenu > span {padding:10px 0;}

		#iconeMenu > span span:before,
		#iconeMenu > span span:after,
		#iconeMenu > span span {height: 5px;}
	}



	@media only screen and (min-width: 1020px) {

		/* Conteneurs
		--------------------------------------------------------------------------------------- */
			/* Overlay sur le site */
			.mod2 .vMenuFiltre #vPage:before {display: none;}


		/* Menu mobile
		--------------------------------------------------------------------------------------- */
			/* Effet hover seulement sur bureau pour éviter des problèmes sur mobile | Utiliser seulement si nécessaire */
			/*#menu.mobile li a:hover  {background: #383838; outline: none;}*/


		/* Icone hamburger
		--------------------------------------------------------------------------------------- */

	}

	/* Tablette paysage et desktop
	--------------------------------------------------------------------------------------- */
	@media only screen and (min-width: 1200px) {

		/* Conteneurs
		--------------------------------------------------------------------------------------- */
			/* Overlay sur le site */
			.mod1 .vMenuFiltre #vPage:before {display: none;}


		/* Menu mobile
		--------------------------------------------------------------------------------------- */
			/* Effet hover seulement sur bureau pour éviter des problèmes sur mobile | Utiliser seulement si nécessaire */
			/*#menu.mobile li a:hover  {background: #383838; outline: none;}*/


		/* Icone hamburger
		--------------------------------------------------------------------------------------- */
			.mod1 #iconeMenu {display: none;}
			.mod2 #iconeMenu {display: none;}
	}