@charset "UTF-8";
/* line 3, ../scss/main.scss */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  border: none;
  box-sizing: border-box;
  list-style: none;
  transition: .3s;
}

/* Pour tous les navigateurs modernes */
/* line 12, ../scss/main.scss */
::-webkit-scrollbar {
  display: none;
  /* Masque la scrollbar sur Chrome, Safari et Edge */
}

/* line 16, ../scss/main.scss */
html {
  scrollbar-width: none;
  /* Masque la scrollbar sur Firefox */
  -ms-overflow-style: none;
  /* Masque la scrollbar sur Internet Explorer et Edge */
  width: 100%;
}
/* line 20, ../scss/main.scss */
html body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
  /* Voile blanc transparent */
  z-index: -1;
}
/* line 31, ../scss/main.scss */
html body {
  background-image: url("img/fond.jpg");
  background-size: 100% auto;
  /* Largeur 100%, hauteur automatique */
  background-position: top center;
  /* Commence en haut, centré horizontalement */
  background-repeat: no-repeat;
  background-attachment: local;
  /* Permet de scroller dans l'image */
  background-color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* line 51, ../scss/main.scss */
html {
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /*
      -webkit-font-smoothing: none;
      -webkit-font-smoothing: antialiased;
      -webkit-font-smoothing: subpixel-antialiased;
  */
  /*
      text-rendering: optimizeLegibility;
      text-rendering: geometricPrecision;
  */
}

/* line 71, ../scss/main.scss */
article, aside, details, figcaption, figure,
footer, header, main, menu, nav, section, summary {
  /* Add correct display for IE 9- and some newer browsers */
  display: block;
}

/* line 86, ../scss/main.scss */
img {
  max-width: 100%;
}

/* line 90, ../scss/main.scss */
a {
  text-decoration: none;
}
/* line 93, ../scss/main.scss */
a:hover {
  text-decoration: underline;
}

/* line 98, ../scss/main.scss */
a, img, p, h1, h2 {
  opacity: 0.85;
}

/* -------------------------------------------------------- Typo */
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-ExtraLightItalic.ttf") format("truetype");
  font-weight: 200;
  font-style: italic;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto Mono';
  src: url("fonts/RobotoMono-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}
@font-face {
  font-family: 'PPFragment-Serif';
  src: url("fonts/PPFragment-SerifRegular.woff2") format("woff2"), url("fonts/PPFragment-SerifRegular.woff") format("woff"), url("fonts/PPFragment-SerifRegular.ttf") format("truetype"), url("fonts/PPFragment-SerifRegular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'PPPangramSans';
  src: url("fonts/PPPangramSans-Semibold.woff2") format("woff2"), url("fonts/PPPangramSans-Semibold.woff") format("woff"), url("fonts/PPPangramSans-Semibold.ttf") format("truetype"), url("fonts/PPPangramSans-Semibold.otf") format("opentype");
  font-weight: 600;
  /* Semibold */
  font-style: normal;
}
@font-face {
  font-family: 'PPPangramSansBold';
  src: url("fonts/PPPangramSans-Bold.woff") format("woff"), url("fonts/PPPangramSans-Bold.ttf") format("truetype");
  font-weight: 600;
  /* Semibold */
  font-style: normal;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Lato';
  src: url("fonts/Lato-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}
/* -------------------------------------------------------- ANIMATION */
/* line 302, ../scss/main.scss */
main {
  opacity: 0;
  -moz-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  -webkit-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
  max-width: 1300px;
}

/* line 307, ../scss/main.scss */
main.layoutComplete {
  opacity: 1;
}

/* -------------------------------------------------------- Common */
/* line 312, ../scss/main.scss */
#navDesktop {
  display: block;
}

/* line 312, ../scss/main.scss */
#navPhone {
  display: none;
}

/* line 313, ../scss/main.scss */
body {
  margin: 0;
  font-size: 100%;
  line-height: 1.5;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow-y: scroll;
  overflow-x: hidden;
}

/* line 327, ../scss/main.scss */
h1 {
  font-family: 'Lato';
  font-weight: 600;
  font-style: normal;
  color: #333130;
  font-size: 3em;
  margin: -.07em 0 0 0;
  margin-bottom: 2vh;
  line-height: 1;
  letter-spacing: .05em;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* line 350, ../scss/main.scss */
h2 {
  font-family: 'PPFragment-Serif';
  text-transform: uppercase;
  font-size: 1.3em;
  color: #333130;
  margin-bottom: 4vh;
  line-height: 1.2;
  padding-bottom: .4em;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* line 364, ../scss/main.scss */
span {
  font-family: 'PPFragment-Serif';
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* line 374, ../scss/main.scss */
a {
  color: #333130;
  font-family: 'PPPangramSans';
  text-decoration: none;
}

/* line 383, ../scss/main.scss */
p {
  font-size: 1em;
  font-weight: 500;
  font-style: normal;
  font-family: 'Roboto Mono';
  color: #333130;
  text-align: left;
}

/* line 392, ../scss/main.scss */
.simple-grid {
  display: flex;
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}

/* line 398, ../scss/main.scss */
.simple-grid__cell--fill {
  flex: 1;
}

/* Cell with given width */
/* line 403, ../scss/main.scss */
.simple-grid__cell--1\/2 {
  flex: 0 0 50%;
}

/* line 406, ../scss/main.scss */
.simple-grid__cell--1\/3 {
  flex: 0 0 33.3333333%;
}

/* line 409, ../scss/main.scss */
.simple-grid__cell--1\/4 {
  flex: 0 0 25%;
}

/* line 412, ../scss/main.scss */
.simple-grid__cell--3\/4 {
  flex: 0 0 75%;
}

/* line 415, ../scss/main.scss */
.simple-grid__cell--4\/4 {
  flex: 0 0 75%;
}

/* line 418, ../scss/main.scss */
.simple-grid__cell--2\/3 {
  flex: 0 0 66.66%;
}

/* line 421, ../scss/main.scss */
.simple-grid__cell--3\/8 {
  flex: 0 0 37.5%;
}

/* -------------------------------------------------------- HOME */
/* line 427, ../scss/main.scss */
nav::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: rgba(255, 255, 255, 0.6);
  /* Voile blanc transparent */
  z-index: -1;
}

/* line 437, ../scss/main.scss */
nav {
  background-image: url("img/fond.jpg");
  background-size: 100% auto;
  /* Largeur 100%, hauteur automatique */
  background-position: top center;
  /* Commence en haut, centré horizontalement */
  background-repeat: no-repeat;
  z-index: 99;
  position: fixed;
  background-color: transparent;
  top: 0;
  left: 0;
  padding: 20px;
  height: 100px;
  width: 50px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  background-color: #f3f3f3;
}
/* line 457, ../scss/main.scss */
nav div:first-child {
  width: 60%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
}
/* line 464, ../scss/main.scss */
nav div:first-child img {
  height: 100%;
  margin-left: 3vw;
  opacity: 1;
}
/* line 469, ../scss/main.scss */
nav div:first-child h1 {
  margin-bottom: 0;
  font-size: 1.8em;
  font-family: 'PPFragment-Serif';
}
/* line 475, ../scss/main.scss */
nav div:last-child {
  margin-top: 15px;
  margin-left: -20px;
  width: 96vw;
}
/* line 479, ../scss/main.scss */
nav div:last-child span {
  transform: translateY(5px);
  display: block;
  width: 100%;
  height: 3px;
  background-color: #333130;
}

/* line 490, ../scss/main.scss */
.scroll-bar {
  z-index: 999;
  position: fixed;
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
  overflow: visible;
  top: 90px;
  right: 4vw;
  width: 3px;
  background-color: #333130;
  transition: height 0.2s ease-out;
}
/* line 503, ../scss/main.scss */
.scroll-bar span {
  transform: translatey(8px);
  width: 30px;
  height: 30px;
  background-image: url("img/down.png");
  background-size: cover;
  z-index: 200;
}

/* -------------------------------------------------------- INTRO */
/* line 517, ../scss/main.scss */
.intro {
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: space-evenly;
  margin-top: 20vh;
  gap: 5vw;
}
/* line 524, ../scss/main.scss */
.intro article {
  width: 40%;
}
/* line 526, ../scss/main.scss */
.intro article h1 {
  line-height: 1.2em;
  font-size: 2.5em;
}
/* line 530, ../scss/main.scss */
.intro article p {
  font-size: 1em;
}
/* line 535, ../scss/main.scss */
.intro #contact {
  width: 25%;
  transform: translate(5vw, -8vh);
}
/* line 539, ../scss/main.scss */
.intro #contact ul {
  width: 300px;
}
/* line 541, ../scss/main.scss */
.intro #contact ul li {
  display: flex;
  flex-direction: row;
  gap: 15px;
  margin-bottom: 10px;
}
/* line 547, ../scss/main.scss */
.intro #contact ul img {
  min-width: 20px;
  max-height: 30px;
  height: auto;
}
/* line 552, ../scss/main.scss */
.intro #contact ul a {
  display: block;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  max-width: 250px;
  width: 15vw;
}
/* line 563, ../scss/main.scss */
.intro #intro {
  transform: translateY(-3vh);
}

/* line 568, ../scss/main.scss */
#soustitre {
  width: 35vw;
  transform: translate(500px, -10vh);
}

/* -------------------------------------------------------- Fiche Projet - Gallerie Image */
/* line 575, ../scss/main.scss */
.carousel-container {
  width: 100%;
  margin: auto;
  position: relative;
  display: flex;
  flex-direction: column;
  padding-right: 30px;
  gap: var(--lx-gap);
}
/* line 584, ../scss/main.scss */
.carousel-container .carousel {
  aspect-ratio: 16/9;
  width: 100%;
  position: relative;
  overflow: hidden;
}
/* line 590, ../scss/main.scss */
.carousel-container .carousel .item {
  opacity: 0;
  width: 100%;
  height: 100%;
  display: none;
  transition: opacity 0.5s ease-in-out;
}
/* line 597, ../scss/main.scss */
.carousel-container .carousel .item img {
  opacity: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
/* line 605, ../scss/main.scss */
.carousel-container .carousel .item.active {
  opacity: 1;
  display: block;
}

/* line 615, ../scss/main.scss */
.btn {
  background-color: transparent;
  padding: 1em 2em;
  transform: translateY(-50%);
  z-index: 2;
  top: 50%;
  outline: none;
  border: none;
  cursor: pointer;
  text-transform: uppercase;
  font-family: 'Arial';
  font-weight: 600;
  font-size: 12px;
  transition: transform 0.2s ease-in-out;
}
/* line 630, ../scss/main.scss */
.btn:active, .btn:focus {
  transform: translateY(-50%) scale(0.9);
}
/* line 635, ../scss/main.scss */
.btn:hover {
  transform: translateY(-50%) scale(0.96);
}

/* line 641, ../scss/main.scss */
.boutonNav {
  top: 50%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-content: center;
  width: 100%;
  margin-top: -30%;
  height: 30px;
}
/* line 651, ../scss/main.scss */
.boutonNav .prev {
  width: 50px;
  background-image: url("img/arrow-left.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
/* line 660, ../scss/main.scss */
.boutonNav .next {
  margin-right: 32px;
  background-image: url("img/arrow-right.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* line 670, ../scss/main.scss */
.dots {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  gap: 10px;
}
/* line 677, ../scss/main.scss */
.dots .dot {
  cursor: pointer;
  height: 10px;
  width: 10px;
  background-color: #333130;
  transition: background-color 0.2s ease;
}
/* line 684, ../scss/main.scss */
.dots .dot.active, .dots .dot:hover {
  background-color: #F1EEED;
}

/* -------------------------------------------------------- Fiche Projet - Modal Image */
/* line 694, ../scss/main.scss */
.modal {
  z-index: 99;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  justify-content: center;
  align-items: center;
}

/* line 707, ../scss/main.scss */
.modal-content {
  max-width: 80%;
  max-height: 80%;
}

/* line 712, ../scss/main.scss */
.close {
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
  color: #fff;
  font-size: 20px;
}

/* -------------------------------------------------------- HOME CONTENT */
/* line 724, ../scss/main.scss */
.content {
  margin-top: 60vh;
  transform: translateX(-55px);
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
/* line 730, ../scss/main.scss */
.content article {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-evenly;
}
/* line 736, ../scss/main.scss */
.content article div p {
  padding-left: 120px;
}
/* line 739, ../scss/main.scss */
.content article div h1 {
  display: block;
  width: 500px;
  margin-bottom: 50px;
}
/* line 747, ../scss/main.scss */
.content #agenceur {
  transform: translateX(100px);
}
/* line 749, ../scss/main.scss */
.content #agenceur div {
  width: 50%;
}
/* line 751, ../scss/main.scss */
.content #agenceur div p {
  width: 80%;
}
/* line 755, ../scss/main.scss */
.content #agenceur img {
  width: 22vw;
}
/* line 759, ../scss/main.scss */
.content #renovation {
  transform: translateY(-3vh);
  margin-top: 5vh;
}
/* line 762, ../scss/main.scss */
.content #renovation div {
  width: 50%;
}
/* line 764, ../scss/main.scss */
.content #renovation div p {
  width: 80%;
  margin-bottom: 25px;
}
/* line 769, ../scss/main.scss */
.content #renovation img {
  width: 22vw;
  transform: translate(-10px, 10vh);
}
/* line 774, ../scss/main.scss */
.content #aeorogommage {
  transform: translateY(-3vh);
}
/* line 776, ../scss/main.scss */
.content #aeorogommage div {
  transform: translate(5vw, 18vh);
  width: 50%;
}
/* line 779, ../scss/main.scss */
.content #aeorogommage div p {
  width: 80%;
  margin-bottom: 175px;
}
/* line 784, ../scss/main.scss */
.content #aeorogommage img {
  width: 22vw;
  transform: translateY(2vh);
}
/* line 789, ../scss/main.scss */
.content #finitions {
  padding-bottom: 5vh;
  transform: translateY(-3vh);
  margin-bottom: 175px;
}
/* line 793, ../scss/main.scss */
.content #finitions div {
  transform: translate(10vw, 18vh);
  width: 50%;
}
/* line 796, ../scss/main.scss */
.content #finitions div p {
  width: 80%;
  padding-left: 0px;
}
/* line 802, ../scss/main.scss */
.content #finitions img {
  width: 22vw;
  transform: translate(80px, 8vh);
}

/* -------------------------------------------------------- FOOTER */
/* line 812, ../scss/main.scss */
footer {
  opacity: .98;
  z-index: 0;
  width: 100vw;
  padding-top: 50px;
  padding-bottom: 50px;
  background-color: #333130;
  color: #F1EEED;
}
/* line 816, ../scss/main.scss */
footer img {
  opacity: 1;
  z-index: 5;
}
/* line 825, ../scss/main.scss */
footer div a, footer div p, footer article a, footer article p {
  color: #F1EEED;
  z-index: 5;
}
/* line 830, ../scss/main.scss */
footer section {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  z-index: 5;
}
/* line 836, ../scss/main.scss */
footer section #logoFooter {
  transform: translate(20px, -70px);
  z-index: 5;
}
/* line 840, ../scss/main.scss */
footer section div {
  margin-bottom: 15px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  z-index: 5;
}
/* line 847, ../scss/main.scss */
footer section div p {
  text-align: right;
  display: block;
  width: 10vw;
  text-decoration: underline;
  margin-right: 20px;
  font-size: .9em;
  z-index: 5;
}
/* line 856, ../scss/main.scss */
footer section div a {
  font-size: .9em;
  z-index: 5;
  display: block;
  max-width: 300px;
}
/* line 864, ../scss/main.scss */
footer .reseauxSociaux {
  z-index: 5;
  transform: translate(8vw, -2vh);
}
/* line 867, ../scss/main.scss */
footer .reseauxSociaux a {
  margin-right: 10px;
}
/* line 871, ../scss/main.scss */
footer .pageLegaux {
  z-index: 5;
  border-bottom: solid 1px #F1EEED;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  gap: 20px;
  padding-right: 5px;
  padding-left: 5px;
  transform: translate(5vw, 8vh);
}

/* line 885, ../scss/main.scss */
#credit {
  z-index: 5;
  font-size: .7em;
  color: #F1EEED;
  letter-spacing: 0.1em;
  opacity: .2;
  padding-right: 30px;
  text-align: right;
}
/* line 893, ../scss/main.scss */
#credit a {
  color: #F1EEED;
}