/*General Demo Style*/ 
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

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

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 15px; padding: 0; margin: 0;}


.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

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

/* Header Style */
.logo_accueil{
    opacity: 0.8;
    width: 120px;
    z-index: 4;
    top: 0;
    position: absolute;
}
@media screen and (max-width: 430px) {
    .logo_accueil{
        width: 70px;
    }
}
.logo{
    width: 120px;
}

#owl-accueil{
    max-width: 1360px;
    margin: auto;
}

.codrops-header {
    margin: 0 auto;
    padding: 3em;
    text-align: center;
}

.codrops-header h1 {
    margin: 0;
    font-weight: 300;
    font-size: 2.625em;
    line-height: 1.3;
}

.codrops-header span {
    display: block;
    padding: 0 0 0.6em 0.1em;
    color: #aca89a;
}

.subtitle{
    font-size:50%;
}

#item_menu_double{
    margin-top: 1em;
}

@media (min-width:32.5em) and (max-width: 49.938em) {
    #item_menu_double{
        margin-top: 0;
    }
    #item_menu_double br{
        display: none;
    }
}

@media (max-width: 32.438em) {
      #item_menu_double{
        margin-top: 0;
    }
        #item_menu_double br{
        display: none;
    }
}


/*Menu dans les pages + test infos pages*/

.column {
    float: left;
    width: 50%;
    padding-left: 8px;
    position: relative;
    text-align: right;
}

.column:nth-child(2) {
	box-shadow: -1px 0 0 rgba(0,0,0,0.1);
	text-align: left;
}

.column p {
	font-weight: 300;
	font-size: 17px;
	padding: 0 0 0.5em;
	margin: 0;
	line-height: 1.5;
        text-align: left;
}

@media screen and (max-width: 46.0625em) {
	.column {
		width: 100%;
		min-width: auto;
		min-height: auto;
		padding: 1em; 
		text-align: center;
		display:block;
	}

	.column:nth-child(2) {
		text-align: center;
		box-shadow: 0 -1px 0 rgba(0,0,0,0.1);
	}
        .texte{
            width: 100% !important;
            padding: 1em !important;
        }
        #body_entreprise .main{
            width: 100% !important;
        }
}

@media screen and (max-width: 25em) {

	.codrops-header {
		font-size: 80%;
	}

	.codrops-top {
		font-size: 120%;
	}

	.codrops-icon span {
		display: none;
	}

}

.btn{
	padding-bottom: 4px;
}

button {
	border: none;
	padding: 0.6em 1.2em;
	color: #fff;
	font-family: 'Lato', Calibri, Arial, sans-serif;
	font-size: 1em;
	letter-spacing: 1px;
	text-transform: uppercase;
	cursor: pointer;
	display: inline-block;
	margin: 3px 2px;
	border-radius: 2px;
	width: 166px;
}

#bt_envoyer{
background: #135CA4;
border: none;
padding: 0.8em 1.2em !important;
color: #fff;
font-family: 'Lato', Calibri, Arial, sans-serif;
font-size: 1em;
letter-spacing: 1px;
text-transform: uppercase;
cursor: pointer;
display: inline-block;
margin: 3px 2px;
border-radius: 2px;
width: 166px !important;
}

#bt_envoyer:hover {
  background: #0B3660;
  text-decoration: none;
}

.info {
	text-align: center;
	font-size: 1.5em;
	margin-top: 3em;
	clear: both;
	padding: 3em 0;
	opacity: 0.7;
	color: #aca89a;
}

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

/*Bouton retour en haut*/

#btn_up{
	position: fixed;
	top: 15px;
	right: 30px;
	cursor: pointer;
	opacity:0.5;
}

#btn_up:hover{
	opacity:1;
}
        
/*----------------------------------------------------------------------------------------------------*/

/*Différentes formes de textes*/
#txt_0{
        font-weight: bold;
        font-size:2em;
        text-align: center;
        margin-top: 10px;
}

#txt_1{
        font-weight: bold;
	font-size:2em;
	text-align: left;
	margin-top: 10px;
}

#txt_2{
	font-size:17px;
	margin-bottom:0px;
	text-align: center;
}

#txt_3{
	text-align: center;
}

#txt_4{
        text-align: center;
}

#txt_5{
	font-weight: bold;
        text-align: center;
}

.indent_1{
    text-indent: 50px;
}

.indent_2{
	font-weight: bold;
	text-align: center;
}


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

/*Accueil Style*/

body, html {
	font-family: 'Lato', Calibri, Arial, sans-serif;

}

body {
	font-family: 'Lato', Calibri, Arial, sans-serif;
	color: #f2f2f2;
	background: #fff;
        font-weight: 300;
        height: 100%;
}

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

.container{
    height: 100%
}

.holder_content{
    max-width: 1360px;
    min-height: 350px;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    padding: 0.9em;    
}

.main,
.container > header {
    width: 100%;
    margin: 0 auto;
}

.main {
    max-width: 82.667em;
    min-height: 19em;
}

#index .main{
    min-height: 16em;
}

@media screen and (max-width: 799px) {
    #index .main{
        min-height: 22em !important;
    }
}
@media (max-width: 519px) {
    .main{
        min-height: 20em !important;
    }
    #body_annonce .main{
        min-height: 0 !important;
    }
}

.container > header {
    overflow: hidden;
    font-size: 16px;
}

#index .owl-carousel .owl-wrapper-outer{
    box-shadow: 0px 5px 7px 0px rgba(0,0,0,0.4);
}

.container > header h1 {
	font-size: 4em;
	line-height: 1.3;
	margin: 0;
	margin-bottom:0.8em;
	font-weight: 300;
}

.container > header span {
	display: block;
	font-size: 60%;
	color: #ceccc6;
	padding: 0 0 0.6em 0.1em;
}

.top-header{
    max-width: 1360px;
    margin: auto;
}

.info_construction{
	text-align:center;
        font-family: Calibri;
	font-size: 1.2em;
        font-weight: bold;
	line-height: 1.3;
        color: #f00;
	margin: 0;
}
.content_lastinfo{
    width: 100%;
    margin-top: 15px;
    overflow: hidden;
    padding: 5px;
}
.contain_news{
    width: 42%;
    background: #fff;
    border: 1px solid #bbb;
    box-shadow: rgba(0,0,0,.4)0 0 5px;
    float: left;
    height: 588px;
    overflow: hidden;
}
.contain_block_corps_news{
    max-height: 545px;
    overflow: auto;
}

.contain_maps{
    width: 42%!important;
}

.contain_chiffrecle{
    width: 57%;
    min-height: 380px;
    margin-left: 1%;
    background: #fff;
    border: 1px solid #bbb;
    box-shadow: rgba(0,0,0,.4)0 0 5px;
    float: left;
}
.titre_news, .titre_chiffrecle{  
    padding: 5px 0 5px 15px;
    background: #135CA4;
}
.titre_news h3, .titre_chiffrecle h3{
    color: #fff;
    font-size: 15px;
    line-height: 0;
}
.link_view{
    width: 130px;
    height: 90px;
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    padding-left: 10px;
    padding-bottom: 10px;
    background: url(../images/news_bg.png) no-repeat 0 10px;
}
.import_img{
    width: 120px;
    height: 80px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.content_corps_news{
/*    background: #d0dfe5;  Old browsers 
    background: -moz-linear-gradient(top, #d0dfe5 0%, #ededed 51%, #ffffff 100%);  FF3.6-15 
    background: -webkit-linear-gradient(top, #d0dfe5 0%,#ededed 51%,#ffffff 100%);  Chrome10-25,Safari5.1-6 
    background: linear-gradient(to bottom, #d0dfe5 0%,#ededed 51%,#ffffff 100%);  W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    border-bottom: 1px dashed #92ACED;
    min-height: 143px;
    /*margin-top: -19px;*/
    padding: 0 15px 0px 15px;
    
}
.content_corps_chiffrecle{
    width: 100%;
/*    margin-top: -19px;
    background: #d0dfe5;  Old browsers 
    background: -moz-linear-gradient(top, #d0dfe5 0%, #ededed 51%, #ffffff 100%);  FF3.6-15 
    background: -webkit-linear-gradient(top, #d0dfe5 0%,#ededed 51%,#ffffff 100%);  Chrome10-25,Safari5.1-6 
    background: linear-gradient(to bottom, #d0dfe5 0%,#ededed 51%,#ffffff 100%);  W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    padding: 0 15px 0px 15px;
}
.content_cartefrance{
    height: 280px;
    float: left;
}
#carte_de_france{
    width: 280px;
    float: left;
    margin-top: 10px;
    margin-right: 25px;
}
#img_evolca{
    width: 370px;
    float: left;
}
.text_chiffrecle{  
    margin-right: 30px;
    display: inline-block;
}
.news_link h4{
    color: #333;
    font-size: 13px;
}
.news_link h4 a{
    color: #6085be;
    font-size: 13px;
}
.news_link h5 a{
    color: #6085be;
    font-size: 11px;
    font-weight: 100;
}

.news_link h4 a:hover, h5 a:hover{
    color: #333;
}
.news_link .date_public{
    text-align: right;
    font-style: italic;
    font-size: 10px;
    color: #333;
}
.text_chiffrecle p{
    color: #6085be;
    font-size: 13px;
}
.text_chiffrecle .clair{
    color: #49a2de;
    font-size: 40px;
    margin-bottom: 0px;
    line-height: 5px;
}
.text_chiffrecle .sombre{
    font-size: 20px;
}

@media screen and (max-width: 1387px) {
    .contain_news{
        height: 588px;
    }
}
@media screen and (max-width: 980px) {
    .contain_news{
        height: 558px;
    }
    .main{
        min-height: 16em;
    }
    .contain_chiffrecle{
        height: auto;
    }
    .text_chiffrecle .clair{
        font-size: 20px;
    }
    .text_chiffrecle .sombre{
        font-size: 15px;
    }
    .link_view{
        float: none;
        padding-top: 5px;
        height: 95px;
    }
/*    .content_corps_news{
        margin-top: -10px;
    }*/
    #carte_de_france{
        float: none;
    }
}
@media screen and (max-width: 780px) {
    .contain_news{
        width: 100%;
        height: 585px;
        max-width: none;
        margin-bottom: 15px;
    }
    .contain_chiffrecle{
        margin-left: 0;
        width: 100%;
        max-width: none;
    }
    #carte_de_france{
        float: left;
    }
    .text_chiffrecle .clair{
    color: #49a2de;
    font-size: 40px;
    margin-bottom: 0px;
    line-height: 5px;
    }
    .text_chiffrecle .sombre{
        font-size: 20px;
    }
}
@media screen and (max-width: 510px) {
    #carte_de_france{
        float: none;
    }
}
/*
@media screen and (max-width: 335px) {
    .content_cartefrance{
        height: 200px;
    }
    #carte_de_france{
        width: 190px;
    }
}
*/
@media only screen and (max-width: 780px) {
  .content_cartefrance{
        height: 690px;
    }

    .content_cartefrance_ifram{
        width: 707px;
    }
}

@media screen and (max-width: 400px) {
    #img_evolca{
        width: 100%;
    }
}

/*@media screen and (max-width: 49.938em){
    .content_lastinfo{
        margin-top: 90px;
    }
}*/
@media screen and (max-width: 32.438em){
    .content_lastinfo{
        margin-top: 0;
    }
}

/*Flash Emploi*/
.contain_flash_emploi{
    margin-top: 30px;
    margin-bottom: 30px;
}

.contain_flash_emploi a{
    color: #5A66DC;
}
.contain_flash_emploi a:hover{
    text-decoration: underline;
}

#index .vticker{
        max-width: 430px;
        margin: auto;
        background: #fff;
        color: #333;
        border: 1px solid #CC0000;
}
#index .vticker ul{
    width: 100%;
    text-align: center;
    padding: 0;
}
#index .vticker li{
    list-style: none;
    padding: 10px 0 10px 105px;
}
#index .et-run{
    background: red;
}
.vticker::before{
    content: "Flash emploi";
    background: #DD0000;
    padding: 10px;
    color: #FFF;
    font-weight: bold;
    position: absolute;
    font-variant: small-caps;
}

/*Page entreprise*/
#body_entreprise{color: #000000; background: #444;}
.btn_entreprise{background: #DD0000;}
.btn_entreprise:hover{background:#7F0C00;}
#btn_entreprise{background-color: #DD0000;}
#btn_entreprise:hover{background-color: #7F0C00;}
#btn_menu_entreprise{background:#AAAAAA;}
#btn_menu_entreprise:hover{background:#7F0C00;}

#body_entreprise #txt_1{
    color: #DD0000;
}

#body_entreprise .texte a:hover {
    color: #ff3333;
}

#body_entreprise .main{
    width: 65%;
}

/*Page Référence*/

#body_references{color: #EAC00A;}
#btn_references{background: #EAC00A;}
#btn_references:hover{background:#C4A008;}
#btn_menu_references{background:#AAAAAA;}
#btn_menu_references:hover{background:#C4A008;}

#body_references .main{
    min-height: 12em;
}
.centrer{
    text-align: center;
}
#body_references .texte {
    width: 100%;
}

#body_references #txt_1{
    text-align: center;
}

.content_ref{
    width: 100%;
    height: 125px;
}
.centrer_ref{
    width: 1235px;
    margin-left: auto;
    margin-right: auto;
    height: 145px;
}
.contain_item_ref{
    cursor: pointer;
    position: relative;
    float: left;
    position: relative;
    overflow: hidden;
    margin-right: 5px;
}
.item_ref{
    position: relative;
    padding: 0;
    line-height: 0;
}
.item_ref h2{
    z-index: 5;
    top: 0px;
    left: 3px;
    position: absolute;
    transition-duration: 2s;
    transition-property: left;
}
.item_ref h2 a:hover{
    color: #333;
}
.item_ref p{
    margin: 0;
}
.img_item_ref{
    width: 242px;
    height: 125px;
}
.filigrane{
    z-index: 2;
    top: 0;
    left: 0;
    position: absolute;
    transition-duration: 2s;
    transition-property: left;
}
.contain_item_ref:hover .filigrane{
    left: -100%;
}
.contain_item_ref:hover .item_ref h2{
    left: -100%;
}

.img_construction{
    width: 230px;
}

@media screen and (max-width: 1300px) {
    .content_ref, .centrer_ref{
        height: 105px;
    }
    .centrer_ref{
        width: 1025px;
    }
    .img_item_ref{
        width: 200px;
        height: 105px;
    }
    .item_ref h2 a{
        font-size: 18px;
    }
    .content_ref .filigrane{
        width: 160px;
    }
}
@media screen and (max-width: 1100px) {
    .content_ref{
        width: 100%;
        height: 545px;
    }
    .centrer_ref{
        width: 300px;
        height: 545px;
    }
    .content_ref .filigrane{
        width: 245px;
    }
    .contain_item_ref{
        float: none;
        margin-right: 0;
        margin-bottom: 5px;
    }
    .item_ref h2 a{
        font-size: 15px;
    }
    .img_item_ref{
        width: 100%;
        height: 105px;
    }
}
@media screen and (max-width: 375px){
    .centrer_ref{
        width: 225px;
    }
    .content_ref .filigrane{
        width: 185px;
    }
}

/*Slider Show*/
#owl-genieclim .item img, #owl-piscine .item img, #owl-gtc .item img, #owl-couverture .item img{
    display: block;
    width: 100%;
    height: auto;
    max-width: 1200px;
    padding: 15px;
    margin: auto;
    margin-top: 15px;
}
#owl-accueil .item img{
    display: block;
    width: 100%;
    min-height: 160px;
    margin: auto;   
}

/*Page métier*/

#body_metiers{color: #84C30E;}
#btn_metiers{background: #84C30E;}
#btn_metiers:hover{background:#6FA30C;}
#btn_menu_metiers{background:#AAAAAA;}
#btn_menu_metiers:hover{background:#6FA30C;}

/*#txt_proposeauth{
    font-size: 15px;
    color: red;
    margin-bottom: 20px;
    margin-top: 0;
}*/

/*.content_auth_module{
    margin: auto;
    max-width: 310px;
    min-width: 230px;
    text-align: center;
    border: 1px solid #a6a6a6;
    padding: 15px;
}*/
/*.content_auth_module .login, .content_auth_module .mdp{
    margin-bottom: 10px;
}*/
/*.bt_connexion{
background: #135CA4;
border: none;
padding: 0em 1.2em;
color: #fff;
font-family: 'Lato', Calibri, Arial, sans-serif;
font-size: 1em;
letter-spacing: 1px;
text-transform: uppercase;
cursor: pointer;
display: inline-block;
margin: 3px 2px;
border-radius: 2px;
width: 166px;
}*/
/*.bt_connexion:hover {
  background: #0B3660;
  text-decoration: none;
}*/

/*#form_calcul_chlore_actif, #form_rapport_intervention{
    color : black;
}*/

/*#form_calcul_chlore_actif input, #form_rapport_intervention input{
    line-height: 2;
}*/
/*@media screen and (max-width: 535px){
    #form_calcul_chlore_actif{
        width: 205px;
    }
}*/

/*#form_calcul_chlore_actif .champ_calcul{
    width: 70px;
}*/

/*.centrer_application{
    width: 495px;
    margin-left: auto;
    margin-right: auto;
    height: 145px;
}*/
/*.contain_item_application{
    cursor: pointer;
    position: relative;
    float: left;
    position: relative;
    overflow: hidden;
    margin-right: 5px;
}*/
/*.item_application{
    position: relative;
    padding: 0;
    line-height: 0;
}*/
/*.item_application h2{
    z-index: 5;
    top: 0px;
    left: 3px;
    position: absolute;
    transition-duration: 2s;
    transition-property: left;
}*/
/*.item_application h2 a:hover{
    color: #333;
}*/
/*.item_application p{
    margin: 0;
}*/
/*.img_item_application{
    width: 242px;
    height: 125px;
}*/
/*.contain_item_application:hover .filigrane{
    left: -100%;
}*/
/*.contain_item_application:hover .item_application h2{
    left: -100%;
}*/
/*#container_applications{
    max-width: 490px;
    margin: auto;
}*/
/*.form_deconnexion{
    width: 225px;
    margin: auto;
    text-align: center;    
}*/
/*#bt_deconnexion{
    background: #e53935;
    border: 2px solid #e53935;
    padding: 4px;
    color: #fff;
}*/
/*#bt_deconnexion:hover{
    background: #fff;
    border: 2px solid #e53935;
    color: #e53935;
}*/
/*.bt_soumettre{    
    padding: 6px 10px 6px 10px;
    font: bold 13px Arial;
    background: #4787ed;
    color: #fff;
    border-radius: 2px;
    border: none;
    cursor: pointer;
}*/
/*.bt_soumettre:hover{
    background: #0F5FE8;
}*/
/*.bt_annuler{
        padding: 6px 0 6px 0;
    font: Bold 13px Arial;
    background: #d34836;
    color: #fff;
    width: 90px;
    border-radius: 2px;
    border: none;
    cursor: pointer;
}*/
/*.bt_annuler:hover{
    background: #FF1515;
}*/
/*@media screen and (max-width: 560px){
    .centrer_application{
        width: 225px;
        height: 215px;
    }
    .contain_item_application{
        float: none;
        margin-right: 0;
        margin-bottom: 5px;
    }    
    .img_item_application{
        width: 100%;
        height: 105px;
    }
    .item_application h2{
        font-size: 15px;
    }
}*/


/*Page presse*/
#body_presse{color: #05AAAA;}
#btn_presse{background: #05AAAA;}
#btn_presse:hover{background:#036B6B;}
#btn_menu_presse{background:#AAAAAA;}
#btn_menu_presse:hover{background:#036B6B;}
#body_presse .main{
    min-height: 180px;
}
#body_presse .texte a:hover {
    color: #05AAAA;
}

.texte #interview_iframe{
    width: 100%;
    height: 100%;
    min-height: 230px;
    max-width: 410px;
}


/*Page contact*/

#body_contact{color: #135CA4;}
#btn_contact{background: #135CA4;}
#btn_contact:hover{background:#0B3660;}
#btn_menu_contact{background:#AAAAAA;}
#btn_menu_contact:hover{background:#0B3660;}

#contact, #recrutement{
    /*width: 600px;*/
    margin: auto;
}

#body_recrutement .inputbox{
    background: none;
    box-shadow: none;
    border: none;
    padding-left: 0;
    height: auto;
}
#body_recrutement .anneenaissance, #annee-exp{
    width: 115px !important;
}

#body_contact .texte{
    width: 100%;
    padding: 2em;
    overflow: hidden;
    max-width: 1050px;
}
#body_contact #txt_3{
    text-align: left;
    overflow: hidden;
}

#loca_iframe{
    border: 7px solid #b3b3b3;
    width: 100%;
    max-width: 430px;
    min-width: 260px;
    height: 400px;
    margin-bottom: 30px;
    margin-right: 95px;
    float: left;
}

.block_localisation{
    float: left;
    min-height: 200px;
    /*margin-bottom: 40px;*/
    width: 50%;
}

#contact input, #recrutement input{
    padding: 0 20px;
    width: 90%;
    height: 40px;
    outline: none;
}
#block_horaire{
    max-width: 335px;
    margin: auto;
    /*min-width: 415px;*/
}
#tableau_horaire tr td p{
    text-align: inherit;
}
#tableau_horaire tr{
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #a6a6a6;
}
#tableau_horaire #item_jour{
    width: 120px;
}
/*#tableau_horaire #item_heure{
    width: 220px;
}*/
.btn_map{
    background: #135CA4;
    border: none;
    padding: 0px 10px;
    color: #fff !important;
    font-family: 'Lato', Calibri, Arial, sans-serif;
    font-size: 15px;
    font-weight: 100 !important;
    letter-spacing: 1px;
    cursor: pointer;
    display: inline-block;
    margin: 3px 2px;
    border-radius: 2px;
    width: 110px;
}

.btn_map:hover{
    background-color: #0B3660; 
}

input{
    padding: 0 20px;    
    font-size: 16px;
    color: #393f49;
    background-color: #fff;
    border: 1px solid #cccccc;
    outline: none;
    border-radius: 3px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
}
input:active, input:hover, input:focus{
    border-color: #66afe9;
}
input:focus{
    background-color: #d7e8fc;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}

textArea{
    font: 17px "Calibri", sans-serif;
    padding: 0 20px;
    width: 95%;
    height: 90px;
    color: #393f49;
    background-color: #fafafa;
    border: 1px solid #cccccc;
    outline: none;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.2); 
}
textArea:hover, :active, :focus{
    border-color: #66afe9
}
.liste_deroulante{
    padding: 7px;
    min-width: 162px;
}
	
.msg_erreur{
	color:red;
}
#body_contact #txt_1{
    text-align: center;
}

#body_contact #txt_2 a, #txt_3 a{
    font-weight: bold;
    color: #135CA4;
}

#body_contact #txt_4, #body_recrutement #txt_4, #body_presse #txt_4, #body_references #txt_4{
    font-weight: bold;
    font-size:2em;
    text-align: center;
}

.texte_champs_obligatoire{
     margin-left:10px; 
     font-size: 1em; 
     color:red;
     text-align: center !important;
}
.col-s1{
    width: 50%;    
    float: left;
    margin-bottom: 15px;
}
.col-s2{
    width: 100%;
    margin-bottom: 15px;
}
@media screen and (max-width: 1033px){
    #loca_iframe {        
        margin-right: 20px;
    }
}
@media screen and (max-width: 940px){
    #loca_iframe {
        float: none;
        margin: auto;
        display: block;
        margin-bottom: 40px;
    }
    #body_contact #txt_3 {
        text-align: center;
        margin: auto;
        max-width: 550px;
    }
}
@media screen and (max-width: 415px){
    .block_localisation{
        min-height: 0;
        margin-bottom: 0px !important;
        width: 100%;
    }
    #body_contact #txt_3{
        height: auto;
    }
}
@media screen and (max-width: 625px){
    #contact{
        width: 100%;
    }
    #contact input, #recrutement input{
        font-size: 12px;
    }
    .liste_deroulante{
        font-size: 14px;
    }
}

/*@media screen and (max-width: 970px){
    #body_contact .texte {
        width: 1050px;
    }
    #loca_iframe {
        float: none;
        margin: auto;
        display: block;
        margin-bottom: 40px;
    }
    #body_contact #txt_3 {
        text-align: center;        
    }
    .block_localisation{
        width: 270px;
    }*/
/*}*/

/*@media screen and (max-width: 538px){
    #contact, #recrutement{
        width: 245px;
    }
    .col-s1{
        width: 100%;
        float: none;
    }    
    .col-s1 input, .col-s2 input{        
        width: 100%;
    }
    textArea{
        width: 100%;
    }
}*/

/*Page recrutement*/

#body_recrutement{color: #000000; background: #444;}
.btn_recrutement{background: #ED7F10;}
.btn_recrutement:hover{background:#CB6000;}
#btn_menu_recrutement{background:#AAAAAA;}
#btn_menu_recrutement:hover{background:#CB6000;}

#body_recrutement table a{
    text-decoration: underline;
    color: #5A66DC;
}
#body_recrutement table a:hover{
    text-decoration: none;
}

.msg_erreur{
	color:red;
}

#body_recrutement #txt_2 a, #txt_3 a{
    font-weight: bold;
    color: #135CA4;
}

#body_recrutement #txt_4{
    font-weight: bold;
    font-size:2em;
    color: #ED7F10;
}
#body_recrutement #txt_1{
    color: #ED7F10;
}

.texte_champs_obligatoire{
     margin-left:10px; 
     font-size: 1em !important; 
     color:red;
}
.col-s3{
    width: 100%;
    margin-bottom: 15px;
}
.col-s3 input{
   width: 155px; 
}
.col-s4{
    width: 100%;
    margin-bottom: 15px;
}
.col-s4 input{
    margin-top: 15px;
    height: 13px;
    width: 13px;
    border-collapse: collapse;
}
.col-s4 .input_radio{
    width: auto !important;
    height: auto !important;
    
}
.col-s5{
    margin-bottom: 15px;
}
.col-s5 input{
    background: none;
    padding: 0;
    box-shadow: none;
    width: 300px;
}

#body_recrutement table p{
    text-align: left;
}
#body_recrutement td{
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #a6a6a6;
    margin: 5px;    
    line-height: 22px;
}

/* Page des annonces */
#body_annonce{color: #000000; background: #444;}
.btn_annonce{background: #595959;}
.btn_annonce:hover{background:#333;}
#btn_menu_annonce{background:#AAAAAA;}
#btn_menu_annonce:hover{background:#CB6000;}

#body_annonce .main{
    min-height: 110px;
    max-width: none;
    width: 70%;
    padding: 2em;
}
#body_annonce .column{
    text-align: left;
    padding-left: 0;
}
#body_annonce #txt_1{
    font-weight: 100;
}
#body_annonce #txt_4{
    font-weight: bold;
    font-size: 18px;
    border-left-width: 10px;
    border-left-style: solid;
    border-left-color: #333;
    padding-left: 5px;
}
#body_annonce #annonce{
    width: 70%;
    margin: auto;
    padding-left: 2em;
    padding-bottom: 50px;
}

#body_annonce .st-content{
    background: #333;
}
#body_annonce .st-content-inner{
    max-width: 970px;
    background: #fff;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 40px;
}
#body_annonce .texte{
    padding: 1em 0em 0em 2em;
}
@media screen and (max-width: 970px){
    #body_annonce .st-content-inner{
        margin-top: 0;
        margin-bottom: 0;
    }
}
@media screen and (max-width: 46.0625em){
    #body_annonce .main, #body_annonce #annonce{
        width : 100%;
        padding-left: 1em;
    }
    #body_annonce header{
        margin: 0;
        width: 210px;
    }
}

/* Footer Style */

.content-footer{
    background: #292c2f;
    /*width: 100%;*/
    /*border-top: 3px solid #e3e3e3;*/
    /*position: absolute;*/
    max-width: 1360px;
    overflow: hidden;
    margin: auto;
    /*position: relative;*/
    box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.4);
}
/*#index .content-footer{
    max-width: 1360px;
    overflow: hidden;
    margin: auto;
    position: relative;    
}*/
.footer {
	margin-top: 20px;
        margin-left: 20px;
        margin-bottom: 20px;
	float: left;
        padding: 0px 20px;
        display: block;
        width: 280px;
}

.nav-footer {
    float: right;
    text-align: left;
    margin-right: 10px;
}

.bt_footer{
    background: #1c1c1c;
    color: #ccc;
    font-size: 1.5em;
    margin: 0 0 .5em 0;
    text-align: left;
    text-transform: none;
    display: block;
    padding: .25em 5%;
    transition: background 1s ease;
}
.bt_footer:hover{
    background: #c00;
    color: white;
    transition: background 250ms ease;
}

.nav-footer-section-loca, .nav-footer-section-tel{
    margin-top: 20px;
}

.nav-footer .nav-footer-section-info a, .nav-footer .nav-footer-section-tel p, .nav-footer-section-loca p{
    font-weight: bold;
    color: #ccc;
}

.nav-footer-section-loca p{
    line-height: 5px;
}

.content_icon_footer{
    background-color: #33383b;
    border-radius: 50%;
    float: left;
    margin: 10px;
    width: 4em;
    height: 4em;
    text-align: center;
}
.icon_footer{
    font-size: 40px;
    color: #ffffff;
    line-height: 60px!important;
}

.tel_footer{
    margin-top: 30px;
    display: inline-block;
}

#icon_twitter, #icon_facebook, #icon_google_plus{
    width: 30px;
}
#icon_facebook, #icon_twitter{
    margin-right: 10px;
}
#icon_twitter:hover, #icon_facebook:hover, #icon_google_plus:hover{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

@media screen and (max-width: 800px) {
    .content-footer .nav-footer{
        float: left;
        text-align: left;
        margin-left: 30px;
    }
    .footer{
        width: 96%;
        padding: 5px;
        margin: 10px;
    }
    .bt_footer{
        text-align: center;
    }
}

/* Page valide email */

.banvalidemail{
    background-color: #0066FF;
    margin: 10px;
}
.titrevalidemail{
    font-family: 'Roboto','Helvetica Neue',Helvetica,sans-serif;
    font-weight: bold;
    font-size: 4em;
    color: white;
    margin: 0;
    letter-spacing: -4px;
    text-align: center;
    padding: 50px;
}

.content-textemail{
    margin-top: 30px;
    margin-bottom: 30px;
    margin-right: 10px;
    padding-left: 150px;
    padding-right: 150px;
    }

    .imagemail{
        float: left;
        margin-left: 10px;
    }
    .textemail{
        color: black;
        text-align: justify;
        padding-top: 65px;
    }

    #bt_retouraccueil{
        font-family: 'Roboto','Helvetica Neue',Helvetica,sans-serif;
    }
    
@media screen and (max-width: 835px) {
    .content-textemail{
        padding-left: 0;
        padding-right: 0;
    }
    
    .titrevalidemail{
        font-size: 3em;
        letter-spacing: -3px;
    }
    
    .textemail{
        color: black;
        text-align: justify;
        padding-top: 65px;
    }
}

@media screen and (max-width: 375px) {
    .titrevalidemail{
        padding: 0;
        font-size: 2em;
        letter-spacing: -2px;
    }
    
    .imagemail{
        width: 50px;
    }
        .content-textemail{
        padding-left: 10px;
        padding-right: 10px;
    }
}

/*Gestion du zoom sur image
#img_tableau_entreprise {
    width: 300px;
    height: 450px;
    cursor: pointer;
    transition: 0.3s;
    display: block;
    margin: 20px 0 30px 0;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
}

#img_tableau_entreprise:hover {
    opacity: 0.7;
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

 The Modal (background) 
.modal {
    display: none;  Hidden by default 
    position: fixed;  Stay in place 
    z-index: 1;  Sit on top 
    padding-top: 100px;  Location of the box 
    left: 0;
    top: 0;
    width: 100%;  Full width 
    height: 100%;  Full height 
    overflow: auto;  Enable scroll if needed 
    background-color: rgb(0,0,0);  Fallback color 
    background-color: rgba(0,0,0,0.9);  Black w/ opacity 
}

 Modal Content (image) 
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 800px;
}

 Caption of Modal Image 
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

 Add Animation 
.modal-content, #caption {    
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}

@keyframes zoom {
    from {transform: scale(0.1)} 
    to {transform: scale(1)}
}

 The Close Button 
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

 100% Image Width on Smaller Screens 
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}*/

/*.nav-footer .nav-footer-section-tel p{
    font-weight: bold;
}*/

/*.nav-footer-section-info{
    width: 65%;
    position: relative;
}*/



/*.footer .nav-footer{
    width: 25%;
    position: relative;
    float: left;
}

.footer .nav-footer .nav-footer-section .nav-footer-section-label{
        font-family: "Myriad Set Pro","Helvetica Neue","Helvetica","Arial",sans-serif;
        font-size: 0.65em;
        color: black;
        font-weight: bold;
}

.footer .nav-footer .nav-footer-section .nav-footer-section-list{
    list-style-type: none;
    font-size: 0.8em;
    text-align: left;
    padding: 0px;
}

.footer .nav-footer .nav-footer-section .nav-footer-section-item{
    padding: 1px 0px;
}

.footer-legal{
    font-size:0.8em;
    color: #000;
    position: absolute;
    padding: 0px 20px;
}

.item-legal-copyright{
    float: left;
    border-right: 1px solid #d6d6d6;
    padding-right: 10px;
}

.item-legal-plansite{
    float: left;
    margin-left: 10px;
}

@media screen and (max-width: 650px) {
    
    .footer .nav-footer{
        float: none;
        width: auto;
        height: auto;
    }
    
    
    
    
    .nav-footer{
        border-bottom: 1px solid #e3e3e3;
    }
    .footer .nav-footer{
        width: 100%;
        height: 35px;
    }
    
    .nav-footer-section-titre::after{
        content: '+';
        float: right;
    }
    .nav-footer-section-label{
        cursor: pointer;
    }
    .nav-footer-section-list{
        visibility: hidden;
        transition: transform 300ms ease;
    }*/
/*    .bt_menufoo{
        display: inline;
    }*/
/*}*/

/*Gestion de l'organigramme
.content-org{
    text-align: center;
    width: 50%;
    min-width: 225px;
    margin: 0 auto;
}
#organigramme {
    width: 100%;
    border-radius: 5px;
    box-shadow: 0px 2px 15px black;
    cursor: pointer;
    transition: 0.3s;
}

#organigramme:hover {opacity: 0.7;}

 The Modal (background) 
.modal {
    display: none;  Hidden by default 
    position: fixed;  Stay in place 
    z-index: 1;  Sit on top 
    padding-top: 100px;  Location of the box 
    left: 0;
    top: 0;
    width: 100%;  Full width 
    height: 100%;  Full height 
    overflow: auto;  Enable scroll if needed 
    background-color: rgb(0,0,0);  Fallback color 
    background-color: rgba(0,0,0,0.9);  Black w/ opacity 
}

 Modal Content (image) 
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 1190px;
}

 Caption of Modal Image 
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

 Add Animation 
.modal-content, #caption {    
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}

@keyframes zoom {
    from {transform: scale(0.1)} 
    to {transform: scale(1)}
}

 The Close Button 
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

 100% Image Width on Smaller Screens 
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}*/
/*Couleur des différentes pages*/

/*Autres pages*/
/*
*//*

Couleur des différentes pages









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

a {
	text-decoration: none;
	outline: none;
}

a:hover, a:focus {
	outline: none;
}

 Clearfix
.clearfix:before,
.clearfix:after {
	display: table;
	content: " ";
}

.clearfix:after {
	clear: both;
}

.codrops-header,
.codrops-top {
	font-family: 'Lato', Arial, sans-serif;
}







.title{
	font-size: 60%;
}

 To Navigation Style 
.codrops-top {
	width: 100%;
	text-transform: uppercase;
	font-size: 0.69em;
	line-height: 2.2;
	font-weight: 400;
	background: rgba(255,255,255,0.3);
}

.codrops-top a {
	display: inline-block;
	padding: 0 1em;
	text-decoration: none;
	letter-spacing: 0.1em;
}

.codrops-top a:hover {
	background: rgba(255,255,255,0.4);
	color: #333;
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	display: block;
	float: left;
}

.codrops-icon:before {
	margin: 0 4px;
	text-transform: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	font-family: 'codropsicons';
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
	content: "\e001";
}

.codrops-icon-prev:before {
	content: "\e004";
}

.main {
	max-width: 69em;
	margin: 0 auto;
}








Différentes formes de titres
#txt_desc1{
	font-size:1.5em;
}

#txt_desc2{
	font-size:1.3em;
}

#txt_desc3{
	font-size:1.5em;
}








.info a {
	font-weight: 700;
	font-size: 0.9em;
}

*//*



Feuille de projet
#ref{
	border-style: double;
	border-color:red;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2.8em;
	width: 61em;
	height: 80em;
	background-color: whitesmoke;
}

#logo{
	margin-left: 37%;
}
#date{
	text-align: right;
	margin-right: 10px;
	font-size: 30px;
	color: black;
}
#titre{
	font-size: 2.2em;
	text-align: center;
	color: black;
}

.Tableau span {
   display:inline;
   float:left;
   border:1px solid blue;
   margin:0px;
   padding:3px;
   font-size: 0.8em;
	color: black;

  }
.Tableau p {
   clear:left;
   margin:0px;
   padding:0px;
   height:100% !important; height:1em;
   	margin-left: 180px;
  }
.Tableau p.legende {font-weight:bold}
.Tableau span.col1 {width:200px}
.Tableau span.col2 {width:200px}
.Tableau span.col3 {width:200px}

#desc{
	font-size: 1.5em;
	margin-left:1.8em;
	color: black;
}

.Tableau2 span {
   display:inline;
   float:left;
   border:1px solid lightgrey;
   margin:0px;
   padding:3px;
   font-size: 0.8em;
	color: black;

  }
.Tableau2 p {
   clear:left;
   margin:0px;
   padding:0px;
   height:100% !important; height:1em;
   	margin-left: 30px;
	margin-top: 100px;
  }
.Tableau2 p.legende2 {}
.Tableau2 span.col1_2 {width:500px}
.Tableau2 span.col2_2 {font-weight:bold; width:250px}
.Tableau2 span.col3_2 {width:150px}

.div_img{
	margin-top: 5px;
	border-style: solid;
	border-color:black;
	border-radius: 5px;
	float:left;
	height: 190px;
	width: 218px;
	display:block;
}

#div1{
	margin-left: 30px;
}

.div1{
	margin-left: 10px;
}

.img1{
	height:100%;
	width:100%;
}

#foot{
	color:black;
	font-size:15px;
	text-align:center;
	padding-top: 54%;
}

#impr{
	background-color: black;
	margin-top:10px;
	margin-left:44%;
}


	
	
Organigramme
#organigramme{
	height: 100%;
	width: 643px;
	margin-left: auto;
	margin-right: auto;
	display: block;
}

#agrandir{
	background-color: black;
	margin-left: auto;
	margin-right: auto;
	width: 250px;	
	height: 30px;
	font-size: 0.8em;
	display: none;
}

#btn_agrandir{
	margin: auto;
	width: 250px;
	height: 30px;
}

/*@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'codropsicons';
	src:url('../../fonts/codropsicons/codropsicons.eot');
	src:url('../../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
		url('../../fonts/codropsicons/codropsicons.woff') format('woff'),
		url('../../fonts/codropsicons/codropsicons.ttf') format('truetype'),
		url('../../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}

*/

/*
codrops-top {
	background: #fff;
	background: rgba(255, 255, 255, 0.4);
	text-transform: uppercase;
	position: relative;
	width: 100%;
	font-size: 0.7em;
	line-height: 2.2;
}

..codrops-top a {
	padding: 0 1em;
	letter-spacing: 0.1em;
	color: #888;
	display: inline-block;
}

.codrops-top a:hover {
	background: rgba(255,255,255,0.9);
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	float: left;
	display: block;
}

.codrops-icon:before {
	font-family: 'codropsicons';
	margin: 0 4px;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}
.codrops-icon-drop:before {
	content: "\e001";
}
.codrops-icon-prev:before {
	content: "\e004";
}
.codrops-icon-archive:before {
	content: "\e002";
}
.codrops-icon-next:before {
	content: "\e000";
}
.codrops-icon-about:before {
	content: "\e003";
}

.holder_content{
	position: relative;
	float: left;
	width: 100%;
	margin-top:0px;
	margin-bottom:20px;
	background-image:url(../images/top.png);
	background-position:top;
	background-repeat:no-repeat;
}



@media screen and (max-width: 25em) { 
	.codrops-icon span {
		display: none;
	}
	.container > header {
		font-size: 75%;
	}
}*/