/*
*@colors
*/
:root{
  --primary-color:#fff;
  --green:#7ed957;
  --grey:#e5e8f0;
  --brown:#3c3c3b;
}

/*
  ####  ###### #    # ###### #####    ##   #
 #    # #      ##   # #      #    #  #  #  #
 #      #####  # #  # #####  #    # #    # #
 #  ### #      #  # # #      #####  ###### #
 #    # #      #   ## #      #   #  #    # #
  ####  ###### #    # ###### #    # #    # ######
*/

body{
  background-color:var(--primary-color);
  color:var(--brown);
  font-family: 'Montserrat', sans-serif;
  font-weight:500;
}

.bg-green{
	background-color:var(--green);
	color:var(--primary-color);
}
.bg-grey{
	background-color:var(--grey);
}
.bg-brown{
	background-color:var(--brown);
	color:var(--primary-color);
}
.bg-pic{
	background-image:url(../images/header-dark.jpg);
	background-size:contain;
	color:#fff;
}
.txt-green{
	color:var(--green);
}

a{
	color:var(--green);
}
a:hover{
	color:var(--brown);
}

.btn-sadalu{
  background: var(--brown);
  color:#fff;
  border: 1px solid var(--brown);
}
.btn-sadalu:hover{
  background: transparent;
  color:var(--brown);
}

.btn-sadalu-white{
  color: var(--brown);
  background-color:#fff;
  border: 1px solid #fff;
}
.btn-sadalu-white:hover{
  background: transparent;
  color:#fff;
}
cite.txt-green{
  padding: 5px 0 5px 30px;
  border-left: 4px solid #fff;
  display: block;
  margin-top:20px;
}

/*
 #    # ###### #    # #    #
 ##  ## #      ##   # #    #
 # ## # #####  # #  # #    #
 #    # #      #  # # #    #
 #    # #      #   ## #    #
 #    # ###### #    #  ####
*/

nav.navbar{
	position:fixed;
  top:0;
	width:100vw;
	z-index:3;
	/* height:94px; */
  padding-top: 0;
  padding-bottom: 0;
}
nav img{
	height:59px;
}
nav.navbar-expand-lg ul.navbar-nav li a.nav-link{
	padding-top:35px;
	height:94px;
	padding-left:15px;
	padding-right:15px;
	text-transform:uppercase;
	font-size:0.75rem;
	background-color:var(--brown);
}
nav.navbar-expand-lg ul.navbar-nav li.active a.nav-link{
	background-color:var(--green);
	color:var(--brown) !important;
}

header{
	margin-top:66px;
	background-color:#000;
  position: relative;
}
header #titre{
	max-width:90%;
	margin:auto;
}
header p.sarl{
	color:var(--green);
	padding-bottom:15px;
}
header h2.sadalu{
	text-align:right;
	font-size:3rem;
	line-height:2.5rem;
}
header h2.sadalu span{
	font-size:2rem;
}
header h2.travaux{
	float:right;
	color:var(--green);
	text-transform:uppercase;
	font-size:0.75rem;
	padding-top:15px;
	background-image:url("../images/header-souligne.png");
	background-repeat:no-repeat;
	background-position:top right;
}

/*
  ####   ####  #    # ##### ###### #    # #    #
 #    # #    # ##   #   #   #      ##   # #    #
 #      #    # # #  #   #   #####  # #  # #    #
 #      #    # #  # #   #   #      #  # # #    #
 #    # #    # #   ##   #   #      #   ## #    #
  ####   ####  #    #   #   ###### #    #  ####
*/

section h3{
	padding:20px;
	font-size:2.5rem;
}
h3.zone{
	color:var(--green);
	font-size:1.3rem;
}
.hovereffect{
	border:1px solid #b0be32;
}
.hovereffect img{
	width:100%;
}
.hovereffect .overlay {
	  padding: 1em;
}
.hovereffect a{
	font-size:0.8rem;
}

.btn-outline-primary{
	color:var(--green) !important;
	border-color:var(--green);
}
.btn-outline-primary:hover{
	background-color:var(--green);
	border-color:var(--green);
	color:var(--primary-color) !important;
}
:target:before {  /*pour que les ancres tombent en face */
content:"";
display:block;
height:110px; /* fixed header height*/
margin:-110px 0 0; /* negative fixed header height */
}

.pic-header{
	height:80vh;
	background-image:url(../images/bg-header.jpg);
	background-attachment:fixed;
	background-size:cover;
	background-position:bottom;
	padding-top:5rem;
}
.bloc-header{
	background-color:rgba(60,60,49,0.6);
	color:#fff;
	text-align:center;
}
.bg-1, .bg-2, .bg-3{
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
}

.bg-1{
	background-image:url(../images/bg-1.jpg);
}
.bg-2{
	background-image:url(../images/bg-2.jpg);
}
.bg-3{
	background-image:url(../images/bg-3.jpg);
}


/*

  ####   ####  #    # #    # ##### ###### #####   ####
 #    # #    # #    # ##   #   #   #      #    # #
 #      #    # #    # # #  #   #   #####  #    #  ####
 #      #    # #    # #  # #   #   #      #####       #
 #    # #    # #    # #   ##   #   #      #   #  #    #
  ####   ####   ####  #    #   #   ###### #    #  ####
*/

.counter{
  font-size: 1.4rem;
}
.count{
  font-size: 3rem;
  font-weight: bold;
}

/*

  ####  #      # #####  ######
 #      #      # #    # #
  ####  #      # #    # #####
      # #      # #    # #
 #    # #      # #    # #
  ####  ###### # #####  ######
*/

.the-slide{
  margin:0;
}
.slick-prev:before, .slick-next:before{
  color:#fff;
  font-size: 3rem;
}
.slick-next, .slick-prev{
  z-index: 2;
  width: 50px;
  height:50px;
}
.slick-next{
  right:20px;
}
.slick-prev{
  left:20px;
}
.slick-dots{
  bottom: 0;
}
.slick-dots li button:before,
.slick-dots li.slick-active button:before{
  color:#fff;
}
.slick-dots li button:before{
  font-size: 14px;
  width:30px;
  height:30px;
}
.slick-dotted.slick-slider{
  margin-bottom:0;
  opacity:0.8;
}

/*

   ##   #    # # #    #
  #  #  ##   # # ##  ##
 #    # # #  # # # ## #
 ###### #  # # # #    #
 #    # #   ## # #    #
 #    # #    # # #    #
*/

.anim-logo{
  opacity:0;
  position: absolute;
  z-index: 2;
  transition: transform 1.5s, opacity 0.3s;
  transform: scale(1.5);
  width: auto;
  max-height: 90%;
  pointer-events: none;
}
.anim-logo.show{
  opacity: 1;
  transform: none;
}

/*
 ######  ####   ####  ##### ###### #####
 #      #    # #    #   #   #      #    #
 #####  #    # #    #   #   #####  #    #
 #      #    # #    #   #   #      #####
 #      #    # #    #   #   #      #   #
 #       ####   ####    #   ###### #    #
*/

footer a{
	color:#fff;
}
footer ul li{
	list-style-type:none;
	font-size:0.8rem;
}
footer ul{
	padding-left:0;
}

/*
 #####  ######  ####  #####   ####  #    #  ####  # #    # ######
 #    # #      #      #    # #    # ##   # #      # #    # #
 #    # #####   ####  #    # #    # # #  #  ####  # #    # #####
 #####  #           # #####  #    # #  # #      # # #    # #
 #   #  #      #    # #      #    # #   ## #    # #  #  #  #
 #    # ######  ####  #       ####  #    #  ####  #   ##   ######
*/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

	header #titre{
		max-width:80%;
	}
	header h2.sadalu{
		font-size:6rem;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	header h2.sadalu{
		font-size:5.2rem;
	}
  section h3{
  	padding:60px 0;
  }
	blockquote{
		background-image:url("../images/bg-avis.png");
		background-repeat:no-repeat;
		background-position:center;
		background-size:contain;
	}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	header #titre{
		max-width:70%;
	}
	header h2.sadalu{
		font-size:6.2rem;
		line-height:2.5rem;
	}
	header h2.sadalu span{
		font-size:2rem;
	}
	header h2.travaux{
		font-size:0.75rem;
	}
	blockquote{
		background-size: unset;
	}
  header{
  	margin-top:94px;
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	header #titre{
		max-width:60%;
	}
}