/**/
@import url('https://fonts.googleapis.com/css2?family=Trocchi&display=swap');

@font-face {
     font-family: 'Better_Smile';
    font-style: normal;
    font-weight: normal;
    src: local('gothic'), url('/assets/fonts/Better_Smile.woff') format('woff');
    }

    @font-face {
         font-family: 'Better_Smile';
        src: url('/assets/fonts/Better_Smile.woff2') format('woff2'),
            url('/assets/fonts/Better_Smile.woff') format('woff');
        font-weight: normal;
        font-style: normal;
        font-display: swap;
    }

.validation{
display: block
}
:root{
	--vert: #5d726b ;
	--creme: #c7a67c;
	--noir: #000000;
	--blanc:#ffffff;
}
.vert{
color: var(--vert)}
.titre {
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-size: 2.2rem;
	margin-bottom: 0rem;
}

.trocchi{
 font-family: "Trocchi", serif;
font-family: "Trocchi", serif;
  font-weight: 400;
  font-style: normal;
}
.better{
 font-family: 'Better_Smile';
	text-transform: lowercase!important;
font-size: 5em;
top: 20px

}

.trocchi2{
 font-family: "Trocchi", serif;
font-family: "Trocchi", serif;
  font-weight: 400;
  font-style: normal;
}
.better2{
 font-family: 'Better_Smile';
	text-transform: lowercase!important;
font-size: 5em;
top: 20px

}
.creme{
color: var(--creme)
}

.btn2 {
	background: var(--vert);
	color: var(--blanc);
	width: auto;
	height: 60px;
	border: 0;
	font-size: 18px;
	padding-top: 20px;
	border-radius: 4px;
	font-family: "Raleway", sans-serif;
	transition: 0.6s;
	overflow: hidden;
	text-transform: uppercase
}

.btn2:focus {
	outline: 0;
}

.btn2:before {
	content: "";
	display: block;
	position: absolute;
	background: rgba(255, 255, 255, 0.5);
	width: 60px;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0.5;
	filter: blur(30px);
	transform: translateX(-100px) skewX(-15deg);
}

.btn2:after {
	content: "";
	display: block;
	position: absolute;
	background: rgba(255, 255, 255, 0.2);
	width: 30px;
	height: 100%;
	left: 30px;
	top: 0;
	opacity: 0;
	filter: blur(5px);
	transform: translateX(-100px) skewX(-15deg);
}

.btn2:hover {
	background: var(--vert);
	cursor: pointer;
	color: var(--creme)
}

.btn2:hover:before {
	transform: translateX(300px) skewX(-15deg);
	opacity: 0.6;
	transition: 0.7s;
}

.btn2:hover:after {
	transform: translateX(300px) skewX(-15deg);
	opacity: 1;
	transition: 0.7s;
}





.btn3 {
	background: var(--creme);
	color: var(--vert);
	width: auto;
	height: 60px;
	border: 0;
	font-size: 18px;
	padding-top: 20px;
	border-radius: 4px;
	font-family: "Raleway", sans-serif;
	transition: 0.6s;
	overflow: hidden;
	text-transform: uppercase
}

.btn3:focus {
	outline: 0;
}

.btn3:before {
	content: "";
	display: block;
	position: absolute;
	background: rgba(255, 255, 255, 0.5);
	width: 60px;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0.5;
	filter: blur(30px);
	transform: translateX(-100px) skewX(-15deg);
}

.btn3:after {
	content: "";
	display: block;
	position: absolute;
	background: rgba(255, 255, 255, 0.2);
	width: 30px;
	height: 100%;
	left: 30px;
	top: 0;
	opacity: 0;
	filter: blur(5px);
	transform: translateX(-100px) skewX(-15deg);
}

.btn3:hover {
	background: var(--creme);
	cursor: pointer;
	color: var(--blanc)
}

.btn3:hover:before {
	transform: translateX(300px) skewX(-15deg);
	opacity: 0.6;
	transition: 0.7s;
}

.btn3:hover:after {
	transform: translateX(300px) skewX(-15deg);
	opacity: 1;
	transition: 0.7s;
}

.bgcreme{
background: var(--creme)}
/* MENU HEADER */



.header .sticking, .header .not-sticking {
	background: var(--vert)
}
@media (min-width: 992px) {
  .header__logo img {
    width: 400px;
  }


.header__logo {
	display: block;
	height: 80px;
	padding: 00px 0;
}
}

@media (min-width: 992px){
.index .header .not-sticking {
	background: var(--vert)
}

}

@media (max-width: 991px) {
.hidemob{
display: none}
}
.header .not-sticking {
	background: var(--vert)!important;
}

.header__logo img {
	width: 300px;
	padding: 20px 0;
}
.titre-baseline {
	font-weight: 300;
	font-size: 5.5rem;
	letter-spacing: 1px;
	text-transform: inherit;
	text-align: right;
	color: var(--creme);
	text-shadow: #000000 0.05em 0.05em 0.1em;
	line-height: 0.7;
}
.titre-baseline span{
	color: var(--blanc)
}
.titre-baseline span::before {
	display: none
	
}
.section-scroller-wrapper > .section-scroller {
	color: var(--blanc);
	font-size: 1rem;
	letter-spacing: 2px;
	line-height: 1.3;
}


.produitshabitationslider .carousel-item article {
	width: calc(100% - 1px);
	color: #242935;
	border: 0;
	margin: 0;
	text-align: center;
	background: var(--creme)
}


.produitshabitationslider .info_type {
	font-size: 18px;
	line-height: 15px;
	font-weight: 400;
	font-style: normal;
	color: var(--blanc);
	text-align: center !important;
}

.produitshabitationslider, .produitshabitationslider a {
	color: var(--blanc);
}
.produitshabitationslider .carousel-item article {
	color: var(--blanc);
	text-align: center;
}
.produitshabitationslider .info_prix-hai {
	color:  var(--blanc);
	font-weight: 300;
}

.video-wrapper{
background: var(--vert);
padding-top: 90px
}

/* ACCUEIL PRESENTATION  */

.home_cont_presentation {
	position: relative;
	background: var(--vert);
	background-size: cover;
	color: #fff;
	margin: 0 auto;
	padding: 10px 0  40px 0;
	/* display: -webkit-box; */
	/* display: -ms-flexbox; */
	display: flex;
}


/* ACCUEIL CATEGORIES  */

.trail{
display: none}
.slider .box2, .slider .box4 {
	background-color: var(--vert)
}
.slider .box1, .slider .box3 , .slider .box5 {
	background-color: var(--creme)
}

 .home_cont_categories {
	padding-top: 50px;
	padding-bottom: 50px;
background: var(--creme)
}

.cont_coordonnees {
	padding-bottom: 0;
	padding-top: 50px;
	background-color: var(--vert);
	color: var(--creme);
}
.cont_coordonnees p {
	color: var(--blanc);
	font-weight: 400;
}

.slider .box1 .details .h1, .slider .box3 .details .h1, .slider .box5 .details .h1 {
	color: var(--creme);
}

footer {
	background-color: var(--vert);
	padding: 20px 10px;
	color: var(--creme);
}
footer a{
	color: var(--blanc)!important;

}

@media (max-width:991px) {
.video-wrapper{
background: var(--vert);
padding-top: 0px
}
    attributes
}

.page2ref h1 {
	text-transform: uppercase;
	text-align: center;
	font-family: inherit;
}

.page2ref p {
text-align: justify;
}

.page_ref .description {
	display: block !important;
  }

  .page2ref h2 {
	font-size: 18px;
	}