/*Global*/

body {
	font-family: 'Raleway', sans-serif;
	max-width: 1900px;
}

header {
	width: 100%;
	height: auto;
}

.parallax {
	background: url("../images/Parallaxe3.jpg") 50% 0px no-repeat fixed transparent;
	background-size: cover;
	height: 550px;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
}

@media screen and (min-width: 1380px) {
  .parallax {
    height: 850px;
  }
}


.messagehead{
	position: absolute;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.45);
	bottom: 20%;
}

.messagehead h1{
	color:#fff;
	text-align: center;
	font-size: 2em;
	font-weight: bold;
}

.messagehead img {
	display: block;
	width: 50%;
	margin : 0 auto;
}

.parallax i {
	position: absolute;
	font-size: 5em;
	color: #fff;
	line-height: 1em;
	width: 1em;
	bottom: 1%;
	left: 47%;
	border: solid 1px white;
	border-radius: 50%;
	text-align: center;
	margin: 0 auto;
}

.menu1 {
	height: 100px;
	z-index: 1000;
	background-color: #fff;
	border-color: #e6e6e6;
	box-shadow: 0px 5px 5px #e6e6e6;
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
}


h2, .soush2, .bouton, h3{
	text-align: center;
}

.bouton a {
	text-decoration: none;
}

h2 {
	color: #000;
	font-weight: bold;
	font-size: 3.2em;
}

.soush2 {
	font-size: 1.6em;
	color: #6b6b6b;
	font-weight: bold;
}

.trait {
	border-top: 2px solid #b6cf51;
	width : 100px;
	margin: 25px auto 50px auto;
}

h3 {
	color: #000;
	font-weight: bold;
	font-size: 1.4em;
	text-transform: uppercase;
}

.rond {
	overflow:hidden;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    height: 180px;
    width: 180px;
    margin:0 auto;
}

.rond img {
	width: 135%;
  -webkit-transition: width 1s ease;
     -moz-transition: width 1s ease;
       -o-transition: width 1s ease;
      -ms-transition: width 1s ease;
          transition: width 1s ease;
}

.rond img:hover {
	width: 175%;
}

.content {
	text-align: left;
	font-size: 1.2em;
	color:#000;
}

.zones, .real, .blog{
	overflow: hidden;
}
.zones img, .real img, .blog img {
	width: 100%;
}

.zones a {
	display: block;
 	text-decoration: none;

}

.contientBiais{
	position:relative;
	height: auto;
	padding: 0;
	overflow: hidden;
}

.biais {
	z-index: 20;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 0px;
    height: 0px;
    border-bottom: 293px solid white;
    border-right: 0px solid transparent;
    border-left: 25px solid transparent;
}

.biais2 {
	z-index: 20;
	position: absolute;
	left: 0;
	top: 0;
	width: 0px;
    height: 0px;
    border-top: 293px solid white;
    border-right: 25px solid transparent;
    border-left: 0 solid transparent;
}

 div.lieu {
 	margin-top: 1em;
 	font-weight: bold;
    color: #6b6b6b;
    text-align: center;
    font-size: 1em;
    padding: 0 10px;
    overflow: auto;  /*pour apparition d une scroll bar si le texte est trop long*/
 }

.contientBiais img {
    position: relative;  
    bottom: 1.2em; /*ici mettre la hauteur de l image*/
     -webkit-transition: all 0.5s ease;
     	-moz-transition: all 0.5s ease;
     	  -o-transition: all 0.5s ease;
     	 -ms-transition: all 0.5s ease;
       		 transition: all 0.5s ease;
}
.contientBiais:hover img {  /*au survol de la souris sur le bloc*/
    bottom: -1em; /*ici mettre deux fois la hauteur de l image*/
}

.galerie, .galerieblog {
	padding: 0;
	background-color: #000;
	display: inline-block;
	position:relative;
	overflow:hidden; 
}

.galerie img:hover, .galerieblog img:hover {
	background-color: #000;
	opacity: 0.5;
}

.plus {
	position:absolute;
	padding:0; 
	margin:0;
	left:0; 
	right:0;
	height:100%; 
	bottom: -100%;
	text-align:center;
	 -webkit-transition: all 0.5s ease;
     	-moz-transition: all 0.5s ease;
     	  -o-transition: all 0.5s ease;
     	 -ms-transition: all 0.5s ease;
       		 transition: all 0.5s ease;
	}


.galerie:hover .plus{
	bottom:-50%;
	background: rgba(0,0,0,0.5);

}

.galerieblog:hover .plus{
	bottom:0%;
	background: rgba(0,0,0,0.5);
}


.galerie:hover .plus a {
	margin-top: 50%;
	font-size: 2em;
	color: #fff;
}

.galerie .plus a {
	margin-top: 50%;
	font-size: 2em;
	color: #fff;
}

.galerieblog:hover .plus p{
	font-size: 0.8em;
	color: #fff;
}

.galerieblog .plus p{
	font-size: 0.8em;
	color: #fff;
}

.galerieblog:hover .plus a, .galerieblog:hover .plus h6{
	font-size: 1.5em;
	color: #fff;
}

.galerieblog .plus a, .galerieblog .plus h6{
	font-size: 1.5em;
	color: #fff;
}

.galerieblog:hover .plus h6, .galerieblog:hover .plus p, .galerieblog .plus h6, .galerieblog .plus p{
	text-align: left;
	padding: 0 10px;
}

.navgal a {
	color : #5e9330;
}


.filtre {
	background-color: #000;
	height: 300px;
	padding: 0px;
}

.filtre ul {
	margin-top: 20%;
	padding-left: 2em;
}

.filtre li {
	list-style-type: none;
}

.filtre a {
	color: #fff;
	font-size: 1.4em;
	text-decoration: none;
}

.filtre i {
	color : #fff;
	padding: 10px;
}

.boxfond {
	
	height: 230px;
	width: 100%;
}

.engagement{
	height: 230px;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
}

.engagement p {
	color:#fff;
	font-size: 2em;
	font-weight: bold;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 0% 5%;
	position: absolute;
	width: 100%;
	text-align: center;
	vertical-align: middle;
}

.engagement .simple {
	top: 42%;
}

.engagement .double {
	top: 33%;
}

.engagement .triple {
	top: 24%;
}

.lire {
	float: right;
	text-align: right;
	font-size: 1.5em;
	color: #000;
	text-decoration: underline;
	padding-top: 1em;
	padding-bottom: 4em;
}
.lire:hover {
	color: #6b6b6b;
}

.clear {
	clear: both;
}

.rs {
	text-align: center;
}

.rs ul {
	width: 25%;
	margin: 5px auto;
}

.rs2 {
	text-align: left;
}

.rs2 ul {
	width: 25%;
	margin: 5px auto;
}

footer{
	background-color: #000;
}

footer h2 {
	padding-top: 50px;
	color: #fff;
	font-size: 2.45em;
}

footer h3 {
	color: #fff;
	font-size: 1.4em;
	text-transform: none;
	margin-top:0;
}

footer .trait {
	margin-bottom: 30px;
}

footer ul {
	margin-top: 20px;
	padding-left: 5px;
}

footer li {
	list-style-type: none;
}
footer li a {
	color: #fff;
	text-decoration: none;
	font-size: 1.2em;
}

footer li a:hover {
	color: #6b6b6b;
	text-decoration: none;
	font-size: 1.2em;
}

.meteo {
	padding-top: 2em;
}

.tel {
	color : #b6cf51;
	font-size: 2em;
	padding: 10px;
	font-weight: bold;
	margin: 0 auto;
	text-align: center;
}

.tel p {
	display: inline;
}

footer textarea {
	width: 100%;
}

.form-group {
	margin: 3%;
}
.form-control {
	padding: 0;
	width: 100%;
}

.form-inline textarea {
	width: 91%;
	margin: 3%;
	border: 1px solid #ccc;
}

.suivre ul {
	width: 60%;
	margin: 5px auto;
}
.mentions{
	font-size: 1em;
	color: #fff;
	text-align: right;
}


.mentions a{
	font-size: 1em;
	color: #fff;
	text-align: right;
	text-decoration: none;
}

.mentions a:hover{
	color: #6b6b6b;
}

.gauche{
	text-align: left;
}

.droite{
	text-align: right;
}

footer .btn {
	background-color: #000;
}

/*Presta*/
.img-bandeau-paysagiste {width:100%; height:300px; background:url(../images/bandeau-paysagiste.jpg) 0px no-repeat; background-size:cover;}

.img-bandeau-entretien {width:100%; height:300px; background:url(../images/bandeau-entretien.jpg) 0px no-repeat; background-size:cover;}

.img-bandeau-terrasse {width:100%; height:300px; background:url(../images/bandeau-terrasse.jpg) 0px no-repeat; background-size:cover;}

.img-bandeau-cloture {width:100%; height:300px; background:url(../images/bandeau-cloture.jpg) 0px no-repeat; background-size:cover;}

.img-bandeau-service-personne {width:100%; height:300px; background:url(../images/bandeau-service-personne.jpg) 0px no-repeat; background-size:cover;}

.active{color:#5e9330; font-weight:bold;}

/*BREADCRUMB GENERAL STYLE*/

/*Styles du div englobant*/
#breadcrumb{
width:100%;
}
/*Reset sur la liste*/
#breadcrumb ul, #breadcrumb li {
list-style-type:none;	
padding:0;margin:0;
}		
/*Styles sur la liste*/
/*#breadcrumb ul{
height:33px;
margin:10px auto;
padding:30px 0;
}*/	
/*Premier élément de la liste*/
#breadcrumb li.first {}
/*Tous les éléments de la liste sauf premier et dernier*/
#breadcrumb li {
float:left;
line-height:33px;
margin:5px 0 0 0;
padding-left:0px;
}
/*Style sur les éléments a et span*/
#breadcrumb li a, #breadcrumb li span, #breadcrumb li p {
float:left;
height:33px;
margin:0;
padding:0 0 0 5px;
font-size:0.875em;
letter-spacing:0.02em;
}	
#breadcrumb li a {color:#000;}
/*Style du dernier span de la liste*/
#breadcrumb li span.end {
float:left;
width:15px;
height:33px;
} 					

/*Clearfix*/
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}

.sidebar {margin-top:-12px;}
/*.sidebar-1 {margin-top:118px;}*/
.sidebar-title {padding:0; font-size:1.250em; font-weight:bold;}
.sidebar-1 li, .sidebar-2 li {list-style-type:none; font-size:1em; padding:0.5em 0;}
.sidebar-1 li a,.sidebar-2 li a {color:#000;text-decoration: none;}
.sidebar-1 li a:hover,.sidebar-2 li a:hover {color:#5e9330;}
.sidebar-2 {margin-top:90px;}

.sidebar-1 li .active-2{color:#5e9330; font-weight:bold; cursor:default;}

.fa-icon {padding-right:10px;}

.text-content-1 img {float:left; padding:0 10px 10px 0;}

.text-content-1 p {font-size:1em; text-align:justify;}

.text-content-2 p {font-size:1em; text-align:justify;}

.text-content-2 {margin-top:12px;}



/*Zones*/
.img-bandeau-andernos {width:100%; height:300px; background:url(../images/bandeau-andernos.jpg) 0px -150px no-repeat; background-size:cover;}

.img-bandeau-ares {width:100%; height:300px; background:url(../images/bandeau-ares.jpg) 0px no-repeat; background-size:cover;}

.img-bandeau-cap {width:100%; height:300px; background:url(../images/bandeau-cap.jpg) 0px no-repeat; background-size:cover;}

.img-bandeau-biganos {width:100%; height:300px; background:url(../images/bandeau-biganos.jpg) 0px no-repeat; background-size:cover;}

.active{color:#5e9330; font-weight:bold;}



/*sidebar*/
.sidebar {margin-top:-8px;}
.sidebar-title {padding:0; font-size:1.250em; font-weight:bold;}
.sidebar-1 li, .sidebar-2 li {list-style-type:none; font-size:1em; padding:0.5em 0;}
.sidebar-1 li a,.sidebar-2 li a {color:#000;text-decoration: none;}
.sidebar-1 li a:hover,.sidebar-2 li a:hover {color:#5e9330;}
.sidebar-2 {margin-top:90px;}

.sidebar-1 li .active-2{color:#5e9330; font-weight:bold; cursor:default;}

.fa-icon {padding-right:10px;}

.text-content-1 img {float:left; padding:0 10px 10px 0;}

.text-content-1 p {font-size:1em; text-align:justify;}

.text-content-2 p {font-size:1em; text-align:justify;}

.text-content-2 {margin-top:12px;}


.titre-page {padding-bottom:20px;}

.h2-presta {padding:40px 0 20px 0; font-weight:normal; font-size:30px}

.titre-page {padding-bottom:20px;}

.blanc {
	height: 5em;
}

.blanc2 {
	height: 2.5em;
}

/*404*/

.img-bandeau-404 {width:100%; height:300px; background:url(../images/bandeau-404.jpg) 0px no-repeat; background-size:cover;}

.active{color:#5e9330; font-weight:bold;}

.h1-404{font-size: 36px; text-align: center;}
.h2-404{font-size: 24px; text-align: center;}
.h3-404{font-size: 20px; text-align: left;}

.plan-site{margin-top: 40px;}
li a{color:#000;}
li a:hover{color:#5e9330;}

/*blog*/

.img-bandeau-blog {width:100%; height:300px; background:url(../images/bandeau-404.jpg) 0px -220px no-repeat; background-size:cover;}

.active{color:#5e9330; font-weight:bold;}

.h1-blog {font-size: 36px; text-align: left;}
.h2-blog {font-size: 24px; text-align: left;}
.h3-blog {font-size: 20px; text-align: left; text-transform: none; border-bottom:1px #5e9330;}
.img-blog {float: left; margin: 0 20px 20px 0; width: 20%;}
.img-180blog {width:100%;}
.hr-blog {
color: #5e9330;
background-color: #5e9330;
height: 1px;
border: 0;
margin:10px 0;
}
.lire-article {font-size: 14px; color:#000; text-decoration: underline;}
.lire-article:hover {color: #5e9330;}
.publie{padding-bottom: 20px;}
.text-article{height:180px; margin: -10px 0 20px 0;}

.articles{padding-right: 20px;}

.form-recherche {margin-top: 75px;}
#searchP {border: solid 2px #5e9330;}
.search-btn {background-color: transparent;}
.fa-search {color: #5e9330; font-size: 20px;}

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

nav li {list-style-type: none; padding: 0.5em 0;}
nav li a {color:#000;}

.petit{
	font-size: 0.8em;
	line-height: 0.8em;
}

/*Bandeau*/
.img-bandeau-article {width:100%; height:300px; background:url(../images/bandeau-404.jpg) 0px no-repeat; background-size:cover;}

.active{color:#5e9330; font-weight:bold;}
.img-article {float: left; margin: 0 20px 20px 0; width: 300px; height: 300px;}
.img-300article {width:100%;}



.articles{padding-right: 20px;}

.form-recherche-article {margin-top: 45px;}
#searchP {border: solid 2px #5e9330;}
.search-btn {background-color: transparent;}
.fa-search {color: #5e9330; font-size: 20px;}

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




/*contact*/
.img-bandeau-contact{width:100%; height:300px; background:url(../images/terrasse17.jpg) 0px no-repeat; background-size:cover;}
.devis{font-size:50px; text-align:center; color:#5e9330;}

.adresse{text-align:center; text-height:20px;}
.titre-contact{text-align:center;padding-bottom: 25px;}
.text-content-contact{ text-align:center;}
#direct .form{width:200px; height:50px;margin:5px 0;}
#direct .form-inline{ width:410px; height:200px;margin:20px 0px 0 2px;}
#direct .col-md-6{padding-top:40px;}

/*Engagements*/
.img-bandeau-engagements {width:100%; height:300px; background:url(../images/bandeau-engagements.jpg) 0px no-repeat; background-size:cover;}

.active{color:#5e9330; font-weight:bold;}
.picto01, .picto02, .picto03, .picto04, .picto05, .picto06, .picto07 {width:100%; height:148px;}

.float-left {float:left; padding-right:20px;}
.float-right {float:right; padding-left:20px;}

.content-pictos-left {    
    display: inline-block;
    font-size: 1em;
    height: 148px;
    line-height: 148px;
    text-align: left;
    width: 80%;}

.content-pictos-right {    
    display: inline-block;
    font-size: 1em;
    height: 148px;
    line-height: 148px;
    text-align: right;
    width: 80%;}

.content-pictos-left span, .content-pictos-right span { 
  width:80%; /* largeur zone de texte */
  vertical-align:middle;
  display:inline-block;
  line-height:normal; /* on rétablit le line-height */
}
.logo-servicep {
	float: right;
}
.liste-servicep ul{
	margin-left: 20px;
}

#accordion h3 {
	font-size: 0.9em;
	text-align: left;
}

.prev {
	text-align: left;
}

.next {
	text-align: right;
}