@font-face { 
  font-family: 'lato'; 
  src: url('Lato-Light.ttf'); 
}


body
{
	background : url(images/WALL.png) no-repeat center center fixed;
	background-size: cover;
	color : #b1b1b1;
	font-family: 'Lato',sans-serif;
	margin: 0;
	text-align: center ;
	
}

div#conteneur
{
	margin: 40px auto 40px auto;
	width: 1200px ;
    text-align: center ;
	background : #fefefe;
	box-shadow: inset 0 0 30px #ededed, 0 0 25px #a7a4a4;
	border-style: solid;
	border-color: #FEFEFE;
    border-width: 1px 1px 1px 1px;
}

div#header
{
height: 80px;

}

div#header-left{
height: 80px;
width: 270px;	
float: left;
padding: 10px 0px 5px 0px;

}

div#header-right{
height: 80px;
width: 850px;
float: right;	
margin: 0px 0px 0px 0px;
padding: 35px 80px 0px 0px;

}

div#line{
width: 1000px;
margin: 15px auto; 
border-style: solid;
border-color: #B1B1B1;
border-width: 0px 0px 2px 0px;


}

div#logo
{
background-image: url(images/logo_continental.png);
float : left ;
height: 70px;
width: 230px;
margin: 0px 0px 0px 30px ; 
background-size: cover;
}


div#logo-index
{
background-image: url(images/logo_continental.png) ;
margin: 70px 0px 60px 0px;
margin-left: auto;
margin-right: auto;
height: 98px;
width: 322px;
background-size: cover;
}

a.logo-seat
{
background-image: url(images/AFTER-SEAT.png);
display: block;
background-size: cover;
height: 100px;
width: 100px ;	
}

a.logo-suzuki
{
background-image: url(images/AFTER-CUPRA.png);
display: block;
background-size: cover;
height: 100px;
width: 100px ;	
}


a.logo-skoda
{
background-image: url(images/AFTER-SKODA.png);
display: block;
background-size: cover;
height: 100px;
width: 100px ;	
}




a.slide-seat
{
background-image: url(images/BEFORE-SEAT.png);
display: block;
background-size: cover;
height: 200px;
width: 133px ;		
}

a.slide-seat:hover
{
background-image: url(images/AFTER-SEAT.png);
}

a.slide-suzuki
{
background-image: url(images/BEFORE-CUPRA.png);
display: block;
background-size: cover;
height: 200px;
width: 133px ;	
}

a.slide-suzuki:hover
{
background-image: url(images/AFTER-CUPRA.png);
}

a.slide-skoda
{
background-image: url(images/BEFORE-SKODA.png);
display: block;
background-size: cover;
height: 200px;
width: 133px ;	
}

a.slide-skoda:hover
{
background-image: url(images/AFTER-SKODA.png);
}

div#vignettes{
	
	display: inline;
	height: 200px;
	width: 1200px ;
}

div#vignettes table{
	
margin: 0px auto;
}

div#vignettes table tr th a{
	
	margin: 40px auto;
	margin-right: 50px ;
	margin-left : 50px;
}


div#navigation {
float: right;
height: 80px;
padding: 30px 0px 0px 0px ;


}

div#navigation ul {
display: inline;
list-style: none;
padding: 0px 0px 0px 0px ;


}

div#navigation ul li {
  display: inline;
  margin-right: 20px ;
  color: #727272 ;
  font-weight: 700;
  font-family: 'Lato',sans-serif;
  font-size: 20px;

}

div#navigation ul li a{
  text-decoration: none;
  color: #727272 ;
}

div#navigation ul li a:hover{
  text-decoration: none;
  color: #4570A1 ;
}

div#centrer
{
margin-top: 50vh;
	transform: translateY(-50%);	
}

div#contenu
{
	
	width: 350px;
	text-align: center ;
	margin-top: 50vh;
	transform: translateY(-50%);
	margin-left: auto;
    margin-right: auto;
	border-radius: 3px;
	box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 3px 10px 20px 6px rgba(0, 0, 0, 0.4);
	padding-bottom: 1px;
	margin-bottom: 40px;
	background: rgba(255,255,255,0.6); 
	padding-top : 30px;
	
}

div#contenu p 
{
	margin: 0px auto;
}

p.title
{
	color: #000000 ;
	font-family: 'lato'; 
	font-weight: bold;
	float : left;
	padding-left : 15px;
	
}

div#bandeau1
{
	height: 30px;
	padding-top: 10px;
	border-radius: 5px 5px 0px 0px;
	background: rgb(238,238,238); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(238,238,238,1) 0%, rgba(204,204,204,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
	border-style: none none solid none;
	border-width: 2px;
	margin-bottom: 20px;
}


p.left
{
	float : left;
}

p.titreleft
{
	float : left;
	padding-top : 3px;
	padding-left : 15px;
	color : #4570A1;
	font-family: 'lato'; 
	font-weight: bold;
	
}

div#ligne{
padding-bottom: 20px;
}


h3
{
	color : #4570A1;
	display: block;
    font-size: 1.17em;
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
}


div#titre{
color: #4570A1 ;
}


.input200 {
	
  background: #EFF0F0 url(images/login-sprite.png) no-repeat;
  color: b1b1b1;
  width: 300px;
  height: 40px;
  padding: 0 28px; /* Décallage du texte dans la barre de recherche */
  border: 2px solid #EFF0F0;
  border-radius: 4px;
}
.input200:focus {
  border: 2px solid #4570A1;
  outline: none;
}


.ex1 a {
	position: relative;
	top: 0;
	transition: all 0.2s ease-in;
}

.ex1 a:hover,
.ex1 a:focus {
	top: -4px;
	transform: scale(1.1);
	
}




.btn {
  background: #4570A1;
  color : fefefe;
  border-radius: 4px;
  border: 1px solid #4570A1;
  font-size: 15px;
  padding: 10px 18px 10px 18px;
}

.btn:hover {

background: #fefefe;
border: 1px solid #4570A1;
color : #4570A1;
cursor: pointer;
}

#user
{
    background-position: 4px -7px !important;
}

#password
{
    background-position: 4px -55px !important;
}