@charset "UTF-8";
.apparaitre {
  opacity: 1 !important;
  display: block !important; }

@font-face {
  font-family: 'montserrat';
  src: url("css/fonts/montserrat-regular-webfont.woff2") format("woff2"), url("css/fonts/montserrat-regular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal; }
@font-face {
  font-family: 'montserrat';
  src: url("css/fonts/montserrat-medium-webfont.woff2") format("woff2"), url("css/fonts/montserrat-medium-webfont.woff") format("woff");
  font-weight: 500;
  font-style: normal; }
@font-face {
  font-family: 'montserrat';
  src: url("css/fonts/montserrat-semibold-webfont.woff2") format("woff2"), url("css/fonts/montserrat-semibold-webfont.woff") format("woff");
  font-weight: 600;
  font-style: normal; }
@font-face {
  font-family: 'montserrat';
  src: url("css/fonts/montserrat-bold-webfont.woff2") format("woff2"), url("css/fonts/montserrat-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal; }
@font-face {
  font-family: 'montserrat';
  src: url("css/fonts/montserrat-black-webfont.woff2") format("woff2"), url("css/fonts/montserrat-black-webfont.woff") format("woff");
  font-weight: 900;
  font-style: normal; }
@font-face {
  font-family: 'open-sans';
  src: url("css/fonts/opensans-bold-webfont.woff2") format("woff2"), url("css/fonts/opensans-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal; }
@font-face {
  font-family: 'open-sans';
  src: url("css/fonts/opensans-regular-webfont.woff2") format("woff2"), url("css/fonts/opensans-regular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal; }
::selection {
  background: #86AFDD;
  /* WebKit/Blink Browsers */ }

::-moz-selection {
  background: #86AFDD;
  /* Gecko Browsers */ }

/* width */
::-webkit-scrollbar {
  width: 10px; }

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; }

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; }

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; }

.with_frm_style .frm_required {
  color: #fff !important; }

a {
  color: #fff;
  text-decoration: none; }

a:hover {
  color: #E30414; }

a {
  outline: none !important; }

a.ancre {
    position: relative;
    top: -160px;
    height: 0px;
    display: block; }

a:focus {
  outline: none !important; }

.px_263, section#carousel div.slide-carousel div.relative div.absolute h3, section#distribution-quincaillerie div.absolute-titre span, section#armature-entete div.absolute_titre h1, section#transformation-entete div.absolute_titre h1, section#entreprise-entete div.absolute_texte h1, section#entreprise-histoire div.ranger div.colonne span.absolute, section#page-404 span.absolute {
  font-family: 'montserrat', sans-serif;
  font-size: 10.7vw;
  line-height: 1.13;
  font-weight: 900;
  color: #000;
  text-transform: uppercase; }

.px_141, section#landing div.entete h1 strong, section#accueil-entete div.entete h1 strong, section#selection-produit-accueil div.colonne:last-of-type h3 strong, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2 strong, section#nos-experts-accueil-mobile div.full h2 strong, section#piece div.container h1 strong, section#service-conseil h2 strong, section#distribution-entete div.entete h1 strong, section#distribution-entreposage h2 strong, section#distribution-grand-distributeur div.texte h2 strong, section#autres-produits-entete div.colonne div.texte h1 strong, section#autres-produits-livraison h2 strong, section#autres-produits-slogan h2 strong, section#ponceaux-entete div.texte h1 strong, section#quincaillerie-entete div.entete h1 strong, section#quincaillerie-slogan h2 strong, section#entreprise-familiale div.texte h2 strong, section#entreprise-projets h2 strong, section#page-404 h1, section#poste-slogan h2 strong, section#carriere-entete h1 strong {
  font-family: 'montserrat', sans-serif;
  font-size: 5.4vw;
  line-height: 1.13;
  font-weight: 900;
  color: #E30414;
  text-transform: uppercase; }

.px_110, section#landing div.entete h1, section#accueil-entete div.entete h1, section#selection-produit-accueil div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:last-of-type h2, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2, section#nos-experts-accueil-mobile div.full h2, section#piece div.container h1, section#service-conseil h2, section#distribution-entete div.entete h1, section#distribution-entreposage h2, section#map h2, section#distribution-secteurs-activites div.contenu h2, section#distribution-grand-distributeur div.texte h2, section#autres-produits-entete div.colonne div.texte h1, section#autres-produits-livraison h2, section#autres-produits-slogan h2, section#ponceaux-entete div.texte h1, section#ponceaux-selection h2, section#drains-selection h2, section#ponceaux-selection-mobile h2, section#drains-selection-mobile h2, section#ponceaux-transport-surdimensionnes h2, section#quincaillerie-entete div.entete h1, section#quincaillerie-en-chiffre div.container h2, section#quincaillerie-slogan h2, section#entreprise-histoire h2, section#entreprise-familiale div.texte h2, section#entreprise-projets h2, section#entreprise-superieur h2, section#contact-form div.ranger div.colonne:first-of-type h3 strong, section#contact-form div.ranger div.colonne:last-of-type h2, section#demande-de-prix-form div.container-form h1, section#poste-slogan h2, section#carriere-entete h1, section#carriere-postulez div.container h2 {
  font-family: 'montserrat', sans-serif;
  font-size: 4.5vw;
  line-height: 1.09;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase; }
section#gallerie-realisations .texte h2,
.px_84, section#carousel h2, section#nos-secteurs-activite div.colonne:first-of-type h2, section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte h2, section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:first-of-type h3, section#nos-services-accueil div.colonne:first-of-type div.div h4, section#boutique-accueil h3, section#piece div.container h2, section#piece div.container div.description-ranger div.colonne h2, section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte h3, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre span.popup, section#distribution-avantages div.ranger h3, section#distribution-ouvert-au-public div.texte h3, section#distribution-metaux-usages div.texte h3, section#distribution-metaux-usages-mobile div.texte h3, section#distribution-quincaillerie div.texte h3, section#armature-entete h2, section#armature-experts-conseils div.colonne div.bg h2, section#transformation-entete h2, section#autres-produits-ponceaux div.colonne div.texte h2, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type h2, section#autres-produits-livraison div.etiquette h3, section#autres-produits-revetement div.colonne h3, section#ponceaux-slide div.colonne:first-of-type h2, section#tuyaux-slide div.colonne:first-of-type h2, section#ponceaux-selection div.ranger-content div.colonne h3, section#drains-selection div.ranger-content div.colonne h3, section#ponceaux-selection-mobile div.tab div.ranger-content h3, section#drains-selection-mobile div.tab div.ranger-content h3, section#ponceaux-transport-surdimensionnes div.colonne h3, section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg h2, div#carousel-marque h3, section#quincaillerie-conseil div.ranger div.colonne:first-of-type h3, section#quincaillerie-en-chiffre div.container div.ranger div.colonne h5, section#entreprise-histoire div.ranger div.colonne h3, section#entreprise-specialiste div.bg div.colonne h3, section#entreprise-clientele div.ranger div.colonne:first-of-type h3, section#contact-form div.ranger div.colonne:first-of-type h3, section#poste-form div.colonne:last-of-type h2, section#carriere-humain div.ranger div.colonne:last-of-type div.bg h2 {
  font-family: 'montserrat', sans-serif;
  font-size: 3.2vw;
  line-height: 1.07;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase; }

.px_33, section#landing div.texte h2, section#carousel div.slide-carousel div.colonne:last-of-type div.texte h3, section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute h3, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile div.absolute h4, section#boutique-accueil div.ranger div.colonne div.bg h5, section#piece div.container h3, section#map div.colonne div.bg h3, section#cueillette-livraison div.contenu div.ranger div.colonne h3, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre h4, section#distribution-avantages div.ranger h4, section#distribution-ouvert-au-public div.texte h4, section#armature-entete div.colonne h3, section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type h3, section#transformation-entete div.ranger div.colonne h3, section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type h3, section#autres-produits-ponceaux div.background div.ranger div.colonne div.bg h3, section#slides-revetements div.ranger div.colonne:last-of-type h4, section#ponceaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#tuyaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#ponceaux-selection div.ranger div.colonne h4, section#drains-selection div.ranger div.colonne h4, section#ponceaux-selection div.ranger-content div.colonne h4, section#drains-selection div.ranger-content div.colonne h4, section#ponceaux-selection-mobile div.tab div.accordeon h4, section#drains-selection-mobile div.tab div.accordeon h4, section#ponceaux-selection-mobile div.tab div.ranger-content h4, section#drains-selection-mobile div.tab div.ranger-content h4, section#quincaillerie-produits div.ranger div.colonne h4, section#quincaillerie-en-chiffre div.container div.ranger div.colonne p, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire label, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne label, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire input, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne input, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire textarea, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne textarea, section#quincaillerie-en-chiffre div.container div.ranger div.colonne section#entete-poste h4, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne h4, section#entreprise-entete div.container div.texte h4, section#entreprise-superieur div.ranger div.col h4, section#entreprise-superieur div.ranger div.bg h4, section#contact-map h1, section#contact-map h2, section#demande-de-prix-form .frm_style_style-formidable.with_frm_style .frm-show-form .frm_section_heading h3, section#page-404 p, section#page-404 div#formulaire label, div#formulaire section#page-404 label, section#page-404 div#formulaire input, div#formulaire section#page-404 input, section#page-404 div#formulaire textarea, div#formulaire section#page-404 textarea, section#page-404 section#entete-poste h4, section#entete-poste section#page-404 h4, section#entete-poste h1, section#carriere-postulez div.container div.post h3 {
  font-family: 'montserrat', sans-serif;
  font-size: 1.5vw;
  line-height: 1.35;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase; }

.px_33_pagination {
  font-family: 'open-sans', sans-serif;
  font-size: 1.5vw;
  line-height: 1.35;
  font-weight: 700;
  color: #E30414; }

.px_20_bouton_navigation, header div#top div.colonne:nth-child(2) p, header div#top div.colonne:nth-child(2) div#formulaire label, div#formulaire header div#top div.colonne:nth-child(2) label, header div#top div.colonne:nth-child(2) div#formulaire input, div#formulaire header div#top div.colonne:nth-child(2) input, header div#top div.colonne:nth-child(2) div#formulaire textarea, div#formulaire header div#top div.colonne:nth-child(2) textarea, header div#top div.colonne:nth-child(2) section#entete-poste h4, section#entete-poste header div#top div.colonne:nth-child(2) h4, header div#nav div.colonne:nth-child(2) nav ul.menu > li > a {
  font-family: 'montserrat', sans-serif;
  font-size: 0.8vw;
  line-height: 1.25;
  font-weight: 700;
  color: #fff; }

.px_16_navigation, header div#top div.colonne a p, header div#top div.colonne a div#formulaire label, div#formulaire header div#top div.colonne a label, header div#top div.colonne a div#formulaire input, div#formulaire header div#top div.colonne a input, header div#top div.colonne a div#formulaire textarea, div#formulaire header div#top div.colonne a textarea, header div#top div.colonne a section#entete-poste h4, section#entete-poste header div#top div.colonne a h4, header div#nav div.colonne a p, header div#nav div.colonne a div#formulaire label, div#formulaire header div#nav div.colonne a label, header div#nav div.colonne a div#formulaire input, div#formulaire header div#nav div.colonne a input, header div#nav div.colonne a div#formulaire textarea, div#formulaire header div#nav div.colonne a textarea, header div#nav div.colonne a section#entete-poste h4, section#entete-poste header div#nav div.colonne a h4 {
  font-family: 'montserrat', sans-serif;
  font-size: 0.6vw;
  line-height: 1.25;
  font-weight: 600;
  color: #fff; }

.px_16_footer, footer div.ranger div.colonne h4, footer div.ranger div.colonne p, footer div.ranger div.colonne div#formulaire label, div#formulaire footer div.ranger div.colonne label, footer div.ranger div.colonne div#formulaire input, div#formulaire footer div.ranger div.colonne input, footer div.ranger div.colonne div#formulaire textarea, div#formulaire footer div.ranger div.colonne textarea, footer div.ranger div.colonne section#entete-poste h4, section#entete-poste footer div.ranger div.colonne h4 {
  font-family: 'open-sans', sans-serif;
  font-size: 0.6vw;
  line-height: 2.19;
  font-weight: 400;
  color: #fff; }

.px_14, footer div.copyright div.ranger-copy div.colonne-copy p, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire label, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy label, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire input, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy input, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire textarea, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy textarea, footer div.copyright div.ranger-copy div.colonne-copy section#entete-poste h4, section#entete-poste footer div.copyright div.ranger-copy div.colonne-copy h4, section#piece div.container div.livret-de-poids p.legal, section#piece div.container div.livret-de-poids div#formulaire label.legal, div#formulaire section#piece div.container div.livret-de-poids label.legal, section#piece div.container div.livret-de-poids div#formulaire input.legal, div#formulaire section#piece div.container div.livret-de-poids input.legal, section#piece div.container div.livret-de-poids div#formulaire textarea.legal, div#formulaire section#piece div.container div.livret-de-poids textarea.legal, section#piece div.container div.livret-de-poids section#entete-poste h4.legal, section#entete-poste section#piece div.container div.livret-de-poids h4.legal {
  font-family: 'open-sans', sans-serif;
  font-size: 0.55vw;
  line-height: 1.19;
  font-weight: 400;
  color: #fff; }

p, div#formulaire label, div#formulaire input, div#formulaire textarea, section#entete-poste h4 {
  font-family: 'open-sans', sans-serif;
  font-size: 0.8vw;
  line-height: 1.65;
  font-weight: 400;
  color: #fff; }

td {
  font-family: 'open-sans', sans-serif;
  font-size: 0.8vw;
  line-height: 2.15;
  font-weight: 400;
  color: #fff; }

th {
  font-family: 'open-sans', sans-serif;
  font-size: 0.8vw;
  line-height: 1.65;
  font-weight: 400;
  color: #fff;
  text-transform: uppercase; }

li {
  font-family: 'open-sans', sans-serif;
  font-size: 0.8vw;
  line-height: 2.25;
  font-weight: 400;
  color: #fff; }

ul {
  padding: 0 0 0 1.4em; }

section button:not(.taxo-button) {
  padding: .5vw 2.5vw;
  font-family: 'montserrat', sans-serif;
  font-weight: 700;
  background: transparent;
  outline: none !important;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
  color: #E30414;
  border: 3px solid #E30414;
  z-index: 1;
  text-transform: uppercase;
  font-size: .9vw; }

section button:focus {
  outline: none !important; }

section button.blanc, section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte button, section#armature-entete div.colonne div.col:last-of-type button, section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button, section#armature-experts-conseils div.colonne div.bg button, section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button {
  border: 2px solid #fff;
  color: #fff; }

section button:not(.taxo-button):after {
  position: absolute;
  content: "";
  width: 100%;
  height: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: #E30414;
  color: #E30414;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease; }

section button.blanc:after, section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte button:after, section#armature-entete div.colonne div.col:last-of-type button:after, section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button:after, section#armature-experts-conseils div.colonne div.bg button:after, section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button:after {
  background: #fff;
  color: #fff; }

section button.blanc:hover, section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte button:hover, section#armature-entete div.colonne div.col:last-of-type button:hover, section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button:hover, section#armature-experts-conseils div.colonne div.bg button:hover, section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button:hover {
  color: #E30414; }

section button:hover:not(.taxo-button) {
  color: #fff; }

section button:not(.taxo-button):hover:after {
  top: 0;
  height: 100%; }

html, body {
  max-width: 100vw;
  padding: 0;
  margin: 0;
  width: 100%;
  height: auto;
  background-color: #202126;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  position: relative; }

body.page-template-page-home {
  height: 100vh; }

div.ranger {
  display: flex;
  flex-wrap: wrap; }

div.container {
  width: 100%;
  padding: 0 7.5%; }

/*page landing */
:root {
  --container-bg-color: #333;
  --left-bg-color: rgba(43, 43, 43, 0.1);
  --right-bg-color: rgba(43, 43, 43, 0.1);
  --hover-width: 75%;
  --other-width: 25%;
  --speed: 1000ms; }

header {
  position: relative;
  z-index: 9999999; }

.home header {
  display: none; }

.home footer {
  display: none; }

section#landing {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100vh;
  overflow-x: hidden;
  min-height: 640px; }
  section#landing button {
    margin-top: 2em; }
  section#landing div.logo {
    position: absolute;
    top: 3%;
    left: 50%;
    transform: translateX(-50%);
    width: 22.222%;
    z-index: 4; }
    section#landing div.logo img {
      width: 100%; }
  section#landing div.entete {
    width: 100%;
    top: 12%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4; }
    section#landing div.entete h1 {
      text-align: center;
      text-transform: uppercase; }
  section#landing div.texte {
    position: absolute;
    left: 50%;
    bottom: 6%;
    transform: translateX(-50%);
    width: 35vw;
    text-align: center;
    z-index: 5; }
    section#landing div.texte h2 {
      text-align: center;
      text-transform: uppercase; }

@media screen and (min-width: 768px) {
  section#landing .container-land {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 640px;
    background: var(--container-bg-color); }
  section#landing .split {
    position: absolute;
    width: 50%;
    height: 100%;
    overflow: hidden;
    min-height: inherit; }
  section#landing .split.left-land {
    left: 0;
    background-size: cover; }
  section#landing .split.left-land:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: var(--left-bg-color); }
  section#landing .split.right-land {
    right: 0;
    background-size: cover; }
  section#landing .split.right-land:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: var(--right-bg-color); }
  section#landing .split.right-land:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background-color: #202126;
    opacity: 0.9;
    z-index: 3; }
  section#landing .split.left-land, section#landing .split.right-land, section#landing .split.right-land:before, section#landing .split.left-land:before {
    transition: var(--speed) all ease-in-out; }
  section#landing .hover-left .left-land {
    width: var(--hover-width); }
  section#landing .hover-left .right-land {
    width: var(--other-width); }
  section#landing .hover-left .right-land:before {
    z-index: 2; }
  section#landing .hover-right .right-land {
    width: var(--hover-width); }
  section#landing .hover-right .left-land {
    width: var(--other-width); }
  section#landing .hover-right .left-land:before {
    z-index: 2; } }
/* .  header .  */
header div#top {
  background-color: #000000; 
}
  header div#top div.colonne {
    width: 16%;
    height: 2vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center; }
    header div#top div.colonne a p, header div#top div.colonne a div#formulaire label, div#formulaire header div#top div.colonne a label, header div#top div.colonne a div#formulaire input, div#formulaire header div#top div.colonne a input, header div#top div.colonne a div#formulaire textarea, div#formulaire header div#top div.colonne a textarea, header div#top div.colonne a section#entete-poste h4, section#entete-poste header div#top div.colonne a h4 {
      margin: 0;
      font-weight: 700;
      font-size: 0.7vw; }
  header div#top div.colonne:nth-child(2) {
    width: 68%;
    background-color: #E30414; 
  }
    header div#top div.colonne:nth-child(2) p, header div#top div.colonne:nth-child(2) div#formulaire label, div#formulaire header div#top div.colonne:nth-child(2) label, header div#top div.colonne:nth-child(2) div#formulaire input, div#formulaire header div#top div.colonne:nth-child(2) input, header div#top div.colonne:nth-child(2) div#formulaire textarea, div#formulaire header div#top div.colonne:nth-child(2) textarea, header div#top div.colonne:nth-child(2) section#entete-poste h4, section#entete-poste header div#top div.colonne:nth-child(2) h4 {
      margin: 0; }
header div#height {
  width: 100%;
  position: relative; }
header div#bouton-mobile {
  display: none; }
header div#nav {
  position: absolute;
  background-color: rgba(32, 33, 38, 0.85);
  top: 0;
  width: 100%;
  height: 3.8vw;
  left: 0;
  right: 0;
  z-index: 3;
  border-bottom: 1px solid rgba(255, 255, 255, 0.85); 
  /* border-top: 1px solid rgba(255, 255, 255, 0.85);  */
}
.with_frm_style .frm_button {
  background: #E30414 !important;
  border-color: #E30414 !important;
}
.with_frm_style .frm_button:hover {
  color: #ffffff !important;
  opacity: 0.8;
}
.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons:hover svg.frm-svg-icon {
  fill: #ffffff !important;
}
  header div#nav div.colonne {
    width: 16%;
    height: 3.8vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center; }
    header div#nav div.colonne.active {
      background-color: #E30414;
      border-bottom: 1px solid rgba(255, 255, 255, 0.85); }
      header div#nav div.colonne.active a p, header div#nav div.colonne.active a div#formulaire label, div#formulaire header div#nav div.colonne.active a label, header div#nav div.colonne.active a div#formulaire input, div#formulaire header div#nav div.colonne.active a input, header div#nav div.colonne.active a div#formulaire textarea, div#formulaire header div#nav div.colonne.active a textarea, header div#nav div.colonne.active a section#entete-poste h4, section#entete-poste header div#nav div.colonne.active a h4 {
        color: #fff; }
    header div#nav div.colonne img {
      width: 40%;
      display: block;
      margin: 0 auto; }
      header div#nav div.colonne img.gris {
        display: none; }
      header div#nav div.colonne img.blanc {
        display: block; }
    header div#nav div.colonne a p, header div#nav div.colonne a div#formulaire label, div#formulaire header div#nav div.colonne a label, header div#nav div.colonne a div#formulaire input, div#formulaire header div#nav div.colonne a input, header div#nav div.colonne a div#formulaire textarea, div#formulaire header div#nav div.colonne a textarea, header div#nav div.colonne a section#entete-poste h4, section#entete-poste header div#nav div.colonne a h4 {
      margin: 0;
      font-weight: 700;
      text-transform: uppercase;
      font-size: 0.8vw; }
  header div#nav div.colonne:nth-child(2) {
    width: 68%;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff; }
    header div#nav div.colonne:nth-child(2) nav ul.menu {
      display: flex;
      justify-content: center;
      flex-direction: row;
      position: relative; }
      header div#nav div.colonne:nth-child(2) nav ul.menu > li {
        padding: 0 0.9vw; }
        header div#nav div.colonne:nth-child(2) nav ul.menu > li > a {
          padding: 15px 0;
          text-transform: uppercase; }
        header div#nav div.colonne:nth-child(2) nav ul.menu > li.current-menu-ancestor > a, header div#nav div.colonne:nth-child(2) nav ul.menu > li.current-menu-parent > a, header div#nav div.colonne:nth-child(2) nav ul.menu > li.current-menu-item > a {
          color: #E30414 !important;
          position: relative; }
          header div#nav div.colonne:nth-child(2) nav ul.menu > li.current-menu-ancestor > a:after, header div#nav div.colonne:nth-child(2) nav ul.menu > li.current-menu-parent > a:after, header div#nav div.colonne:nth-child(2) nav ul.menu > li.current-menu-item > a:after {
            content: '';
            position: absolute;
            bottom: .3vw;
            left: 0;
            height: 4px;
            width: 100%;
            background-color: #E30414; }
      header div#nav div.colonne:nth-child(2) nav ul.menu li.wpml-ls-item a {
        text-transform: none;
        font-weight: 600; }
      header div#nav div.colonne:nth-child(2) nav ul.menu ul.sub-menu {
        display: none;
        position: absolute;
        background-color: #E30414;
        padding: 15px 0; }
        header div#nav div.colonne:nth-child(2) nav ul.menu ul.sub-menu li {
          display: flex; }
          header div#nav div.colonne:nth-child(2) nav ul.menu ul.sub-menu li a {
            text-align: left;
            padding: 5px 15px;
            min-width: 190px;
            font-size: 17px;
            font-weight: 600;
            text-transform: none;
            color: #fff; }
          header div#nav div.colonne:nth-child(2) nav ul.menu ul.sub-menu li:hover {
            background-color: #fff; }
            header div#nav div.colonne:nth-child(2) nav ul.menu ul.sub-menu li:hover a {
              color: #E30414; }
      header div#nav div.colonne:nth-child(2) nav ul.menu li.menu-item-has-children:hover > ul {
        display: block; }
  header div#nav.top {
    position: fixed;
    background-color: #000000;
    border-bottom: 1px solid #ffffff; }
    header div#nav.top div.colonne:nth-child(2) {
      border-left: 1px solid #ffffff;
      border-right: 1px solid #ffffff; }
      header div#nav.top div.colonne:nth-child(2) nav ul.menu > li > a {
        color: #ffffff; }
      > header div#nav.top div.colonne:nth-child(2) nav ul.menu > li.current-menu-ancestor > a, header div#nav.top div.colonne:nth-child(2) nav ul.menu > li.current-menu-parent > a {
        color: #E30414; }
    header div#nav.top div.colonne:nth-child(3) a p, header div#nav.top div.colonne:nth-child(3) a div#formulaire label, div#formulaire header div#nav.top div.colonne:nth-child(3) a label, header div#nav.top div.colonne:nth-child(3) a div#formulaire input, div#formulaire header div#nav.top div.colonne:nth-child(3) a input, header div#nav.top div.colonne:nth-child(3) a div#formulaire textarea, div#formulaire header div#nav.top div.colonne:nth-child(3) a textarea, header div#nav.top div.colonne:nth-child(3) a section#entete-poste h4, section#entete-poste header div#nav.top div.colonne:nth-child(3) a h4 {
      color: #ffffff; }
    header div#nav.top div.colonne:nth-child(3).active a p, header div#nav.top div.colonne:nth-child(3).active a div#formulaire label, div#formulaire header div#nav.top div.colonne:nth-child(3).active a label, header div#nav.top div.colonne:nth-child(3).active a div#formulaire input, div#formulaire header div#nav.top div.colonne:nth-child(3).active a input, header div#nav.top div.colonne:nth-child(3).active a div#formulaire textarea, div#formulaire header div#nav.top div.colonne:nth-child(3).active a textarea, header div#nav.top div.colonne:nth-child(3).active a section#entete-poste h4, section#entete-poste header div#nav.top div.colonne:nth-child(3).active a h4 {
      color: #fff; }
    header div#nav.top div.colonne:nth-child(3).active {
      border-bottom: 1px solid #ffffff; }
    header div#nav.top div.colonne img.gris {
      display: block; }
    header div#nav.top div.colonne img.blanc {
      display: none; }

/* accueil*/
section#accueil-entete {
  width: 100%;
  height: 100vh;
  min-height: 50vw;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom center; 
}
  #accueil-entete {
  position: relative;
  overflow: hidden;
  background-position: bottom center;
  background-size: cover;
  background-repeat: no-repeat;

}

#gl {
  position: absolute;
  /* inset: -20px; */
  z-index: 1;
  pointer-events: none;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: translate3d(var(--move-x, 0), var(--move-y, 0), 0) scale(1.04);
  transition: transform 0.25s ease-out;
  will-change: transform;


    width: 100vw;
    height: 100%;
    left: 0;
    top: 0;


}

.entete {
  position: relative;
  z-index: 2;
}

  section#accueil-entete canvas {
    display: block; }
    	section#carousel div.slider-nav div.thumbs {
		filter: grayscale(100%);
	}
		section#carousel div.slider-nav .slick-current div.thumbs:hover {
		filter: grayscale(0%);
	}
  section#accueil-entete div.entete {
    width: 100%;
    top: 12%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2; }
    .d-none {
      display: none !important;
    }
    section#accueil-entete div.entete {
      padding-left: 5vw;
    }
       section#accueil-entete div.entete .d-flex {
        /* border: 2px solid blue; */
            opacity: 0; 
        /* display: flex;
        align-items: flex-end; */
       }
           section#accueil-entete div.entete .d-flex img {
            padding-bottom: 60px;
            display: inline-block;
            margin-left: 30px;
           }
    section#accueil-entete div.entete h1 {
      text-align: left;
      text-transform: uppercase; }
      section#accueil-entete div.entete h1 span {
        font-weight: bold;
      }
      section#accueil-entete div.entete h1 {
        font-size: 2vw;
      }
       section#accueil-entete div.entete h1 strong {
       color: #000000;
       opacity: 0.6;
        font-size: 7vw;
      }
        section#accueil-entete div.entete h1 strong span {
          color: #E30414;
        }
      section#accueil-entete div.entete h1 strong {
    }

section#carousel {
  width: 100%;
  max-width: 100vw;
  position: relative;
  overflow: hidden; }
  section#carousel h2 {
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 0vw; }
  section#carousel div.slide-carousel .slick-current div.relative div.absolute {
    left: 0;
    opacity: 1; }
    section#carousel div.slide-carousel .slick-current div.relative div.absolute h3.active {
      left: 0;
      opacity: 1; }
    section#carousel div.slide-carousel .slick-current div.relative div.absolute h3 {
      left: 100%;
      opacity: 0;
      transition: all 1.5s ease; }
  section#carousel div.slide-carousel div.relative {
    position: relative;
    width: 100%;
    z-index: 2; }
    section#carousel div.slide-carousel div.relative div.absolute {
      position: absolute;
      z-index: 1;
      width: 100%;
      top: 2vw;
      left: 100%;
      opacity: 0;
      transition: all 1.5s ease;
      transition-delay: .25s; }
      section#carousel div.slide-carousel div.relative div.absolute h3 {
        text-transform: uppercase;
        top: 0;
        position: relative;
        margin: 0;
        line-height: 1;
        white-space: nowrap; }
  section#carousel div.slide-carousel div.colonne:first-of-type {
    width: 65%;
    padding: 7.5vw; }
    section#carousel div.slide-carousel div.colonne:first-of-type img {
      width: 100%;
      position: relative;
      z-index: 3; }
  section#carousel div.slide-carousel div.colonne:last-of-type {
    width: 35%;
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    section#carousel div.slide-carousel div.colonne:last-of-type div.texte {
      max-width: 28vw; }
      section#carousel div.slide-carousel div.colonne:last-of-type div.texte h3 {
        text-transform: uppercase;
        margin: 0; }
      section#carousel div.slide-carousel div.colonne:last-of-type div.texte button {
        margin-top: 1em; }
  section#carousel div.slide-carousel ul.slick-dots {
    display: flex;
    width: 25%;
    margin-left: 5%;
    bottom: .8vw;
    z-index: 6; }
    section#carousel div.slide-carousel ul.slick-dots li {
      position: relative;
      display: inline-block;
      width: 100%;
      height: 3px;
      margin: initial;
      padding: 0;
      cursor: pointer; }
      section#carousel div.slide-carousel ul.slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 100%;
        height: 1px;
        padding: initial;
        cursor: pointer;
        color: transparent;
        border: 0;
        background-color: #fff;
        position: relative;
        transform: translateY(-50%);
        top: 50%; }
        section#carousel div.slide-carousel ul.slick-dots li button:before {
          content: none; }
    section#carousel div.slide-carousel ul.slick-dots li.slick-active button {
      background-color: #E30414;
      height: 4px;
      transform: translateY(-50%);
      top: 50%; }
  section#carousel div.slider-nav {
    position: absolute;
    width: 60%;
    bottom: 0.8vw;
    z-index: 5;
    right: 0; }
    section#carousel div.slider-nav div.thumbs {
      width: 0;
      position: relative;
      padding-top: 100%;
      height: 0px;
      background-size: cover;
      margin: 0 0 -15px 0;
      transition: all .5s ease;
      position: relative;
      cursor: pointer; }
      section#carousel div.slider-nav div.thumbs span {
        position: absolute;
        top: 8%;
        text-transform: uppercase;
        text-align: center;
        font-size: 1vw;
        width: 100%;
        line-height: 1;
        font-family: 'open-sans', sans-serif;
        font-weight: 700; 
      color: #fff;
      }
      section#carousel div.slider-nav div.thumbs img {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        cursor: pointer;
        transition: all .5s ease; }
    section#carousel div.slider-nav .slick-current div.thumbs {
      margin-top: -30px;
      padding-top: calc(100% + 30px);
      position: relative; }
    section#carousel div.slider-nav .slick-track {
      padding-top: 40px; }
  section#carousel div.slider__counter {
    color: #fff;
    float: left;
    position: absolute;
    bottom: 0; }
    section#carousel div.slider__counter p, section#carousel div.slider__counter div#formulaire label, div#formulaire section#carousel div.slider__counter label, section#carousel div.slider__counter div#formulaire input, div#formulaire section#carousel div.slider__counter input, section#carousel div.slider__counter div#formulaire textarea, div#formulaire section#carousel div.slider__counter textarea, section#carousel div.slider__counter section#entete-poste h4, section#entete-poste section#carousel div.slider__counter h4 {
      margin: 0;
      font-size: 1vw;
      color: #fff; }
      section#carousel div.slider__counter p span, section#carousel div.slider__counter div#formulaire label span, div#formulaire section#carousel div.slider__counter label span, section#carousel div.slider__counter div#formulaire input span, div#formulaire section#carousel div.slider__counter input span, section#carousel div.slider__counter div#formulaire textarea span, div#formulaire section#carousel div.slider__counter textarea span, section#carousel div.slider__counter section#entete-poste h4 span, section#entete-poste section#carousel div.slider__counter h4 span {
        font-size: 1.8vw;
        color: #E30414; }
  section#carousel div.conteneur {
    position: absolute;
    bottom: -1vw;
    width: 100%;
    padding-left: 1vw; }
  section#carousel p.pagination, section#carousel div#formulaire label.pagination, div#formulaire section#carousel label.pagination, section#carousel div#formulaire input.pagination, div#formulaire section#carousel input.pagination, section#carousel div#formulaire textarea.pagination, div#formulaire section#carousel textarea.pagination, section#carousel section#entete-poste h4.pagination, section#entete-poste section#carousel h4.pagination {
    font-size: 2.5vw;
    position: absolute;
    z-index: 9999999;
    text-align: center;
    left: -3vw;
    margin-bottom: 0;
    margin-top: 0px;
    padding-top: 30px;
    height: calc( 100% - 40px);
    bottom: 0;
    width: 3vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background-color: #000; }
    section#carousel p.pagination a, section#carousel div#formulaire label.pagination a, div#formulaire section#carousel label.pagination a, section#carousel div#formulaire input.pagination a, div#formulaire section#carousel input.pagination a, section#carousel div#formulaire textarea.pagination a, div#formulaire section#carousel textarea.pagination a, section#carousel section#entete-poste h4.pagination a, section#entete-poste section#carousel h4.pagination a {
      display: block !important;
      padding: 1.4vw 0;
      clear: both;
      background-color: #000;
      color: #E30414;
      top: 50%;
      left: 0%;
      transform: translate(0%, -50%);
      cursor: pointer;
      line-height: 1vw;
      height: 44%; }
  section#carousel img.fleche {
    width: 12px;
    height: auto; }
  section#carousel img.fleche.prev {
    transform: rotate(180deg); }

section#nos-secteurs-activite div.colonne:first-of-type {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 7.5vw; }
  section#nos-secteurs-activite div.colonne:first-of-type h2 {
    text-transform: uppercase;
    margin: 0; }
section#nos-secteurs-activite div.colonne:last-of-type {
  width: 50%;
  padding: 5% 0; }
  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col {
    display: flex;
    flex-wrap: wrap; }
    section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col {
      width: 33.3333%;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 3.5% 5%;
      position: relative;
      opacity: 0;
      transition: all .5s ease; }
      section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col img {
        width: auto;
        display: block;
        margin: 0 auto;
        max-width: 100%; }
      section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute {
        position: absolute;
        width: 100%;
        text-align: center;
        top: 48%;
        left: 0;
        right: 0; }
        section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute h3 {
          text-transform: uppercase; }
  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(1) {
    opacity: 1;
    transition-delay: 1.25s; }
  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(2) {
    opacity: 1;
    transition-delay: .75s; }
  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(3) {
    opacity: 1;
    transition-delay: 1s; }
  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(4) {
    opacity: 1;
    transition-delay: 1.5s; }
  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(5) {
    opacity: 1;
    transition-delay: .5s; }
  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(6) {
    opacity: 1;
    transition-delay: 1.75s; }

section#selection-produit-accueil {
  background-size: cover;
  background-position: center; }
  section#selection-produit-accueil div.colonne:first-of-type {
    width: 33.3333%; }
    section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte {
      background-color: #E30414;
      text-align: center;
      color: #fff;
      height: 165%;
      padding: 5vw;
      position: relative;
      top: -3vw; }
      section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte h2 {
        text-transform: uppercase; }
      section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte button {
        margin-top: 2em; }
  section#selection-produit-accueil div.colonne:last-of-type {
    width: 66.6666%;
    padding-top: 7vw;
    padding-bottom: 3vw; }
    section#selection-produit-accueil div.colonne:last-of-type h3 {
      text-align: center;
      text-transform: uppercase; }
      section#selection-produit-accueil div.colonne:last-of-type h3 {
      font-size: 2vw;
      max-width: 75%;
      margin: 0 auto;
    }
      section#selection-produit-accueil div.colonne:last-of-type h3 strong {
        opacity: 0; }
  section#selection-produit-accueil div.ranger.noir {
    background-color: #000;
    position: relative;
    bottom: -10vw;
    width: 92.5vw;
    margin-top: -10vw; }
    section#selection-produit-accueil div.ranger.noir div.colonne:first-of-type {
      width: 55%;
      position: relative; }
      section#selection-produit-accueil div.ranger.noir div.colonne:first-of-type img {
        width: 104%;
        position: absolute;
        bottom: 0;
        left: 0;
        opacity: 0; }
      section#selection-produit-accueil div.ranger.noir div.colonne:first-of-type img.apparaitre {
        opacity: 1; }
    section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type {
      width: 45%;
      padding-right: 7.5vw;
      padding-left: 1vw;
      display: flex;
      padding-top: 0;
      flex-direction: column;
      justify-content: center; }
      section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type div.texte {
        padding: 8vw 0 5vw; }
      section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type h3 {
        margin: 0;
        text-align: left; }
      section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type button {
        margin-top: 2em; }

section#nos-services-accueil {
  padding-top: 15vw;
  margin-bottom: 6vw; }
  section#nos-services-accueil div.colonne:first-of-type {
    width: 45%;
    padding-left: 7.5vw;
    position: relative; }
    section#nos-services-accueil div.colonne:first-of-type h3 {
      text-transform: uppercase;
      margin: 0;
      margin-top: 1.8em; }
    section#nos-services-accueil div.colonne:first-of-type div.div {
      display: none;
      padding-right: 7.5vw; }
      section#nos-services-accueil div.colonne:first-of-type div.div button {
        margin-top: 2em; }
      section#nos-services-accueil div.colonne:first-of-type div.div h4 {
        margin: 0; }
    section#nos-services-accueil div.colonne:first-of-type div.div:first-of-type {
      display: block; }
    section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce {
      position: absolute;
      width: calc( 100% - 12vw );
      left: 7.5vw;
      bottom: 0; }
      section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce p, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire label, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce label, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire input, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce input, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire textarea, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce textarea, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce section#entete-poste h4, section#entete-poste section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce h4 {
        color: #fff;
        line-height: 0.7;
        margin: 0; }
        section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce p span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire label span, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce label span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire input span, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce input span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire textarea span, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce textarea span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce section#entete-poste h4 span, section#entete-poste section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce h4 span {
          font-size: 1.8vw;
          color: #E30414; }
    section#nos-services-accueil div.colonne:first-of-type p.pagination-slide, section#nos-services-accueil div.colonne:first-of-type div#formulaire label.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:first-of-type label.pagination-slide, section#nos-services-accueil div.colonne:first-of-type div#formulaire input.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:first-of-type input.pagination-slide, section#nos-services-accueil div.colonne:first-of-type div#formulaire textarea.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:first-of-type textarea.pagination-slide, section#nos-services-accueil div.colonne:first-of-type section#entete-poste h4.pagination-slide, section#entete-poste section#nos-services-accueil div.colonne:first-of-type h4.pagination-slide {
      background-color: #000;
      width: 3vw;
      position: absolute;
      bottom: 0;
      right: -.5vw;
      margin: 0;
      font-size: 2.5vw;
      display: flex;
      flex-direction: column;
      justify-content: center;
      height: 8vw; }
      section#nos-services-accueil div.colonne:first-of-type p.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type div#formulaire label.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:first-of-type label.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type div#formulaire input.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:first-of-type input.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type div#formulaire textarea.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:first-of-type textarea.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type section#entete-poste h4.pagination-slide a, section#entete-poste section#nos-services-accueil div.colonne:first-of-type h4.pagination-slide a {
        color: #E30414;
        display: block;
        padding: 1.6vw 1.1vw;
        clear: both;
        background-color: #000;
        color: #E30414;
        top: 50%;
        left: 0%;
        cursor: pointer;
        line-height: 0;
        height: 4vw; }
    section#nos-services-accueil div.colonne:first-of-type div.col:first-of-type {
      width: 7em; }
    section#nos-services-accueil div.colonne:first-of-type div.col:last-of-type {
      width: calc( 100% - 7em );
      display: flex;
      flex-wrap: wrap; }
      section#nos-services-accueil div.colonne:first-of-type div.col:last-of-type div.puce {
        width: 16.66666%;
        height: 1px;
        background-color: #fff;
        position: relative;
        transform: translateY(-50%);
        top: 100%;
        cursor: pointer;
        flex: 1; }
        section#nos-services-accueil div.colonne:first-of-type div.col:last-of-type div.puce.active {
          height: 4px;
          background-color: #E30414; }
  section#nos-services-accueil div.colonne:last-of-type {
    width: 55%;
    overflow: hidden;
    position: relative; }
    section#nos-services-accueil div.colonne:last-of-type h2 {
      margin-top: 0;
      margin-bottom: .4em;
      text-transform: uppercase;
      max-width: 80%; }
    section#nos-services-accueil div.colonne:last-of-type div.ranger {
      width: calc(100% + 0.5vw);
      margin-left: -0.5vw;
      margin-right: 0;
      margin-bottom: -.5vw; }
      section#nos-services-accueil div.colonne:last-of-type div.ranger div:focus {
        outline: none !important; }
      section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile {
        padding: 0 1vw;
        width: calc( 33.3333% - 1vw );
        position: relative;
        transition: all .5s ease;
        cursor: pointer;
        overflow: hidden;
        height: 0;
        padding-bottom: 10.8vw;
        margin-top: 1.2vw; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:focus {
          outline: none !important; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile img {
          width: 100%;
          z-index: 1;
          position: relative;
          transition: all .5s ease;
          top: 0; }
          section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile img:focus {
            outline: none !important; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile div.absolute {
          position: absolute;
          width: calc( 100% - 30px);
          top: 0;
          transition: all .5s ease; }
          section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile div.absolute:focus {
            outline: none !important; }
          section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile div.absolute h4 {
            text-align: center;
            text-transform: uppercase;
            position: relative;
            z-index: 4;
            opacity: 1;
            transition: all .5s ease;
            transition-delay: .2s; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover div.absolute, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active div.absolute {
          top: -40px; }
          section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover div.absolute h4, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active div.absolute h4 {
            opacity: 0; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover img, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active img {
          top: -2.2vw;
          margin-bottom: 3vw; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:before {
          content: '';
          width: calc( 100% - 2vw + 1px );
          margin-left: 1vw;
          height: 100%;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          background-color: rgba(0, 0, 0, 0.7);
          z-index: 2;
          position: absolute; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover:before, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active:before {
          background-color: rgba(0, 0, 0, 0); }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:after, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active:after {
          transition: width .5s ease;
          width: 0;
          content: '';
          position: absolute;
          left: 1vw;
          bottom: 0;
          height: 1.5vw;
          background-color: #E30414;
          z-index: 4; }
        section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover:after, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active:after {
          content: '';
          width: calc( 100% - 2vw );
          margin-left: 1vw;
          height: 1.5vw;
          background-color: #E30414;
          position: absolute;
          bottom: 0;
          left: 0;
          right: 0; }
    section#nos-services-accueil div.colonne:last-of-type p.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide {
      background-color: #000;
      width: 6vw;
      position: absolute;
      bottom: 0;
      left: 3vw;
      margin: 0;
      font-size: 5vw !important;
      display: flex;
      flex-direction: column;
      justify-content: center;
      height: 16vw; }
      section#nos-services-accueil div.colonne:last-of-type p.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide a, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide a {
        color: #E30414;
        display: block;
        padding: 3.2vw 2.2vw;
        clear: both;
        background-color: #000;
        color: #E30414;
        top: 50%;
        left: 0%;
        cursor: pointer;
        line-height: 0;
        height: 8vw; }
  section#nos-services-accueil img.fleche {
    width: 12px;
    height: auto; }
  section#nos-services-accueil img.fleche.prev {
    transform: rotate(180deg); }

section#nos-experts-accueil div.ranger div.colonne:first-of-type {
  width: 41%; }
  section#nos-experts-accueil div.ranger div.colonne:first-of-type div.img {
    width: 100%; }
    section#nos-experts-accueil div.ranger div.colonne:first-of-type div.img img {
      width: 100%; }
  section#nos-experts-accueil div.ranger div.colonne:first-of-type div.img:first-of-type img {
    opacity: 0; }
    section#nos-experts-accueil div.ranger div.colonne:first-of-type div.img:first-of-type img.apparaitre {
      opacity: 1; }
section#nos-experts-accueil div.ranger div.colonne:last-of-type {
  width: 59%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-position: bottom left;
  padding: 0 5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 2vw; }
  section#nos-experts-accueil div.ranger div.colonne:last-of-type h2 {
    margin-top: 0;
    text-align: center; }
    section#nos-experts-accueil div.ranger div.colonne:last-of-type h2 strong {
      opacity: 0; }
      section#nos-experts-accueil div.ranger div.colonne:last-of-type h2 strong.apparaitre {
        opacity: 1; }

section#nos-experts-accueil-mobile {
  display: none;
  flex-direction: column;
  margin-top: -100px; }
  section#nos-experts-accueil-mobile div.image {
    width: 61%;
    position: relative;
    bottom: -100px;
    display: block;
    margin: 0 auto; }
    section#nos-experts-accueil-mobile div.image img {
      width: 100%; }
  section#nos-experts-accueil-mobile div.full {
    width: 100%;
    min-height: 58vw;
    background-size: cover;
    background-clip: content-box;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    section#nos-experts-accueil-mobile div.full h2 {
      text-align: center;
      max-width: 835px;
      display: block;
      margin: 0 auto; }
      section#nos-experts-accueil-mobile div.full h2 strong {
        display: block; }
      section#nos-experts-accueil-mobile div.full h2 br {
        display: none; }

section#boutique-accueil {
  background-size: auto 80%;
  background-position: 100vw 15vw;
  background-color: #fff;
  background-repeat: no-repeat;
  padding-top: 20vw;
  margin-top: -20vw;
  padding-bottom: 4vw;
  transition: all .5s ease;
  transition-delay: .5s; }
  section#boutique-accueil.active {
    background-position: right 15vw; }
  section#boutique-accueil h3 {
    color: #000;
    margin-left: 7.5vw;
    margin-top: 0;
    padding-top: 5vw;
    max-width: 70%; }
  section#boutique-accueil div.ranger {
    width: 64%; }
    section#boutique-accueil div.ranger div.colonne {
      width: 33.3333%;
      padding: 0 2%; }
      section#boutique-accueil div.ranger div.colonne div.bg {
        background-color: #F0F0F0;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%; }
        section#boutique-accueil div.ranger div.colonne div.bg img {
          width: 100%; }
        section#boutique-accueil div.ranger div.colonne div.bg button {
          display: block;
          margin: 0 auto;
          margin-bottom: 10%;
          padding: .5vw 1vw; }
        section#boutique-accueil div.ranger div.colonne div.bg h5 {
          color: #000;
          text-align: center;
          text-transform: uppercase;
          padding: 5%;
          margin-bottom: 0.4em; }
          section#boutique-accueil div.ranger div.colonne div.bg h5 strong {
            font-weight: 900; }

/* footer */
footer {
  background-color: #000;
  width: 100%; }
  footer div.ranger {
    width: 65%;
    margin: 0 auto;
    padding-top: 3vw; }
    footer div.ranger div.colonne:first-of-type {
      border-left: none;
      width: 35%; }
    footer div.ranger div.colonne:nth-of-type(2) {
      width: 35%; }
    footer div.ranger div.colonne:last-of-type {
      width: 30%; }
      footer div.ranger div.colonne:last-of-type a {
        color: #E30414;
        text-decoration: underline; }
    footer div.ranger div.colonne {
      border-left: 1px solid #ffffff;
      padding: 0 1vw; }
      footer div.ranger div.colonne img.logo {
        width: 9vw;
        position: relative;
        top: -1.5vw; }
      footer div.ranger div.colonne div.question {
        display: flex;
        flex-wrap: wrap; }
        footer div.ranger div.colonne div.question img.icon-tel {
          width: 2vw;
          margin-right: 1vw; }
        footer div.ranger div.colonne div.question div.col {
          display: flex;
          flex-direction: column;
          justify-content: center; }
          footer div.ranger div.colonne div.question div.col p, footer div.ranger div.colonne div.question div.col div#formulaire label, div#formulaire footer div.ranger div.colonne div.question div.col label, footer div.ranger div.colonne div.question div.col div#formulaire input, div#formulaire footer div.ranger div.colonne div.question div.col input, footer div.ranger div.colonne div.question div.col div#formulaire textarea, div#formulaire footer div.ranger div.colonne div.question div.col textarea, footer div.ranger div.colonne div.question div.col section#entete-poste h4, section#entete-poste footer div.ranger div.colonne div.question div.col h4 {
            font-weight: 700;
            line-height: 1.4; }
        footer div.ranger div.colonne div.question p, footer div.ranger div.colonne div.question div#formulaire label, div#formulaire footer div.ranger div.colonne div.question label, footer div.ranger div.colonne div.question div#formulaire input, div#formulaire footer div.ranger div.colonne div.question input, footer div.ranger div.colonne div.question div#formulaire textarea, div#formulaire footer div.ranger div.colonne div.question textarea, footer div.ranger div.colonne div.question section#entete-poste h4, section#entete-poste footer div.ranger div.colonne div.question h4 {
          margin: 0; }
      footer div.ranger div.colonne h4 {
        color: #E30414;
        font-weight: 700; }
      footer div.ranger div.colonne p, footer div.ranger div.colonne div#formulaire label, div#formulaire footer div.ranger div.colonne label, footer div.ranger div.colonne div#formulaire input, div#formulaire footer div.ranger div.colonne input, footer div.ranger div.colonne div#formulaire textarea, div#formulaire footer div.ranger div.colonne textarea, footer div.ranger div.colonne section#entete-poste h4, section#entete-poste footer div.ranger div.colonne h4 {
        color: #fff;
        font-weight: 400; }
      footer div.ranger div.colonne ul {
        columns: 2;
        list-style: none;
        padding: 0;
        margin: 0; }
      footer div.ranger div.colonne li {
        font-size: 0.6vw; }
      footer div.ranger div.colonne div.icon {
        float: left;
        width: 1.5vw;
        height: 2vw;
        background-size: contain;
        background-color: #E30414;
        mask-repeat: no-repeat no-repeat;
        -webkit-mask-repeat: no-repeat, no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        transition: all .5s ease;
        transform: translate(-50%, -50%);
        margin-top: 1em; }
        footer div.ranger div.colonne div.icon:hover {
          background-color: #fff; }
      footer div.ranger div.colonne div.col {
        display: flex;
        flex-direction: column;
        justify-content: center; }
  footer div.copyright {
    width: 100%;
    border-top: 1px solid #ffffff;
    background-color: #000000;
    display: flex;
    flex-direction: row;
    justify-content: center; }
    footer div.copyright div.ranger-copy {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      width: 65%;
      padding: 0 0; }
      footer div.copyright div.ranger-copy div.colonne-copy {
        border: none;
        display: flex;
        flex-direction: column;
        justify-content: center; }
        footer div.copyright div.ranger-copy div.colonne-copy p, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire label, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy label, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire input, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy input, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire textarea, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy textarea, footer div.copyright div.ranger-copy div.colonne-copy section#entete-poste h4, section#entete-poste footer div.copyright div.ranger-copy div.colonne-copy h4 {
          color: #8A8D90; }
          footer div.copyright div.ranger-copy div.colonne-copy p a, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire label a, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy label a, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire input a, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy input a, footer div.copyright div.ranger-copy div.colonne-copy div#formulaire textarea a, div#formulaire footer div.copyright div.ranger-copy div.colonne-copy textarea a, footer div.copyright div.ranger-copy div.colonne-copy section#entete-poste h4 a, section#entete-poste footer div.copyright div.ranger-copy div.colonne-copy h4 a {
            color: #8A8D90; }
        footer div.copyright div.ranger-copy div.colonne-copy img {
          width: 5.6vw;
          margin-left: 1vw; }

/* piece single */
section#piece {
  background-size: contain;
  background-position: top;
  background-repeat: no-repeat;
  overflow: hidden; }
  section#piece div.height {
    width: 100%;
    height: 138px; }
  section#piece div.overflow {
    overflow: hidden; }
  section#piece div.container div.animation {
    position: relative; }
    section#piece div.container div.animation div.gauche {
      position: absolute;
      width: 30%;
      left: -113%;
      top: -100%;
      opacity: 0;
      transform: translate(50%, -50%);
      transition: all .75s ease; }
      section#piece div.container div.animation div.gauche.change {
        left: -13%;
        top: 50%;
        opacity: 1; }
      section#piece div.container div.animation div.gauche img {
        width: 100%;
        height: auto; }
    section#piece div.container div.animation div.droite {
      position: absolute;
      width: 30%;
      right: -17%;
      top: -50%;
      opacity: 0;
      transform: translate(-50%, -50%);
      transition: all .75s ease; }
      section#piece div.container div.animation div.droite.change {
        right: -7%;
        top: 50%;
        opacity: 1; }
      section#piece div.container div.animation div.droite img {
        width: 100%;
        height: auto; }
  section#piece div.container img.entete {
    width: 56%;
    display: block;
    margin: 0 auto;
    margin-top: 7vw;
    margin-bottom: 7vw;
    position: relative;
    opacity: 0;
    bottom: -200px;
    transition: all .5s ease; }
    section#piece div.container img.entete.change {
      opacity: 1;
      bottom: 0; }
  section#piece div.container h1 {
    text-align: center; }
    section#piece div.container h1 strong {
      opacity: 0; }
  section#piece div.container h2 {
    text-align: center; }
  section#piece div.container h3 {
    text-align: center; }
  section#piece div.container p, section#piece div.container div#formulaire label, div#formulaire section#piece div.container label, section#piece div.container div#formulaire input, div#formulaire section#piece div.container input, section#piece div.container div#formulaire textarea, div#formulaire section#piece div.container textarea, section#piece div.container section#entete-poste h4, section#entete-poste section#piece div.container h4 {
    max-width: 42vw;
    text-align: center;
    display: block;
    margin: 0 auto; }
  section#piece div.container div.ranger-bouton {
    display: flex;
    flex-wrap: wrap; }
    section#piece div.container div.ranger-bouton div {
      flex: 1;
      padding: 0 .4%; }
      section#piece div.container div.ranger-bouton div button {
        width: 100%;
        background-size: cover;
        border: none;
        height: 3.5vw;
        font-family: 'montserrat', sans-serif;
        font-size: 1vw;
        color: #000;
        text-transform: uppercase;
        font-weight: 700;
        position: relative;
        z-index: 2; }
        section#piece div.container div.ranger-bouton div button.active:before, section#piece div.container div.ranger-bouton div button:hover:before {
          content: '';
          width: 100%;
          height: 100%;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          position: absolute;
          background-color: #E30414;
          opacity: 65%;
          z-index: 1; }
        section#piece div.container div.ranger-bouton div button span, section#piece div.container div.ranger-bouton div button:hover {
          position: relative;
          z-index: 3; }
  section#piece div.container div.ranger-tuile {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: calc(100% + 1vw);
    margin-left: -0.5vw;
    margin-right: -0.5vw; }
    section#piece div.container div.ranger-tuile div.tuile {
      width: 11.111%;
      padding: 0.5vw;
      position: relative;
      z-index: 2; }
      section#piece div.container div.ranger-tuile div.tuile div.bg {
        background-color: #000;
        display: flex;
        flex-direction: column;
        padding-bottom: 1vw;
        height: 100%;
        justify-content: space-around; }
        section#piece div.container div.ranger-tuile div.tuile div.bg img {
          width: 80%;
          display: block;
          margin: 1vw auto;
          height: auto; }
        section#piece div.container div.ranger-tuile div.tuile div.bg p, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire label, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg label, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire input, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg input, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire textarea, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg textarea, section#piece div.container div.ranger-tuile div.tuile div.bg section#entete-poste h4, section#entete-poste section#piece div.container div.ranger-tuile div.tuile div.bg h4 {
          text-transform: uppercase;
          font-weight: 700;
          max-width: 80%; }
        section#piece div.container div.ranger-tuile div.tuile div.bg.active {
          background-color: #E30414; }
    section#piece div.container div.ranger-tuile:before {
      width: calc( 100% - 1vw);
      height: calc(100% - 6.8vw);
      background-color: #000;
      position: absolute;
      content: '';
      bottom: 0;
      z-index: 1;
      left: 0.5vw; }
  section#piece div.container div.description-ranger {
    background-color: #000;
    display: flex;
    flex-wrap: wrap;
    padding-top: 2vw; }
    section#piece div.container div.description-ranger div.colonne {
      padding-bottom: 3vw;
      width: 50%;
      border-right: 1px solid #fff;
      border-bottom: 1px solid #fff; }
      section#piece div.container div.description-ranger div.colonne h2 {
        text-align: left;
        margin: 0; }
      section#piece div.container div.description-ranger div.colonne h3 {
        text-align: left; }
      section#piece div.container div.description-ranger div.colonne p, section#piece div.container div.description-ranger div.colonne div#formulaire label, div#formulaire section#piece div.container div.description-ranger div.colonne label, section#piece div.container div.description-ranger div.colonne div#formulaire input, div#formulaire section#piece div.container div.description-ranger div.colonne input, section#piece div.container div.description-ranger div.colonne div#formulaire textarea, div#formulaire section#piece div.container div.description-ranger div.colonne textarea, section#piece div.container div.description-ranger div.colonne section#entete-poste h4, section#entete-poste section#piece div.container div.description-ranger div.colonne h4 {
        text-align: left; }
      section#piece div.container div.description-ranger div.colonne button {
        margin-top: 2em; }
    section#piece div.container div.description-ranger div.colonne:first-of-type {
      width: calc( 50% - 3.5vw  );
      margin-left: 3.5vw;
      padding-right: 3.5vw; }
    section#piece div.container div.description-ranger div.colonne:last-of-type {
      width: calc( 50% - 3.5vw  );
      margin-right: 3.5vw;
      padding-left: 3.5vw;
      padding-top: 5vw;
      border-right: none; }
      section#piece div.container div.description-ranger div.colonne:last-of-type h3:first-of-type {
        margin-top: 0;
        margin-bottom: 0.5em; }
  section#piece div.container div.livret-de-poids {
    background-color: #000;
    display: flex;
    flex-direction: column;
    padding: 0 3.5vw; }
    section#piece div.container div.livret-de-poids h3 {
      margin: 1.9vw 0; }
    section#piece div.container div.livret-de-poids table {
      width: 100%;
      table-layout: fixed; }
      section#piece div.container div.livret-de-poids table th, section#piece div.container div.livret-de-poids table td {
        text-align: center; }
      section#piece div.container div.livret-de-poids table th {
        background-color: #202126;
        padding: 1.6vw 0;
        border-bottom: 2px solid #fff;
        font-weight: 700; }
      section#piece div.container div.livret-de-poids table tr:nth-child(even) td {
        background-color: #000; }
      section#piece div.container div.livret-de-poids table tr:nth-child(odd) td {
        background-color: #202126; }
    section#piece div.container div.livret-de-poids p.legal, section#piece div.container div.livret-de-poids div#formulaire label.legal, div#formulaire section#piece div.container div.livret-de-poids label.legal, section#piece div.container div.livret-de-poids div#formulaire input.legal, div#formulaire section#piece div.container div.livret-de-poids input.legal, section#piece div.container div.livret-de-poids div#formulaire textarea.legal, div#formulaire section#piece div.container div.livret-de-poids textarea.legal, section#piece div.container div.livret-de-poids section#entete-poste h4.legal, section#entete-poste section#piece div.container div.livret-de-poids h4.legal {
      color: #8A8D90;
      text-align: left;
      margin: 0;
      margin-top: 1em;
      margin-bottom: 4em; }

section#service-conseil {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  min-height: 46vw;
  overflow: hidden; }
  section#service-conseil h2 {
    text-align: center;
    margin-top: 6vw;
    display: block; }
    section#service-conseil h2 strong {
      color: #E30414;
      display: block;
      opacity: 0; }

/* distribution*/
section#distribution-entete {
  width: 100%;
  height: 100vh;
  min-height: 53vw;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom center; }
  section#distribution-entete #gl {
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    position: absolute; }
  section#distribution-entete div.entete {
    position: absolute;
    top: 50%;
    left: 7.5vw;
    transform: translateY(-50%);
    z-index: 2; }
    section#distribution-entete div.entete h1 {
      text-align: left;
      text-transform: uppercase;
      margin: 0;
      line-height: 1; }
      section#distribution-entete div.entete h1 strong {
        opacity: 0;
        display: block; }
    section#distribution-entete div.entete p, section#distribution-entete div.entete div#formulaire label, div#formulaire section#distribution-entete div.entete label, section#distribution-entete div.entete div#formulaire input, div#formulaire section#distribution-entete div.entete input, section#distribution-entete div.entete div#formulaire textarea, div#formulaire section#distribution-entete div.entete textarea, section#distribution-entete div.entete section#entete-poste h4, section#entete-poste section#distribution-entete div.entete h4 {
      max-width: 40vw;
      margin-top: 0; }

section#distribution-service-conseil {
  margin-top: 6vw; }
  section#distribution-service-conseil div.ranger div.colonne:first-of-type {
    opacity: 0;
    width: 50%; }
    section#distribution-service-conseil div.ranger div.colonne:first-of-type img {
      width: 100%; }
      section#distribution-service-conseil div.ranger div.colonne:first-of-type img.mobile {
        display: none; }
  section#distribution-service-conseil div.ranger div.colonne:last-of-type {
    background-color: #000;
    position: relative;
    z-index: 2;
    width: 50%;
    top: 3vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    opacity: 0; }
    section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte {
      position: relative;
      z-index: 3;
      padding-right: 7.5vw; }
      section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte h3 {
        margin: 0em 0 .5em; }
      section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte button {
        margin-top: 1em; }
    section#distribution-service-conseil div.ranger div.colonne:last-of-type:before {
      content: '';
      width: 116%;
      left: -16%;
      top: 0;
      background-color: #000;
      position: absolute;
      z-index: 1;
      height: 100%; }
    section#distribution-service-conseil div.ranger div.colonne:last-of-type.apparaitre {
      display: flex !important; }

section#distribution-entreposage {
  width: 100%;
  height: 50vw;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-position: center;
  overflow: hidden; }
  section#distribution-entreposage h2 {
    text-align: center; }
    section#distribution-entreposage h2 strong {
      opacity: 0;
      display: block; }

section#map {
  margin-top: -12vw;
  /*&.arriver #calque-1{
  	animation-name: ville-1;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-7{
  	animation-name: ville-2;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-4{
  	animation-name: ville-3;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-9{
  	animation-name: ville-4;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-5{
  	animation-name: ville-5;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-6{
  	animation-name: ville-6;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-7{
  	animation-name: ville-7;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-8{
  	animation-name: ville-8;
  	animation-duration: 4s;
  	opacity:1;
  }
  &.arriver #calque-9{
  	animation-name: ville-9;
  	animation-duration: 4s;
  	opacity:1;
  }*/ }
  section#map.distribution {
    margin-top: -.8vw; }
  section#map.transformation {
    margin-top: -.8vw; }
  section#map h2 {
    text-align: center;
    margin-bottom: 2vw; }
@keyframes ville-1 {
  0% {
    opacity: 0; }
  22.222% {
    opacity: 1; } }
@keyframes ville-2 {
  0% {
    opacity: 0; }
  22.222% {
    opacity: 0; }
  55.555% {
    opacity: 1; } }
@keyframes ville-3 {
  0% {
    opacity: 0; }
  55.555% {
    opacity: 0; }
  88.8888% {
    opacity: 1; } }
@keyframes ville-4 {
  0% {
    opacity: 0; }
  88.8888% {
    opacity: 0; }
  100% {
    opacity: 1; } }
  section#map div.colonne-image {
    width: 60%; }
    section#map div.colonne-image img {
      width: 100%; }
  section#map div.colonne {
    width: 40%;
    background-color: #000;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    section#map div.colonne div.bg {
      padding: 0vw 4vw 0vw 2.5vw; }
      section#map div.colonne div.bg h3 {
        text-transform: uppercase; }
      section#map div.colonne div.bg div.col:first-of-type {
        width: 24%; }
        section#map div.colonne div.bg div.col:first-of-type p, section#map div.colonne div.bg div.col:first-of-type div#formulaire label, div#formulaire section#map div.colonne div.bg div.col:first-of-type label, section#map div.colonne div.bg div.col:first-of-type div#formulaire input, div#formulaire section#map div.colonne div.bg div.col:first-of-type input, section#map div.colonne div.bg div.col:first-of-type div#formulaire textarea, div#formulaire section#map div.colonne div.bg div.col:first-of-type textarea, section#map div.colonne div.bg div.col:first-of-type section#entete-poste h4, section#entete-poste section#map div.colonne div.bg div.col:first-of-type h4 {
          font-weight: 700;
          text-transform: uppercase; }
          section#map div.colonne div.bg div.col:first-of-type p span, section#map div.colonne div.bg div.col:first-of-type div#formulaire label span, div#formulaire section#map div.colonne div.bg div.col:first-of-type label span, section#map div.colonne div.bg div.col:first-of-type div#formulaire input span, div#formulaire section#map div.colonne div.bg div.col:first-of-type input span, section#map div.colonne div.bg div.col:first-of-type div#formulaire textarea span, div#formulaire section#map div.colonne div.bg div.col:first-of-type textarea span, section#map div.colonne div.bg div.col:first-of-type section#entete-poste h4 span, section#entete-poste section#map div.colonne div.bg div.col:first-of-type h4 span {
            font-weight: 400;
            text-transform: none; }
      section#map div.colonne div.bg div.col:last-of-type {
        width: 76%;
        border-bottom: 1px solid #E30414; }
      section#map div.colonne div.bg div.ranger:nth-last-of-type(2) div.col:last-of-type, section#map div.colonne div.bg div.ranger:nth-last-of-type(1) div.col:last-of-type {
        border-bottom: none; }
    section#map div.colonne button {
      margin-top: 1em; }

@keyframes ville-1 {
  0% {
    opacity: 0; }
  11.111% {
    opacity: 1; } }
@keyframes ville-2 {
  0% {
    opacity: 0; }
  11.11% {
    opacity: 0; }
  22.222% {
    opacity: 1; } }
@keyframes ville-3 {
  0% {
    opacity: 0; }
  22.222% {
    opacity: 0; }
  33.333% {
    opacity: 1; } }
@keyframes ville-4 {
  0% {
    opacity: 0; }
  33.333% {
    opacity: 0; }
  44.444% {
    opacity: 1; } }
@keyframes ville-5 {
  0% {
    opacity: 0; }
  44.444% {
    opacity: 0; }
  55.555% {
    opacity: 1; } }
@keyframes ville-6 {
  0% {
    opacity: 0; }
  55.555% {
    opacity: 0; }
  66.666% {
    opacity: 1; } }
@keyframes ville-7 {
  0% {
    opacity: 0; }
  66.666% {
    opacity: 0; }
  77.777% {
    opacity: 1; } }
@keyframes ville-8 {
  0% {
    opacity: 0; }
  77.7777% {
    opacity: 0; }
  88.8888% {
    opacity: 1; } }
@keyframes ville-9 {
  0% {
    opacity: 0; }
  88.8888% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@media (max-width: 800px) {
  h1 {
    font-size: 2rem; }

  .button {
    width: 12rem; } }
section#cueillette-livraison {
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 1.5vw 0 3vw; }
  section#cueillette-livraison div.contenu {
    max-width: 64%; }
    section#cueillette-livraison div.contenu div.ranger {
      justify-content: space-between; }
      section#cueillette-livraison div.contenu div.ranger div.colonne {
        width: 48%;
        text-align: center; }
        section#cueillette-livraison div.contenu div.ranger div.colonne h3 {
          text-transform: uppercase;
          margin: 0; }
        section#cueillette-livraison div.contenu div.ranger div.colonne p, section#cueillette-livraison div.contenu div.ranger div.colonne div#formulaire label, div#formulaire section#cueillette-livraison div.contenu div.ranger div.colonne label, section#cueillette-livraison div.contenu div.ranger div.colonne div#formulaire input, div#formulaire section#cueillette-livraison div.contenu div.ranger div.colonne input, section#cueillette-livraison div.contenu div.ranger div.colonne div#formulaire textarea, div#formulaire section#cueillette-livraison div.contenu div.ranger div.colonne textarea, section#cueillette-livraison div.contenu div.ranger div.colonne section#entete-poste h4, section#entete-poste section#cueillette-livraison div.contenu div.ranger div.colonne h4 {
          margin-bottom: 0; }
        section#cueillette-livraison div.contenu div.ranger div.colonne div.bg {
          width: 100%;
          padding: 5% 10%;
          background-color: #E30414;
          height: 100%; }

section#distribution-secteurs-activites div.contenu {
  max-width: 64%;
  display: block;
  margin: 0 auto; }
  section#distribution-secteurs-activites div.contenu h2 {
    text-align: center;
    margin-bottom: 0; }
  section#distribution-secteurs-activites div.contenu div.colonne {
    position: relative;
    z-index: 1;
    width: 33.3333%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 5% 5%;
    position: relative; }
    section#distribution-secteurs-activites div.contenu div.colonne img {
      width: auto;
      display: block;
      margin: 0 auto;
      max-width: 100%; }
    section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre {
      z-index: 2;
      position: absolute;
      left: 50%;
      top: 46%;
      transform: translate(-50%, 74%); }
      section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre h4 {
        text-transform: uppercase;
        text-align: center;
        margin: 0;
        position: relative;
        transition: all .5s ease; }
        section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre h4.active {
          transform: translateY(-50%); }
      section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre span.popup {
        color: #E30414;
        text-align: center;
        width: 100%;
        position: absolute;
        cursor: pointer;
        font-weight: 700; }
    section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description {
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translate(-50%, 34%) scale(0.1);
      width: 100%;
      background-color: #000;
      padding: 2% 5%;
      z-index: 3;
      display: none;
      transition: all .5s ease; }
      section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description p, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description div#formulaire label, div#formulaire section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description label, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description div#formulaire input, div#formulaire section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description input, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description div#formulaire textarea, div#formulaire section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description textarea, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description section#entete-poste h4, section#entete-poste section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description h4 {
        text-align: center; }
      section#distribution-secteurs-activites div.contenu div.colonne div.absolute-description.active {
        transform: translate(-50%, 19%) scale(1); }

section#distribution-avantages {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: 7vw;
  margin-bottom: -1.7vw; }
  section#distribution-avantages div.ranger {
    justify-content: space-between; }
    section#distribution-avantages div.ranger div.colonne {
      width: 49%;
      margin-bottom: 2%;
      background-color: #000;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 21vw;
      padding: 1vw 4vw; }
      section#distribution-avantages div.ranger div.colonne.apparaitre {
        display: flex !important; }
    section#distribution-avantages div.ranger h3 {
      margin: 0; }
    section#distribution-avantages div.ranger h4 {
      margin: 0; }
    section#distribution-avantages div.ranger div.colonne.titre {
      background-color: transparent;
      padding-left: 7.5vw;
      padding-right: 6vw; }
      section#distribution-avantages div.ranger div.colonne.titre p, section#distribution-avantages div.ranger div.colonne.titre div#formulaire label, div#formulaire section#distribution-avantages div.ranger div.colonne.titre label, section#distribution-avantages div.ranger div.colonne.titre div#formulaire input, div#formulaire section#distribution-avantages div.ranger div.colonne.titre input, section#distribution-avantages div.ranger div.colonne.titre div#formulaire textarea, div#formulaire section#distribution-avantages div.ranger div.colonne.titre textarea, section#distribution-avantages div.ranger div.colonne.titre section#entete-poste h4, section#entete-poste section#distribution-avantages div.ranger div.colonne.titre h4 {
        max-width: 90%; }
    section#distribution-avantages div.ranger div.colonne:nth-child(1) {
      order: 2;
      width: 59%; }
    section#distribution-avantages div.ranger div.colonne:nth-child(2) {
      order: 1;
      width: 39%;
      opacity: 0; }
    section#distribution-avantages div.ranger div.colonne:nth-child(3) {
      order: 3;
      width: 39%;
      opacity: 0; }
    section#distribution-avantages div.ranger div.colonne:nth-child(4) {
      order: 4;
      width: 39%;
      margin-right: 20%;
      opacity: 0;
      animation-delay: .5s; }

section#distribution-ouvert-au-public {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  min-height: 55vw; }
  section#distribution-ouvert-au-public div.texte {
    max-width: 60%; }
    section#distribution-ouvert-au-public div.texte h3 {
      margin: 0;
      margin-bottom: 0.3em; }
    section#distribution-ouvert-au-public div.texte h4 {
      margin: 0; }
    section#distribution-ouvert-au-public div.texte ul {
      columns: 2; }
    section#distribution-ouvert-au-public div.texte button {
      margin-top: 1em; }
  section#distribution-ouvert-au-public div.absolute {
    position: absolute;
    right: 0;
    bottom: -4vw;
    width: 41%;
    z-index: 3; }
    section#distribution-ouvert-au-public div.absolute img {
      width: 100%;
      opacity: 0; }

section#distribution-metaux-usages {
  background-size: contain;
  background-position: left;
  background-repeat: no-repeat;
  position: relative;
  z-index: 2;
  min-height: 49vw; }
  section#distribution-metaux-usages div.texte {
    position: relative;
    float: right;
    top: -4vw;
    width: 58vw;
    background-image: linear-gradient(to bottom, black, black, rgba(0, 0, 0, 0));
    text-align: center;
    padding: 0 12%;
    z-index: 4; }
    section#distribution-metaux-usages div.texte h3 {
      margin-bottom: 0.25em; }
    section#distribution-metaux-usages div.texte button {
      margin-top: 1em; }
  section#distribution-metaux-usages div.image {
    position: absolute;
    right: 0;
    height: 100%;
    bottom: -4vw;
    z-index: 3;
    width: 72vw; }
    section#distribution-metaux-usages div.image img {
      width: 100%;
      opacity: 0; }

section#distribution-metaux-usages-mobile {
  display: none; }
  section#distribution-metaux-usages-mobile div.texte {
    position: relative;
    float: right;
    top: 0vw;
    width: 100;
    background-image: linear-gradient(to bottom, black, black, black);
    text-align: center;
    padding: 20px 12% 0;
    z-index: 4; }
    section#distribution-metaux-usages-mobile div.texte h3 {
      margin-bottom: 0.25em; }
    section#distribution-metaux-usages-mobile div.texte button {
      margin-top: 1em; }

section#distribution-grand-distributeur {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  min-height: 60vw;
  z-index: 1;
  overflow: hidden; }
  section#distribution-grand-distributeur div.texte h2 {
    text-align: center; }
    section#distribution-grand-distributeur div.texte h2 strong {
      opacity: 0; }

section#distribution-quincaillerie {
  position: relative;
  z-index: 2;
  min-height: 40vw;
  display: flex; }
  section#distribution-quincaillerie div.absolute-titre {
    z-index: 3;
    position: absolute;
    top: 2.7vw;
    right: 0;
    text-align: right;
    opacity: 0; }
    section#distribution-quincaillerie div.absolute-titre span {
      line-height: 0.9; }
  section#distribution-quincaillerie div.absolute-img {
    position: absolute;
    z-index: 2;
    width: 50%;
    right: 0;
    bottom: 0; }
    section#distribution-quincaillerie div.absolute-img img {
      width: 100%; }
  section#distribution-quincaillerie div.texte {
    max-width: 42.5vw;
    text-align: left;
    position: relative;
    margin-top: -4vw;
    z-index: 4; }
    section#distribution-quincaillerie div.texte h3 {
      margin-bottom: 0.7em; }
    section#distribution-quincaillerie div.texte button {
      margin-top: 2em; }
    section#distribution-quincaillerie div.texte p, section#distribution-quincaillerie div.texte div#formulaire label, div#formulaire section#distribution-quincaillerie div.texte label, section#distribution-quincaillerie div.texte div#formulaire input, div#formulaire section#distribution-quincaillerie div.texte input, section#distribution-quincaillerie div.texte div#formulaire textarea, div#formulaire section#distribution-quincaillerie div.texte textarea, section#distribution-quincaillerie div.texte section#entete-poste h4, section#entete-poste section#distribution-quincaillerie div.texte h4 {
      padding-right: 23%; }

/* armature */
section#armature-entete {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden; }
  section#armature-entete.armature div.colonne.active div.col:last-of-type, section#armature-entete.armature div.colonne div.col:last-of-type {
    min-width: 33.5vw;
    max-width: 33.5vw; }
  section#armature-entete div.container {
    padding-top: 20vw;
    position: initial;
    padding-bottom: 5vw; }
  section#armature-entete div.absolute_titre {
    position: absolute;
    top: 0;
    left: 100%;
    opacity: 0;
    transition: 1.5s ease; }
    section#armature-entete div.absolute_titre h1 {
      white-space: nowrap; }
    section#armature-entete div.absolute_titre.active {
      left: 0;
      opacity: 1; }
  section#armature-entete h2 {
    text-align: center; }
  section#armature-entete div.colonne {
    flex: auto;
    position: relative;
    width: calc( 40% - 0.5vw);
    margin: 0 0.5vw;
    transition: left .5s ease;
    left: 0; }
    section#armature-entete div.colonne h3 {
      margin-top: 0; }
    section#armature-entete div.colonne.active {
      width: calc( 60% - 0.5vw); }
      section#armature-entete div.colonne.active div.col:last-of-type {
        width: 66.666%;
        left: 33.3333%;
        transition: left .5s ease;
        position: absolute;
        min-width: 30vw; }
  section#armature-entete div.colonne:first-of-type {
    margin-left: 0; }
  section#armature-entete div.colonne:last-of-type {
    margin-right: 0; }
  section#armature-entete div.colonne {
    transition: all .5s ease;
    display: flex;
    flex-wrap: wrap;
    min-height: 20vw; }
    section#armature-entete div.colonne div.col:first-of-type {
      width: 33.3333%;
      background-size: cover;
      background-position: center;
      position: absolute;
      top: 0;
      left: 0;
      height: 100%; }
    section#armature-entete div.colonne div.col:last-of-type {
      width: 100%;
      padding-right: 0;
      background-color: #000;
      padding: 3vw 3vw;
      position: relative;
      height: 100%;
      left: 0%; }
      section#armature-entete div.colonne div.col:last-of-type button {
        margin-top: 0.5em;
        margin-bottom: 0;
        padding: .5vw 1vw; }
  section#armature-entete div.ranger-mobile {
    display: none;
    flex-wrap: wrap; }
    section#armature-entete div.ranger-mobile div.colonne-mobile {
      width: 33.3333%;
      padding: 15px;
      display: flex;
      flex-direction: column; }
      section#armature-entete div.ranger-mobile div.colonne-mobile div.col:first-of-type {
        width: 100%;
        height: 0;
        padding-bottom: 75%;
        background-size: cover;
        background-position: center; }
      section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type {
        background-color: #000;
        padding: 30px 15px;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between; }

section#armature-experts-conseils {
  margin-top: 2vw; }
  section#armature-experts-conseils div.colonne {
    width: 33.3333%;
    height: 40vw;
    background-size: cover;
    background-position: center;
    opacity: 0; }
    section#armature-experts-conseils div.colonne div.bg {
      height: 43vw;
      position: relative;
      top: -3vw;
      background-color: #E30414;
      padding: 3vw;
      display: flex;
      flex-direction: column;
      justify-content: center; }
      section#armature-experts-conseils div.colonne div.bg h2 {
        margin: 0; }
      section#armature-experts-conseils div.colonne div.bg button {
        margin-top: 0.5em; }
  section#armature-experts-conseils div.colonne:nth-child(2) {
    animation-delay: .5s; }
  section#armature-experts-conseils div.colonne:nth-child(3) {
    animation-delay: 1s; }

section#distribution-entreposage.armature {
  height: 52vw;
  padding-bottom: 6vw; }
  section#distribution-entreposage.armature h2 {
    margin-top: 0; }

section#distribution-avantages.armature {
  background-size: contain;
  background-position: right center;
  padding-top: 28vw;
  margin-top: -24vw; }

section#distribution-ouvert-au-public.armature {
  margin-top: -1.7vw; }
  section#distribution-ouvert-au-public.armature div.absolute {
    width: 50%; }

section#distribution-metaux-usages.armature {
  margin-top: 4.3vw;
  background-color: #000; }
  section#distribution-metaux-usages.armature div.image {
    bottom: -12.2vw; }

section#distribution-grand-distributeur.armature {
  height: 61vw; }

section#distribution-quincaillerie.armature div.texte {
  max-width: 38.8vw;
  margin-top: -7vw; }
  section#distribution-quincaillerie.armature div.texte p, section#distribution-quincaillerie.armature div.texte div#formulaire label, div#formulaire section#distribution-quincaillerie.armature div.texte label, section#distribution-quincaillerie.armature div.texte div#formulaire input, div#formulaire section#distribution-quincaillerie.armature div.texte input, section#distribution-quincaillerie.armature div.texte div#formulaire textarea, div#formulaire section#distribution-quincaillerie.armature div.texte textarea, section#distribution-quincaillerie.armature div.texte section#entete-poste h4, section#entete-poste section#distribution-quincaillerie.armature div.texte h4 {
    padding-right: 16%; }

/* coupe d'Acier */
section#armature-entete.coupe-dacier .mt-3 {
  margin-top:1vw;
}
section#armature-entete.coupe-dacier div.container {
  padding: 0 3vw;
  padding-top: 20vw;
  position: initial;
  padding-bottom: 5vw; }

section#armature-entete.coupe-dacier div.colonne {
  width: calc( 27% - 0.5vw); }
  
  section#armature-entete.coupe-dacier div.colonne div.col:last-of-type {
    padding: 1.6vw 3vw;
    min-height: 20vw;
    max-width: 26.3vw; }

section#armature-entete.coupe-dacier div.colonne.active {
  width: calc( 40% - 0.5vw); }
  section#armature-entete.coupe-dacier div.colonne.active div.col:last-of-type {
    min-width: 25.7vw; }

section#distribution-entreposage.coupe-dacier {
  height: 54vw;
  margin-top: 6vw; }
  section#distribution-entreposage.coupe-dacier h2 {
    margin-top: -9vw; }

section#distribution-avantages.coupe-dacier {
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  padding-top: 25vw;
  margin-top: -14vw; }
  section#distribution-avantages.coupe-dacier div.ranger div.colonne.titre {
    justify-content: flex-start; }

section#distribution-quincaillerie.coupe-dacier div.texte {
  max-width: 36.5vw;
  text-align: left;
  position: relative;
  margin-top: -10.8vw; }

section#carousel.coupe-dacier h2 {
  margin-top: 5vw; }

section#carousel.coupe-dacier div.slider-nav {
  width: 40%; }

section#distribution-grand-distributeur.coupe-dacier {
  min-height: 50vw; }

section#carousel.coupe-dacier div.conteneur {
  padding-left: 7.5vw; }

/* TRANSFORMATION */
section#transformation-entete {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden; }
  section#transformation-entete div.container {
    padding-top: 20vw;
    position: initial;
    padding-bottom: 5vw; }
  section#transformation-entete div.absolute_titre {
    position: absolute;
    top: 0;
    left: 100%;
    opacity: 0;
    transition: all 1.5s ease; }
    section#transformation-entete div.absolute_titre.active {
      left: 0;
      opacity: 1; }
    section#transformation-entete div.absolute_titre h1 {
      white-space: nowrap; }
  section#transformation-entete h2 {
    text-align: center; }
  section#transformation-entete div.ranger {
    justify-content: space-between; }
    section#transformation-entete div.ranger div.colonne {
      background-color: #000;
      width: calc(25% - 1vw);
      padding: 2vw;
      position: relative;
      overflow: hidden;
      flex: 1;
      margin: 0 1vw;
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
      section#transformation-entete div.ranger div.colonne .after {
        margin: 0;
        overflow: hidden;
        text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.7);
        width: 100%;
        height: calc( 0vw );
        background-image: attr(data-img url);
        background-color: #1450e1;
        position: absolute;
        background-position: center;
        background-size: cover;
        transition: 0.4s;
        left: 0;
        right: 0;
        z-index: 3;
        top: 0; }
      section#transformation-entete div.ranger div.colonne:hover .after, section#transformation-entete div.ranger div.colonne .active.after {
        height: calc( 100% - 5.7vw ); }
  section#transformation-entete div.ranger-mobile {
    display: none;
    flex-wrap: wrap; }
    section#transformation-entete div.ranger-mobile div.colonne-mobile {
      width: 33.3333%;
      padding: 15px; }
      section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:first-of-type {
        width: 100%;
        height: 0;
        padding-bottom: 75%;
        background-size: cover;
        background-position: center; }
      section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type {
        background-color: #000;
        padding: 30px 15px; }

section#distribution-avantages.transformation div.ranger div.colonne.titre {
  padding-right: 0vw; }
  section#distribution-avantages.transformation div.ranger div.colonne.titre p, section#distribution-avantages.transformation div.ranger div.colonne.titre div#formulaire label, div#formulaire section#distribution-avantages.transformation div.ranger div.colonne.titre label, section#distribution-avantages.transformation div.ranger div.colonne.titre div#formulaire input, div#formulaire section#distribution-avantages.transformation div.ranger div.colonne.titre input, section#distribution-avantages.transformation div.ranger div.colonne.titre div#formulaire textarea, div#formulaire section#distribution-avantages.transformation div.ranger div.colonne.titre textarea, section#distribution-avantages.transformation div.ranger div.colonne.titre section#entete-poste h4, section#entete-poste section#distribution-avantages.transformation div.ranger div.colonne.titre h4 {
    max-width: 80%; }

section#distribution-entreposage.transformation {
  height: 50vw; }

section#distribution-avantages.transformation {
  background-size: contain;
  background-position: right center;
  padding-top: 22vw;
  margin-top: -15vw; }

section#distribution-metaux-usages.transformation {
  background-color: #000; }
  section#distribution-metaux-usages.transformation div.image {
    bottom: -12.6vw; }
  section#distribution-metaux-usages.transformation div.texte {
    padding: 0 8%; }
    section#distribution-metaux-usages.transformation div.texte p, section#distribution-metaux-usages.transformation div.texte div#formulaire label, div#formulaire section#distribution-metaux-usages.transformation div.texte label, section#distribution-metaux-usages.transformation div.texte div#formulaire input, div#formulaire section#distribution-metaux-usages.transformation div.texte input, section#distribution-metaux-usages.transformation div.texte div#formulaire textarea, div#formulaire section#distribution-metaux-usages.transformation div.texte textarea, section#distribution-metaux-usages.transformation div.texte section#entete-poste h4, section#entete-poste section#distribution-metaux-usages.transformation div.texte h4 {
      max-width: 78%;
      display: block;
      margin-left: auto;
      margin-right: auto; }

section#distribution-quincaillerie.transformation {
  margin-top: -4vw; }
  section#distribution-quincaillerie.transformation div.texte {
    margin-top: -8vw; }

section#distribution-ouvert-au-public.transformation div.absolute {
  bottom: 1vw; }

section#distribution-grand-distributeur.transformation {
  min-height: 55vw; }
  section#distribution-grand-distributeur.transformation div.texte h2 {
    top: 0; }

section#carousel.transformation div.conteneur {
  padding-left: 7.5vw; }

/* autres produits */
section#autres-produits-entete {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top; }
  section#autres-produits-entete div.colonne {
    width: 50%; }
    section#autres-produits-entete div.colonne div.texte {
      margin-top: 12vw; }
      section#autres-produits-entete div.colonne div.texte h1 strong {
        opacity: 0; }
    section#autres-produits-entete div.colonne div.img {
      position: relative;
      top: 62%; }
      section#autres-produits-entete div.colonne div.img img {
        width: calc(100% + 7.5vw); }

section#autres-produits-ponceaux div.colonne {
  width: 50%; }
  section#autres-produits-ponceaux div.colonne div.texte {
    max-width: 28vw;
    margin-top: 3.5vw; }
    section#autres-produits-ponceaux div.colonne div.texte h2 {
      margin: 0; }
    section#autres-produits-ponceaux div.colonne div.texte button {
      margin-top: 1em; }
section#autres-produits-ponceaux div.background {
  background-size: auto 111%;
  background-repeat: no-repeat;
  background-position: top right;
  height: 45vw;
  margin-top: -10.5vw;
  position: relative; }
  section#autres-produits-ponceaux div.background div.container {
    position: absolute;
    bottom: 0; }
  section#autres-produits-ponceaux div.background div.ranger {
    padding-top: 22.6vw;
    justify-content: space-between;
    width: 65vw; }
    section#autres-produits-ponceaux div.background div.ranger div.colonne {
      width: calc( 50% - 0.5vw );
      opacity: 0; }
      section#autres-produits-ponceaux div.background div.ranger div.colonne div.bg {
        height: 100%;
        background-color: #000;
        padding: 14%;
        display: flex;
        flex-direction: column;
        justify-content: space-between; }
      section#autres-produits-ponceaux div.background div.ranger div.colonne:last-of-type {
        animation-delay: .5s; }
section#autres-produits-ponceaux img.mobile-ponceaux {
  width: 100%;
  display: none; }

section#autres-produits-membrane {
  margin-top: 5vw;
  position: relative;
  margin-bottom: 15vw; }
  section#autres-produits-membrane div.container div.ranger div.colonne:first-of-type {
    width: 55%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat; }
  section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type {
    width: 45%;
    padding-left: 1vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
    section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type h2 {
      margin: 0;
      margin-top: -.2em; }
    section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type p:last-of-type, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type div#formulaire label:last-of-type, div#formulaire section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type label:last-of-type, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type div#formulaire input:last-of-type, div#formulaire section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type input:last-of-type, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type div#formulaire textarea:last-of-type, div#formulaire section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type textarea:last-of-type, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type section#entete-poste h4:last-of-type, section#entete-poste section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type h4:last-of-type {
      margin-bottom: 0; }
  section#autres-produits-membrane div.absolute {
    position: absolute;
    left: 0;
    bottom: -50%;
    width: 23vw;
    opacity: 0; }
    section#autres-produits-membrane div.absolute img {
      width: 100%; }

section#autres-produits-livraison {
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  height: 56vw; }
  section#autres-produits-livraison div.etiquette {
    background-color: #E30414;
    width: 49vw;
    padding: 2% 4%;
    color: #fff; }
    section#autres-produits-livraison div.etiquette h3 {
      margin: 0; }
  section#autres-produits-livraison h2 {
    margin: 0;
    margin-top: 1vw; }
    section#autres-produits-livraison h2 strong {
      opacity: 0; }

section#autres-produits-revetement div.colonne {
  position: relative;
  width: 50%; }
  section#autres-produits-revetement div.colonne:last-of-type {
    opacity: 0; }
  section#autres-produits-revetement div.colonne h3 {
    margin: 0; }
  section#autres-produits-revetement div.colonne button {
    margin-top: 2em; }
  section#autres-produits-revetement div.colonne img {
    position: absolute;
    top: 5vw;
    transform: translateY(-50%);
    width: calc( 100% + 7.5vw ); }

section#slides-revetements {
  margin-top: 4vw; }
  section#slides-revetements div.ranger-onglet {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    section#slides-revetements div.ranger-onglet div.onglet {
      width: calc( 25% - 1vw );
      background-color: #E30414;
      position: relative;
      height: 7vw;
      cursor: pointer; }
      section#slides-revetements div.ranger-onglet div.onglet img {
        position: absolute;
        width: calc( 100% - 2vw );
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%); }
      section#slides-revetements div.ranger-onglet div.onglet.active {
        background-color: #000; }
    section#slides-revetements div.ranger-onglet div.onglet:nth-of-type(4) img {
      max-height: 81%; }
    section#slides-revetements div.ranger-onglet div.onglet:nth-of-type(3) img {
      max-height: 57%; }
    section#slides-revetements div.ranger-onglet div.onglet:nth-of-type(2) img {
      max-height: 57%; }
  section#slides-revetements div.ranger {
    background-color: #000;
    padding: 3vw;
    display: none; }
    section#slides-revetements div.ranger div.colonne:first-of-type {
      width: 40%; }
      section#slides-revetements div.ranger div.colonne:first-of-type img {
        width: 100%; }
    section#slides-revetements div.ranger div.colonne:last-of-type {
      width: 60%;
      padding-left: 3vw; }
      section#slides-revetements div.ranger div.colonne:last-of-type h4 {
        margin: 0; }
      section#slides-revetements div.ranger div.colonne:last-of-type button {
        margin-top: 1em; }
    section#slides-revetements div.ranger.active {
      display: flex; }

section#map.autres-produits {
  margin-top: 5vw; }

section#distribution-ouvert-au-public.autres-produits {
  min-height: 50vw;
  z-index: 1; }
  section#distribution-ouvert-au-public.autres-produits div.texte {
    margin-top: -13vw; }

section#distribution-ouvert-au-public.autres-produits div.absolute {
  bottom: -7vw; }

section#distribution-quincaillerie.autres-produits div.texte {
  margin-top: -5.7vw;
  max-width: 39.5vw; }

section#autres-produits-slogan {
  padding-bottom: 10vw; }
  section#autres-produits-slogan h2 {
    text-align: center; }
    section#autres-produits-slogan h2 strong {
      opacity: 0; }
      section#autres-produits-slogan h2 strong.apparaitre {
        display: inline-block !important; }

/* ponceaux */
section#ponceaux-entete {
  min-height: 53vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex; }
  section#ponceaux-entete div.texte h1 {
    text-align: center;
    margin-top: 15vw; }
    section#ponceaux-entete div.texte h1 strong {
      opacity: 0; }

section#ponceaux-slide, section#tuyaux-slide {
  position: relative;
  z-index: 1;
  margin-top: -7vw; }
  section#ponceaux-slide div.colonne, section#tuyaux-slide div.colonne {
    width: 50%; }
  section#ponceaux-slide div.colonne:first-of-type, section#tuyaux-slide div.colonne:first-of-type {
    padding-left: 7.5vw;
    margin-top: 2vw;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    
    section#ponceaux-slide div.colonne:first-of-type h2, section#tuyaux-slide div.colonne:first-of-type h2 {
      margin-bottom: 0;
      margin-top: 0; }
    section#ponceaux-slide div.colonne:first-of-type div.texte, section#tuyaux-slide div.colonne:first-of-type div.texte {
      width: 80%;
      padding-bottom: 3em;
      display: flex;
      flex-direction: column; }
      section#ponceaux-slide div.colonne:first-of-type div.texte button, section#tuyaux-slide div.colonne:first-of-type div.texte button {
        margin-top: 4em; }
  section#ponceaux-slide div.colonne:last-of-type, section#tuyaux-slide div.colonne:last-of-type {
    position: relative; }
    section#ponceaux-slide div.colonne:last-of-type div.relative, section#tuyaux-slide div.colonne:last-of-type div.relative {
      position: relative;
      margin-top: 2vw; }
      section#ponceaux-slide div.colonne:last-of-type div.relative img, section#tuyaux-slide div.colonne:last-of-type div.relative img {
        width: 100%; }
      section#ponceaux-slide div.colonne:last-of-type div.relative div.absolute, section#tuyaux-slide div.colonne:last-of-type div.relative div.absolute {
        top: 0;
        left: 0;
        position: absolute;
        transform: translateY(-50%);
        background-color: #000;
        padding: 1vw 1.5vw;
        min-width: 50%; }
        section#ponceaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#tuyaux-slide div.colonne:last-of-type div.relative div.absolute h4 {
          text-transform: uppercase;
          margin: 0; }
    section#ponceaux-slide div.colonne:last-of-type div.abs, section#tuyaux-slide div.colonne:last-of-type div.abs {
      width: 40%;
      position: absolute;
      bottom: -1vw;
      right: 5%;
      display: flex;
      flex-wrap: wrap; }
      section#ponceaux-slide div.colonne:last-of-type div.abs div.slider-ponceaux-nav, section#ponceaux-slide div.colonne:last-of-type div.abs div.slider-tuyaux-nav, section#tuyaux-slide div.colonne:last-of-type div.abs div.slider-ponceaux-nav, section#tuyaux-slide div.colonne:last-of-type div.abs div.slider-tuyaux-nav {
        width: calc(100% - 3vw); }
        section#ponceaux-slide div.colonne:last-of-type div.abs div.slider-ponceaux-nav img, section#ponceaux-slide div.colonne:last-of-type div.abs div.slider-tuyaux-nav img, section#tuyaux-slide div.colonne:last-of-type div.abs div.slider-ponceaux-nav img, section#tuyaux-slide div.colonne:last-of-type div.abs div.slider-tuyaux-nav img {
          width: 100%; }
      section#ponceaux-slide div.colonne:last-of-type div.abs div.slide, section#tuyaux-slide div.colonne:last-of-type div.abs div.slide {
        position: relative;
        z-index: 1; }
        section#ponceaux-slide div.colonne:last-of-type div.abs div.slide:after, section#tuyaux-slide div.colonne:last-of-type div.abs div.slide:after {
          content: '';
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          right: 0;
          bottom: 0;
          z-index: 2;
          background-color: #E30414;
          opacity: 0.75;
          mix-blend-mode: plus-lighter;
          position: absolute; }
      section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux, section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux {
        width: 3vw;
        background-color: #000;
        color: #E30414;
        position: relative;
        cursor: pointer; }
        section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux span, section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux span, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux span, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux span {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          font-size: 4vw; }
  section#ponceaux-slide img.fleche, section#tuyaux-slide img.fleche {
    width: 12px;
    height: auto; }
  section#ponceaux-slide img.fleche.prev, section#tuyaux-slide img.fleche.prev {
    transform: rotate(180deg); }

section#ponceaux-selection, section#drains-selection {
  padding-top: 4vw; }
  section#ponceaux-selection h2, section#drains-selection h2 {
    text-align: center;
    margin-bottom: 0.5em; }
  section#ponceaux-selection div.ranger, section#drains-selection div.ranger {
    justify-content: space-between; }
    section#ponceaux-selection div.ranger div.colonne, section#drains-selection div.ranger div.colonne {
      background-color: #E30414;
      padding: 1vw;
      flex: 1;
      margin: 0 1vw;
      cursor: pointer; }
      section#ponceaux-selection div.ranger div.colonne h4, section#drains-selection div.ranger div.colonne h4 {
        text-align: center;
        margin: 0 auto; }
      section#ponceaux-selection div.ranger div.colonne.active, section#drains-selection div.ranger div.colonne.active {
        background-color: #000;
        cursor: auto; }
      section#ponceaux-selection div.ranger div.colonne:first-of-type, section#drains-selection div.ranger div.colonne:first-of-type {
        margin-left: 0; }
      section#ponceaux-selection div.ranger div.colonne:last-of-type, section#drains-selection div.ranger div.colonne:last-of-type {
        margin-right: 0; }
  section#ponceaux-selection div.noir, section#drains-selection div.noir {
    background-color: #000; }
  section#ponceaux-selection div.ranger-content, section#drains-selection div.ranger-content {
    background-color: #000;
    padding: 6vw 0vw 0;
    display: none;
    flex-wrap: wrap; }
    section#ponceaux-selection div.ranger-content div.colonne, section#drains-selection div.ranger-content div.colonne {
      width: 50%;
      padding: 0vw 3vw 5vw; }
      section#ponceaux-selection div.ranger-content div.colonne h3, section#drains-selection div.ranger-content div.colonne h3 {
        margin: 0; }
      section#ponceaux-selection div.ranger-content div.colonne h4, section#drains-selection div.ranger-content div.colonne h4 {
        margin: 0; }
      section#ponceaux-selection div.ranger-content div.colonne button, section#drains-selection div.ranger-content div.colonne button {
        margin-top: 2em; }
      section#ponceaux-selection div.ranger-content div.colonne:first-of-type, section#drains-selection div.ranger-content div.colonne:first-of-type {
        border-right: 1px solid #E30414; }
    section#ponceaux-selection div.ranger-content.active, section#drains-selection div.ranger-content.active {
      display: flex; }

section#ponceaux-selection-mobile, section#drains-selection-mobile {
  display: none; }
  section#ponceaux-selection-mobile h2, section#drains-selection-mobile h2 {
    text-align: center;
    margin-bottom: 0.5em; }
  section#ponceaux-selection-mobile div.tab, section#drains-selection-mobile div.tab {
    background-color: #000;
    padding: 15px;
    margin-bottom: 15px; }
    section#ponceaux-selection-mobile div.tab div.accordeon, section#drains-selection-mobile div.tab div.accordeon {
      position: relative; }
      section#ponceaux-selection-mobile div.tab div.accordeon h4, section#drains-selection-mobile div.tab div.accordeon h4 {
        text-align: left;
        margin: 0 auto;
        color: #fff;
        position: relative;
        cursor: pointer;
        display: block; }
      section#ponceaux-selection-mobile div.tab div.accordeon:after, section#drains-selection-mobile div.tab div.accordeon:after {
        content: '';
        background-image: url("images/fleche-bleu.svg");
        transform: rotate(90deg);
        position: absolute;
        top: 3px;
        right: 15px;
        width: 18px;
        height: 18px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        transition: all .5s ease; }
      section#ponceaux-selection-mobile div.tab div.accordeon.active:after, section#drains-selection-mobile div.tab div.accordeon.active:after {
        transform: rotate(-90deg); }
      section#ponceaux-selection-mobile div.tab div.accordeon.active h4, section#drains-selection-mobile div.tab div.accordeon.active h4 {
        color: #E30414; }
    section#ponceaux-selection-mobile div.tab div.ranger-content, section#drains-selection-mobile div.tab div.ranger-content {
      display: none; }
      section#ponceaux-selection-mobile div.tab div.ranger-content h3, section#drains-selection-mobile div.tab div.ranger-content h3 {
        margin: 0; }
      section#ponceaux-selection-mobile div.tab div.ranger-content h4, section#drains-selection-mobile div.tab div.ranger-content h4 {
        margin: 0; }
      section#ponceaux-selection-mobile div.tab div.ranger-content div.colonne:first-of-type, section#drains-selection-mobile div.tab div.ranger-content div.colonne:first-of-type {
        border-bottom: 1px solid #E30414; }
      section#ponceaux-selection-mobile div.tab div.ranger-content div.colonne, section#drains-selection-mobile div.tab div.ranger-content div.colonne {
        padding-top: 40px;
        padding-bottom: 20px; }
      section#ponceaux-selection-mobile div.tab div.ranger-content.active, section#drains-selection-mobile div.tab div.ranger-content.active {
        display: block; }
        section#ponceaux-selection-mobile div.tab div.ranger-content.active div.accordeon, section#drains-selection-mobile div.tab div.ranger-content.active div.accordeon {
          display: block; }
      section#ponceaux-selection-mobile div.tab div.ranger-content img, section#drains-selection-mobile div.tab div.ranger-content img {
        width: 100%;
        margin-bottom: 50px; }

section#tuyaux-slide {
  margin-top: 7vw; }
  section#tuyaux-slide div.ranger {
    flex-direction: row-reverse; }

section#nos-secteurs-activite.ponceaux {
  margin-top: -15vw;
  position: relative;
  z-index: 3; }

section#ponceaux-transport-surdimensionnes {
  background-size: cover;
  background-position: bottom center;
  background-repeat: no-repeat;
  position: relative;
  min-height: 51vw; }
  section#ponceaux-transport-surdimensionnes h2 {
    text-align: center; }
  section#ponceaux-transport-surdimensionnes div.colonne {
    width: 50%;
    margin-top: 4vw; }
    section#ponceaux-transport-surdimensionnes div.colonne h3 {
      margin: 0; }
    section#ponceaux-transport-surdimensionnes div.colonne button {
      margin-top: 1em; }
  section#ponceaux-transport-surdimensionnes div.image-absolute {
    position: absolute;
    width: 50vw;
    bottom: 0vw;
    right: 0;
    opacity: 0; }
    section#ponceaux-transport-surdimensionnes div.image-absolute img {
      width: 100%; }

section#quincaillerie-entete {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  display: flex;
  min-height: 62vw; }
  section#quincaillerie-entete div.entete {
    margin-top: 15vw; }
    section#quincaillerie-entete div.entete h1 {
      margin: 0; }
      section#quincaillerie-entete div.entete h1 strong {
        opacity: 0; }
    section#quincaillerie-entete div.entete p, section#quincaillerie-entete div.entete div#formulaire label, div#formulaire section#quincaillerie-entete div.entete label, section#quincaillerie-entete div.entete div#formulaire input, div#formulaire section#quincaillerie-entete div.entete input, section#quincaillerie-entete div.entete div#formulaire textarea, div#formulaire section#quincaillerie-entete div.entete textarea, section#quincaillerie-entete div.entete section#entete-poste h4, section#entete-poste section#quincaillerie-entete div.entete h4 {
      max-width: 25vw; }
  section#quincaillerie-entete div.image-absolute {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    opacity: 0;
    animation-delay: .2s; }
    section#quincaillerie-entete div.image-absolute img {
      width: 100%; }

section#quincaillerie-des-outils-de-qualites {
  position: relative;
  margin-top: -4vw; }
  section#quincaillerie-des-outils-de-qualites div.colonne {
    opacity: 0; }
  section#quincaillerie-des-outils-de-qualites div.colonne:first-of-type {
    width: 50%;
    position: relative;
    top: 0vw;
    min-height: 20vw;
    background-size: cover; }
  section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type {
    width: 50%;
    position: relative;
    animation-delay: .5s; }
    section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg {
      padding: 6vw 3vw 6vw 7.5vw;
      background-color: #000;
      width: calc( 100% + 7.5vw );
      top: 4vw;
      left: -7.5vw;
      height: 100%;
      position: relative; }
      section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg h2 {
        margin: 0; }

section#quincaillerie-produits {
  background-color: #fff;
  padding-top: 4vw; }
  section#quincaillerie-produits div.ranger div.colonne {
    width: 25%;
    padding: 2%;
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
    section#quincaillerie-produits div.ranger div.colonne img {
      width: 65%;
      height: auto;
      display: block;
      margin: 0 auto; }
    section#quincaillerie-produits div.ranger div.colonne h4 {
      color: #000;
      text-align: center;
      margin: 0.9vw 0; }
    section#quincaillerie-produits div.ranger div.colonne button {
      display: block;
      margin: 0 auto;
      width: 100%; }

div#carousel-marque {
  background-color: #E30414;
  padding: 6.6vw 60px; 
  margin: 0 30px;
}
  div#carousel-marque h3 {
    text-align: center;
    margin: 0;
    margin-bottom: 2vw; }
  div#carousel-marque div.slide-marque img {
    /* height: 4vw; */
    width: 100%;
    display: block;
    margin: 0 auto; 
  }
  div#carousel-marque .slick-prev::before, div#carousel-marque .slick-next::before {
    content: '';
    width: 20px;
    height: 34px;
    background-image: url("images/fleche.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 3;
    transform: translate(-50%, -50%); }
  div#carousel-marque .slick-next::before {
    transform: rotate(180deg) translate(0%, 100%); }

section#quincaillerie-conseil {
  padding-top: 5.6vw; }
  section#quincaillerie-conseil div.ranger div.colonne:first-of-type {
    width: 50%;
    padding-left: 7.5vw; }
    section#quincaillerie-conseil div.ranger div.colonne:first-of-type p, section#quincaillerie-conseil div.ranger div.colonne:first-of-type div#formulaire label, div#formulaire section#quincaillerie-conseil div.ranger div.colonne:first-of-type label, section#quincaillerie-conseil div.ranger div.colonne:first-of-type div#formulaire input, div#formulaire section#quincaillerie-conseil div.ranger div.colonne:first-of-type input, section#quincaillerie-conseil div.ranger div.colonne:first-of-type div#formulaire textarea, div#formulaire section#quincaillerie-conseil div.ranger div.colonne:first-of-type textarea, section#quincaillerie-conseil div.ranger div.colonne:first-of-type section#entete-poste h4, section#entete-poste section#quincaillerie-conseil div.ranger div.colonne:first-of-type h4 {
      max-width: 65%; }
    section#quincaillerie-conseil div.ranger div.colonne:first-of-type h3 {
      margin: 0; }
    section#quincaillerie-conseil div.ranger div.colonne:first-of-type button {
      margin-top: 2em; }
  section#quincaillerie-conseil div.ranger div.colonne:last-of-type {
    width: 50%;
    position: relative; }
    section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img {
      position: relative;
      width: 100%; }
      section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img img {
        width: 100%; }
    section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img-absolute {
      opacity: 0;
      position: absolute;
      bottom: -12vw;
      left: -7vw;
      width: 30vw;
      transform: translate(-50%, 0%); }
      section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img-absolute img {
        width: 100%; }

section#quincaillerie-en-chiffre {
  padding-top: 12vw;
  position: relative; }
  section#quincaillerie-en-chiffre div.container h2 {
    text-align: center;
    margin-bottom: .5em; }
  section#quincaillerie-en-chiffre div.container div.ranger {
    margin-top: 1vw;
    justify-content: space-between; }
    section#quincaillerie-en-chiffre div.container div.ranger div.colonne {
      width: calc(33.3333% - 1vw);
      text-align: center; }
      section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.img img {
        width: 100%; }
      section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.icon {
        position: absolute;
        top: 48%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 6vw;
        height: 6vw; }
        section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.icon img {
          height: 100%;
          width: auto; }
      section#quincaillerie-en-chiffre div.container div.ranger div.colonne hr {
        border-top: 1px solid #fff;
        max-width: 82%;
        display: block;
        margin: 0 auto; }
      section#quincaillerie-en-chiffre div.container div.ranger div.colonne h5 {
        color: #E30414;
        margin-bottom: 0.5em;
        margin-top: 1em; }
      section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg {
        background-color: #000;
        position: relative;
        padding-bottom: 1px; }

section#quincaillerie-slogan {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 60vw;
  margin-top: -10vw;
  overflow: hidden; }
  section#quincaillerie-slogan h2 {
    text-align: center;
    padding-top: 30vw; }
    section#quincaillerie-slogan h2 strong {
      opacity: 0; }

section#entreprise-entete {
  overflow: hidden;
  position: relative;
  height: 55vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; 
}
section#entreprise-entete div.absolute_texte {
  position: absolute;
  top: 15vw;
  left: 100%;
  transform: translate(0%, -50%);
  transition: all 1.5s ease; 
  }
  section#entreprise-entete div.absolute_texte.active {
    left: 5% !important; 
  }
  section#entreprise-entete div.absolute_texte h1 {
    white-space: nowrap; 
    line-height: 0.9;
    font-size: 9vw;
  }
  section#entreprise-entete div.container {
    position: relative;
    height: inherit; }
    section#entreprise-entete div.container div.texte {
      width: 32vw;
      position: absolute;
      bottom: 0;
      right: 7.5vw;
      padding: 4%;
      background-color: #E30414;
      opacity: 0; 
      z-index: 3;
    }
      section#entreprise-entete div.container div.texte h4 {
        margin: 0; 
      }
    section#entreprise-entete div.image-absolute {
      width: 60vw;
      bottom: 8vw;
      z-index: 1;
      left: 5%;
      position: absolute; 
    }
    section#entreprise-entete div.image-absolute img {
      width: 100%; }

section#entreprise-histoire {
  background-color: #000;
  padding-top: 1px;
  padding-bottom: 3vw; }
  section#entreprise-histoire h2 {
    text-align: center;
    margin-bottom: 0; }
  section#entreprise-histoire ol, section#entreprise-histoire ul {
    list-style: none;
    padding: 0; }
  section#entreprise-histoire section {
    margin-top: 1vw; }
  section#entreprise-histoire section.cd-horizontal-timeline .timeline {
    margin-bottom: 10px; }
  section#entreprise-histoire div.ranger {
    width: 65vw;
    display: flex;
    margin: 0 auto; }
    section#entreprise-histoire div.ranger div.colonne {
      display: flex;
      flex-direction: column;
      justify-content: center;
      position: relative;
      width: 50%;
      z-index: 1; }
      section#entreprise-histoire div.ranger div.colonne h3 {
        margin: 0;
        padding-top: 31%;
        z-index: 3; }
      section#entreprise-histoire div.ranger div.colonne p, section#entreprise-histoire div.ranger div.colonne div#formulaire label, div#formulaire section#entreprise-histoire div.ranger div.colonne label, section#entreprise-histoire div.ranger div.colonne div#formulaire input, div#formulaire section#entreprise-histoire div.ranger div.colonne input, section#entreprise-histoire div.ranger div.colonne div#formulaire textarea, div#formulaire section#entreprise-histoire div.ranger div.colonne textarea, section#entreprise-histoire div.ranger div.colonne section#entete-poste h4, section#entete-poste section#entreprise-histoire div.ranger div.colonne h4 {
        z-index: 3; }
      section#entreprise-histoire div.ranger div.colonne span.absolute {
        color: #E30414;
        position: absolute;
        transform: translateY(-50%);
        top: 32%;
        left: -7.7vw; }
      section#entreprise-histoire div.ranger div.colonne:last-of-type {
        padding-left: 1vw;
        z-index: 2; }
      section#entreprise-histoire div.ranger div.colonne img {
        width: 100%; }

section#entreprise-familiale {
  position: relative;
  margin-top: -4vw;
  background-size: contain;
  background-position: right;
  background-repeat: no-repeat;
  min-height: 40vw;
  overflow: hidden; }
  section#entreprise-familiale div.texte {
    padding-top: 8vw; }
    section#entreprise-familiale div.texte h2 strong {
      opacity: 0; }

section#nos-services-accueil.entreprise {
  padding-top: 7vw; }
  section#nos-services-accueil.entreprise div.colonne:first-of-type {
    width: 45%;
    padding-left: 7.5vw;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: 5vw; }

section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger div.tuile:hover:after, section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger div.tuile.active:after {
  bottom: 0.5vw; }

section#entreprise-specialiste {
  padding-bottom: 4vw;
  position: relative;
  width: 100vw; }
  section#entreprise-specialiste div.absolute-img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 65vw; }
    section#entreprise-specialiste div.absolute-img img {
      width: 100%; }
  section#entreprise-specialiste div.bg {
    background-color: #000;
    min-height: 45vw; }
    section#entreprise-specialiste div.bg div.ranger {
      flex-direction: row-reverse; }
    section#entreprise-specialiste div.bg div.colonne {
      width: calc( 50% + 7.5vw );
      padding-left: 2vw;
      background-color: #000;
      padding: 6vw 8vw 8vw;
      position: relative;
      z-index: 2;
      opacity: 0; }
      section#entreprise-specialiste div.bg div.colonne h3 {
        margin: 0; }

section#entreprise-clientele {
  padding-top: 1vw; }
  section#entreprise-clientele div.ranger div.colonne:first-of-type {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 40%; }
    section#entreprise-clientele div.ranger div.colonne:first-of-type h3 {
      margin: 0; }
    section#entreprise-clientele div.ranger div.colonne:first-of-type div {
      position: relative;
      z-index: 2; }
  section#entreprise-clientele div.ranger div.colonne:last-of-type {
    width: 60%; }
    section#entreprise-clientele div.ranger div.colonne:last-of-type img {
      position: relative;
      z-index: 1;
      width: calc(100% + 9.5vw);
      left: -9.5vw; }

section#entreprise-projets {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 56vw; }
  section#entreprise-projets h2 {
    text-align: center; }
    section#entreprise-projets h2 strong {
      opacity: 0; }

section#entreprise-superieur {
  padding-bottom: 4vw; }
  section#entreprise-superieur h2 {
    text-align: center;
    margin-top: -7vw;
    margin-bottom: .4em; }
  section#entreprise-superieur div.ranger {
    width: calc( 100% + 1vw );
    margin-left: -.5vw;
    margin-right: -.5vw;
    height: 31vw; }
    section#entreprise-superieur div.ranger div.colonne:first-of-type {
      width: 29%;
      padding-right: 0; }
      section#entreprise-superieur div.ranger div.colonne:first-of-type div.bg {
        opacity: 0;
        transition: all .5s ease;
        transition-delay: 1s;
        height: 100%; }
        section#entreprise-superieur div.ranger div.colonne:first-of-type div.bg.active {
          opacity: 1; }
    section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:last-of-type div.bg {
      transition-delay: .25s; }
    section#entreprise-superieur div.ranger div.colonne:last-of-type {
      width: 29%;
      padding-left: 0; }
      section#entreprise-superieur div.ranger div.colonne:last-of-type div.bg {
        opacity: 0;
        transition: all .5s ease;
        transition-delay: .75s;
        height: calc( 100% - 1vw); }
        section#entreprise-superieur div.ranger div.colonne:last-of-type div.bg.active {
          opacity: 1; }
    section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:last-of-type div.bg {
      transition-delay: 1.25s; }
    section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) {
      width: 42%; }
      section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) div.bg {
        background-size: 100% auto;
        background-position: bottom center;
        bottom: 0;
        left: 0;
        background-repeat: no-repeat;
        height: 100%;
        transition: all .5s ease;
        opacity: 0; }
        section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) div.bg.active {
          opacity: 1; }
      section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) div.noir {
        background-color: #000;
        padding: 2vw;
        text-align: center; }
    section#entreprise-superieur div.ranger div.col {
      background-size: cover;
      background-position: center; }
      section#entreprise-superieur div.ranger div.col h4 {
        margin: 0; }
      section#entreprise-superieur div.ranger div.col div.bg {
        padding: 2vw; }
      section#entreprise-superieur div.ranger div.col div.bg.right {
        width: calc( 100% + 0vw );
        padding-right: 2vw;
        left: 0;
        top: 0;
        position: relative; }
    section#entreprise-superieur div.ranger div.col, section#entreprise-superieur div.ranger div.colonne {
      padding: 0;
      margin-bottom: 1vw; }
      section#entreprise-superieur div.ranger div.col:last-of-type, section#entreprise-superieur div.ranger div.colonne:last-of-type {
        margin-bottom: 0; }
    section#entreprise-superieur div.ranger div.bg {
      background-size: cover;
      background-position: center;
      text-align: left;
      background-color: #000; }
      section#entreprise-superieur div.ranger div.bg h4 {
        margin: 0; }
    section#entreprise-superieur div.ranger div.colonne:last-of-type {
      height: 100%;
      position: relative; }
      section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(1) {
        height: calc( 50% - 1vw);
        top: 0;
        position: absolute;
        width: calc(100% - 1vw);
        right: 0; }
      section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(2) {
        height: 50%;
        width: calc(100% - 1vw);
        bottom: 0;
        position: absolute;
        right: 0; }
      section#entreprise-superieur div.ranger div.colonne:last-of-type div.bg {
        height: 100%; }
    section#entreprise-superieur div.ranger div.colonne:first-of-type {
      height: 100%;
      position: relative; }
      section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(1) {
        height: calc( 50% - 1vw);
        top: 0;
        position: absolute;
        width: calc(100% - 1vw); }
      section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(2) {
        height: 50%;
        width: calc(100% - 1vw);
        bottom: 0;
        position: absolute; }
      section#entreprise-superieur div.ranger div.colonne:first-of-type div.bg {
        height: 100%; }

section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger {
  margin-bottom: -.8vw; }

section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger div.tuile:hover img, section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger div.tuile.active img {
  top: -2.8vw; }

section#contact-map {
  position: relative; }
  section#contact-map h1, section#contact-map h2 {
    margin: 0; }
  section#contact-map p.fleft, section#contact-map div#formulaire label.fleft, div#formulaire section#contact-map label.fleft, section#contact-map div#formulaire input.fleft, div#formulaire section#contact-map input.fleft, section#contact-map div#formulaire textarea.fleft, div#formulaire section#contact-map textarea.fleft, section#contact-map section#entete-poste h4.fleft, section#entete-poste section#contact-map h4.fleft {
    float: left;
    line-height: 0;
    font-weight: 700;
    margin-top: 2em; }
  section#contact-map div.icon {
    float: left;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-color: #E30414;
    mask-repeat: no-repeat no-repeat;
    -webkit-mask-repeat: no-repeat, no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    transition: all .5s ease;
    position: relative;
    top: 1vw;
    left: 31px; }
  section#contact-map div.icon:hover {
    background-color: #fff; }
  section#contact-map div.coordonnees {
    background-color: #000;
    width: 32vw;
    left: 7.5vw;
    position: absolute;
    z-index: 2;
    padding: 3vw;
    padding-top: 6vw; }
  section#contact-map div.map {
    width: 100%;
    z-index: 1;
    position: relative; }
    section#contact-map div.map p, section#contact-map div.map div#formulaire label, div#formulaire section#contact-map div.map label, section#contact-map div.map div#formulaire input, div#formulaire section#contact-map div.map input, section#contact-map div.map div#formulaire textarea, div#formulaire section#contact-map div.map textarea, section#contact-map div.map section#entete-poste h4, section#entete-poste section#contact-map div.map h4, section#contact-map div.map a {
      color: #000; }
  section#contact-map ul {
    padding-left: 3vw; }
    section#contact-map ul li {
      line-height: 1.7;
      padding-top: 1.5em;
      padding-bottom: 1.5em;
      position: relative;
      list-style: none; }
      section#contact-map ul li:after {
        content: '';
        position: absolute;
        left: -3vw;
        top: 50%;
        transform: translateY(-50%);
        width: 2vw;
        height: 2vw;
        background-size: contain;
        background-repeat: no-repeat; }
      section#contact-map ul li:nth-of-type(1):after {
        background-image: url("images/icon-location.svg"); }
      section#contact-map ul li:nth-of-type(2):after {
        background-image: url("images/icon-phone-2.svg"); }
      section#contact-map ul li:nth-of-type(3):after {
        background-image: url("images/icon-email-1.svg"); }
  section#contact-map hr {
    margin-bottom: 2vw; }
  section#contact-map div.col:first-of-type {
    width: 30%; }
  section#contact-map div.col:last-of-type {
    width: 70%; }
  section#contact-map div.ranger p, section#contact-map div.ranger div#formulaire label, div#formulaire section#contact-map div.ranger label, section#contact-map div.ranger div#formulaire input, div#formulaire section#contact-map div.ranger input, section#contact-map div.ranger div#formulaire textarea, div#formulaire section#contact-map div.ranger textarea, section#contact-map div.ranger section#entete-poste h4, section#entete-poste section#contact-map div.ranger h4 {
    margin: 0.5em 0; }
  section#contact-map div#wpgmza_map_1 {
    height: 44vw !important; }

section#contact-form {
  padding-top: 17vw;
  width: 100%;
  overflow: hidden;
  position: relative; }
  section#contact-form div.ranger div.colonne:first-of-type {
    width: 40%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 7.5vw; }
    section#contact-form div.ranger div.colonne:first-of-type h3 {
      margin: 0;
      white-space: nowrap;
      font-weight: 400; }
      section#contact-form div.ranger div.colonne:first-of-type h3 strong {
        color: #E30414;
        font-weight: 900; }
    section#contact-form div.ranger div.colonne:first-of-type button {
      margin-top: 1em; }
  section#contact-form div.ranger div.colonne:last-of-type {
    width: 60%;
    padding: 0 7.5vw 2vw; }
    section#contact-form div.ranger div.colonne:last-of-type h2 {
      margin-top: -1.3em;
      margin-bottom: .55em; }

div#formulaire {
  /*   champs select */
  /* The container must be positioned relative: */
  /* Style the arrow inside the select element: */
  /* Point the arrow upwards when the select box is open (active): */
  /* style the items (options), including the selected item: */
  /* Style items (options): */
  /* Hide the items when the select box is closed: */
  /* end champs select */ }
  div#formulaire label {
    font-family: 'open-sans', sans-serif;
    color: #fff;
    font-weight: 700;
    margin-bottom: 0.6em; }
  div#formulaire input, div#formulaire textarea {
    background-color: #000;
    height: 3vw;
    border-radius: 0;
    border: none;
    padding: 20px; }
  div#formulaire textarea {
    height: 393px; }
  div#formulaire ::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #4D4F57;
    opacity: 1;
    /* Firefox */ }
  div#formulaire :-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #4D4F57; }
  div#formulaire ::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #4D4F57; }
  div#formulaire .frm_submit button, div#formulaire button#televerser {
    padding: 10px 35px;
    font-family: 'montserrat', sans-serif;
    font-weight: 500;
    background: transparent;
    outline: none !important;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
    display: inline-block;
    color: #E30414;
    border: 2px solid #E30414;
    z-index: 1;
    text-transform: uppercase;
    font-size: .9vw;
    border-radius: 0;
    float: right;
    min-width: 315px;
    box-shadow: none;
    margin-top: 0; }
    div#formulaire .frm_submit button:hover, div#formulaire button#televerser:hover {
      color: #fff; }
  div#formulaire .frm_upload_text button:after {
    content: none; }
  div#formulaire .custom-select {
    position: relative;
    font-family: 'Open Sans', sans-serif;
    color: #4D4F57;
    margin-bottom: 0; }
  div#formulaire .custom-select select {
    display: none;
    /*hide original SELECT element: */ }
  div#formulaire .select-selected::after {
    position: absolute;
    content: "";
    transform: translateY(-50%);
    top: 50%;
    right: 21px;
    width: 20px;
    height: 20px;
    background-image: url("images/fleche-blanche.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center; }
  div#formulaire .select-selected.select-arrow-active:after {
    transform: translateY(-50%) rotate(180deg); }
  div#formulaire .white .select-selected:before {
    background-color: #fff; }
  div#formulaire .white .select-items {
    border-color: #fff; }
  div#formulaire .select-items div, div#formulaire .select-selected {
    padding: 5px 15px;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    font-size: .8vw;
    font-weight: 400; }
  div#formulaire .select-selected {
    padding: 0.85vw 20px;
    background-color: #000; }
  div#formulaire .blue .select-selected {
    background-color: #429DDD; }
  div#formulaire .select-items {
    position: absolute;
    background-color: #000;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    padding: 0px 6px; }
  div#formulaire .blue .select-items {
    background-color: #429DDD; }
  div#formulaire .select-hide {
    display: none; }
  div#formulaire .select-items div:hover, div#formulaire .same-as-selected {
    color: #fff; }
  div#formulaire .blue .select-items div:hover, div#formulaire .blue .same-as-selected {
    color: #fff; }
  div#formulaire .select-items div {
    color: #fff; }
  div#formulaire .frm_dropzone.dz-clickable .dz-message, div#formulaire .frm_dropzone.dz-clickable .dz-message * {
    clear: both;
    color: #fff; }
  div#formulaire .frm_dropzone.frm_single_upload {
    max-width: 100%; }
  div#formulaire .frm_dropzone .dz-message, div#formulaire .with_frm_style .frm_dropzone {
    background-color: #000 !important; }
  div#formulaire .frm_style_style-formidable.with_frm_style .frm_icon_font:before {
    color: #fff; }
  div#formulaire #frm_field_28_container,
  div#formulaire #frm_field_66_container {
    display: none; }

section#demande-de-prix-form div.container-form {
  padding: 110px 17vw 0;
  width: 100%; }
  section#demande-de-prix-form div.container-form h1 {
    text-align: center;
    margin: 0;
    margin-bottom: .2em; }
  section#demande-de-prix-form div.container-form .frm_form_field.frm_hidden_container.frm_repeat_buttons.frm {
    float: left;
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translate(100%, -50%); }
    section#demande-de-prix-form div.container-form .frm_form_field.frm_hidden_container.frm_repeat_buttons.frm a {
      background-color: transparent;
      border: none;
      font-size: 0.7vw; }
  section#demande-de-prix-form div.container-form .frm_remove_form_row {
    display: none; }
section#demande-de-prix-form div.bleu {
  background-color: #E30414;
  padding: 20px;
  margin-bottom: 50px;
  margin-top: 50px; }
section#demande-de-prix-form .frm_style_style-formidable.with_frm_style .frm-show-form .frm_section_heading h3 {
  border-top: none;
  text-transform: uppercase; }
section#demande-de-prix-form .with_frm_style .frm_repeat_sec {
  border-bottom: none; }

section#map.demande-de-prix {
  margin-top: 6vw; }

section#cueillette-livraison.demande-de-prix {
  padding-bottom: 4vw; }

section#page-404 {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 30vw;
  display: flex;
  flex-direction: column;
  justify-content: center; }
  section#page-404 span.absolute {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    font-size: 17vw;
    line-height: 1.1; }
  section#page-404 h1 {
    position: relative;
    z-index: 3;
    margin: 0;
    margin-top: 2vw; }
  section#page-404 p, section#page-404 div#formulaire label, div#formulaire section#page-404 label, section#page-404 div#formulaire input, div#formulaire section#page-404 input, section#page-404 div#formulaire textarea, div#formulaire section#page-404 textarea, section#page-404 section#entete-poste h4, section#entete-poste section#page-404 h4, section#page-404 button {
    margin-left: 7.5vw;
    position: relative;
    z-index: 3; }

section#entete-poste {
  position: relative; }
  section#entete-poste h1 {
    margin: 0; }
  section#entete-poste h4 {
    font-weight: 700;
    margin-top: 3em; }
  section#entete-poste div.colonne:first-of-type {
    width: 40%; }
    section#entete-poste div.colonne:first-of-type div.bg {
      background-color: #000;
      padding: 3vw;
      padding-top: 8vw; }
      section#entete-poste div.colonne:first-of-type div.bg h4 {
        margin-bottom: 0;
        margin-top: 5em; }
      section#entete-poste div.colonne:first-of-type div.bg button {
        margin-top: 2em; }
  section#entete-poste div.colonne:last-of-type {
    width: 60%;
    padding-left: 7.5vw;
    padding-top: 12vw; }

section#poste-form {
  padding-top: 12vw; }
  section#poste-form div.colonne:first-of-type {
    width: calc( 40% );
    position: relative;
    background-size: cover;
    background-position: center; }
  section#poste-form div.colonne:last-of-type {
    background-size: cover;
    background-position: center;
    width: calc( 60% );
    padding-left: 9vw;
    padding-right: 7.5vw;
    padding-bottom: 1vw; }
    section#poste-form div.colonne:last-of-type h2 {
      position: relative;
      top: -7vw;
      margin: 0;
      margin-bottom: -4vw; }

section#poste-slogan {
  min-height: 41vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden; }
  section#poste-slogan h2 {
    text-align: center; }
    section#poste-slogan h2 strong {
      opacity: 0; }

section#carriere-entete {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  min-height: 53vw; }
  section#carriere-entete h1 {
    margin: 0;
    padding-top: 9vw;
    position: relative;
    z-index: 2; }
    section#carriere-entete h1 strong {
      opacity: 0; }
  section#carriere-entete div.absolute-img {
    position: absolute;
    right: 0;
    bottom: 19%;
    z-index: 1;
    width: 54vw; }
    section#carriere-entete div.absolute-img img {
      width: 100%; }

section#nos-services-accueil.carriere {
  margin-top: -5vw;
  padding-top: 0;
  position: relative; }
  section#nos-services-accueil.carriere div.colonne:last-of-type {
    width: 54.4%; }
    section#nos-services-accueil.carriere div.colonne:last-of-type h2 {
      margin-bottom: 7vw; }
  section#nos-services-accueil.carriere div.colonne:first-of-type {
    width: 45.6%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: 5vw;
    padding-left: 3.5vw; }
    section#nos-services-accueil.carriere div.colonne:first-of-type div.conteneur-puce {
      left: 3.5vw; }
  section#nos-services-accueil.carriere div.colonne:last-of-type {
    padding-right: 3.5vw; }
    section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile.active img, section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile:hover img {
      top: -1.2vw; }

section#carriere-humain div.ranger div.colonne:first-of-type {
  width: 50%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }
section#carriere-humain div.ranger div.colonne:last-of-type {
  width: 50%;
  animation-delay: .5s; }
  section#carriere-humain div.ranger div.colonne:last-of-type div.bg {
    background-color: #000;
    position: relative;
    width: calc(100% + 7.5vw);
    margin-left: -7.5vw;
    padding: 3vw 7.5vw;
    top: 2.5vw; }
    section#carriere-humain div.ranger div.colonne:last-of-type div.bg h2 {
      margin: 0; }
section#carriere-humain div.ranger div.colonne {
  opacity: 0; }

section#carriere-postulez {
  margin-top: 8vw; }
  section#carriere-postulez div.container h2 {
    text-align: center; }
  section#carriere-postulez div.container div.post {
    background-color: #000;
    margin-bottom: 1vw;
    padding: 3vw; }
    section#carriere-postulez div.container div.post h3 {
      margin-top: 0; }
    section#carriere-postulez div.container div.post hr {
      border-top: 1px solid #fff; }
    section#carriere-postulez div.container div.post div.colonne:first-of-type {
      width: 50%; }
    section#carriere-postulez div.container div.post div.colonne:last-of-type {
      width: 50%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding-left: 7.5vw; }
      section#carriere-postulez div.container div.post div.colonne:last-of-type div {
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        section#carriere-postulez div.container div.post div.colonne:last-of-type div a {
          flex: auto;
          width: 50%; }
          section#carriere-postulez div.container div.post div.colonne:last-of-type div a button {
            width: 100%; }
          section#carriere-postulez div.container div.post div.colonne:last-of-type div a:first-of-type {
            margin-right: .5vw; }
          section#carriere-postulez div.container div.post div.colonne:last-of-type div a:last-of-type {
            margin-left: .5vw; }

section#poste-form.carriere div.colonne:last-of-type h2 {
  position: relative;
  top: -3vw;
  margin: 0;
  margin-bottom: -1vw; }

section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile {
  padding-bottom: 10vw; }

section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile.active img, section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile:hover img {
  top: -2.1vw; }

#bouton-mobile {
  cursor: pointer;
  margin: 0 auto;
  padding-left: 0;
  position: relative;
  width: 45px;
  height: 35px; }

.menu-global {
  backface-visibility: hidden;
  position: absolute;
  left: 0;
  border-top: 5px solid white;
  width: 100%;
  transition: 0.55s; }

.menu-top {
  top: 0; }

.menu-middle {
  top: 15px; }

.menu-bottom {
  top: 30px; }

.menu-top-click {
  backface-visibility: hidden;
  top: 15px;
  transform: rotate(50deg);
  transition: 0.55s 0.5s; }

.menu-middle-click {
  opacity: 0; }

.menu-bottom-click {
  backface-visibility: hidden;
  top: 15px;
  transform: rotate(-410deg);
  transition: 0.55s 0.5s; }

#bouton-mobile {
  float: right;
  margin-top: 0;
  position: relative;
  z-index: 11;
  transition: all .5s ease;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
  right: 30px; }

div#nav-mobile {
  display: block;
  width: 100%;
  position: absolute;
  background-color: #fff;
  z-index: 9999999999;
  right: -100%;
  transition: right .75s ease;
  top: 99px;
  overflow-y: auto;
  max-height: calc(100vh - 99px);
  transform: translateX(100%);
  padding: 0 0px 0px; }
  div#nav-mobile.active {
    right: 0;
    transform: translateX(0%); }
  div#nav-mobile .sub-menu {
    margin-bottom: -7px;
    display: none;
    margin-top: 7px; }
  div#nav-mobile li {
    padding: 7px 0px;
    border-top: 1px solid #DAE1E3; }
    div#nav-mobile li:last-of-type {
      border-bottom: 1px solid #DAE1E3; }
    div#nav-mobile li a {
      color: #000;
      font-family: 'montserrat', sans-serif;
      font-weight: 700;
      text-transform: uppercase;
      padding: 0 30px;
      display: inline-block;
      width: calc( 100% - 60px ); }
    div#nav-mobile li.menu-item-has-children {
      position: relative;
      cursor: pointer; }
      div#nav-mobile li.menu-item-has-children > a {
        font-family: 'montserrat', sans-serif;
        color: #000;
        font-weight: 700;
        position: relative;
        margin-right: 60px; }
        div#nav-mobile li.menu-item-has-children > a:after {
          content: '';
          background-image: url("images/fleche-bleu.svg");
          transform: translateY(-50%) rotate(90deg);
          position: absolute;
          top: 50%;
          right: -30px;
          background-size: contain;
          background-position: center;
          width: 20px;
          height: 20px;
          background-repeat: no-repeat;
          cursor: pointer;
          display: block;
          z-index: -1; }
        div#nav-mobile li.menu-item-has-children > a.tog:after {
          transform: translateY(-50%) rotate(-90deg); }
      div#nav-mobile li.menu-item-has-children li {
        background-color: #E30414; }
        div#nav-mobile li.menu-item-has-children li a {
          font-family: 'open-sans', sans-serif;
          color: #fff;
          font-weight: 700;
          padding-left: 100px;
          transition: all .5s ease;
          text-transform: none; }
        div#nav-mobile li.menu-item-has-children li:hover {
          background-color: #fff; }
          div#nav-mobile li.menu-item-has-children li:hover a {
            color: #000; }
  div#nav-mobile.top {
    position: fixed;
    top: 71px; }
  div#nav-mobile div.barre {
    width: calc( 100% + 0px );
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 30px;
    padding-right: 30px;
    padding: 5px 0;
    background-color: #E30414;
    text-align: center;
    height: 47px;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    div#nav-mobile div.barre a p, div#nav-mobile div.barre a div#formulaire label, div#formulaire div#nav-mobile div.barre a label, div#nav-mobile div.barre a div#formulaire input, div#formulaire div#nav-mobile div.barre a input, div#nav-mobile div.barre a div#formulaire textarea, div#formulaire div#nav-mobile div.barre a textarea, div#nav-mobile div.barre a section#entete-poste h4, section#entete-poste div#nav-mobile div.barre a h4 {
      color: #fff;
      font-weight: 900;
      font-size: 16px;
      font-family: 'montserrat', sans-serif;
      text-transform: uppercase;
      margin: 0; }
  div#nav-mobile div.compte {
    width: calc( 100% + 0px );
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 30px;
    padding-right: 30px; }
    div#nav-mobile div.compte a p, div#nav-mobile div.compte a div#formulaire label, div#formulaire div#nav-mobile div.compte a label, div#nav-mobile div.compte a div#formulaire input, div#formulaire div#nav-mobile div.compte a input, div#nav-mobile div.compte a div#formulaire textarea, div#formulaire div#nav-mobile div.compte a textarea, div#nav-mobile div.compte a section#entete-poste h4, section#entete-poste div#nav-mobile div.compte a h4 {
      color: #E30414;
      font-size: 14px;
      font-family: 'open-sans', sans-serif;
      font-weight: 700; }
    div#nav-mobile div.compte p:first-of-type, div#nav-mobile div.compte div#formulaire label:first-of-type, div#formulaire div#nav-mobile div.compte label:first-of-type, div#nav-mobile div.compte div#formulaire input:first-of-type, div#formulaire div#nav-mobile div.compte input:first-of-type, div#nav-mobile div.compte div#formulaire textarea:first-of-type, div#formulaire div#nav-mobile div.compte textarea:first-of-type, div#nav-mobile div.compte section#entete-poste h4:first-of-type, section#entete-poste div#nav-mobile div.compte h4:first-of-type {
      margin: 0;
      margin-top: 17px; }
    div#nav-mobile div.compte nav.lang li {
      border-top: none; }
      div#nav-mobile div.compte nav.lang li a {
        padding-left: 0;
        color: #E30414;
        font-size: 14px;
        font-family: 'open-sans', sans-serif;
        font-weight: 700; }
    div#nav-mobile div.compte li {
      border-bottom: none; }
  div#nav-mobile div.phone li, div#nav-mobile div.phone a {
    font-size: 17px;
    font-weight: 700;
    color: #E30414;
    line-height: 1.3; }
  div#nav-mobile div.phone a {
    padding-left: 0; }
  div#nav-mobile div.phone li {
    padding-left: 90px;
    position: relative;
    list-style: none;
    border-top: none;
    border-bottom: none;
    padding-bottom: 20px; }
    div#nav-mobile div.phone li:after {
      content: '';
      position: absolute;
      left: 30px;
      width: 40px;
      height: 40px;
      background-image: url("images/icon-phone.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      top: 50%;
      transform: translateY(-50%); }

img.mobile-entreprise-familiale {
  display: none; }

@media screen and (max-width: 1920px) {
  header div#nav div.colonne:nth-child(2) nav ul.menu > li > a {
    font-size: 15px; }

  .px_110, section#landing div.entete h1, section#accueil-entete div.entete h1, section#selection-produit-accueil div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:last-of-type h2, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2, section#nos-experts-accueil-mobile div.full h2, section#piece div.container h1, section#service-conseil h2, section#distribution-entete div.entete h1, section#distribution-entreposage h2, section#map h2, section#distribution-secteurs-activites div.contenu h2, section#distribution-grand-distributeur div.texte h2, section#autres-produits-entete div.colonne div.texte h1, section#autres-produits-livraison h2, section#autres-produits-slogan h2, section#ponceaux-entete div.texte h1, section#ponceaux-selection h2, section#drains-selection h2, section#ponceaux-selection-mobile h2, section#drains-selection-mobile h2, section#ponceaux-transport-surdimensionnes h2, section#quincaillerie-entete div.entete h1, section#quincaillerie-en-chiffre div.container h2, section#quincaillerie-slogan h2, section#entreprise-histoire h2, section#entreprise-familiale div.texte h2, section#entreprise-projets h2, section#entreprise-superieur h2, section#contact-form div.ranger div.colonne:first-of-type h3 strong, section#contact-form div.ranger div.colonne:last-of-type h2, section#demande-de-prix-form div.container-form h1, section#poste-slogan h2, section#carriere-entete h1, section#carriere-postulez div.container h2 {
    font-size: 3.5vw; }


  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col img {
    max-width: 75%; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col:nth-child(2) img {
    max-width: 35%; }

  section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte h2 {
    margin-bottom: 0.5em; }

  .px_16_footer, footer div.ranger div.colonne h4, footer div.ranger div.colonne p, footer div.ranger div.colonne div#formulaire label, div#formulaire footer div.ranger div.colonne label, footer div.ranger div.colonne div#formulaire input, div#formulaire footer div.ranger div.colonne input, footer div.ranger div.colonne div#formulaire textarea, div#formulaire footer div.ranger div.colonne textarea, footer div.ranger div.colonne section#entete-poste h4, section#entete-poste footer div.ranger div.colonne h4 {
    font-size: 0.8vw;
    line-height: 1.8; }

  footer div.ranger div.colonne li {
    font-size: 13px !important;
    line-height: 2.5; }

  section#distribution-entete div.entete p, section#distribution-entete div.entete div#formulaire label, div#formulaire section#distribution-entete div.entete label, section#distribution-entete div.entete div#formulaire input, div#formulaire section#distribution-entete div.entete input, section#distribution-entete div.entete div#formulaire textarea, div#formulaire section#distribution-entete div.entete textarea, section#distribution-entete div.entete section#entete-poste h4, section#entete-poste section#distribution-entete div.entete h4 {
    margin-top: 1em; }

  section#quincaillerie-entete div.entete p, section#quincaillerie-entete div.entete div#formulaire label, div#formulaire section#quincaillerie-entete div.entete label, section#quincaillerie-entete div.entete div#formulaire input, div#formulaire section#quincaillerie-entete div.entete input, section#quincaillerie-entete div.entete div#formulaire textarea, div#formulaire section#quincaillerie-entete div.entete textarea, section#quincaillerie-entete div.entete section#entete-poste h4, section#entete-poste section#quincaillerie-entete div.entete h4 {
    margin-top: 2em; }

  section#quincaillerie-produits div.ranger div.colonne img {
    width: 50%; } }
@media screen and (max-width: 1440px) {
  header div#nav div.colonne:nth-child(2) nav ul.menu > li > a {
    font-size: 1vw; }
  
section#armature-entete.coupe-dacier div.colonne div.col:last-of-type {
    padding: 1.6vw;
}
.page-id-441 section#armature-entete div.colonne h3 {
  margin-bottom: 5px;
}
.page-id-441 section#armature-entete div.colonne p{
  margin-top: 0;
}
section#accueil-entete div.entete .d-flex img {
  max-width:40px;
  margin-bottom:0;
}
  header div#nav div.colonne:nth-child(2) nav ul.menu ul.sub-menu li a {
    font-size: 14px; }

  p, div#formulaire label, div#formulaire input, div#formulaire textarea, section#entete-poste h4, div#formulaire label, div#formulaire input, div#formulaire textarea, section#entete-poste h4, li {
    font-size: 1.1vw; }

  .px_110, section#landing div.entete h1, section#accueil-entete div.entete h1, section#selection-produit-accueil div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:last-of-type h2, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2, section#nos-experts-accueil-mobile div.full h2, section#piece div.container h1, section#service-conseil h2, section#distribution-entete div.entete h1, section#distribution-entreposage h2, section#map h2, section#distribution-secteurs-activites div.contenu h2, section#distribution-grand-distributeur div.texte h2, section#autres-produits-entete div.colonne div.texte h1, section#autres-produits-livraison h2, section#autres-produits-slogan h2, section#ponceaux-entete div.texte h1, section#ponceaux-selection h2, section#drains-selection h2, section#ponceaux-selection-mobile h2, section#drains-selection-mobile h2, section#ponceaux-transport-surdimensionnes h2, section#quincaillerie-entete div.entete h1, section#quincaillerie-en-chiffre div.container h2, section#quincaillerie-slogan h2, section#entreprise-histoire h2, section#entreprise-familiale div.texte h2, section#entreprise-projets h2, section#entreprise-superieur h2, section#contact-form div.ranger div.colonne:first-of-type h3 strong, section#contact-form div.ranger div.colonne:last-of-type h2, section#demande-de-prix-form div.container-form h1, section#poste-slogan h2, section#carriere-entete h1, section#carriere-postulez div.container h2 {
    font-size: 4vw; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col img {
    max-width: 75%; }

  section#distribution-ouvert-au-public div.absolute {
    width: 29%;
    bottom: 0vw; }

  section#distribution-quincaillerie div.texte h3 {
    margin-bottom: 0.3em; }

  section#carousel p.pagination, section#carousel div#formulaire label.pagination, div#formulaire section#carousel label.pagination, section#carousel div#formulaire input.pagination, div#formulaire section#carousel input.pagination, section#carousel div#formulaire textarea.pagination, div#formulaire section#carousel textarea.pagination, section#carousel section#entete-poste h4.pagination, section#entete-poste section#carousel h4.pagination {
    padding-top: 15px; }

  div#formulaire .select-selected::after {
    width: 15px; }

  header div#nav div.colonne:nth-child(2) nav ul.menu > li {
    padding: 0 0.5vw; }

  section#entreprise-superieur div.ranger {
    height: 37vw; }

  section#map div.colonne div.bg {
    padding-bottom: 2em; }

  section#nos-services-accueil div.colonne:first-of-type {
    padding-bottom: 1em; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger {
    position: absolute;
    bottom: 0; }

  section#nos-services-accueil div.colonne:first-of-type p.pagination-slide, section#nos-services-accueil div.colonne:first-of-type div#formulaire label.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:first-of-type label.pagination-slide, section#nos-services-accueil div.colonne:first-of-type div#formulaire input.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:first-of-type input.pagination-slide, section#nos-services-accueil div.colonne:first-of-type div#formulaire textarea.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:first-of-type textarea.pagination-slide, section#nos-services-accueil div.colonne:first-of-type section#entete-poste h4.pagination-slide, section#entete-poste section#nos-services-accueil div.colonne:first-of-type h4.pagination-slide {
    width: 4vw;
    font-size: 2.5vw;
    height: 9vw;
    padding-top: 1.1vw; }

  section#nos-services-accueil div.colonne:first-of-type p.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type div#formulaire label.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:first-of-type label.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type div#formulaire input.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:first-of-type input.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type div#formulaire textarea.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:first-of-type textarea.pagination-slide a, section#nos-services-accueil div.colonne:first-of-type section#entete-poste h4.pagination-slide a, section#entete-poste section#nos-services-accueil div.colonne:first-of-type h4.pagination-slide a {
    padding: 0.6vw 1.5vw;
    height: 5.6vw; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger {
    width: calc(100% + 1vw);
    margin-left: -0.5vw;
    margin-right: -0.5vw;
    margin-bottom: -.5vw; }

  section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile.active img, section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile:hover img {
    top: -3vw; } }
@media screen and (max-width: 1024px) {
  div.container {
    padding: 0 30px; }

  .px_33, section#landing div.texte h2, section#carousel div.slide-carousel div.colonne:last-of-type div.texte h3, section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute h3, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile div.absolute h4, section#boutique-accueil div.ranger div.colonne div.bg h5, section#piece div.container h3, section#map div.colonne div.bg h3, section#cueillette-livraison div.contenu div.ranger div.colonne h3, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre h4, section#distribution-avantages div.ranger h4, section#distribution-ouvert-au-public div.texte h4, section#armature-entete div.colonne h3, section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type h3, section#transformation-entete div.ranger div.colonne h3, section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type h3, section#autres-produits-ponceaux div.background div.ranger div.colonne div.bg h3, section#slides-revetements div.ranger div.colonne:last-of-type h4, section#ponceaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#tuyaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#ponceaux-selection div.ranger div.colonne h4, section#drains-selection div.ranger div.colonne h4, section#ponceaux-selection div.ranger-content div.colonne h4, section#drains-selection div.ranger-content div.colonne h4, section#ponceaux-selection-mobile div.tab div.accordeon h4, section#drains-selection-mobile div.tab div.accordeon h4, section#ponceaux-selection-mobile div.tab div.ranger-content h4, section#drains-selection-mobile div.tab div.ranger-content h4, section#quincaillerie-produits div.ranger div.colonne h4, section#quincaillerie-en-chiffre div.container div.ranger div.colonne p, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire label, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne label, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire input, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne input, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire textarea, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne textarea, section#quincaillerie-en-chiffre div.container div.ranger div.colonne section#entete-poste h4, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne h4, section#entreprise-entete div.container div.texte h4, section#entreprise-superieur div.ranger div.col h4, section#entreprise-superieur div.ranger div.bg h4, section#contact-map h1, section#contact-map h2, section#demande-de-prix-form .frm_style_style-formidable.with_frm_style .frm-show-form .frm_section_heading h3, section#page-404 p, section#page-404 div#formulaire label, div#formulaire section#page-404 label, section#page-404 div#formulaire input, div#formulaire section#page-404 input, section#page-404 div#formulaire textarea, div#formulaire section#page-404 textarea, section#page-404 section#entete-poste h4, section#entete-poste section#page-404 h4, section#entete-poste h1, section#carriere-postulez div.container div.post h3 {
    font-size: 21px; }

    section#gallerie-realisations .texte h2,
  .px_84, section#carousel h2, section#nos-secteurs-activite div.colonne:first-of-type h2, section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte h2, section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:first-of-type h3, section#nos-services-accueil div.colonne:first-of-type div.div h4, section#boutique-accueil h3, section#piece div.container h2, section#piece div.container div.description-ranger div.colonne h2, section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte h3, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre span.popup, section#distribution-avantages div.ranger h3, section#distribution-ouvert-au-public div.texte h3, section#distribution-metaux-usages div.texte h3, section#distribution-metaux-usages-mobile div.texte h3, section#distribution-quincaillerie div.texte h3, section#armature-entete h2, section#armature-experts-conseils div.colonne div.bg h2, section#transformation-entete h2, section#autres-produits-ponceaux div.colonne div.texte h2, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type h2, section#autres-produits-livraison div.etiquette h3, section#autres-produits-revetement div.colonne h3, section#ponceaux-slide div.colonne:first-of-type h2, section#tuyaux-slide div.colonne:first-of-type h2, section#ponceaux-selection div.ranger-content div.colonne h3, section#drains-selection div.ranger-content div.colonne h3, section#ponceaux-selection-mobile div.tab div.ranger-content h3, section#drains-selection-mobile div.tab div.ranger-content h3, section#ponceaux-transport-surdimensionnes div.colonne h3, section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg h2, div#carousel-marque h3, section#quincaillerie-conseil div.ranger div.colonne:first-of-type h3, section#quincaillerie-en-chiffre div.container div.ranger div.colonne h5, section#entreprise-histoire div.ranger div.colonne h3, section#entreprise-specialiste div.bg div.colonne h3, section#entreprise-clientele div.ranger div.colonne:first-of-type h3, section#contact-form div.ranger div.colonne:first-of-type h3, section#poste-form div.colonne:last-of-type h2, section#carriere-humain div.ranger div.colonne:last-of-type div.bg h2 {
    font-size: 35px; }

  .px_110, section#landing div.entete h1, section#accueil-entete div.entete h1, section#selection-produit-accueil div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:last-of-type h2, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2, section#nos-experts-accueil-mobile div.full h2, section#piece div.container h1, section#service-conseil h2, section#distribution-entete div.entete h1, section#distribution-entreposage h2, section#map h2, section#distribution-secteurs-activites div.contenu h2, section#distribution-grand-distributeur div.texte h2, section#autres-produits-entete div.colonne div.texte h1, section#autres-produits-livraison h2, section#autres-produits-slogan h2, section#ponceaux-entete div.texte h1, section#ponceaux-selection h2, section#drains-selection h2, section#ponceaux-selection-mobile h2, section#drains-selection-mobile h2, section#ponceaux-transport-surdimensionnes h2, section#quincaillerie-entete div.entete h1, section#quincaillerie-en-chiffre div.container h2, section#quincaillerie-slogan h2, section#entreprise-histoire h2, section#entreprise-familiale div.texte h2, section#entreprise-projets h2, section#entreprise-superieur h2, section#contact-form div.ranger div.colonne:first-of-type h3 strong, section#contact-form div.ranger div.colonne:last-of-type h2, section#demande-de-prix-form div.container-form h1, section#poste-slogan h2, section#carriere-entete h1, section#carriere-postulez div.container h2 {
    font-size: 46px; }

  .px_141, section#landing div.entete h1 strong, section#accueil-entete div.entete h1 strong, section#selection-produit-accueil div.colonne:last-of-type h3 strong, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2 strong, section#nos-experts-accueil-mobile div.full h2 strong, section#piece div.container h1 strong, section#service-conseil h2 strong, section#distribution-entete div.entete h1 strong, section#distribution-entreposage h2 strong, section#distribution-grand-distributeur div.texte h2 strong, section#autres-produits-entete div.colonne div.texte h1 strong, section#autres-produits-livraison h2 strong, section#autres-produits-slogan h2 strong, section#ponceaux-entete div.texte h1 strong, section#quincaillerie-entete div.entete h1 strong, section#quincaillerie-slogan h2 strong, section#entreprise-familiale div.texte h2 strong, section#entreprise-projets h2 strong, section#page-404 h1, section#poste-slogan h2 strong, section#carriere-entete h1 strong {
    font-size: 59px; }

  .px_263, section#carousel div.slide-carousel div.relative div.absolute h3, section#distribution-quincaillerie div.absolute-titre span, section#armature-entete div.absolute_titre h1, section#transformation-entete div.absolute_titre h1, section#entreprise-entete div.absolute_texte h1, section#entreprise-histoire div.ranger div.colonne span.absolute, section#page-404 span.absolute {
    font-size: 97px; }

  .px_16_footer, footer div.ranger div.colonne h4, footer div.ranger div.colonne p, footer div.ranger div.colonne div#formulaire label, div#formulaire footer div.ranger div.colonne label, footer div.ranger div.colonne div#formulaire input, div#formulaire footer div.ranger div.colonne input, footer div.ranger div.colonne div#formulaire textarea, div#formulaire footer div.ranger div.colonne textarea, footer div.ranger div.colonne section#entete-poste h4, section#entete-poste footer div.ranger div.colonne h4 {
    font-size: 15px; }

  p, div#formulaire label, div#formulaire input, div#formulaire textarea, section#entete-poste h4 {
    font-size: 16px !important; }

  td {
    font-size: 16px !important; }

  th {
    font-size: 16px !important; }

  li {
    font-size: 16px !important; }

  section button:not(.taxo-button) {
    padding: 10px 25px;
    font-size: 17px; }

  section#accueil-entete {
    height: 90vh; }

  header div#nav div.colonne {
    width: 24%;
    height: 71px;
    position: relative; }

  header div#nav div.colonne:nth-child(2) {
    width: 76%;
    border-right: none;
    border-left: none;
    display: flex;
    flex-direction: row;
    justify-content: flex-end; }

  header div#nav.top div.colonne:nth-child(2) {
    border-left: none;
    border-right: none; }

  header div#nav {
    height: initial; }

  header div#top div.colonne {
    display: none; }

  header div#top div.colonne:nth-child(1) {
    width: 100%;
    display: flex;
    height: 28px;
    background-color: #E30414; }

  header div#top div.colonne:nth-child(1) p, header div#top div.colonne:nth-child(1) div#formulaire label, div#formulaire header div#top div.colonne:nth-child(1) label, header div#top div.colonne:nth-child(1) div#formulaire input, div#formulaire header div#top div.colonne:nth-child(1) input, header div#top div.colonne:nth-child(1) div#formulaire textarea, div#formulaire header div#top div.colonne:nth-child(1) textarea, header div#top div.colonne:nth-child(1) section#entete-poste h4, section#entete-poste header div#top div.colonne:nth-child(1) h4 {
    font-weight: 700;
    font-size: 13px !important; }

  header div#nav div.colonne:nth-child(2) nav {
    display: none; }

  header div#nav div.colonne:nth-child(3) {
    display: none; }

  header div#bouton-mobile {
    display: block; }

  header div#nav div.colonne img {
    width: 75%; }

  header div#nav div.colonne img.blanc, header div#nav.top div.colonne img.blanc {
    display: block; }

  header div#nav div.colonne img.gris, header div#nav.top div.colonne img.gris {
    display: none; }

  header div#nav.top {
    background-color: rgba(0, 0, 0, 0.85); }

  section#carousel div.slide-carousel div.colonne:first-of-type {
    width: 50%;
    padding: 7.5vw 2.5vw; }

  section#carousel div.slide-carousel div.colonne:last-of-type {
    width: 50%; }

  section#carousel div.slide-carousel div.colonne:last-of-type div.texte {
    max-width: initial;
    padding-right: 30px;
    padding-bottom: 30px; }

  section#carousel div.slide-carousel div.colonne:last-of-type div.texte button {
    display: none; }

  section#carousel div.slider-nav {
    width: 50% !important; }

  .slick-dotted.slick-slider {
    padding-bottom: 90px; }

  section#carousel div.conteneur, section#carousel.coupe-dacier div.conteneur {
    padding-left: 30px; }

  section#carousel div.slide-carousel ul.slick-dots {
    width: 32%; }

  section#carousel div.slider-nav div.thumbs span {
    font-size: 16px; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col img {
    max-height: 10vw;
    max-width: 12vw; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col {
    width: 50%; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute {
    top: 37%; }

  section#nos-secteurs-activite div.colonne:first-of-type {
    padding-left: 30px; }

  section#selection-produit-accueil div.colonne:first-of-type {
    width: 100%;
    padding: 0 30px;
    position: relative;
    margin-top: -23vw; }

  section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte {
    height: auto;
    padding: 4% 20%; }

  section#selection-produit-accueil {
    margin-top: 28vw; }

  section#selection-produit-accueil div.ranger.noir {
    bottom: -10vw;
    width: 100%;
    margin-top: -10vw; }

  section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type {
    width: 50%; }

  section#selection-produit-accueil div.ranger.noir div.colonne:first-of-type {
    width: 50%; }

  section#selection-produit-accueil div.colonne:last-of-type {
    width: 100%;
    padding-top: 0;
    padding-left: 7%;
    padding-right: 7%; }

  section#nos-services-accueil div.colonne:last-of-type {
    order: 1;
    width: 100%;
    padding-left: 9vw; }

  section#nos-services-accueil div.colonne:first-of-type {
    order: 2;
    width: 100%;
    display: flex;
    padding: 0 30px; }

  section#nos-services-accueil div.colonne:first-of-type div.div {
    padding-right: 0; }

  section#nos-services-accueil div.colonne:first-of-type div.div {
    order: 2; }

  section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce {
    order: 1;
    position: absolute;
    bottom: initial;
    padding-top: 20px;
    width: calc( 100% - 60px );
    left: 30px; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile {
    padding-bottom: 18.7vw; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover::after, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active::after {
    height: 3vw; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile:hover img, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile.active img {
    top: -4vw; }

  section#nos-services-accueil div.colonne:last-of-type h2 {
    text-align: center;
    max-width: 100%;
    padding-right: 9vw; }

  section#nos-services-accueil div.colonne:first-of-type h3 {
    margin-top: 2.8em; }

  section#boutique-accueil div.ranger {
    width: 100%; }

  section#nos-experts-accueil {
    display: none; }

  section#nos-experts-accueil-mobile {
    display: flex; }

  section#boutique-accueil.active {
    background-position: right 20vw; }

  section#boutique-accueil {
    background-position: 100vw 20vw; }

  section#boutique-accueil h3 {
    margin-left: 30px;
    padding-top: 50px;
    max-width: 82%; }

  section#boutique-accueil div.ranger div.colonne div.bg h5 {
    padding: 0;
    margin: 0;
    margin-bottom: 1em; }

  section#boutique-accueil div.ranger div.colonne div.bg button {
    padding: 10px 5px; }

  footer div.ranger {
    width: calc( 100% - 60px ); }

  footer div.ranger div.colonne img.logo {
    width: 206px; }

  footer p, footer div#formulaire label, div#formulaire footer label, footer div#formulaire input, div#formulaire footer input, footer div#formulaire textarea, div#formulaire footer textarea, footer section#entete-poste h4, section#entete-poste footer h4 {
    font-size: 13px !important; }

  footer div.ranger div.colonne div.question div.col p, footer div.ranger div.colonne div.question div.col div#formulaire label, div#formulaire footer div.ranger div.colonne div.question div.col label, footer div.ranger div.colonne div.question div.col div#formulaire input, div#formulaire footer div.ranger div.colonne div.question div.col input, footer div.ranger div.colonne div.question div.col div#formulaire textarea, div#formulaire footer div.ranger div.colonne div.question div.col textarea, footer div.ranger div.colonne div.question div.col section#entete-poste h4, section#entete-poste footer div.ranger div.colonne div.question div.col h4 {
    font-size: 15px !important; }

  footer div.ranger div.colonne div.question img.icon-tel {
    width: 35px;
    margin-right: 20px; }

  footer div.ranger div.colonne {
    padding: 0 15px;
    padding-bottom: 30px; }

  footer div.ranger div.colonne h4 {
    margin-bottom: 0; }

  footer div.ranger div.colonne:last-of-type p:first-of-type, footer div.ranger div.colonne:last-of-type div#formulaire label:first-of-type, div#formulaire footer div.ranger div.colonne:last-of-type label:first-of-type, footer div.ranger div.colonne:last-of-type div#formulaire input:first-of-type, div#formulaire footer div.ranger div.colonne:last-of-type input:first-of-type, footer div.ranger div.colonne:last-of-type div#formulaire textarea:first-of-type, div#formulaire footer div.ranger div.colonne:last-of-type textarea:first-of-type, footer div.ranger div.colonne:last-of-type section#entete-poste h4:first-of-type, section#entete-poste footer div.ranger div.colonne:last-of-type h4:first-of-type {
    margin-top: 2px; }

  section#distribution-entete div.entete p, section#distribution-entete div.entete div#formulaire label, div#formulaire section#distribution-entete div.entete label, section#distribution-entete div.entete div#formulaire input, div#formulaire section#distribution-entete div.entete input, section#distribution-entete div.entete div#formulaire textarea, div#formulaire section#distribution-entete div.entete textarea, section#distribution-entete div.entete section#entete-poste h4, section#entete-poste section#distribution-entete div.entete h4 {
    max-width: 600px; }

  section#carousel h2 {
    max-width: 600px;
    display: block;
    margin: 0 auto; }

  section#carousel.transformation h2 {
    margin-top: 80px; }

  section#carousel.transformation div.conteneur {
    padding-left: 30px; }

  section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte {
    padding: 60px 0px; }

  section#carousel p.pagination, section#carousel div#formulaire label.pagination, div#formulaire section#carousel label.pagination, section#carousel div#formulaire input.pagination, div#formulaire section#carousel input.pagination, section#carousel div#formulaire textarea.pagination, div#formulaire section#carousel textarea.pagination, section#carousel section#entete-poste h4.pagination, section#entete-poste section#carousel h4.pagination {
    font-size: 5vw !important;
    left: -6vw;
    margin-bottom: 0;
    margin-top: 0px;
    padding-top: 24px;
    height: calc( 100% - 40px);
    width: 6vw; }

  section#distribution-service-conseil div.ranger div.colonne:first-of-type img.mobile {
    display: block; }

  section#distribution-service-conseil div.ranger div.colonne:first-of-type img.desktop {
    display: none; }

  section#map div.colonne-image {
    width: 100%; }

  section#map div.colonne {
    width: 100%;
    max-width: 626px;
    display: block;
    margin: 0 auto;
    margin-top: 20px; }

  section#map div.colonne div.bg div.col:first-of-type {
    width: 100%;
    padding: 0 50px; }

  section#map div.colonne div.bg div.col:last-of-type {
    width: 100%;
    padding: 0 50px; }

  section#map div.colonne div.bg {
    padding: 0;
    padding-bottom: 40px; }

  section#map div.colonne div.bg h3 {
    padding: 0 50px; }

  section#map div.colonne div.bg div.col:first-of-type p, section#map div.colonne div.bg div.col:first-of-type div#formulaire label, div#formulaire section#map div.colonne div.bg div.col:first-of-type label, section#map div.colonne div.bg div.col:first-of-type div#formulaire input, div#formulaire section#map div.colonne div.bg div.col:first-of-type input, section#map div.colonne div.bg div.col:first-of-type div#formulaire textarea, div#formulaire section#map div.colonne div.bg div.col:first-of-type textarea, section#map div.colonne div.bg div.col:first-of-type section#entete-poste h4, section#entete-poste section#map div.colonne div.bg div.col:first-of-type h4 {
    margin-bottom: 0; }

  section#cueillette-livraison div.contenu {
    max-width: calc( 100% - 60px );
    padding-top: 30px; }

  section#cueillette-livraison div.contenu div.ranger div.colonne {
    width: calc(50% - 15px); }

  section#cueillette-livraison {
    padding-top: 0; }

  section#distribution-secteurs-activites div.contenu {
    max-width: calc(100% - 60px); }

  section#distribution-secteurs-activites div.contenu div.colonne img {
    max-width: 70%;
    max-height: 70%;
    position: relative;
    top: -60px; }

  section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre span.popup {
    font-size: 46px; }

  section#distribution-avantages div.ranger div.colonne {
    padding: 30px; }

  section#distribution-ouvert-au-public div.container {
    padding: 0 7.5vw; }

  section#distribution-metaux-usages {
    display: none; }

  section#distribution-metaux-usages-mobile {
    display: block; }

  section#distribution-quincaillerie div.container {
    padding: 0 7.5vw; }

  section#distribution-quincaillerie div.texte {
    padding-bottom: 60px; }

  footer div.copyright div.ranger-copy div.colonne-copy img {
    width: 120px; }

  footer div.copyright div.ranger-copy {
    width: calc( 100% - 60px); }

  section#armature-entete div.container div.ranger.desktop {
    display: none; }

  section#armature-entete div.container div.ranger-mobile {
    display: flex;
    width: calc( 100% + 30px );
    margin-left: -15px;
    margin-right: -15px;
    justify-content: center; }

  section#armature-entete div.absolute_titre {
    top: 20vw; }

  section#armature-entete div.container {
    padding-top: 44vw; }

  section#armature-entete div.ranger {
    display: none; }

  section#armature-experts-conseils div.colonne:first-of-type {
    width: 66.666%; }

  section#armature-experts-conseils div.colonne:first-of-type {
    width: 66.666%; }

  section#armature-experts-conseils div.colonne:nth-of-type(2) {
    display: none !important; }

  section#armature-experts-conseils div.colonne:last-of-type {
    width: calc( 33.333% - 30px); }

  section#transformation-entete div.ranger {
    display: none; }

  section#transformation-entete div.ranger-mobile {
    display: flex;
    width: calc( 100% + 30px );
    margin-left: -15px;
    margin-right: -15px; }

  section#armature-entete.armature div.ranger-mobile div.colonne-mobile {
    width: 44%; }

  section#autres-produits-ponceaux div.colonne div.texte h2 br {
    display: none; }

  section#autres-produits-ponceaux div.colonne div.texte h2 {
    padding-right: 30px; }

  section#autres-produits-ponceaux div.colonne div.texte {
    max-width: 100%;
    margin-top: 11.5vw; }

  section#autres-produits-ponceaux div.background div.container {
    position: relative; }

  section#autres-produits-ponceaux div.background div.ranger {
    padding-top: 16vw;
    justify-content: space-between;
    width: 80vw; }

  section#autres-produits-membrane {
    margin-top: 260px;
    position: relative;
    margin-bottom: 200px; }

  section#autres-produits-membrane div.container div.ranger div.colonne:first-of-type {
    width: 48%; }

  section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type {
    width: 52%;
    padding-left: 30px; }

  section#autres-produits-livraison div.etiquette {
    width: 50vw;
    padding: 30px 30px; }

  section#autres-produits-livraison div.container {
    padding: 0 7.5vw; }

  section#autres-produits-livraison h2 {
    margin-top: 25px; }

  section#autres-produits-revetement div.colonne img {
    position: relative;
    transform: none; }

  section#autres-produits-revetement div.colonne {
    position: 50px; }

  section#slides-revetements div.ranger div.colonne:first-of-type {
    width: 50%;
    padding-right: 30px; }

  section#slides-revetements div.ranger div.colonne:last-of-type {
    width: 50%;
    padding-left: 30px; }

  section#slides-revetements div.ranger {
    padding: 60px 60px 30px; }

  section#distribution-ouvert-au-public.autres-produits {
    padding-top: 126px; }

  section#autres-produits-slogan {
    padding-bottom: 100px;
    padding-top: 100px; }

  section#distribution-quincaillerie.autres-produits div.texte {
    margin-top: 0px;
    max-width: 50%; }

  section#distribution-quincaillerie.autres-produits div.texte p, section#distribution-quincaillerie.autres-produits div.texte div#formulaire label, div#formulaire section#distribution-quincaillerie.autres-produits div.texte label, section#distribution-quincaillerie.autres-produits div.texte div#formulaire input, div#formulaire section#distribution-quincaillerie.autres-produits div.texte input, section#distribution-quincaillerie.autres-produits div.texte div#formulaire textarea, div#formulaire section#distribution-quincaillerie.autres-produits div.texte textarea, section#distribution-quincaillerie.autres-produits div.texte section#entete-poste h4, section#entete-poste section#distribution-quincaillerie.autres-produits div.texte h4 {
    padding-right: 0; }

  section#distribution-quincaillerie.autres-produits div.absolute-titre {
    top: 157px; }
section#gallerie-realisations .texte h2 br,
  section#ponceaux-slide div.colonne:first-of-type h2 br {
    display: none; }

  section#ponceaux-slide div.colonne:first-of-type div.texte {
    width: 100%;
    padding-right: 30px; }

  section#ponceaux-slide div.colonne:first-of-type {
    padding-left: 30px; }

  section#ponceaux-slide div.colonne:first-of-type div.texte button, section#tuyaux-slide div.colonne:first-of-type div.texte button {
    margin-top: 0; }

  section#ponceaux-slide div.colonne:last-of-type .slides-ponceaux .slick-slide > div {
    padding-top: 30px; }

  section#ponceaux-slide div.colonne:last-of-type div.relative div.absolute {
    padding: 20px 15px;
    min-width: 70%; }

  section#ponceaux-slide div.colonne:last-of-type div.slides-ponceaux {
    position: relative;
    z-index: -1; }

  section#ponceaux-slide div.colonne:last-of-type div.abs {
    top: 31vw;
    bottom: initial; }

  section#tuyaux-slide div.colonne:last-of-type div.relative div.absolute {
    padding: 20px 15px;
    min-width: 70%; }

  section#tuyaux-slide div.colonne:last-of-type .slides-tuyaux .slick-slide > div {
    padding-top: 30px; }

  section#tuyaux-slide div.colonne:last-of-type div.abs {
    bottom: initial;
    top: 31vw; }

  section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux, section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux {
    width: 50px; }

  section#ponceaux-slide div.colonne:last-of-type div.abs div.slider-ponceaux-nav, section#ponceaux-slide div.colonne:last-of-type div.abs div.slider-tuyaux-nav, section#tuyaux-slide div.colonne:last-of-type div.abs div.slider-ponceaux-nav, section#tuyaux-slide div.colonne:last-of-type div.abs div.slider-tuyaux-nav {
    width: calc(100% - 50px);
    height: 100%; }

  section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux span, section#ponceaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux span, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-ponceaux span, section#tuyaux-slide div.colonne:last-of-type div.abs div#next-slide-tuyaux span {
    font-size: 50px; }

  section#tuyaux-slide div.colonne:last-of-type div.abs {
    left: 30px;
    right: initial; }

  section#drains-selection {
    padding-top: 0; }

  section#ponceaux-selection div.ranger div.colonne, section#drains-selection div.ranger div.colonne {
    padding: 30px 5px;
    margin: 0 15px; }

  section#ponceaux-transport-surdimensionnes {
    min-height: 80vw; }

  section#piece div.container p, section#piece div.container div#formulaire label, div#formulaire section#piece div.container label, section#piece div.container div#formulaire input, div#formulaire section#piece div.container input, section#piece div.container div#formulaire textarea, div#formulaire section#piece div.container textarea, section#piece div.container section#entete-poste h4, section#entete-poste section#piece div.container h4 {
    max-width: 614px; }

  section#piece div.container div.ranger-bouton div {
    flex: initial;
    padding: 15px 15px;
    width: 33.3333%; }

  section#piece div.container div.ranger-bouton {
    width: calc( 100% + 30px );
    margin-left: -15px;
    margin-right: -15px; }

  section#piece div.container div.ranger-bouton div button {
    height: 71px;
    font-size: 18px; }

  section#piece div.container div.ranger-tuile:before {
    content: none; }

  section#piece div.container div.ranger-tuile div.tuile {
    width: 16.6666%;
    padding: 7.5px 15px; }

  section#piece div.container div.ranger-tuile div.tuile div.bg p, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire label, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg label, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire input, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg input, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire textarea, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg textarea, section#piece div.container div.ranger-tuile div.tuile div.bg section#entete-poste h4, section#entete-poste section#piece div.container div.ranger-tuile div.tuile div.bg h4 {
    line-height: 1.1;
    max-width: 80%; }

  section#piece div.container h3 {
    margin-top: 40px;
    margin-bottom: 10px; }

  section#piece div.container div.ranger-tuile {
    width: calc( 100% + 30px );
    margin-left: -15px;
    margin-right: -15px; }

  section#piece div.container div.description-ranger {
    padding-top: 60px;
    margin-top: 7.5px; }

  section#piece div.container div.livret-de-poids h3 {
    margin: 40px 0 15px; }

  section#service-conseil {
    flex-direction: column;
    justify-content: center; }

  section#quincaillerie-entete div.entete p, section#quincaillerie-entete div.entete div#formulaire label, div#formulaire section#quincaillerie-entete div.entete label, section#quincaillerie-entete div.entete div#formulaire input, div#formulaire section#quincaillerie-entete div.entete input, section#quincaillerie-entete div.entete div#formulaire textarea, div#formulaire section#quincaillerie-entete div.entete textarea, section#quincaillerie-entete div.entete section#entete-poste h4, section#entete-poste section#quincaillerie-entete div.entete h4 {
    max-width: 55vw; }

  section#quincaillerie-entete {
    min-height: 84vw; }

  section#quincaillerie-des-outils-de-qualites div.colonne:first-of-type {
    width: 48.5%; }

  section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type {
    width: 51.5%; }

  section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg {
    padding: 48px 60px;
    width: calc( 100% + 60px );
    top: 30px;
    left: -60px; }

  section#quincaillerie-entete div.container {
    padding: 0 7.5vw; }

  section#quincaillerie-produits div.ranger div.colonne {
    width: 33.3333%;
    padding: 30px; }

  section#quincaillerie-produits div.ranger {
    padding: 0 15px; }

  section#quincaillerie-produits div.ranger div.colonne h4 {
    margin: 20px 0 50px; }

  section#quincaillerie-produits div.ranger div.colonne button {
    padding: 10px 20px; }

  div#carousel-marque .slick-prev::before, div#carousel-marque .slick-next::before {
    width: 10px; }

  div#carousel-marque div.slide-marque img {
    height: 63px; }

  div#carousel-marque h3 {
    margin-bottom: 30px; }

  div#carousel-marque div.container {
    padding: 0 7.5vw; }

  section#quincaillerie-conseil div.ranger div.colonne:first-of-type p, section#quincaillerie-conseil div.ranger div.colonne:first-of-type div#formulaire label, div#formulaire section#quincaillerie-conseil div.ranger div.colonne:first-of-type label, section#quincaillerie-conseil div.ranger div.colonne:first-of-type div#formulaire input, div#formulaire section#quincaillerie-conseil div.ranger div.colonne:first-of-type input, section#quincaillerie-conseil div.ranger div.colonne:first-of-type div#formulaire textarea, div#formulaire section#quincaillerie-conseil div.ranger div.colonne:first-of-type textarea, section#quincaillerie-conseil div.ranger div.colonne:first-of-type section#entete-poste h4, section#entete-poste section#quincaillerie-conseil div.ranger div.colonne:first-of-type h4 {
    max-width: 100%; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img {
    top: 126px; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type {
    width: 48%; }

  section#quincaillerie-conseil div.ranger div.colonne:first-of-type {
    width: 52%;
    padding-left: 30px; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img-absolute {
    bottom: -14vw;
    left: -16vw;
    width: 30vw; }

  section#quincaillerie-en-chiffre div.container h2 {
    margin-bottom: 1em; }

  section#entreprise-entete div.container div.texte {
    width: 45vw;
    right: 30px;
    padding: 40px 30px 30px; }

  .cd-horizontal-timeline .timeline {
    width: 90%;
    max-width: 100%; }

  .cd-timeline-navigation a::after {
    height: 30px;
    width: 30px; }

  .cd-timeline-navigation a.inactive::after {
    background-position: 0 0px; }

  section#entreprise-histoire div.ranger {
    width: 100%; }

  section#entreprise-histoire div.ranger div.colonne:first-of-type {
    width: 40%; }

  section#entreprise-histoire div.ranger div.colonne:last-of-type {
    width: 60%;
    padding-right: 7.5vw; }

  section#entreprise-histoire div.ranger div.colonne span.absolute {
    left: -5.6vw; }

  section#entreprise-histoire div.ranger div.colonne h3 {
    padding-top: 36%; }

  section#nos-services-accueil.entreprise div.colonne:first-of-type {
    order: 2;
    width: 100%;
    display: flex;
    padding: 0 30px;
    flex-direction: initial; }

  section#nos-services-accueil div.colonne:first-of-type div.div h4 {
    margin-top: 80px; }

  section#entreprise-specialiste div.absolute-img {
    width: 81vw; }

  section#entreprise-specialiste {
    padding-bottom: 80px; }

  section#entreprise-specialiste button {
    margin-top: 3em; }

  section#entreprise-specialiste div.bg div.colonne {
    width: calc( 50% + 80px );
    padding: 60px 80px 50px; }

  section#entreprise-specialiste div.bg {
    min-height: 57vw; }

  section#entreprise-clientele {
    padding-top: 30px; }

  section#entreprise-clientele div.ranger div.colonne:first-of-type {
    width: 50%; }

  section#entreprise-clientele div.ranger div.colonne:last-of-type {
    width: 50%; }

  section#entreprise-clientele div.container {
    padding: 0 30px 0 7.5vw; }

  section#entreprise-superieur h2 {
    margin-top: 0;
    margin-bottom: 0.8em; }

  section#entreprise-superieur div.ranger div.col, section#entreprise-superieur div.ranger div.colonne {
    padding: 0 15px;
    margin-bottom: 30px; }

  section#entreprise-superieur div.ranger {
    width: calc( 100% + 60px );
    margin-left: -30px;
    margin-right: -30px; }

  section#distribution-quincaillerie div.texte p, section#distribution-quincaillerie div.texte div#formulaire label, div#formulaire section#distribution-quincaillerie div.texte label, section#distribution-quincaillerie div.texte div#formulaire input, div#formulaire section#distribution-quincaillerie div.texte input, section#distribution-quincaillerie div.texte div#formulaire textarea, div#formulaire section#distribution-quincaillerie div.texte textarea, section#distribution-quincaillerie div.texte section#entete-poste h4, section#entete-poste section#distribution-quincaillerie div.texte h4 {
    padding-right: 0; }

  section#contact-map div.coordonnees {
    width: 43vw;
    left: 30px;
    position: absolute;
    z-index: 2;
    padding: 30px;
    top: 71px; }

  section#contact-map div#wpgmza_map_1 {
    height: 714px !important; }

  section#contact-form div.ranger div.colonne:first-of-type div.texte {
    display: none; }

  div#formulaire .frm_submit button, div#formulaire button#televerser {
    padding: 10px 35px;
    font-size: 17px;
    min-width: 268px;
    margin-top: 1em; }

  section#contact-form div.ranger div.colonne:first-of-type {
    width: 46%;
    position: relative;
    top: 13vw; }

  section#contact-form {
    margin-top: 15vw;
    padding-bottom: 13vw; }

  section#contact-form div.ranger div.colonne:last-of-type {
    width: 54%;
    padding: 0 30px 60px; }

  section#demande-de-prix-form div.container-form {
    padding: 110px 30px 0; }

  div#formulaire input {
    height: 59px; }

  section#demande-de-prix-form .frm_style_style-formidable.with_frm_style .frm-show-form .frm_section_heading h3 {
    margin-bottom: -15px; }

  div#formulaire textarea {
    height: 208px; }

  section#carriere-entete div.container {
    padding: 0 7.5vw; }

  section#nos-services-accueil.carriere div.colonne:last-of-type {
    width: 100%; }

  section#nos-services-accueil.carriere div.colonne:first-of-type {
    width: 100%;
    padding-bottom: 50px;
    padding-left: 30px; }

  section#nos-services-accueil.carriere div.colonne:first-of-type div.conteneur-puce {
    left: 30px;
    position: absolute;
    top: 0; }

  section#nos-services-accueil.carriere div.colonne:last-of-type {
    padding-right: 0; }

  section#nos-services-accueil div.colonne:last-of-type p.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide {
    left: 2.9vw; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger {
    width: calc(100% + 15px);
    margin-left: -10px;
    margin-right: 0;
    margin-bottom: -.5vw; }

  section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger {
    margin-bottom: -1.1vw; }

  section#nos-services-accueil div.colonne:first-of-type div.div h4 br {
    display: none; }

  section#nos-services-accueil.carriere {
    margin-bottom: 0; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div {
    display: block; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a:last-of-type {
    margin-left: 0; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a:first-of-type {
    margin-right: 0; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-left: 12.5vw;
    padding-right: 3vw;
    padding-top: 50px; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a:first-of-type {
    margin-right: 0;
    height: 100%; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a:last-of-type {
    margin-left: 0; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a {
    flex: auto;
    width: 100%; }

  section#carriere-postulez div.container div.post {
    padding: 50px;
    margin-bottom: 30px; }

  section#poste-form div.colonne:first-of-type {
    width: 46%;
    height: 74vw; }

  section#poste-form div#formulaire textarea {
    height: 355px; }

  section#poste-form div.colonne:last-of-type {
    width: calc( 54% );
    padding-left: 50px;
    padding-right: 30px;
    padding-bottom: 40px;
    background-image: none !important; }

  div#formulaire .select-selected {
    padding: 18px 20px;
    height: 59px;
    font-size: 16px; }

  div#formulaire .select-items div, div#formulaire .select-selected {
    padding: 18px 15px;
    font-size: 15px; }

  section#poste-form div#formulaire .frm_submit button {
    margin-top: 0em; }

  section#entete-poste div.colonne:first-of-type {
    width: 42%; }

  section#entete-poste div.colonne:last-of-type {
    width: 58%;
    padding: 150px 30px 0 50px; }

  section#entete-poste div.colonne:first-of-type div.bg {
    background-color: #000;
    padding: 30px;
    margin-top: 71px; }

  section#entete-poste div.colonne:first-of-type div.bg button {
    min-width: 250px;
    margin-top: 3em; }

  section#page-404 {
    min-height: 54vw; }

  section#page-404 span.absolute {
    font-size: 225px !important;
    top: 60px; }

  section#page-404 div.container {
    padding: 0 110px;
    padding-top: 145px; }

  section#page-404 h1 {
    font-size: 97px; }

  section#page-404 p, section#page-404 div#formulaire label, div#formulaire section#page-404 label, section#page-404 div#formulaire input, div#formulaire section#page-404 input, section#page-404 div#formulaire textarea, div#formulaire section#page-404 textarea, section#page-404 section#entete-poste h4, section#entete-poste section#page-404 h4 {
    font-size: 21px;
    margin-bottom: 20px; }

  section#armature-entete.coupe-dacier div.container {
    padding-top: 43vw; }

  section#distribution-quincaillerie.coupe-dacier div.texte {
    max-width: 45.5vw; }

  section#slides-revetements div.ranger-onglet div.onglet {
    width: calc( 25% - 2vw );
    height: 11vw; }

  section#slides-revetements div.ranger-onglet div.onglet:nth-of-type(2) img, section#slides-revetements div.ranger-onglet div.onglet:nth-of-type(3) img {
    max-height: 36%; }

  section#distribution-quincaillerie div.absolute-titre span {
    width: 80vw; }

  section#distribution-quincaillerie div.absolute-titre span br {
    display: none; }

  section#tuyaux-slide div.colonne:first-of-type div.texte ul {
    margin: 0; }

  section#piece div.overflow h1 br {
    display: none; }

  section#piece div.overflow h1 {
    max-width: 75%;
    display: block;
    margin: 0 auto; }

  section#quincaillerie-produits div.ranger div.colonne img {
    width: 65%; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne h5 {
    font-size: 59px;
    font-weight: 900; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg p, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire label, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg label, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire input, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg input, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire textarea, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg textarea, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg section#entete-poste h4, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg h4 {
    font-size: 21px !important;
    padding: 0 10px; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg p br, section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg div#formulaire label br, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg label br, section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg div#formulaire input br, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg input br, section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg div#formulaire textarea br, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg textarea br, section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg section#entete-poste h4 br, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne:first-of-type div.bg h4 br {
    display: none; }

  section#nos-services-accueil div.colonne:last-of-type p.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide a, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide a {
    padding: 2vw 2.2vw; }

  section#nos-services-accueil div.colonne:last-of-type p.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide {
    height: 13vw;
    padding-top: 5px; }

  section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger div.tuile.active img, section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger div.tuile:hover img {
    top: -4.9vw; }

  section#entreprise-superieur div.ranger {
    height: 58vw; }

  section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) div.bg {
    background-size: 142% auto; }

  section#contact-map ul li {
    padding-top: 0.6em;
    padding-bottom: 0.6em; }

  section#contact-map hr {
    margin-bottom: 4vw; }

  section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile {
    padding-bottom: 10vw;
    height: 18vw; }

  section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile.active img, section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile:hover img {
    top: -4.9vw; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type {
    height: 100%;
    position: relative;
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(1) {
    height: calc( 50% - 10px);
    top: 0;
    position: absolute;
    width: calc(100% - 10px);
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(1) {
    height: calc( 50% - 10px);
    top: 0;
    position: absolute;
    width: calc(100% - 10px);
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(2) {
    width: calc(100% - 10px);
    bottom: 0;
    position: absolute;
    height: calc(50% - 10px); }

  section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) {
    width: 42%; }

  section#entreprise-superieur div.ranger div.col, section#entreprise-superieur div.ranger div.colonne {
    padding: 0px 10px;
    margin-bottom: 0px; }

  section#entreprise-superieur div.ranger div.col:last-of-type, section#entreprise-superieur div.ranger div.colonne:last-of-type {
    margin-bottom: 0;
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(1) {
    height: calc( 50% - 10px);
    top: 0;
    position: absolute;
    width: calc(100% - 10px);
    right: 0;
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(2) {
    height: calc(50% - 10px);
    width: calc(100% - 10px);
    bottom: 0;
    position: absolute;
    right: 0; }

  section#entreprise-superieur div.ranger div.col:last-of-type, section#entreprise-superieur div.ranger div.colonne:last-of-type {
    margin-bottom: 0;
    padding: 0; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger {
    position: relative; }

  section#demande-de-prix-form div.container-form .frm_form_field.frm_hidden_container.frm_repeat_buttons.frm {
    float: left;
    position: relative;
    clear: both;
    right: 0;
    top: 0;
    transform: none; }

  section#demande-de-prix-form div.container-form .frm_form_field.frm_hidden_container.frm_repeat_buttons.frm a {
    font-size: 16px;
    padding: 0; }

  .cd-horizontal-timeline .events-content {
    position: relative;
    width: 100%;
    margin: 2em 0 4em;
    overflow: hidden;
    -webkit-transition: height 0.4s;
    -moz-transition: height 0.4s;
    transition: height 0.4s; }

  #bouton-mobile {
    width: 38px; }

  .menu-middle {
    top: 13px; }

  .menu-bottom {
    top: 26px; }

  .menu-bottom-click {
    transform-origin: 20% 0%; }

  .menu-top-click {
    transform-origin: 44% 15%; } }
@media screen and (max-width: 1000px) {
  section#contact-form div.ranger div.colonne:first-of-type {
    display: none; }

  section#contact-form div.ranger div.colonne:last-of-type {
    width: 100%;
    padding: 0 30px 60px;
    padding-top: 25px; }

  section#contact-map div.coordonnees {
    width: 410px;
    left: 30px;
    position: absolute;
    z-index: 2;
    padding: 30px;
    top: 71px; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type {
    padding-left: 5.5vw; }

  section#carriere-entete h1 {
    padding-top: 18vw; }

  section#carriere-entete {
    min-height: 64vw; }

  section#contact-map div#wpgmza_map_1 {
    height: 546px !important; }

  section#contact-form {
    margin-top: 26vw; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 20px; }

  section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) {
    width: 100%;
    margin-bottom: 20px;
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:last-of-type {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 20px; }

  section#entreprise-superieur div.ranger {
    height: auto;
    padding: 0 10px; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(1) {
    height: calc( 50% - 10px);
    top: 0;
    position: relative;
    width: calc(50% - 10px);
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(2) {
    width: calc(50% - 10px);
    bottom: 0;
    position: relative;
    height: calc(50% - 10px); }

  section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(1) {
    height: calc( 50% - 10px);
    top: 0;
    position: relative;
    width: calc(50% - 10px);
    right: 0;
    padding: 0; }

  section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(2) {
    height: calc(50% - 10px);
    width: calc(50% - 10px);
    bottom: 0;
    position: relative;
    right: 0; }

  section#entreprise-superieur div.ranger div.bg {
    min-height: 15em; }

  section#entreprise-histoire .cd-horizontal-timeline .events a {
    font-size: 16px; }

  section#entreprise-histoire div.ranger div.colonne span.absolute {
    top: 110px; }

  section#entreprise-entete {
    height: 73vw; }

  section#quincaillerie-slogan h2 strong {
    line-height: 1; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.icon {
    top: 42%; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg p, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire label, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg label, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire input, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg input, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire textarea, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg textarea, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg section#entete-poste h4, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg h4 {
    font-size: 16px !important; }

  section#autres-produits-livraison {
    height: 72vw; }

  section#autres-produits-membrane {
    margin-top: 386px;
    position: relative;
    margin-bottom: 200px; }

  section#autres-produits-entete div.colonne div.texte {
    margin-top: 12vw;
    position: absolute;
    width: 67vw;
    z-index: 9; }

  section#autres-produits-entete div.colonne {
    min-height: 47vw; }

  section#piece div.container div.ranger-bouton div button {
    height: 50px;
    font-size: 16px; }

  section#piece div.container div.ranger-tuile div.tuile div.bg p, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire label, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg label, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire input, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg input, section#piece div.container div.ranger-tuile div.tuile div.bg div#formulaire textarea, div#formulaire section#piece div.container div.ranger-tuile div.tuile div.bg textarea, section#piece div.container div.ranger-tuile div.tuile div.bg section#entete-poste h4, section#entete-poste section#piece div.container div.ranger-tuile div.tuile div.bg h4 {
    font-size: 10px !important; }

  section#carousel div.slider-nav div.thumbs span {
    font-size: 12px; }

  section#nos-secteurs-activite div.colonne:first-of-type {
    width: 100%;
    padding-top: 80px; }

  section#nos-secteurs-activite div.colonne:last-of-type {
    width: 100%;
    padding-top: 0; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col {
    width: 33.3333%; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col img {
    max-height: 16vw;
    max-width: 17vw; }

  section#distribution-secteurs-activites div.contenu div.colonne img {
    max-width: 70%;
    max-height: 56%; }

  section#distribution-secteurs-activites div.contenu div.colonne:nth-child(4) img {
    max-width: 80%;
    max-height: 64%; }

  section#distribution-avantages div.ranger div.colonne:nth-child(1) {
    width: 53%; }

  section#distribution-avantages div.ranger div.colonne:nth-child(2) {
    width: 47%; }

  section#distribution-avantages div.ranger div.colonne:nth-child(3) {
    width: 47%; }

  section#distribution-avantages div.ranger div.colonne:nth-child(4) {
    width: 47%;
    margin-right: 3%; }

  section#distribution-ouvert-au-public {
    min-height: 70vw; }

  section#armature-experts-conseils div.colonne div.bg {
    height: auto; }

  section#armature-experts-conseils div.colonne {
    height: 52vw; }

  section#nos-experts-accueil-mobile div.full {
    min-height: 71vw; }

  section#poste-form div.colonne:first-of-type {
    display: none; }

  section#poste-form div.colonne:last-of-type {
    width: 100%; }

  section#distribution-ouvert-au-public div.texte ul {
    columns: 2;
    column-gap: 80px;
    white-space: nowrap; }

  div#carousel-marque div.slide-marque img {
    height: 52px; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img-absolute {
    bottom: -2vw;
    left: -2vw;
    width: 26vw; }

  section#boutique-accueil div.ranger div.colonne div.bg {
    padding: 0 15px; }

  section#autres-produits-membrane div.absolute {
    bottom: -18%; }

  section#autres-produits-livraison div.etiquette {
    width: 50vw;
    padding: 30px 0px 30px 30px; }

  section#autres-produits-revetement div.colonne button {
    padding: 10px 30px; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type {
    padding-bottom: 50px; } }
@media screen and (max-width: 768px) {
  section#contact-map div.coordonnees {
    width: calc(100% - 30px);
    left: 15px;
    position: relative;
    padding: 35px 15px;
    margin-top: 15px;
    overflow: hidden; }
    section#accueil-entete div.entete .d-flex img {
  max-width:20px;
  margin-bottom:0;
  margin-left: 0;
  padding-bottom: 0;
}
section#accueil-entete div.entete h1 strong {
  line-height: 1;
}
section#accueil-entete div.entete {
    padding-left: 15px;
    padding-right: 15px;
}
.page-id-441 section#armature-entete div.absolute_titre h1 {
  white-space: normal;
  text-align: center;
  font-size: 80px;
}
  section#contact-map ul li:after {
    width: 24px;
    height: 30px;
    left: -33px; }

  section#contact-map ul {
    padding-left: 33px; }

  section#contact-map div.col:first-of-type {
    width: 100%; }

  section#contact-map div.col:last-of-type {
    width: 100%; }

  section#contact-map div.col:first-of-type p, section#contact-map div.col:first-of-type div#formulaire label, div#formulaire section#contact-map div.col:first-of-type label, section#contact-map div.col:first-of-type div#formulaire input, div#formulaire section#contact-map div.col:first-of-type input, section#contact-map div.col:first-of-type div#formulaire textarea, div#formulaire section#contact-map div.col:first-of-type textarea, section#contact-map div.col:first-of-type section#entete-poste h4, section#entete-poste section#contact-map div.col:first-of-type h4 {
    margin-bottom: 0; }

  section#contact-map div.col:last-of-type p, section#contact-map div.col:last-of-type div#formulaire label, div#formulaire section#contact-map div.col:last-of-type label, section#contact-map div.col:last-of-type div#formulaire input, div#formulaire section#contact-map div.col:last-of-type input, section#contact-map div.col:last-of-type div#formulaire textarea, div#formulaire section#contact-map div.col:last-of-type textarea, section#contact-map div.col:last-of-type section#entete-poste h4, section#entete-poste section#contact-map div.col:last-of-type h4 {
    margin-top: 0; }

  section#contact-map div.icon {
    top: 24px; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a button {
    padding: 10px 25px; }

  section#carousel p.pagination a, section#carousel div#formulaire label.pagination a, div#formulaire section#carousel label.pagination a, section#carousel div#formulaire input.pagination a, div#formulaire section#carousel input.pagination a, section#carousel div#formulaire textarea.pagination a, div#formulaire section#carousel textarea.pagination a, section#carousel section#entete-poste h4.pagination a, section#entete-poste section#carousel h4.pagination a {
    height: 50%; } }
@media screen and (max-width: 767px) {
  div.container {
    padding: 0 15px; }

  .px_33, section#landing div.texte h2, section#carousel div.slide-carousel div.colonne:last-of-type div.texte h3, section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute h3, section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile div.absolute h4, section#boutique-accueil div.ranger div.colonne div.bg h5, section#piece div.container h3, section#map div.colonne div.bg h3, section#cueillette-livraison div.contenu div.ranger div.colonne h3, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre h4, section#distribution-avantages div.ranger h4, section#distribution-ouvert-au-public div.texte h4, section#armature-entete div.colonne h3, section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type h3, section#transformation-entete div.ranger div.colonne h3, section#transformation-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type h3, section#autres-produits-ponceaux div.background div.ranger div.colonne div.bg h3, section#slides-revetements div.ranger div.colonne:last-of-type h4, section#ponceaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#tuyaux-slide div.colonne:last-of-type div.relative div.absolute h4, section#ponceaux-selection div.ranger div.colonne h4, section#drains-selection div.ranger div.colonne h4, section#ponceaux-selection div.ranger-content div.colonne h4, section#drains-selection div.ranger-content div.colonne h4, section#ponceaux-selection-mobile div.tab div.accordeon h4, section#drains-selection-mobile div.tab div.accordeon h4, section#ponceaux-selection-mobile div.tab div.ranger-content h4, section#drains-selection-mobile div.tab div.ranger-content h4, section#quincaillerie-produits div.ranger div.colonne h4, section#quincaillerie-en-chiffre div.container div.ranger div.colonne p, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire label, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne label, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire input, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne input, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div#formulaire textarea, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne textarea, section#quincaillerie-en-chiffre div.container div.ranger div.colonne section#entete-poste h4, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne h4, section#entreprise-entete div.container div.texte h4, section#entreprise-superieur div.ranger div.col h4, section#entreprise-superieur div.ranger div.bg h4, section#contact-map h1, section#contact-map h2, section#demande-de-prix-form .frm_style_style-formidable.with_frm_style .frm-show-form .frm_section_heading h3, section#page-404 p, section#page-404 div#formulaire label, div#formulaire section#page-404 label, section#page-404 div#formulaire input, div#formulaire section#page-404 input, section#page-404 div#formulaire textarea, div#formulaire section#page-404 textarea, section#page-404 section#entete-poste h4, section#entete-poste section#page-404 h4, section#entete-poste h1, section#carriere-postulez div.container div.post h3 {
    font-size: 20px; }
section#gallerie-realisations .texte h2,
  .px_84, section#carousel h2, section#nos-secteurs-activite div.colonne:first-of-type h2, section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte h2, section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:first-of-type h3, section#nos-services-accueil div.colonne:first-of-type div.div h4, section#boutique-accueil h3, section#piece div.container h2, section#piece div.container div.description-ranger div.colonne h2, section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte h3, section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre span.popup, section#distribution-avantages div.ranger h3, section#distribution-ouvert-au-public div.texte h3, section#distribution-metaux-usages div.texte h3, section#distribution-metaux-usages-mobile div.texte h3, section#distribution-quincaillerie div.texte h3, section#armature-entete h2, section#armature-experts-conseils div.colonne div.bg h2, section#transformation-entete h2, section#autres-produits-ponceaux div.colonne div.texte h2, section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type h2, section#autres-produits-livraison div.etiquette h3, section#autres-produits-revetement div.colonne h3, section#ponceaux-slide div.colonne:first-of-type h2, section#tuyaux-slide div.colonne:first-of-type h2, section#ponceaux-selection div.ranger-content div.colonne h3, section#drains-selection div.ranger-content div.colonne h3, section#ponceaux-selection-mobile div.tab div.ranger-content h3, section#drains-selection-mobile div.tab div.ranger-content h3, section#ponceaux-transport-surdimensionnes div.colonne h3, section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg h2, div#carousel-marque h3, section#quincaillerie-conseil div.ranger div.colonne:first-of-type h3, section#quincaillerie-en-chiffre div.container div.ranger div.colonne h5, section#entreprise-histoire div.ranger div.colonne h3, section#entreprise-specialiste div.bg div.colonne h3, section#entreprise-clientele div.ranger div.colonne:first-of-type h3, section#contact-form div.ranger div.colonne:first-of-type h3, section#poste-form div.colonne:last-of-type h2, section#carriere-humain div.ranger div.colonne:last-of-type div.bg h2 {
    font-size: 28px; }

  .px_110, section#landing div.entete h1, section#accueil-entete div.entete h1, section#selection-produit-accueil div.colonne:last-of-type h3, section#nos-services-accueil div.colonne:last-of-type h2, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2, section#nos-experts-accueil-mobile div.full h2, section#piece div.container h1, section#service-conseil h2, section#distribution-entete div.entete h1, section#distribution-entreposage h2, section#map h2, section#distribution-secteurs-activites div.contenu h2, section#distribution-grand-distributeur div.texte h2, section#autres-produits-entete div.colonne div.texte h1, section#autres-produits-livraison h2, section#autres-produits-slogan h2, section#ponceaux-entete div.texte h1, section#ponceaux-selection h2, section#drains-selection h2, section#ponceaux-selection-mobile h2, section#drains-selection-mobile h2, section#ponceaux-transport-surdimensionnes h2, section#quincaillerie-entete div.entete h1, section#quincaillerie-en-chiffre div.container h2, section#quincaillerie-slogan h2, section#entreprise-histoire h2, section#entreprise-familiale div.texte h2, section#entreprise-projets h2, section#entreprise-superieur h2, section#contact-form div.ranger div.colonne:first-of-type h3 strong, section#contact-form div.ranger div.colonne:last-of-type h2, section#demande-de-prix-form div.container-form h1, section#poste-slogan h2, section#carriere-entete h1, section#carriere-postulez div.container h2 {
    font-size: 31px; }

  .px_141, section#landing div.entete h1 strong, section#accueil-entete div.entete h1 strong, section#selection-produit-accueil div.colonne:last-of-type h3 strong, section#nos-experts-accueil div.ranger div.colonne:last-of-type h2 strong, section#nos-experts-accueil-mobile div.full h2 strong, section#piece div.container h1 strong, section#service-conseil h2 strong, section#distribution-entete div.entete h1 strong, section#distribution-entreposage h2 strong, section#distribution-grand-distributeur div.texte h2 strong, section#autres-produits-entete div.colonne div.texte h1 strong, section#autres-produits-livraison h2 strong, section#autres-produits-slogan h2 strong, section#ponceaux-entete div.texte h1 strong, section#quincaillerie-entete div.entete h1 strong, section#quincaillerie-slogan h2 strong, section#entreprise-familiale div.texte h2 strong, section#entreprise-projets h2 strong, section#page-404 h1, section#poste-slogan h2 strong, section#carriere-entete h1 strong {
    font-size: 40px; }

  .px_263, section#carousel div.slide-carousel div.relative div.absolute h3, section#distribution-quincaillerie div.absolute-titre span, section#armature-entete div.absolute_titre h1, section#transformation-entete div.absolute_titre h1, section#entreprise-entete div.absolute_texte h1, section#entreprise-histoire div.ranger div.colonne span.absolute, section#page-404 span.absolute {
    font-size: 97px; }

  .px_16_footer, footer div.ranger div.colonne h4, footer div.ranger div.colonne p, footer div.ranger div.colonne div#formulaire label, div#formulaire footer div.ranger div.colonne label, footer div.ranger div.colonne div#formulaire input, div#formulaire footer div.ranger div.colonne input, footer div.ranger div.colonne div#formulaire textarea, div#formulaire footer div.ranger div.colonne textarea, footer div.ranger div.colonne section#entete-poste h4, section#entete-poste footer div.ranger div.colonne h4 {
    font-size: 14px; }

  p, div#formulaire label, div#formulaire input, div#formulaire textarea, section#entete-poste h4 {
    font-size: 18px !important; }

  td {
    font-size: 18px !important; }

  th {
    font-size: 18px !important; }

  li {
    font-size: 18px !important; }

  section button:not(.taxo-button) {
    padding: 10px 45px;
    font-size: 17px; }

  .home header {
    display: block; }

  .home footer {
    display: block; }

  #bouton-mobile {
    right: 15px; }

  header div#nav div.colonne {
    width: 191px; }

  header div#nav div.colonne img {
    width: calc( 100% - 15px);
    margin-left: 15px; }

  header div#nav div.colonne:nth-child(2) {
    width: calc(100% - 191px); }

  section#landing {
    position: relative;
    overflow: hidden;
    height: auto; }
    section#landing div.entete h1 {
      font-size: 24px;
      max-width: 400px;
      margin: 0 auto; }
      section#landing div.entete h1 strong {
        font-size: 28px; }
      section#landing div.entete h1 br {
        display: none; }
      section#landing div.entete h1 br:last-of-type {
        display: block; }
    section#landing div.entete {
      top: 15%; }
    section#landing div.logo {
      display: none; }
    section#landing .split {
      position: relative;
      width: 100%;
      height: auto;
      overflow: hidden; }
      section#landing .split.left-land {
        padding-top: 217px;
        padding-bottom: 50px;
        background-size: cover;
        background-position: center; }
      section#landing .split.right-land {
        padding-top: 80px;
        padding-bottom: 50px;
        background-size: cover;
        background-position: center; }
    section#landing div.texte {
      position: relative;
      width: calc(100% - 30px); }
      section#landing div.texte p:first-of-type, section#landing div.texte div#formulaire label:first-of-type, div#formulaire section#landing div.texte label:first-of-type, section#landing div.texte div#formulaire input:first-of-type, div#formulaire section#landing div.texte input:first-of-type, section#landing div.texte div#formulaire textarea:first-of-type, div#formulaire section#landing div.texte textarea:first-of-type, section#landing div.texte section#entete-poste h4:first-of-type, section#entete-poste section#landing div.texte h4:first-of-type {
        display: none; }
      section#landing div.texte h2 {
        font-size: 20px;
        text-align: center;
        text-transform: uppercase;
        max-width: 300px;
        display: block;
        margin: 0 auto; }
      section#landing div.texte button {
        font-size: 16px;
        width: 100%; }

  footer div.ranger div.colonne:first-of-type {
    width: 100%;
    border-left: none; }

  footer p, footer div#formulaire label, div#formulaire footer label, footer div#formulaire input, div#formulaire footer input, footer div#formulaire textarea, div#formulaire footer textarea, footer section#entete-poste h4, section#entete-poste footer h4 {
    font-size: 14px !important; }

  footer div.ranger div.colonne:nth-of-type(2), footer div.ranger div.colonne:last-of-type {
    display: none; }

  footer div.ranger div.colonne div.icon {
    width: 20px;
    height: 40px; }

  footer div.copyright div.ranger-copy {
    display: block; }

  footer div.copyright div.ranger-copy p, footer div.copyright div.ranger-copy div#formulaire label, div#formulaire footer div.copyright div.ranger-copy label, footer div.copyright div.ranger-copy div#formulaire input, div#formulaire footer div.copyright div.ranger-copy input, footer div.copyright div.ranger-copy div#formulaire textarea, div#formulaire footer div.copyright div.ranger-copy textarea, footer div.copyright div.ranger-copy section#entete-poste h4, section#entete-poste footer div.copyright div.ranger-copy h4 {
    font-size: 13px !important; }

  footer div.ranger div.colonne {
    padding-bottom: 20px;
    padding-top: 30px; }

  section#accueil-entete div.entete h1 br {
    display: none; }

  section#accueil-entete div.entete h1 br:last-of-type {
    display: block; }

  section#carousel div.slide-carousel div.colonne:first-of-type {
    width: 100%;
    padding: 7.5vw 2.5vw; }

  section#carousel div.slide-carousel div.colonne:last-of-type {
    width: 100%;
    height: auto; }

  section#carousel div.slider-nav {
    width: calc( 100% - 0px ) !important;
    position: relative;
    margin-left: 36px; }

  section#carousel div.slide-carousel ul.slick-dots {
    width: calc( 100% - 55px);
    bottom: -34px;
    margin-left: 55px; }

  section#carousel div.conteneur {
    position: relative;
    height: auto;
    margin-bottom: 50px; }

  section#carousel div.slider__counter {
    position: absolute;
    bottom: -40px; }

  section#carousel div.conteneur, section#carousel.coupe-dacier div.conteneur {
    padding-left: 15px; }

  section#carousel p.pagination, section#carousel div#formulaire label.pagination, div#formulaire section#carousel label.pagination, section#carousel div#formulaire input.pagination, div#formulaire section#carousel input.pagination, section#carousel div#formulaire textarea.pagination, div#formulaire section#carousel textarea.pagination, section#carousel section#entete-poste h4.pagination, section#entete-poste section#carousel h4.pagination {
    font-size: 5vw !important;
    left: -40px;
    margin-bottom: 0;
    margin-top: 0px;
    padding-top: 37px;
    height: calc( 100% - 40px);
    width: 40px; }

  section#carousel div.slide-carousel .slick-current div.relative div.absolute {
    display: none; }

  section#carousel div.slide-carousel div.colonne:last-of-type div.texte {
    max-width: initial;
    padding-right: 15px;
    padding-bottom: 0px;
    padding-left: 15px;
    padding-top: 0px; }

  section#carousel .slick-dotted.slick-slider {
    padding-bottom: 0; }

  section#nos-secteurs-activite div.colonne:first-of-type {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 0; }

  section#nos-secteurs-activite div.colonne:last-of-type {
    padding: 5% 0 15%; }

  section#selection-produit-accueil div.colonne:first-of-type {
    padding: 0 15px; }

  section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte {
    height: auto;
    padding: 80px 30px 80px; }

  section#selection-produit-accueil div.ranger.noir div.colonne:first-of-type {
    width: 100%;
    order: 2; }

  section#selection-produit-accueil div.ranger.noir div.colonne:last-of-type {
    width: 100%;
    order: 1;
    padding: 0 15px; }

  section#selection-produit-accueil div.ranger.noir div.colonne:first-of-type img {
    width: 100%;
    position: relative;
    margin-top: 80px;
    bottom: 0;
    left: -15px;
    opacity: 0; }

  section#nos-secteurs-activite div.colonne:first-of-type button {
    width: 100%; }

  section#selection-produit-accueil div.colonne:first-of-type div.bleu-texte button {
    width: 100%; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger {
    width: 450px;
    margin-left: 15px;
    margin-right: 0;
    margin-bottom: -6px; }

  section#nos-services-accueil div.colonne:last-of-type div.ranger div.tuile {
    padding-bottom: 65%; }

  section#nos-services-accueil div.colonne:last-of-type p.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide {
    height: 108px;
    padding-top: 0px;
    width: 50px; }

  section#nos-services-accueil div.colonne:last-of-type p.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire label.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type label.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire input.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type input.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type div#formulaire textarea.pagination-slide a, div#formulaire section#nos-services-accueil div.colonne:last-of-type textarea.pagination-slide a, section#nos-services-accueil div.colonne:last-of-type section#entete-poste h4.pagination-slide a, section#entete-poste section#nos-services-accueil div.colonne:last-of-type h4.pagination-slide a {
    padding: 11px 17px;
    height: 42px; }

  section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce p span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire label span, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce label span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire input span, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce input span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire textarea span, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce textarea span, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce section#entete-poste h4 span, section#entete-poste section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce h4 span, section#carousel div.slider__counter p span, section#carousel div.slider__counter div#formulaire label span, div#formulaire section#carousel div.slider__counter label span, section#carousel div.slider__counter div#formulaire input span, div#formulaire section#carousel div.slider__counter input span, section#carousel div.slider__counter div#formulaire textarea span, div#formulaire section#carousel div.slider__counter textarea span, section#carousel div.slider__counter section#entete-poste h4 span, section#entete-poste section#carousel div.slider__counter h4 span {
    font-size: 18px; }

  section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce p, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire label, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce label, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire input, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce input, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce div#formulaire textarea, div#formulaire section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce textarea, section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce section#entete-poste h4, section#entete-poste section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce h4, section#carousel div.slider__counter p, section#carousel div.slider__counter div#formulaire label, div#formulaire section#carousel div.slider__counter label, section#carousel div.slider__counter div#formulaire input, div#formulaire section#carousel div.slider__counter input, section#carousel div.slider__counter div#formulaire textarea, div#formulaire section#carousel div.slider__counter textarea, section#carousel div.slider__counter section#entete-poste h4, section#entete-poste section#carousel div.slider__counter h4 {
    font-size: 11px !important; }

  section#nos-services-accueil div.colonne:first-of-type div.col:first-of-type {
    width: 3em; }

  section#nos-services-accueil div.colonne:first-of-type div.col:last-of-type {
    width: calc( 100% - 3em ); }

  section#nos-services-accueil div.colonne:first-of-type div.conteneur-puce {
    width: calc( 100% - 30px );
    left: 15px; }

  section#nos-experts-accueil-mobile div.image {
    width: calc(100% - 30px);
    bottom: -63px; }

  section#nos-experts-accueil-mobile {
    margin-top: -20px; }

  section#nos-experts-accueil-mobile div.full {
    min-height: 121vw; }

  section#nos-experts-accueil-mobile div.full h2 {
    max-width: 300px;
    margin-top: 0; }

  section#boutique-accueil h3 {
    margin-left: 0;
    padding-top: 50px;
    max-width: initial;
    padding-left: 15px;
    padding-right: 36px; }

  section#boutique-accueil div.ranger div.colonne {
    width: 100%;
    padding: 0 15px;
    margin-bottom: 15px; }

  section#boutique-accueil.active {
    background-position: bottom;
    padding-bottom: 132vw;
    background-size: contain; }

  section#boutique-accueil div.ranger div.colonne div.bg button {
    width: calc( 100% - 30px ); }

  div#nav-mobile li a {
    padding: 0 15px; }

  div#nav-mobile li.menu-item-has-children li a {
    padding-left: 35px; }

  div#nav-mobile li.menu-item-has-children > a:after {
    right: -45px; }

  section#distribution-entete {
    min-height: 127vh; }

  section#distribution-entete div.entete {
    top: 71%; }

  section#distribution-service-conseil div.ranger div.colonne:first-of-type {
    width: 100%; }

  section#distribution-service-conseil div.ranger div.colonne:last-of-type {
    width: 100%;
    top: -50px;
    padding-left: 15px;
    background-color: transparent; }

  section#distribution-service-conseil div.ranger div.colonne:last-of-type:before {
    content: none; }

  section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte {
    padding: 60px 15px;
    background-color: #000; }

  section#distribution-entreposage {
    height: 84vw;
    padding: 0 15px; }

  section#distribution-entreposage h2 br {
    display: none; }

  section#distribution-entreposage h2 br:last-of-type {
    display: block; }

  section#map div.colonne {
    width: calc( 100% - 30px); }

  section#map div.colonne div.bg {
    padding: 15px;
    padding-bottom: 40px; }

  section#map div.colonne div.bg h3 {
    padding: 0; }

  section#map div.colonne div.bg div.col:first-of-type, section#map div.colonne div.bg div.col:last-of-type {
    padding: 0; }

  section#cueillette-livraison div.contenu div.ranger div.colonne {
    width: 100%;
    margin-bottom: 15px; }

  section#cueillette-livraison div.contenu {
    max-width: calc( 100% - 30px );
    padding-top: 15px; }

  section#distribution-secteurs-activites div.contenu h2 {
    margin-top: 80px; }

  section#distribution-secteurs-activites div.contenu div.colonne {
    width: 50%; }

  section#distribution-secteurs-activites div.contenu {
    max-width: calc(100% - 30px); }

  section#distribution-avantages div.ranger div.colonne:nth-child(1) {
    width: 100%;
    order: 1;
    padding: 0; }

  section#distribution-avantages div.ranger div.colonne:nth-child(2) {
    width: 100%;
    order: 2;
    padding: 30px 15px;
    margin-bottom: 15px; }

  section#distribution-entete div.entete {
    left: 15px; }

  section#distribution-avantages div.ranger div.colonne.titre p, section#distribution-avantages div.ranger div.colonne.titre div#formulaire label, div#formulaire section#distribution-avantages div.ranger div.colonne.titre label, section#distribution-avantages div.ranger div.colonne.titre div#formulaire input, div#formulaire section#distribution-avantages div.ranger div.colonne.titre input, section#distribution-avantages div.ranger div.colonne.titre div#formulaire textarea, div#formulaire section#distribution-avantages div.ranger div.colonne.titre textarea, section#distribution-avantages div.ranger div.colonne.titre section#entete-poste h4, section#entete-poste section#distribution-avantages div.ranger div.colonne.titre h4 {
    max-width: 100%; }

  section#distribution-avantages div.ranger div.colonne:nth-child(3) {
    width: 100%;
    padding: 30px 15px;
    margin-bottom: 15px; }

  section#distribution-avantages div.ranger div.colonne:nth-child(4) {
    width: 100%;
    padding: 30px 15px;
    margin-bottom: 15px;
    margin-right: 0; }

  section#distribution-ouvert-au-public {
    min-height: 134vw;
    padding-top: 80px;
    padding-bottom: 60px; }

  section#distribution-ouvert-au-public div.texte ul {
    columns: 1; }

  section#distribution-ouvert-au-public div.absolute {
    display: none; }

  section#distribution-ouvert-au-public div.texte {
    max-width: 100%; }

  section#distribution-metaux-usages-mobile div.texte {
    padding: 20px 15px 0; }

  section#distribution-grand-distributeur {
    min-height: 82vw; }

  section#distribution-grand-distributeur div.texte h2 br {
    display: none; }

  section#distribution-grand-distributeur div.texte h2 br:last-of-type {
    display: block; }

  section#distribution-grand-distributeur div.texte {
    padding: 0 15px; }

  section#distribution-quincaillerie div.texte {
    max-width: 100%;
    margin-top: 115vw; }

  section#distribution-quincaillerie div.absolute-img {
    top: 41vw;
    width: 100%; }

  section#distribution-quincaillerie div.absolute-titre span {
    font-size: 119px;
    white-space: nowrap; }

  section#distribution-quincaillerie div.absolute-titre span br {
    display: block; }

  section#armature-entete div.ranger-mobile div.colonne-mobile {
    width: 100%;
    padding-top: 0; }

  section#armature-entete {
    background-size: 274%;
    background-position: top;
    padding-top: 200px; }

  section#armature-entete.armature div.ranger-mobile div.colonne-mobile {
    width: 100%;
    padding-top: 0; }

  section#armature-experts-conseils div.colonne div.bg {
    padding: 60px 30px; }

  section#armature-experts-conseils div.colonne:first-of-type {
    width: 100%;
    padding-right: 15px;
    position: relative;
    z-index: 1;
    height: auto; }

  section#armature-experts-conseils {
    margin-top: 80px; }

  section#armature-experts-conseils div.colonne:last-of-type {
    width: 100%;
    height: 126vw;
    margin-top: -50px; }

  section#distribution-entreposage.armature {
    height: 108vw;
    padding-bottom: 0;
    margin-bottom: 60px; }

  section#distribution-quincaillerie.armature div.texte {
    max-width: 100%;
    margin-top: 115vw; }

  section#distribution-quincaillerie.coupe-dacier div.texte {
    max-width: 100%;
    margin-top: 115vw; }

  section#autres-produits-entete div.colonne div.texte {
    margin-top: 106px;
    max-width: 100%; }

  section#autres-produits-entete div.colonne {
    width: 100%; }

  section#autres-produits-entete div.colonne div.img {
    display: none; }

  section#autres-produits-ponceaux div.colonne {
    width: 100%; }

  section#autres-produits-membrane div.container div.ranger div.colonne:first-of-type {
    width: 88%;
    height: 152px;
    margin-top: 60px;
    margin-left: 12%; }

  section#autres-produits-membrane div.container div.ranger div.colonne:last-of-type {
    width: 100%;
    margin-top: 137px;
    padding-left: 0; }

  section#autres-produits-ponceaux div.background div.ranger div.colonne {
    width: 100%;
    margin-bottom: 15px; }

  section#autres-produits-ponceaux div.background {
    background-size: auto 111%;
    background-repeat: no-repeat;
    background-position: top right;
    height: auto;
    margin-top: 0;
    background-image: none !important; }

  section#autres-produits-ponceaux div.background div.ranger {
    padding-top: 15px;
    width: 100%; }

  section#autres-produits-membrane {
    margin-top: 0;
    position: relative;
    margin-bottom: 80px; }

  section#autres-produits-ponceaux div.background div.ranger div.colonne div.bg {
    padding: 30px 15px; }

  section#autres-produits-membrane div.absolute {
    position: absolute;
    left: 0;
    top: 0;
    bottom: initial;
    width: 40%;
    margin-top: 156px;
    opacity: 0; }

  section#autres-produits-revetement div.colonne {
    width: 100%; }

  section#distribution-quincaillerie div.container {
    padding: 0 15px;
    width: 100%; }

  section#distribution-quincaillerie.autres-produits div.texte {
    max-width: 100%;
    margin-top: 104vw; }

  section#autres-produits-slogan {
    padding-bottom: 0;
    padding-top: 0; }

  section#distribution-quincaillerie.autres-produits div.absolute-titre {
    top: 40px; }

  section#distribution-quincaillerie.autres-produits div.absolute-img {
    top: 30vw; }

  section#slides-revetements div.ranger div.colonne:first-of-type {
    width: 100%;
    padding-right: 0px;
    padding-bottom: 30px; }

  section#slides-revetements div.ranger div.colonne:last-of-type {
    width: 100%;
    padding-left: 0; }

  section#slides-revetements div.ranger {
    padding: 60px 15px 30px; }

  section#autres-produits-ponceaux div.colonne div.texte {
    margin-top: 80px; }

  section#autres-produits-ponceaux img.mobile-ponceaux {
    display: block;
    margin-top: 60px; }

  section#autres-produits-entete {
    height: 170vw; }

  section#autres-produits-ponceaux {
    margin-top: calc( -160vw + 260px); }

  section#autres-produits-entete div.colonne:last-of-type {
    display: none; }

  section#ponceaux-slide div.colonne:first-of-type {
    padding-left: 15px;
    width: 100%;
    padding-right: 15px; }

  section#ponceaux-slide div.colonne, section#tuyaux-slide div.colonne {
    width: 100%; }

  section#ponceaux-entete {
    min-height: 92vw; }

  section#ponceaux-entete div.texte h1 {
    margin-top: 115px; }

  section#ponceaux-slide div.colonne:last-of-type div.abs {
    top: initial;
    bottom: -44%;
    right: 0;
    width: 75%; }

  section#ponceaux-selection {
    display: none; }

  section#ponceaux-selection-mobile {
    display: block;
    padding-top: 37vw; }

  section#tuyaux-slide div.colonne:last-of-type div.abs {
    top: initial;
    bottom: -44%;
    left: 0;
    width: 75%; }

  section#drains-selection {
    display: none; }

  section#drains-selection-mobile {
    display: block;
    padding-top: 37vw; }

  section#distribution-grand-distributeur.ponceaux {
    min-height: 129vw; }

  section#nos-secteurs-activite.ponceaux div.colonne:last-of-type div.ranger-col div.col {
    width: 50%; }

  section#ponceaux-transport-surdimensionnes div.colonne {
    width: 100%; }

  section#ponceaux-transport-surdimensionnes div.image-absolute {
    position: relative;
    width: 100%;
    bottom: 0vw;
    right: -15px;
    opacity: 0;
    margin-top: 40px; }

  section#piece div.container h1 {
    padding: 0 15px;
    max-width: 356px; }

  section#piece div.container div.animation div.gauche, section#piece div.container div.animation div.droite {
    display: none; }

  section#piece div.container img.entete {
    width: 100%; }

  section#piece div.container div.ranger-bouton div {
    flex: initial;
    padding: 7.5px 15px;
    width: 100%; }

  section#piece div.container div.ranger-bouton div button {
    height: 57px; }

  section#piece div.container div.ranger-tuile div.tuile {
    width: 33.3333%;
    padding: 7.5px; }

  section#piece div.container div.ranger-tuile {
    width: calc( 100% + 45px );
    margin-left: -22.5px;
    margin-right: -22.5px; }

  section#piece div.container div.ranger-tuile div.tuile div.bg {
    padding-bottom: 15px; }

  section#piece div.container div.ranger-tuile div.tuile div.bg img {
    margin: 15px auto; }

  section#piece div.container div.description-ranger div.colonne:first-of-type, section#piece div.container div.description-ranger div.colonne:last-of-type {
    width: calc(100% - 60px);
    margin-left: 30px;
    padding-right: 0;
    margin-right: 30px;
    padding-top: 30px; }

  section#piece div.container div.description-ranger div.colonne {
    border-right: none; }

  section#service-conseil {
    min-height: 130vw; }

  section#quincaillerie-entete div.entete p, section#quincaillerie-entete div.entete div#formulaire label, div#formulaire section#quincaillerie-entete div.entete label, section#quincaillerie-entete div.entete div#formulaire input, div#formulaire section#quincaillerie-entete div.entete input, section#quincaillerie-entete div.entete div#formulaire textarea, div#formulaire section#quincaillerie-entete div.entete textarea, section#quincaillerie-entete div.entete section#entete-poste h4, section#entete-poste section#quincaillerie-entete div.entete h4 {
    max-width: 100%; }

  section#quincaillerie-entete {
    min-height: 800px; }

  section#quincaillerie-entete div.entete {
    margin-top: 132px; }

  section#quincaillerie-entete div.container {
    padding: 0 15px; }

  section#quincaillerie-entete div.image-absolute {
    width: 100%;
    max-width: 400px; }

  section#quincaillerie-des-outils-de-qualites div.colonne:first-of-type {
    display: none !important; }

  section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type {
    width: calc( 100% - 30px);
    margin-left: 15px; }

  section#quincaillerie-des-outils-de-qualites div.colonne:last-of-type div.bg {
    padding: 35px 15px;
    width: 100%;
    top: 0;
    left: 0; }

  section#quincaillerie-produits div.ranger div.colonne {
    width: 100%;
    padding: 30px 15px; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type {
    width: 100%;
    order: 1; }

  section#quincaillerie-conseil div.ranger div.colonne:first-of-type {
    width: 100%;
    order: 2;
    margin-top: -20vw;
    padding: 0 15px; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img {
    top: 0; }

  section#quincaillerie-conseil div.ranger div.colonne:last-of-type div.img-absolute {
    bottom: 25vw;
    left: 2vw;
    width: 89vw;
    position: relative; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne {
    width: 100%;
    margin-bottom: 15px; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.icon {
    width: 28vw;
    height: 23vw; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne h5 {
    font-size: 40px; }

  section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg p, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire label, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg label, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire input, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg input, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg div#formulaire textarea, div#formulaire section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg textarea, section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg section#entete-poste h4, section#entete-poste section#quincaillerie-en-chiffre div.container div.ranger div.colonne div.bg h4 {
    font-size: 20px !important; }

  section#quincaillerie-slogan {
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    min-height: 120vw;
    margin-top: 0; }

  section#quincaillerie-slogan h2 {
    padding-top: 56vw; }

  section#entreprise-entete div.container div.texte {
    width: 100%;
    right: initial;
    padding: 30px 15px 30px;
    position: relative;
    margin-top: 72vw; }

  section#entreprise-entete div.image-absolute {
    width: 100%;
    bottom: initial;
    top: 370px;
    left: 0;
    position: absolute;
    order: 1; }

  section#entreprise-entete {
    height: auto; }

  section#entreprise-entete div.container {
    position: relative;
    height: inherit; }

  section#entreprise-entete div.absolute_texte {
    top: 160px; }

  section#entreprise-entete {
    padding-top: 300px; }

  section#entreprise-histoire div.ranger div.colonne:first-of-type {
    width: 100%; }

  section#entreprise-histoire div.ranger div.colonne:last-of-type {
    width: 100%;
    padding-right: 0; }

  section#entreprise-histoire div.ranger div.colonne span.absolute {
    top: 13px;
    left: 0;
    font-size: 117px; }

  section#entreprise-histoire div.ranger div.colonne h3 {
    padding-top: 82px; }

  section#entreprise-familiale {
    background-image: none !important; }

  img.mobile-entreprise-familiale {
    display: block;
    width: 100%;
    padding-left: 15px; }

  section#entreprise-specialiste div.bg div.colonne {
    width: calc( 100%  );
    padding: 40px 15px; }

  section#entreprise-specialiste div.bg {
    width: calc( 100% - 10px);
    order: 1; }

  section#entreprise-specialiste div.container {
    order: 1; }

  section#entreprise-specialiste {
    padding-bottom: 80px;
    display: flex;
    flex-direction: column; }

  section#entreprise-specialiste div.absolute-img {
    position: relative;
    order: 2;
    width: 100%;
    margin-top: -40px; }

  section#entreprise-clientele div.ranger div.colonne:first-of-type {
    width: 100%; }

  section#entreprise-clientele div.ranger div.colonne:last-of-type {
    width: 100%; }

  section#entreprise-clientele div.container {
    padding: 0 15px 0 15px; }

  section#entreprise-projets {
    min-height: 109vw; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(1) {
    height: auto;
    top: 0;
    position: relative;
    width: 100%;
    padding: 7.5px 15px; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.col:nth-child(2) {
    width: 100%;
    bottom: 0;
    position: relative;
    height: auto;
    padding: 7.5px 15px; }

  section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(1) {
    height: auto;
    top: 0;
    position: relative;
    width: 100%;
    right: 0;
    padding: 7.5px 15px; }

  section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(2) {
    height: auto;
    width: 100%;
    bottom: 0;
    position: relative;
    right: 0;
    padding: 7.5px 15px; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type div.bg, section#entreprise-superieur div.ranger div.colonne:last-of-type div.bg {
    padding: 35px 15px; }

  section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) {
    padding: 7.5px 15px; }

  section#entreprise-superieur div.ranger div.colonne:first-of-type, section#entreprise-superieur div.ranger div.colonne:nth-of-type(2), section#entreprise-superieur div.ranger div.colonne:last-of-type {
    margin-bottom: 0; }

  section#entreprise-superieur, section#entreprise-superieur div.ranger div.colonne:last-of-type div.col:nth-child(2) {
    padding-bottom: 0; }

  section#contact-map div.coordonnees {
    width: calc(100% - 30px);
    left: 15px;
    position: relative;
    padding: 35px 15px;
    margin-top: 15px;
    overflow: hidden; }

  section#contact-map ul li:after {
    width: 24px;
    height: 30px;
    left: -33px; }

  section#contact-map ul {
    padding-left: 33px; }

  section#contact-map div.col:first-of-type {
    width: 100%; }

  section#contact-map div.col:last-of-type {
    width: 100%; }

  section#contact-map div.col:first-of-type p, section#contact-map div.col:first-of-type div#formulaire label, div#formulaire section#contact-map div.col:first-of-type label, section#contact-map div.col:first-of-type div#formulaire input, div#formulaire section#contact-map div.col:first-of-type input, section#contact-map div.col:first-of-type div#formulaire textarea, div#formulaire section#contact-map div.col:first-of-type textarea, section#contact-map div.col:first-of-type section#entete-poste h4, section#entete-poste section#contact-map div.col:first-of-type h4 {
    margin-bottom: 0; }

  section#contact-map div.col:last-of-type p, section#contact-map div.col:last-of-type div#formulaire label, div#formulaire section#contact-map div.col:last-of-type label, section#contact-map div.col:last-of-type div#formulaire input, div#formulaire section#contact-map div.col:last-of-type input, section#contact-map div.col:last-of-type div#formulaire textarea, div#formulaire section#contact-map div.col:last-of-type textarea, section#contact-map div.col:last-of-type section#entete-poste h4, section#entete-poste section#contact-map div.col:last-of-type h4 {
    margin-top: 0; }

  section#contact-map div.icon {
    top: 24px; }

  section#contact-form div.ranger div.colonne:last-of-type {
    padding: 0 15px;
    padding-top: 30px; }

  section#contact-form div.ranger div.colonne:last-of-type h2 {
    margin-bottom: 1.55em; }

  div#formulaire textarea {
    height: 318px; }

  section#contact-form div.ranger div.colonne:first-of-type {
    display: flex;
    min-height: 150vw;
    order: 2;
    width: 100%; }

  section#contact-form div.ranger div.colonne:last-of-type {
    order: 1; }

  section#contact-form div.ranger div.colonne:first-of-type div.texte {
    display: block; }

  section#contact-form div.ranger div.colonne:first-of-type h3 {
    font-size: 31px; }

  section#contact-form div.ranger div.colonne:first-of-type h3 strong {
    font-size: 40px; }

  section#demande-de-prix-form div.container-form {
    padding: 133px 15px 0; }

  section#demande-de-prix-form div.bleu {
    margin-top: 24px; }

  section#cueillette-livraison div.contenu div.ranger div.colonne {
    text-align: left; }

  section#cueillette-livraison div.contenu div.ranger div.colonne div.bg {
    padding: 35px 15px; }

  section#cueillette-livraison.demande-de-prix {
    padding-bottom: 0;
    margin-bottom: -15px; }

  section#carriere-entete {
    min-height: 140vw; }

  section#carriere-entete h1 {
    padding-top: 32vw; }

  section#carriere-entete div.container {
    padding: 0 15px; }

  section#carriere-entete h1 br {
    display: none; }

  section#carriere-entete h1 br:last-of-type {
    display: none; }

  section#carriere-entete div.absolute-img {
    position: absolute;
    right: 0;
    bottom: 50px;
    z-index: 1;
    width: 100%; }

  section#nos-services-accueil.carriere div.colonne:last-of-type div.ranger div.tuile {
    padding-bottom: 65%;
    height: 0; }

  section#nos-services-accueil.carriere div.colonne:first-of-type div.conteneur-puce {
    left: 15px;
    width: calc(100% - 15px); }

  section#carriere-humain div.ranger div.colonne:last-of-type {
    width: 100%;
    order: 1; }

  section#carriere-humain div.ranger div.colonne:first-of-type {
    width: 100%;
    order: 2;
    height: 120vw; }

  section#carriere-humain div.ranger div.colonne:last-of-type div.bg {
    position: relative;
    width: calc(100% - 15px);
    margin-left: 0;
    padding: 35px 15px 35px 30px;
    top: 10px; }

  section#carriere-postulez {
    margin-top: 100px; }

  section#carriere-postulez div.container div.post {
    padding: 35px 15px 15px;
    margin-bottom: 30px; }

  section#carriere-postulez div.container div.post div.colonne:first-of-type {
    width: 100%; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type {
    width: 100%;
    padding-left: 0; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a button {
    width: 262px; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type div a button:first-of-type {
    margin-bottom: 30px; }

  section#poste-form div.colonne:last-of-type {
    padding: 15px; }

  section#poste-form.carriere div.colonne:last-of-type h2 {
    top: 0;
    margin-bottom: 40px; }

  div#formulaire button#televerser {
    display: none; }

  section#poste-form div#formulaire .frm_submit button {
    margin-top: -1em; }

  section#poste-form {
    padding-bottom: 40px; }

  section#entete-poste div.colonne:first-of-type {
    width: 100%; }

  section#entete-poste div.colonne:last-of-type {
    width: 100%;
    padding: 0; }

  section#entete-poste div.colonne:first-of-type div.bg {
    padding: 40px 15px 60px;
    margin-top: 71px; }

  section#entete-poste div.colonne:first-of-type div.bg h4 {
    margin-top: 3em; }

  section#poste-slogan {
    min-height: 120vw;
    background-size: contain;
    background-position: bottom; }

  section#poste-slogan h2 {
    padding-bottom: 35vw; }

  section#page-404 span.absolute {
    font-size: 119px !important;
    top: 80px;
    z-index: 4; }

  section#page-404 h1 {
    position: relative;
    z-index: 1;
    margin: 0;
    margin-top: -6px;
    padding-left: 80px; }

  section#page-404 div.container {
    padding: 0px 15px;
    padding-top: 182px; }

  section#page-404 p, section#page-404 div#formulaire label, div#formulaire section#page-404 label, section#page-404 div#formulaire input, div#formulaire section#page-404 input, section#page-404 div#formulaire textarea, div#formulaire section#page-404 textarea, section#page-404 section#entete-poste h4, section#entete-poste section#page-404 h4 {
    margin: 0;
    margin-bottom: 1em; }

  section#page-404 button {
    padding: 10px;
    width: 100%;
    margin-left: 0;
    margin-bottom: 3em; }

  section#autres-produits-livraison {
    height: 197vw;
    background-size: 300%;
    background-position-y: 131px; }

  section#autres-produits-livraison div.etiquette {
    width: 100%;
    padding: 30px 15px; }

  section#autres-produits-livraison div.container {
    padding: 0 15px; }

  section#map h2 {
    margin-bottom: 1em; }

  section#armature-entete div.ranger-mobile div.colonne-mobile div.col:last-of-type button {
    padding: 10px 30px;
    width: 100%; }

  section#distribution-quincaillerie div.texte button {
    padding: 10px 25px; }

  section#armature-experts-conseils div.colonne div.bg button {
    padding: 10px 25px; }

  section#ponceaux-slide div.colonne:first-of-type div.texte button {
    padding: 10px 25px; }

  section#page-404 p br, section#page-404 div#formulaire label br, div#formulaire section#page-404 label br, section#page-404 div#formulaire input br, div#formulaire section#page-404 input br, section#page-404 div#formulaire textarea br, div#formulaire section#page-404 textarea br, section#page-404 section#entete-poste h4 br, section#entete-poste section#page-404 h4 br {
    display: none; }

  div#nav-mobile div.compte {
    padding-left: 15px; }

  div#nav-mobile div.phone li:after {
    left: 15px; }

  div#nav-mobile div.phone li {
    padding-left: 75px; }

  footer div.ranger {
    width: calc( 100% - 30px ); }

  footer div.copyright div.ranger-copy {
    width: calc( 100% - 30px); }

  footer div.ranger div.colonne {
    padding: 0; }

  section#slides-revetements {
    display: none; }

  section#autres-produits-revetement {
    margin-top: -80px;
    margin-bottom: 45px; }

  section#ponceaux-selection-mobile.revetements {
    padding-top: 0; }

  section#autres-produits-revetement div.colonne:last-of-type {
    order: 1; }

  section#autres-produits-revetement div.colonne:first-of-type {
    order: 2;
    margin-top: 25px; }

  section#ponceaux-selection-mobile.revetements div.tab div.ranger-content div.colonne:first-of-type {
    border-bottom: none; }

  section#carousel p.pagination a, section#carousel div#formulaire label.pagination a, div#formulaire section#carousel label.pagination a, section#carousel div#formulaire input.pagination a, div#formulaire section#carousel input.pagination a, section#carousel div#formulaire textarea.pagination a, div#formulaire section#carousel textarea.pagination a, section#carousel section#entete-poste h4.pagination a, section#entete-poste section#carousel h4.pagination a {
    height: 44%; }

  section#carriere-postulez div.container div.post div.colonne:last-of-type {
    padding-bottom: 0px; } }
@media screen and (max-width: 525px) {
  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col {
    width: 100%;
    min-height: 40vw; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col div.absolute {
    top: 51%; }

  section#nos-secteurs-activite div.colonne:last-of-type div.ranger-col div.col img {
    max-height: 35vw;
    max-width: 30vw; }

  section#distribution-secteurs-activites div.contenu div.colonne {
    width: 100%;
    min-height: 49vw; }

  section#distribution-secteurs-activites div.contenu div.colonne img {
    max-width: 61%;
    max-height: 77%;
    position: initial; }

  section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre {
    top: 64%;
    transform: translate(-50%, -50%); }

  section#distribution-secteurs-activites div.contenu div.colonne div.absolute-titre span.popup {
    font-size: 49px; }

  section#nos-secteurs-activite.ponceaux div.colonne:last-of-type div.ranger-col div.col {
    width: 50%; }

  #bouton-mobile {
    width: 38px; }

  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(5) img {
    max-width: 36vw; }

  section#selection-produit-accueil div.colonne:last-of-type {
    padding-top: 10%;
    padding-bottom: 10%; }

  section#map div.colonne-image svg {
    transform: scale(1.35) translate(5%, 12%);
    position: absolute; }

  section#map div.colonne-image {
    position: relative;
    height: 78vw;
    overflow: hidden; }

  section#distribution-secteurs-activites div.contenu h2 {
    margin-bottom: 60px; }

  section#distribution-metaux-usages-mobile div.image img {
    margin-top: -150px; }

  section#distribution-avantages.armature div.ranger {
    margin-top: 30px; }

  section#distribution-grand-distributeur.armature {
    height: 104vw; }

  section#carousel.coupe-dacier h2 {
    margin-top: 60px; }

  section#distribution-entreposage.coupe-dacier, section#distribution-entreposage.transformation {
    height: 101vw;
    margin-top: -30vw; }

  section#piece div.container div.description-ranger div.colonne button {
    width: 100%; }

  section#piece div.container div.description-ranger div.colonne:first-of-type {
    padding-bottom: 35px; }

  section#autres-produits-ponceaux div.background {
    background-size: auto 61%;
    background-position: bottom right; }

  section#quincaillerie-entete {
    min-height: 900px; }

  section#nos-services-accueil.entreprise div.colonne:last-of-type div.ranger {
    margin-bottom: -6px;
    margin-left: 23px; }

  section#entreprise-specialiste div.absolute-img img {
    height: 80vw;
    object-fit: cover; }

  section#entreprise-superieur div.ranger div.colonne:nth-of-type(2) div.bg {
    background-size: 142% auto;
    height: 120vw; }

  section#distribution-secteurs-activites div.contenu div.colonne:last-of-type {
    margin-top: 10vw; }

  section#nos-secteurs-activite div.colonne:last-of-type.active div.ranger-col div.col:nth-child(4) {
    margin-top: 10vw; }

  section#distribution-service-conseil div.ranger div.colonne:last-of-type div.texte button {
    padding: 10px 20px;
    width: 100%; }

  section#distribution-entreposage h2 strong {
    font-size: 36px !important; }

  section#distribution-avantages div.ranger div.colonne:nth-child(1) button {
    padding: 10px 20px;
    width: 100%; }

  section#distribution-quincaillerie.transformation div.texte {
    margin-top: 0; } }
/* end landing page */

/*# sourceMappingURL=styles.css.map */