@charset "utf-8";
/* CSS Document */

body {
	margin: 0;
	padding: 0;
font-family: 'Roboto', sans-serif;
}

.gauche { float: left; width:100%; }

img {
	max-width: 100%;
}
.centre { width:80%; margin-right: auto; margin-left: auto;}
.cdeux { width:80%; margin-right: auto; margin-left: auto;}
.centreb { width:90%; margin-right: auto; margin-left: auto;}

.titrea { text-align:center; line-height: 143px; font-size: 30px; margin: 0px; padding: 0px; font-weight: normal; color: #666;}
.lienville a { color:#999;}


#conteneur { width:100%; float: left; }
#haut { width:100%; float: left; background: #232323; height: auto; padding-bottom: 50px; }
#logo {width:100%; margin-right:0%; float: left; text-align:center;  }
#menu {width:100%;  float: left; height: auto;  }
.bouton { }
.bouton a { float: left; width: 100%; line-height: 30px; text-decoration: none; text-align:center; color:#CCC; font-size: 18px; }
.bouton a:hover {color:#6fce22; }


#numero {width:100%; float: left; text-align:center; }
#numero a { line-height: 80px; text-decoration: none; color:#CCC; text-align:center;     font-size: 20px;} 

#image { width:100%; float: left;  }

#milieu { width:100%; float: left; }
#milieublanc { width:100%; float: left;  padding-bottom: 50px; }

#titrebloc { width:100%; float: left; height:143px; background-position: center; background-repeat:no-repeat; background-image:url(images/sb.jpg); margin-bottom:50px; margin-top: 50px; }
#bloctrois { width:100%; float: left; }

#patios { width:100%; float: left; margin-bottom:40px; }
#balcons { width:100%; margin-right: 0%; margin-left:0%; float: left;  margin-bottom:40px;}
#terrassement { width:100%; float: left;  margin-bottom:40px;}
.imagea { width:100%; float: left; text-align:center; }
.textea { width:100%; float: left; }
.textea p { font-size: 18px; line-height: 24px; text-align:center; margin-right:20px; margin-left:20px; }
.textea h2 { font-size: 24px; color: #6fce22; text-align: center; }

#milieublanca { width:100%; float: left; }

#milieublancb { width:100%; float: left; }
#milieublancc { width:100%; float: left; }

#milieubdeux { width:100%; float: left; padding-top: 0px; padding-bottom: 150px; }
.soumissiontitre { font-size: 28px; line-height: 25px; text-align:center;}
.soumissiontexte { font-size: 18px; line-height: 25px; text-align:center;}
.boutonsoumission {  margin-right: auto; margin-left: auto;}

.boutonsoumission a { font-size: 18px; line-height: 25px; text-align:center; line-height:60px;  text-decoration: none; color:#FFF; width:400px; margin-right: auto; margin-left: auto; padding: 15px 30px 15px 30px; border-radius: 10px; background:#6dc928;}

.boutonsoumission a:hover { background: #68bf26; color:#FFF;}

.cc {margin-right: auto; margin-left: auto; text-align:center; }

#milieugris { width:100%; float: left;     background: #282625;  background-repeat:no-repeat; padding-top:40px; padding-bottom: 60px;     background-size: 100%; }
.moitie { width:100%; float: left; }
.moitiep { width:100%; margin-left:0%; float: left; display:none;}

.sepa { float: left; width:100%; }
.blocregrouper { float: left; width:100%; margin-bottom: 40px; }
.plus { float: left; width:auto; margin-right:5%; }
.textesepa { float: left; width:100%; }
.textesepa img { float: left; padding:0px 20px 10px 0px; }

.textesepa p { margin: 0px; padding:0px; color: #8d8d8d; line-height:25px; font-size: 18px; }
.titresepa { font-size: 18px; color: #EFEFEF; margin-bottom:20px; line-height: 22px;}

#milieuvert { width:100%; float: left;     background: #5eab1e; background-repeat:no-repeat; padding-top:10%; padding-bottom: 10%;     background-size: 100%; }
#milieuvert a { color:#FFF; }

.titrev { text-align:center; font-size: 23px; color:#FFF; font-weight: normal;}
.textev { text-align:center; font-size: 18px; line-height: 25px; color:#FFF; font-weight: normal;}
.soustitrev { text-align:center; font-size: 22px; color:#FFF; font-weight: normal; }
.centrev { width:90%; margin-right: auto; margin-left: auto;}

#milieublancok { width:100%; float: left; background:#FFF; padding-top: 100px; padding-bottom:100px; }
#milieublancok p { line-height: 28px; font-size: 18px; }
.titrebb { font-size:28px; font-weight: normal; text-align:center; color:#666;}
#blocblanc { width:100%; float: left; background:#FFF; padding-top: 100px; padding-bottom:100px; }
#milieuvert p { text-align: center; line-height: 25px; }
#un { width:100%; float: left; }
.titreun { font-size: 28px; color: #606060; margin: 0; padding:0; }
.soustitreun { font-size: 25px; color: #6fce22; margin-top: 10px; }
.crochetun { margin-left: 10px; font-size: 18px;}
#deux { width:100%; float: left; }

#partenaires { width:100%; float: left; background:#F7F7F7; }

#bas { width:100%; float: left; background: #272727; padding-top: 10px; padding-bottom:10px; }
#basa { width:100%; float: left; text-align:center; margin-right: 0%; }

.blanctexte {
    color: #a5a5a5;
    line-height: 24px;
    font-size: 16px;
}
#basa a { color:#555555; }
.gristexte { color:#555555; }
.titrebas { color:#FFF; font-size: 22px; font-weight: bold; text-transform: uppercase; margin-bottom: 10px; }

#basb { width:100%; margin-right: 0%; margin-left: 0%; float: left; text-align: center; }
.tel a { text-decoration: none;     color: #488417; font-size: 25px; }
.courriel a { text-decoration: none; color:#a5a5a5; font-size: 16px; }

#basc { width:100%; float: left; text-align: center; }
.lienbasc { margin:0; padding:0;}
#basc a {
    text-decoration: none;
    color: #a5a5a5;
    font-size: 16px;
	line-height:25px;
}

#creation { width:100%; float: left; height:120px; background: #232323; }

.moitiebas { float: left; width:100%; height: 60px; }
.moitiebas a { color:#6cc524; text-decoration:none; line-height:60px; }
.moitiebas p { line-height:60px; font-size: 14px; margin: 0; padding:0; color:#555555; }
.droitbas { text-align:center;}
.gauchebas { text-align:center;}

#imagehaut { width:100%; float: left; background: url(images/construction-galerie.jpg); background-size:100%; display:none; background-repeat:no-repeat; }
#imagehaut img { width:100%; }
#page { width:100%; float: left; padding-top: 50px; padding-bottom:0px;}
#moitiepagea { width:100%; float: left; margin-left:0px; margin-top: 20px;}
#moitiepageb { width:100%; float: left;}

#contactpagea { width:100%; float: left; margin-left:0px; margin-top: 20px;}
#contactpageb { width:100%; float: left;}


#ima { width:60%; float: left;}
#imb { width:40%; float: right; padding: 40px 0px 90px 0px; text-align:right;}
.titreima { color: #FFF; margin:0; padding:0; font-size: 14px; margin-bottom: 5px; font-weight: bold;}
.titreimb { color: #FFF; margin:0; padding: 0; font-size: 25px; font-weight: bold;}
.texteimb { color: #FFF; font-weight: normal;}
#moitiepageb p { line-height: 28px; font-size: 18px; }
#moitiepagea p { line-height: 28px; font-size: 18px; }


#contactpageb p { line-height: 28px; font-size: 18px; }
#contactpagea p { line-height: 28px; font-size: 18px; }
.bpagea { float: left; width:100%;}
.bpageb { float: left; width:100%;}

.imgacc { float: none; margin-left:0px; margin-right:0px; text-align:center;}


.soumission a { width:250px; text-decoration:none; }
.cent { float: left; width:100%; margin-top: 20px; }
.centdeux { float: left; width:100%; margin-top: 0px; }

#boutonsoumi { text-align:center; }
#boutonsoumi a { display:none; font-weight: bold; font-size:15px; border-radius:10px; float: right; width:250px; height:50px; line-height:50px; background: #6fce22; text-align:center; text-decoration:none; color:#232323; margin-bottom: 50px; }
#boutonsoumi a:hover { background: #7DDD2F; }

.photo { float: left; width: 48%; padding: 1%; text-align:center;   margin-bottom: 10px; }
.ville { float: left; width:100%; height: 40px;}
.ville  a { line-height:40px; text-decoration:none; color:#333; font-size: 18px;}
.texteterritoire { margin-right: 20px; }
.textecont { margin-right: 60px; line-height:24px; font-size: 18px; }
.textesoumi { line-height:24px; font-size: 18px; }

.numeroc a { font-size:25px; text-decoration: none; color: #333; font-weight: bold;  }
.emailc  a {font-size:20px; color: #666; }
.spage { color:#434343; size:25px; }
.spagev { color:#6fce22; font-size: 20px; }
.servicea { width:100%; float: left; margin-top:20px; font-size: 18px; }
.espace { height:0px; float:left; width:100%; }
.servicea img { margin-right: 25px; }
.servicetexte { margin-right: 50px; }
.textevillep { font-size: 18px; line-height: 24px; margin-right: 40px;}
.titreservice { font-size: 24px; margin: 0px; padding: 0; color: #606060;}
.entreprise { font-size: 18px; margin: 0px; padding: 0; color: #606060;}

.centreboout { width:100%; margin-right:auto; margin-left:auto;}

/* Disposition tablette : 481px sur 768px. Hérite des styles de : Disposition mobile */



.galerieb { width:100%; margin-right:auto; margin-left: auto;}
.boutongalerie  {   color: #7FCB37; }
.boutongalerie  a { float:left; width:100%; background: #6CCC2D; padding:15px 0px 15px 0px; color: #333; margin-bottom:20px; text-align:center; font-size:23px; font-weight: bold; border-radius: 20px;}
.boutongalerie  a:hover {  background: #6CCC2D;}

.o { color: #6CCC2D; }


@media only screen and (min-width: 481px) {

	
	}	
@media only screen and (min-width: 769px) {	
#haut { width:100%; float: left; background: #232323; height: auto; padding-bottom: 50px; }
#logo {width:100%; margin-right:0%; float: left;  }
#menu {width:100%;  float: left; height: auto;  }
.bouton { }
.bouton a { float: left; width: 50%; line-height: auto; text-decoration: none; color:#CCC; text-align:center; }
.bouton a:hover {color:#6fce22; }


#numero {width:100%; float: left; text-align:center; }
#numero a { line-height: 80px; text-align:center; text-decoration: none; color:#CCC;}

#patios { width:30%; float: left;  margin-bottom:40px;}
#balcons { width:30%; margin-right: 5%; margin-left:5%; float: left;  margin-bottom:40px; }
#terrassement { width:30%; float: left;  margin-bottom:40px;}
.moitie { width:50%; float: left; }
.moitiep { width:35%; margin-left:15%; float: left; display:block; }
#milieugris { width:100%; float: left; background: url(images/gris.jpg); background-repeat:no-repeat; padding-top:40px; padding-bottom:60px; }
.centrev { width:90%; margin-right: auto; margin-left: auto;}
#un { width:65%; float: left; }
#deux { width:35%; float: left; }
#basa { width:100%; float: left; text-align:left; margin-right: 0%; }
#basb { width:50%; margin-right:0%; margin-left: 0%; float: left; text-align: center; }
#basc { width:50%; float: left; text-align:center; }
.titresepa { font-size: 24px; color: #EFEFEF; margin-bottom:10px;}
.moitiebas { float: left; width:50%; height: 60px; }
.droitbas { text-align:right;}
.gauchebas { text-align:left;}
#creation { width:100%; float: left; height:60px; background: #232323; }
.centreb { width:90%; margin-right: auto; margin-left: auto;}
.photo { float: left; width: 48%; padding: 1%;   margin-bottom: 10px; }
.servicea { width:50%; float: left; margin-top:20px; }
#page { width:100%; float: left; padding-top: 50px; padding-bottom: 0px;}
.titrev { text-align:center; font-size: 23px; color:#FFF; font-weight: normal;}
#milieuvert {  background: url(images/terrasse.jpg); }
.espace { height:0px; float:left; width:100%; }
.ville { float: left; width:50%; height: 40px;}
.imgacc { float: none; margin-left: 0px; margin-right: 0px; text-align:center;}

	}	
@media only screen and (min-width: 1024px) {
#haut { width:100%; float: left; background: #232323; height: auto; }
#logo {width:100%; margin-right:0%; float: left;  }
#menu {width:100%;  float: left; height: auto;   }
.bouton { }
.bouton a { float: left; width: 50%; line-height: auto; text-decoration: none; color:#CCC; }
.bouton a:hover {color:#6fce22; }
#numero {width:100%; float: left; }
#numero a { line-height: 112px; text-decoration: none; color:#CCC;}	
#patios { width:30%; float: left;  margin-bottom:40px;}
#balcons { width:30%; margin-right: 5%; margin-left:5%; float: left; margin-bottom:40px; }
#terrassement { width:30%; float: left;  margin-bottom:40px;}
.moitie { width:50%; float: left; }
.moitiep { width:35%; margin-left:15%; float: left; display: block;}
#milieugris { width:100%; float: left; background: url(images/gris.jpg); padding-top:140px; padding-bottom: 160px;  background-repeat:no-repeat; }
.centrev { width:50%; margin-right: auto; margin-left: auto;}
#un { width:65%; float: left; }
#deux { width:35%; float: left; }
#basa { width:35%; float: left; text-align: left; margin-right:5%; }
#basb { width:25%; margin-right: 5%; margin-left: 5%; float: left; text-align:left; }
#basc { width:25%; float: left; text-align:left; }
.titresepa { font-size: 24px; color: #EFEFEF; margin-bottom:10px;}
.moitiebas { float: left; width:50%; height: 60px; }
.droitbas { text-align:right;}
.gauchebas { text-align:left;}
#creation { width:100%; float: left; height:60px; background: #232323; }
.centreb { width:70%; margin-right: auto; margin-left: auto;}
#bas { width:100%; float: left; background: #272727; padding-top: 100px; padding-bottom:100px; }
.titrebas { color:#FFF; font-size: 22px; font-weight: bold; text-transform: uppercase; margin-bottom: 30px; }
.photo { float: left; width: 18%; padding: 1%;   margin-bottom: 10px; }
#imagehaut { width:100%; float: left; background: url(images/construction-galerie.jpg); background-size:100%; display:none; background-repeat: no-repeat; }
.servicea { width:50%; float: left; margin-top:20px; }

#moitiepagea { width:40%; margin-left:5%; float: left; margin-top: 0px;}
#moitiepageb { width:55%; float: left;}
#contactpagea { width:60%; margin-left:5%; float: left; margin-top: 0px;}
#contactpageb { width:35%; float: left;}
#page { width:100%; float: left; padding-top: 90px; padding-bottom: 50px;}
.titrev { text-align:center; font-size: 23px; color:#FFF; font-weight: normal;}
#milieuvert {  background: url(images/terrasse.jpg); }
.espace { height:0px; float:left; width:100%; }
.ville { float: left; width:33%; height: 40px;}
.ville  a { line-height:40px; text-decoration:none; color:#333; font-size: 18px;}

#boutonsoumi a { display: none; }
.imgacc { float: left; margin-left: 0px; margin-right: 50px; text-align:left;}
.centreboout { width:60%; margin-right:auto; margin-left:auto;}
.galerieb { width:70%; margin-right:auto; margin-left: auto;}

	}	
	
@media only screen and (min-width: 1232px) {	
.centre { width:94%; margin-right: auto; margin-left: auto;}
.servicea { width:50%; float: left; margin-top:20px; }
#moitiepagea { width:40%; margin-left:5%: float: left;}
#moitiepageb { width:55%; float: left;}


#contactpagea { width:60%; margin-left:5%: float: left;}
#contactpageb { width:35%; float: left;}
.titrev { text-align:center; font-size: 33px; color:#FFF; font-weight: normal;}
.espace { height:0px; float:left; width:100%; }
#moitiepagea { width:40%; float: left; margin-top: 0px;}
#contactpagea { width:60%; float: left; margin-top: 0px;}
}	

@media only screen and (min-width: 1232px) {
#haut { width:100%; float: left; background: #232323; height: 112px; padding-bottom: 0px; }
#logo {width:281px; margin-right:0px; float: left;  }
#menu {width:auto; padding-top: 40px; float: right; height: 112px;  }
.bouton { }
.bouton a { float: left; width: auto; padding-right:10px; padding-left: 10px; line-height: 112px; text-decoration: none; color:#CCC; }
.bouton a:hover {color:#6fce22; }
#boutonsoumi a { display: none; }


#numero {width:160px; float: right; }
#numero a { line-height: 112px; text-decoration: none; color:#CCC;}	
#patios { width:30%; float: left; margin-bottom:40px; }
#balcons { width:30%; margin-right: 5%; margin-left:5%; float: left; margin-bottom:40px; }
#terrassement { width:30%; float: left; margin-bottom:40px; }

.moitie { width:50%; float: left; }
.moitiep { width:35%; margin-left:15%; float: left; display: block;}
#milieugris { width:100%; float: left; background: url(images/gris.jpg); padding-top:150px; padding-bottom: 220px; background-repeat:no-repeat; }
.centrev { width:50%; margin-right: auto; margin-left: auto;}
#un { width:65%; float: left; }
#deux { width:35%; float: left; }
#basa { width:35%; margin-right: 5%; float: left; }
#basb { width:25%; margin-right: 5%; margin-left: 5%; float: left; text-align: left; }
#basc { width:25%; float: left; text-align: left;}
.titresepa { font-size: 24px; color: #EFEFEF; margin-bottom:30px;}
.moitiebas { float: left; width:50%; height: 60px; }
.droitbas { text-align:right;}
.gauchebas { text-align:left;}
#creation { width:100%; float: left; height:60px; background: #232323; }
.centreb { width:70%; margin-right: auto; margin-left: auto;}
#bas { width:100%; float: left; background: #272727; padding-top: 100px; padding-bottom:100px; }
.titrebas { color:#FFF; font-size: 22px; font-weight: bold; text-transform: uppercase; margin-bottom:40px; margin-top:70px; }
.photo { float: left; width: 18%; padding: 1%;   margin-bottom: 10px; }
#imagehaut { width:100%; float: left; background: url(images/construction-galerie.jpg); background-size:100%; display:block; background-repeat:no-repeat; }
.servicea { width:50%; float: left; margin-top:20px; }
#milieuvert {  background: url(images/terrasse.jpg); background-repeat: no-repeat; }
#page { width:100%; float: left; padding-top: 90px; padding-bottom: 150px;}
.imgacc { float: left; margin-left: 150px; margin-right: 150px; text-align:left;}
.galerieb { width:60%; margin-right:auto; margin-left: auto;}


	}
	@media only screen and (min-width: 1400px) {
.centre { width:80%; margin-right: auto; margin-left: auto;}
#boutonsoumi a { display: block; }
.galerieb { width:50%; margin-right:auto; margin-left: auto;}

}