/* fonts */
@import url("https://fonts.googleapis.com/css2?family=Oswald&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap");

/* -------------------------------------------------------------- 
  
   reset.css
   * Resets default browser CSS.
   
-------------------------------------------------------------- */

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
code,
del,
dfn,
em,
img,
q,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: "Oswald", sans-serif;
  vertical-align: baseline;
}

body {
  line-height: 1.5;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table {
  border-collapse: separate;
  border-spacing: 0;
}

caption,
th,
td {
  text-align: left;
  font-weight: normal;
}

table,
td,
th {
  vertical-align: middle;
}

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
}

blockquote,
q {
  quotes: "" "";
}

/* Remove annoying border on linked images. */
a img {
  border: none;
}
.bg-primary{background-color: #e82e31 !important;}

/* buttons | outils*/
.ye-btn-arrow {
  position: relative;
}

.ye-btn-arrow::after {
  content: "";
  width: 52px;
  height: 39px;
  right: 3px;
  top: 50%;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  position: absolute;
  background-image: url(../images/icons/btn-arrow-right.png),
    url(../images/icons/ellipse.png);
  background-position-x: center, 18px;
  background-position-y: center;
  transition: right 0.5s ease-in;
}

.ye-btn-arrow:hover::after {
  right: -17px;
  transition: right 0.5s ease-out;
}

.ye-btn-down {
  width: 68px;
  height: 91px;
  margin: 30px auto 0 auto;
  background-repeat: no-repeat;
  background-image: url(../images/icons/btn-arrow-down-bl.png),
    url(../images/icons/ellipse-b.png);
  background-position-x: 0px, 8px;
  background-position-y: 0px, 30px;
  transition: right 0.5s ease-in;
}

.ye-lignes-vertical {
  position: relative;
}

.ye-lignes-vertical::after {
  content: "";
  position: absolute;
  width: 17px;
  height: 20px;
  background-image: url(../images/content/accueil/lignes-vertical.png);
  left: calc(50% - 10px);
  bottom: -100px;
}

.ye-mt-5 {
  margin-top: 5em;
}

.ye-cercle {
  position: relative;
}

.ye-cercle::before {
  content: "";
  width: 32px;
  height: 32px;
  background-image: url(../images/icons/cercle-p.png);
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  transform: translate(-32px, -50%);
  left: -10px;
}

/* main */
.ye-section {
  margin: 60px 0;
}

/* menu */

.navbar {
  background-color: rgba(0, 0, 0, 0.75);
  padding: 24px 0;
}

.navbar .navbar-brand {
  margin-left: 110px;
}

.navbar .navbar-brand h3 {
  font-size: 36px;
  text-transform: uppercase;
  color: #fff;
}

.navbar .navbar-brand span {
  color: #e82e31;
}

.navbar .nav-item {
  margin-left: 42px;
}

.navbar .nav-item:first-of-type {
  margin-left: 80px;
}

.navbar .nav-item.ye-btn-soumission {
  margin-left: 88px;
}

.navbar .nav-item.ye-btn-soumission a {
  padding: 10px 28px;
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  background-color: #e82e31;
  color: #fff !important;
  letter-spacing: 1px;
}

.navbar .nav-item:not(.ye-btn-soumission) .nav-link {
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
}

.navbar .nav-item:not(.ye-btn-soumission) .nav-link:hover {
  color: #e82e31;
}

.navbar .nav-link.ye-active {
  color: #e82e31 !important;
}

/* banner top */
.ye-banner-top {
  margin-top: 0;
}

.ye-banner-top .ye-banner-top-container .container {
  max-width: 100%;
}

.ye-banner-top .ye-banner-container {
  margin-left: 100px;
}

.ye-banner-top .ye-banner-container h1 {
  font-size: 80px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 2px;

  text-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
}

.ye-banner-top .ye-banner-container h3 {
  margin-top: 10px;
  text-transform: uppercase;
  font-size: 36px;
  font-weight: 500;
  letter-spacing: 8px;
  color: #fff;

  text-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
}

.ye-banner-top .ye-banner-container button {
  font-family: "Open sans", sans-serif;
  font-size: 19px;

  margin-top: 40px;
  padding: 12px 65px 12px 18px;
  background-color: #131313;
  color: #fff;
  border: 1px solid #fae5e5;
}

/* section seul */
.ye-seul h3 {
  font-size: 46px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 30px;
}

.ye-seul h3 span {
  margin-left: 5px;
  color: #e82e31;
}

.ye-seul p,
.ye-seul h2 {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1px;
  color: #8e8e8e;
  padding: 0 15px;
}

.ye-seul h2 {
  line-height: 24px;
}

/* section outil */
.ye-outil {
  background-color: #ebebeb;
  padding: 60px 0;
  position: relative;
}

.ye-outil h3 {
  font-size: 46px;
  margin-bottom: 15px;
}

.ye-outil h4 {
  font-size: 18px;
  color: #b3b3b3;
  line-height: 30px;
}

.ye-outil button {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  background: #ff2a2d;
  color: #fff;
  letter-spacing: 1px;

  border: none;
  margin-top: 32px;
  padding: 20px 65px 18px 18px;
}

/* page outil */
.ye-outil-page {
  margin-bottom: 0;
}

.ye-outil-page > .container {
  max-width: 1250px;
}

/* section nos produits */
.ye-nos-produits h3 {
  font-size: 46px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 30px;
}

.ye-nos-produits h3 span {
  margin-left: 5px;
  color: #e82e31;
}

.ye-nos-produits p {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1px;
  color: #8e8e8e;
  margin-bottom: 70px;
}

.ye-nos-produits h4 {
  font-size: 24px;
  font-weight: 700;
  color: #1c232b;
}

.ye-nos-produits h5 {
  font-family: "Open sans", sans-serif;
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
  color: #e82e31;
  letter-spacing: 0.5px;
  margin: 15px 0 18px 0;
}

.ye-nos-produits .ye-description {
  font-family: "Myriad pro", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #b3b3b3;
  margin-bottom: 0;
}

.ye-nos-produits button {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  background: #ff2a2d;
  color: #fff;
  letter-spacing: 1px;

  border: none;
  margin-top: 20px;
  padding: 12px 65px 12px 18px;
}

.ye-nos-produits.ye-truck-gauche::after {
  bottom: -380px;
}

/* section avenir */
.ye-avenir .container {
  max-width: 1230px;
}

.ye-avenir h3 {
  font-size: 46px;
  font-weight: 700;
  text-transform: uppercase;
}

.ye-avenir h3 span {
  color: #e82e31;
}

.ye-avenir h4 {
  font-family: "Open sans", sans-serif;
  font-size: 14px;
  font-weight: 900;
  color: #e82e31;
  text-transform: uppercase;
  margin: 15px 0;
}

.ye-avenir p,
.ye-avenir h2 {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 400;

  color: #8e8e8e;
  text-align: justify;
  margin-bottom: 21px;
}

.ye-avenir h2 {
  line-height: 24px;
}

/* section services */
.ye-services {
  position: relative;
}

.ye-services .container {
  max-width: 1550px;
}

.ye-service-container {
  text-align: center;
}

.ye-services h3 {
  font-size: 24px;
  margin: 40px 0 20px 0;
}

.ye-services p {
  font-family: "Myriad Pro", sans-serif;
  font-size: 16px;
  color: #b3b3b3;
  padding: 0 25px;
}

/* section nos realisations */
.ye-nos-realisations .container {
  background-color: #fff;
}

.ye-nos-realisations .ye-top h4 {
  margin-top: 30px;
  font-family: "Myriad Pro", sans-serif;
  font-size: 16px;
}

.ye-nos-realisations .ye-top h3 {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 80px;
}

.ye-nos-realisations .ye-top h3 span {
  color: #e82e31;
}

.ye-nos-realisations .ye-images-bords {
  margin-top: 100px;
}

.ye-nos-realisations .ye-images-bords:first-of-type {
  padding-left: 30px;
}

.ye-nos-realisations .ye-images-bords:last-of-type {
  padding-right: 30px;
}

.ye-nos-realisations picture {
  display: block;
  margin-bottom: 30px;
  position: relative;
}

.ye-nos-realisations picture img {
  display: block;
}

.ye-nos-realisations .ye-picture-titres {
  position: absolute;
  bottom: 32px;
  left: 4%;
}

.ye-nos-realisations .ye-picture-titres h3 {
  font-size: 24px;
  color: #fff;
  margin-bottom: 12px;
}

.ye-nos-realisations .ye-picture-titres h4 {
  font-family: "Myriad Pro", sans-serif;
  font-size: 16px;
  color: #b3b3b3;
}

.ye-nos-realisations button {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  background: #ff2a2d;
  color: #fff;

  border: none;
  margin-top: 32px;
  padding: 16px 65px 12px 18px;
}

.ye-nos-realisations.ye-carre-gris {
  position: relative;
}

.ye-nos-realisations.ye-carre-gris::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 552px;
  background-color: #ebebeb;
  top: calc(50% - 135px);

  z-index: -3;
}

/* page realisations */
.ye-renovation h3,
.ye-construction-neuve h3,
.ye-industriel h3 {
  font-size: 46px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 50px;
}

.ye-renovation h3 span,
.ye-construction-neuve h3 span,
.ye-industriel h3 span {
  color: #e82e31;
}

/* section renovation */
.ye-renovation .container,
.ye-construction-neuve .container,
.ye-industriel .container {
  max-width: 1430px;
}

.ye-renovation picture,
.ye-construction-neuve picture,
.ye-industriel picture {
  margin-top: 26px;
}

.ye-industriel button {
  font-family: "Open sans", sans-serif;
  font-size: 20px;
  background: #ff2a2d;
  color: #fff;

  border: none;
  margin-top: 65px;
  padding: 10px 65px 12px 18px;
}

/*section partenaires */
.ye-partenaires {
  background-color: #131313;
  padding: 50px 0;
  margin-bottom: 0;
}

.ye-partenaires.ye-page-contact {
  background-color: #272727;
}

.ye-partenaires h3 {
  font-size: 25px;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 50px;
}

.ye-partenaires h3 span {
  color: #e82e31;
}

/* .ye-partenaires img {
  cursor: pointer;
} */

/* section obtenez une soumission */
.ye-obtenez-soumission h3 {
  text-transform: uppercase;
}

.ye-obtenez-soumission h3 span {
  color: #e82e31;
}

.ye-obtenez-soumission .ye-image-droite h3 {
  position: absolute;
  right: 0;
  top: -140px;
  max-width: 465px;

  font-size: 72px;
}

.ye-obtenez-soumission.ye-page-contact .ye-image-droite h3 {
  top: 22px;
}

.ye-obtenez-soumission .ye-formulaire p {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  color: #8e8e8e;
}

.ye-obtenez-soumission {
  margin: 0 0 50px 0;

  background-image: url(../images/content/accueil/image-jfl-right.png);
  background-repeat: no-repeat;
  background-position: top right;
  padding: 115px 0;
}

.ye-obtenez-soumission.ye-page-contact {
  background-image: url(../images/content/accueil/image-jfl-right-l.png);
  margin: 0;
}

.ye-obtenez-soumission.ye-page-contact .ye-formulaire h3,
.ye-obtenez-soumission.ye-page-contact .ye-formulaire p {
  margin-left: 15px;
}

.ye-obtenez-soumission .ye-contact-info {
  margin-top: 20px;
  padding-left: 5%;
}

.ye-obtenez-soumission .ye-contact-info p a {
  font-size: 20px;
  font-weight: 700;
  color: #000;
}

.ye-obtenez-soumission .ye-contact-info .ye-courriel {
  margin: 35px 0;
}

.ye-obtenez-soumission .ye-contact-info .ye-courriel a {
  color: #e82e31;
}

.ye-obtenez-soumission .container {
  max-width: 100%;
}

.ye-truck-gauche {
  position: relative;
}

.ye-truck-gauche::after {
  content: "";
  width: 198px;
  height: 471px;
  background-image: url(../images/content/accueil/truck-left.png);
  position: absolute;

  left: 0;
  bottom: -280px;
  z-index: 1;
}

/* pages de service */
.ye-description-service > .container {
  max-width: 1290px;
}

.ye-description-service.ye-residentielle {
  background-image: url(../images/content/services/service-1.jpg);
  background-position: 33% 61%;
  background-size: 35%;
}

.ye-description-service.ye-industrielle {
  background-image: url(../images/content/services/service-2.jpg);
  background-position: 24% 70%;
  background-size: 31%;
}

.ye-description-service.ye-liftmaster {
  background-image: url(../images/content/services/service-3.png);
  background-position: 34% 46%;
  background-size: 14%;
}

.ye-description-service.ye-gentek {
  background-image: url(../images/content/services/service-4.png);
  background-position: 36% 87%;
  background-size: 10%;
}

.ye-description-service {
  background-repeat: no-repeat;
  padding: 65px 0;
}

.ye-description-service .ye-image-container {
  margin-bottom: 55px;
}

.ye-description-service h3 {
  font-size: 24px;
  font-weight: 600;
  color: #1c232b;
}

.ye-description-service h4 {
  font-family: "Open sans", sans-serif;
  font-size: 14px;
  font-weight: 900;
  color: #e82e31;
  text-transform: uppercase;

  margin: 15px 0;
}

.ye-description-service p {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #b3b3b3;
  margin-bottom: 21px;
}

/* section avantages */
.ye-avantages > .container {
  max-width: 1290px;
}

.ye-avantages {
  text-align: center;
}

.ye-avantages h3 {
  font-size: 24px;
  font-weight: 600;
  color: #1c232b;
  margin-bottom: 85px;
}

.ye-avantages h4 {
  font-family: "Open sans", sans-serif;
  font-size: 14px;
  font-weight: 900;
  color: #e82e31;
  text-transform: uppercase;

  margin: 15px 0;
}

.ye-avantages p {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #b3b3b3;
  text-align: center;
  margin-bottom: 21px;
  padding: 0 10px;
}

/*** PAGE CARRIERE ***/

.ye-fond-gris {
  background-color: #fbfbfb;
  padding: 100px 0 70px 0;
}

.ye-avantages-carriere {
  background-color: #fbfbfb;
  padding-bottom: 60px;
}

/* .ye-avantages-carriere .ye-avantage-container {
  margin-bottom: 45px;
} */

.ye-avantages-carriere .ye-avantage-container:first-of-type {
  margin-left: 235px;
}

.ye-avantages-carriere h3 {
  font-family: "Open sans", sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: #131313;
  margin-bottom: 65px;
}

/* .ye-avantages-carriere p {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #8e8e8e;
  margin-bottom: 15px;
} */

/* section joignez-vous */
.ye-joignez-vous {
  background-color: #fff;
  background-image: url(../images/content/joignez-image.png);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: contain;
  padding: 150px 0;
}

.ye-joignez-vous h3 {
  font-family: "Open sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #8e8e8e;
  padding: 0 40px;
  text-align: center;
}

/* section merci */
.ye-merci {
  background-image: url(../images/content/accueil/image-jfl-right-s.png);
  background-position: top right;
  background-repeat: no-repeat;
  padding: 150px 0;
}

.ye-merci h2 {
  margin-bottom: 10px;
}

/* page 404 */
.ye-404 {
  padding: 100px 0;
}

.ye-404 .ye-404-container .ye-btn-arrow {
  display: inline-block;
  text-decoration: none;
  background-color: #ff292c;
  color: #fff;
  margin-top: 20px;
  padding: 12px 65px 12px 18px;
}

/* footer */
footer {
  background-image: url(../images/content/footer/truck-gauche.png),
    url(../images/content/footer/truck-droite.png);
  background-size: contain, 15%;
  background-repeat: no-repeat;
  background-position: 0 0, right bottom;

  background-color: #131313;
  padding-top: 100px;
  position: relative;
}

.ye-footer-top {
  padding-bottom: 50px;
}

.ye-footer-top .ye-colonne {
  z-index: 3;
}

.ye-footer-top .ye-colonne:first-of-type {
  padding: 0 50px;
}

.ye-footer-top h3 {
  font-size: 30px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 20px;
}

.ye-footer-top h3 span {
  color: #e82e31;
}

.ye-footer-top h4 {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
  margin-top: 10px;
  margin-bottom: 20px;
}

.ye-footer-top p,
.ye-footer-top p a {
  font-family: "Myriad Pro", sans-serif;
  font-size: 14px;
  color: #b3b3b3;
  line-height: 24px;
}

.ye-footer-top .ye-courriel {
  margin-bottom: 20px;
}

.ye-footer-top .ye-courriel a {
  font-size: 18px;
  color: #e82e31;
}

.ye-footer-top .ye-tels a {
  font-size: 18px;
  color: #ffffff;
}

.ye-footer-bottom {
  padding: 20px 0;
}

.ye-footer-bottom > .row {
  margin-right: 0;
}

.ye-footer-bottom h3 {
  font-family: "Myriad Pro", sans-serif;
  font-size: 14px;
  color: #b3b3b3;
}

.ye-footer-bottom h3 span {
  color: #e82e31;
  cursor: pointer;
}

.ye-en-haut {
  width: 39px;
  height: 52px;
  right: 12px;
  bottom: 13px;
  background-repeat: no-repeat;
  position: absolute;
  background-image: url(../images/icons/btn-arrow-up.png),
    url(../images/icons/ellipse.png);
  background-position-x: center, 6px;
  background-position-y: center, 6px;
  transition: bottom 0.5s ease-in;
}

.ye-en-haut:hover {
  bottom: 35px;
  transition: bottom 0.5s ease-out;
}

.ye-facebook {
  position: absolute;
  right: 80px;
  bottom: 18px;
}

@media screen and (max-width: 3000px) {
}

@media screen and (max-width: 1550px) {
  /* menu */
  .navbar .navbar-brand {
    margin-left: 60px;
  }

  .navbar .nav-item:first-of-type {
    margin-left: 60px;
  }

  .navbar .nav-item {
    margin-left: 35px;
  }

  .navbar .nav-item.ye-btn-soumission {
    margin-left: 44px;
  }

  /* pages de service */
  .ye-description-service.ye-residentielle {
    background-position: 26% 56%;
    background-size: 44%;
  }

  .ye-description-service.ye-industrielle {
    background-position: 10% 60%;
    background-size: 37%;
  }

  .ye-description-service.ye-gentek {
    background-position: 30% 87%;
    background-size: 15%;
  }
}

@media screen and (max-width: 1300px) {
  /* menu */
  .navbar .nav-item:not(.ye-btn-soumission) .nav-link {
    font-size: 14px;
  }

  .navbar .nav-item {
    margin-left: 20px;
  }

  /* pages de service */
  .ye-description-service.ye-residentielle {
    background-position: 20% 44%;
    background-size: 50%;
  }

  .ye-description-service.ye-industrielle {
    background-position: 8% 56%;
    background-size: 37%;
  }
}

@media screen and (max-width: 1200px) {
  /* menu */
  .navbar .navbar-brand {
    margin-left: 30px;
  }

  .navbar .navbar-brand h3 {
    font-size: 30px;
  }

  .navbar .nav-item:first-of-type {
    margin-left: 30px;
  }

  .navbar .nav-item {
    margin-left: 10px;
  }

  .navbar .nav-item:not(.ye-btn-soumission) .nav-link {
    font-size: 15px;
  }

  .navbar .nav-item.ye-btn-soumission {
    margin-left: 20px;
  }

  .navbar .nav-item.ye-btn-soumission a {
    padding: 10px 15px;
    font-size: 15px;
  }

  /* section avenir */
  .ye-avenir .container {
    max-width: 960px;
  }

  .ye-avenir h3 {
    font-size: 38px;
  }

  /* section seul */
  .ye-seul h3 {
    font-size: 35px;
  }

  /* section services */
  .ye-services h3 {
    font-size: 21px;
  }

  .ye-services p {
    font-size: 14px;
    padding: 0 14px;
  }

  /* section outil */
  .ye-outil h3 {
    font-size: 37px;
  }

  /* section nos realisations */
  .ye-nos-realisations.ye-carre-gris::after {
    height: 500px;
  }

  /* page realisation */
  .ye-renovation h3,
  .ye-construction-neuve h3,
  .ye-industriel h3 {
    font-size: 30px;
  }

  /* section partenaires */
  .ye-partenaires h3 {
    margin-bottom: 20px;
  }

  .ye-partenaires picture {
    margin-top: 30px;
  }

  /* section obtenez soumission */

  .ye-obtenez-soumission .ye-image-droite h3 {
    font-size: 67px;
  }

  .ye-obtenez-soumission .container .row {
    justify-content: center !important;
  }

  .ye-obtenez-soumission .ye-formulaire {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .ye-truck-gauche::after {
    left: -20px;
  }

  .ye-obtenez-soumission .ye-contact-info {
    display: none;
  }

  .ye-obtenez-soumission.ye-page-contact .ye-image-droite h1 {
    left: 45px;
  }

  /* pages de service */
  .ye-description-service.ye-residentielle {
    background-position: 20% 25%;
  }

  .ye-description-service.ye-industrielle {
    background-position: 8% 61%;
    background-size: 44%;
  }

  .ye-description-service.ye-liftmaster {
    background-position: 27% 29%;
    background-size: 24%;
  }

  .ye-description-service.ye-gentek {
    background-position: 24% 80%;
    background-size: 22%;
  }

  /* page carriere */
  .ye-joignez-vous {
    background-size: 40%;
  }

  /* section merci */
  .ye-merci-container {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  /* section footer */
  .ye-footer-top {
    max-width: 720px;
  }

  .ye-footer-top .ye-colonne:first-of-type {
    padding: 0 30px;
  }

  .ye-footer-top h3 {
    font-size: 21px;
  }
}

@media screen and (max-width: 992px) {
  /* general */
  .ye-section {
    margin: 100px 0;
  }

  /* menu */
  .navbar .navbar-brand {
    margin-left: 30px;
  }

  .navbar .nav-item:first-of-type {
    margin-left: 30px;
  }

  .navbar .nav-item {
    margin-left: 30px;
  }

  .navbar .nav-item.ye-btn-soumission {
    width: 190px;
    margin-left: 30px;
    margin-top: 15px;
  }

  /* banner top */
  .ye-banner-top .ye-banner-container {
    margin-left: 60px;
  }

  .ye-banner-top .ye-banner-container h1 {
    font-size: 64px;
  }

  .ye-banner-top .ye-banner-container h3 {
    font-size: 29px;
  }

  /* section avenir */
  .ye-avenir h3 {
    margin-top: 20px;
    font-size: 25px;
  }

  .ye-avenir h4 {
    font-size: 12px;
  }

  .ye-avenir p {
    font-size: 12px;
  }

  /* section seul */
  .ye-seul h3 {
    font-size: 27px;
  }

  /* section outil */
  .ye-outil h3 {
    font-size: 27px;
  }

  .ye-outil h4 {
    font-size: 15px;
  }

  .ye-outil .ye-btn-container {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  /* section nos produits */
  .ye-nos-produits h3 {
    font-size: 33px;
  }

  /* section nos realisations */
  .ye-nos-realisations button {
    font-size: 14px;
    padding: 18px 65px 12px 18px;
  }

  .ye-nos-realisations .ye-picture-titres h3 {
    font-size: 12px;
  }

  .ye-nos-realisations .ye-picture-titres h4 {
    font-size: 12px;
  }

  /* section obtenez soumission */
  .ye-obtenez-soumission .ye-image-droite h3 {
    font-size: 50px;
    top: -89px;
  }

  .ye-obtenez-soumission.ye-page-contact {
    background-size: 50%;
  }

  /* pages de service */
  .ye-description-service.ye-gentek {
    background-position: 24% 45%;
    background-size: 22%;
  }

  .ye-description-service.ye-industrielle {
    background-position: 8% 33%;
  }

  /* page carriere */
  .ye-avantages-carriere > .container {
    max-width: 700px;
  }

  .ye-avantages-carriere .ye-avantage-container:first-of-type {
    margin-left: 75px;
  }
}

@media screen and (max-width: 767px) {
  /* section produits */
  .ye-nos-produits .ye-partie-1 div:nth-child(1),
  .ye-nos-produits .ye-partie-3 div:nth-child(1) {
    order: 1;
    margin-bottom: 10px;
  }

  .ye-nos-produits .ye-partie-1 div:nth-child(2),
  .ye-nos-produits .ye-partie-3 div:nth-child(2) {
    order: 3;
  }

  .ye-nos-produits .ye-partie-1 div:nth-child(3),
  .ye-nos-produits .ye-partie-3 div:nth-child(3) {
    order: 2;
  }

  .ye-nos-produits .ye-partie-2 div:nth-child(1),
  .ye-nos-produits .ye-partie-4 div:nth-child(1) {
    order: 3;
  }

  .ye-nos-produits .ye-partie-2 div:nth-child(2),
  .ye-nos-produits .ye-partie-4 div:nth-child(2) {
    order: 1;
    margin-bottom: 10px;
  }

  .ye-nos-produits .ye-partie-2 div:nth-child(3),
  .ye-nos-produits .ye-partie-4 div:nth-child(3) {
    order: 3;
  }
}

@media screen and (max-width: 640px) {
  /* general */
  .ye-lignes-vertical::after {
    content: none;
  }

  .ye-section {
    margin: 50px 0;
  }

  /* section banner top */
  .ye-banner-top {
    margin-top: 0;
    padding-top: 45px !important;
    padding-bottom: 80px !important;
  }

  .ye-banner-top .ye-banner-container {
    margin-left: 20px;
  }

  .ye-banner-top .ye-banner-container h3 {
    font-size: 21px;
  }

  .ye-banner-top .ye-banner-container h1 {
    font-size: 31px;
  }

  /* section avenir */
  .ye-avenir h3 {
    margin-top: 10px;
    font-size: 34px;
  }

  /* section services */
  .ye-service-container picture {
    display: block;
    margin-top: 30px;
  }

  .ye-services h3 {
    margin: 18px 0 14px 0;
  }

  /* section outil */
  .ye-outil .ye-btn-container {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* page realisation */
  .ye-renovation h3,
  .ye-construction-neuve h3,
  .ye-industriel h3 {
    font-size: 20px;
    margin-bottom: 0;
  }

  /* section nos realisations */
  .ye-nos-realisations picture img {
    margin: 0 auto;
  }

  .ye-nos-realisations .ye-top h3 {
    margin-bottom: 20px;
  }

  .ye-nos-realisations .ye-images-bords:first-of-type {
    padding-left: 15px;
    order: 2;
  }

  .ye-nos-realisations .ye-images-bords:last-of-type {
    padding-right: 15px;
    order: 1;
  }

  .ye-nos-realisations .ye-images-centre {
    order: 3;
  }

  .ye-nos-realisations .ye-images-bords {
    margin-top: 0;
  }

  .ye-nos-realisations .ye-picture-titres h3 {
    font-size: 20px;
  }

  /* section partenaires */
  .ye-partenaires picture {
    margin-top: 40px;
  }

  /* section obtenez soumission */

  .ye-obtenez-soumission {
    margin: 0;
  }

  .ye-obtenez-soumission .ye-image-droite {
    order: 1;
  }

  .ye-obtenez-soumission .ye-formulaire {
    order: 2;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .ye-obtenez-soumission .ye-image-droite h3 {
    position: initial;
    font-size: 40px;
  }

  .ye-obtenez-soumission.ye-page-contact .ye-formulaire h3,
  .ye-obtenez-soumission.ye-page-contact .ye-formulaire p {
    display: none;
  }

  .ye-obtenez-soumission.ye-page-contact {
    background-size: 110%;
  }

  /* pages de service */
  .ye-description-service.ye-residentielle {
    background-position: 100% 5%;
  }

  .ye-description-service.ye-industrielle {
    background-position: 82% 8%;
  }

  .ye-description-service.ye-liftmaster {
    background-position: 82% 3%;
  }

  .ye-description-service.ye-gentek {
    background-position: 82% 3%;
  }

  /* page carriere */
  .ye-avantages-carriere .ye-avantage-container {
    margin-left: 75px;
  }

  .ye-joignez-vous {
    background-image: none;
    padding: 45px 0 100px 0;
  }

  /* section merci */
  .ye-merci-container {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .ye-merci h2 {
    font-size: 24px;
  }

  /* section footer */
  footer::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.369);
    top: 0;
  }

  .ye-footer-top .ye-colonne:first-of-type {
    padding: 0 15px;
  }

  /* button en haut */
  .ye-en-haut {
    bottom: 61px;
  }

  .ye-en-haut:hover {
    bottom: 71px;
  }
}

@media screen and (max-width: 414px) {
  /* section avenir */
  .ye-avenir h3 {
    font-size: 28px;
  }

  /* section partenaires */
  .ye-partenaires h3 {
    font-size: 23px;
  }
}