/* 
CSS for : esante-europe.com
Author : Michael Legrand / Webnotoriete
*/

*{
	margin: 0;
	padding: 0;
}

body{
	width: 100%;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	color: #000;
}

/* Generique */

.ta_center{
	text-align: center;
}

.ta_left{
	text-align: left;
}

.ta_right{
	text-align: right;
}

.white{
	color: #fff !important;
}

.black{
	color: #000 !important;
}

.grey{
	color: #666 !important;
}

section{
	padding: 0px 0;
}

.padding_b_30{
	padding-bottom: 30px; 
}

.uppercase{
	text-transform: uppercase;
}

/* Hn */

.h1{
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	margin: 20px 0 5px 0;
	padding: 0 00px 0 0;
	text-transform: uppercase;
}

.h2{
	text-transform: uppercase;
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	font-size: 36px;
}

.h3{
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}

.h4{
	font-family: 'Ubuntu', sans-serif;
	font-weight: 500;
	margin: 0;
	padding: 0;
	font-size: 1.6em;
}

.p{
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	margin: 0 0 5px 0;
	font-size: 1em;
}

/* HEADER */
#header{
	
}

#header_mobile{
	display: none;
}

.ctn_logo{

}

.logo{
	width: 70%;
	margin: 0 0 5px 0;
}

.ctn_nav{

}

.ul_nav{
	text-align: center;
	margin: 0;
}

.li_nav{
	list-style: none;
	display: inline-block;
}

.a_nav{
	text-decoration: none;
	padding: 22px 30px;
	display: block;
	color: #888;
	font-weight: 500;
}

.lang{
	padding: 17px 0;
}

.ctn_lang{
	width: 100%;
	margin: 0 auto;
}

.select_lang{
	padding: 2px 50px 2px 10px;
	margin-right: 22px;
}

/* S1 */
#s1{
	background: url('assets/img/bk_01.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center top;

	padding: 150px 0;
}

#titrage{
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	font-size: 1.8em;
	padding: 20px 0 0 15px;
}

.ctn_s1{
	padding: 0px 0;
}

.num_sec{
	margin: 0 0 2px 0;
}

.deco_white{
	width: 112px;
	height: 3px;
	background: #fff;
}

.deco_black{
	width: 112px;
	height: 3px;
	background: #000;
}

.lien_lgs{
	padding: 25px 0 20px 0;
}

.ctn_logo_lgs{
	text-align: center;
	background: rgba(0,0,0,0.4);
	padding: 10px 0px;
}

.logo_lgs{
	width: 90%;
}

/* S02 */
#a-propos{
	padding: 50px 0;
}

#titrage2{
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	font-size: 1.8em;
	padding: 20px 0 0 15px;
}

.p_propos{
	font-weight: 500;
	margin-top: 30px;
	padding-right: 75px;
}

.icon1{
	width: 25%;
	height: 54px;
	background-image: url(assets/img/icone.png);
	background-repeat: no-repeat;
	background-size: 80%;
	background-position: center left;
	display: inline-block;
	vertical-align: top;
}

.h3.s2{
	width: 75%;
	display: inline-block;
	vertical-align: top;
	margin: 10px 0 20px 0;
	font-size: 18px;
}

.icon2{
	width: 12%;
	height: 54px;
	background-image: url(assets/img/icone.png);
	background-repeat: no-repeat;
	background-size: 80%;
	background-position: center left;
	display: inline-block;
	vertical-align: top;
}

.h3.s2_2{
	width: 75%;
	display: inline-block;
	vertical-align: top;
	margin: 18px 0 30px 0;
	font-size: 18px;
}

/* nos-engagements */
#nos-engagements{
	padding: 80px 0;

	background: url(assets/img/bk_03.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.deco_s3{
	width: 112px !important;
	float: right;
	display: block;
	margin: 0 0 0px 0;
}

.h2_s3{
	margin: 40px 0 10px 0;
}

.p_s3{
	margin: 30px 0 0 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	display: block;
	font-size: 16px;
	text-align: right;
}

.p_s3:last-child{
	margin: 30px 0 30px 0;
}

/* nos-activites */
#nos-activites{
	padding: 80px 0;

	background: url(assets/img/bk_04.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: right center;
}

.deco_s4{
	width: 25% !important;
}

.p_s4{
	margin: 30px 0 30px 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	display: block;
	font-size: 16px;
	text-align: left;
	padding: 0 95px 0 0;
}

.btn_plus{
	padding: 15px 25px;
	border: 1px solid #1eace1;
	color: #1eace1;
	font-size: 16px;
	border-radius: 5px;
	font-weight: 400; 
}

/* Footer */
.div_footer{
	text-align: center;
}

.logo_footer{
	width: 40%;
	padding: 10px 0;
}

.a_footer{
	padding: 30px 0 0px 0;
	display: block;
}

.copyright{
	font-weight: 700;
	color: #666;
	padding: 30px 0 0 0;
}



/* **** CONTACT ***** */
#contact{
	padding: 50px 0;
}

.ctn_contact{

}

.deco_s2_contact{
	width: 112px !important;
	float: right;
	display: block;
	margin: 0 0 0px 0;
}

.h3_contact{
	text-transform: uppercase;
	font-weight: 400 !important;
}

.p_adr{
	padding: 0;
	margin: 0;
	line-height: 1.2;
}

.titre_adr{
	font-weight: 500;
	padding: 40px 0 10px 0;
}

.nom_adr{

}

.ligne_1_adr{

}

.cp_ville_adr{

}

.ctn_partage{
	padding: 20px 0;
}

.h4_contact_tel{
	font-weight: 700;
	padding: 40px 0 5px 0;
	margin: 0;
}

.icon_res{
	margin: 0 5px;
}

.icon_res:first-child{
	margin: 0 5px 0 0;
}

.icon_res:last_child{
	margin: 0 0 0 5px;
}

.tel{
	font-weight: 700;
	font-size: 0.95em;
}

label{
	font-weight: 500;
	width: 100%;
	font-size: 16px;
	color: #666;
	text-align: right;
}

.input_contact{
	width: 100%;
	margin: 0 0 5px 0;
}

.input_contact:last-child{
	margin: 0 0 40px 0;
}

.submit{
	padding: 10px 45px;
	background: #1eace1;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	border: none;
	margin: 10px 0 10px 0;
	float: right;
}

/* Construction */
#construction{
	padding: 100px 0 400px 0;
}

/* Activites */
#activite{
	padding: 0 0 80px 0;
}

.ctn_activite{

}

.ctn_act_1{
	padding-top: 50px;
	padding-bottom: 30px;
}

.ctn_txt_act_1{
	padding-top: 35px;
	padding-bottom: 35px;
}

.img_act_1{
	width: 100%;
}

.ctn_act_2{
	padding-top: 10px;
	padding-bottom: 10px;
}

.ctn_txt_act_2{
	padding-top: 5px;
	padding-bottom: 0px;
}

.img_act_2{
	width: 100%;
}

.h3_activite{
	font-weight: 400;
	text-transform: uppercase;
	margin-bottom: 0;
}

.h4_activite{
	font-weight: 400;
	text-transform: uppercase;
	margin-top: 2px;
	font-size: 16px;
}

.p_activite{
	font-weight: 400;
	font-size: 12px;
	color: #666;
}

.p_margin_bottom{
	margin-bottom: 10px;
}

#s2_e-conciergerie{
	padding: 80px 0;

	background: url(assets/img/bk_activite_2.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: right center;
}

.p_s2_act{
	font-weight: 500;
	font-size: 14.5px;
	color: #666;
	line-height: 1;
	margin-top: 20px;
	margin-bottom: 20px;
}

.p_s2_act_2{
	font-weight: 400;
	font-size: 14.5px;
	color: #000;
	line-height: 1;
	margin-top: 20px;
	margin-bottom: 20px;
}

.icon_act{
	width: 26px;
}

.padding_top_20{
	padding-top: 20px;
}

.ul_activite{

}

.li_activite{
	list-style: none;
	font-weight: 500;
	font-size: 18px;
	color: #000;
	line-height: 1;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 12px 5px;
}

.li_activite:before{
	content: "";
    width: 32px;
    height: 32px;
    padding: 20px;
    margin: 10px 10px 10px 0;
    display: inline;
    background-image: url(assets/img/icone.png);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
}

/* Recrutement */
#recrutement{
	padding: 100px 0;
	background: url(assets/img/bk_recru.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
} 

.ctn_recrutement{

}

.quote_recru{
	font-size: 1.4em;
	font-weight: 400;
	text-transform: uppercase;
	font-family: 'Montserrat';
}

#s2_recrutement{
	padding: 50px 0;
}

.deco_s2_recrutement{
	margin: 0 auto;
}

.h2_s2_recru{
	margin: 20px 0 40px 0;
}

.p_s2_recru{
	font-size: 16px;
	font-weight: 400;
	margin-bottom: 20px;
	padding: 0 120px;
}

.ctn_poste{
	width: 100%;
	margin: 40px 0 0 0;
	display: block;
}

.poste{
	padding: 15px 15px;
	margin: 10px 10px;
	background: #1eace1;
	font-size: 16px;
	text-align: center;
	width: 30%;
	display: inline-block;
	color: white;
	font-weight: 400;
}

.poste:hover{
	background: #6e6e6e;
	text-decoration: none;
	color: white;
}

#s3_recrutement{
	padding: 50px 0;
}

.custom-file-input::-webkit-file-upload-button {
  visibility: hidden;
}

.custom-file-input{
	font-size: 11px;
	float: right;
	text-align: center;
	display: block;
	padding: 35px 0 0 0;
}

.custom-file-input::before {
  content: 'Choisir un fichier';
  display: inline-block;
  background: #6e6e6e;
  padding: 8px 15px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  color: #fff;
  font-weight: 700;
  font-size: 10pt;
  float: right;
  text-align: center;
  margin: -33px 0 0 0;
}

.custom-file-input:hover::before {
  border-color: black;
}

.custom-file-input:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}

/** CGU **/
#CGU{

}

.ctn_cgu{
	padding: 50px 0 0 0;
}

.ctn_cgu_1{

}

.p_cgu{
	padding: 50px 0;
}

/*****/
@media (max-width: 768px){

	.logo{
		width: 30%;
	}

	.a_nav{
		padding: 10px 15px;
	}

	.ctn_lang{
		width: 35%;
	}

	/* s1 */
	#s1{
		padding: 0;
	}

	.ctn_s1{
		margin: 10px 0;
	}

	#titrage{
		padding: 40px 0 10px 15px;
	}

	.deco_white{
		width: 25%;
	}

	.h1{
		padding: 0;
	}

	.ctn_logo_lgs{
		margin: 5px 0;
	}

	.logo_lgs{
		width: 50%;
	}

	/* s2 */
	#a-propos{
		padding: 0;
	}

	#a-propos > div > div > div > h2{
		padding-left: 15px;
		margin: 0 0 10px 0;
	}

	#titrage2{
		padding: 0 0 10px 28px;
	}

	.deco_black{
		width: 25%;
	}

	.p_propos{
		padding-left: 15px;
	}

	#a-propos > .container > div > div{
		margin: 15px 0 0 0;
	}

	.icon1{
		width: 18%;
		background-size: 85%;
	}

	.icon2{
		width: 9%;
		background-size: 85%;
	}

	/* nos-engagements */
	#nos-engagements{
		padding: 20px 0;
		background-position: 87% center;
	}

	.p_s3{
		padding: 0 0 0 150px;
	}

	/* nos-activites */
	#nos-activites{
		padding: 20px 0 50px 0;
		background-position: center;
	}

	/* footer */

	.logo_footer{
		width: 25%;
	}

	.a_footer{
		padding: 10px 0 0 0;
	}

	.copyright{
		padding: 25px 0 0 0; 
	}

	/* activite */
	#s2_e-conciergerie{
		background-position: center;
	}

	.p_s2_act{
		line-height: 1.1;
	}

	.li_activite:before{
		margin:5px;
		padding: 15px;
	}
}

@media (max-width: 425px){
	#header{
		display: none;
	}

	#header_mobile{
		display: block;
	}

	.logo{
		width: 180px;
	}

	.a_nav{
		padding: 8px 15px;
	}

	.ctn_lang{
		width: 35%;
	}

	/* s1 */
	#s1{
		padding: 0;
	}

	.ctn_s1{
		margin: 10px 0;
		overflow: hidden;
	}

	#titrage{
		padding: 40px 0 10px 15px;
	}

	#titrage2{
		padding: 15px 0 10px 0;
	}

	.deco_white{
		width: 25%;
	}

	.h1{
		padding: 0;
		line-height: 1;
	}

	.h4{
		font-size: 2em;
	}

	.ctn_logo_lgs{
		margin: 10px 0;
		padding: 20px 0;
	}

	.logo_lgs{
		width: 88%;
	}

	/* s2 */
	#a-propos{
		padding: 0;
	}

	.deco_black{
		width: 25%;
	}

	.p_propos{
		padding-left: 15px;
		padding-right: 15px;
	}

	#a-propos > .container > div > div{
		margin: 20px 0;
	}

	#a-propos > .container > div > div > div{
		margin: 30px 0;
	}

	.icon{
		width: 18%;
		background-size: 85%;
	}

	.h3 .s2{
		padding: 0 0 0 5px;
	}

	.icon2{
		width: 18%;
		background-size: 85%;
	}

	

	/* nos-engagements */
	#nos-engagements{
		padding: 00px 0;
		background-position: -50px;
	}

	.overlay_mobile{
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0;
		background: rgba(0,0,0,0.5);
	}

	.w_m{
		background: #fff !important;
	}

	.cw_m{
		color: #fff !important;
	}

	.p_s3{
		padding: 0 0 0 100px;
	}

	/* nos-activites */
	#nos-activites{
		padding: 00px 0 00px 0;
		background-position: -800px;
		background-image: url('assets/img/bk_04_m.png');
	}

	.btn_plus{
		color: #1eace1;
		border-color: #1eace1;
		margin: 0 0 50px 0;
		padding: 15px 10px;
		display: block;
		width: 45%;
		text-align: center;
	}

	/* CONTACT */
	#contact{
		padding: 0 0;
	}

	.titre_adr{
		padding: 20px 0 10px 0;
	}

	.h4_contact_tel{
		font-size: 1.8em;
	}

	.tel{
		font-size: 1.4em !important;
		font-weight: 400 !important;
	}

	.ctn_maps{
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.submit{
		width: 100%;
		padding: 15px 45px;
		font-size: 16px;
	}



	/* recru */
	#recrutement{
		padding: 20px 0;
	}

	.quote_recru{
		font-size: 1em;
	}

	#s2_recrutement{
		padding: 20px 0 0 0;
	}

	.p_s2_recru{
		padding: 0 15px 0 0;
	}

	.poste{
		width: 95%;
		margin: 10px 15px 10px 0;

	}

	/* footer */

	.logo_footer{
		width: 30%;
	}

	.a_footer{
		padding: 10px 0 0 0;
		font-size: 0.9em;
	}

	/* Activites */
	.ctn_act_1{
		padding-bottom: 10px;
	}

	.ctn_txt_act_1{
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.h3_activite{
		font-weight: 600;
		font-size: 26px;
		margin-top: 10px;
	}

	.h4_activite{
		font-weight: 300;
		font-size: 20px;
	}

	.p_act_m{
		padding: 30px 0 0 0;
		font-size: 14px;
	}

	.ctn_txt_act_2{
		padding-top: 15px;
		padding-bottom: 15px;
	}

	#s2_e-conciergerie{
		background-position: center;
		padding: 5px 0;
	}

	.p_s2_act{
		line-height: 1.1;
		padding-right: 15px;
		font-weight: 400;
		font-size: 14px;
	}

	.li_activite:before{
		margin: 10px;
		padding: 13px;
	}

	.li_activite{
		font-weight: 400;
		font-size: 16px;
		line-height: 1.5;
	}

	.p_s2_act_2 {
		padding-right: 15px;
	}
	
}

/* BurgerMenu */
.topnav {
  overflow: hidden;
  background-color: #fff;
}

.topnav a {
  float: left;
  display: block;
  color: #1eace1;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topbar a .icon{
	padding: 
}

.topnav a:hover {
  background-color: #1eace1;
  color: #fff;
}

.topnav .icon {
  display: none;
  color: #1eace1;
}

@media screen and (max-width: 425px) {
  .topnav a:not(:first-child) {display: none;}

  .topnav div.ctn_lang{
  	display: none;
  }

  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 425px) {
	.topnav.responsive {
		position: relative;
		padding: 0 0 20px 0;
	}

  	.topnav.responsive .icon {
    	position: absolute;
    	right: 0;
    	top: 0;
    	color: #fff;
  	}

	.topnav.responsive a {
		float: none;
		display: block;
		text-align: left;
	}

	.topnav.responsive div.ctn_lang{
		float: none;
		display: block;
		text-align: center;
	}

}

