/************************************************************************************************************************************/
/* Déclaration des polices
/************************************************************************************************************************************/

@font-face 
{
	font-family: 'champignon';
	src: 	
		url('../police/champignon/champignon.otf'),
		url('../police/champignon.woff2') format('woff2'), 
		url('../police/champignon.woff') format('woff');
}

@font-face 
{
	font-family: 'planer';
	src: 	
		url('../police/planer/planer.ttf');
}
/* 
@font-face 
{
    font-family: 'B';
    src: url('police/FontleroyBrown-webfont.eot');
    src: url('police/FontleroyBrown-webfont.eot?#iefix') format('embedded-opentype'),
         url('police/FontleroyBrown-webfont.woff') format('woff'),
         url('police/FontleroyBrown-webfont.ttf') format('truetype'),
         url('police/FontleroyBrown-webfont.svg#FontleroyBrownRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
 */
 
/************************************************************************************************************************************/
/* Ensemble de la page
/************************************************************************************************************************************/

body
{
	background-color: #2a2323;
	margin:0;
	padding:0;
	color:white; 
	min-width:300px;
	min-height:160px;
}

/* Body */
/*  Pour Js */

body:after 
{
	content:'{"width":"_0_"}';
	display: none;
}

@media all and (min-width: 1024px)
{
	body:after 
	{
		content:'{"width":"_1024_"}';
		display: none;
	}
}

/************************************************************************************************************************************/
/* Liens generaux
/************************************************************************************************************************************/

a
{
	color:white;
	text-decoration: none; 
}

a:hover
{
	color:#a3b5b5;
}

/************************************************************************************************************************************/
/* En Tete
/************************************************************************************************************************************/

/* En tete */
/*  Largeur : >0*/

#en_tete
{
    width:100%;
	 display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    justify-content: center;
	 justify-content: center;
    align-items: center;
	margin-bottom:8px;
	margin-top:10px;
}

/************************************************************************************************************************************/
/* En Tete Logo
/************************************************************************************************************************************/

/* Logo */
/*  Largeur : >0 */

#en_tete_logo
{
	width:34%;
	text-align:center;
	position:relative;
}

#en_tete_logo_fixe
{
	margin:auto;
	height:70px;
}

#en_tete_logo h1
{
	font-weight: 100;
	margin:0;
	padding:0;
	font-size: 40px;  
}

#logo_partie_1
{
	display:none;
}

#logo_partie_2
{
	margin:0px;
	padding:0px;
	letter-spacing: 2px; 
	width:100%;
	font-family: champignon,Calibri, Arial, Sans-Serif;
	text-align:center;
}

#logo_partie_3
{
	position:absolute;
	top:46px;
	left:25px;
	font-weight: 100; 
	letter-spacing: 0.8px; 
	font-size:8px; 
	font-family: planer,Calibri, Arial, Sans-Serif; 
	width:100%;
	margin:auto;
}

/* Logo */
/* Largeur : >1024 */

@media all and (min-width: 1024px)
{
	#en_tete_logo_fixe
	{
		height:80px;
	}
	#en_tete_logo
	{
		width:15%;
	}
	#en_tete_logo h1
	{
		font-size:45px; 
	}
	#logo_partie_3
	{
		font-size:9px; 
		top:48px;
		left:24px;
	}
}

/* Logo */
/* Largeur : >1200 */
@media all and (min-width: 1200px)
{
	#en_tete_logo
	{
		width:23%;
	}
	#en_tete_logo h1
	{
		font-size:45px; 
	}
	#logo_partie_1
	{
		display:inline;
		letter-spacing: 5px; 
		width:100%;
		font-family: champignon,Calibri, Arial, Sans-Serif;
	}
	
	#logo_partie_2
	{
		display:inline;
		margin:0px;
		padding:0px;
		letter-spacing: 5px; 
		width:100%;
	}
	#logo_partie_3
	{
		font-size:11px; 
		top:50px;
		left:89px;
	}
}

/* Logo */
/* Largeur : >1280 */

@media all and (min-width: 1280px)
{
	#en_tete_logo
	{
		width:21%;
	}
}

/* Logo */
/* Largeur : >1600 */

@media all and (min-width: 1600px)
{
	#en_tete_logo h1
	{
		font-size:54px; 
	}
	#logo_partie_3
	{
		font-size:13px; 
		top:58px;
		left:105px;
	}
}

/************************************************************************************************************************************/
/* En Tete Millieu
/************************************************************************************************************************************/

/* S */
#en_tete_millieu
{	
	/* width:80%; */
	width:32%;
	text-align:center;
}

#en_tete_millieu #menu_1
{
	font-weight:bold;
	letter-spacing: 0.8px; 
	font-size: 15px; 
	font-family: planer,Calibri, Arial, Sans-Serif; 
}

#en_tete_millieu #menu_2, 
#separateur_1
{
	display:none;
}

/* M - Millieu */

@media all and (min-width: 1024px)
{
	#en_tete_millieu
	{
		width:70%;
		text-align:center;
		margin-top: 15px;
	}
	
	#en_tete_millieu #menu_1
	{
		font-weight:100;
		letter-spacing: 0.8px; 
		font-size: 15px; 
		font-family: planer,Calibri, Arial, Sans-Serif; 
		margin:auto;
		margin-bottom:25px;
	}

	#en_tete_millieu #menu_2
	{
		text-align:center;
		display: -webkit-box;
		display:flex;
		justify-content: center;
		align-items: center;
		font-weight:bold;
		letter-spacing: 0.8px; 
		font-size: 15px; 
		font-family: planer,Calibri, Arial, Sans-Serif; 
		margin-bottom:15px;
	}
	
	#separateur_1
	{
		display:inline;
	}
	
	#separateur_2
	{
		display:none;
	}
	
	/* Menu Principal */
	#en_tete_millieu #menu-principal
	{
		width:100%;
		font-weight:bold;
		letter-spacing: 0.8px; 
		font-size: 14px; 
		font-weight:100;
		font-family: planer,Calibri, Arial, Sans-Serif; 
	}
	#en_tete_millieu #menu-principal ul
	{
		margin:auto;
		text-align:center;
	}
	#en_tete_millieu #menu-principal li
	{
		display:inline;
		margin-right:12px;
		margin-left:12px;
	}	
	#en_tete_millieu #menu-principal a
	{
		text-decoration:none;
	}
}

/* L - Millieu */

@media all and (min-width: 1200px)
{
	#en_tete_millieu 
	{
		width:54%;
		text-align:center;
	}
	#en_tete_millieu #menu-principal
	{
		font-size: 13px; 
	}
	#en_tete_millieu #menu-principal li
	{
		display:inline;
		margin-right:9px;
		margin-left:9px;
	}	
}

/* Haut Millieu */
/* Largeur : >1280 */
@media all and (min-width: 1280px)
{
	#en_tete_millieu 
	{
		width:58%;
		text-align:center;
	}
	#en_tete_millieu #menu-principal
	{
		font-size: 15px; 
	}
	#en_tete_millieu #menu-principal li
	{
		margin-right:12px;
		margin-left:12px;
	}	
}

/* Haut Millieu */
/* Largeur : >1600 */

@media all and (min-width: 1600px)
{
	#en_tete_millieu #menu_1, #en_tete_millieu #menu-principal
	{
		font-size: 18px; 
	}
	#en_tete_millieu #menu-principal li
	{
		margin-right:22px;
		margin-left:22px;
	}	
}

/************************************************************************************************************************************/
/* En Tete Droite
/************************************************************************************************************************************/

/* En tete droite */
/* Largeur : <362 */

@media all and (max-width: 362px)
{
	
	#en_tete_droite #telephone
	{
		display:none;
	}
}

/* En tete droite */
/* Largeur : >362 */

#en_tete_droite
{
	/* width:110%; */
	width:34%;
	text-align:center;
	margin-top: 0px;
	padding:0px;
}

#en_tete_droite img
{
	margin:0px;
	padding:0px;
	width: 25px;
	margin-right:10%;
}

#menu-droite-1024
{
	display:none;
}

/* Menu Mobile */
#menu-droite-0 ul
{
	list-style-type:none;
	color:black;
	margin:0;
	padding:0;
}

#menu-droite-0 ul li
{
	display:inline;
	margin:0;
	padding:0;
}

#menu-droite-0 ul ul li
{
	margin:0px;
	padding:0px;
	display:block;
	text-align:center;
	margin:auto;
	padding-top:10px;
	padding-bottom:10px;
	background-color:#bfbfbf;
	color:#2a2323;
	border-bottom:1px solid #2a2323;
	font-family: planer,Calibri, Arial, Sans-Serif; 
	font-size:110%;
	font-weight:bold;
	width:100%;
}

#menu-droite-0 ul ul li a
{
	color:#2a2323;
	width:100%;
	display:block;
}

#menu-droite-0 .liens_langue
{
	background-color:#9d9d9d;
}

#menu-droite-0 .liens_langue a
{
	font-style: italic;
	display:inline;
}

#menu-droite-0 .liens_dispo a
{
	display:inline;
}

#menu-droite-0 ul ul .ski_by_mg
{
	font-style: italic;
	background-color:#a7a7a7;
}

#menu-droite-0 ul li ul
{
	padding:0px;
	display:none;
	position:absolute;
	left:0;
	top:50px;
	padding-top:33px;
	width:100%;
	z-index:20;
}

#menu-droite-0 li:hover ul.niveau_2
{
	display:block;
}


/* En tete droite */
/* Largeur : >1024 */

@media all and (min-width: 1024px)
{
	#en_tete_droite
	{
		width:15%;
	}
	#menu-droite-0
	{
		display:none;
	}
	#menu-droite-1024
	{
		display:block;
	}
	#menu-droite-1024 #langue
	{
		width:100%;
		font-size: 13px; 
		font-family: font-family: planer,calibri,arial, sans-serif; 
		margin-bottom:30px;
		text-align:right;
	}
	#menu-droite-1024 #langue #langue-ligne
	{
		padding-right:20px;
	}
	#menu-droite-1024 #ski
	{
	}
}

/* En tete droite */
/* Largeur : >1200 */

@media all and (min-width: 1200px)
{
	#en_tete_droite
	{
		width:23%;
	}
	#menu-droite-1024 #langue
	{
		font-size: 18px; 
	}
}

/* Haut Millieu */
/* Largeur : >1280 */

@media all and (min-width: 1280px)
{
	#en_tete_droite
	{
		width:21%;
	}
	#menu-droite-1024 #langue
	{
		font-size: 15px; 
	}
}

@media all and (min-width: 1600px)
{
	#menu-droite-1024 #langue
	{
		font-size: 18px; 
	}
}

#langue-ligne a
{
	margin:2px;
}

/************************************************************************************************************************************/
/* Corp Millieu
/************************************************************************************************************************************/

#corp-millieu
{
	width:100%; 
	background-color:#dbdbdb;
	color:black; 
	margin:0;
	padding-top:0;
	font-family: planer,Calibri, Arial, Sans-Serif; 
}
#corp-millieu a
{
	color:black;
}

#corp-millieu a:hover
{
	color:grey;
}

#corp-millieu h2
{
	width:80%;
	max-width:900px;
	padding:auto;
	padding-top:40px; 
	padding-bottom:15px; 
	margin:auto;
	text-align:center;
	font-size:18px;
}

#contenu_1
{
	margin:auto;
	text-align:left; 
	width:80%;
	max-width:900px;
}

/************************************************************************************************************************************/
/* Footer
/************************************************************************************************************************************/

footer
{
	margin:auto;
	text-align:center; 
	width:80%;
	max-width:900px;
	min-height:70px;
	margin-top:20px;
}