/******************************    RESPONSIVE DESIGN     ******************************/
@media screen and (max-width: 1200px) {
	#navigation li {
	margin: 0 1.8%;}

}

@media screen and (max-width: 1020px) {
	#top-bar{
		display: none;
	}
	

.max {
	width:98%;
	margin:0 auto;
}

.max-absolute {
width:100%;
max-width:100%;
margin-left:0;
left:0;

}

}

@media screen and (max-width: 960px) {
	#navigation li {
	margin: 0 1.3%;}

	#bloc-actu{
		margin-top: 15px;
		max-width:100%;
		padding-bottom:0px;
	}
}

@media screen and (max-width: 910px) {

#bloc-alaune{
width:100%;}

#bloc-meteo {
width:100%;
}

#bloc-meteo .meteo, #bloc-meteo .brown-button {

width: 200px;
margin:0 auto;
}

#logo a{
width:80%;
height:auto;
}

#contenu {
width:100%;
max-width: 100%;}

#sidebar {
width:100%;
max-width: 100%;}

#bloc-sidebar1, #bloc-sidebar2 {
	width:100%;
	margin:1em 0 0;
	position:relative;
	float:left;
	text-align:center;
}

#bloc-sidebar1 .brown-button, #bloc-sidebar1 .transp-button {
margin:0;}

#bloc-sidebar2 .bloc-blanc{
width:45%;
margin:0 2%;
position:relative;
float:left;
min-height:21em;}

#slideshow {
/*float:left*/;
}

#photo {
height:auto;}

.max-absolute {

float: left;
position: relative;
}

#bloc-actus {
width: 100%;
height: auto;}

.close-actu {
display:none;}

#baseline-photo {
position: relative;
width:100%;
text-align:center;
margin:0.5em 0;

}

#footer{
	padding-top: 0;
}

#footer .colonnes{
	float: none;
	max-width: 100% !important;
	width: 100%;
	margin: 0 0 15px !important;
}


}


@media screen and (max-width: 800px) {

#header {
height: auto;
background:none;
}

#in-header {
background:none;}

#photo {
margin-top: 0;
}

#navigation {
z-index:0;}
.open-menu {
	display:block;
	cursor:pointer;
	background:#3F3A36;
	width:100%;
	font-size:1.4em;
	color:#FFF;
	padding:0.5em 0;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#menu {
display:block;
}

#menu.grand-menu {
display:none;}

#menu-principal {
background:#FFF;}

#navigation li{
width:100%;
margin:0;}

#sidebar .transp-button, #bloc-sidebar1 .brown-button, #bloc-sidebar1 .transp-button {
font-size: 1.5em;}		

#map_canvas {
width: 94%;
height: 20em;
margin: 0 auto;
}


ul#liste-hebe .texte {
width: 65%;
}

ul#liste-hebe .photo {
width: 30%;
}

ul#liste-hebe li {
width: 100%;
margin: 0.5em 0;
}

}

@media screen and (max-width: 650px) {
#bloc-sidebar2 .bloc-blanc {
width: 100%;
margin:0.5em 0;
min-height: 0;
}

#slideshow img {
left:0 !important;
margin-left:0 !important;
width: 135%;
height: inherit;
}

.wpcf7 .col-left, .wpcf7 .col-right{
width:100%;}

.link-heba li{
	margin-bottom: 5px;
}

}


@media screen and (max-width: 580px) {
	#logo a{
		font-size: 4em;
	}

#bloc-milieu, #bloc-actus {
display:none;}

.home #bloc-milieu, .home #bloc-actus {
display:block;}


#top-bar {
background: #3F301E;
height: auto;
text-align:center;
position:relative;
float:left;
width:100%;
}

#top-bar .alignleft {
width:100%;
text-align:center;}

#top-bar .alignright {
width:100%;
text-align:center;
margin-bottom: 1em;
}

#top-bar ul {
float: none;
}

#in-header .left, #in-header .right {
width: 100%;
text-align: center;
padding-top: 0;
}

ul#liste-hebe .texte {
width: 50%;
}

ul#liste-hebe .photo {
width: 45%;
}

}

@media screen and (max-width: 520px) {
.item_clear .wth3{
	float: none;
	width: 100% !important;
	margin: 0;
}

span.wpcf7-list-item{
	display: block;
}

.wpcf7 .wth3 .wpcf7-number{
	width: 100%;
}

#bloc-alaune li {
width:80%;
padding:1%;
margin:1em 10%;
text-align:center;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform:rotate(0);
transform: rotate(0);
}

#bloc-alaune li:first-child {
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform:rotate(0);
transform: rotate(0);}


#bloc-alaune li:last-child {
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform:rotate(0);
transform: rotate(0);}

#bloc-alaune li:hover {
-webkit-transform: rotate(0) scale(1) ;
-moz-transform: rotate(0) scale(1);
-o-transform:rotate(0) scale(1);
transform: rotate(0) scale(1);
z-index:100;}

#bloc-alaune h1{
text-align:center;}
}


@media screen and (max-width: 450px) {
	.link-heba li{
		float: none;
		width: 100%;
		padding: 0 !important
	}
	
	.link-heba li .tabs_nav{
		width: 99%;
	}

	#logo a{
		font-size: 3.5em;
		padding: 10px 0 30px
	}

	#in-header > .max{
		position: relative;
		padding-bottom: 10px;
		background-color: #3F3A36;
	}

	ul#liste-hebe li {
		width: 96%;
	}
}
@media screen and (max-width: 400px) {
	.item_form{
		width: 100%;
		margin: 0 !important
	}

	#footer .colonnes {
	width: 100%;
	min-height: 0;
	text-align:center;
	}

	#top-bar .menu-contact{
	margin:1em 0;}
	#accommodation_box li > a{
		float: none;
		margin: 0 0 5px;
		display: block;
	}

	.galery_photo{
		padding: 5px 10px;
	}

	.galery_photo > .galphotos li{
		margin: 0 2% 10px 0;
		width: 48%;
	}

	.galery_photo > .galphotos li img{
		display: block;
		width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 300px) {
	.brown-btn, .transp-btn{
		font-size: 1.2em;
		padding: 0 10px
	}
	.brown-btn:hover, .transp-btn:hover{
		font-size: 1.3em
	}

	#bloc-sidebar1, #bloc-sidebar2{
		margin-top: 0;
	}

	#footer .colonnes.contact .inner{
		padding: 0.7em 0 15px;
	}
}