@charset "iso-8859-1";
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');
/* CSS Document */
body {
	padding:0; margin:5px auto 5px auto;
	text-align:center;
	font-family: "Instrument Sans", sans-serif;
	font-variation-settings: "wdth" 100;
	font-size:1em; color:#010d2f;
	background-color: #fafafa;
	font-style: normal;
	line-height: normal;
	font-weight:400; 
}
/*------------------------------*/
/* Style Containers				*/
/*------------------------------*/
div#header { width:100%; height:auto; text-align:center; padding:0; margin:0; }
div#main { width:90%; height:auto; margin: 0 auto 0 auto; padding:0 2em 0 2em; text-align:center;}
div#footer { width:95%; margin:1em auto 0.5em auto; padding:0.5em; text-align:center; border-top:1px solid #CCC;  background-color:#deceac; color:#6b1605; }
form#formule { width:100%; height:auto; margin:0.5em auto 0.5em auto; padding:0; 
			font-family:'Microsoft Sans Serif'; text-align:left;  background-color:#fcf09c; border:1px solid #CCC; }
form#formule span { margin-left:5px; margin-right:5px; color:#F00; }
div#map {  width:98%; height:380px;  margin:1em auto 0.5em auto; padding:0; border:1px solid #CCC; }
/*------------------------------*/
/* Style Menu Général           */
/*------------------------------*/
div#logo { width:10%; margin:0; padding:0; height:auto; display:inline-block; vertical-align:top;  }
div#menu {  width:80%; margin:2em; padding:0; height:auto; display:inline-block; vertical-align:top; font-weight:500; z-index:100; background-color:#ccc484; }
div#menu ul {margin: 0; padding: 0; list-style:none; }
div#menu li { float:left; min-width:110px; width:11%; position:relative; line-height:3em; margin:0; padding :0;}
div#menu li:hover { background-color:#fbea2e; } 
div#menu li a:hover { color:#dc6637; }
div#menu li.submenu { background: url(design/fleche-white.png) 5% 50% no-repeat; }
div#menu li.submenu:hover { background: url(design/fleche-white.png) 5% 50% no-repeat; background-color:#f2d14c; }
div#menu ul ul { position:absolute; top:3em; left:0; width:99%; border:1px solid #f3e501; display:none; }
div#menu li a { display:block; text-decoration:none; margin:1px; padding:0; color:#6b1605;}
div#menu ul ul li { width:100%; border-bottom:1px solid #f3e501; background-color:#f8e684; }
div#menu ul ul li a { font-weight:700; color:#dc6637;}
div#menu ul ul li a:hover { background-color:#f8e64d; }
div#menu ul.level1 li.submenu:hover ul.level2,
div#menu ul.level2 li.submenu:hover { display:block; }    

/*-----------------------------*/
/* Style Menu Mobile 		   */
/*-----------------------------*/
div#result { color:#F00; margin:0.25em auto 0 auto; text-align:center; }
div#select { width:auto; height:100%; margin:0 auto 0 auto; padding:0; text-align:left; font-weight:400; z-index:100; }
div#smc { font-size:1.15em; padding:0.15em 0 0.15em 0; text-align:center; }
div#smc div { clear:both; border-top:1px solid #CCC; }
div#smc div a { display:block; padding:3px; color:#960d10; text-decoration:none; }
div#smc div a:hover { color:#dc6637;  background-color:#feeb48; }
div#smc div.divsub0 { background: url(design/fleche-black.png) 5% 50% no-repeat; }
div#smc div.divsub0 a:hover {  background: url(design/fleche-black.png) 5% 50% no-repeat; background-color:#eee958; }
div#smc div.divlev1 { color:#960d10; }
div#smc div.divlev1 a { font-weight:700; color:#dc6637; } 
div#menu div.divlev1 a:hover { background-color:#feeb48; }

/*-----------------------------*/
/* Style Box 				   */
/*-----------------------------*/
.w100 { width:99.5%; margin:0; padding:0; height:auto; display:inline-block; vertical-align:top; }
.w80 { width:80%; margin:0; padding:0; height:auto; display:inline-block; vertical-align:top; }
.w60 { width:59.70%; margin:0; padding:0; height:100%; min-height:100%; display:inline-block; vertical-align:top;}
.w50 { width:49.65%; margin:0; padding:0;  height:100%; min-height:100%; display:inline-block; vertical-align:top; }
.w40 { width:39.70%; margin:0; padding:0; height:100%; min-height:100%; display:inline-block; vertical-align:top; }
.w30 { width:31.70%; margin:0; padding:0; height:100%; min-height:100%; display:inline-block; vertical-align:top; }

.mr { width:auto; height:auto; margin:0.5em 1em 0 0.25em; padding:0.5em; text-align:justify;   }
.ml { width:auto; height:auto; margin:0.5em 0.25em 0 1em; padding:0.5em; text-align:justify;  }
.mc { width:auto; height:auto; margin:0.5em;  padding:0.5em; text-align:center;  }

.left {float:left; }
.right {float:right; }

.mlf { width:auto; height:auto; margin:0.5em 1em 0 0; padding:0.5em; padding-left:1em; text-align:justify; }
.mrf { width:auto; height:auto; margin:1em 0 0 0.5em; padding:0.5em; padding-right:1em; text-align:justify; }
.video { width:560px; height:315px; }

/*------------------------------*/
/* Style Titre  				*/
/*------------------------------*/
h1 { margin:0.5em auto 0.5em auto; font-size:2.2em; color:#6b1605; font-weight:bold; }
h2 { margin:0.5em auto 0.5em auto; font-size:1.5em; color:#891906; font-weight:400px; }
h3 { width:350px; margin:1.5em auto 0.5em auto; padding:3px; font-weight:bold; color:#b00f13; background-color:#f8f3d8; border:1px solid #FFCC00;  border-radius:10px;text-align:center; }
h4 { width:250px; margin:0.5em auto 0.5em auto; padding:0.5em; background-color:#f8f368; border:1px solid #862279; border-radius:5px; font-weight:400; font-size:1em;}

/*------------------------------*/
/* Style Images					*/
/*------------------------------*/
.img_mini { width:50%; margin:0.5em auto 0.5em auto; text-align:center;} 
.img_cute { width:65%; margin:0.5em auto 0.5em auto; text-align:center;} 
.img_center { width:85%; margin:0.5em auto 0.5em auto; text-align:center;} 

/*------------------------------*/
/* Style Liens 					*/
/*------------------------------*/
.lien_nav {
	color:#b00f13; font-size:1.15em;
	text-decoration:underline;	
}
.lien_nav:hover {
	color:#b12da0;
}
.lien_foot {
	color:#6b1605;
	text-decoration:none;	
}
.lien_foot:hover {
	color:#941e07;
	text-decoration:underline;	
}
div#menu li.lien_cour {
	background-color: #FFBD59;
}
div#menu li.lien_cour a {
	color:#b12b0e;
}
div#menu li a.lien_cour {
	background-color:#f8f368;
	color:#b12b0e;
}
.lien_stage {
	color:#8b131e; 
	font-weight:700;
	font-size:1.12em;
	text-decoration:underline;	
}
.lien_part {
		font-family:'Comic Sans MS'; font-size:14px;
		color:#66242a; text-decoration:underline;
}
.lien_part:hover {
	text-decoration:underline;	
}
/*------------------------------*/
/* Media queries                */
/*------------------------------*/
@media screen and (max-width: 1700px) {
	div#menu li { min-width:105px; width:10%; }
}
@media screen and (max-width: 1300px) {
	div#logo { width:30%;}
	div#menu { width:98%; margin:0 auto 1em auto;}
	div#main { width:95%; padding:0; }

	.img_mini { width:75%; }
	.img_cute { width:75%; }
	.img_center { width:75%; }
	.video { width:480px; height:286px; }
}
@media screen and (min-width: 1061px) {
  	div#select { display: none; }
   }
@media screen and (max-width: 1060px) {
	div#logo { width:40%;}
	div#menu { width:80%; margin:0; background:none;}
	div#menu ul { display: none; }   
	div#select { display:block; width:80%; margin-bottom:1em; }
	div#mob { width:50%; display: inherit;}	
	div#smc { display: none; }
	.video { width:350px; height:197px;  }
	}
@media screen and (max-width: 900px) {	
	.w30{ width:100%; }
	.w40{ width:100%; }
	.w50 { width:100%; }
	.w60 { width:100%; }
	.w80 { width:100%; }
	.left {float : none; }
	.right {float : none; }

	.ml { margin:0.5em; padding:0.25em; }
	.mr {margin:0.5em ; padding:0.25em; }
	.mc {margin:0.5em;  padding:0.25em; }

	.img_mini { width:95%; }
	.img_cute { width:95%; }
	.img_center { width:95%; }
}
@media screen and (max-width: 650px) {
	div#logo { width:40%;}
	table { width:100%; }
	table tr { display:table; width:100%; }
	table td { display:table-row; height:2em; text-align:center;}
	table th { display: none;}
	.lien_foot { text-decoration:underline; font-size:1.1em;}
}