/* Frontend editor */
.ct-widget.ct-ignition { position:fixed; left:auto; top:auto; right:20px; bottom:20px; z-index:10000; transition:all 0.5s ease 0s; }
.ct-widget.ct-ignition .ct-ignition__button { position:static; margin-top:10px;}

.ce-element { outline:2px dashed rgba(243, 156, 18, 0.5); }
.ce-element--focused, .ce-element:focus { outline:2px dashed rgba(243, 156, 18, 1); }
/**
 * General Elements
 **/
body{ background-color: #1a1a1a;

    --bs-body-font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    --bs-body-font-size: calc(0.95rem + 0.25vw);
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5em;
    --bs-body-color: #fff;

    --head-font-family: 'Work Sans', Verdana, Geneva, Tahoma, sans-serif;
    --underline50: rgba(255,255,255,0.5);
    --underline20: rgba(255,255,255,0.2);
    --label-opacity: var(--label-opacity);

    --containerWidth: 100%;
    --asideWidth: calc( ((100vw - var(--containerWidth)) / 2) + (1.5rem / 2) );

    --bleu: #8af6f6;

    --headBarH: 10vmin;

    --swiper-theme-color: #1a1a1a;
    --swiper-pagination-color: #8af6f6;
    --swiper-pagination-bullet-inactive-color: #1a1a1a;
}

:focus, button:focus { outline:none; }

/* Images */
img, svg { max-width:100%; height:auto; }
[data-sizes] { display:block; width:100%; }
[data-bg] { background-size:cover; background-repeat:no-repeat; background-position:center center; }
.schema{ filter: invert(0.91); }

/* Headings */
h1, h2, h3, h4,
.h1, .h2, .h3, .h4{ font-family: var(--head-font-family); margin: 0 0 3vmin; line-height: 1.2em; font-weight: normal; }
h1{ color: var(--bleu); font-size: var(--bs-body-font-size); }
.h1{ font-size: calc(1.45rem + 3.5vw); color: var(--bs-body-color); }
h2, .h2{ font-size: calc(1.065rem + 2.5vw); margin-bottom: 7.4vmin; color: var(--bs-body-color); }
h3, .h3{ font-size: calc(0.75rem + 2vw); }
h4, .h4{ font-size: var(--bs-body-font-size); color: var(--bleu); }

/* Paragraphs & lists */
p { margin-bottom: 3vmin; }
#main ol,
#main ul{ margin-bottom: 3vmin; }
#main li:before{ content: '-'; color: var(--bleu); margin-right: 0.2em; }

/* Link */
a { color: var(--bs-body-color); text-decoration:none; }
a:hover { text-decoration:none; color: inherit; }

#main a { color: var(--bs-body-color); text-decoration: underline; text-decoration-color: var(--bleu); text-underline-offset: 0.2em; }
#main a:hover { color: var(--bleu); }
/* #main a { color: var(--bs-body-color); display: inline-flex; align-items: baseline; margin-left: 0.2em; margin-right: 0.2em;}
#main a:before,
#main a:after { content: ''; width: 1em; height: 1em; background: url(../img/fleche.svg) no-repeat 50% 50%; transition: all 0.2s ease-out; transform: translateY(0.15em); }
#main a:before { transform: translateY(0.15em) rotate(180deg); }
#main a:hover:before { transform: rotate(180deg) translate(0.2em, -0.15em); }
#main a:hover:after { transform: translate(0.2em, 0.15em); } */

/* Lists */
ul, ol { margin-bottom:0; padding:0; list-style:none; }
#main ul.h3{ display: flex; align-items: baseline; justify-content: space-between; color: var(--bleu); margin-bottom: 7.4vmin; }
#main ul.h3 li:before{ content: none; }

/**
 * Helper classes
 **/
.bleu{ color: var(--bleu); }
.casper{ display: none; }

.div-lines{ position: relative; z-index: 1; }
.div-lines:before{ content: ''; position: absolute; z-index: 0; top: 0; left: 25%; width: 50%; height: 100%; border-right: 1px solid var(--underline20); border-left: 1px solid var(--underline20); pointer-events: none; }
.div-lines:after{content: ''; position: absolute; z-index: 0; top: 0; left: 50%; width: 0; height: 100%; border-right: 1px solid var(--underline20); pointer-events: none; }
.div-lines.btop,
.div-lines + section{ border-top: 1px solid rgba(255,255,255,0.2); }
/* .div-lines + .div-lines{ border-top: 0; } */
.div-lines>*{ position: relative; z-index: 1; }
.div-lines.one-line:before{ content: none; }

.btn-arrows a{ text-decoration: none !important; white-space: nowrap; position: relative; padding-right: 55px; background: url(../themes/technicarbure/assets/img/fleche.svg) no-repeat calc(100% - 3px) 6px; background-size: 9px 15px; border-bottom: 1px solid var(--bs-body-color); padding-bottom: 10px; margin-right: 0; margin-left: 0; 
    transition: 0.3s ease-out; }
.btn-arrows a:before,
.btn-arrows a:after{ content: ''; width: 9px; height: 15px; order: 2; transform: none; background: url(../themes/technicarbure/assets/img/fleche.svg) no-repeat 50% 50%; background-size: 9px 15px; position: absolute; top: 15px; margin-top: -9px; }
.btn-arrows a:before{ right: 33px; transition: all 0.2s ease-out 0.3s; }
.btn-arrows a:after { right: 18px; transition: all 0.2s ease-out 0.15s; }
.btn-arrows a:hover{ background-position-x: 100%; padding-right: 70px; }
.btn-arrows a:hover:before{ transform: none; right: 28px; }
.btn-arrows a:hover:after{ transform: none; right: 14px; }
/* .btn-arrows a{ text-decoration: none; white-space: nowrap; position: relative; padding-right: 55px; background: url(../img/fleche.svg) no-repeat calc(100% - 3px) 6px; background-size: 9px 15px; border-bottom: 1px solid var(--bs-body-color); padding-bottom: 10px; margin-right: 0; margin-left: 0; transition: 0.2s ease-out 0.3s; }
.btn-arrows a:before,
.btn-arrows a:after{ content: ''; width: 9px; height: 15px; order: 2; transform: none; background: url(../img/fleche.svg) no-repeat 50% 50%; background-size: 9px 15px; position: absolute; top: 15px; margin-top: -9px; }
.btn-arrows a:before{ right: 33px; transition: all 0.2s ease-out 0s; }
.btn-arrows a:after { right: 18px; transition: all 0.2s ease-out 0.1s; }
.btn-arrows a:hover{ background-position-x: 100%; }
.btn-arrows a:hover:before{ transform: none; right: 30px; }
.btn-arrows a:hover:after{ transform: none; right: 15px; } */
#main .btn-link{ border: 1px solid var(--underline20); padding: 3px 10px; text-decoration: none; font-family: var(--head-font-family); font-size: 0.85em; }
#main .btn-link:hover{ background-color: rgb(0 0 0 / 10%); color: #fff; }

.ico{ position: relative; }
.ico:before{ content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: var(--bs-body-color); transition: all 0.2s ease-out; mask-repeat: no-repeat; mask-position: 50% 50%;  -webkit-mask-repeat: no-repeat; -webkit-mask-position: 50% 50%; }
.ico:hover:before{ background-color: var(--bleu); }
.no-text{ text-indent: 100vw; white-space: nowrap; overflow: hidden; }

.video{ position: relative; max-height: calc(100vh - var(--headBarH)); overflow: hidden; display: flex; align-items: center; justify-content: center; margin: 10vmin 0; }
.video:last-child{ margin-bottom: 0; }
.video:after{ content: ''; display: block; width: 100%; height: 0; padding-top: 56.25%; left: 0; top: 0; z-index: -1; pointer-events: none; }
.video iframe{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); 
    width: calc( ((100% * 0.5625) + 120px) * 1.78 ); height:  calc(100% + 125px); }

.video.fullscreen{ min-height: 100%; max-height: none; min-width: 100vw; margin: 0; }
.video.fullscreen:after{ z-index: 1; pointer-events: inherit; height: 100vh; padding-top: 0; }
.video.fullscreen iframe{ width: 100%; height: calc(100vw * 0.5625); min-width: calc((100vh + 120px) * 1.78); min-height: calc(100vh + 120px); }

.fadeout{ opacity: 0; }

.p10{ padding-top: 10vmin; padding-bottom: 10vmin; }
.pt10{ padding-top: 10vmin; }
.pb10{ padding-bottom: 10vmin; }
.p5{ padding-top: 5vmin; padding-bottom: 5vmin; }
.pt5{ padding-top: 5vmin; }
.pb5{ padding-bottom: 5vmin; }
.pb0{ padding-bottom: 0; }
.g5{ margin-left: -5vmin; margin-right: -5vmin; }
.g5>div{ padding-left: 5vmin; padding-right: 5vmin; }
.row.vcenter{ align-items: center; }
.row.vbtm{ align-items: flex-end; }
.flex-between{  display: flex; justify-content: space-between; align-items: center; }

.swiper-container{ position: relative; }
.swiper{ max-height: 90vh; }
.swiper-slide{ max-height: 90vh; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.swiper-pagination-vertical.swiper-pagination-bullets{ right: inherit; left: -7.4vmin; }
.swiper-pagination-bullet{ border-radius: 0; border: 1px solid var(--bs-body-color); opacity: 1; width: 3vmin; max-width: 15px; height: 3vmin; max-height: 15px; box-shadow: inset 0px 0px 0px 3px #1a1a1a; }
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{  margin: 3vmin 0; }

.bg{ position: relative; }
.bg img{ position: absolute; min-width: 100%; max-width: none; min-height: 100%; height: auto; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover; }

.fr{ opacity: 0.5; }

/**
 * Page specific styling
 **/

/* Accueil */
#accueil #main{ margin-top: 0; }
#fullvideo{ position: relative; height: 100vh; padding-top: 0 !important; }
#fullvideo .texte{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; padding-top: var(--headBarH); }
#fullvideo .container{ display: flex; height: 100%; flex-direction: column; justify-content: space-between; padding-top: 10vmin; padding-bottom: 10vmin; }
#fullvideo .video:after{ background-color: rgb(0 0 0 / 50%); backdrop-filter: grayscale(1); }
#sur-mesure img{ display: block; width: 95%; max-width: 540px; margin: 0 auto 3em; }
#sur-mesure p{ max-width: 540px; margin-left: auto; margin-right: auto; }
#produits{ position: relative; background-color: #000; }
#produits .bg-fixed{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;  background-position: 50% 70%; background-size: 100% auto; opacity: 0.5; background-attachment: fixed; }
#produits .container{ position: relative; z-index: 1; }

/* Notre société */
#valeurs p{ max-width: 810px; margin-left: auto; margin-right: auto; }
.metier:first-child{ border-top: 1px solid var(--underline50); padding-top: 3vmin; } 
.metier-titre button{ background-color: transparent; border: 0; border-bottom: 1px solid var(--underline50); color: var(--bs-body-color); width: 100%; 
    padding: 0.2em 0 0.7em; display: flex; align-items: center; justify-content: stretch; }
.metier-titre span.nb{ margin-right: 5vmin; }
.metier-titre span.titre{ width: 100%; text-align: right; }
.metier-titre svg{ width: 12px; margin-left: 5vmin; }
.metier-titre button[aria-expanded="true"] svg path{ transform: scale( 1, -1) translateY(-100%); }
.metier-titre button svg path            { transition: transform 0.5s ease-in 0.15s; }
.metier-titre button svg path:first-child{ transition: transform 0.5s ease-in 0s; }
.metier-titre button svg path:last-child { transition: transform 0.5s ease-in 0.3s; }
.metier .dd{ max-width: 920px; float: right; padding-top: 1vmin; margin-right: calc(5vmin + 24px); margin-bottom: 5vmin; }
.metier .dd + .row{ clear: both; }
.metier .btn-arrows{ text-align: right; margin-top: 5vmin; }

/* Outils sur mesure // Catégories */
#categories{ padding-top: 0; padding-bottom: 0; border-top: 1px solid var(--underline50); }
#categories>.div-lines{ padding-top: 10vmin; padding-bottom: 7.4vmin; }
#categories>.div-lines:before,
#categories>.div-lines:after{ content: none; }
#categories .row.g5:first-child .categorie{ padding-top: 15vmin; }
.categorie{ padding-bottom: 10vmin; padding-top: 5vmin; position: relative; height: 100%; }
.categorie:before{ content: ''; position: absolute; z-index: -1; top: 0; left: 21%; width: 0; height: 100%; border-right: 1px solid var(--underline20); pointer-events: none; }
.categorie .data{ display: flex; flex-direction: column; justify-content: center; }
.categorie p{ margin-bottom: 0.5em; line-height: 1.2em; }
.categorie .btn-arrows{ margin-top: 5vmin; }
.categorie .btn-arrows a{ margin-bottom: 3vmin; display: inline-block; padding-bottom: 7px; }
.categorie .img{ display: flex; align-items: center; justify-content: center; }
.categorie img{ max-width: 100%; width: auto; display: block; max-height: 100%; position: relative; z-index: 1; }

/* Product list */
#filters-wrapper{ margin: 5vmin 0 10vmin; }
#filters-wrapper ul{ display: flex; }
#filters-wrapper li{ margin-right: 5vmin; }
#filters-wrapper a{ text-decoration: none; }
#filters-wrapper a:hover{ text-decoration: underline; }
#filters-wrapper a sup{ margin-left: 0.2em; }
#filters-wrapper .active a{ color: var(--bleu); }

.produit.teaser{ position: relative; display: flex; flex-direction: column; max-width: 380px; margin: 3vmin auto 5vmin; }
.produit.teaser h3{ order: 2; margin-top: 3vmin; font-size: calc(1rem + 1.15vw); }
.produit.teaser .img{ order: 1; background-color: rgb(21 21 21 / 85%); position: relative; height: 430px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.produit.teaser img{ display: block; /*transform: rotate(-90deg);*/ mix-blend-mode: luminosity; }
.produit.teaser a{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.produit.teaser a span{ position: absolute; left: 0; right: 0; top: 0; margin: 95% 3vmin 3vmin; background-color: var(--bs-body-color); color: #000; text-align: center; padding: 0.5em; text-decoration: none; transition: all 0.2s ease-out; opacity: 0; }
.produit.teaser a:hover span{ opacity: 1; }
.produit.teaser .sku{ position: absolute; bottom: 0; right: 1em; font-size: 12px; opacity: .3; }
.produit.teaser .prix{ order: 3; }

/* Product page */
#product .reviews-form .form-check svg { fill:#e9ecef; }
#product .reviews-form .form-check.active svg { fill:#0d6efd; }
#product .reviews-form .form-check .form-check-label { cursor:pointer; }
#product .com-md-5:after{ content: ''; display: block; clear: both; }

#infos-wrapper{ padding-top: 10vmin; }
#product-infos .h2{ margin-bottom: 3.5vmin; }
#product-infos .sku{ margin-bottom: 2vmin; }
#images-wrapper{ width: calc(100% + var(--asideWidth) ); float: right; max-width: 560px; }
#product-infos > div > row:first-child #images-wrapper{ margin-top: calc(var(--headBarH) * -1); }
a[data-fancybox]{ cursor: pointer; overflow: hidden; display: block; transition: transform 0.5s ease-out; }
a[data-fancybox] img{ display: block; transition: transform 0.5s ease-out; }
/* a[data-fancybox]:hover{ transform: scale(0.9); } */
a[data-fancybox]:hover img{ transform: scale(1.05); }


.variants table{ text-align: center; font-size: 0.8em; }
.variants table td{ width: 10%; padding-top: 0; padding-bottom: 0; }
.variants table th{ position: relative; padding-top: 2em; padding-bottom: 1.2em; margin-left: 5%; max-width: 90%; font-weight: normal; font-size: 1.15em; }
.variants table th span[title]{ display: block; text-align: center; }
.variants table th span[title]:before{ content: attr(title); font-weight: normal; font-size: 0.7em; display: block; line-height: 1.1em; position: absolute; top: 0; left: 0; max-height: 2.2em; text-overflow: ellipsis; overflow: hidden; opacity: .3; padding-left: 5%; width: 90%; }
.variants table th span.unit{ position: absolute; bottom: 0; width: 100%; left: 0; font-weight: normal; font-size: .7em; opacity: .3; display: block; }
.variants table th span.unit:before{ content: '('; }
.variants table th span.unit:after{ content: ')'; }
    .quantity-field{ display: flex; max-width: 110px; }
    .quantity-field span{ display: flex; width: 30%; cursor: pointer; min-width: 30px; align-items: center; justify-content: center;}
    .quantity-field .input-number{ overflow: hidden; }
    .quantity-field .input-number.active .form-control{ color: var(--bleu); }
    .quantity-field .form-control{ color: #fff; border-bottom: 0; text-align: center; min-width: 50px; width: calc(100% + 20px); padding-left: 0; padding-right: 0; }
    .quantity-field .form-control:focus{ border-bottom: 0; background-color: transparent; }
    .table-foot{ display: flex; align-items: flex-end; justify-content: space-between; }
    #total-label{ color: var(--bleu); display: block; margin-bottom: .5em; }
    #total-value{ font-family: var(--head-font-family); font-size: calc(0.75rem + 2vw); font-weight: normal; }

    table.geom{ width: 100%; }
    table.geom th{ width: 25%; vertical-align: bottom; }
    table.geom th:first-child{ width: 50%; }
    table.geom tbody td:first-child{ font-weight: normal; font-size: 1.15em; }
    th.rainurage:before  { content: ''; display: inline-block; height: 6vmin; width: 8vmin; background: url(../themes/technicarbure/assets/img/geo-rainurage.svg) no-repeat 0 50%; background-size: contain; }
    th.contournage:before{ content: ''; display: inline-block; height: 6vmin; width: 8vmin; background: url(../themes/technicarbure/assets/img/geo-contournage.svg) no-repeat 0 50%; background-size: contain; }
    th.poche:before      { content: ''; display: inline-block; height: 6vmin; width: 8vmin; background: url(../themes/technicarbure/assets/img/geo-poche.svg) no-repeat 0 50%; background-size: contain; }
    th.copiage:before    { content: ''; display: inline-block; height: 6vmin; width: 8vmin; background: url(../themes/technicarbure/assets/img/geo-copiage.svg) no-repeat 0 50%; background-size: contain; }

#main ul.pagination{}
#main li.page-item:before{ content: none; }
#main li.page-item .page-link{ background-color: transparent; color: #fff; border: 0; text-decoration: none; }
#main li.page-item .page-link:hover{ color: var(--bleu); }
#main li.page-item.active .page-link{ color: var(--bleu); }
#main li.page-item.prev,
#main li.page-item.next{ display: flex; align-items: center; }
#main li.page-item.prev:before{ content: ''; width: 10px; min-width: 10px; height: 15px; background: url(../themes/technicarbure/assets/img/fleche.svg) no-repeat 50% 50%; background-size: contain; transform: rotate(180deg); }
#main li.page-item.next:after{  content: ''; width: 10px; min-width: 10px; height: 15px; background: url(../themes/technicarbure/assets/img/fleche.svg) no-repeat 50% 50%; background-size: contain; }

/* Contact */
#contact #intro .bg img{ width: auto; min-width: 0; left: 100%; transform: translate(-100%, -50%); }
#contact #intro .bg:after{ content: none; }
#map{ position: fixed; max-width: 80%; height: 100%; object-fit: cover; top: 0; right: 0; transform-origin: center top; transition: all 1s ease-out; transform: perspective(100vw) rotateX(5deg); }
#map img{ height: 100%; }
#map:before,
#map:after{ content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(0deg, rgba(26,26,26,1) 0, rgba(26,26,26,0) 10vh); }
#map:after{ content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(90deg, rgba(26,26,26,1) 5vw, rgba(26,26,26,0) 15vw); }

#contact-form{ margin-top: 10vmin; position: relative; padding: 10vmin 0; }
#contact-form:before{ content: ''; position: absolute; z-index: 0; top: 0; left: 25%; width: 50%; height: 100%; border-left: 1px solid var(--underline20); pointer-events: none; }
#contact-form h3{ margin-bottom: 7vmin; }

#newsletter-form{ margin-bottom: 10vmin; }

/* Devis */
#sommaire{ padding: 5vmin 0; }
#sommaire ul{ margin-bottom: 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
#sommaire a{ text-decoration: none; }

#devis-form:before{ content: none; }
#devis-form thead{ display: none; }
.fieldset-group img{ margin-bottom: 2vmin; max-width: 100%; width: auto; }
.fieldset-group figure{ display: inline-block; }
.fieldset-group figure img{ margin-bottom: 0; height: 70px; width: auto; }
.fieldset-group figcaption{ font-style: italic; font-size: 0.95em; }
fieldset.no-margin .form-checkboxes{ margin-bottom: 0; }
fieldset.no-margin .form-floating{ margin-left: 1.1em; }
.attachment { display: flex; align-items: center; justify-content: flex-start; }
.attachment .schema { width: 90px; height: auto; margin-right: 0.5em; }

/* Panier / Big Cart */
.products-list{ border-top: 1px solid var(--underline20); }
.products-list .item{ display: flex; align-items: center; border-bottom: 1px solid var(--underline20); font-size: 0.85em; }
.products-list .item:before{ content: none !important; }
.products-list .item>*{ margin: 0; padding: 1vmin 2vmin; order: 1; }
.products-list .item h2,
.products-list .item h3{ font-size: inherit; width: 100%; font-family: inherit; }
.products-list .item h2 a,
.products-list .item h3 a{ text-decoration: none; }
.products-list .item h2 small,
.products-list .item h3 small{ display: block; opacity: 0.6; margin-top: 0.2em; }
.products-list .item p{ white-space: nowrap; }
.products-list .item .props{ display: flex; justify-content: space-evenly; width: 100%; }
.products-list .item .props p{ margin-bottom: 0; margin-left: 0.5em; }
.products-list .item .prop-name{ opacity: .5; }
.products-list .item .prop-name:before{ content: '('; }
.products-list .item .prop-name:after{ content: ')'; }
.products-list .item .prop13 .prop-name{ display: none; }
.products-list .item .pu{ width: 10%; min-width: 100px; text-align: center; }
.products-list .item .prix{ width: 10%; text-align: right; min-width: 100px; padding-right: 0; }
.products-list .item .delete{ order: 0; padding-left: 0; background: url(../themes/technicarbure/assets/img/close.svg) no-repeat 50% 50%; background-size: 55%; white-space: nowrap; overflow: hidden; text-indent: 200px; text-decoration: none; opacity: 0.8; padding: 0; width: 24px; min-width: 24px; height: 24px; }
.products-list .item .delete:hover{ opacity: 1; }
.products-list .quantity-field .form-control{ color: var(--bleu); }

.order-totals{ min-width: 345px; width: 40%; float: right; margin-top: 10vmin; font-size: 0.85em; }
.order-totals .row{ padding-top: 2.5vmin; padding-bottom: 0.5vmin; align-items: baseline; }
.order-totals .underline{ position: relative; margin-bottom: 1.2em; }
.order-totals .underline:after{ content:''; position: absolute; bottom: 0; left: calc(var(--bs-gutter-x) * 0.5); width: 100%; height: 0; border-bottom: 1px solid var(--underline50); }
.order-totals .row.underline:after{ width: calc(100% - var(--bs-gutter-x)); }
.order-totals .submit{ margin-top: 5vmin; margin-bottom: 5vmin; }
.order-totals .discount-code{ margin: 1em 0 2em; }
.order-totals .discount-code .form-floating { background-color: rgb(0 0 0 / 20%); margin-bottom: 0; }
.order-totals .discount-code .form-floating > label{ padding-left: 0.5em; }
.order-totals .discount-code .btn{ background-color: rgb(0 0 0 / 20%); color: #fff; margin-left: 0; border-bottom: 1px solid var(--underline50); }
.order-totals .discount .label{ display: flex; align-items: center; }
.order-totals .discount .label>*{ order: 1; }
.order-totals .discount .total-label{ display: flex; align-items: center;}
.order-totals .discount .delete{ order: 0; padding-left: 0; background: url(../themes/technicarbure/assets/img/close.svg) no-repeat 50% 50%; background-size: 55%; white-space: nowrap; overflow: hidden; text-indent: 200px; text-decoration: none; opacity: 0.8; padding: 0; width: 24px; min-width: 24px; height: 24px; }
.order-totals .discount .delete:hover{ opacity: 1; }
.order-totals .subtotal{ font-weight: bold; }
.order-totals .total-ht{ margin-top: -1em; border-top: 1px solid var(--underline50); padding-top: 0.2em; }
.order-totals .tax{ opacity: 0.5; }
.order-totals .total-ttc .ttc{ white-space: nowrap; width: auto; }

.order-totals .label{ width: 100%; }
.order-totals .ht,
.order-totals .ttc{ width: 180px; }

.btn-primary,
#main .btn-primary{ font-size: 1.3em; font-family: var(--head-font-family); color: var(--swiper-theme-color); font-weight: 300; background-color: #fff; border: 1px solid #fff; border-radius: 0; width: 100%; padding: 2vmin 0.3em; text-decoration: none; opacity: 0.9; display: inline-block; text-align: center; }
.btn-primary:hover,
#main .btn-primary:hover{ opacity: 1; color: var(--swiper-theme-color); border-color: var(--bleu); }
.btn-check:focus + .btn-primary, 
.btn-primary:focus,
.btn-primary:active:focus, 
.btn-primary.active:focus{ box-shadow: 0 0 0 0.25rem rgb(138 246 246 / 20%); }
#main .btn-primary.btn-sm{ font-size: 1em; }

/* Checkout / overview */
.checkout h1{ margin-bottom: 0; }
.checkout hr{ clear: both; width: 100vw; position: relative; left: 50%; transform: translateX(-50%); margin-top: 0; margin-bottom: 10vmin; }
.checkout .h4{ margin: 8vmin 0 5vmin; }
.checkout .info{ margin-bottom: 10vmin; }
.checkout .method{ margin: 1vmin 0; border: 1px solid var(--underline20); padding: 1.5vmin 2vmin; }
#cart-wrapper:after{ content:''; clear: both; display: block; }
#checkout-overview .products-list .item h3{ padding-left: 0; }
#checkout-overview .products-list .quantity{ color: var(--bleu) }
#checkout-form .use-different-shipping{ margin-top: 1em; }
#checkout-form .coordonnees{ position: relative; padding-bottom: 5vmin;}
#checkout-form .coordonnees .shipping{ margin-bottom: 2.55em; align-items: flex-end; }
#checkout-form .coordonnees:before{ content: ''; position: absolute; top: 0; left: 50%; width: 100vw; height: 0; transform: translateX(-50%); border-bottom: 1px solid var(--underline20); }
.shipping-methods{ margin-bottom: 10vmin; }
.method-logo{ width: 100px; }
.shipping-company{ display: inline-block; margin-left: 0.5em; width: 70px; }
.payment-cgv{ margin: 5vmin 0; }
.payment-submit{ max-width: 400px; }
#checkout-overview .shipping{ align-items: flex-end; }
#checkout-overview .shipping .total-label{ width: 100%; }

.address-selector-form{ border: 1px solid var(--underline20); padding: 0.5em; }

/* Account / Login */
#account-menu{ display: flex; align-items: baseline; justify-content: space-between; font-family: var(--head-font-family); font-size: 0.8em; }
#account-menu .account-info{ order: 2; }
#account-menu ul{ order: 1; display: flex; align-items: center; }
#account-menu ul li:before{ content: none; }
#account-menu ul li:after{ content: '/'; margin: 0.5em; }
#account-menu ul li:last-child:after{ content: none; }
#account-menu ul a{ white-space: nowrap; text-decoration: none; }
#account-menu ul a.active{ color: var(--bleu); }
#account-menu + section{ padding-top: 5vmin; }
.account .info{ margin-bottom: 10vmin; }
.account .h4{ margin: 10vmin 0 3vmin; }
.form-info{ font-size: 0.85em; }
.align-right{ text-align: right; }
.logout{ display: flex; align-items: center; float: right; font-size: 0.85em; }
.logout:after{ content: ''; background: url(../themes/technicarbure/assets/img/close.svg) no-repeat 50% 50%; background-size: 55%; opacity: 0.8; width: 24px; min-width: 24px; height: 24px; }
.logout:after:hover{ opacity: 1; }

.card { background-color: transparent; border-radius: 0; border: 1px solid var(--underline20); }
.badge{ border-radius: 0; }
.badge + .badge{  margin-left: 0.5em; }
.bg-light{ background-color: var(--bleu); opacity: .7; }
.bg-light:hover{ opacity: 1; }
.btn-sm{ border-radius: 0; opacity: 0.9; text-decoration: none !important; }
.btn-sm{ opacity: 1; }
#main a.btn-light{ color: #1a1a1a; text-decoration: none; }

/* Commandes / Order list */
#orders li:before{ content: none; }
.order{ list-style: none; }
.order .th{ display: flex; justify-content: space-between; margin: 0; }
.order .th.nouvelle{ background-color: #8b9338; }
.order .th h2{ margin: 0; }
.order .th h2 small{ font-style: italic; }
.order .th p{ font-size: 16px; margin: 0; }
.order .th.annulee small{ color: #900; }
.order .info{ border: 1px solid var(--underline20); }
.order .info .row{ padding: 0.5em 1em 1em; }
.order figure{  margin: 1em 0; }
.order .meta{display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap;  border-top: 1px solid var(--underline20); padding: 1em; }
.order .meta > div{display: flex; }
.order .status{ min-width: 150px;}
.order .total .value{ font-size: 23px; font-family: var(--head-font-family); margin-top: 0.5rem; }
.order .order-2{ text-align: right; }
.order .order-actions{ display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
.order .order-actions>div{ margin-left: 0.5em; }

.block-border{ border: 1px solid var(--underline20); padding: 1em; }

figure.product-in-cmd-list{ display: flex; align-items: center; }
figure.product-in-cmd-list img{ margin-right: 1rem; max-width: 80px; }

/* Order detail */
#order .info{ border: 1px solid var(--grisC); border-radius: 0 0 3px 3px; padding: 0 1rem; background-color: rgb(255 255 255 / 70%); }
.mini-product-list{ padding: 0; margin-bottom: 1rem;;}
.mini-product-list li{ list-style: none; margin: 0; border-top: 1px solid var(--grisC); padding-top: 1.5rem; padding-bottom: 0.5rem;}
#order .order-totals .subtotal{ font-weight: normal; }
#order .total{ padding: 1rem 0; border-top: 2px solid var(--grisC); font-weight: normal; }
#order .total p{ display: flex; align-items: center; justify-content: flex-end; }
#order .total p.small{ font-style: italic; }
#order .total p.grand{ font-weight: bold; margin-bottom: 0; }
#order .total .value{ width: 100px; text-align: right; }
#order .block-border .col-md-3 li:before{ content: none; }

/**
 * Layout
 **/
.container{ padding: 0 calc(var(--headBarH) * 2); }
section{ padding-top: 10vmin; padding-bottom: 7.4vmin; overflow: hidden; z-index: 0; }


/* Forms */
.invalid-feedback.visible { display:block !important; }

fieldset{ margin-bottom: 5vmin; }
.fieldset-group { border: 1px solid rgb(255 255 255 / 25%); padding: 3vmin; margin-bottom: 5vmin; background-color: rgb(23 23 23 / 80%); position: relative; margin-top: 10vmin; }
.fieldset-group > legend{ margin-top: -6vmin; margin-bottom: 6vmin; margin-left: -0.2rem; font-size: calc(0.75rem + 2vw); }

.field-info{ opacity: var(--label-opacity); font-style: italic; }

.form-floating { margin-bottom: 1em; }
.form-control,
.form-select{ background-color: transparent; border: 0; border-bottom: 1px solid var(--underline50); border-radius: 0; }
.form-control:focus,
.form-select:focus{ color: inherit; background-color: rgb(0 0 0 / 10%); border: 0; border-bottom: 1px solid var(--underline50); outline: 0; box-shadow: none; }
.form-floating .suffix { position: absolute; right: 0; top: 1.1rem; opacity: var(--label-opacity); font-style: italic; font-size: 0.9em; }
.form-floating > label{ opacity: var(--label-opacity); transition: all 0.3s ease-out; padding-left: 0; white-space: nowrap; }
.form-floating.required > label:after{ content: "*"; color: #dc3545; margin-left: 0.2em; }
.form-floating > .form-control, 
.form-floating > .form-select { color: var(--bs-body-color); font-size: inherit; }
.form-floating > .form-control:focus ~ label, 
.form-floating > .form-control:not(:placeholder-shown) ~ label, 
.form-floating > .form-select ~ label{ opacity: var(--label-opacity); }
.form-floating > .form-control:focus ~ label, 
.form-floating > .form-control:not(:placeholder-shown) ~ label, 
.form-floating > .form-select ~ label{ transform: scale(0.85) translateY(-0.8rem); }
.form-floating > .form-select option{ background-color: #171717; }

.form-checkboxes{ margin-bottom: 1em; }
.form-checkboxes > legend{ font-size: inherit; opacity: var(--label-opacity); margin: 0; }
.form-checkboxes.required > legend:after{ content: "*"; color: #dc3545; margin-left: 0.2em; }
.form-check-inline{ display: flex; align-items: center; justify-content: flex-start; }
.form-check-inline .form-check{ padding-right: 1em; }
.form-check{ display: flex; align-items: baseline; padding-left: 0; margin-bottom: .05rem; }
.form-check .form-check-input{ cursor: pointer; margin: 0; min-width: 1.2em; border: transparent none; background-repeat: no-repeat; background-color: transparent; transform: translateY(0.2em); background-position: 0 50%; background-size: 0.8em 0.8em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17'%3E%3Cpath fill='none' stroke='%23fff' d='M.5.5h16v16H.5z'/%3E%3C/svg%3E"); }
.form-check-input[type=radio]{ border-radius: 0; }
.form-check-input:focus { border-color: transparent; box-shadow: none; }
.form-check-input:checked { background-color: transparent; }
.form-check-input:checked[type=checkbox],
.form-check-input:checked[type=radio] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17'%3E%3Cpath fill='none' stroke='%23fff' d='M.5.5h16v16H.5z'/%3E%3Cpath fill='%238af6f6' d='M5 5h7v7H5z'/%3E%3C/svg%3E"); }
.btn-check:focus + .btn, 
.btn:focus{ box-shadow: none; }

.file-upload > label{ position: static; width: 100%; padding-bottom: 0.8rem; margin-bottom: 0; }
.upload-button{ background-color: rgb(23 23 23 / 80%); border: 1px solid var(--underline50); border-radius: 0; padding: 1em 0.75em; width: 100%; color: var(--underline50); }
.upload-button:hover{ color: rgb(255 255 255 / 80%); }
.responsiv-uploader-fileupload.style-file-multi .upload-files-container{ border: 0; border-radius: 0; }
.responsiv-uploader-fileupload.style-file-multi .upload-object{ border-radius: 0; border-bottom-color: rgb(255 225 225 / 20%); }
.responsiv-uploader-fileupload.style-file-multi .upload-object:nth-child(even){ background-color: rgb(255 255 255 / 2%);}
.responsiv-uploader-fileupload.style-file-multi .upload-button{ margin-bottom: 0; }
.responsiv-uploader-fileupload.style-file-multi .upload-object:hover { background: rgb(255 255 255 / 10%) !important; }
.responsiv-uploader-fileupload.style-file-multi .upload-object .info h4, 
.responsiv-uploader-fileupload.style-file-multi .upload-object .info p{ color: var(--underline50); }
.responsiv-uploader-fileupload.style-file-multi .upload-object .icon-container{ padding: 6px; }

.alert { border-radius: 0; position: fixed; overflow-y: overlay; top: 50%; max-height: 75vmin; z-index: 10; width: calc(100% - 20vmin); max-width: 700px; left: 0; right: 0; margin: auto; border: 1px solid #343434 !important; backdrop-filter: blur(3px); background-color: rgb(10 10 10 / 95%) !important; height: auto; transform: translateY(-50%); overflow-x: hidden; min-height: 200px; display: flex; flex-direction: column; align-items: center; }
/* .alert>p{ position: absolute; z-index: 2; top: 70%; left: 0; right: 0; margin: auto; height: 30%; width: 100%; max-width: 700px; display: flex; align-items: center; justify-content: center; background-color: transparent; border: 0; color: var(--bs-body-color); } */
.alert>p{ color: var(--bs-body-color); }
.alert button{ position: absolute; z-index: 2; top: 0; right: 0; border: 0; background-color: transparent; color: var(--bs-body-color); font-size: 2em; padding: 1rem;}
.alert-success{ color: var(--bs-body-color); }
.alert-success:before{ content: ''; width: 20vmin; height: 20vmin; background: url(../themes/technicarbure/assets/img/success.svg) no-repeat 50% 50%; background-size: auto 100%; margin: 5vmin 0 5vmin; }

table{ margin-bottom: 5vmin; }
/* table tbody{ background-color: rgb(0 0 0 / 15%); } */
table caption{ caption-side: top; text-align: center; font-weight: bold; opacity: 1; color: var(--bs-body-color); border-bottom: 1px solid rgb(255 255 255 / 25%); }
table th, 
table td{ padding: 1vmin; border-bottom: 1px solid var(--underline20); }
table th{ font-weight: normal; font-size: 1.15em; }
table th:not(:last-child),
table td:not(:last-child){ border-right: 1px solid var(--underline20); }
table tbody tr:nth-child(odd){ background-color: #131313; }
table .form-floating{ margin-bottom: 0;}

/* Buttons */
a.oc-loading, button.oc-loading, div.oc-loading, span.oc-loading { position:relative; color:rgba(0,0,0,0) !important }
a.oc-loading:after, button.oc-loading:after, div.oc-loading, span.oc-loading:after { opacity:1; position:absolute; left:50%; top:50%; margin:-0.5em 0 0 -0.5em; color:var(--bs-body-color); }

button.btn-arrows{ white-space: nowrap; position: relative; padding-right: 55px; background: url(../themes/technicarbure/assets/img/fleche.svg) no-repeat calc(100% - 3px) 6px; background-size: 9px 15px; color: var(--bs-body-color);  border: 0; border-bottom: 1px solid var(--bs-body-color); padding-bottom: 10px; margin-right: 0; margin-left: 0; transition: 0.2s ease-out 0.3s; margin: 3vmin 0; }
button.btn-arrows:before,
button.btn-arrows:after{ content: ''; width: 9px; height: 15px; order: 2; transform: none; background: url(../themes/technicarbure/assets/img/fleche.svg) no-repeat 50% 50%; background-size: 9px 15px; position: absolute; top: 15px; margin-top: -9px; }
button.btn-arrows:before{ right: 33px; transition: all 0.2s ease-out 0s; }
button.btn-arrows:after { right: 18px; transition: all 0.2s ease-out 0.1s; }
button.btn-arrows:hover{ background-position-x: 100%; }
button.btn-arrows:hover:before{ transform: none; right: 30px; }
button.btn-arrows:hover:after{ transform: none; right: 15px; }
button.btn-arrows[disabled]{ opacity: .3; }

a.oc-loading, button.oc-loading, div.oc-loading, span.oc-loading{ color: inherit !important; }
a.oc-loading:after, button.oc-loading:after, div.oc-loading, span.oc-loading:after{ left: inherit; color: transparent; 
    -webkit-animation: none;
            animation: none; 
}

/* Popup */
.popup-fancybox{ width: 90vw; max-width: 980px; }
.popup-fancybox img{ height: auto; max-height: 80vh; width: auto; }

 /* Global */
#page { position:relative; width:100%; }
#main > section:first-child{ padding-top: calc(var(--headBarH) + 10vmin);  }

#intro{ position: relative; }
#intro .container{ position: relative; z-index: 1; }
#intro .bg{ position:absolute; z-index: 0; width: 100%; height: 100%; top: 0; left: 0; }
#intro .bg:after{ content: ''; position:absolute; z-index: 0; width: 100%; height: 100%; top: 0; left: 0; background-color: #000; opacity: var(--label-opacity); }

#loading { position:fixed; left:0; top:0; width:100%; height:100%; z-index:5000; background:rgba(0,0,0,0.95); display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:all 0.5s ease 0s; }
.stripe-loading-indicator .stripe, 
.stripe-loading-indicator .stripe-loaded{ background: #00aeac; }
/*.oc-loading #loading { opacity:1; pointer-events:auto; }*/

/* Header */
#header{ position: relative; z-index: 10; }
#menu-bar { position:fixed; left:0; top:0; width:100%; z-index:2; height: var(--headBarH); min-height: 55px; border-bottom: 1px solid var(--underline50); 
    background: linear-gradient(#000 0%, rgba(0, 0, 0, 0%) 100%); backdrop-filter: blur(2px); font-size: 0.8em; }
    /* background: linear-gradient(#000 0%, rgba(21, 21, 21, 40%) 100%); backdrop-filter: blur(2px); } */
#menu-bar > div{ display: flex; align-items: center; justify-content: stretch; height: 100%; position: relative; z-index: 2; }
#menu-bar > div > *{ border-right: 1px solid var(--underline50); height: 100%; display: flex; align-items: center; justify-content: center; }
    #menu-logo{ order: 3; width: 100%; display: flex; align-items: center; justify-content: center; height: 100%; padding: 1.5vmin; }
    #menu-logo img{ max-height: 100%; width: auto; }
    #menu-btn{ order: 1; min-width: calc(var(--headBarH) * 2); width: calc(var(--headBarH) * 2); position: absolute; left: 0; text-align: center; opacity: 0.8; }
    #menu-btn:hover{ opacity: 1; cursor: pointer; }
    #menu-contact{ order: 2; min-width: var(--headBarH); width: var(--headBarH); }
    #menu-contact:before{ mask-image: url(../themes/technicarbure/assets/img/envelope.svg); -webkit-mask-image: url(../themes/technicarbure/assets/img/envelope.svg); mask-size: auto 20%; -webkit-mask-size: auto 20%; }
    #menu-lang{ order: 4; min-width: var(--headBarH); width: var(--headBarH); flex-direction: column; align-items: center; justify-content: center; margin-bottom: 0; }
    #menu-lang a{ line-height: 1.3em; opacity: .5; }
    #menu-lang a:hover{ opacity: 0.8; color: var(--bleu); }
    #menu-lang a.active:hover,
    #menu-lang a.active{ opacity: 1; color: var(--bs-body-color); }
    #menu-lang abbr{ text-decoration: none; }
    #menu-account{ order: 5; min-width: var(--headBarH); width: var(--headBarH); position: absolute; right: var(--headBarH);}
    #menu-account:before{ mask-image: url(../themes/technicarbure/assets/img/user.svg); -webkit-mask-image: url(../themes/technicarbure/assets/img/user.svg);  mask-size: auto 25%; -webkit-mask-size: auto 25%; }
    #smallcart-wrapper{ order: 6;  min-width: var(--headBarH); width: var(--headBarH); position: absolute; right: 0; }
    #header #smallcart-wrapper{ border-right: 0; }
    #smallcart-wrapper>a{ display: block; width: 100%; height: 100%; position: relative; z-index: 1; overflow: visible; }
    #smallcart-wrapper>a:before{ mask-image: url(../themes/technicarbure/assets/img/cart.svg); -webkit-mask-image: url(../themes/technicarbure/assets/img/cart.svg);  mask-size: auto 25%; -webkit-mask-size: auto 25%; }
    #smallcart-wrapper>a .text{ display: none; }
    #smallcart-wrapper>a .cart-counter{ position: absolute; top: 4.5vmin; left: 7.5vmin; text-indent: 0; }
    #smallcart-wrapper.animate .cart-counter:before{ content: ''; position: absolute; background-color: #00aeac; width: 30px; height: 30px; z-index: -1; left: -11px; top: 0; border-radius: 50%;
        -webkit-animation: scale-in-center 1.2s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0.5s reverse both;
	            animation: scale-in-center 1.2s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0.5s reverse both; }

#menu{ position: fixed; top: 0; left: 0; width: 100%; min-height: 100vh; background-color: #1a1a1a; z-index: 1; padding-top: var(--headBarH); opacity: 0; transition: opacity 0.2s ease-out; pointer-events: none; }
#menu:after{ content: ''; position: fixed; width: 0; height: 100%; top: var(--headBarH); left: 50%; border: 1px solid var(--bs-body-color); opacity: 0.2; }
#menu .container{ height: 100%; min-height: calc(100vh - var(--headBarH)); display: flex; flex-direction: column; justify-content: center; }
#menu .row{ height: 100%; }
#menu .row{ align-items: center; }
#menu ul.level-1{ padding: 0 0 8.8vmin 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-evenly; height: 580px; max-height: 70vh; }
#menu ul.level-1>li>a{ font-family: var(--head-font-family); font-size: calc(1.9rem + 0.5vw); }
#menu ul.level-2{ padding: 4vmin 0; }
#menu ul.level-2>li{ margin-bottom: 1.5em; }
#menu .boutique a{ color: var(--bleu); margin-bottom: 0.5em; display: inline-block; }
.open #menu{ opacity: 1; pointer-events: initial; }
.open #menu-btn{ text-transform: lowercase; }
.open #menu-btn:before{ content: 'Fermer le'; margin-right: 0.2em; text-transform: none; }

/* Footer */
#footer{ background-color: #141414; border-top: 1px solid var(--underline50); padding: 10vmin 0; }
#footer a:hover{ color: var(--bleu); }
#footer .row{ align-items: center; }
#footer .menu a{ display: inline-block; margin: 0.9vmin 0; }
#footer .coords{ margin-left: 5vmin; }
#footer .coords img{ width: 80px; max-width: 15vmin; }
#footer .menu-legal ul{ display: flex; margin-top: 5vmin; flex-wrap: wrap; }
#footer .menu-legal li{ margin-right: 5vmin; }
#footer .menu-legal a,
#footer .menu-legal span{ opacity: var(--label-opacity); }
#footer .menu-legal a:hover{ opacity: 0.8; }

/* ----------------------------------------------
 * Generated by Animista on 2022-2-9 11:1:53
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-in-center
 * ----------------------------------------
 */
@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

/**
 * ----------------------------------------
 * animation blink-2
 * ----------------------------------------
 */
@-webkit-keyframes blink-2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink-2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
/* CONTAINER */

body{ --containerWidth: 100%; }
@media (min-width:  576px){ body{ --containerWidth:  540px; } }
@media (min-width:  768px){ body{ --containerWidth:  720px; } }
@media (min-width:  992px){ body{ --containerWidth:  960px; } }
@media (min-width: 1200px){ body{ --containerWidth: 1140px; } }
@media (min-width: 1400px){ body{ --containerWidth: 1320px; } }

/**
 * XXL
 **/
@media (min-width: 1400px) {
    .container{ max-width: calc(1320px + 40vmin); }
}

/**
 * XL
 **/
@media (max-width: 1399px) {
    .container{ max-width: 1140px; }
}

/**
 * LG
 **/
@media (max-width: 1199px) {
    .container{ padding-right: 5vmin; padding-left: 5vmin; }
    #menu-bar .container{ max-width: none; padding: 0; }
    #menu-btn,
    #menu-account,
    #smallcart-wrapper{ position: relative; left: inherit; right: inherit; }
    /* position: absolute; */
    /* right: var(--headBarH);
    .swiper-pagination-vertical.swiper-pagination-bullets{ left: -4vmin; }

    /* Nos produits */
    #categories>.div-lines:before{ left: 15%; width: 50%; }
}

/**
 * MD
 **/
@media (max-width: 991px) {
    .md-center{ text-align: center; }

    /* Accueil */
    #sur-mesure .categories .img{ height: 60vw; }
    #sur-mesure .categories h3{ margin-top: auto; margin-bottom: auto; top: 0; display: flex; align-items: center; justify-content: center; }

    /* Devis */
    table th { padding: 2px 1vmin; }
    table td { padding: 2px; }
    .form-floating > .form-control:focus, 
    .form-floating > .form-control:not(:placeholder-shown) { padding-left: 0.2rem; padding-right: 0.2rem; }

    /* Checkout */
    #checkout-shipping-collapse .address-field{ margin-top: 0; }
}

/**
 * SM
 **/
@media (max-width: 767px) {
    #header #logo{ padding: 0.8vmin; order: 0; justify-content: flex-start; padding-left: 5%; }
    #header #menu-btn{ order: 2; min-width: 110px; }
    #header #contact{ display: none; }
    #header #lang{ display: none; }
    #menu{ padding-top: 55px; }

    .div-lines:before,
    .div-lines:after{ content: none; }

    .g5{ margin-right: calc(var(--bs-gutter-x) * -.5); margin-left: calc(var(--bs-gutter-x) * -.5); }
    .g5>div{ padding-right: calc(var(--bs-gutter-x) * .5) !important; padding-left: calc(var(--bs-gutter-x) * .5) !important; }
    

    /* Notre société */
    ul.h3{ flex-direction: column; align-items: center; }
    ul.h3 li{ margin-bottom: 3vmin; }
    ul.h3 br { display: none; }

    /* Nos outils sur mesure */
    .categorie:before{ left: 79.4%; }
    .categorie .img{ position: relative; }
    .categorie img{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-height: 320px; }

    /* Contact */
    #contact-form:before{ content: none; }
    
    /* Détail produit */
    .variants table th span[title]:before{ content: none; }
    .variants table th span.unit{ display: none; }
    #infos-wrapper{ padding-top: 0; }
    #images-wrapper{ width: 100%; float: none; margin-top: 0; max-width: none; }

    /* panier */
    .products-list .item{ display: flex; flex-wrap: wrap; padding-top: 0.5em; }
    .products-list .item>*{ order: 5; }
    .products-list .item .delete{ order: 0; }
    .products-list .item h2{ order: 1; width: calc(70% - 24px); font-weight: bold; }
    .products-list .item .pu{ order: 2; width: 20%; text-align: right; opacity: 0.5; }
    .products-list .item .pu:before{ content: attr(title); margin-right: 0.5em; }
    .products-list .item .props{ width: 100%; justify-content: flex-start; padding-left: 24px; }
    .products-list .item .form-floating{ display: flex; justify-content: flex-end; }
    .products-list .item .prix{ font-weight: bold; }
    .cart-aside{ min-width: 0; width: 100%; }
    .cart-aside .shipping{ line-height: 1.2em; margin-bottom: 0.3em; }
    
    /* Popup */
    .popup-fancybox > .row{ flex-direction: column-reverse;  }
}

/**
 * XS
 **/
@media (max-width: 575px) {
    
    body{ --headBarH: 55px; }
    #smallcart-wrapper>a .cart-counter{ top: 22px; left: 35px; }
    #header #menu-btn{ min-width: var(--headBarH); }
    
    #menu{ overflow-y: scroll; height: 100%; padding: var(--headBarH) 5vmin 0; min-height: inherit; }
    #menu:after{ content: none; }
    #menu .row{ height: auto; }
    #menu ul.level-1{ padding: 0; height: auto; }
    #menu ul.level-1>li>a{ padding-bottom: 7vmin; display: block; }
    #menu ul.level-2{ padding: 0; padding-bottom: 3vmin; margin-left: 1em; }
    #menu ul.level-2>li{ padding-bottom: 0; }
    #menu ul.level-1>li.boutique{ padding-bottom: 7vmin; }
    #menu ul.level-1>li.boutique>a{ padding-bottom: 0; margin-bottom: 0; }
    #menu ul.level-1>li.boutique>br{ display: none; }
    .open #menu-btn:before { content: 'X'; }

	/* Outils */
    .categorie{ padding-bottom: 20vmin; }
    .categorie:before{ left: 83.4%; }
	
    /* Devis */
    #devis-produit table tr { border-bottom: 1px solid rgb(255 255 255 / 25%); }
    #devis-produit table th { padding-left: 0.5em; padding-right: 1em; }
    #devis-produit table td { padding: 2px; display: inline-block; width: 50%; }
    #devis-produit table td:last-child { margin-bottom: 5vmin; }

    /* Account */
    #account-menu{ position: relative; padding: 5vmin 0; }
    #account-menu:before{ content: ''; position: absolute; bottom: 0; left: 50%; width: 100vw; height: 0; transform: translateX(-50%); border-bottom: 1px solid var(--underline20); }
    #account-menu:after{content: ''; position: absolute; z-index: 0; top: 0; left: 45%; width: 0; height: 100%; border-right: 1px solid var(--underline20); pointer-events: none; }
    #account-menu .account-info{ overflow: hidden; text-align: right; }
    #account-menu ul{ flex-direction: column; margin-bottom: 0.5vmin; }
    #account-menu ul li:after{ content: none; }
}


@media (max-height: 600px) {
    /* #menu{ padding-top: 0; }
    #menu .row{ padding-top: 25vmin; }
    #menu ul.level-1{ height: auto; } */
}