*{ outline: none !important; box-sizing: border-box; }
html { -webkit-tap-highlight-color: transparent; }
html, body{
	font-family: 'Montserrat', sans-serif;
	text-align: center;
	padding: 0px;
	margin: 0px;
	position: relative;
	width: 100%;
	font-size: 16px;
	font-weight: 300;
	background: #fff;
	color: #000;
}
body{ padding: 15px 30px 150px 30px; } 

html.noscroll, body.noscroll{ overflow: hidden; }

.clear{ clear: both !important; }
a{ color: #000; text-decoration: underline; }
a:hover{ color: #000; text-decoration: underline; }
.bold{ font-weight: 700; }

#menu{
	position: absolute;
	top: 30px;
	left: 30px;
	background: black;
	color: white;
	z-index: 55555;
	padding: 0;
	height: 55px;
}
#menu ul{ padding: 0px; margin: 0px; height: 55px; }
#menu ul li{ list-style: none; text-align: left; padding: 0px; display: inline-block; }
#menu ul li a{ color: white; text-decoration: none; text-transform: uppercase; padding: 0 10px; line-height: 55px; height: 55px; display: inline-block; }
#menu ul li a.on, #menu ul li a:hover{ border-bottom: solid 5px white; }



/*
#menu i{ color: white; }
#menu ul{ padding: 0px; }
#menu ul li{ list-style: none; text-align: left; padding: 0px; }
#menu ul li a{ text-transform: uppercase; color: white; }

#menu_bt a{ display: block; height: 35px; width: 35px; text-align: center; }
#menu_bt a i{ vertical-align: middle; }
*/

.bt{ display: inline-block; padding: 10px 20px; border: solid 3px black; background: white; transition: .2s; text-decoration: none; }
.bt i{ tmargin-right: 5px; }
.bt:hover, .bt.on{ background: black; color: white; text-decoration: none; }


#bar{ position: fixed; width: 6px; margin-left: calc( 50% - 7px ); background: #808285; top: 215px; bottom: 30%; z-index: 1; } 
#logo{ display: block; position: relative; width: 378px; height: 171px; background-image: url(logo-light-center.png); margin-left: calc( 50% - 163px ); z-index: 2; }
h1{ padding-left: 65px;  margin: 0px; padding: 0px; line-height: 30px; font-size: 11px; font-weight: 300; text-transform: uppercase; position: relative; z-index: 3; }

h2{ text-transform: uppercase; z-index: 100; position: relative; margin-top: 90px; }
h2 span{ color: #808285; padding: 0 3px; }
h2#equipe_h2{ margin-left: -64px; background: white;}

h2#about_h2{ margin-left: -168px; background: white;}

#about{ background: white; padding: 10px 0; line-height: 24px; position: relative; z-index: 2; }
#about span{ font-weight: bold; }

#bt_contact{ position: fixed; top: 30px; right: 30px; background: #000; color: white; display: block; padding: 15px; font-size: 14px; text-decoration: none; z-index: 555; border: solid 3px black;}
#bt_contact:hover{ background: white !important; color: black; }
#bt_contact:hover i{ color: black; }

#presentation{ height: 70%; position: relative; }
#presentation_maison{ position: relative; z-index: 5; text-align: left; margin-left: 23%; height: 100%; margin-top: 60px; }
#presentation_maison img{ height: 100%; border: solid 5px black; }
#presentation_txt{ position: absolute; z-index: 5; background: white; text-align: left;  width: calc(50% + 60px); padding: 30px; line-height: 24px; bottom: 60px; right: 120px; border-right: solid 5px #000; }
#presentation_txt span{ font-weight: bold; }


#publications_h2{ margin-left: -80px; background: white; }
#publications{ }
.publication{ width: 500px; float: left; text-align: left; z-index: 5555; position: relative; margin: 30px; background: white;}
.publication span{ font-weight: bold; }
.publication_titre{ font-size: 18px; font-weight: bold; margin-top: 15px; }
.publication_author{ font-size: 14px; margin-top: 15px; }
.publication_txt{ line-height: 24px; margin-top: 15px; font-style: italic; }
.publication_img{ width: 100%; width: calc(100% - 45px); }


#prise_de_sang_h2{ margin-left: 185px; background: white; }
#prise_de_sang{ text-align: center; padding: 15px; background: white; position: relative; z-index: 2;  }
#prise_de_sang img{  height: 500px; margin: 15px; border: solid 5px black; margin-top: 60px; }

#equipe{ height: 60%; position: relative; }
#equipe span{ font-weight: bold; }

#equipe_txt{ position: absolute; z-index: 5; background: rgba(255,255,255,.85); text-align: left; padding: 15px 30px; line-height: 24px; top: 30px; left: 120px; border-left: solid 5px #000; }
#equipe_txt ul{ margin-bottom: 0px; }
#equipe_txt ul li{ height: 54px; padding: 0px;}
#equipe_txt ul li a{ text-decoration: none; transition: all .2s; line-height: 20px; }
#equipe_txt ul li a:hover{ font-weight: bold; text-decoration: underline; }
#equipe_txt ul li a span{ text-decoration: underline; display: block; }
#equipe_txt span{ font-weight: 400; }

#equipe_photo{ position: relative; z-index: 5; text-align: right; margin-right: 10%; height: 100%; margin-top: 60px; }
#equipe_photo_border{ content:''; position: absolute; border: solid 5px black; top: 0px; right: 0px; bottom: 0px; transition: all .2s;} 
#equipe_photo img{ height: 100%; }

#verthical{ position: relative; z-index: 5; background: white; text-align: left; margin-top: 30px; margin-left: calc( 50% - 60px); width: 50%; padding: 15px 30px; line-height: 24px; }
#verthical span{ font-weight: bold; }

.border{ border-top: solid 15px white; border-bottom: solid 15px white; }

#footer{ font-size: 14px; z-index: 5555; position: fixed; bottom: 0px; padding: 15px 0; background: black; color: white; text-align: center; left: 0px; right: 0px; }
#footer_mobile{ display: none; }
#footer a{ color: white; text-decoration: none; }
#footer a:hover{ text-decoration: underline; }



/* PAGE EQUIPE */


@media(max-width: 1900px){
	#equipe_photo{ margin-right: 0%; }
}
@media(max-width: 1600px){
	#equipe_photo{ margin-right: 0%; }
	#equipe_txt{ left: 0px; }
	#presentation_maison{ margin-left: 12%; }
}

@media(max-width: 1450px){
	#equipe_txt ul{ padding-left: 20px; }
}
@media(max-width: 1400px){
	#equipe_txt ul{ padding-left: 0px; list-style: none;}
}

@media(max-width: 768px){
	body{ padding: 15px; padding-bottom: 90px; font-size: 14px; }
	#logo{
		width: 189px;
		height: 85.5px;
		margin-left: auto;
		margin-right: auto;
		background-size: contain;
		background-position: center center;
		margin-top: 15px; 
	}
	
	#bt_contact{
		display: none;
	}
	
	#bar{
		width: 3px;
		top: 150px;
		bottom: 30%;
		margin-left: calc(50% - 1.5px - 15px );
	}
	
	#presentation{ height: auto; }
	#presentation_maison{ text-align: center; margin-left: 0%; height: auto; width: 100%; max-width: 100%; margin-top: 30px; }
	#presentation_maison img{ width: 100%; height: auto; }
	#presentation_txt{ position: relative; width: 100%; padding: 15px 5px; bottom: 0; right: 0; margin-top: 15px; border: none; background: rgba(255,255,255, 0.9); }
	
	#about{ text-align: left; background: rgba(255,255,255, 0.9); }
	
	#equipe{ height: auto; }
	#equipe_photo{ margin-top: 0px;  }
	h2#equipe_h2{ margin-left: -73px; }
	
	#equipe_photo img{ width: 100%; height: auto; }
	#equipe_txt{ position: relative; background: rgba(255,255,255, 0.9); top: 0px; left: 0px; border-left: none; padding: 0px; padding-top: 30px; }
	#equipe_txt ul{ padding-left: 30px; }
	
	#equipe_txt ul li a:hover{ }
	
	#equipe_txt span{  }
	
	#footer{ font-size: 12px; }
	
	h2{ font-size: 15px; margin-top: 30px; margin-bottom: 10px;  }
	h2#about_h2{ margin-left: -137px; }
	
	#publications_h2{ margin-left: -83px; margin-top: 60px; }
	
	.publication{ width: 100%; margin: 30px 0 0 0px; }
	.publication_titre{ font-size: 16px; }
	.publication_odd{ margin-left: 0px; } 
	
	#prise_de_sang img{ width: 100%; margin: 0px; height: auto;  }
	#prise_de_sang_h2{ margin-left: 83px; }
	#prise_de_sang {
		text-align: left;
		padding: 0px;
		background: rgba(255,255,255, 0.9);
		margin: 30px 0;
	}
	
	#footer_mobile{ display: block; margin-top: 15px; }
}

.extrab{ font-weight: 700; }