/*----------BASE----------*/
html, body{
	margin: 0 auto;
	padding: 0;
	background-color:#f2eee8;
	font-family: Roboto, Arial, Verdena, Geneva, sans-serif;
	font-size:14px;
	color: #353535;
}

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

a:hover{
	text-decoration: underline;
}

h1{
	font-size:20px;
}

h2{
	font-size:16px;
}

hr{
	color:#36a7de;
}

.justify{
	text-align:justify;
	font-style:italic;
	color:#36a7de;
	font-size:16px;
}

.justify_infos{
	text-align:justify;
}

.lien_fix{
	display:block;
	position:fixed;
	z-index:99;
	bottom:0px;
	width:100%; height:25px;
	color:#FFF;
	background-color:#e02724;
	opacity:0.7;
	font-weight:bold;
	text-align: center;
	line-height: 27px;
}
.lien_fix a{
	width:100%; height:25px;
	color:#FFF;
	text-decoration: none;
}

.lien_fix:hover{
	width:100%; height:25px;
	background-color: #e02724;
	opacity:0.9;
}
/*--------FIN-BASE--------*/

/*-----Bandeau haut avec le fond bleu--------*/
.bandeau_haut{
	margin:0 auto;
	padding: 3px 0 0 23%;
	height:18px;
	color:#FFF;
	background-color:#36a7de;
	font-style:italic;
	font-size:12px;
}

.fleche_bas{
	position: absolute;
	right:25%;
	z-index:100;
}
/*----FIN-Bandeau haut avec le fond bleu-----*/


/*---------HEADER---------*/
header{
	margin:0; 
	padding:5px 10px;
	background-color:#FFF;
	display: -moz-flex;
	display: -webkit-flex;
	display: -o-flex;
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	background-color: #FFF;
	-moz-box-shadow: 0px 6px 6px 0px rgba(2, 2, 2, 0.1);
	-webkit-box-shadow: 0px 6px 0px 0px rgba(2, 2, 2, 0.1);
	-o-box-shadow: 0px 6px 6px 0px rgba(2, 2, 2, 0.1);
	box-shadow: 0px 6px 6px 0px rgba(2, 2, 2, 0.1);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cbcbcb, Direction=180, Strength=6);
}

.element:nth-child(2){
	margin:0 10px;
	flex-grow: 0.35; 
}

.logo_avis_clients{
	height:90px;
	width:90px;
}

.evaluez{
	display:block;
	width:230px; height:25px;
	color:#FFF;
	background-color:#36a7de;
	font-weight:bold;
	text-align: center;
	line-height: 27px;
}
.evaluez a{
	color:#FFF;
	text-decoration: none;
}

.evaluez a:hover{
	padding:3px 25px;
	width:220px;
	background-color: #329acd;
}
/*-------FIN-HEADER-------*/

/*------PRESENTATION------*/
.presentation{
	max-width:1000px;
	margin: 20px auto;
	background-color:#fff;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items:top;
}		

		.colgauche{
			margin: 0 20px;
		}
		
		
		.coldroite{
			margin: 0 20px;
			
		}
		
		.logo_meslin{
			margin: 15px 0 0 0;
		}
		
		.fond1{
			background-color:#efefef;
		}
/*----FIN-PRESENTATION----*/


/*-------CONTENEUR--------*/

.conteneur{
	max-width:1200px;
	margin: 0 auto;
	display:flex;
	flex-wrap: wrap-reverse;
}
.picto_photo{display:inline-block; width:22px; height:auto; vertical-align:middle;margin:-4px 4px 0 0;}
		/*-------AVIS & NOTES--------*/
		.box:nth-child(1){			
		flex-grow:1;
		flex-basis:512px;
		padding:15px 15px;
		margin: 0 0;
		background-color:#fff;
		}
		
			.stars{
				margin:0 0 0 0;
				float:left;
			}

			.bluenote2{
				font-weight:bold;
				font-size:16px;
				color:#36a7de;
			}
			
			.avis{
				border: #2c88b5 1px dashed ;
				margin:20px 0 30px 0;
				background-color: #fbfbfb;
				padding:10px 10px;
			}
			
			.tri{
				margin:0 0 0 0;
			}
			
			.travaux{
				display:flex;
				flex-wrap:wrap;
				justify-content: space-around;
			}
			
			.button a{
				padding:5px 10px;
				margin:5px 10px;
				background-color:#fff;
				border:1px solid #36a7de;
			}
			
			.button a:hover{
				color:#fff;
				text-decoration:none;
				background-color: #36a7de;
				transition: background-color 0.7s linear;
			}
			
			.notation{
				margin:3px 0 0 140px;
			}
			
			.date{
				display:block;
				margin:-16px 0 0 0;
				font-style:italic;
				float:right;
			}
			
			.prestations{
				text-decoration:underline;
			}
			
			.nostyle{
				font-weight:normal;
				font-style:italic;
			}
			
			.photo{
				display:inline-block;
				float:right;
				vertical-align:middle;
				margin: 0 0;
			}

		.box:nth-child(2){
		flex-grow:1;
		flex-basis:100px;
		padding:0 15px;
		background-color:#fff;
		text-align:center;
		}
		
			.notemoyenne{
				font-size:12px;
				font-weight:normal;
				text-align:right;
			}
			.notemoyenne2{
				margin-top:-30px;
			}
						
			.note{
				margin:-10px 0 0 0;
				font-size:16px;
				text-align:right;
			}
			
			.bluenote{
				font-weight:bold;
				font-size:40px;
				color:#36a7de;
			}

			.notegenerale{
				float:right;
				margin:-10px 0 0 10px;
			}
			
			.infos, .qualif, .adresse, .contact{
			margin:35px 0 0 0;
			width:100%; height:28px;
			color:#FFF;
			background-color:#36a7de;
			text-align: center;
			line-height: 30px;
			}
			
			.list{
				margin : 10px 0 0 -15px;
				text-align:left;
				list-style-type : none;
			}
			
			.adress{
				text-align:left;
				margin:15px 0 0 10px;
			}
			
			.tel{
				display:inline;
				vertical-align:middle;
				margin: 0 5px;
			}
		
			.tele{
				display:inline;
			}
			
			.align{
				margin: 20px 0 0 0;
			}
			
		.boutons{display:flex; flex-wrap: wrap;}
		
			.visit{
				margin:15px auto;
				width:230px; height:25px;
				color:#FFF;
				background-color:#36a7de;
				text-align: center;
				line-height: 27px;
			}
			
			.visit a{
				color:#FFF;
				font-size:14px;
			}

			.visit a:hover{
				color:#FFF;
			}
			
			.map{
				margin:15px auto;
				width:230px; height:25px;
				color:#FFF;
				background-color:#ff4747;
				text-align: center;
				line-height: 27px;
			}
			
			.map a{
				color:#FFF;
				font-size:14px;
			}

			.map a:hover{
				color:#FFF;
			}
			
.bottominfos{
	padding:0 15px;
	text-align:center;
}

.fondbleu{
	width:100%;
	background-color:#36a7de;
}

.avistitre{
	margin:0 0;
	padding: 50px 0 15px 0;
	color: #353535;
	text-align:center;
	font-size: 20px;
	text-decoration:underline;
	font-weight:bold;
}
		
footer{
	display:flex;
	justify-content: space-around;
	flex-wrap:wrap;
	max-width:1000px;
	margin: 0 auto;
}

.certi{
	flex-basis: 250px;
	text-align:center;
	margin: 15px auto;
}

.serenite, .authenticite, .securite{
	color:#FFF;
}

.attestation{
	display:inline-block;
	color:#00acff;
	float:right;
}
.attestation a{
	color:#2c88b5;
}

.copy{
	text-align:center;
	display:block;
	padding:15px 0;
}

/*----Lien / Animation pour découvrir les notes-----*/

.less.active .button-read-more, .button-read-less  {display: none; color:#36a7de;}
.less.active .button-read-less {display: block; width:120px; color:#36a7de;}
.less a {color:#36a7de;}
.more {margin-top: 10px; margin-bottom:20px; line-height:30px;}
.more p {margin: 0;padding: 0}

	


/*----NAVIGATION SUR MOBILE----*/

@media screen and (min-width: 1001px)
{
	.bottominfos{display:none;}
	.notemoyenne2{display:none;}
}

@media screen and (max-width: 1000px)
{
	.site-container{width:auto;}
	.conteneur{width:auto;}
	.box{width:auto;}
	.box:nth-child(2){display:none;}
}