*{margin: 0;padding:0;scroll-behavior: smooth;}

/* ##########
	TYPO
############ */

body{
	font-family: 'Poppins';
	width: 100%;
}
p{
	text-align: justify;
}
a{
	text-decoration: none;
}
.rotate{
	transform: rotate(90deg);
}
h2{
	font-family: 'Baskerville';
	font-size: 2em;
	font-weight: 600;
	margin: 5vh 0;
}
.beige{
	background-color: #F6F5F0;
}
.no-pb{
	padding-bottom: 0;
}
#burger{
	display: none;
	transition: 0.5s;
}

.alert{
	padding: 1rem 1rem;
	margin-bottom: 1rem;
	border: 1px solid transparent;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
	border-radius: .25rem;
	font-size: 0.7em;
}
.danger{
	color: #842029;
	background-color: #f8d7da;
	border-color: #f5c2c7;
}
.success{
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}
img#testimony{
	position: absolute;
	right: 5%;
	width: 10%;
}
.selected{
	color: #B13F0F;
	opacity: 1 !important;
}
a.selected:after{
	opacity: 1 !important;
	-webkit-transform: scale(1) !important;
	transform: scale(1) !important;
}

section{
	padding: 10% 12.5%;
	margin: auto;
}
.intro h3,
.intro p{
	width: 50%;
}
p.title{
	color: #9b4724;
	font-weight: bold;
}

nav{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: white;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 5%;
	box-sizing: border-box;
	z-index: 10;
	font-weight: 600;
}
nav img{
	width: 20%;
}
nav > div{
	width: 50%;
	display: flex;
	justify-content: space-around;
}
nav div a{opacity: 0.5;color:black}

header{
	height: 80vh;
	background-image: url('../images/bg/accueil-bw.jpg');
	position: relative;
	background-size: cover;
	background-position: top;
}
header > div:not(.informations){
	width: 45%;
	background-color: #000000b9;
	background-blend-mode: multiply;
	height: 100%;
	padding: 12% 5%;
	box-sizing: border-box;
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}
header div p:nth-child(3){
	color: #9b4724;
	font-weight: bold;
}
header div h1{
	color: white;
	font-family: 'Baskerville';
	font-size: 3em;
	font-weight: 600;
}
header div h1 span{
	color: #B13F0F;
}
.line{
	width: 30%;
	height: 5px;
	background: #9b4724;
}

.informations{
	width: 80%;
	min-height: 10vh;
	position: absolute;
	left: 10%;
	bottom: calc(-7vh - 1%);
	background: white;
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	padding: 1%;
	box-shadow: 1px 5px 10px rgb(196, 196, 196);
}
.informations > div{
	display: flex;
	margin: 0 1em 0 1em;
}

.informations div div:nth-child(1){
	width: 50px;
	height: 50px;
	background: #F3F3F3;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 100%;
	margin-right: 1em;
}
.informations div img{
	width: 1.5em;
}
.informations div a{
	text-decoration: none;
	color: black;
	font-size: 0.8em;
	font-weight: 600;
}
.informations div p{
	color: #C0C0C0 !important;
	font-size: 0.9em;
}


.intro{
display: flex;
	align-items: center;
	flex-wrap: wrap;
}

h3{
	font-weight: 500;
}
h3 span{
	color: #9b4724;
}
.intro p{
	opacity: 0.6;
}
article{
	display: flex;
	flex-wrap: wrap;
	background-color: #F7F6F1;
}
article > img,
article > div{
	width: 50%;
}
article > img{
	filter: grayscale(100%);
	transition: 0.4s;
}
article > img:hover{
	filter: inherit;
}
article > div{
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	box-sizing: border-box;
	padding: 5% 2%;
}
article > div h3{
	text-align: center;
}
article > div a{
	margin: auto;
	text-decoration: none;
	background-color: #B13F0F;
	color: white;
	border-radius: 3em;
	padding: 1vh 1em;
}

.domaines{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	border-radius: 0.5vh;
	box-shadow: 0px 0px 10px 0.5px rgb(148, 148, 148);
}
.domaines h3{
	display: flex;
	align-items: center;
	width: 100%;
	margin: 3vh auto;
	font-size: 0.8em;
}
.domaines h3 img{
	margin-right: 1em;
	width: 2em;
}

.temoignages{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
.temoignages div{
	width: 30%;
}
.temoignages div img{
	display: block;
	margin: 3vh auto;
	width: 2em;
}
.temoignages div i{
	margin-top: 2vh;
	text-align: right;
	width: 100%;
	display: block;
}
.temoignages div p{
	height: 30vh;
	font-style: italic;
}
section a{
	display: block;
	text-align: right;
	margin-top: 5vh;
	color: #9b4724;
	text-decoration: underline;
}

.prestations{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}
.prestations div div{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	box-shadow: 0px 4px 10px -4px rgb(148, 148, 148);
	padding: 1vh;
	margin-bottom: 3vh;
	border-radius: 1vh;
	max-height: 7vh;
    transition: max-height 0.15s ease-out;
	transition: 0.1s;
	overflow: hidden;
}
.prestations div div:hover{
	max-height: 500px;
    transition: max-height 0.25s ease-in;
	cursor: pointer;
}
.prestations div div img{
	transition: 0.5s;
}
.prestations div div:hover img{
	transform: rotate(180deg);
}

.prestations div div h3{
	display: flex;
	align-items: center;
	height: 7vh;
	box-sizing: border-box;
}
.prestations > div{
	width: 45%;
}
.prestations div div h3 img{
	margin-right: 1em;
	width: 1em;
}
.prestations ul{
	margin-top: 1vh;
	width: 100%;
	list-style-position: inside;
	list-style-image: url('../images/icon/list.png');
}
.galerie{
	display: flex;
	align-items: stretch;
	height: 50vh;
}
.galerie div#main{
	width: 50%;
	box-sizing: border-box;
	padding: 0.5em;
	background-image: url('../images/slider/1.jpg');
	transition: 0.5s;
	background-size: 105%;
	
}
.galerie > div{
	width: 50%;
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
}
.galerie div div{
	width: 45%;
	margin: 1%;
	background-image: url('../images/slider/2.jpg');
	transition: 0.5s;
	background-size: 110%;
}
.image{
	cursor: pointer;
}
.galerie div div:nth-child(2){
	background-image: url('../images/slider/3.jpg');
}
.galerie div div:nth-child(3){
	background-image: url('../images/slider/4.jpg');
}
.galerie div div:nth-child(4){
	background-image: url('../images/slider/5.jpg');
}

.galerie div div:hover,
.galerie div#main:hover{
	background-size: 120%;
}
.questions{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.questions > p,
.questions h2{
	width: 100%;
}
.questions div{
	width: 45%;
}
.questions h3{
	color: #B13F0F;
	margin-bottom: 2vh;
}


.slider{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.329);
	z-index: 99;
}
.slider .big{
	width: 40%;
	margin: 20vh auto;
	height: 45vh;
	border-radius: 1vh;
	position: relative;
	background-image: url('../images/slider/3.jpg');
	background-size: cover;
	background-position: center;
}
.slider .big img{
	position: absolute;
	left: -1em;
	top: 20vh;
	width: 1em;
	height: 1em;
	background: white;
	opacity: 0.7;
	border-radius: 2em;
	padding: 1vh;
	cursor: pointer;
	transition: 0.3s;
}
.slider .big img#close{
	top: -1em !important;
	right: -1em !important;
	left: inherit;
}
.slider .big img:hover{
	opacity: 1;
}
.slider .big img#right{
	left: inherit;
	right: -1em;
}
.slider h5{
	text-align: center;
	margin: 1em 0;
	font-size: 1em;
	font-weight: 500;
}



.contact{
	display: flex;	
	flex-wrap: wrap;
	align-items: stretch;
	width: 80%;
	margin: auto;
	background-color: rgba(153, 153, 153, 0.055);
	border-radius: 1em;
}
.contact form,
.contact iframe{
	width: 50%;
}
.contact form{
	border-radius: 1em 0 0 1em;
	padding: 2em;
	box-sizing: border-box;
}
.contact iframe{
	border-radius: 0 1em 1em 0;
}
.contact form{
	color: #9b4724;
}
.contact h3{
	margin: 5vh 0;
}
.contact form > a img{
	width: 1em;
	margin-right: 1em;
}
.contact form > a{
	color: #9b4724;
	font-weight: 500;
}

form input,label,textarea{
	width: 100%;
}
form input{
	margin-bottom: 2vh;
}
form label{
	font-weight: 500;
}
form label span{
	color: red;
}
form input,
form textarea{
	border: none;
	background-color: rgba(156, 156, 156, 0.144);
	border-radius: 0.5vh;
	font-size: 1em;
	padding: 1vh;
	box-sizing: border-box;
}

input[type="submit"]{
	background: #DFBC9E;
	color: white;
	width: 40%;
	display: block;
	margin: 3vh auto;
}




footer{
	background: #93360E;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 5vh 0;
}
footer div{
	width: 20%;
	color: white;
}
footer div h4{
	font-family: 'Didot';
}
footer div h5{
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 0.4vh;
	font-size: 1em;
	line-height: 3em;
}

footer div a{
	color: white;
	line-height: 2em;
	opacity: 0.8;
}
footer div a:hover{
	opacity: 1;
}