@font-face {
    font-family: 'jenna_sueregular';
    src: url('../font/JennaSue-webfont.eot');
    src: url('../font/JennaSue-webfont.eot?#iefix') format('embedded-opentype'),
url('../font/JennaSue-webfont.woff2') format('woff2'),
url('../font/JennaSue-webfont.woff') format('woff'),
url('../font/JennaSue-webfont.ttf') format('truetype'),
url('../font/JennaSue-webfont.svg#jenna_sueregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'webfontregular';
    src: url('../font/Avenir Next Condensed-webfont.eot');
    src: url('../font/Avenir Next Condensed-webfont.eot?#iefix') format('embedded-opentype'),
url('../font/Avenir Next Condensed-webfont.woff2') format('woff2'),
url('../font/Avenir Next Condensed-webfont.woff') format('woff'),
url('../font/Avenir Next Condensed-webfont.ttf') format('truetype'),
url('../font/Avenir Next Condensed-webfont.svg#webfontregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@media (max-width: 640px) {
    * {
        -webkit-box-sizing: border-box;
           -moz-box-sizing: border-box;
                box-sizing: border-box;
    }
    
    /* passer body (et tous les éléments de largeur fixe) en largeur automatique */

    body {
        width: auto;
        margin: 0;
        padding: 0;
    }
    
    /* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

    img,
    table,
    td,
    blockquote,
    code,
    pre,
    textarea,
    input,
    iframe,
    object,
    embed,
    video {
        max-width: 100%;
    }
    
    /* conserver le ratio des images */

    img {
        height: auto;
    }
    
    /* gestion des mots longs */

    textarea,
    table,
    td,
    th,
    code,
    pre,
    samp {
        -webkit-hyphens: auto; /* césure propre */
        -moz-hyphens: auto;
        hyphens: auto;
        word-wrap: break-word; /* passage à la ligne forcé */
    }
    
    code,
    pre,
    samp {
        white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
    }
    
    /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */

    element1,
    element2 {
        float: none;
        width: auto;
    }
    
    /* masquer les éléments superflus */

    .hide_mobile {
        display: none !important;
    }
    
    /* Un message personnalisé */

    body:before {
        content: "Version mobile du site";
        display: block;
        text-align: center;
        font-style: italic;
        color: #777;
    }
}
* {
	margin: 0;
	padding:0;
}

#all {
	width: 100%;
}
/* section 1 */
#un {
	height: 600px;
	width: 100%;
}

#titre {
	font-family: "jenna_sueregular";
	font-size: 68px;
	padding-top: 10px;
	padding-left: 20px;
	float: left;
}
#titre .titreorange
{
	color: #F60;	
}
#titre .titrenoir
{
	color: #000;
}

#compte
{
	float: right;
	font-variant: small-caps;
	font-size: 30px;
	padding-top: 5px;
	padding-right: 5px;
	font-style: normal;
	font-family: AvenirNextCondensed-DemiBold;
	color: #FFFFFF;
	background-color: #F60;
	/* [disabled]width: 0px; */
	height: 30px;
	line-height: 30px;
	padding-left: 5px;
	padding-bottom: 4px;
	margin-right: 75px;
	margin-top: 30px;
}
#delimitation
{
	clear: both;
	border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.5), rgba(0,0,0,0.75)); 
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.5), rgba(0,0,0,0.75)); 
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.5), rgba(0,0,0,0.75)); 
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.5), rgba(0,0,0,0.75)); 
}
#cours
{
	float: left;
	font-family: AvenirNextCondensed-DemiBold;
	text-align: center;
	width: 50%;
	padding-left: 50px;
	padding-top: 170px;
	color: #434343;
	height: 250px;
	vertical-align: middle;
	
	font-size: 36px;
	font-size: 2.7vw;
}
#image_orange
{
	padding-top: 80px;
	float: right;
	height: 350px;
	width: 40%;
	background-image: url(../images/oragne_un.png);
	background-repeat: no-repeat;
	background-position: 0px 50px;
	font-family: "jenna_sueregular";
	font-size: 60px;
	line-height: 600px;
	color:rgba(33,33,33,1.00);
}

#image_orange p{
	text-indent: 170px;
}
#menu{
	clear:both;
}
/* Fin de la section 1 */

#deux {
	background-image: url(../images/fondnoirleger.jpg);
	background-repeat: repeat-y;
	background-position: 0px 0px;
	background-attachment: fixed;
	height: 500px;
	position: relative;
}
#deux #photo
{
	float: left;
	text-align: center;
	position: absolute;
	left: 15%;
	bottom: 0px;
}
#deux #texte
{
	float: right;
	font-family: ACItalic;
	font-size: 35px;
	text-align: right;
	color: #FFFFFF;
	position: absolute;
	font-weight: bolder;
	bottom: 50px;
	right: 10%;
}
#deux #texte .small
{
	font-size: 30px;
	color: #E5E5E5;
	line-height: 35px;
	padding-top: 10px;
}

#trois {
	background-color: #FFF;
	width: 100%;
	height: auto;
}
#trois #texte
{
	font-family: webfontregular;
	font-weight: bold;
	color: #F60;
	position: relative;
	top: 0px;
	width: auto;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	padding-top: 40px;
	padding-right: 0;
	padding-bottom: 20px;
	padding-left: 0;
	text-align: center;
}
#trois #texte .gros
{
	font-size: 33px;
}
#trois #texte .petit
{
	font-size: 22px;
}
#trois #texte .lien
{
	font-size: 22px;
	text-align: right;
	padding-right: 150px;
}
#trois #texte a
{
	color: #F1975E;
	text-decoration: none;
}

#trois #sp
{
	position:absolute;
	top:20px;
	right:20px;
	
}

#trois #CollapsiblePanel1 #showhide .explain
{
	width: 100%;
	font-size: 20px;
	font-weight: 400;
	text-align: center;
	margin-right: 0%;
	margin-left: 0%;
	color: #000;
	padding-bottom: 30px;
	font-family: AvenirNextCondensed-DemiBold;
}
#trois #CollapsiblePanel1 #showhide .explain .titreorange
{
	font-family: "jenna_sueregular";
	font-size: 30px;
	color:#F60;
}
#trois #CollapsiblePanel1 #showhide .explain .titrenoir
{
	font-family: "jenna_sueregular";
	font-size: 30px;
	color:#000;
}

#trois #CollapsiblePanel1 #showhide .gros
{
	font-family: webfontregular;
	font-weight: bold;
	text-align: center;
	color: #F60;
	font-size: 33px;
}
#trois #CollapsiblePanel1 #showhide #cadre_gauche
{
	font-family: webfontregular;
	font-weight: 300;
	color: #FFF;
	text-align: left;
	float: left;
	width: 300px;
	height: 260px;
	background-color: #999;
	font-size: 20px;
	margin-left: 20%;
	padding-top: 15px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 30px;
}
#trois #CollapsiblePanel1 #showhide #cadre_gauche .titre
{
	color: #FEA347;
	text-align: center;
	font-weight: 400;
	font-size: 22px;
}
#trois #CollapsiblePanel1 #showhide #cadre_droit
{
	font-family: webfontregular;
	font-weight: 300;
	color: #FFF;
	text-align: left;
	float: right;
	width: 300px;
	height: 260px;
	background-color: #F3A244;
	font-size: 20px;
	margin-right: 20%;
	padding-top: 15px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 30px;
}
#trois #CollapsiblePanel1 #showhide #cadre_droit .titre
{
	color:#999;
	text-align: center;
	font-weight: 400;
	font-size: 22px;
}


#trois #CollapsiblePanel1 #showhide #attestation
{
	width: 100%;
	clear: both;
	font-family: AvenirNextCondensed-DemiBold;
	font-size: 20px;
	text-align: center;
	padding-top: 50px;
	margin-right: 0%;
	margin-left: 0%;
	color: #000;
}
#trois #CollapsiblePanel1 #showhide #information {
	padding-right: 20%;
	padding-left: 20%;
	padding-top: 30px;
	padding-bottom: 30px;	
}
#trois #CollapsiblePanel1 #showhide #information .titre{
	font-family: AvenirNextCondensed-DemiBold;
	text-align: center;
	font-size: 22px;
	padding-bottom: 10px;
	color: #F60;
}
#trois #CollapsiblePanel1 #showhide #information #corps{
	font-family: webfontregular;
	color: #FFF;
	font-size: 18px;
	background-color: #F3A244;
	padding-top: 20px;
}
#trois #CollapsiblePanel1 #showhide #information #corps li{
	list-style-type: disc;
	list-style-position: inside;
	text-indent: 10px;
	font-weight: bolder;
}
#trois #CollapsiblePanel1 #showhide #information #corps .liste{
	padding-bottom: 5px;
	font-size: 16px;
	padding-left: 15px;
	padding-top: 5px;
}
#trois #CollapsiblePanel1 #showhide #information .titrecorps{
	font-family: webfontregular;
	font-weight: bold;
	text-align: center;
	color: #666;
	font-size: 22px;
	padding-bottom: 10px;
}
#trois #CollapsiblePanel1 #showhide #information #cesu{
	font-family: webfontregular;
	padding-bottom: 5px;
	padding-top: 15px;
}
#trois #CollapsiblePanel1 #showhide #close{
	position: absolute;
	right: 10%;
	font-size: 30px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #999999;
}
#trois #CollapsiblePanel1 #showhide #close:hover{
	color:#000;
	cursor:pointer;
}
#trois #CollapsiblePanel1 #showhide #information #cesu .corps{
	padding-bottom: 5px;
	font-size: 16px;
	padding-left: 15px;
	padding-top: 5px;
	color: #000;
}
#trois #CollapsiblePanel1 #showhide #information #cesu .question{
	padding-bottom: 5px;
	font-size: 16px;
	padding-left: 15px;
	padding-top: 5px;
	font-weight: bolder;
}
#trois #CollapsiblePanel1 #showhide #information #cesu li{
	list-style-type: disc;
	list-style-position: inside;
	text-indent: 10px;
	color: #000000;
	font-size: 16px;
}
#quatre
{
	background-color: #FFFFFF;
	width: 100%;
	height: auto;
}
#quatre #cadre_image
{
	width : 100%;
	text-align: center;
	position: relative;
	z-index: 1;
	background-image: url(../images/plancerclelow.png);
	height: 500px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
}
#quatre #cadre_texte
{
	font-family: webfontregular;
	text-align: center;
	position: relative;
	padding-right: 100px;
	padding-left: 100px;
	padding-top: 50px;
	padding-bottom: 50px;
	color: #333333;
}
#quatre #cadre_texte .gros
{
	font-size: 28px;
	line-height: 35px;
}
#quatre #cadre_texte .petit
{
	font-size: 22px;
	line-height: 0px;
}
#quatre img
{
	 -moz-transition: all 0.5s ease-in-out 0s;
    -webkit-transition: all 0.5s ease-in-out 0s;
    -o-transition: all 0.5s ease-in-out 0s;
    -ms-transition: all 0.5s ease-in-out 0s;
    transition: all 0.5s ease-in-out 0s;
	-moz-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    -o-transform: rotate(-5deg) ;
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
    opacity: 0.8;
}

#quatre img:hover
{
	-moz-transform: scale(2.5);
	-webkit-transform: scale(2.5);
	-o-transform: scale(2.5);
	-ms-transform: scale(2.5);
	transform: scale(2.6);
	opacity: 1;
}
#cinq
{
	width: 100%;
}

#cinq #brique
{
	padding-top:50px;
	margin-left: 100px;
	margin-right: 100px;
	text-align: center;
}
#cinq #brique td
{
	width: 33%;
	background-position:center;
	background-repeat: no-repeat;	
	
}
.droitegauche
{
	text-align: center;
	font-family: webfontregular;
	font-weight: 300;
	font-size: 45px;
	color: #FFF;
	background-size: contain;
	vertical-align: middle;
	background-image: url(../images/orange.png);
	height: 200px;
	text-transform: uppercase;
}
.tdcentre
{
	vertical-align:middle;
	background-image:url(../images/centre.png);
}
.textecadre {
	vertical-align: top;
	padding-top: 20px;
	font-family: webfontregular;
	font-weight: 300;
	font-size: 24px;
	color: #666;
}
.succes {
	vertical-align: middle;
	font-family: AvenirNextCondensed-DemiBold;
	font-size: 30px;
	color: #000;
	padding-bottom: 50px;
	padding-top: 30px;
}

#cinq #banniere
{
	margin: 0;
	padding: 0;
	background-image: url(../images/arcachonleger.jpg);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	height: 400px;
}

#cinq #banniere p
{
	padding-top: 40px;
	font-family: webfontregular;
	font-size: 80px;
	font-size: 6vw;
	color: #FFF;
	text-align: center;
}

#six
{
	background-image:url(../images/fondnoirleger.jpg);
	font-family: webfontregular;
	font-weight: 800;
	font-size: 45px;
	color: #FFF;
	text-align: center;
	margin-top:30px;
	padding-top: 20px;
	padding-bottom: 20px;
}
#six .small
{
	font-size: 30px;
}
#sept
{
	background-color: #FFF;
	padding-top: 20px;
	padding-bottom: 20px;
}
#sept .succes {
	vertical-align: middle;
	text-align:center;
	font-family: AvenirNextCondensed-DemiBold;
	font-size: 30px;
	color: #FFF;
	padding-bottom: 30px;
	padding-top: 30px;
}
#sept .erreur {
	vertical-align: middle;
	text-align:center;
	font-family: AvenirNextCondensed-DemiBold;
	font-size: 30px;
	color: #C30;
	padding-bottom: 30px;
	padding-top: 30px;
}
#sept #formulaire
{
	font-family: webfontregular;
	margin-right: 10%;
	margin-left: 10%;
	font-size: 20px;
	color: #666;
}
#sept #formulaire tr
{
	height: 50px;
}
#sept #formulaire td
{
	vertical-align: middle;
	padding-right:15px;
	text-align:right;
}
#sept #formulaire .tdd
{
	text-align:left;
}
#sept #formulaire .tdc
{
	text-align:center;
	padding-top:40px;
}

#sept #formulaire input[type="text"],textarea
{
	background-color: #FFFFFF;
	outline: 0;
	font-family: webfontregular;
	font-size: 18px;
	height: 30px;
	width: 75%;
	color: #666;
	padding: 0px;
	font-size: 20px;
	border-radius: 4px;
	border: 1px solid rgba(243,162,68,0.80);
}
#sept #formulaire input[type="text"]:focus{
	box-shadow: 0 0 3px 1px rgba(243,162,68,0.50);
	-webkit-box-shadow: 0 0 3px 1px gba(243,162,68,0.50);
	-moz-box-shadow: 0 0 5px 2px rgba(243,162,68,0.50);
	-o-box-shadow: 0 0 5px 2px #F3A244;
	-ms-box-shadow: 0 0 5px 2px #F3A244;
	transition: all 0.30s ease-in-out;
	-webkit-transition: all 0.30s ease-in-out;
 	-moz-transition: all 0.30s ease-in-out;
	-o-transition: all 0.30s ease-in-out;
	-ms-transition: all 0.30s ease-in-out;
	border: 1px solid #F3A244;

}
#sept #formulaire textarea:focus{
	box-shadow: 0 0 3px 1px rgba(243,162,68,0.50);
	-webkit-box-shadow: 0 0 3px 1px gba(243,162,68,0.50);
	-moz-box-shadow: 0 0 5px 2px rgba(243,162,68,0.50);
	-o-box-shadow: 0 0 5px 2px #F3A244;
	-ms-box-shadow: 0 0 5px 2px #F3A244;
	transition: all 0.30s ease-in-out;
	-webkit-transition: all 0.30s ease-in-out;
 	-moz-transition: all 0.30s ease-in-out;
	-o-transition: all 0.30s ease-in-out;
	-ms-transition: all 0.30s ease-in-out;
	border: 1px solid #F3A244;

}
#sept #formulaire input[type="checkbox"]{
	background-color: #FFFFFF;
	font-family: webfontregular;
	color: #666;
	margin-left: 30px;
	vertical-align: middle;
}
#sept #formulaire input[type="checkbox"]:checked{
	background:rgba(238,170,105,1.00);
}
#sept #formulaire input[type="submit"]{
	font-family: webfontregular;
	border: 1px solid #F3A244;
	  background: -webkit-linear-gradient(rgba(243,162,68,1.0),rgba(243,162,68,0.5)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgba(243,162,68,1.0),rgba(243,162,68,0.5)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgba(243,162,68,1.0),rgba(243,162,68,0.5)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgba(243,162,68,1.0),rgba(243,162,68,0.5)); /* Standard syntax */
	padding:5px;
	border-radius:5px;
	font-size: 20px;
	color: #FFF;
	margin-left:30px;
}
#sept #formulaire input[type="submit"]:hover{
background: -webkit-linear-gradient(rgba(238,170,105,1.0),rgba(238,170,105,0.3)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgba(238,170,105,1.0),rgba(238,170,105,0.3)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgba(238,170,105,1.0),rgba(238,170,105,0.3)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgba(238,170,105,1.0),rgba(238,170,105,0.3)); /* Standard syntax */
  }
#telephone{
	font-size: 30px;
	padding-top: 20px;
	padding-bottom: 20px;
}
#telephone a{
	text-decoration: none;
	color: #000;
}
#telephone a:hover{
	text-decoration: none;
	color:#666;
}
#telephone tr {
	font-family: AvenirNextCondensed-DemiBold;
}
#telephone td {
	width: 50%;
	text-align: center;
	vertical-align: middle;
}

#escargot  {
	background-color: #000;
	background-image: url(../images/Fibonacci14.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	height: 250px;
	background-size: contain;
}
#charte .titre{
	text-align: center;
	padding-top: 40px;
	font-size: 30px;
	text-transform: uppercase;
	color: #666666;
	font-family: AvenirNextCondensed-DemiBold;
}
#charte .soustitre{
	text-align: center;
	font-size: 20px;
	color: #666666;
	font-family: AvenirNextCondensed-DemiBold;
	padding-bottom:35px;
}
#charte #CollapsiblePanel2 #ensavoirplus {
	height: 30px;
	padding-top: 20px;
}
#charte #CollapsiblePanel2 #showhide .cadregauche {
	font-family: webfontregular;
	color: #FFF;
	text-align: left;
	width: 45%;
	list-style-position: outside;
	font-size: 18px;
	margin-left: 20%;
	padding-left: 30px;
	padding-right: 20px;
	vertical-align: top;
	padding-top: 20px;
	padding-bottom:20px;
	margin-bottom: 20px;
}
#charte #CollapsiblePanel2 #showhide{
	position:relative;
}
#charte #CollapsiblePanel2 #showhide #close1{
	position: absolute;
	right: 10%;
	font-size: 30px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #999999;
	top: -10px;
}
#charte #CollapsiblePanel2 #showhide #close1:hover{
color:#000;
	cursor:pointer;
}
#charte #CollapsiblePanel2 #showhide li {
	padding-bottom:5px;
}
#charte #CollapsiblePanel2 #showhide .gris {
	background-color: #999;
}
#charte #CollapsiblePanel2 #showhide .orange {
	background-color: #F3A244;
}

#charte #CollapsiblePanel2 #showhide table {
	padding-left:15%;
	padding-right:15%;
}
#charte #CollapsiblePanel2 #showhide .centre {
	width:10%;
}
#charte #CollapsiblePanel2 #showhide .cadregauche h1{
	text-align:center;
	font-size: 20px;
	padding-bottom:10px;
}
#charte #CollapsiblePanel2 #showhide .cadredroit {
	font-family: webfontregular;
	color: #FFF;
	text-align: left;
	width: 45%;
	font-size: 18px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 30px;
	list-style-position: outside;
	vertical-align: top;
}
#charte #CollapsiblePanel2 #showhide .cadredroit h1{
	text-align:center;
	font-size: 20px;
	padding-bottom:10px;
}
#charte #CollapsiblePanel2 #showhide .espace{
	height:30px;
}
#charte #CollapsiblePanel2 #showhide .titreesprit{
	font-family: "jenna_sueregular";
	color: #F60;
	font-size: 28px;
}
#charte #CollapsiblePanel2 #showhide .titreesprit2{
	font-family: "jenna_sueregular";
	color: #FFF;
	font-size: 28px;
}
#charte #CollapsiblePanel2 #showhide .titremaths{
	font-family: "jenna_sueregular";
	font-size: 28px;
	color: #000000;
}
#crayon
{
	background-image: url(../images/stylo%20plumeligne.png);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: right bottom;
	height: 150px;
}
#footer{
	text-align: center;
	font-size: 15px;
	color: #FFF;
	font-family: AvenirNextCondensed-DemiBold;
	background-color: #666666;
}
#footer .esprit
{
	font-family: "jenna_sueregular";
	color: #F60;
	font-size: 24px;
}
#footer .maths
{
	font-family: "jenna_sueregular";
	font-size: 24px;
	color: #000000;
}
.fadeInBlock {
    opacity:0;
}
fieldset{
	background-color: #ffffff;
    border: 2px solid #eeab69;
	padding-top:30px;
	padding-bottom:30px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
legend {
	margin-left:50px;
	padding-left:20px;
	padding-right:20px;
	color:rgba(243,162,68,1.00);
	font-size:25px;
}
@media screen and (max-device-width:981px){
}
