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


body{
	background-image:url(img/bg.png);
	font-family:Calibri, Helvetica, sans-serif;
	}
a{
	color:#000;
	text-decoration:none;
	font-weight:bold;
}

#menuTop li {
    display: block;
    text-align: center;
    margin: 0.1em 0 0 0;
    height: 2em;
    background-color: #ccc;
    padding-top: 0.5em;
}

header{
	text-align:center;
}
	
footer{
	text-align: center;
	background-color: #cccccc;
	padding:2%;
	margin: 0.55em 1em 0.55em 1em;;
}

#slide{
	display: none;
}



aside{
	display:none;
}

h1{
	font-size:20px;
	font-weight: bold;
	text-align:center;
	margin: 0.55em 0 0.55em 0;

}

.top{
	margin: 0.55em 1em 0.55em 1em;;
}

.bottom{
	text-align:center;
	margin: 0.55em 1em 0.55em 1em;
}

article.bottom img {
	width: 100%;
}

.reseaux{
	text-align: center;
	
}

}

@media screen and (min-width:481px)
   { 


body{
	background-image:url(img/bg.png);
	font-family:Calibri, Helvetica, sans-serif;
	}
a{
	color:#000;
	text-decoration:none;
	font-weight:bold;
}
a:hover{
	color:#c2c2c2;
}
#conteneur {
	max-width: 980px;
	margin: 0 auto;
	width:90%; /*980*/
}
#slide{
	margin-left: 10%;
	width: 81%;
	}
#logo{
	float:left;
	}
	
#menuTop{
	float:left;
	margin: 4% 0 2% 20%;
	}

#menuTop li{
	display: inline;
	margin-left: 3%;
}
h1{
	font-size:20px;
	font-weight: bold;
	text-align:center;
	margin-bottom: 1%;
	}
aside{
	float:left;
	width: 12.5em;
	margin-top:5%;
	}
article.top{
	margin-top:2%;
	float:right;
	width:60%;
	}
hr{
	clear: both;
	}
article.bottom{
	float:left;
	width: 12.5em;
	}
article.bottom:not(:first-of-type){
	margin-left:6%;
	}
footer{
	width:61.25em;
	text-align:center;
	margin-top: 1%;
	background-color: #ccc;
	height: 3%;
	}
#menuFooter{
	padding-top: 10px;
	}
footer a:nth-child(2){
	margin-left: 2%;
		}
figcaption, figure{
	text-align:center;
	font-style: italic;
	}
h2{
	text-align:center;
	}

   }