/*
Theme Name : TBRenovation
Text Domain: TBRenovation
Author: eO10Design
Author URI: https://www.eo10Design.com/
Description : Theme pour le site TBRenovation.com
Version : 1.0
*/

*, ::before, ::after {
	box-sizing: border-box;
	margin:0;
	padding:0;
}

body, html {
	margin:0;
	padding:0;
	font-family: 'Montserrat', sans-serif;
	width:100%;

	background-image: url("images/fond.jpg");
	background-position: fixed;
	min-width: 100%;
 	min-height: 100%;
}

.marronFonce {color:#452b1a!important;}
.marronClair { color:#7e4e24!important;}
.orange{color:#f4a933!important;}

.bgGris {background-color: #737a82!important;}
.bgMarronClair {background-color: #7e4e24!important;}
.bgMarronFonce {background-color: #452b1a!important;}
.bgMarronFonce02 {background-color: #331908!important;}


.bg {
	background-image: url("images/fond.jpg");
	background-position: fixed;
	min-width: 100%;
 	min-height: 100%;
}

a {
	text-decoration: none;
	color:#FFF;
	/* border-bottom: 0.2em transparent solid; */
	border-top: 0.2em transparent solid;
	transition: all 0.5s ease;
}

a:hover {
	/* border-bottom: 0.2em #FFF solid; */
	border-top: 0.2em #FFF solid;
}

h1 {
	font-weight : 800;
	font-size:4.5em;
	color:#FFF;
	text-transform: uppercase;
	letter-spacing: -0.05em;
}

h4 {
	font-size: 1.1em;
	font-weight: 600;
	text-transform: uppercase;
	color:#FFF;
}

h3 {
	font-size:1.1em;
	font-weight:300;
	margin:0;
}

p {
	font-size: 1em;
	font-weight: 300;
	line-height: 1.5em;
	color:#FFF;
}

strong {
	font-weight: 700;
}

.btnPlus {
	display: flex;
	justify-content: center;
	margin: 1em 0;
	padding:1em 0;
}

.btnPlus a {
	/* background-color: #c89057; */
	padding:0.5em;
	border-radius: 0 0.5em 0 0;
	transition: all ease 0.1s;
	box-shadow: 5px 1px 5px rgba(0,0,0,0.2);
}

.btnPlus a:hover {
	/* background-color: #452b1a; */
	/* border-bottom: 1px solid #FFF; */
	/* border : 0; */
}


.texte li {
	list-style-type: none;
	padding-left:1em;
}


.fluid {
	position: relative;
	z-index: 1;
	max-width : 100%;
	margin:0 auto;
	padding:0;
}


/*---------------------MENU PRINCIPAL-------------------*/

.navigation {
	display: block;
	width:100%;
	margin:0 auto;
}
.navigationMobile {
		display: none;
	}
	

.ligneVerticaleNav {
	position:relative;
	z-index: 2;
	display: flex;
	/* justify-content: space-around; */
	align-items: flex-start;
	border-left : 0.1em solid #331908;
	width:90%;
	height:auto;
	left:2.3em;
	top:1em;
	margin:0;
}

.boxSymboleMenu {
	position:relative;
	z-index: 3;
	width:4.5em;
	height:4.5em;
	background-color:#1f0f05;
	margin:1em 0 0 -2em;
	padding: 0.5em;
}

nav {
	position: relative;
	background-color: transparent;
	border-bottom: 0.1em solid #331908;
	margin:1em 0 0 0;
}

nav ul {
	margin-left: 3em;
	width:100%;
	height:100%;
	border:none;
	list-style-type: none;
	display: flex;
	justify-content: flex-start;
	align-items : center;
}

nav li {
		margin:0.2em;	
}

nav a{
	text-decoration: none;
	font-weight: 600;
	color:#331908;
	padding:0.2em;
	transition: all 0.5s ease;
}

nav a:hover {
/*
	background-color: #331908;
	color:#FFF;
*/
	border-bottom: 0.2em #331908 solid;
	border-top: 0.2em #331908 solid;
}

.actif {
	background-color: #331908;
	color:#FFF;
	border-bottom: 0.1em #FFF solid;
}

.logo {
	position: relative;
  	width: 250px;
	height:auto;
}

.logoFooter {
	width:10%;
	margin: 0 auto;
	margin-bottom:1em;
}


.logoNav {
	  display: block;
	
}


/*---------------------CONTAINER-------------------*/

.container {
	position:relative;
	overflow: hidden;
	margin:0;
	padding:0;
}

.sketchfab iframe {
	width:100vw;
	height:500px;
}

.intersection {
	position:relative;
	z-index: 10; 
	width:100%;
	margin:0 0 -0.35em 0;
	padding:0;
}

.titre {
	position:relative;
	z-index: 2;
	display: flex;
	flex-direction: row;
	left:-2.25em;
	padding-top:2em;
	justify-content: flex-start;
	align-items: center;
}

h1.ssTitre {
	position:absolute;
	z-index: 1;
	font-size:10em;
	color:rgba(255,255,255,0.02);
	letter-spacing: -0.1em;
	left:0.5em;
	top:0.25em;
}

.boxSymbole {
	width:4.5em;
	height:4.5em;
	background-color:#1f0f05;
	margin:0;
	padding: 0.5em;
	margin-right:1em;
}

.texte,.textePage,.textePageSeule {
	position:relative;
	z-index: 2;
	width:80%;
	margin-left: 5.5em;
	left:-2.25em;
	padding-bottom:4em;
}

.textePage p {
	font-size:1em;
	margin:0.5em;
	padding:0.5em;
}

.textePage h3 {
	font-size:1.3em;
	font-weight:500;
	margin-bottom:1em;
}

.textePage img {
	margin:1em;
	border-radius:0 1em 0 0;
}

.texte ul {
	margin-top:0.5em;
}

.texte li {
	font-size:0.9em;
	border-left: solid 0.5em #FFF;
	margin-left:0.2em;
}


.ligneHorizontale {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-content:stretch;
	border-bottom : 0.1em solid #FFF;
/*	top: 2em;*/
	width:70%;
	margin:0;
}

.marginTop {
	top: 2em;
	margin-bottom: 1em;
}

.ligneVerticale {
	position:relative;
	z-index: 2;
	border-left : 0.1em solid #FFF;
	height:100%;
	left:2.3em;
	margin:0;
}

a.boxImage {
	width:2em;
	height:2em;
	background-color:#7b461d;
	margin:0.2em;
	transition: all 0.3s ease;
	border-radius:0 0 0.5em 0;
}

.boxImage img {
	width:100%;
}

/*---------------------IMAGES-------------------*/

.conteneur-imgExemple,.conteneur-imgExemple-droit {
	position: relative;
	display:flex;
	z-index: 0;
	left:-2.3em;
	width: 80%;
	margin:0 auto;
	justify-content: space-around;
	
}

.element-imgExemple {
	position: relative;
	display:block;
	padding:0;
	overflow: hidden;
	margin:1em;
	cursor: pointer;
	box-shadow: 0em 0 1em #000;
	border-radius:0 1em 0 0; 
}

.content-imgExemple {
	position: absolute;
	opacity: 0;
	z-index: 3;
	bottom:0;
	left:0;
	width:100%;
	height:100%;
	background-color: rgba(40,57,58,0.5);
	border-radius:0 1em 0 0;        
	-webkit-transition: all 400ms ease-out;
    -moz-transition: all 400ms ease-out;
    -o-transition: all 400ms ease-out;
    -ms-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
    text-align: center;
}

.imgExemple {
	position: relative;
	z-index: 0;
	width:300px;
	height:auto;
	border-radius:0 1em 0 0;
}

.element-imgExemple .content-imgExemple .titre-imgExemple {
	position: relative;
	padding:0.5em;
	width:100%;
	background-color: #283039;
	color:#FFF;
	transition-delay: 0s;
    transition-duration: 0.4s;
}

.element-imgExemple .content-imgExemple:hover {
	opacity: 1;
/*	background-color: rgba(40,57,58,0.6);*/
}

.element-imgExemple .content-imgExemple:hover .titre-imgExemple {
	opacity: 1;
	transform: translateY(700%);
}


a.boxImage:hover{
	transform: scale(1.2);
}



.ligneVerticaleDroite {
	position: relative;
	z-index: 2;
	border-right : 0.1em solid #FFF;
	height:auto;
	right:2.3em;
	top:1em;

}

.ligneHorizontaleDroite {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-content: flex-start;
	border-bottom : 0.1em solid #FFF;
/*	top: 2em;*/
/*	right:-2.3em;*/
	left:23%;
	width:80%;
}

.titreDroite {
	position:relative;
	z-index: 2;
	display: flex;
	flex-direction: row;
/*	left:-2.25em;*/
	padding-top:2em;
	justify-content: flex-end;
	align-items: center;
}

h1.ssTitreDroite {
	position:absolute;
	z-index: 1;
	text-align: right;
	font-size:10em;
	color:rgba(255,255,255,0.1);
	letter-spacing: -0.1em;
	right:0.4em;
	top:0.25em;
}

.boxSymboleDroite {
	width:4.5em;
	height:4.5em;
	background-color:#1f0f05;
	margin:0;
	padding:0.5em;
	margin-left:1em;
	margin-right: -2.25em;
}

.texteDroite {
	text-align: right;
	margin:0 3.2em 0 50%;
}


.bloc-gauche {
	position: relative;
	z-index: 2;
	width:100%;
	max-width: 1400px;
	height:100%;
	background-repeat: no-repeat;
	background-size: cover;
	margin:0 auto;
	padding-top:1em;
}


/*---------------------CHARPENTE-------------------*/

.charpente {
/*	min-height:738px;*/
	background-color: #432a19;
	display: flex;
	overflow: hidden;
	margin:0 auto;
}

.bloc-droit .charpente {
	background-image: url("images/charpente.jpg");
	width:40%;
	background-position: 50% -20%;
	background-size: cover;
}

.bloc-gauche.charpente {
	background-image: url("images/charpenteDeg.jpg");
	background-position: auto 100%;
}

/*---------------------COUVERTURE-------------------*/

.couverture {
/*	height:800px;*/
	background-color: #283039;
	display: flex;
	overflow: hidden;
	margin:0 auto;
}

.bloc-gauche.couverture {
	background-image: url("images/couvertureDeg.jpg");
	background-size: contain;
	background-position: center;
}

.boxCouv {
	position: relative;
	background-color: rgba(40,48,47,0.5);
	color:#FFF;
	padding:1em;
	width:65%;
}


/*---------------------ZINGUERIE-------------------*/

.zinguerie {
/*	height:600px;*/
	background-color: #c89057;
	overflow: hidden;
	margin:0 auto;
	min-height: 780px;
}

.bloc-gauche.zinguerie {
	background-image: url("images/zinguerieDeg.jpg");
	background-position: auto 100%;
}

.ligneBoxDroit {
	display: flex;
/*	flex-direction: row;*/
	justify-content: flex-end;
}

.boxZinc {
	position: relative;
	background-color: rgba(123,70,29,1);
	color:#FFF;
	padding:1em;
	width:400px;
	margin-top:5em;
}

/*---------------------DRONE-------------------*/

.drone {
/*	height:600px;*/
	overflow: hidden;
	margin:0 auto;
	background-color: #452b1a;
}

.bloc-gauche.drone {
	background-image: url("images/droneDeg.jpg");
	background-position: auto 100%;
}

.ligneBoxDroit {
	display: flex;
/*	flex-direction: row;*/
	justify-content: flex-end;
}

.boxDrone {
	position: relative;
	background-color: rgba(69,43,26,0.8);
	color:#FFF;
	padding:1em;
	width:50%;
}

.infoPhotos {
	display: flex;
	justify-content: flex-start;
}

/*---------------------FORMULAIRE CONTACT*/

.contact {
	min-height:600px;
	overflow: hidden;
	margin:0;
	background-color: #200f05;
}

.bloc-gauche-contact {
	position: relative;
	z-index: 2;
	width:100%;
	height:100%;
	background-color: #1f0f05;
	max-width: 1400px;
	margin: 0 auto;
}
.infoContact {
	border-left: 0.1em solid #FFF;
	margin: 1em 0 0 40%;
	padding:0.5em;
}

.formContact {
	width:100%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	margin:0;
	/* background-color: yellow; */
	padding: 0;
}

.box01,.box02 {
	margin:0.5em;
	width:70%;
	height:auto;
}

.box03 {
	position: relative;
	width:30%;
	top :-3em;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.box04{
	padding:0.5em;
	width:60%;
}

.reseauxSoc {
	display: flex;
	flex-direction: row;
	justify-content: center;
}

.wpforms-form {
	/* background-color: aqua; */
}

#wpforms-112 .wpforms-form {

}

.wpforms-form .wpforms-field {
    /* width:50%; */
}

/* .wpforms-form .wpforms-field.wpforms-field-text input {
	padding:0.5em;
	border:none;
	border-radius:0.5em;
	background-color:#F1F1F1;
	font-family: 'Raleway', sans-serif;
	font-size:1em;
}


.wpforms-form .wpforms-field.wpforms-field-textarea textarea {

	margin:0 0 0.5em 0;
	padding:0.5em;
	border:none;
	border-radius:0.5em;
	background-color:#F1F1F1;
	font-family: 'Raleway', sans-serif;
	font-size:1em;
} 

*/

.cercle {
	background-color:#7e4e24;
	width: 2em;
	height:2em;
	border-radius : 50%;
	margin:0 0.5em;
	display: flex;
	justify-content: center;
}

.imgRS {
	width:80%;
	height:auto;
}

.contCaptcha {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.demi {
	width:75%!important;
}
.imgCaptcha {
	margin:-10px 0 0 0;
	padding:0;
	width:20%;
}

.formContact input:focus,.formContact textarea:focus {
	outline: none;
	background-color:#f4a933;
	color:#FFF;
}



.formContact button {
	background-color:saddlebrown;
	color:#FFF;
	margin:0;
	padding:0;
}
.formContact .erreur {
	margin:0 0 0.5em 0;
	padding:0.5em;
	border:none;
	border-radius:0.2em;
	background-color:crimson;
	color:#FFF;
}

.formContact .valid {
	margin:0 0 0.5em 0;
	padding:0.5em;
	border:none;
	border-radius:0.2em;
	background-color:palegreen;
	color:#333333;
}

.cadreInfo {
	background-color: #F1F1F1;
	margin-top:0.5em;
	border-radius: 0.2em;
	width:100%;
	padding:0.5em;
}


footer{
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color:#283039;
	color:#FFF;
	width:100%;
	padding:1em;
	margin:0 auto;
}

.accesSup {
	display:flex;
	justify-content: space-around;
}

.mentions {
	display:flex;
	flex-direction: row;
	justify-content: center;
	align-items : flex-start;
	padding:1em;
}

.infoLegale, .infoPublication {
	background-color: #737a82;
	box-sizing: border-box;
	margin: 0.5em;
	padding:0.5em;
	width:50%;
}

.copyright {
	border-top:0.1em solid #FFF;
	margin : 1em 0;
	padding: 0.5em;
	font-size: 0.8em;
	text-align: center;
}

hr {
	color:#f4a933!important;
	width:2em!important;
	margin:0;
	padding: 0;
}

/*---------------------TEXTEPAGE SEULE-------------------*/

.textePageSeule {
	position:relative;
	z-index: 2;
	width:90%;
	min-height:600px;
	height:auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;

	/* margin: 0 auto; */
	margin-left: 5.5em;
	left:-2.25em;
	padding-bottom:4em;

}

.textePageSeuleDroit {
	position:relative;
	z-index: 2;
	width:80%;
	padding-top:4em;
	margin: 0 auto;
	min-height:600px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
}

.textePageSeule div {
	margin: 0.5em 0;
	padding: 0.5em;
}

.textePageSeule h4 {
	font-size: 1.1em;
	font-weight: 600;
	text-transform: uppercase;
	/* color:#FFF; */
	margin:0.5em 0;
}


.textePageSeule img,.textePageSeuleDroit  img {
	border-radius: 0 2em 0 0;
	margin:0.5em;
}

.googleMap {
	width:100%;
	height:500px;
}



