/*COMMUN*/

body, html{
    font-family: 'Quicksand', sans-serif;
    margin:0;
}

#header{
		background:rgb(0,0,0);
}

.margin-100{
    margin-top:100px;
}

.margin-50{
    margin-top:50px;
}

.margin-30{
    margin-top:30px;
}

.container a{
    text-decoration: none;
}
.lign-yellow{
    background:rgba(255,205,0);
    margin:auto;
    width:30px;
    height:5px;
}

.container-fluid{
    padding:0;
}

.fd-yellow{
    background:rgba(255,205,0);
    text-align: center;
}

.overlay-90{
    background:rgba(255,255,255,0.7);
}

.overlay{
    background:rgba(255,255,255,0.85); 
    min-height:200px;
}

.jaune{
    background:linear-gradient(to right,transparent,rgba(255,205,0,0.1),rgba(255,205,0,0.3),rgba(255,205,0,0.1), transparent);
}

.padding-60{
    padding:60px 0 0 0;
}

.padding-100{
    padding:100px 0 0 0;
}

.titre-page{
    background-image:url("/images/accueil/img-pr.jpg");
    background-size: cover ;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 200px;
}

.popup{
	width:800px;
	height:450px;
	border-radius:4px;
	overflow-y: hidden;
	padding:0 0 20px 10px;
}

.img-pr-inpage{
    width:100%;
    height:200px;
    background-image:url("/images/accueil/img-pr.jpg");
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
}

.img-pr-inpage h1{
    height:200px;
    text-align:center;
    color:#000;
    padding:80px 0 0 0;
    text-transform: uppercase;
}

.fd-black{
    background:#000;
}

/*HEADER.PHP*/

.navigation{
	margin-top:35px;
	text-align:left;
	height:40px;
	background:black;
	z-index:20;
}

nav a:link{
    text-decoration: none;
    color:#fff;
}

nav a:visited{
    text-decoration: none;
    color:#fff;
}

nav a:hover{
    color:rgba(255,205,0);
    text-decoration: none;
}

nav a.focus{
    font-weight:600;
    text-decoration:underline;
    color:rgb(255, 200, 24);
}

#htop{
    padding:20px 0 30px 0;
	height:120px;
	background:black;
}

#htop img{
    height:90px;
    display:inline;
}

#htop h4{
    margin:0;
    padding:5px 0 0 0;
    font-size: 24px;
	color:white
}

#htop p{
    text-align: center; 
}

#t1{
	text-align:center;
}

#t2{
	display:none;
	margin-top:10px;
}

#t2 h4{
	font-size:18px;
}

.tel{
    text-align:center;
}

.spantel{
    padding:5px 0 0 0;
}

nav{
   width:700px;
    padding:5px 0 5px 0;
}

nav ul{
    display:flex;
    justify-content: space-around;
}

nav li{
    font-weight: medium;
    list-style: none;
    padding:10px 10px 0 0;
	font-weight:700;
}

li i{
    padding:0 5px 0 5px;
}

.menu{
    width:100%;
}

#menu-r{
	display:none;
}

.icon{
	position: absolute;
	right: 30px;
	top :20px;
	z-index : 10000;
	display: none;
}

#top-r{
	display:none;
}

/*------------------------------FOOTER.PHP---------------------------------------*/

.fd-footer{
    background-image:url("/images/footer/fd-footer.jpg");
    background-position: top;
    background-size: cover;
}
.fd-footer a:visited{
    text-decoration:none;
    color:#fff;
}
.overlay-black{
    background:rgba(255,255,255,0.7);
}

.car{
    width:95%;
    margin:auto;
    text-align:center;
}

.car .col-car img{
    width:90%;
    display:block;
    margin:auto;
}

.fd-footer h1{
    font-size: 25px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 25px 0 0 0;
}

.fd-footer h3{
    font-size: 20px;
    margin:0;
}

.fd-footer h2{
    font-size: 20px;
    margin:0;
    text-align:left;
    padding:0 0 25px 0;
}

.col-footer{
    
    text-align: center;
    color:#000;
    padding:10px;
}

.col-footer h3{
    font-size:17px;
}

.menu-footer ul{
    display:flex;
    justify-content:space-around;
    margin:50px 0 0 0; 
    width:640px;
}

.menu-footer li{
    list-style: none;
    font-size:19px;
    transition: all 0.3s;
    width:auto;
    padding:10px;
}

.menu-footer li:hover{
    color:#fff;
    font-size:20px;
    transition: all 0.3s;
    box-shadow:4px 2px 8px #999;
    border-radius:4px;
    width:auto;
}

.menu-footer li a{
    color:#000;
}

.padding-col-footer{
    padding:10px;
}

.microtiq{
    background:#000;
}

.microtiq h1{
    font-size:18px;
    color:#fff;
    text-align:center;
    padding:12px 0 0 0;
    transition: all 1s;
}

.microtiq h1:hover{
    font-size:19px;
    transition: all 1s;
}

.microtiq .col img{
    width:50px;
    display:block;
    margin:auto;
}


/*--------------------------ACCUEIL-------------------------------------*/
.img-pr{
    background-image:url("/images/accueil/img-pr.jpg");
    background-size: cover ;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 200px;
}

.cont-img-pr{
    padding:150px 0 150px 0;
    text-align:center;
    text-transform: uppercase;
    font-weight: bold;
}

.service-fluid{
    background:black;
	background:url('/images/accueil/resille.jpg');
	border-bottom: 3px ridge rgba(255, 220, 0, .6);
}

.service{
    text-align:center;
    color:#fff;
}

.cont-service{
    background:rgba(0,0,0,0.5);
    padding:20px;
    border-radius: 10px 10px 0 0;
    color:#fff;
    height:300px;
    border-left:1px solid rgba(255,205,0);
    border-right:1px solid rgba(255,205,0);
    border-top:1px solid rgba(255,205,0);
  animation: mymove 5s infinite;
}

@keyframes mymove {
  50% {box-shadow: -8px -8px 65px  black inset;}
}

.service i{
    color:rgba(255,205,0);
}


.padding-horaire{
    padding:20px;
}

.fd-yellow p{
    display:block;
    margin:auto;
    text-align: center;
}

.padding-horaire h3{
    display:block;
    margin:auto;
}

.fd-horaire{
    width:100%;
    background-image:url("/images/accueil/fd-horaire.jpg");
    background-size: cover;
    background-position: center;
    
    
}

.container-horaire{
    padding:50px 0 50px 0;
}


/*------------------EQUIPE.PHP-----------------------*/

.col-equipe{
    padding:20px;
    background:#d4d4d4;
    border-radius:10px;
}

.col-equipe img{
    border-radius:10%;
    display:block;
    margin:auto;
    padding:10px 0 0 0;
}

.col-equipe h2{
   text-align:center;
   margin:0;
}

.col-equipe p{
    text-align:center;
    margin:0;
 }


 /*--------------------------------------------SERVICE.PHP--------------------------------------*/

 .blocpart{
    height: 300px;
    width:330px;
    background-image:url("/images/services/entretien.jpg");
    background-size:330px;
    background-repeat:no-repeat;
    background-position: center;
    margin:20px 0 0 0;
    transition:all 0.3s ease-in-out;
}

.blocpro{
    height:300px;
    width:330px;
    background-image:url("/images/services/pro.jpg");
    background-position: center;
    background-size: 330px;
    background-repeat:no-repeat;
    margin:20px 0 0 0;
    transition:all 0.3s ease-in-out;   
}

.blocps{
    height:300px;
    width:330px;
    background-image:url("/images/services/prix-serre.jpg");
    background-position: center;
    background-size: 330px;
    margin:10px 0 0 0;
    background-repeat:no-repeat;
    margin:20px 0 0 0;
    transition:all 0.3s ease-in-out;
}

.blocpart:hover , .blocpro:hover , .blocps:hover{
    opacity:0.7;
    transition:all 0.3s ease-in-out;
    margin:10px 0 0 0;
}

.title-services{
    background:rgba(255,205,0);
}

.title-ps{
    background:rgb(255, 08, 08);
}

.title-services , .title-ps{
    color:#000;
    font-size: 20px;
    height:30px;
    width:330px;
    padding: 0 0 0 10px;
}

.title-services:hover , .title-ps:hover{
    text-decoration:none;
    background:rgba(0,0,0);
    color:#fff;
    transition:all 0.3s ease-in-out;
}

.part-services{
     background-image:url("/images/services/services.jpg");
     background-size: cover;
     background-position: top;
  }

 .part-services h3{
    background:rgba(255,255,255,0.0);
    text-align: center;
    text-transform: uppercase;
    padding-top:15px;
 }

 .part-services h4{
    text-align: center;
 }

 .pro-services{
    background-image:url("/images/services/fdpro.jpg");
    background-size: cover;
    background-position: top;
 }

.pro-services h3{
   background:rgba(255,255,255,0.0);
   text-align: center;
   text-transform: uppercase;
   padding-top:15px;
}

.pro-services h4{
   text-align: center;
}

.services img{
    width:500px;
    padding-top:20px;
 }

.comment{
    text-align:justify;
    font-size:20px;
    margin-top:10px;
 }

.pro-services .comment p{
    font-size:22px;
} 

.comment li{
    font-size:18px;
}

.services h2{
    text-transform: uppercase;
    text-align:center;
    margin:30px 0 0 0;
    background:rgba(255,205,0,0.8);
    color:#000;
    font-size: 25px;
    padding:6px;
    height:50px;
}

.services h3{
    text-align:center;
    font-size: 22px;
}

.services h4{
    text-align:center;
}

.ps h2{
    text-transform: uppercase;
    text-align:center;
    margin:30px 0 0 0;
    background:rgba(212, 8, 8, 0.8);
    color:#fff;
    font-size: 25px;
    padding:6px;
    height:50px;

}

.ps-services{
    background-image:url("/images/services/fd-ps.jpg");
    background-size: cover;
    background-position: top;
}

.video{
    margin-top:30px;
    position:relative;
}

.play{
position:absolute;
left:42%;
top:45%;
color:red;
}

#loupe{
    position:absolute;
    top:245px;
    left:300px;
    z-index:9999;
}

#loupe img{
    width:40px;
}

 /*-------------------------------------------VEHICULES---------------------------------------*/

 .blocvn{
    height: 280px;
    width:375px;
    background-image:url("/images/gamme-renault.jpg");
    background-size:cover;
    background-position: center;
    margin:10px 0 0 0;
    transition:all 0.3s ease-in-out;
}

.blocvn:hover{
    margin:0;
    opacity:0.7;
    transition:all 0.3s ease-in-out;
}

.vo{
    height: 280px;
    width:375px;
    background-image:url("/images/vo.jpg");
    background-size:cover;
    background-position: center;
    margin:10px 0 0 0;
    transition:all 0.3s ease-in-out;
}

.vo:hover{
    opacity:0.7;
    transition:all 0.3s ease-in-out;
    margin:0;
}

.vo img{
    height:275px;
    width:340px;
    text-align:center;
}

.blocdacia{
    height: 280px;
    width:375px;
    background-image:url("/images/gamme-dacia.jpg");
    background-size:cover;
    background-position: center;
    margin:10px 0 0 0;
    transition:all 0.3s ease-in-out;
}

.blocdacia:hover{
    opacity:0.7;
    transition:all 0.3s ease-in-out;
    margin:0;
}

.title-vehicule{
    background:rgba(255,205,0);
    color:#000;
    font-size: 20px;
    height:30px;
    text-decoration:none;
    width:350px;
    padding-left:10px;
}

.title-vehicule:hover{
    text-decoration:none;
    background:rgba(0,0,0);
    color:#fff;
    transition:all 0.3s ease-in-out;
}

.title-dacia{
    background:#0004ff;
    color:#fff;
    font-size: 20px;
    height:30px;
    text-decoration:none;
    width:350px;
    padding-left:10px;
}

.title-dacia:hover{
    text-decoration:none;
    background:rgba(0,0,0);
    color:#fff;
    transition:all 0.3s ease-in-out;
}

.title-vn{
    background:rgba(255,205,0);
    color:#000;
    font-size: 26px;
    height:40px;
    text-align:center;
}
  
.mini_vn{
    text-align:center;
}

.mini_vn img{
    width:220px;
}

.title-dac{
    background:#0004ff;
    color:#fff;
    font-size: 26px;
    height:40px;
    text-align:center;
	width:100%;
}

.mini-titre{
    margin:-8px 0 10px 0;
    text-align:center;
    text-transform: uppercase;
}

.container-vn{
	padding-left:15px;
	padding-right:15px;
}
.vn{
    background:url('/images/vn/fondvn.jpg');
    padding:40px;
    padding-right:0;
    padding-left:0;
    text-align:center;
}

.vn h1{
    background-color:rgba(255, 255, 255,0.9);
}

.retourvn{
    position:fixed;
    top:130px;
    left:50px;
    z-index:1;
}

.doc{
    height:16000px;
}

.offres{
	position:absolute;
	top:318px;
	left:100px;
	z-index:2000;
	text-decoration:none;
}

.offres a{
	text-decoration:none;
}

/**-------------------------------------Contact--------------------------------*********/

#maps-resp{
	display:none;
}

/*-----------------------------404------------------------------------------*/
.erreur{
	font-size:26px;
	color:red;
	margin-bottom:60px;
}

/*----------------------FANCYBOX----------------------*/
.fancybox-content {
    /*max-width: 550px !important;*/
}