@charset"utf-8";
html, body, div, h3, p, ul, li, img{margin:0;padding:0;} 
article, aside, figure, footer, header, hgroup,
menu, nav, section {display: block;}

body{background:#DCDCDC;  font-family: 'Lato', Arial, Tahoma, Helvetica, sans-serif;}
body{background-image:url(fond.jpg);}
html, body, div, h3, p, ul, li, img{margin:0;padding:0;}

#toutes_img{	
			width:780px;
			float:left;
			padding:30px 0px 0px 0px;
			margin-bottom:0px;
}
#section{clear:both;}/* tient les images en lignes*/
#content{width:960px;margin:0 auto;background:#fff;}
   
.box{	
		width:187px;
		height:250px;
		background:#fff;
		float:left;
		margin:10px 73px 55px 0px;
}
.boxh{	
		width:210px;
		height:139px;
		background:#fff;
		float:left;
		margin:20px 50px 20px 0px;
}

a img{border:none;border:0;}

.box img {opacity: 1;filter: alpha(opacity=100); }/* For IE8 and earlier */
 
.box img:hover {opacity: 0.8;filter: alpha(opacity=80); text-decoration:none;}/* For IE8 and earlier */
 
.box a{text-decoration:none;color:#000;}
	
#header{
		background:#fff;
		height:120px;	
		text-align:left;
		text-transform:uppercase;
		padding:0px 0px 0px 10px;
		word-spacing:1px;
		display:block;
		width:950px;
		font-family:'Lato',Arial, Tahoma, Helvetica, sans-serif;
		font-style:normal;
		letter-spacing:1px;			
}

div#header p{
			color:#708090;
			text-align:left;
			text-transform:uppercase;
			padding:30px 0px 0px 0px;
			word-spacing:1px;
			display:block;
			font-size:45px;
			font-family: 'Lato', Arial, Tahoma, Helvetica, sans-serif; 
			font-style:normal;
			letter-spacing:1px;	
			border-bottom: 0.5px solid #DCDCDC;	
}
div#header p  span.red {
			color: #FFA500;		
			padding:0px 0px 0px 0px;
			font-size:45px;		 
			font-family:'Lato', Arial, Tahoma, Helvetica, sans-serif;
			font-weight:normal;
			letter-spacing:1px;	
						
}
div#header p.deux   {
			text-transform:inherit;
			color:#808080;		
			padding:0px 0px 0px 0px;
			word-spacing:1px;
			display:block;
			font-size:15px;		 
			font-family:'Lato', Arial, Tahoma, Helvetica, sans-serif;
			font-weight:normal;
			letter-spacing:1px;	
			border-bottom: none 0px;			
}   
															
.clear{clear:both;}

div#menu{
		text-align:left;
		width:180px;
		height:100%;			/*"%" marche pas!!!!*/
		padding:30px 0px 0px 0px;
		margin:0px;
		display:block;
		float:left;
}
div#menu ul{	
		display:block;
		width:160px;
		list-style-type:none;
		padding:0px 0px 0px 5px;
		text-align:left;
		}
div#menu  li{
		margin:15px 0px 0px 8px;
		font-family:'Lato', Arial,Tahoma,Helvetica,sans-serif;
		font-style:normal;
		font-size:15px;
		text-transform:capitalize;
		display:block;		
		background: #fff;		
}

div#menu span{
		margin:0px 0px 0px 0px;
		padding:0px 0px 0px 0px;
		border-left:0px; 
		text-align:left;
		color:#708090;
		font-family:'Lato', Arial,Tahoma,Helvetica,sans-serif;
		font-style:normal;
		font-size:15px;
		text-transform:capitalize;
		display:block;

		background: #fff;
}


div#menu a{color:#000; text-decoration:none;}

div#menu  a:hover{color:gray;text-decoration:none;}

div#footer{ 		
background:#708090;
height:30px;
padding-top:8px;
padding-left:15px;
border-top:20px  solid #fff;/*pour l'espace entre  img*/
text-align:left;
color:#fff;
font-size:17px;
font-style:normal;
font-family:'Lato',Arial, Tahoma, Helvetica, sans-serif;
clear:both; 
			/*tient footer en bas, le meme effet avec div,clear:both apres dernier div du box*/
}
div#footer span{ 		
text-transform:uppercase;
color:#fff;
font-style:normal;			
}

div#footer a{color:#fff;text-decoration:none;}

div#footer  a:hover{color:#9400D3;text-decoration:none;}
