/*
#@0
#@1
#@2
*/
/* =========== */
/* BLOG STYLES */
/* =========== */
/* ============= */
/*  CUSTOM VARS  */
/* ============= */
/*	////
	SCSS
	//// */
/*	//// 
	TEXT
	//// */
/*	////
	URLS
	//// */
/*	/////
	FILES
	///// */
/*	/////
	FONTS
	///// */
/*	/////
	SIZES
	///// */
/*	//////
	COLORS
	////// */
/* SHARED WITH BACKOFFICE RTE : add $c_ */
/* ------------------------------------ */
/* ============= */
/* SHARED STYLES */
/* ============= */
/*	********
	 FOOTER
	******** */
footer {
  position: fixed;
  z-index: 10;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100px;
  background: #f2f2f2;
  padding: 15px 30px;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
}
/*	FOOTER ELEMENTS
		--------------- */
/* > Section size */
#contact_details, #legals, #lang_and_social {
  width: 30vw;
}
/* > Links */
footer a {
  display: inline-block;
  color: #231f20;
  transition: color 300ms;
}
/* ***** HOVER ***** */
footer a:hover, footer a.active {
  color: #c69838;
}
/*	LEFT INFORMATIONS
		----------------- */
/* > Logo */
#footer_logo {
  width: calc(30vw - 250px);
  height: 70px;
  padding: 10px 20px;
  background: white;
  object-fit: contain;
  object-position: center center;
}
/* > Contact summary */
#contact_summary {
  display: inline-block;
  width: 200px;
  margin-left: 12px;
  padding: 5px 0 5px 12px;
  border-left: 1px solid #231f20;
  line-height: 0.8rem;
  white-space: nowrap;
}
/*	LANG AND SOCIAL
		--------------- */
/* > Links */
#lang_and_social a {
  margin: 0 3px;
}
/* > Back home link */
#home_back {
  margin-right: 20px !important;
}
/* > Lang first link */
.first_social {
  margin-left: 20px !important;
}
/*	LEGALS
		------ */
.legals_links {
  margin-top: 5px;
  width: 100%;
  text-align: right;
}
/*	*******
	 POPIN
	******* */
#popin {
  position: fixed;
  z-index: 10000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(242, 240, 242, 0.9);
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  -webkit-transition: all 300ms;
  -o-transition: all 300ms;
  transition: all 300ms;
}
#popin i, #popin em {
  position: fixed;
  z-index: 15000;
  top: 20px;
  right: 20px;
  font-size: 2.5rem;
  cursor: pointer;
}
#popin strong {
  font-weight: 600;
}
#popin a {
  color: #c69838;
  text-decoration: underline;
}
#popin .box {
  width: 900px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
/* MODEL 1
	   ------- */
#popin.model_1 .text, #popin.model_2 .text {
  width: 100%;
  height: 500px;
  padding: 30px;
  background-color: rgba(35, 31, 32, 0.8);
  text-transform: uppercase;
  letter-spacing: 0.1rem;
  font-size: 0.9rem;
  line-height: 1.4rem;
  color: #fff;
  position: relative;
}
#popin .overflow {
  width: calc(50% - 30px);
  padding-right: 10px;
  height: 100%;
  overflow: auto;
}
#popin .overflow.full {
  width: 100%;
}
/* width */
#popin .overflow::-webkit-scrollbar {
  width: 10px;
  cursor: pointer;
}
/* Track */
#popin .overflow::-webkit-scrollbar-track {
  background: white;
}
/* Handle */
#popin .overflow::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}
/* Handle on hover */
#popin .overflow::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.4);
}
#popin.model_1 img {
  display: block;
  width: 50%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  right: 0;
}
/* MODEL 2
	   ------- */
#popin.model_2 .text {
  width: 100%;
  padding: 30px;
  margin: 60px;
}
#popin.model_2 img {
  display: none;
}
/*	*****
	 TAC
	***** */
#tarteaucitronAlertBig {
  background-color: #231f20 !important;
  /* couleur de fond */
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}
/* Boutons Accepter / Refuser tout */
.tarteaucitronAllow {
  background-color: #bf9a4a !important;
}
.tarteaucitronDeny {
  background-color: #C1292E !important;
}
/* ======================= */
/* ======================= */
/* RESPONSIVE BREAK POINTS */
/* ======================= */
/* ======================= */
/* ---------- BIG DESKTOP ---------- */
/* ---------- BIG TABLET LANDSCAPE (1000) ---------- */
/* ---------- TABLET LANDSCAPE (900) ---------- */
@media screen and (max-width: 1050px) {
  footer {
    height: auto;
  }
  #contact_details, #legals, #lang_and_social {
    width: 100vw;
  }
  #contact_details {
    justify-content: center;
    margin-bottom: 20px;
  }
  #footer_logo {
    width: 200px;
  }
  #lang_and_social {
    margin-bottom: 20px;
    font-size: 0.8rem;
  }
  #legals.fxje {
    justify-content: center;
  }
}
/* ---------- TABLET PORTRAIT AND SMARTPHONE LANDSCAPE (720) ---------- */
/* ---------- SMARPHONE LANDSCAPE (600) ---------- */
/* ---------- SMARPHONE PORTRAIT (350) ---------- */
@media screen and (max-width: 450px) {
  /* MODEL 1 */
  /* MODEL 2 */
  footer {
    position: relative;
    bottom: auto;
    left: auto;
  }
  #contact_summary {
    width: 100%;
    margin-left: 0;
    margin-top: 15px;
    padding: 5px 0;
    border-left: none;
    text-align: center;
  }
  #home_back, .first_social {
    margin: 0 !important;
  }
  #languages {
    width: 100%;
    margin: 20px 0;
    text-align: center;
    font-size: 1rem;
  }
  .fab {
    font-size: 1.5rem;
  }
  #popin .box {
    width: -webkit-calc(100% - 40px);
    width: calc(100% - 40px);
  }
  #popin.model_1 .text, #popin.model_2 .text {
    height: 400px;
  }
  #popin.model_1 .text, #popin.model_2 .text {
    padding: 30px;
  }
  #popin.model_1 img, #popin.model_2 img {
    display: none;
  }
  .legals_links {
    text-align: center;
  }
}
/* ---------- MOBILE PORTRAIT (320) ---------- */
/* =========== */
/* PAGE STYLES */
/* =========== */
/*	******
	 TEXT
	****** */
/* > Inline bloc */
.text.bigger {
  font-size: 1.0625rem;
  line-height: 1.3rem;
}
/* ======================= */
/* ======================= */
/* RESPONSIVE BREAK POINTS */
/* ======================= */
/* ======================= */
/* ---------- BIG DESKTOP ---------- */
/* ---------- BIG TABLET LANDSCAPE (1000) ---------- */
/* ---------- TABLET LANDSCAPE (900) ---------- */
/* ---------- TABLET PORTRAIT AND SMARTPHONE LANDSCAPE (720) ---------- */
/* ---------- SMARPHONE LANDSCAPE (600) ---------- */
/* ---------- SMARPHONE PORTRAIT (350) ---------- */
/* ---------- MOBILE PORTRAIT (320) ---------- */
/*	***********
	 BLOG HOME
	*********** */
/*	GALLERY
		------- */
#galerie picture, #galerie picture img, #galerie a {
  display: inline-block;
  width: calc(20% - 20px);
  height: 200px;
  object-fit: cover;
  object-position: center center;
  margin-right: 25px;
  margin-bottom: 25px;
  cursor: pointer;
}
#galerie a {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  font-weight: 700;
  text-transform: uppercase;
  color: #231f20;
  transition: color 300ms;
  background: radial-gradient(#e1e2e3 3px, transparent 4px), radial-gradient(#e1e2e3 3px, transparent 4px), linear-gradient(#fff 4px, transparent 0), linear-gradient(45deg, transparent 74px, transparent 75px, #e1e2e3 75px, #e1e2e3 76px, transparent 77px, transparent 109px), linear-gradient(-45deg, transparent 75px, transparent 76px, #e1e2e3 76px, #e1e2e3 77px, transparent 78px, transparent 109px), #fff;
  background-size: 109px 109px, 109px 109px, 100% 6px, 109px 109px, 109px 109px;
  background-position: 54px 55px, 0px 0px, 0px 0px, 0px 0px, 0px 0px;
}
/* ***** HOVER ***** */
#galerie a:hover {
  color: #c69838;
}
#galerie picture.fifth {
  margin-right: 0;
}
#galerie picture img {
  width: 100%;
  margin: 0;
}
/*	**************
	 BLOG ARTICLE
	************** */
/*	TEXT
		---- */
article.maintext, .maintext.gallery {
  margin-bottom: 40px;
}
/*	GALLERY
		------- */
article #galerie picture, article #galerie picture img {
  height: auto;
  object-fit: cover;
}
/* ======================= */
/* ======================= */
/* RESPONSIVE BREAK POINTS */
/* ======================= */
/* ======================= */
/* ---------- BIG DESKTOP ---------- */
/* ---------- BIG TABLET LANDSCAPE (1000) ---------- */
/* ---------- TABLET LANDSCAPE (900) ---------- */
/* ---------- TABLET PORTRAIT AND SMARTPHONE LANDSCAPE (720) ---------- */
/* ---------- SMARPHONE LANDSCAPE (600) ---------- */
/* ---------- SMARPHONE PORTRAIT (350) ---------- */
@media screen and (max-width: 450px) {
  #galerie picture, #galerie picture img, #galerie a {
    width: 100%;
    height: 300px;
    margin-right: 0;
  }
}
/* ---------- MOBILE PORTRAIT (320) ---------- */
