 /*
 Theme Name: RemSEO - Underscore Starter
 Theme URI: https://www.themeisle.com/
 Description: A child theme based on underscore
 Author: Rémi COLIN
 Template: underscore
 URI: https://www.remseo.fr
 Version: 1.2
--------------------------------------------*/
 /*---------------------
Primary HTML
----------------------*/
 @font-face {
     font-family: 'Proxima Nova Lt';
     src: url('css/fonts/proxima-nova-light.eot');
     src: url('css/fonts/proxima-nova-light.eot?#iefix') format('embedded-opentype'), url('css/fonts/proxima-nova-light.woff') format('woff'), url('css/fonts/proxima-nova-light.woff2') format('woff2'), url('css/fonts/proxima-nova-light.ttf') format('truetype');
     font-weight: normal;
     font-style: normal;
 }

 @font-face {
     font-family: 'Proxima Nova Th';
     src: url('css/fonts/proxima-nova-thin.eot');
     src: url('css/fonts/proxima-nova-thin.eot?#iefix') format('embedded-opentype'), url('css/fonts/proxima-nova-thin.woff') format('woff'), url('css/fonts/proxima-nova-thin.woff2') format('woff2'), url('css/fonts/proxima-nova-thin.ttf') format('truetype');
 }

 @font-face {
     font-family: 'Proxima Nova Rg';
     src: url('css/fonts/proxima-nova-regular.eot');
     src: url('css/fonts/proxima-nova-regular.eot?#iefix') format('embedded-opentype'), url('css/fonts/proxima-nova-regular.woff') format('woff'), url('css/fonts/proxima-nova-regular.woff2') format('woff2'), url('css/fonts/proxima-nova-regular.ttf') format('truetype');
 }

 @font-face {
     font-family: 'Proxima Nova Bd';
     src: url('css/fonts/proxima-nova-bold.eot');
     src: url('css/fonts/proxima-nova-bold.eot?#iefix') format('embedded-opentype'), url('css/fonts/proxima-nova-bold.woff') format('woff'), url('css/fonts/proxima-nova-bold.woff2') format('woff2'), url('css/fonts/proxima-nova-bold.ttf') format('truetype');
 }

 @font-face {
     font-family: 'jahan';
     src:
         url('css/fonts/jahan.ttf') format('truetype'),
         url('css/fonts/jahan.woff') format('woff'),
         url('css/fonts/jahan.svg#jahan') format('svg');
     font-weight: normal;
     font-style: normal;
     font-display: block;
 }

 [class^="icn-"], [class*=" icn-"] {
     /* use !important to prevent issues with browser extensions that change fonts */
     font-family: 'jahan' !important;
     speak: none;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     line-height: 1;
     /* Better Font Rendering =========== */
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
 }

 .icn-instagram:before {
     content: "\e905";
 }

 .icn-facebook-square:before {
     content: "\e900";
 }

 .icn-chevron-right:before {
     content: "\e901";
 }

 .icn-chevron-left:before {
     content: "\e902";
 }

 .icn-arrow-thin-right:before {
     content: "\e903";
 }

 .icn-arrow-thin-left:before {
     content: "\e904";
 }

 *, html, body {
     font-size: 17px;
     font-family: 'Proxima Nova Lt', sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     -webkit-text-size-adjust: 100%;
     -ms-text-size-adjust: 100%;
 }

 body {
     background: #ffffff;
     margin: 0;
     overflow-x: hidden;
     color: #696969;
     line-height: 1.25rem;
 }

 #content {}

 /* Usefull to fix main content after js interactivities sometimes */
 /* Testing link highligting */
 h1, h2, h3, h4, h5, h6 {
     margin-top: 20px;
     color: #000000;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     letter-spacing: 4px;
     line-height: initial;
     font-weight: normal;
 }

 h1:first-child,
 h2:first-child,
 h3:first-child,
 h4:first-child,
 h5:first-child,
 h6:first-child {
     margin-top: 0;
 }

 h1 {
     font-size: 1.6rem;
 }

 h2 {
     font-size: 1.5rem;
 }

 h3 {
     font-size: 1.3rem;
 }

 h4 {
     font-size: 1.2rem;
 }

 h5 {
     font-size: 1.1rem;
 }

 h6 {
     font-size: 1rem;
 }

 h1.separator:after {
     content: "";
     position: relative;
     display: block;
     border-bottom: 1px solid #000000;
     width: 75%;
     margin: 0 auto;
     padding: 5px 0;
 }

 h2.light, h3.light, h4.light, h5.light, h6.light {
     color: #696969;
 }

 p {
     margin-bottom: 20px;
 }

 p:last-of-type {
     margin-bottom: 0;
 }

 a {
     text-decoration: none;
     color: #696969;
     transition: all ease-in 200ms;
 }

 a:visited {
     color: #000;
 }

 a:hover, a:focus, a:active {
     text-decoration: none;
     color: #aaaaaa;
 }

 b, strong, dfn {
     font-family: 'Proxima Nova Bd', sans-serif;
     font-weight: normal;
 }

 section {
     position: relative;
     width: 80%;
     margin: 0 auto;
 }

 section.full-wrapper {
     width: 100%
 }

 figure.no-marged {
     margin: 0;
 }

 .img-cover {
     height: 100%;
     -o-object-fit: cover;
     object-fit: cover;
 }

 .post,
 .page {
     margin: 0;
 }

 .page article:not(.metier-page, .panel-post) {
     margin-top: 125px;
 }

 @media all and (max-width: 1400px) {
     section {
         width: 90%;
     }
 }

 @media all and (max-width: 1280px) {
     section {
         width: 100%;
     }
 }

 @media all and (max-width: 768px) {
     .page article {
         margin-top: 0;
     }
 }

 .edit-link {
     position: absolute;
     top: 0;
     left: 0;
     z-index: 101;
 }

 .post-edit-link {
     display: block;
     background-color: #000;
     color: #fff;
     font-family: 'Proxima Nova Rg', sans-serif;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: .8rem;
     padding: 3px 5px;
 }

 .post-edit-link:hover {
     color: #fff;
     background-color: #333;
 }

 .post-edit-link:visited {
     color: #fff;
 }

 .filariane {
     position: relative;
     margin-left: 65px;
     margin-top: 30px;
     z-index: 1;
     text-transform: uppercase;
     font-style: italic;
     letter-spacing: 2px;
     transition: all ease-in 400ms;
 }

 /*fixing breadcrumbs span generated by yoast seo */
 .filariane span,
 .filariane a,
 .filariane strong {
     color: #000;
     font-size: 0.6rem;
 }

 @media all and (max-width: 1024px) {
     .filariane {
         ;
         margin-left: 0;
         margin-top: 0;
         padding: 10px 20px;
     }
 }

 /*--------------------------------
Default template minor fixings
---------------------------------*/
 .default-page .grid {
     margin-bottom: 10%;
 }

 .default-page .grid h2 {
     text-align: left;
     right: 5%;
     position: relative;
 }

 /*--------------------------
ACF bloc text
---------------------------*/
 .container-bloc-text {
     margin-top: 50px;
 }

 .title-bloc-text {
     margin-bottom: 70px;
 }

 .content-bloc-text {
     margin-left: 50px;
     padding-left: 40px;
     border-left: 1px solid #000000;
 }

 .content-bloc-text p {
     font-size: 18px;
     font-size: 1.05rem;
     color: #000;
     line-height: 24px;
     line-height: 1.33rem;
     text-align: justify;
 }

 .footer-bloc-text {
     margin-top: 90px;
     margin-left: 90px;
 }

 /* End ACF bloc text */
 /* Default */
 .content-default-page {
     padding-top: 40px;
     padding-bottom: 60px;
 }

 .content-default-page .entry-content {
     width: 100%;
     margin: 60px auto 0;
 }

 .entry-page p,
 .entry-page strong,
 .entry-page span,
 .entry-page li,
 .entry-page dl {
     color: #000;
 }

 @media all and (max-width: 1280px) {
     .content-default-page {
         padding: 40px 20px 60px;
     }

     .content-default-page .entry-content {
         margin: 0 auto;
     }
 }

 @media all and (max-width: 1024px) {
     .content-default-page {
         padding-top: 20px;
         padding-bottom: 30px;
     }

     .container-bloc-text {
         margin-top: 0;
     }

     .title-bloc-text {
         margin-bottom: 40px;
     }

     .footer-bloc-text {
         margin-top: 40px;
         margin-bottom: 20px;
     }
 }

 @media all and (max-width: 768px) {
     .content-bloc-text {
         margin-left: 0;
         padding-left: 20px;
     }
 }

 @media all and (max-width: 576px) {
     .title-bloc-text {
         margin-bottom: 20px;
     }

     .content-bloc-text {
         padding-left: 0;
         border-left: 0;
     }

     .footer-bloc-text {
         margin-top: 20px;
         margin-left: 0;
     }

     .footer-bloc-text .material-cta:before {
         content: none;
     }
 }

 /* End Default */

 /*--------------------------
Secondaries elements
---------------------------*/
 .light-bg {
     background: #fff;
 }

 .gray-bg {
     background: #f2f2f2;
 }

 .light-gray-bg {
     background: #fcfafb;
 }

 .entry-content {
     width: 90%;
     margin: 10px auto 0 auto;
 }

 .full-h {
     position: relative;
     height: 100%;
 }

 .full-w {
     width: 100%;
 }

 .centered {
     text-align: center;
     margin: 0 auto;
 }

 .flex-centered {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .flex-centered-start {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     justify-content: flex-start;
     -webkit-justify-content: flex-start;
     -ms-flex-pack: flex-start;
 }

 .flex-centered-end {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     justify-content: flex-end;
     -webkit-justify-content: flex-end;
     -ms-flex-pack: flex-end;
 }

 .flex-end-centered {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: flex-end;
     -webkit-align-items: flex-end;
     -ms-flex-align: flex-end;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .flex-start-centered {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: flex-start;
     -webkit-align-items: flex-start;
     -ms-flex-align: flex-start;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .flex-end-start {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: flex-end;
     -webkit-align-items: flex-end;
     -ms-flex-align: flex-end;
     justify-content: flex-start;
     -webkit-justify-content: flex-start;
     -ms-flex-pack: flex-start;
 }

 .flex-end-end {
     display: flex;
     display: -ms-flexbox;
     display: -webkit-flex;
     align-items: flex-end;
     -webkit-align-items: flex-end;
     -ms-flex-align: flex-end;
     justify-content: flex-end;
     -webkit-justify-content: flex-end;
     -ms-flex-pack: flex-end;
 }

 .column {
     flex-direction: column;
 }

 .hero {
     max-height: 85vh;
     width: 100%;
     position: relative;
 }

 @media all and (max-width: 1024px) {
     .hero {
         max-height: inherit;
     }
 }

 .prel {
     position: relative;
 }

 .top-z {
     z-index: 3;
 }

 /*-------------------
 Home styling
---------------------*/
 /* Featured project box */
 .home-slider-pretitle {
     display: block;
     font-size: 0.75rem;
     text-transform: uppercase;
     letter-spacing: 2px;
     color: #999999;
     margin-bottom: 16px;
 }

 .project-featured {
     position: absolute;
     right: auto;
     left: 50%;
     bottom: -100px;
     z-index: 999;
     width: 835px;
     display: flex;
     flex-direction: row;
     align-items: flex-end;
     padding: 0;
 }

 @media all and (max-width: 1670px) {
     .project-featured {
         right: 7%;
         left: auto;
     }
 }

 @media all and (max-width: 1300px) {
     .project-featured {
         right: 0;
     }
 }

 @media all and (max-width: 1200px) {
     .project-featured {
         bottom: 0;
         min-height: auto;
     }
 }

 @media all and (max-width: 1024px) {
     .project-featured {
         position: relative;
         right: inherit;
         left: inherit;
         bottom: inherit;
         z-index: 999;
         width: 100%;
     }
 }

 .p-nav {
     position: relative;
     background: #000000;
     margin-top: auto;
     height: 203px;
     width: 203px;
     flex: 0 0 203px;
     margin-bottom: 0;
     display: flex;
     flex-direction: row;
     justify-content: center;
     align-items: center;
 }

 @media all and (max-width: 1024px) {
     .p-nav {
         position: absolute;
         bottom: 100%;
         right: 0;
         background: #000000;
         height: 100px;
         width: 203px;
     }
 }

 @media all and (max-width: 768px) {
     .p-nav {
         height: 50px;
         width: 100px;
     }
 }

 .p-main-content {
     background: #ffffff;
     max-width: calc(100% - 203px);
     flex: 1;
     padding: 37px 90px 30px;
 }

 /* Adjusting slick slider height */
 .p-main-content .home-slider-text,
 .p-main-content .slick-list,
 .p-main-content .slick-track,
 .p-main-content .slick-slide {
     height: 100%;
     width: 100%;
 }

 @media all and (max-width: 1200px) {
     .p-main-content {
         padding: 20px 40px;
     }
 }

 @media all and (max-width: 1024px) {
     .p-main-content {
         max-width: 100%;
         background-color: #f2f2f2;
     }
 }

 @media all and (max-width: 768px) {
     .p-main-content {
         padding: 20px;
     }
 }

 .icon-container {
     width: 50%;
     text-align: center;
     margin: 40% 0 40% 0;
 }

 .icon-container i {
     cursor: pointer;
     font-size: 3rem;
     color: #fff;
 }

 .icon-container i:hover,
 .icon-container i:focus {
     color: #333;
 }

 .icon-container.left {
     float: left;
 }

 .icon-container.right {
     float: right;
 }

 .icon-separator {
     position: absolute;
     top: 50%;
     left: 50%;
     width: 1px;
     height: 24px;
     margin-top: -12px;
     background-color: #fff;
 }

 @media all and (max-width: 768px) {
     .icon-container i {
         font-size: 1rem;
     }
 }

 .home-slider-title {
     margin: 0 0 25px 0;
     padding: 0;
     color: #000000;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     line-height: initial;
     font-size: 22px;
     font-size: 1.4rem;
     letter-spacing: 3px;
 }

 p.home-slider-description {
     margin: 0 0 30px 0;
     font-size: 18px;
     font-size: 1.05rem;
     line-height: 24px;
     line-height: 1.3rem;
 }

 /* Dual sections */
 .inner-services-content {
     position: relative;
     padding: 20px 0;
     height: 100%;
 }

 .subtext {
     position: absolute;
     transform: rotateZ(-90deg) translateY(-50%);
     top: 50%;
     left: -6%;
     font-size: 0.75rem;
     text-transform: uppercase;
     letter-spacing: 2px;
     color: #999;
 }

 .ontext {
     margin-bottom: 5px;
     font-size: 0.75rem;
     text-transform: uppercase;
     letter-spacing: 2px;
     color: #999;
 }

 @media all and (max-width: 1180px) {
     .subtext {
         position: relative;
         transform: inherit;
         top: inherit;
         left: inherit;
         width: 90%;
         display: block;
         margin: 0 auto 20px;
     }
 }

 @media all and (max-width: 768px) {
     .subtext {
         width: 100%;
     }

     .inner-services-content {
         padding: 20px;
     }
 }

 figure.home-legended {
     max-width: 47%;
     margin: 0 32% 0 auto;
     padding-bottom: 16%;
 }

 .subtext-2 {
     position: absolute;
     transform: rotateZ(0deg);
     color: #b4b4b4;
     top: 9%;
     left: 48.75%;
     font-size: 0.75rem;
     letter-spacing: 2px;
     text-transform: uppercase;
 }

 .dual-img figure {
     position: relative;
 }

 .img-fix-home {
     max-height: initial !important;
 }

 .dual-img .caption-home {
     position: absolute;
     width: 54% !important;
     height: 30% !important;
     padding: 0;
     bottom: -4% !important;
     z-index: 1;
     color: #fff;
     background: #000000;
 }

 .cta-dual-home {
     margin-top: 40px;
 }

 /* Last articles blog section  */
 .actu-home {
     width: 90%;
     margin: 5.75% auto 4.5% 8%;
 }

 @media all and (max-width: 1280px) {
     .actu-home {
         margin: 0 auto;
     }
 }

 @media all and (max-width: 768px) {
     .actu-home {
         width: 100%;
         padding-left: 10px;
         padding-right: 10px;
     }
 }

 .actu-title {
     margin-top: 5%;
 }

 .actu-home .emphazing {
     margin-bottom: 60px;
     margin-top: 0;
     font-size: 2.65rem;
     line-height: 3rem;
     letter-spacing: 6px;
     text-align: left;
     color: #000000;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
 }

 .f-article {
     padding: 5px;
 }

 .f-article figure {
     margin: 0;
 }

 @media all and (min-width: 1024px) {
     .f-article {
         padding: 0;
     }
 }

 @media all and (min-width: 1980px) {
     .icon-container {
         margin: 30.5% 0 30.5% 0;
     }
 }

 @media all and (max-width: 1390px) {
     .actu-home .emphazing {
         font-size: 2rem;
         line-height: 2.4rem;
         letter-spacing: 6px;
     }
 }

 @media all and (max-width: 1280px) {
     .icon-container {
         margin: 40% 0 40% 0;
     }

     .actu-home .emphazing {
         margin-bottom: 20px;
     }
 }

 @media all and (max-width: 1024px) {
     .icon-container {
         margin: 45% 0 45% 0;
     }

     .dual-img .caption-home {
         height: 28%;
         width: 50%;
     }

     figure.home-legended {
         max-width: 70%;
         margin: 0 auto;
     }
 }

 @media all and (max-width: 768px) {
     .icon-container {
         margin: 6.5% 0 6.5% 0;
     }
 }

 @media all and (max-width: 576px) {
     .slick-container h1 {
         text-align: center
     }

     figure.home-legended {
         max-width: 90%;
         margin: 0 auto;
         padding-bottom: 16%;
     }

     .subtext-2 {
         top: 0%;
         left: 5.75%;
     }

     .cta-dual-home-2 {
         width: 90%;
         margin: 0% 0% 5% 5%;
     }

     .actu-title {
         margin: 5% auto;
     }

     .dual-img .caption-home {
         right: -5% !important;
     }
 }

 /* Main CTA */
 .cta-home-actu {
     display: inline-block;
     background: #fff;
     color: #000;
     font-size: 0.8rem;
     letter-spacing: 2px;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-align: center;
     padding: 12px;
     border: 1px solid #000000;
     transition: 400ms ease-in-out all;
     text-transform: uppercase;
 }

 .cta-home-actu:hover {
     background: #000000;
     color: #fafafa;
 }

 .cta-home-actu:before {
     content: '';
     padding: 0;
     margin: 0;
 }

 .material-cta {
     display: inline-block;
     background: #000000;
     border: 1px solid #000;
     color: #ffffff;
     text-transform: uppercase;
     font-size: 0.8rem;
     letter-spacing: 3px;
     width: auto;
     min-width: 210px;
     padding: 10px 15px;
     text-align: center;
     text-shadow: none;
     transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
 }

 .material-cta.wadjust {
     max-width: 180px;
     width: 50%;
 }

 .material-cta:before {
     content: '';
     background: url('./images/arrow-cta-jahan.png');
     padding: 8px 12px;
     margin-right: 27px;
     background-size: contain;
     background-repeat: no-repeat;
     background-position-y: 50%;
 }

 .material-cta:visited {
     color: #ffffff;
 }

 .material-cta:hover {
     background-color: #fff;
     color: #000;
 }

 .material-cta:hover:before {
     background-image: url('./images/arrow-cta-jahan-black.png');
 }

 /* Just some class for animate.css */
 .hidden {
     opacity: 0;
 }

 .delay-1 {
     animation-delay: .25s;
 }

 .delay-2 {
     animation-delay: .5s;
 }

 .delay-3 {
     animation-delay: .75s;
 }

 .delay-4 {
     animation-delay: 1s;
 }

 /* Keep adding delay if you animate more than 5 visible elements in viewport */
 /*------------------------------
 "Metier" Template
-------------------------------*/
 .metier-page #main-content {
     background: #fff;
 }

 .hero-metier {
     max-height: 72vh;
     width: 100%;
     overflow: hidden;
     position: relative;
 }

 .metier-container-title {
     padding-top: 250px;
     background-color: #fcfafb;
     height: 100%;
     display: flex;
     flex-direction: column;
 }

 .metier-title {
     margin-top: auto;
     margin-bottom: auto;
     font-family: 'Proxima Nova Th', sans-serif;
     font-size: 2rem;
     color: #fff;
     text-align: right;
     position: relative;
     left: 10%;
 }

 .page-title span {
     background: #000000;
     display: inline-block;
     margin: 5px 0;
     padding: 3px;
     font-size: 2rem;
 }

 .container-image-metier {
     max-height: 72vh;
     position: relative;
     height: 100%;
 }

 .metier-section {
     padding: 90px 95px 80px;
 }

 .metier-content {
     padding-left: 90px;
     padding-right: 40px;
 }

 .metier-content * {
     line-height: 28px;
     line-height: 1.6rem;
     font-size: 17px;
     font-size: 1rem;
     color: #000000;
     text-align: justify;
 }

 .metier-content a:hover {
     text-decoration: underline;
     color: #000;
 }

 .metier-separator {
     background-color: #000;
     width: 1px;
     height: 100%;
     margin: 0 auto;
 }

 @media all and (max-width: 1400px) {
     .metier-section {
         padding: 50px 40px 50px;
     }

     .metier-content {
         padding-left: 0;
     }

     .page-title span {
         font-size: 1.8rem;
     }
 }

 @media all and (max-width: 1280px) {
     .page-title span {
         font-size: 1.6rem;
     }
 }

 @media all and (max-width: 1280px) {
     .page-title span {
         font-size: 1.4rem;
         margin: 0;
     }
 }

 @media all and (max-width: 768px) {
     .metier-container-title {
         padding-top: 118px;
     }
 }

 p.sidebar-metier-title {
     margin: 0 auto 10% auto;
     text-transform: uppercase;
     font-family: 'Proxima Nova Lt', sans-serif;
     color: #000000;
     font-size: 1.6rem;
     line-height: initial;
     letter-spacing: 0;
 }

 @media all and (max-width: 1024px) {
     .sidebar-metier {
         margin-top: 30px;
     }

     p.sidebar-metier-title {
         margin: 0 auto;
     }
 }

 .material-cta .cta-metier-arrow {
     content: '';
     position: absolute;
     background-image: url('./images/arrow-cta-jahan-black.png');
     width: 24px;
     height: 16px;
     top: 40%;
     left: 5%;
     background-size: contain;
     background-repeat: no-repeat;
     background-position-y: 50%;
 }

 .material-cta.light-metier {
     position: relative;
     width: 300px;
     background: #fff;
     font-size: 1rem;
     letter-spacing: 1px;
     color: #000000;
     text-align: left;
     text-transform: initial;
     margin-top: 25px;
     padding: 5.4% 3% 5.4% 14%;
     border: 1px solid #000000;
     transition: 400ms ease-in-out all;
 }

 .material-cta.light-metier:visited {
     color: #000000;
 }

 .material-cta.light-metier:hover {
     background: #000000;
     color: #fafafa;
 }

 .material-cta.light-metier:hover .cta-metier-arrow {
     background-image: url('./images/arrow-cta-jahan.png');
 }

 .material-cta.light-metier::before {
     content: none;
 }

 @media all and (max-width: 1024px) {
     .metier-section {
         padding: 20px;
     }

     .metier-content {
         padding-right: 0;
     }
 }

 @media all and (max-width: 1024px) {
     .material-cta.light-metier {
         padding: 20px 20px 20px 60px;
     }
 }

 @media all and (max-width: 768px) {
     .hero-metier {
         height: 100%;
     }

     .title {
         background: transparent;
     }

     .metier-title {
         text-align: left;
         left: 20px;
         top: inherit;
         margin-bottom: 20px;
     }

     .page-title span {
         font-size: 1.2rem;
     }

     #intro-metier .flex-centered-end {
         justify-content: center;
         -webkit-justify-content: center;
         -ms-flex-pack: center;
     }

     .sidebar-metier {
         margin-top: 10px;
     }

     .metier-section {
         padding-top: 0;
     }
 }

 @media all and (max-width: 576px) {
     .material-cta .cta-metier-arrow {
         top: 30%;
     }

     p.sidebar-metier-title {
         font-size: 1.4rem;
     }
 }

 @media all and (max-width: 360px) {
     .material-cta.light-metier {
         width: 100%;
     }
 }

 /*-----------------------------------
ACF - Dual Sections
------------------------------------*/
 .f-service-content {
     position: relative;
     height: 100%;
     max-width: 45%;
     width: 100%;
     margin: 0 auto;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .f-service-content.service-alt {
     margin: 0 auto 0 -2%;
     max-width: 90%;
 }

 @media all and (max-width: 1180px) {
     .f-service-content.service-alt {
         margin: 0;
         max-width: 90%;
         padding: 20px 0;
     }
 }

 @media all and (max-width: 768px) {
     .f-service-content.service-alt {
         max-width: 100%;
         padding: 20px;
     }
 }

 .f-service-content h2 {
     margin-bottom: 40px;
 }

 .f-service-content p {
     font-size: 18px;
     font-size: 1.05rem;
     line-height: 24px;
     line-height: 1.33rem;
 }

 .f-service-content p:first-of-type {
     margin-top: 0;
 }

 .f-service-content p:last-of-type {
     margin-bottom: 0;
 }

 @media all and (max-width: 1180px) {
     .f-service-content {
         height: auto;
         max-width: 90%;
     }
 }

 @media all and (max-width: 768px) {
     .f-service-content {
         max-width: 100%;
     }
 }

 .grid-reverse .f-service-content {
     width: 90%;
     margin-left: 0;
 }

 figure.legended {
     max-width: 72%;
     margin: 0 24% 0 auto;
     padding-bottom: 16%;
 }

 .dual-img img {
     position: relative;
     z-index: 2;
     cursor: default !important;
 }

 .dual-img figcaption {
     position: absolute;
     width: 270px;
     height: 270px;
     display: flex;
     align-items: flex-end;
     padding: 0;
     bottom: -4%;
     right: -10%;
     padding: 0 0 15px 10px;
     z-index: 1;
     color: #fff;
     background: #000000;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 0.8rem;
 }

 .default-page .dual-img figcaption {
     bottom: -2.5px;
 }

 .cta-dual {
     width: 70%;
     margin-left: 5%;
 }

 .grid-reverse .cta-dual {
     width: 70%;
     margin-left: 0 !important;
 }

 @media all and (max-width: 1280px) {
     figure.legended {
         max-width: 90%;
         margin: auto;
         padding-bottom: 0;
     }

     .default-page .dual-img figcaption {
         bottom: inherit;
         position: relative;
         right: inherit;
         margin-top: -170px;
         margin-left: auto;
     }
 }

 @media all and (max-width: 1280px) and (min-width: 1024px) {
     .default-page .dual-img figcaption {
         margin-right: -60px;
     }
 }

 @media all and (max-width: 1024px) {
     figure.legended {
         max-width: 90%;
         margin: auto;
         padding-bottom: 0;
     }
 }

 @media all and (max-width: 768px) {
     .dual-img figcaption {
         width: auto;
         height: auto;
         padding: 20px 30px;
     }

     .default-page .dual-img figcaption {
         margin: 0 auto;
     }

     .services-container ul {
         margin: 0;
         padding: 0;
         width: 90%
     }

     figure.legended {
         max-width: 100%;
         margin: 0 auto;
         padding-bottom: 0;
     }

     .cta-dual {
         margin: 0;
     }

     .cta-dual .material-cta {
         width: 60%;
         margin: 0px 7%
     }
 }

 @media all and (max-width: 567px) {
     .default-page .dual-img figcaption {
         margin: 0 0 0 auto;
     }
 }

 .fading-text p {
     font-size: 1.2rem;
     line-height: 26px;
     opacity: 0;
     color: #3c3c3c;
 }

 .fading-text {
     max-width: 90%;
     position: relative;
     margin: 0 auto;
     padding: 15px;
     opacity: 0;
     box-shadow: -4px 4px 6px #000000;
 }

 @media all and (max-width: 768px) {
     .fading-text {
         max-width: 95%;
     }
 }

 /*------------------------------
Blog archive and single posts
-------------------------------*/
 .no-results {
     display: inline-block;
     margin-top: 40px;
     margin-bottom: 80px;
     padding: 20px 30px;
     background-color: #000;
 }

 .no-results h2 {
     margin-bottom: 0;
     color: #fff;
     font-size: 1.3rem;
 }

 .no-results .page-content {
     margin-top: 0;
 }

 .no-results .page-content p {
     color: #fff;
     font-size: 18px;
 }

 .cat-container {
     max-width: 100%;
     margin-bottom: 40px;
 }

 .categories-list {
     list-style: none;
     width: 64%;
     display: flex;
     flex-direction: row;
     justify-content: flex-end;
     padding: 0;
     margin: 20px auto;
     z-index: 2;
 }

 .categories-list li {
     margin-left: 50px;
     z-index: 2;
 }

 .categories-list li:first-child {
     margin-left: 0;
 }

 .categories-list li a.active {
     position: relative;
 }

 .categories-list li a.active:after {
     content: ' ';
     position: absolute;
     left: 0;
     width: 100%;
     height: 3px;
     background-color: #000;
     bottom: -8px;
 }

 /* JS added class */
 .categories-list li a {
     font-size: 0.75rem;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     letter-spacing: 2px;
     color: #000000;
     transition: 800ms ease-in-out all;
 }

 .categories-list li a:hover {
     color: #696969;
 }

 .select-order {
     display: none;
 }

 .select-order label {
     font-size: 0.75rem;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     letter-spacing: 2px;
     color: #000000;
     margin-right: 10px;
 }

 @media all and (max-width: 1540px) {
     .categories-list {
         width: 80%;
     }
 }

 @media all and (max-width: 1400px) {
     .categories-list {
         width: 100%;
         padding: 0 20px 0 0;
     }
 }

 @media all and (max-width: 900px) {
     .categories-list {
         display: none;
     }

     .select-order {
         display: block;
     }
 }

 p.archive-post-title {
     min-height: 100px;
     margin-top: 0;
     text-align: left;
     letter-spacing: 2px;
     font-size: 18px;
     font-size: 1.05rem;
     color: #000000;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     line-height: 1.5rem;
 }

 .post-feed {
     width: 80%;
     margin: 30px auto 0;
 }

 .post-feed .post-thumbnail {
     width: 100%;
     height: auto;
 }

 .post-feed .post-thumbnail figure {
     position: relative;
     margin: 0;
 }

 .loop-item-excerpt {
     background: #f2f0f1;
     padding: 20px 30px;
     margin: 0 auto;
 }

 .loop-item-excerpt .archive-post-title {
     margin-bottom: 12px;
     text-align: left;
     letter-spacing: 3px;
     font-size: 1.2rem;
 }

 p.archive-excerpt {
     margin-top: 0;
     margin-bottom: 30px;
     color: #000000;
     font-size: 16px;
     font-size: .95rem;
     line-height: 1.15rem;
 }

 .loop-item-excerpt .material-cta {
     font-size: 0.7rem;
     font-family: 'Proxima Nova Bd', sans-serif;
 }

 @media all and (max-width: 900px) {
     .loop-item-excerpt .material-cta {
         padding: 10px 5px;
     }

     .loop-item-excerpt .material-cta:before {
         margin-right: 15px;
     }
 }

 .pagination {
     list-style: none;
     padding: 0;
     display: flex;
     width: 100%;
     margin: 0 auto 30px;
     background: transparent;
     flex-direction: row;
     justify-content: center;
     align-items: center;
 }

 .pagination li {
     margin: 0 5px;
     border-bottom: 1px solid #f2f0f1;
 }

 .pagination li span.current {
     border-bottom: 1px solid #000000;
 }

 .post h1 {
     text-align: center;
     margin: 50px auto;
 }

 .single-post .post-thumbnail {
     margin-bottom: 60px;
 }

 .single-post .post-thumbnail img {
     display: block;
     margin: 0 auto;
 }

 .single-post-content {
     margin-bottom: 80px;
 }

 .single-post-content * {
     color: #000;
     line-height: 1.5rem;
     text-align: justify;
 }

 .single-post-content p:first-of-type {
     margin-top: 0;
 }

 .single-post .entry-content {
     width: 100%;
     background: #fcfafb;
 }

 .single-post-footer {
     margin-bottom: 80px;
     text-align: center;
 }

 @media all and (max-width: 1280px) {
     .loop-item-excerpt .material-cta {
         width: 90%;
     }
 }

 @media all and (max-width: 1024px) {
     .loop-item-excerpt .material-cta {
         width: 100%;
         min-width: auto;
     }

     .cat-container {
         max-width: 100%;
         display: flex;
         flex-direction: row;
         flex-wrap: wrap;
         justify-content: space-between;
         margin-bottom: 20px;
         padding-left: 10px;
         padding-right: 10px;
     }
 }

 /*
IMPORTANT : The rule below forces equal dimensions on archive images.
May be improved with javascript to reduce scaling issues.
I chose to simply add multiple @media queries to manage it on several display.
*/
 .post-thumbnail .loop-img {
     display: block;
     margin: 0;
     width: 100%;
     object-fit: cover;
 }

 .post-thumbnail a {
     display: block;
 }

 .post-thumbnail a:hover,
 .post-thumbnail a:focus,
 .post-thumbnail a:active {
     opacity: .85;
 }

 /* Other responsive rules for Blog */
 @media all and (max-width: 1400px) {
     .post-feed {
         width: 90%;
     }

     .post h1 {
         margin: 20px auto;
     }

     .single-post .post-thumbnail {
         margin-bottom: 20px;
     }

     .single-post-content,
     .single-post-footer {
         margin-bottom: 40px;
     }
 }

 @media all and (max-width: 1280px) {
     .post-feed {
         width: 100%;
         padding-left: 20px;
         padding-right: 20px;
     }

     .single-post-content,
     .single-post-footer {
         padding-left: 20px;
         padding-right: 20px;
     }
 }

 @media all and (max-width: 768px) {
     .single-post .post-thumbnail {
         max-width: 100%;
     }

     .post h1 {
         margin: 0 auto 10px;
         padding-right: 20px;
         padding-left: 20px;
         font-size: 1.2rem;
     }
 }

 @media all and (max-width: 500px) {
     .post h1 {
         text-align: left;
     }
 }

 /*------------------------------
CPT Projects archive and single
-------------------------------*/
 p.archive-projects-post-title {
     margin-top: 8px;
     margin-bottom: 15px;
     font-size: 1rem;
     letter-spacing: 2px;
     color: #000000;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     line-height: initial;
     font-weight: normal;
 }

 .projects-feed {
     width: 65%;
     margin: 30px auto 0;
 }

 .projects-feed article {
     padding-left: 8px;
     padding-right: 8px;
     margin-bottom: 90px;
 }

 .projects-feed .loop-item-excerpt {
     position: relative;
     padding: 8px 15px 0;
     background: #fcfafb;
     text-align: center;
 }

 .panel-post__link {
     cursor: pointer;
     z-index: 1;
 }

 .projects-feed .projects-thumbnail img {
     width: 100%;
 }

 .projects-feed .projects-thumbnail img.copyright {
     width: auto;
     position: absolute;
     min-height: inherit;
     top: -50px;
     right: 5px;
     max-height: 42px;
 }

 .projects-feed .material-cta {
     max-width: initial;
     padding: 4px 18px;
     font-size: 0.8rem;
     letter-spacing: 2px;
     font-family: 'Proxima Nova Lt', sans-serif;
 }

 .projects-feed .material-cta:before {
     content: none;
 }

 .project-category-link {
     font-size: 0.9rem;
     text-decoration: none;
     color: #6e6e6e;
 }

 .project-category-link:hover {
     text-decoration: underline;
 }

 .project-category-link:visited {
     color: #6e6e6e;
 }

 @media all and (max-width: 1400px) {
     .projects-feed {
         width: 80%;
     }
 }

 @media all and (max-width: 1280px) {
     .projects-feed {
         width: 90%;
     }
 }

 @media all and (max-width: 1024px) {
     .projects-feed {
         width: 100%;
         padding-left: 10px;
         padding-right: 10px;
         margin-top: 0;
     }
 }

 @media all and (max-width: 768px) {
     .projects-feed .material-cta {
         width: 78%;
     }
 }

 /* styling single posts */
 .single-project {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 }

 .single-project .project-main-content {
     flex-basis: 30%;
     max-width: 30%;
 }

 .single-project .project-aside-content {
     flex-basis: 70%;
     max-width: 70%;
 }

 .single-project .project-footer-content {
     flex-basis: 100%;
     max-width: 100%;
     background-color: #fff;
 }

 .single-project .entry-content {
     background: initial;
     width: 100%;
 }

 .single-project .entry-content p {
     line-height: 1.5rem;
 }

 .single-project .entry-content p:first-of-type {
     margin-top: 0;
 }

 .project-main-content {
     position: relative;
     background-color: #fcfbfb;
 }

 .project-main-content .filariane {
     margin: 30px 65px;
 }

 .inner-project-content {
     margin: 60px 65px 0;
     padding-bottom: 20px;
 }

 .project-category-single-link {
     /* padding: 5px; */
     text-decoration: none;
 }

 .project-category-single-link span {
     display: inline;
     background: #000000;
     font-family: 'Proxima Nova Rg', sans-serif;
     text-transform: uppercase;
     font-size: 0.75rem;
     color: #ffffff;
     letter-spacing: 2px;
     padding: 5px;
     box-decoration-break: clone;
     -webkit-box-decoration-break: clone;
 }

 .project-category-single-link:visited {
     color: #fff;
 }

 p.single-project-title {
     margin-top: 20px;
     color: #000000;
     font-family: 'Proxima Nova Bd', sans-serif;
     text-transform: uppercase;
     letter-spacing: 4px;
     line-height: initial;
     font-weight: normal;
     font-size: 1.3rem
 }

 .project-overview {
     width: 100%;
     margin: 10px auto 0 auto;
     padding: 10px 0 10px 0;
 }

 .project-overview:before {
     content: '';
     position: relative;
     width: 80px;
     border-top: 3px solid #000000;
     display: block;
     padding-bottom: 17px;
 }

 .project-overview:after {
     content: '';
     position: relative;
     width: 80px;
     border-bottom: 3px solid #000000;
     display: block;
     padding-top: 17px;
 }

 .project-overview p {
     display: block;
     color: #000;
     font-size: 1rem;
     font-family: 'Proxima Nova Rg', sans-serif;
 }

 .project-overview p:first-of-type {
     margin-top: 0;
 }

 .project-main-img {
     padding-left: 50px;
     height: 66%;
 }

 .project-single-description h1 {
     font-size: 1.3rem;
 }

 .project-single-description p {
     font-size: 16px;
 }

 .project-single-description * {
     color: #000;
     text-align: justify;
 }

 .project-main-content .material-cta {
     margin-top: 60px;
     text-align: center;
     width: auto;
     letter-spacing: 2px;
     max-width: initial;
     padding: 8px 15px 8px 15px;
     font-size: 12px;
     font-size: .7rem;
 }

 .projects-feed.related-feed {
     padding-top: 95px;
 }

 .project-related-header {
     margin-bottom: 40px;
     text-align: center;
 }

 .related-title {
     margin: 0;
     font-size: 29px;
     font-size: 1.7rem;
     line-height: 29px;
     line-height: 1.7rem;
     color: #000;
     font-family: "Proxima Nova Bd", sans-serif;
     text-transform: uppercase;
     letter-spacing: 4px;
 }

 .projects-feed .post-thumbnail {
     filter: gray;
     -webkit-filter: grayscale(1);
     filter: grayscale(1);
     transition: 400ms ease-in-out all;
 }

 .projects-feed article:hover .post-thumbnail {
     -webkit-filter: grayscale(0);
     filter: none;
 }

 /* Adding project gallery style NG */
 .slick-track {
     display: flex;
 }

 .slick-track .slick-slide {
     display: flex;
     height: auto;
 }

 .project-gallery {
     position: relative;
 }

 .project-gallery .copyright {
     position: absolute;
     min-height: inherit;
     bottom: 20px;
     right: 20px;
     max-height: 56px;
 }

 .gallery-img {
     position: relative;
     display: block;
     height: 100%;
     width: 100%;
 }

 .gallery-img img {
     object-fit: cover;
     height: 100%;
 }

 @media all and (max-width: 1540px) {
     .inner-project-content {
         margin: 40px 40px;
     }

     .project-main-content .filariane {
         margin: 30px 40px;
     }

     .project-main-content .material-cta {
         margin-top: 40px;
     }

     .projects-feed.related-feed {
         padding-top: 40px;
     }
 }

 @media all and (max-width: 1400px) {
     .single-project .project-main-content {
         flex-basis: 35%;
         max-width: 35%;
     }

     .single-project .project-aside-content {
         flex-basis: 65%;
         max-width: 65%;
     }

     .projects-feed.related-feed {
         padding-top: 20px;
     }
 }

 @media all and (max-width: 1280px) {
     .single-project .project-main-content {
         flex-basis: 50%;
         max-width: 50%;
     }

     .single-project .project-aside-content {
         flex-basis: 50%;
         max-width: 50%;
     }

     .projects-feed.related-feed {
         padding-top: 40px;
     }

     .project-related-header {
         margin-bottom: 20px;
     }
 }

 @media all and (max-width: 1024px) {
     .single-project .project-main-content {
         flex-basis: 100%;
         max-width: 100%;
     }

     .single-project .project-aside-content {
         flex-basis: 100%;
         max-width: 100%;
     }

     .inner-project-content {
         margin: 20px;
         padding: 0 20px;
     }
     .project-main-content .filariane {
         margin: 20px;
     }
 }

 @media all and (max-width: 768px) {

     .inner-project-content,
     .project-main-content .filariane {
         margin: 0 0 20px;
     }
 }

 /* Stop */
 .gallery-nav {
     position: absolute;
     top: 50%;
     width: 100%;
     margin-top: -24px;
     width: 48px;
     height: 48px;
     color: #ffffff;
     border-radius: 99em;
     background-color: #1c1c1c;
     opacity: .5;
     font-size: 1.4rem;
     line-height: 48px;
     text-align: center;
     cursor: pointer;
     transition: opacity 200ms ease;
 }

 .gallery-nav.prev {
     left: 30px;
 }

 .gallery-nav.next {
     right: 30px;
 }

 .gallery-nav:hover,
 .gallery-nav:focus {
     opacity: 1;
 }

 .slick-container img {
     display: block;
     margin: 0;
     width: 100%;
 }

 @media all and (max-width: 1200px) {
     .slick-container img {
         min-height: 520px;
         max-height: 520px;
     }
 }

 @media all and (max-width: 980px) {
     .slick-container img {
         min-height: 440px;
         max-height: 440px;
     }
 }

 @media all and (max-width: 768px) {
     .slick-container img {
         min-height: 360px;
         max-height: 360px;
     }
 }

 @media all and (max-width: 576px) {
     .slick-container img {
         min-height: 290px;
         max-height: 290px;
     }
 }

 @media all and (max-width: 1400px) {
     .projects-feed article {
         margin-bottom: 40px;
     }
 }

 @media all and (max-width: 768px) {
     .mobile-grid {
         flex-direction: column-reverse;
     }

     .projects-feed article {
         max-width: 100%;
         margin-bottom: 20px;
     }

     .project-main-img {
         padding-left: 0px;
         height: 100%;
     }

     .slick-container img {
         display: block;
         margin: 0;
         width: 100%;
         min-height: 320px;
         max-height: 320px;
     }

     .project-main-content .material-cta {
         margin-top: 20px;
     }
 }

 @media all and (max-width: 450px) {
     .project-main-content .material-cta:before {
         content: none;
     }
 }

 /*------------------------------
 Contact Page
-------------------------------*/
 .contact-main {
     margin: 60px auto 160px;
     width: 85%;
 }

 .contact-page-title {
     margin-bottom: 100px;
     font-size: 1.5rem;
     text-align: center;
 }

 .cf7-section {
     max-width: 75%;
     margin-right: auto;
 }

 .sep-left {
     position: relative;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     text-align: center;
 }

 .sep-left img {
     max-width: 60%;
     margin: 0 auto 60px;
 }

 .contact-info {
     color: #000;
     margin-bottom: 10px;
 }

 .sep-left:before {
     content: "";
     position: absolute;
     width: 1px;
     border-left: 1px solid #000;
     display: block;
     height: 100%;
     left: 0;
 }

 @media all and (max-width: 1540px) {
     .cf7-section {
         max-width: 80%;
     }
 }

 @media all and (max-width: 1400px) {
     .cf7-section {
         max-width: 90%;
     }

     .contact-page-title {
         margin-bottom: 50px;
     }

     .contact-main {
         margin: 30px auto 60px;
     }
 }

 @media all and (max-width: 1280px) {
     .cf7-section {
         max-width: 100%;
     }

     .sep-left:before {
         left: 20px;
     }
 }

 @media all and (max-width: 1024px) {
     .sep-left {
         margin-top: 30px;
     }

     .sep-left:before {
         content: none;
     }
 }

 @media all and (max-width: 768px) {
     .contact-main {
         width: 100%;
         padding-left: 20px;
         padding-right: 20px;
         margin: 20px auto;
     }

     .contact-page-title {
         margin-bottom: 20px;
     }

     .sep-left img {
         max-width: 100%;
         margin-bottom: 10px;
     }
 }

 /* Contact Form 7 - Minimal Design */
 form.wpcf7-form {
     width: 100%;
     margin: 1px auto auto auto;
     border-radius: 3px;
 }

 form.wpcf7-form * {
     transition: 225ms;
 }

 form.wpcf7-form label {
     display: flex;
     width: 100%;
     cursor: pointer;
     margin-bottom: 10px;
 }

 form.wpcf7-form label span {
     min-width: 14%;
     color: #000;
 }

 form.wpcf7-form label span.main-msg {
     min-width: 35%;
 }

 form.wpcf7-form input,
 form.wpcf7-form select,
 form.wpcf7-form textarea {
     display: block;
     width: 100%;
     border: 1px solid #000000;
     background: transparent;
     border-radius: 0;
 }

 form.wpcf7-form input:hover,
 form.wpcf7-form select:hover,
 form.wpcf7-form textarea:hover {
     cursor: pointer;
 }

 form.wpcf7-form input:focus,
 form.wpcf7-form select:focus,
 form.wpcf7-form textarea:focus {
     outline: none;
 }

 form.wpcf7-form input {
     max-height: 30px;
 }

 form.wpcf7-form input,
 form.wpcf7-form textarea {
     background: transparent;
     border: 1px solid #000000;
 }

 form.wpcf7-form textarea {
     max-height: 210px;
 }

 form.wpcf7-form input[type="submit"] {
     margin: 0 0 0 auto;
     max-height: inherit;
     padding: 15px 10px 15px 60px;
     background: #000000;
     color: #ffffff;
     border: 0;
     text-transform: uppercase;
     max-width: 200px;
     letter-spacing: 4px;
     font-size: 14px;
     font-size: .9rem;
     font-family: 'Proxima Nova Bd', sans-serif;
     transition: 200ms ease-in-out all;
     background-image: url('./images/submit-arrow-b.png');
     background-repeat: no-repeat;
     background-position: 12.5% center;
 }

 form.wpcf7-form input[type="submit"]:hover {
     background-color: #1c1c1c;
 }

 input[type="text"],
 input[type="email"],
 input[type="url"],
 input[type="password"],
 input[type="search"],
 input[type="number"],
 input[type="tel"],
 input[type="range"],
 input[type="date"],
 input[type="month"],
 input[type="week"],
 input[type="time"],
 input[type="datetime"],
 input[type="datetime-local"],
 input[type="color"],
 textarea {
     color: #aaaaaa;
     padding: 6px
 }

 input[type="text"]:focus,
 input[type="email"]:focus,
 input[type="url"]:focus,
 input[type="password"]:focus,
 input[type="search"]:focus,
 input[type="number"]:focus,
 input[type="tel"]:focus,
 input[type="range"]:focus,
 input[type="date"]:focus,
 input[type="month"]:focus,
 input[type="week"]:focus,
 input[type="time"]:focus,
 input[type="datetime"]:focus,
 input[type="datetime-local"]:focus,
 input[type="color"]:focus,
 textarea:focus {
     color: #696969;
 }

 .wpcf7-form-control-wrap {
     width: 100%;
     margin: 0 auto;
 }

 select {
     color: #aaaaaa;
 }

 select:focus {
     color: #696969;
 }

 span.wpcf7-not-valid-tip {
     position: relative;
     color: #000;
     font-size: 15px;
     font-size: .9rem;
 }

 div.wpcf7-response-output {
     padding: .5em .75em;
     margin: 20px 0 0;
 }

 @media all and (max-width: 768px) {
     form.wpcf7-form label span {
         min-width: 22%;
     }
 }

 @media all and (max-width: 567px) {
     form.wpcf7-form br {
         display: none;
     }

     form.wpcf7-form label {
         flex-wrap: wrap;
         margin-bottom: 10px;
     }

     form.wpcf7-form label span {
         min-width: 100%;
         display: block;
     }
 }

 /*------------------------
    Footer
----------------------*/
 .main-footer {
     background: #000000;
     color: #ffffff;
     height: 100%;
 }

 .footer-wrapper {
     padding-top: 80px;
     padding-bottom: 80px;
     width: 100%;
 }

 @media all and (max-width: 768px) {
     .footer-wrapper {
         padding-top: 40px;
         padding-bottom: 40px;
     }
 }

 @media all and (max-width: 567px) {
     .footer-wrapper {
         padding-top: 20px;
         padding-bottom: 20px;
     }
 }

 .footer-logo {
     display: block;
     max-width: 70%;
 }

 .footer-logo:hover,
 .footer-logo:focus {
     opacity: .75;
 }

 .footer-menu li a {
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 15px;
     font-size: .9rem;
 }

 .footer-menu li a:hover,
 .footer-menu li a:focus {
     -webkit-box-shadow: inset 0 -1px 0 #fff;
     box-shadow: inset 0 -1px 0 #fff;
 }


 .main-footer .legal {
     background-color: #fff;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-size: 0.8rem;
     padding: 8px 0;
     text-align: center;
 }

 .main-footer .legal p,
 .main-footer .legal a {
     font-size: 14px;
     font-size: .8rem;
 }

 .main-footer .legal p {
     color: #000000;
     margin: 0;
 }

 .main-footer .legal a {
     color: #000;
     text-align: center;
     transition: 400ms ease-in-out all;
 }

 .main-footer .legal a:hover {
     color: #000;
     text-decoration: underline;
 }

 .main-footer .legal .info-link:after {
     content: ' - ';
     color: #000;
     position: relative;
     font-size: 1rem;
 }

 .main-footer .legal .copyright:after {
     content: ' - ';
     color: #000;
     position: relative;
     font-size: 1rem;
 }

 .footer-menu nav {
     width: 100%;
 }

 .footer-menu ul {
     list-style: none;
     display: flex;
     max-width: 90%;
     margin: 10px 0;
     padding: 0;
 }

 .footer-menu ul li {
     margin: 0 auto;
 }

 .footer-menu .sub-menu {
     display: none;
 }

 @media all and (max-width: 1400px) {
     .footer-menu ul {
         max-width: 100%;
     }
 }

 @media all and (max-width: 1024px) {
     .footer-menu ul li {
         margin: 0 3% 0 auto;
         text-align: center;
     }
 }

 @media all and (max-width: 768px) {
     .footer-menu nav {
         display: flex;
         justify-content: center;
     }

     .footer-menu .menu-principal-container {
         margin-right: 65px;
     }

     .footer-menu .menu-item-has-children {
         padding-left: 0;
     }

     .footer-menu ul {
         flex-direction: column;
         max-width: 100%;
     }

     .footer-menu ul li {
         margin: 10px 0;
     }

     .main-footer .legal {
         display: flex;
         flex-direction: column;
     }

     .main-footer .legal a {
         display: inherit;
     }

     .main-footer .legal .info-link:after {
         content: '';
     }

     .main-footer .legal .legal-link:after {
         content: '';
     }
 }

 /*------------------------
Masthead and Navigation
------------------------*/
 /*Informative Header for company infos*/
 .site-header {
     position: relative;
     background: #ffffff;
     height: auto;
     width: 82%;
     min-height: 230px;
     z-index: 100;
     display: flex;
     flex-direction: column;
     flex-wrap: wrap;
 }

 .absolute-header {
     position: absolute;
 }

 .featured-nav.desktop {
     display: block;
 }

 .featured-nav.mobile {
     display: none;
 }

 .featured-nav.mobile .telephone a {
     visibility: hidden;
     font-size: 0;
 }

 .featured-nav.mobile .telephone a:before {
     visibility: visible;
     content: '\f098';
     font-family: FontAwesome;
     font-size: 1.3rem;
 }

 .featured-nav.mobile .email a {
     visibility: hidden;
     font-size: 0;
 }

 .featured-nav.mobile .email a:before {
     visibility: visible;
     content: '\f0e0';
     font-family: FontAwesome;
     font-size: 1.3rem;
 }

 .featured-nav.mobile .email {
     margin: 0 auto;
     padding: 0;
 }

 .featured-nav.mobile .telephone {
     margin: 0 auto 0 0;
     padding: 0;
 }

 .featured-nav.mobile .telephone::after, .featured-nav.mobile .email::after {
     content: "";
     visibility: hidden;
     position: absolute;
     border-right: 0;
     height: 0;
     padding: 0;
     top: 0;
 }

 .featured-nav {
     position: relative;
     z-index: 101;
     margin-left: auto;
     background: #000000;
 }

 .featured-nav ul {
     list-style: none;
     display: flex;
     flex-direction: row;
     margin: 0;
     padding: 6px 15px 6px 30px;
 }

 .featured-nav ul li {
     display: flex;
     flex-direction: row;
     align-items: center;
 }

 .featured-nav ul li a {
     color: #fafafa;
     font-family: 'Proxima Nova Rg', sans-serif;
     text-transform: uppercase;
     font-size: 0.8rem;
     letter-spacing: 3px;
     position: relative;
 }

 .featured-nav ul li a:hover {
     color: #696969;
 }

 .featured-nav li.facebook::after {
     display: none;
 }

 .rs-top-header {
     margin-right: 8px;
 }

 .rs-top-header i {
     font-size: 1.4rem;
 }

 .featured-nav li::after {
     content: "";
     display: inline-block;
     background-color: #fff;
     height: 10px;
     width: 1px;
     margin: 0 30px;
 }

 .featured-nav li:last-child::after {
     content: none;
 }

 .site-branding {
     position: relative;
     display: block;
     max-width: 380px;
     margin-left: 0;
 }

 .site-branding.mobile {
     display: none;
 }

 @media all and (max-width: 1679px) {
     .featured-nav ul li a {
         font-size: 0.8rem;
     }
 }

 @media all and (max-width: 1611px) {
     .site-branding {
         max-width: 350px;
     }
 }

 @media all and (max-width: 1574px) {
     .site-branding {
         max-width: 300px;
     }
 }

 @media all and (max-width: 1540px) {
     .site-header {
         width: 90%;
     }
 }

 @media all and (max-width: 1480px) {
     .featured-nav ul li a {
         font-size: 0.75rem;
     }
 }

 @media all and (max-width: 1400px) {
     .site-header {
         width: 100%;
     }
 }

 @media all and (max-width: 1024px) {
     .featured-nav ul li a {
         text-transform: initial;
     }
 }

 @media all and (max-width: 375px) {
     .featured-nav ul li.telephone {
         width: 15%;
         margin-right: 5%;
     }

     .featured-nav ul li.telephone a {
         visibility: hidden;
         font-size: 0;
         width: auto !important;
         margin: auto !important;
     }

     .featured-nav ul li.telephone a:before {
         visibility: visible;
         content: '\f098';
         font-family: FontAwesome;
         font-size: 24px;
         margin-left: 20%;
     }

     .featured-nav ul li.facebook {
         min-width: 40px;
     }
 }

 /*Main Navigation*/
 .main-navigation {
     position: relative;
     height: 100%;
     display: flex;
     flex: 1;
     align-items: center;
     justify-content: space-between;
     padding: 0 0 0 40px;
 }

 .main-navigation a {
     position: relative;
     font-family: 'Proxima Nova Rg', sans-serif;
     font-size: 1rem;
     transition: 400ms ease-in-out all;
     color: #000000;
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 .main-navigation .menu>.menu-item:hover>a {
     -webkit-box-shadow: inset 0 -1px 0 #3c3c3c;
     box-shadow: inset 0 -1px 0 #3c3c3c;
 }

 .main-navigation .sub-menu>.menu-item:hover>a {
     -webkit-box-shadow: inset 0 -1px 0 #3c3c3c;
     box-shadow: inset 0 -1px 0 #3c3c3c;
 }

 /*Second and third level*/
 .main-navigation .sub-menu {
     width: auto;
     background: #000;
     padding: 35px;
     text-align: left;
 }

 .main-navigation .sub-menu .menu-item {
     width: 100%;
     border-bottom: 1px solid #687577;
 }

 .main-navigation .sub-menu .menu-item:last-child {
     border-bottom: 0;
 }

 .main-navigation .sub-menu .menu-item a {
     display: block;
     padding: 4px 0;
     white-space: nowrap;
     color: #fff;
     margin: 0;
     width: auto;
     min-width: 200px;
     font-size: 14.5px;
     font-size: .9rem;
 }

 .main-navigation .sub-menu .menu-item a::after {
     display: none;
 }

 .main-navigation .menu {
     margin: 0;
     text-align: center;
 }

 .main-navigation .menu-item {
     float: none;
     position: relative;
     display: inline-block;
     line-height: 30px;
     margin-right: 25px;
 }

 /* Mobile navigation button */
 #menu, .sub-menu {
     display: none;
     list-style: none;
 }

 /* The side navigation menu */
 .sidenav {
     height: 100%;
     width: 300px;
     position: fixed;
     z-index: 9999;
     top: 0;
     right: -301px;
     background-color: #fff;
     overflow-x: hidden;
     transition: all .5s ease;
 }

 .sidenav.open {
     right: 0;
 }

 .menu-mobile {
     margin: 0;
     padding: 0;
 }

 .menu-mobile li {
     position: relative;
     list-style: none;
     margin-top: 0;
 }

 .menu-mobile li a {
     position: relative;
     min-height: 40px;
     display: block;
     padding: 12px 40px 12px 20px;
     color: #000;
     text-decoration: none;
     transition: all 200ms ease;
 }

 .menu-mobile li a:hover,
 .menu-mobile li a:focus {
     color: #fff;
     background-color: #1c1c1c;
 }

 .menu-mobile .toggle-submenu {
     position: absolute;
     right: 0;
     top: 0;
     border: 0;
     width: 45px;
     min-width: inherit;
     padding: 0;
     height: 45px;
     border-radius: 0;
     background-color: #fff;
     text-align: center;
     font-size: 1.2rem;
     line-height: 1.2rem;
     color: #000;
     cursor: pointer;
 }

 .menu-mobile .toggle-submenu:hover,
 .menu-mobile .toggle-submenu:focus {
     background-color: #1c1c1c;
     color: #fff;
     transition: all 200ms ease;
 }

 .menu-mobile .sub-menu {
     margin: 0;
     display: none;
     border-top: 1px solid #eee;
     padding: 0;
     border-bottom: 1px solid #eeee;
 }

 .menu-mobile .sub-menu li {
     border-top: 0;
 }

 .menu-mobile .sub-menu li a {
     height: inherit;
     font-size: .9rem;
 }

 .menu-mobile.inverse a {
     background-color: #000;
     color: #fff;
 }

 .container-mobile-rs {
     display: flex;
     flex-direction: row;
     justify-content: center;
     padding-top: 20px
 }

 .rs-mobile {
     margin: 0 5px;
 }

 .rs-mobile i {
     color: #000;
     font-size: 2rem;
 }

 .rs-mobile:hover i,
 .rs-mobile:focus i {
     color: #1c1c1c;
 }

 #close-nav {
     display: block;
     padding: 15px;
     font-size: .9rem;
     text-align: center;
     color: #fff;
     background-color: #000;
 }

 #open-nav {
     display: none;
     margin-right: 20px;
 }

 #open-nav .bar1,
 #open-nav .bar2,
 #open-nav .bar3 {
     width: 30px;
     height: 2px;
     background-color: #000;
     margin: 10px 0;
     transition: all 0.5s ease;
 }

 #open-nav.change .bar1 {
     transform: rotate(-45deg) translate(-11px, 7px);
 }

 #open-nav.change .bar2 {
     opacity: 0;
 }

 #open-nav.change .bar3 {
     transform: rotate(45deg) translate(-9px, -6px);
 }

 .btn-nav-mobile {
     color: #fff;
     text-transform: uppercase;
     text-decoration: none;
     letter-spacing: 2px;
 }

 .hide-body {
     display: none;
     position: fixed;
     height: 100%;
     width: 100%;
     background-color: rgba(0, 0, 0, .5);
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     z-index: 9990;
     cursor: pointer;
 }

 @media all and (max-width: 1540px) {

     .main-navigation ul li:hover>ul,
     .main-navigation ul li.focus>ul {
         right: 0;
     }
 }

 @media all and (max-width: 1280px) {
     .main-navigation .menu-item {
         margin-right: 15px;
     }
 }

 @media all and (max-width: 1180px) and (min-width: 768px) {
     .featured-nav {
         margin-left: 0
     }

     .featured-nav ul {
         justify-content: center;
     }

     .main-navigation {
         flex-wrap: wrap;
         justify-content: center;
     }

     .site-header {
         min-height: 200px;
     }

     .metier-container-title {
         padding-top: 200px;
     }
 }

 @media all and (max-width: 800px) {
     .main-navigation .menu-item {
         line-height: 48px;
     }
 }

 @media all and (max-width: 768px) {

     #FeaturedNav,
     #menu-principal {
         display: none;
     }

     .sub-menu {
         position: relative;
         top: inherit;
         left: inherit;
         border-top: 1px solid #e7e7e7;
         z-index: inherit;
         opacity: 1;
     }

     #open-nav {
         display: block;
     }

     .site-header {
         min-height: auto;
     }

     .main-navigation {
         padding: 20px;
     }
 }

 /* strange behavior fixing for main menu: disapear at 600px */
 @media all and (max-width: 600px) {
     .main-navigation .menu-item {
         line-height: 30px;
     }
 }

 /* 404 */
 .projects-feed.full-width {
     width: 100%;
 }

 .error-404 {
     padding-top: 40px;
 }

 .text-404 {
     line-height: 28px;
     line-height: 1.6rem;
     font-size: 17px;
     font-size: 1rem;
     color: #000000;
 }

 .text-404 a {
     font-family: 'Proxima Nova Bd';
 }

 .text-404 a:hover {
     text-decoration: underline;
 }

 /* Cookie notice */
 .cookie-notice-container {
     padding: 20px 0;
 }

 a.button {
     font-family: 'Proxima Nova Rg';
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 1px;
     border: 1px solid #fff;
     padding: 5px;
     font-size: 14px;
 }

 a.button:hover,
 a.button:focus {
     background-color: #fff;
     color: #000;
 }

/* CF7 reCAPTCHA v3 */

.recaptcha-disclaimer {
	font-size: .875rem;
	text-align: right;
}

.recaptcha-disclaimer a {
	font-size: .875rem;
	text-decoration: underline;
}

.recaptcha-disclaimer a:hover,
.recaptcha-disclaimer a:focus {
	color: #000;
}

.grecaptcha-badge { visibility: hidden; }