html, body{
	height:100%;
	padding:0;
	margin:0;
	color:#777;
	font-family:Comic Sans, Comic Sans MS, cursive;
	text-shadow:1px 1px 0 #fff;
	font-weight:normal;
	background-image:url('img/logos/fond1.jpg');
	background-repeat:no-repeat;
}

/*En tête*/
header{
	padding:0;
	margin:0;
}

#logo{
	position:relative;
	display:inline-block;
	top:20px;
	left:15px;
	width:162px;
	height:110px;
	background:url('img/logos/logo.png');
}

#sagne{
	position:absolute;
	display:inline-block;
	top:20px;
	right:50px;
}

#sagne:hover{
	top:25px;
}

/*menu de navigation*/
nav ul{
	position:absolute;
	top:20px;
	left:25%;
	list-style-type: none;
	width:60%;
	padding:0;
	margin:0;
}

ul.menu2 {
	display:none;
}
	
ul.menu1 li{
	display:inline-block;
	background-color:#e0dada;
	box-shadow: 3px 3px 3px 3px #aaa;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	vertical-align:top;
	width:120px;
	height:30px;
	padding:8px 0 0 0;
	margin:30px 5px 0 5px;
	list-style-type:none;
	text-align:center;
	font-size:0.9em;
}

ul.menu1 li:hover{
	font-size: 1em;
}

ul.menu1 #actif, ul.menu1 #actif a{
	color:#fff;
	background-color:#701100;
}

ul.menu1 a{
	text-decoration:none;
	color:#2f4f4f;
}

/*Section*/
#diapo{
	width:676px;
	height:506px;
	margin:0 auto 0 auto;
	border: 5px solid #fff;
	box-shadow: 8px 8px 12px #aaa;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	background-color:#fff;
}

/*Contact, adresse, horaires, géolocalisation*/

#réduit {
	display:none;
}

#magasin{
	position:absolute;
	background-image:url('img/logos/fond.jpg');
	width:250px;
	height:141px;
	top:200px;
	right:15px;
	border: 5px solid #fff;
	box-shadow: 8px 8px 12px #aaa;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

#carte{
	position:absolute;
	right:15px;
	top:400px;
	border: 5px solid #fff;
	box-shadow: 8px 8px 12px #aaa;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

#fb{
	position:absolute;
	top:160px;
	left:30px;
	width:130px;
	height:50px;
	background:url('img/logos/facebook.png')*
}

.contact {
	display:none;
}

#coord{
	position:absolute;
	top:250px;
	left:15px;
	color:#2f4f4f;
}

.md{
	color:#87331b;
	font-size:1.4em;
}

#horaires{
	position:absolute;
	left:15px;
	top:450px;
	color:#2f4f4f;
}

@media all and (max-width: 1350px) {
	
	/*Masquer Contact, adresse, horaires, géolocalisation*/
	#magasin, #carte, #coord, #horaires {
		display:none;
	}

	/*positionnement V2 Contact, adresse, horaires, géolocalisation*/
	#réduit {
		display:block;
		width:676px;
		margin:40px auto 0 auto;
	}
	
	#coord2 {
		display:inline-block;
	}
	
	#horaires2 {
		position:absolute;
		display:inline-block;
		margin:0 auto 0 80px;
	}
	
	#maca{
		margin-top:30px;
	}
	
	#magasin2{
		display:inline-block;
		background-image:url('img/logos/fond.jpg');
		width:250px;
		height:141px;
		margin:59px 0 40px 0;
		border: 5px solid #fff;
		box-shadow: 8px 8px 12px #aaa;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
	}
	
	#carte2{
		position:absolute;
		display:inline-block;
		margin:0 auto 0 80px;
		border: 5px solid #fff;
		box-shadow: 8px 8px 12px #aaa;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
	}
	
	/*Reposition Facebook*/
	#fb {
		left:20px;
	}
	
	.contact {
		display:block;
		text-decoration:none;
		color:#af6369;
		margin-left:15px;
		font-size:0.9em;
	}
	
	
	/*Reposition Diapo*/
	#diapo{
		margin:40px auto 0 auto
	}
}

@media all and (max-width: 1020px) {
	
	/*Masquer Contact, adresse, horaires, géolocalisation*/
	#magasin, #carte, #coord, #horaires {
		display:none;
	}
	
	/*Reposition Facebook*/
	#fb {
		position:absolute;
		display:inline-block;
		top:40px;
		left:420px;
	}
	
	.contact {
		display:block;
		text-decoration:none;
		color:#af6369;
		margin-left:15px;
		font-size:0.9em;
	}
	
	/*Reposition Diapo*/
	#diapo{
		margin:40px auto 0 auto
	}
	
	
	/*Reposition et modif menu*/
	ul.menu1{
		display:none;
	}
	
	ul.menu2{
		display:block;
		list-style-type:none;
		margin:0;
		padding:0;
		top:30px;
		left:220px;
	}
	
	ul.menu2 li {
		color:#777;
		font-size:1em;
	}
	
	ul.menu2 li:hover {
		font-size:1.2em;
	}
	
	ul.menu2 #actif {
		font-size:1.2em;
	}
	
	ul.menu2 #actif a {
		color:#701100;
	}
	
	ul.menu2 li a {
		text-decoration:none;
		color:#777;
	}
}

@media all and (max-width: 700px) {
	
	/*Masquer Contact, adresse, horaires, géolocalisation*/
	#magasin, #carte, #coord, #horaires, #fb {
		display:none;
	}
	
	/*Reposition Diapo*/
	#diapo{
		margin:40px auto 0 auto
	}
	
	/*Reposition logo Sagne*/
	#sagne{
		position:absolute;
		display:inline-block;
		top:20px;
		left:550px;
	}
	
	#sagne:hover{
		top:25px;
	}	
	
	/*Reposition et modif menu*/
	ul.menu1{
		display:none;
	}
	
	ul.menu2{
		display:block;
		list-style-type:none;
		margin:0;
		padding:0;
		top:30px;
		left:220px;
	}
	
	ul.menu2 li {
		color:#777;
		font-size:1em;
	}
	
	ul.menu2 li:hover {
		font-size:1.2em;
	}
	
	ul.menu2 #actif {
		font-size:1.2em;
	}
	
	ul.menu2 #actif a {
		color:#701100;
	}
	
	ul.menu2 li a {
		text-decoration:none;
		color:#777;
	}
}

/*@media all and (max-device-width: 480px) {
	#magasin, #carte, #coord, #horaires, #fb {
		display:none;
	}
}