html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend{ margin:0px; padding:0px; }


*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html, body{ height: 100%; position:relative; background: #efefef; }
*{outline:none;}
a img{ border:0px;}
textarea{ resize:none;}
table{ border-collapse:collapse;}
.clearfix, .clear{ clear:both; }
.clearSize{ clear:both; font-size:0px; padding:0px !important;}
.relative{ position:relative;}
.floatRight{ float:right;}
.floatLeft{ float:left;}
.displayNone{ display:none;}
.displayBlock{ display: block;}
.textAlignRight{ text-align:right;}
.textAlignCenter{ text-align: center;}
.textAlignJustify{ text-align:justify;}
.relative{ position: relative;}
.overflowHidden{ overflow:hidden;}
.hidden{ display: none;}
.w100{ width:100%;}

.w1180{position:relative; max-width:1180px; margin:auto; }
.w1280{position:relative; max-width:1280px; margin:auto; }
.w1440{position:relative; max-width:1440px; margin:auto; }

.col1{ width:100%;}
.col2{ width:50%; float:left;}
.col3{ width:33.3%; float:left;}
.col4{ width:25%; float:left;}

.col-2t3{ width:75%; float:left; }
.col-1t3{ width:25%; float:left; }

.col2-m-1{ width:50%; float:left; padding-right:2.5%;}
.col2-m-2{ width:50%; float:left; padding-left:2.5%;}

.col3-m-1{ width:33.33%; float:left; padding-right:2%;}
.col3-m-2{ width:33.33%; float:left; padding-left:1%;  padding-right:1%;}
.col3-m-3{ width:33.33%; float:left; padding-left:2%}

.col4-m-1{ width:25%; float:left; padding-right:2%;}
.col4-m-2,
.col4-m-3{ width:25%; float:left; padding-left:1%;  padding-right:1%;}
.col4-m-4{ width:25%; float:left; padding-left:2%}


.col2-f-1{ width: calc(50% - 25px); float:left; margin-right:50px;}
.col2-f-2{ width: calc(50% - 25px); float:left;}

.col3-f-1,
.col3-f-2{ width:calc(33.33% - 33.33px); float:left; margin-right:50px;}
.col3-f-3{ width:calc(33.33% - 33.33px); float:left; }

.col4-f-1,
.col4-f-2,
.col4-f-3{ width:calc(25% - 37.5px); float:left; margin-right:50px;}
.col4-f-4{ width:calc(25% - 37.5px); float:left;}


.cookiesplease-accept{
    background: #777777;
    border-color: #777777;
    width: 100px;
    margin: auto;
    
}

/***********A CHAGER PAR SITE**********/

@font-face {
	font-family: "Open Sans";
	src: url('../font/OpenSans/993041993-OpenSans-Regular.eot');
	src: url('../font/OpenSans/993041993-OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
	url('../font/OpenSans/993041993-OpenSans-Regular.svg#Open Sans') format('svg'),
	url('../font/OpenSans/993041993-OpenSans-Regular.woff') format('woff'),
	url('../font/OpenSans/993041993-OpenSans-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

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

}


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

}



::selection { background: #fa7a01; color:#ffffff;}
::-moz-selection { background: #fa7a01; color:#ffffff; }

body{
    font-family:  "Open Sans",Arial, Helvetica, sans-serif ;
    font-size: 16px;
    color: #38362e;
}

h1,h1 a{     

    font-family: 'OpenSans-Light';
    font-size: 36px;
    font-weight: normal;
    color: #444444;

    background: url(../images/filet_gris_titre.png) center bottom no-repeat;
    padding-bottom: 15px;
    margin-bottom: 50px;
    text-align: center;

}

h2,h2 a{ font-weight: normal; color: #222222; font-family: "OpenSans-Light"; font-size: 36px;}
h3,h3 a{ font-weight: normal; color: #fa7a01; font-family: "Open Sans"; font-size: 24px; padding-bottom: 35px;}
h4,h4 a{ font-weight: normal; color: #444444; font-family: "OpenSans-Light"; font-size: 24px; }
h5,h5 a{ font-weight: normal;}




.catHostel a,
.catHostel h3,
.catHostel h3 a{ color:#003869;}

.pageOrange a,
.pageOrange h3,
.pageOrange h3 a{ color:#fa7a01;}


.catSelf a,
.catSelf h3,
.catSelf h3 a{ color:#bab300;}


.catMeeting a,
.catMeeting h3,
.catMeeting h3 a{ color:#662063;}



.pageBleu a.enSavoirPlus{ background: #003869;}
.pageOrange a.enSavoirPlus{ background: #fa7a01;}
.pageVerte a.enSavoirPlus{ background: #bab300;}
.pageViolette a.enSavoirPlus{ background: #662063;}

a{text-decoration:none; color: #fa7a01;}


select,
textarea,
input[type=tel],
input[type=text],
input[type=email],
input[type=password],
input[type=email]{
    background: rgba(255,255,255,0.15);
    border-radius:5px;
    font-family: "Open Sans";
    border: 1px solid #ffffff;
    padding: 0px 25px;
    color: #ffffff;
    font-size: 16px;
    height: 50px;
}

textarea:hover,
input[type=tel]:hover,
input[type=text]:hover,
input[type=email]:hover,
input[type=submit]:hover{
    border: 1px solid #d26d39;
	}	

textarea:focus,
input[type=tel]:focus,
input[type=email]:focus,
input[type=text]:focus,
input[type=submit]:focus{
	 border: 1px solid #d26d39;
	}	


input[type=submit],
button{  
    cursor:pointer;
    background: url(../images/picto_valider.png) 75px 12px no-repeat #55b128;
    border-radius: 5px;
    border:1px solid #55b128; 
    width: 100%; 
    height: 50px;
    color: #ffffff;
    font-size: 16px;
    text-align: left;
    padding-left: 110px;
}


input[type=submit]:hover,
button:hover{  
    border:1px solid #55b128; 
}



.input div.error{ display:none;}

.error{ color:red;}
.valide{ color:#55b128; }


textarea.error,
input[type=tel].error,
input[type=email].error,
input[type=text].error,
input[type=submit].error{
    border: 1px solid red !important;
    color:#ffffff;
    }

em{ font-family: 'OpenSans-Italic'; font-style: normal;}
blockquote{
    border-left: 2px solid #dd5e1f;
    padding-left: 15px;
    margin-left: 30px;
    margin-bottom: 20px;
    padding-bottom:8px;
    font-family: 'OpenSans-Italic'; 
    font-style: normal;
    color: #6c6b68;}


blockquote p{ padding-bottom: 0px;}

.container{position:relative}.container-col{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:100%;margin:0}@media (max-width:680px){.container-col{width:100%;margin:0 auto}}.container-col:after{content:"";display:block;clear:both}.container-m-col{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:calc(100% + 50px);margin:-25px}@media (max-width:680px){.container-m-col{width:100%;margin:-25px auto}}.container-m-col:after{content:"";display:block;clear:both}.container .col-1{width:25%;margin:0}@media (max-width:680px){.container .col-1{width:100%;margin:0 auto}}.container .col-m-1{width:calc(25% - 50px);margin:25px}@media (max-width:680px){.container .col-m-1{width:100%;margin:25px auto}}.container .col-2{width:50%;margin:0}@media (max-width:680px){.container .col-2{width:100%;margin:0 auto}}.container .col-m-2{width:calc(50% - 50px);margin:25px}@media (max-width:680px){.container .col-m-2{width:100%;margin:25px auto}}.container .col-3{width:75%;margin:0}@media (max-width:680px){.container .col-3{width:100%;margin:0 auto}}.container .col-m-3{width:calc(75% - 50px);margin:25px}@media (max-width:680px){.container .col-m-3{width:100%;margin:25px auto}}.container .col-4{width:100%;margin:0}@media (max-width:680px){.container .col-4{width:100%;margin:0 auto}}.container .col-m-4{width:calc(100% - 50px);margin:25px}@media (max-width:680px){.container .col-m-4{width:100%;margin:25px auto}}