@charset "UTF-8";
/* CSS Document */


html, html * {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

html {
	background-color: #a9c6b7;
}

footer {
	text-align: center;
	padding: 20px;
	color: #808080;
	background-color: #000;
}

body {
	background:#a9c6b7;
	background-image: url(../photos/fond.jpg);
	background-repeat: repeat-x;
/*	background-attachment: fixed;*/
	background-position: 50% 0%;
}

main {
	margin-left: auto;
	margin-right: auto;
	min-width: 300px;
	/*background-color: #FFFFFF;*/
}

a {
	text-decoration: none;
}

p .footer-lien {
	width: 300px;
	text-align: center;
	margin-left: auto; margin-right: auto;
}

.photo-size-max-1, .photo-size-max-2, .photo-size-max-4 {
	width: 100%;
	max-width: 100%;
	vertical-align: middle;
	height: auto;
}

.style-logo {
	margin-left: auto;
	margin-right: auto;
	display: block;
	padding: 0px;
	width: 200px;
}

#menu {
}

nav.style-nav {
	z-index: 100;
}

.style-nav ul {
	list-style-type: none;
	background-color: #000;
	width: 100%;
}

.style-nav a {
	text-decoration: none;
	color: #a9c6b7;
	text-align: center;
	display: block;
	text-transform: uppercase;
	padding: 12px 15px 0px 15px;
	height: 40px;
}

.style-nav a:hover {
	background-color: #dfd6aa;
	color: #000;
}




.style-nav-colonne nav {
	display: block;
	width: inherit;
}
.style-nav-colonne ul {
	vertical-align: middle;
	list-style-type: none;
	font-size: 18px;
	font-weight: 300;
	text-align: left;
	width: inherit;
}
.style-nav-colonne li {
	height: auto;
	width: inherit;
	padding: 10px 0px;
}
.style-nav-colonne a {
	text-decoration: none;
	color: #FFF;
	text-transform: uppercase;
	padding: 10px 20px 10px 0px;
	border-radius: 0px 20px 20px 0px;
}
.style-nav-colonne a:hover {
	background-color:#dfd6aa;
	color: #000;
}



.style-nav-off {
	padding: 12px 15px 0px 15px;
	height: 40px;
}


#survol {
	visibility: hidden;
	cursor: pointer;
	background-color:rgba(255,255,255,0.80);
	height: 75%;
}

.fixedTop {
	position: fixed;
	top:0;
	width: 100%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.picto {
	vertical-align:middle;
	margin: 0px 10px;
	color: #FFFFFF;
}

.picto_toit {
	opacity:0.3;
}
.picto_toit:hover {
	opacity:1.0;
}

.zone-protect {
	margin: 25px;
}

.button_picto {
	border: 2px #FFFFFF solid;
	padding: 8px 0px 12px 0px;
	border-radius: 10px;
	color: #FFFFFF;
	text-decoration: none;
}
.button_picto:hover {
	background-color: rgba(255, 255, 255, 0.3);
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); 
	cursor: pointer;
}

.button {
	border: 2px #FFFFFF solid;
	padding: 8px 30px 8px 14px;
	border-radius: 30px;
	color: #FFFFFF;
	text-decoration: none;
}
.button:hover {
	background-color: rgba(255, 255, 255, 0.3);
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); 
	cursor: pointer;
}

.button-sombre {
	border: 2px #000000 solid;
	padding: 8px 30px 8px 14px;
	border-radius: 30px;
	color: #000000;
	text-decoration: none;
}
.button-sombre:hover {
	background-color: rgba(255, 255, 255, 0.5);
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); 
	cursor: pointer;
}

.cartouche-sombre {
	border: 2px #000000 solid;
	padding: 8px 14px 8px 14px;
	border-radius: 30px;
	color: #000000;
	text-decoration: none;
}


.info-box-transparent {
	color: #000;
	padding: 20px;
	text-align: center;
	height: 100%;
    display: flex;
    align-items: center;
}

.info-box-blanc {
	background-color: #FFFFFF;
	color: #000;
	padding: 20px;
	text-align: center;
	height: 100%;
    display: flex;
    align-items: center;
}

.info-box-gris {
	background-color: rgba(0,0,0,0.08);
	color: #000;
	padding: 20px;
	text-align: center;
	height: 100%;
    display: flex;
    align-items: center;
}

.info-box-clair {
	background-color: #dfd6aa;
	color: #000;
	padding: 20px;
	text-align: center;
	height: 100%;
    display: flex;
    align-items: center;
}

.info-box-moyen {
	background-color:#8db9a2;
	color: #000;
	padding: 20px;
	text-align: center;
	height: 100%;
    display: flex;
    align-items: center;
}

.info-box-fonce {
	background-color: #52645a;
	color: #FFF;
	padding: 20px;
	text-align: center;
	height: 100%;
    display: flex;
    align-items: center;
}

.info-box-menu {
	background-color: #000;
	color: #FFF;
	text-align: center;
	height: 100%;
	padding-top: 30px;
	
}

.centrage {
	text-align: center;
	vertical-align: middle;
	width: 100%;
}

.footer-text a, .footer-lien a {
	color: #FFF;
}
.footer-text a:hover, .footer-lien a:hover {
	color: #FFF;
	text-decoration: underline;
}

.footer-lien {
	width: 150px;
	margin-left: auto;
	margin-right: auto;
}

.col {
	width: 100%;
}

.col-menu-catalogue {
	width: 100%;
	margin-bottom: 10px;
}

.col-liste-catalogue {
	width: 100%;
}

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

.row:after {
	clear: both;
}

.cote-a-cote {
	float: left;
}

.retour {
	clear:both; height: 0; overflow: hidden;
}

.map-responsive {
overflow:hidden;
padding-bottom:80%;
position: relative;
height:0;
}

.map-responsive iframe {
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}

#menu-liste {
	display: block;
	color: #FFFFFF;
}


#menu-ligne {
	display: none;
}


/* -----------------  Affichage menu sur mobile  --------------------- */
#toggle-block {
	display: none;
}
/* le bloc invisible */
#my-block{
    max-height: 0px;
    opacity: 0;
    transition: all 1s;
		background-color: #2D2D35;
	display: none;
}
/* le bloc visible */
#toggle-block:checked + #my-block{
    max-height: 300px;
    opacity: 1;
    transition: all 1s;
	display: block;
}
/* -------------------------------------- */

/*big mobil View*/

@media (min-width: 512px){
	
	main {
		max-width: 768px;
	}
	
	.col-menu-catalogue {
		width: calc(50% - 5px);
		height: auto;
		float: left;
		margin-right: 5px;
	}
	
	.col-liste-catalogue {
		width: calc(50% - 5px);
		height: 100%;
		float: left;
		margin-left: 5px;
	}
	
	.col-one-six {
		width: 25%;
		float: left;
	}
	.col-one-two {
		width: 50%;
		/*text-align: center;*/
		height: 300px;
		padding: 0px 5px 10px 5px;
	}
}

/*Tablet View*/

@media (min-width: 768px){
	
	main {
		max-width: 1024px;
	}
	
	.style-logo {
		width: 250px;
	}
	
	.style-nav li {
		display: inline-block;
	}
	
	.style-nav ul {
		text-align: center;
	}
	
	
	/* taille menu fixe */
	.fixedTop {
		width: 100%;
	}
	/* -----------------*/
	
	#menu-liste {
		display:none;
	}
	
	#menu-ligne {
		display: inline-block;
	}
	
	.col-md-one-half {
		width: 50%;
		text-align: center;
		height: 400px;
		padding: 0px 5px 10px 5px;
	}
	
	.photo-size-max-1 {
		width: calc(100% - 10px);
		height: auto;
	}
	
	.photo-size-max-2, .photo-size-max-4 {
		height: 390px;
	}
	
	.col {
		float: left;
	}
	
	.col-one-six {
		width: 20%;
		float: left;
	}
	
	.col-menu-catalogue {
		width: 33%;
		margin-right: 0;
	}
	
	.col-liste-catalogue {
		width: 66%;
		margin-right: 0;
	}
	
	.col-one-three {
		width: 33%;
		/*text-align: center;*/
		height: 300px;
		padding: 0px 5px 10px 5px;
	}
	.col-two-three {
		width: 67%;
		/*text-align: center;*/
		height: 300px;
		padding: 0px 5px 10px 5px;
	}
	
	.col-one-two {
		width: 50%;
		/*height: 300px;*/
		padding: 0px 5px 10px 5px;
	}
	
	.footer-lien {
		width: 300px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.map-responsive {
		padding-bottom:55%;
	}
}

/*Desktop View*/

@media (min-width: 1024px){
	
	main {
		max-width: 1200px;
	}
	
	.style-logo {
		/*float: left;  */
		width: 300px;
	}
	
	#marge-top-menu {
		/* height: 130px; */
	}
	
	#menu-liste {
		display:none;
	}
	
	#menu-ligne {
		display: inline-block;
	}
	
	/* taille menu fixe */
	.fixedTop {
		width: 100%;
	}
	
	/* ---------------- */
	.style-nav {
		/* float: right; */
	}

	.photo-size-max-2 {
		height: 390px;
	}
	.photo-size-max-4 {
		height: 290px;
	}
	
	.col-one-six {
		width: 15%;
		float: left;
	}
	
	.col-lg-one-fourth {
		width: 25%;
		/*text-align: center;*/
		height: 300px;
	}
	
	.map-responsive {
		padding-bottom:40%;
	}
	
	.col-menu-catalogue {
		width: calc(25% - 5px);
	}
	
	.col-liste-catalogue {
		width: calc(75% - 5px);
	}
}