body, html{
    margin: 0;
    height: 100%;
    font-size:0;
    background-color:black;
    font-family: 'Lato', sans-serif;
	min-width:400px;
	min-height:400px;
	}
	
	ul{
    list-style: none;
	}
	
	#menu li a{
	display:block;
	padding:8px 0;
	line-height:14px;
	}
	.espace{
	line-height:3px;
	}
	
	
	.vincent{
	margin-left: 10%;
	padding:0;
	font-size: 17px;
	line-height:15px;
	margin-bottom: 30%;

	}
	

	#menu ul{
	padding:0;
	
	}
	
	#galeries{
	margin-left:10%;
	}

	ul#galerie{
    padding: 0;
    margin: 0;
    height: 100%;
    white-space:nowrap;
    min-height: 100%;
	}
	
	ul#lien{
	position:absolute;
	width:100%;
	bottom:25px;
	padding-left:10px;
	}
	
	ul#lien li{
	float:left;
	padding-right:2%;
	}
 
 
 
 	ul#lienb{
	position:absolute;
	width:100%;
	bottom:40px;
	padding-left:22%;
	}
	
	ul#lienb li{
	float:left;
	padding-right:3.1%;
	font-size:16px;
	}
 
 .mentions{
	position: absolute;
	color: grey;
	bottom: 30px;
	width: 120px;
	height: 30px;
	left: 460%;
	font-size: 12px;
	
	}

 
 
 
 
 
 
 
 #retourtirages{
padding-left: 43%;
opacity: 0.7;
}
  #retourpeintes{
padding-left: 43%;
opacity: 0.7;
}
  #retourtirages:hover{
opacity: 1;
}
  #retourpeintes:hover{
opacity: 1;
}
 
 
 
 
	ul#galerie li{
    display: inline;
    height: 100%;
    margin: 0;
    padding: 0;
	}
 
	ul#galerie li img{
    height: 100%;
	}
	#menu{
	padding-top:2%;
	background-color: rgba(0,0,0, 0.6);
	width:20%;
	height:100%;
	font-size:16px;
	position:fixed;
	color:white;
	opacity:0.9;
	font-variant:small-caps;
	min-width:77px;
	min-height:750px;
	}	

	ul#galerie{
	margin-left:20%;
	}



											
	a{
	text-decoration:none;
	text-shadow:1px 1px 1px #555;
	color:#555;
	}
	a:hover,a.active{
	color:#fff;
	text-shadow:none;
	}
	
	
	
	#menu{
	float:left;
	}
	
	
	#propos{
	color:white;
	opacity:0.7;
	float:left;
	width:34%;
	height:100%;
	margin-left:24%;
	font-size:14px;
	font-variant:small-caps;
	padding-left:2%;
	text-indent:2%;
	height:100%;
	}
	#propos p:first-child{
	margin-top:30%;
	}
	
	.fond{
	background-color:#303030;
	}
	
	#galerieo li{
	height:100%;
	font-size:15px;
	color:white;
	padding-bottom: 1%;
	opacity:0.7;
	font-variant:small-caps;
	margin-left:24%;

	}
	#galerieo li:first-child{
	padding-top:7%;
	}

	h5{
	margin:1%;
	}

.retour{
padding-left:2%;
}
#marge{
	position:absolute;
	bottom:25px;	
}



.contact{
	font-size:16px;
	color:white;
	padding-bottom: 1%;
	opacity:0.7;
	font-variant:small-caps;
	margin-left:26%;
	padding-top: 7%
	}




#tel {
    font-size: 13px;
}


form {
    width: 400px;
    padding: 1em;

}


form div + div {
    margin-top: 0.1em;
}

label {
    display: inline-block;
    width: 90px;
    text-align: right;

}

input, textarea {
    font-size: 1em ;
    font-family: 'Lato', sans-serif;
    width: 300px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #999;
}
input:focus, textarea:focus {
    border-color: white;
}
textarea {
	
	 margin-top: 0.1em;
    height: 10em;
    resize: vertical;
}
.button {
   
    padding-left: 90px; 
}

button:hover{
	color:grey;

}

#coordonnees{
	margin-left: 110px;
	color:grey;
	padding-left: 104px;

}

#copy{
	margin-left: 110px;
	margin-top: 1%;
	font-size:0.83em;
	padding-left: 104px;

}



/*-----------------------------------------------------------------------------------------------------*/




	@media screen and (max-width: 1180px){
	ul#lien li{
padding-left: 30px;
clear: both;

	}
		#retourpeintes img	{	
		margin-left: -16px;
			height: 110px;
			width: 110px;

		}
		#retourtirages img	{	
			margin-left: -16px;
			height: 110px;
			width: 110px;

		}



								}


	
	@media screen and (min-width: 1548px){
	ul#lien li{
		padding-right:4%;


	}
		#retourpeintes img	{	

			height: 110px;
			width: 110px;

		}
		#retourtirages img	{	

			height: 110px;
			width: 110px;

		}



								}



@media screen and (min-width: 1672px){
	ul#lien li{
		padding-bottom: 15px;
		padding-right:6%;
		font-size: 18px;

	}

	#mentions{
position: absolute;
color: grey;
bottom: 30px;
width: 120px;
height: 150px;
left: 460%;
font-size: 12px;


}

											}


@media screen and (min-width: 1818px){
	ul#lien li{
		padding-right:8%;}

			#retourpeintes img	{	

			height: 120px;
			width: 120px;

		

	}


	#retourtirages img	{	

	height: 120px;
	width: 120px;

		

	}
		#mentions{
position: absolute;
color: grey;
bottom: 70px;
width: 120px;
height: 200px;
left: 460%;
font-size: 12px;



}
											}


@media screen and (min-width: 1997px){
	ul#lien li{
		
		padding-right:10%;

	}
				
			#mentions{
		position: absolute;
		color: grey;
		bottom: 70px;
		width: 120px;
		height: 600px;
		left: 460%;
		font-size: 12px;


}										}


@media screen and (min-width: 2212px){
	ul#lien li{
		padding-right:12%;

	}

		#retourpeintes img	{	

			height: 115px;
			width: 115px;
			margin-left: 45px;

		}

		#retourtirages img	{	

			height: 115px;
			width: 115px;
			margin-left: 45px;

		}
											}


@media screen and (min-width: 2483px){
	ul#lien li{
		padding-right:14%;

	}
		
	#retourpeintes img	{	

			height: 115px;
			width: 115px;
			margin-left: 55px;

		}

			#retourtirages img	{	

			height: 115px;
			width: 115px;
			margin-left: 55px;

		}
						}