/* Theme Name:   club-ebios Theme URI:    https://club-ebios.org Description:  Thème du Club EBIOS Author:       Club EBIOS, sur la base du travail de Lou LUBIE Author URI:   https://club-ebios.org Version:      1.0*/
/* -------------------------------------------------------------------------- *//*                                  GLOBAL                                    *//* -------------------------------------------------------------------------- */
*{	box-sizing: border-box;}
img{    max-width: 100%;    height: auto;}
body,html{	margin: 0;	padding: 0;	font-size: 100%;}
body{	font-size: 1em;	font-family: 'Open Sans', sans-serif;	font-weight: 300;}
@media screen and (min-width: 1200px){	body	{		font-size: 1.15em;	}}
html{	color: #202020;	background-color: white;	height:100%;	background-image: url('../img/background.jpg');	background-position: center right;	background-repeat: no-repeat;	background-attachment: fixed;}
a{	color: #e40513;	text-decoration: none;}a:hover{	color: #a3030d;}
a.bloc,#menu li a,.bouton a,#logo a{	display: block;	width: 100%;	height: 100%;	position: absolute;	top: 0;	left: 0;}
.liste li{	margin: 10px 0;}/* -------------------------------------------------------------------------- *//*                               BANDEAU HAUT                                 *//* -------------------------------------------------------------------------- */
#bandeau{    width: 100%;    margin-left: 0;	padding-top: 60px;	padding-left: 25px;	padding-right: 25px;	padding-bottom: 25px;}
/* Réseaux sociaux */#menu_reseaux_sociaux{    width: 150px;}.post-share ul{    list-style: none;	text-align: center;	padding-left: 10px;	padding-right: 10px;}.post-share ul li{    display: inline-block;	margin: 5px;}.fa,.fab,.fal,.far,.fas{    line-height: 1;    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}.post-share .fa,.post-share .fab,.post-share .fal,.post-share .far,.post-share .fas{    font-size: 1.5em;    position: relative;}/* Multilingue */#drapeau{	text-align:right;}.lang-item{    list-style: none;}
@media screen and (min-width: 1200px){	#bandeau	{		width: 80%;		margin-left: 20%;		padding: 10px;	}		#drapeau	{		width:70%;	}}/* Recherche */#recherche{    padding-left: 15px;}
/* -------------------------------------------------------------------------- *//*                               MENU LATERAL                                 *//* -------------------------------------------------------------------------- */
#logo{	width: 100%;	height: 100%;	background-image: url('../img/ClubEBIOS-Logo-Mobile.png');	background-position: center top;	background-repeat: no-repeat;	background-size: contain;}
#menu{	margin: 0;	padding: 0;	margin-top: 30px;	display: block;	left: 50%;	transform: translateX(-50%);	position: absolute;	width: auto;	white-space: nowrap;}
#menu li{	font-size: 1.3em;	font-weight: 300;	margin: 0;	padding: 0;	list-style-type: none;	color: #e40513;	position: relative;	padding: 10px 0;	padding-right: 20px;}#menu li.actif{	font-weight: bold;	color: #202020;	-webkit-touch-callout: none;    -webkit-user-select: none;    -khtml-user-select: none;    -moz-user-select: none;    -ms-user-select: none;    user-select: none;}
#menu .flat_icon{	width: 58px;	height: 58px;	display: inline-block;	vertical-align: middle;	position: relative;	margin-right: 10px;}#menu .flat_icon:after{	content: " ";	display: block;	background-size: cover;	width: 100%;	height: 100%;	background-position: center left;	position: relative;	border-radius: 100px;	background-color: #AAA;}
#menu .flat_icon:before{	content: " ";	position: absolute;	top: -8px;	left: -8px;	width: 70px;	height: 70px;	transform:  scaleX(0.75) scaleY(0.75);	border-radius: 100px;	border: 2px solid #e40513;	-webkit-transition: all .15s linear;	-moz-transition: all .15s linear;	-ms-transition: all .15s linear;	-o-transition: all .15s linear;	transition: all .15s linear;}
#menu li.actif .flat_icon:after,#menu li.lien:hover .flat_icon:after{	background-position: center right;}
#menu li.lien:hover .flat_icon:before{	transform:  scaleX(1) scaleY(1) ;}
#menu .membres 			.flat_icon:after 	{ background-image: url('../img/menu_membres.png'); }#menu .productions 		.flat_icon:after 	{ background-image: url('../img/menu_productions.png'); }#menu .reunions 		.flat_icon:after 	{ background-image: url('../img/menu_reunions.png'); }#menu .rejoindre 		.flat_icon:after 	{ background-image: url('../img/menu_adhesions.png'); }#menu .certification 	.flat_icon:after 	{ background-image: url('../img/menu_certification.png'); }#menu .faq 				.flat_icon:after 	{ background-image: url('../img/menu_faq.png'); }#menu .contacter		.flat_icon:after 	{ background-image: url('../img/menu_contact.png'); }
#menu_mobile_btn{	display: none;}
/* Cas d'un grand écran */@media screen and (min-width: 1200px){	#logo	{		height: 175px;		background-image: url('../img/ClubEBIOS-Logo.png');	}}/* Cas d'un écran plus petit */@media screen and (max-width: 1199px){	#menu li	{		padding: 5px 0;	}	#menu_mobile_btn	{		display: block;		height: 100%;		width: 70px;		position: absolute;		top: 0;		right: 0;		cursor: pointer;	}
	#menu_mobile_btn i	{		display: block;		position: absolute;		right: 20px;		top: 15px;		font-size: 20px;	}
	#menu_mobile_btn:hover i	{		color: #e40513;	}
	#menu_mobile.actif	{		display: block;		position: fixed;		height: calc(100vh - 50px);		left: 0;		top: 50px;		width: 100%;		transform: none;		background-color: #e6e6e6;		z-index: 99999;		margin-top: 0;	}	#menu_mobile.actif #menu 	{		margin: 0;		height: 0;		transform: translateX(-50%) translateY(-50%);	}}
/* Cas d'un écran à hauteur limitée (ex : ordinateur portable) */@media screen and (max-height: 799px) and (min-width: 1200px){	#logo	{		height: 150px;	}	#menu	{	transform: scale(0.8,0.8);	left: 20%;	margin-top: 0;	}	#menu li	{		padding: 5px 0;	}	}/* Cas d'un tout petit écran (ex : vieux smartphone) */@media screen and (max-height: 500px){	#menu .flat_icon	{		display: none;	}}	/* -------------------------------------------------------------------------- *//*                                  PAGES                                     *//* -------------------------------------------------------------------------- */
#page,#article{	width: 100%;	min-height: calc(100vh - 200px);	padding: 35px;	position: relative;	float: left;	z-index: 0;}
#menu_lateral{	display: none;	background-color: white;	box-shadow: 6px -0 20px #CCC;	z-index: 2;}
@media screen and (min-width: 1200px){	#menu_lateral	{		display: block;		width: 20%;		height: 100%;		position: fixed;		padding: 20px;	}
	#page,	#article	{		margin-left: 20%;		width: 80%;		padding-left: 70px;		padding-right: 70px;	}
}
@media screen and (max-width: 1199px){	#menu_lateral	{		display: block;		height: 50px;		width: 100%;		position: fixed;		top: 0;		left: 0;		padding: 10px;		overflow: hidden;	}
	#page,	#article	{		margin-top: 50px;	}
}
/* -------------------------------------------------------------------------- *//*                             STYLE DES TITRES                               *//* -------------------------------------------------------------------------- */
h1{	font-weight: 300;	color: #e40513;	margin: 0;		text-transform: uppercase;	margin-bottom: 40px;	font-size: 2em;}
h1 b{	font-weight: 700;}
@media screen and (max-width: 1199px){	h1	{		text-align: center;	}}
@media screen and (min-width: 1200px){	h1	{		margin-bottom: 60px;		font-size: 2.6em;	}}
h2{	font-size: 1em;	margin: 0;	margin-top: 60px;	text-transform: uppercase;}h3{	font-size: 1em;	margin-top: 40px;	/*text-transform: full-width;*/}h4{	font-size: 1em;}p,.liste li{	line-height: 1.7em;	margin: 15px 0;}
.step{	font-weight: bold;	font-size: 1em;	padding: 2px 10px;	display: inline-block;	margin-bottom: 0;	text-transform: uppercase;	-webkit-touch-callout: none;    -webkit-user-select: none;    -khtml-user-select: none;    -moz-user-select: none;    -ms-user-select: none;    user-select: none;}
.step{	background-color: #44aca1;	color: white;}.step + p{	margin-top: 0;}
/* -------------------------------------------------------------------------- *//*                                 ONGLETS                                    *//* -------------------------------------------------------------------------- */
.onglet_container{	margin: 40px 0;}
.onglet_header,.onglet_body,.classementFAQ{	padding: 20px;}
.onglet_header,.classementFAQ{	background-color: #44aca1;	padding-top: 10px;	padding-bottom: 10px;	color: white;	font-weight: bold;}
.onglet_body{	background-color: #e6e6e6;}
@media screen and (min-width: 1200px){	.onglet_header,	.classementFAQ	{		background-image: url('../img/onglet_bg.png');		background-repeat: no-repeat;		background-size: contain;		background-position: center right;	}}@media screen and (max-width: 1199px){	.onglet_header td	{		display: block;		text-align: left !important;	}}
/* -------------------------------------------------------------------------- *//*                                 BOUTONS                                    *//* -------------------------------------------------------------------------- */.boutons_container{	text-align: left;	margin-top: 20px;}.bouton,.wpcf7-form input[type="submit"]{	display: inline-block;	padding: 5px 10px;	border: 2px solid #e40513;	text-transform: uppercase;	font-size: 0.7em;	font-weight: bold;	position: relative;	-webkit-transition: all .1s linear;	-moz-transition: all .1s linear;	-ms-transition: all .1s linear;	-o-transition: all .1s linear;	transition: all .1s linear;}.bouton:not(:last-child){	margin-right: 10px;}.bouton.full,.wpcf7-form input[type="submit"],#tribe-events .tribe-events-button{	background-color: #e40513;	color: white;}.bouton.light{	color: #e40513;}.bouton:hover,.wpcf7-form input[type="submit"]:hover,#tribe-events .tribe-events-button:hover{	border-color: #a3030d;}.bouton.full:hover,.wpcf7-form input[type="submit"]:hover,#tribe-events .tribe-events-button:hover{	background-color: #a3030d;}.bouton.light:hover{	color: #a3030d;}.bouton .fas{	margin-left: 7px;}/* -------------------------------------------------------------------------- *//*                                FIL TWITTER                                 *//* -------------------------------------------------------------------------- */#twitter{	display: none;	}@media screen and (min-width: 1200px) and (min-height: 800px){	#twitter	{		display: block;		margin-left: 80%;		padding-right: 50px;		padding-top: 50px;	}}/* -------------------------------------------------------------------------- *//*                               PIED DE PAGE                                 *//* -------------------------------------------------------------------------- */
footer,.asterisque{	color: #888;	font-size: 0.8em;	}
.asterisque{    margin-top: 40px;}
footer{	position: relative;	width: 100%;	margin-left: 0;	text-align: center;	padding: 25px;	float: right;}@media screen and (min-width: 1200px){	footer	{		width: 80%;		margin-left: 20%;	}}footer a{	color: #888;}
footer a:hover{	color: #e40513;}/* -------------------------------------------------------------------------- *//* -------------------------------------------------------------------------- *//*                             PAGES SPECIFIQUES                              *//* -------------------------------------------------------------------------- *//* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- *//*                                  ACCUEIL                                   *//* -------------------------------------------------------------------------- */
@media screen and (min-width: 1200px){	.site,	.welcome	{		width: 80%;	}}@media screen and (min-width: 1200px){	#page.site,	#page.welcome	{		padding-top: 0;		padding-bottom: 0;	}}.site h1,.welcome h1{	font-size: 2.5em;	margin-top: 0;	margin-bottom: 40px;	text-align: center;}@media screen and (min-width: 1200px){	.site h1,	.welcome h1	{		font-size: 3.5em;		margin-top: 0;	}}
.usp_container:after{	content: " ";	display: block;	clear: both;}.usp{	text-align: center;	margin-top: 90px;}@media screen and (min-width: 1200px){	.usp	{		width: 25%;		padding: 0 50px;		float: left;		margin-top: 0px;	}}
.usp:hover img{	transform:  scaleX(1.1) scaleY(1.1) ;}.usp h2{	margin-top: 0;}.usp img{	max-width: 100%;	margin-bottom: 20px;	-webkit-transition: all .15s linear;	-moz-transition: all .15s linear;	-ms-transition: all .15s linear;	-o-transition: all .15s linear;	transition: all .15s linear;}.usp p{	font-size: 1em;}@media screen and (min-width: 1200px){	.usp p	{		font-size: 0.8em;	}}/* -------------------------------------------------------------------------- *//*                                  MEMBRES                                   *//* -------------------------------------------------------------------------- */
table{	border-spacing : 0;	border-collapse : collapse;	width: 100%;}
.membres td{	padding: 0 5px;	vertical-align: top;}
.membres td:nth-child(2){	text-align: right;	font-style: italic;}
.membres tr.role{	font-size: 0.7em;	font-weight: bold;}
.membres tr.role:nth-child(n+2) td{	padding-top: 20px;}
.membres tr.membre:hover,.production_details tr:hover{	background-color: #bed8d5;}
.onglet_date{	text-align: right;	font-size: 0.7em;}
#organismes_membres .organisme_logo img{	max-width: 100%}
#organismes_membres .organisme_logo{	max-width: 150px;	vertical-align: top;    text-align: center; }
#organismes_certificateurs .organisme_logo img{	max-width: 100%}
#organismes_certificateurs .organisme_logo{	max-width: 150px;	vertical-align: top;    text-align: center; }
.membres_individuels{	margin-top: 10px;	column-count: 2;}
@media screen and (max-width: 1199px){	.membres td	{		display: block;	}
	.membres td:nth-child(2)	{		padding-top: 5px;	}
	.membres td:nth-child(2)	{		text-align: left;		font-style: italic;		font-size: 0.7em;		padding-bottom: 5px;	}}
/* -------------------------------------------------------------------------- *//*                               PRODUCTIONS                                  *//* -------------------------------------------------------------------------- */
.lcp_catlist li{    list-style: decimal-leading-zero;    line-height: 1.7em;    margin: 15px 0;}/* -------------------------------------------------------------------------- *//*                              CERTIFICATION                                 *//* -------------------------------------------------------------------------- */
.organisme_container{	margin-top: 20px;}
.organisme_logo{	display: inline-block;	margin-right: 30px;	margin-bottom: 20px;}
.organisme_logo img{	max-height: 120px;	-webkit-transition: all .1s linear;	-moz-transition: all .1s linear;	-ms-transition: all .1s linear;	-o-transition: all .1s linear;	transition: all .1s linear;}
.organisme_logo:hover img{	transform: scale(1.2);}
.organisme_logo .legende{	color: #888;	font-size: 0.6em;	text-align: center;	padding-top: 10px;}
@media screen and (max-width: 599px){	.organisme_logo	{		width: calc(33% - 30px);		vertical-align: top;	}
	.organisme_logo:nth-child(3n)	{		margin-right: 0;	}}
/* -------------------------------------------------------------------------- *//*                               REUNIONS                                     *//* -------------------------------------------------------------------------- */
.ecs-event-list{    list-style: none;	margin-bottom: 50px;}.entry-title.summary{    display: block;}#legend{    display: none;}@media screen and (min-width: 1200px){	.entry-title.summary	{		display: inline;	}	.duration.time	{		float: right;	}}.topic{	background-color: #e6e6e6;	padding: 10px 20px;	font-weight: bold;	margin-bottom: 25px;}
.topic p{	font-weight: 300;}
@media screen and (max-width: 1199px){	.topic td	{		display: block;		text-align: left !important;	}}
/* -------------------------------------------------------------------------- *//*                                  FAQ                                       *//* -------------------------------------------------------------------------- */
.gris{	padding: 20px;	background-color: #e6e6e6;	margin-top: 20px;}
h2.faq{	color: #e40513;}
h2.faq:hover{	color: #a3030d;}
/* -------------------------------------------------------------------------- *//*                             FORMULAIRES                                    *//* -------------------------------------------------------------------------- */
form hr{	color: white;	background-color: white;	height: 1px;	border: 0;	width: calc(100% + 40px);	margin-left: -20px;	margin-top: 30px;	margin-bottom: 30px;}form h3{	font-size: 1em;	margin: 10px 0;}form,form h4{	font-size: 0.8em;}.search-field,input[type="text"],input[type="email"],input[type="date"],input[type="url"],div.wpcf7-response-output,textarea,select{	border: none;	font-size: 1.15em; /* 14pt */	font-family: 'Open Sans', sans-serif;	padding: 10px;	width: 100%;}
/* Extension Contact Form */form .search-field,.wpcf7-form input[type="text"],.wpcf7-form input[type="email"],.wpcf7-form input[type="date"],.wpcf7-form input[type="url"],.wpcf7-form textarea,.wpcf7-form select{	border: 2px solid #44aca1;}div.wpcf7-validation-errors,div.wpcf7-acceptance-missing{	border: 2px solid #e40513;	color: #e40513;}div.wpcf7-mail-sent-ok{	border: 2px solid #44aca1;	color: #44aca1;}form .search-field:focus,.wpcf7-form input[type="text"]:focus,.wpcf7-form input[type="email"]:focus,.wpcf7-form input[type="date"]:focus,.wpcf7-form input[type="url"]:focus,.wpcf7-form textarea:focus,.wpcf7-form select:focus{	background-color: #d8f0ec;}
.wpcf7-form label{	font-weight: bold;	font-size: 0.8em;	padding-bottom: 10px;	display: block;}
.wpcf7-form label.obligatoire:after{	content: "*";	color: #e40513;}
span.wpcf7-list-item{    display: block;}.wpcf7-list-item-label{    font-weight: 300;    font-size: 1.5em;}	.wpcf7-form input[type="url"]{    max-width: 500px;}.wpcf7-form .ou{	padding: 0 20px;}