*,::after,::before{box-sizing:border-box;margin:0;padding:0}
h1,h2,h3,h4,h5{font-family:Helvetica,sans-serif}
p,a{font-family:Lato,sans-serif}
.link-tel{color:#000;text-decoration:none}
.link-tel:hover{color:red}
header .contact{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-around;padding:1rem}
header .container{align-items:center;background-color:#000;border-image:linear-gradient(to left,#0094FF,#fff,red) 1;border-top-style:solid;border-top-width:5px;display:flex;justify-content:space-around;padding:10px}
header .container .other{display:flex;gap:20px}
header .container .search .search-container{margin:0 auto;position:relative;width:490px}
header .submenu,footer .submenu{background-color:#fff;box-shadow:0 2px 5px #0000001a;display:none;list-style:none;margin:0;padding:0;position:absolute;z-index:99;flex-direction:column}
footer .submenu{background-color:#000;flex-wrap:wrap;flex-direction:row!important}
footer li:hover .submenu{display:flex}
header .submenu li a,footer .submenu li a{color:#333;display:block;padding:10px;text-decoration:none;font-family:Helvetica,sans-serif}
header .submenu li a:hover{background-color:#f0f0f0}
footer .submenu li a:hover{background-color:#333}
header .container .search button,section#resultat .container button{border:none;cursor:pointer}
header .container .search .search-container input#search_general_form_searchBarGeneral,section#strat .search .search-container input,section#resultat .container .search-container input{border:1px solid #D0CFCE;border-radius:20px;font-size:1rem;height:45px;outline:none;padding:0 20px;transition:border .35s ease;width:calc(100% - 45px)}
header .container .search .search-container .search-icon,section#strat .search .search-container .search-icon{height:45px;position:absolute;right:50px;top:50%;transform:translateY(-50%);width:45px;padding:10px}
section#resultat .container .search-container{margin:0 auto;position:relative;width:490px}
section#resultat .container .search-container .search-icon{cursor:pointer;height:45px;position:absolute;right:50px;top:50%;transform:translateY(-50%);width:45px;padding:10px}
header nav ul{align-items:center;display:flex;gap:20px;list-style-type:none;text-decoration:none}
header nav{display:flex;justify-content:center;padding:20px}
header nav ul li a{color:#000;text-decoration:none;font:26px Helvetica,sans-serif}
header nav ul li a:hover{color:#0094FF}
section#strat .search .search-container{position:relative;width:500px}
footer{align-items:center;background-color:#000;border-image:linear-gradient(to left,#0094FF,#fff,red) 1;border-top-style:solid;border-top-width:10px;color:#fff;display:flex;flex-direction:column;justify-content:center}
footer .contenu{align-items:center;display:flex;justify-content:space-around;margin-bottom:15px;padding:15px}
footer .mention{background-color:#000;color:#fff;display:flex;justify-content:center;padding:15px 0}
footer .contenu .produit,footer .contenu .mail,footer .contenu .social,footer .contenu .contact{display:flex;flex-direction:column;gap:10px}
footer .contenu .produit ul{list-style-type:none}
footer .contenu .contact .adresse .svg,footer .contenu .contact .tel .svg,footer .contenu .contact .email .svg{border-image:linear-gradient(to left,#0094FF,#fff,red) 1;border-style:solid;border-width:2px;padding:5px}
footer .contenu .contact .adresse .svg svg,footer .contenu .contact .tel .svg svg,footer .contenu .contact .email .svg svg{fill:#fff;height:20px;width:20px}
section#contact{align-items:center;background-color:#000;color:#fff;display:flex;flex-direction:column;gap:15px;padding:20px 200px}
section#about,section#partenaire,section#moment,section#promo{align-items:center;display:flex;flex-direction:column;gap:10px;justify-content:space-around;padding:20px; margin:20px auto;}
section#bande-de-chant .btn-primary{background-color:#CC0000;border:none;border-radius:10px;color:#fff;padding:10px;cursor:pointer}
.table-responsive{width:100%;text-align:center}
section#about h1{margin-bottom:15px}
section#contact .right{width:45%}
section#contact .left{align-items:center;display:flex;flex-direction:column;gap:15px}
section#contact .container{align-items:center;display:flex;gap:6rem;justify-content:center;margin:15px 0;width:100%;}
section#partenaires{align-items:center;display:flex;height:240px;justify-content:center}
section#partenaires .slider{height:200px;position:relative;width:920px}
section#partenaires .slider .slides .slide{height:200px;min-width:300px}
section#partenaires .slider .puces{align-items:center;bottom:-30px;cursor:pointer;display:flex;gap:8px;height:20px;justify-content:center;left:0;position:absolute;width:100%}
section#partenaires .puce{background:grey;border-radius:100%;height:15px;width:15px}
section#partenaires .puce.active{background:#000}
section#info{background:#000;color:#fff;padding:2rem}
section#info .container{max-width:1280px;padding:0 1rem;margin:0 auto}
section#info h2{text-align:center;margin-bottom:3rem}
section#info #commander, section#contact .btn-second{background-color:#fff;color:#000;border:1px solid #000;padding:1rem 2rem;border-radius:10px;cursor:pointer;text-decoration: none;}
section#info #optimisateur, footer .contenu .mail a{background-color:#000;color:#fff;border:1px solid #fff;padding:1rem 2rem;border-radius:10px;cursor:pointer;text-decoration: none;}
footer .contenu .mail a {padding: .5rem 1rem}
section#info #commander a,section#info #optimisateur a, section#contact .btn-second a, footer .contenu .mail a{color:inherit;text-decoration:none}
section#info #commander:hover,section#info #optimisateur:hover, section#contact .btn-second:hover, footer .contenu .mail a:hover{background-color:#007ACC;color:#fff;border:1px solid #007ACC}
section#info .container div,section#gamme .container div{margin:0 auto;max-width:48rem;--tw-space-y-reverse:0;margin-top:calc(1.5rem* calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem* var(--tw-space-y-reverse))}
section#info .container div div{display:flex;justify-content:center;gap:1rem;margin-top:2rem}
section#info .container div p:nth-child(1n+1){margin-top:20px}
section#gamme{padding:2rem;background-color:#000}
section#gamme .container{max-width:1280px;padding:0 1rem;margin:0 auto}
section#gamme h2{margin-bottom:2rem;text-align:center;color:#fff}
section#gamme .container div p:nth-child(1n+1){margin-top:20px;color:#fff}
section#partenaire{margin:2rem 0}
section#tuto{background-color:#f9fafb;padding:2rem 0}
section#tuto .container{padding:0 1rem;margin:0 auto;max-width:1280px}
section#tuto h2{text-align:center;margin-bottom:3rem}
section#tuto h3{margin-bottom:1rem}
section#tuto .container-video{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:2rem}
section#tuto .container-video .card{background:#fff;padding:1.5rem;border-radius:.5rem;box-shadow:0 0 10px #0000001a}
section#tuto .container-video .card .card-container{display:flex;align-items:center;justify-content:center;border-radius:.5rem;flex-direction:column}
section#tuto .container-video .card .card-container video{border-radius:.5rem}
.panier{background-color:#f4f4f4;box-shadow:0 0 10px 0 #00000080;height:100%;position:fixed;right:-500px;top:0;transition:right .3s ease;width:450px;z-index:99;display:flex;flex-direction:column}
.panier-visible{right:0}
.panier-header{align-items:center;border-bottom-style:solid;border-bottom-width:4px;border-image:linear-gradient(to left,#0094FF,#fff,red) 1;display:flex;justify-content:space-between;padding:20px;flex:0 0 auto}
.close-btn{background:none;border:none;cursor:pointer;font-size:30px}
.panier-footer{align-items:center;border-image:linear-gradient(to left,#0094FF,#fff,red) 1;border-top-style:solid;border-top-width:4px;display:flex;flex-direction:column;gap:20px;padding:20px 20px 0;width:100%;flex:0 0 auto;margin-bottom:20px}
.panier-footer .checkout-btn{background-color:#000;border:none;color:#fff;cursor:pointer;padding:10px}
.panier-footer .checkout-btn:disabled{background-color:#ccc!important;color:#444!important;cursor:not-allowed!important;opacity:.7}
.panier-body{align-items:center;background-color:#000;color:#fff;display:flex;flex-direction:column;padding:20px;flex:1 1 auto;justify-content:center;overflow-y:hidden}
.panier .product-item button{background:none;border:none;color:#fff;cursor:pointer}
.panier-content{overflow-y:auto;max-width:100%}
#bouton-panier{position:relative}
.panier-count{position:absolute;top:-5px;right:-5px;background-color:#0071CC;color:#fff;font-size:12px;font-weight:700;border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center}
section#form span{color:red}
section#bande-de-chant form{box-shadow:4px 5px 16px 0 #00000040;padding:20px;width:100%}
section#bande-de-chant form .form-group div.form-control{align-items:flex-end}
section#bande-de-chant form .form-group div{gap:10px;display:flex;flex-direction:column;width:100%}
section#bande-de-chant{align-items:center;display:flex;flex-direction:column;gap:20px;padding:20px 200px}
section#bande-de-chant form .form-group{display:flex;gap:30px;padding:10px 0}
section#bande-de-chant form .form-group div input,section#bande-de-chant form select{background-color:#e5e7e9;border:none;border-radius:5px;padding:10px 5px}
section#bande-de-chant form select, section#pano div.filter select,section#strat select {background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), calc(100% - 2.5em) 0.5em;background-size: 5px 5px, 5px 5px, 1px 1.5em;background-repeat: no-repeat;display: inline-block;margin: 0;appearance:none;}
section#bande-de-chant select:focus, section#pano div.filter select:focus, section#strat select:focus {background-image: linear-gradient(45deg, #0094FF 50%, transparent 50%), linear-gradient(135deg, transparent 50%, #0094FF 50%), linear-gradient(to right, #ccc, #ccc);background-position: calc(100% - 15px) 1em, calc(100% - 20px) 1em, calc(100% - 2.5em) 0.5em;background-size: 5px 5px, 5px 5px, 1px 1.5em;background-repeat: no-repeat;outline: 0;}
section#bande-de-chant button{background-color:#c62828;border:none;border-radius:10px;color:#fff;cursor:pointer;padding:10px 15px;width:fit-content!important}
section#bande-de-chant button:hover{background-color:#b71c1c}
section#login form .btn{background-color:#fff;border:none;border-radius:10px;padding:10px;cursor:pointer}
section#login form .btn:hover{background-color:#007ACC;color:#fff}
section#login form{align-items:flex-start;background-color:#000;color:#fff;display:flex;flex-direction:column;gap:20px;padding:20px;width:100%}
section#dash{align-items:stretch;display:flex;gap:20px;background:#f9faf9;min-height: 100vh;}
section#dash .sidebar{width:18rem;background-color:#343a40;color:#fff;padding:1rem;border-radius:0 20px 0 0}
section#dash .sidebar-content{margin-top:1rem}
section#dash .user-info{display:flex;align-items:center;background-color:#495057;padding:1rem;border-radius:.5rem;margin-bottom:1.5rem}
section#dash .avatar-sidebar{background-color:#6c757d;color:#fff;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;margin-right:1rem}
section#dash .avatar-sidebar img,.avatar img{width:100%;border-radius:100%}
section#dash .user-details h3{font-size:1rem;font-weight:700}
section#dash .user-details p{font-size:.875rem}
section#dash .nav-menu .nav-item{text-decoration:none;background:none;border:none;color:#fff;text-align:left;padding:.75rem 1rem;font-size:1rem;width:100%;display:flex;align-items:center;cursor:pointer;gap:20px}
section#dash .nav-menu .nav-item:hover{background-color:#495057}
section#dash .main-content{padding:2rem;width:100%}
section#dash .overview{margin-bottom:10px;}
section#dash .overview h1{font-size:2rem;font-weight:700;margin-bottom:1rem}
section#dash .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:2rem}
section#dash .card{background:#fff;border-radius:.5rem;box-shadow:0 2px 4px #0000001a;width:100%;overflow:hidden;padding:20px}
section#dash .card:nth-child(1), section#dash .card:nth-child(2) {margin-bottom: 20px;}
section#dash .card-content{padding:1.5rem}
section#dash .card-icon{border-radius:50%;display:inline-block}
section#dash .card-text p{font-size:1rem;font-weight:400;color:#6c757d}
section#dash .card-text p.title{font-size:1.5rem;font-weight:700;color:#000}
section#dash .card-status{display:flex;align-items:center;margin-top:1rem}
section#dash .status{font-size:1rem;font-weight:700}
section#dash .status.positive{color:#218838}
section#dash .status.negative{color:#dc3545}
section#dash .history{background-color:#fff;padding:2rem;border-radius:.5rem;box-shadow:0 2px 4px #0000001a}
section#dash .history h2,.title{font-size:1.5rem;font-weight:700;margin-bottom:1rem}
section#dash .history p,.subtitle{font-size:1rem;color:#6c757d}
section#dash .no-orders{text-align:center;padding:4rem 0}
section#dash .no-orders p{font-size:1rem;color:#6c757d}
section#dash .history-header{display:flex;justify-content:space-between;align-items:center;padding:16px}
section#dash .btn-outline{border:1px solid #6c757d;background:none;padding:1rem;border-radius:5px;font-size:.9rem;display:flex;align-items:center;color:#000;text-decoration:none}
section#dash .btn-outline .icon{margin-left:5px}
section#dash .separator{border:none;height:1px;background:#e0e0e0}
section#dash .card-header{display:flex;justify-content:space-between;align-items:center;padding:16px}
section#dash .order-table{width:100%;border-collapse:collapse}
section#dash .order-table tbody tr:hover{background: #ccc;}
section#dash .order-table th,.order-table td{text-align:left;padding:12px;border-bottom:1px solid #e0e0e0}
section#dash .bold{font-weight:700}
section#dash .action-buttons{display:flex;gap:8px}
section#dash .btn-icon{border:none;background:none;cursor:pointer;font-size:1rem;padding:5px;transition:.3s}
section#dash .btn-icon a{text-decoration:none}
section#dash .btn-icon:hover{color:#007bff}
section#dash .order-details{padding:20px;width:100%}
section#dash .order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
section#dash .order-title{font-size:24px;font-weight:700}
section#dash .order-reference{font-size:14px;color:#495057}
section#dash .order-actions{display:flex;gap:10px;align-items:center;}
section#dash .btn-download{background:#0056b3;color:#fff;padding:1rem;border-radius:5px;font-size:.9rem;text-decoration:none;border:1px solid #0056b3}
section#dash .order-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px}
section#dash .card hr{margin:10px 0}
section#dash .card p{font-size:14px;margin-top:10px}
section#dash .card p.gray{color:#6c757d}
section#dash .order-summary h2{font-size:18px;font-weight:700;margin-bottom:16px}
section#dash .order-items{margin-bottom:16px}
section#dash .order-item{display:flex;gap:16px;border-bottom:1px solid #e0e0e0;padding-bottom:16px;margin-bottom:16px}
section#dash .order-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
section#dash .order-item-img{width:120px;height:120px;border-radius:8px;object-fit:cover}
section#dash .order-item-info{flex:1}
section#dash .order-item-info h3{font-size:16px;font-weight:700}
section#dash .order-item-info p{font-size:14px;color:#6c757d}
section#dash .order-item-price p:first-child{font-weight:700;font-size:16px}
section#dash .order-item-price{text-align:right}
section#dash .order-item-price p{font-size:14px}
section#dash .order-totals p{display:flex;justify-content:space-between;font-size:14px;margin:8px 0}
section#dash .total{font-weight:700;font-size:16px}
section#dash .order-info{display:flex;flex-direction:column;gap:16px}
section#dash .order-info .card,.order-grid .card{padding:16px}
section#dash .order-info .card h3{font-size:16px;font-weight:700;margin-bottom:12px}
section#dash .settings-container{padding:20px;width:100%}
section#dash .settings-header{margin-bottom:20px}
section#dash .settings-title{font-size:24px;font-weight:700}
section#dash .settings-subtitle{font-size:14px;color:#495057}
section#dash .card h2{font-size:18px;font-weight:700;margin-bottom:16px}
section#dash .profile-section{display:flex;gap:20px;align-items:center;margin-bottom:16px}
section#dash .profile-avatar{position:relative}
section#dash .avatar{width:80px;height:80px;border-radius:50%;background:#e0e0e0;display:flex;align-items:center;justify-content:center;font-size:32px}
section#dash .btn-camera{position:absolute;bottom:-5px;right:-5px;width:30px;height:30px;border-radius:50%;cursor:pointer;background:#1781ea;display:flex;justify-content:center;align-items:center;border:none}
section#dash .btn-camera svg{stroke:#fff}
section#dash .profile-info{display:flex;gap:10px;width:100%}
section#dash .input-group{display:flex;flex-direction:column;width:100%}
section#dash .input-group label,#profile_form_nouvelle_adresse label{font-size:14px;margin-bottom:4px}
section#dash .input-group input,#profile_form_nouvelle_adresse input{padding:8px;border:1px solid #ddd;border-radius:5px}
section#dash #profile_form_nouvelle_adresse div{display:flex;flex-direction:column;margin-bottom:10px}
section#dash .input-row{display:flex;gap:10px}
section#dash .address-section{display:flex;flex-direction:column;gap:10px}
section#dash .address-card{padding:10px;border:1px solid #ddd;border-radius:5px;background:#f8f9fa}
section#dash .address-header{display:flex;justify-content:space-between;margin-bottom:5px}
section#dash .warning{font-size:14px;color:#c62828;margin-bottom:10px}
section#dash .settings-actions{display:flex;justify-content:flex-end;gap:10px}
section#dash .btn-submit button{border:1px solid #0056b3;background:#0056b3;padding:8px 12px;border-radius:5px;cursor:pointer;color:#fff}
section#dash .settings-content .btn-outline{border:none;padding:8px 0;border-radius:5px;cursor:pointer;color:#0056b3;text-decoration:none}
section#dash .form-control{display:flex;flex-direction:column;gap:4px}
section#dash .adresse-item{display:flex;gap:10px}
section#dash #profile_form_nouvelle_adresse_submit{display:none}
section#heroes{height:400px;position:relative}
section#heroes img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}
section#heroes #overlay{background:#1d1d1d;height:100%;left:0;object-fit:cover;opacity:.3;position:absolute;top:0;width:100%}
section#heroes .hero-text{color:#fff;left:25%;position:absolute;text-align:center;top:40%;transform:translate(-50%,-50%)}
section#heroes .hero-text h1{color:#fff;font-size:50px;margin-top:120px;text-align:left}
section#hero{align-items:center;display:flex;height:400px;justify-content:center}
section#hero .slider{height:400px;position:relative;width:100%}
section#hero .slider .slides .slide{height:400px;min-width:100%}
section#hero .slider .puces{align-items:center;cursor:pointer;display:flex;gap:8px;height:20px;justify-content:center;left:0;position:absolute;top:20px;width:100%}
section#hero .puce{background:#fff;border-radius:100%;height:15px;width:15px}
section#hero .puce.active{background:#a0a1a2}
section#moment .parent,section#strat .parent,section#promo .parent, section#moment .products-list{display:grid;grid-column-gap:20px;grid-row-gap:20px;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr)}
section#moment .parent{width:1200px;}
section#moment .parent .product,section#strat .parent .product,section#promo .parent .product{align-items:center;background:#e5e7e9;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;padding:15px}
section#moment .parent div .img img,section#strat .parent div .img img,section#promo .parent div .img img,section#resultat .parent div .img img{border-radius:10px;width:270px;height:225px;object-fit:cover;border:1px solid #000}
section#moment .parent .product h3{text-align:center}
section#strat .top{align-items:flex-start;display:flex;gap:20px;justify-content:space-between}
section#strat select{border:none;box-shadow:4px 5px 16px 0 #00000040;padding:10px 50px 10px 10px;cursor:pointer}
section#strat .top .search button{border:none;cursor:pointer}
section#strat{display:flex;gap:30px}
section#strat form{display:flex;flex:1;justify-content:center;padding:20px}
section#strat #filters{display:flex;flex-direction:column;flex-wrap:wrap;padding:20px;height:fit-content;position:sticky;top:10px;max-height:100vh;overflow-y:auto}
section#strat #filters form{border:none;box-shadow:4px 5px 16px 0 #00000040;flex-direction:column;padding:15px}
section#strat #filters form .form-control{display:flex;flex-direction:column;gap:10px;margin:10px 0}
section#strat #filters form input{border:1px solid #0094FF}
section#strat #filters form button {background-color: #0074CC;border: none;color: #ffffff;cursor: pointer;padding: 8px 12px;}
section#strat .container{display:flex;flex:4;flex-direction:column;padding:20px}
section#pano .con{align-items:center;display:flex;gap:20px;justify-content:center;margin-bottom:2rem;flex-direction:column}
section#pano .con .img{width:4%}
section#pano .col{align-items:center;display:flex}
section#pano{display:flex;flex-direction:column;gap:10px;padding:20px 50px}
section#pano table .img{width:70%}
section#pano table#compacts-table .img{width:18.7%}
section#pano table#cdf-table .img,section#pano table#lattes-table .img{width:34%}
section#pano table#agglo-table .img{width:46%}
section#pano table#contreplaque-table .img{width:80%}
section#pano table#contrebalancement-table .img{width:22.5%}
section#pano table .img:hover img{filter:brightness(1.2) saturate(100%) hue-rotate(70deg)}
section#pano table .img img{cursor:pointer;width:100%}
section#pano table .img img:hover{animation:pulse 1s infinite}
header .container .logo,footer .contenu .logo{width:25%}
header .container .logo a img,footer .contenu .logo img,section#contact .right img,section#contact .container .img img,section#pano .con .img img{width:100%}
section#contact .right img,section#contact .container .img img{transition:transform .5s ease;transform:scale(1) rotate(0deg)}
section#contact .right img:hover,section#contact .container .img img:hover{transform:scale(1.1) rotate(5deg)}
header .logo #logo-1,header li:hover .submenu,header .submenu li,.visible,footer .submenu li{display:block}
header .logo #logo-2,section#strat .selector label{display:none}
header .container .other svg,footer svg{fill:#fff;height:25px;width:25px}
header .container .other svg#logout-icon{stroke:#fff;fill:none}
header .container .search a,footer .mention a,footer .contenu .produit ul li a{color:#fff;text-decoration:none}
footer .contenu .produit ul li{padding:3px}
footer hr{border:none;border-top:2px solid #fff;width:100%}
footer .contenu .social .logo,footer .contenu .contact .adresse,footer .contenu .contact .tel,footer .contenu .contact .email{align-items:center;display:flex;gap:10px}
section#partenaires .slider .slides,section#hero .slider .slides{display:flex;gap:10px;height:100%;overflow:hidden;width:100%}
section#partenaires .slides,section#hero .slides{scroll-behavior:smooth}
section#partenaires .slides.active,section#hero .slides.active{scroll-behavior:inherit}
section#partenaires .slider .slides .slide img,section#hero .slider .slides .slide img{height:100%;object-fit:contain;width:100%}
section#contact .container .img{width:30%}
section#login{width:100%;max-width:1200px;padding:20px!important;align-items:center;display:flex}
section#login-container{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 518px);padding:20px}
section#login form p a{color:#0056B3}
section#login-container section#login a{color:#fff;font-size:12px}
section#login-container section#login a:hover{color:#0094FF}
section#login form input{padding:5px;width:100%}
section#contact .text{align-items:center;display:flex;flex-direction:column;gap:10px}
.panier .product-item{align-items:center;display:flex;gap:20px}
.scroll-to-top-button{position:fixed;bottom:35px;right:35px;background-color:#007ACC;color:#fff;border:none;padding:15px;border-radius:50%;cursor:pointer;z-index:1000;transition:background-color .3s ease,transform .3s ease;font-size:22px;line-height:1;width:50px}
.scroll-to-top-button:hover{background-color:#0F64A3;transform:translateY(-5px)}
.scroll-to-top-button.show{display:block;animation:fadeIn .3s}
#bouton-panier,section#strat #filters form label,section#strat #filters form input{cursor:pointer}
.panier .panier-content{display:flex;flex-direction:column;gap:20px}
@keyframes fadeIn {from{opacity:0}to{opacity:1}}
@keyframes pulse {50%{transform:scale(1.1)}0%,100%{transform:scale(1)}}
section#content{align-items:center;display:flex;flex-direction:column;gap:20px;padding:30px;border-radius:8px;box-shadow:0 4px 8px #0000001a;width:100%;max-width:450px;text-align:center}
section#content h1{font-size:24px;margin-bottom:20px}
section#content form div{display:flex;gap:10px}
section#content form button{background-color:#007ACC;color:#fff;border:none;padding:12px 20px;width:100%;border-radius:10px;cursor:pointer}
section#content form button:hover{background:#0056B3}
section#content form .form-group div{border-radius:4px;border:1px solid #ccc;padding:12px;width:100%;margin-bottom:20px;align-items:center}
section#content form .form-group{flex-direction:column;align-items:center;justify-content:center}
section#reset form{align-items:center;display:flex;flex-direction:column;gap:20px}
section#reset form .form-control{align-items:center;display:flex;gap:10px;width:100%;padding:12px;border:1px solid #ccc;border-radius:4px}
section#reset form .form-control input{border-radius:10px;padding:10px}
section#reset{background-color:#fff;border-radius:8px;padding:30px;width:100%;max-width:400px;box-shadow:0 4px 8px #0000001a}
section#reset h1{text-align:center;color:#333;margin-bottom:20px}
section#reset form button:hover{background:#0056B3}
section#check{border-radius:8px;padding:30px;width:100%;max-width:850px;box-shadow:0 4px 8px #0000001a;text-align:center}
section#check a{color:#007bff;text-decoration:none}
section#check a:hover{text-decoration:underline}
section#check p{font-size:16px;color:#333;line-height:1.5}
section#check .alert{margin-bottom:20px;border-radius:4px}
section#check .alert-info{background-color:#d9f7ff;border:1px solid #b3e0ff;padding:20px}
small{display:block;margin-top:10px;text-align:center;color:#555}
section#commande .commande__container{display:flex;gap:20px;width:-webkit-fill-available}
section#commande .reference .form-control{display:flex;flex-direction:column;gap:10px;justify-content:flex-start}
section#commande .commande__container__left,section#commande .commande__container__right{width:100%}
section#commande .commande__container__left form input,section#commande .reference input,section#commande .reference textarea,section#commande .adresse input{background-color:#fff;border-radius:5px;padding:10px;border:1px solid #ddd}
section#commande .expedition{display:flex;gap:40%;align-items:center}
section#commande .overeat{background-color:#f2f2f2;padding:15px;border-radius:5px;display:flex;flex-direction:column;gap:20px}
section#commande .sousTotal{display:flex;gap:45%}
section#commande .total{display:flex;gap:48%}
section#commande .btn{background-color:#0056b3;color:#fff;border:none;border-radius:5px;padding:12px 20px;font-size:1rem;cursor:pointer;transition:background-color .3s;width:fit-content}
section#commande .btn:hover{background-color:#0056b3}
section#commande select{padding:10px;border:1px solid #ddd;border-radius:5px;width:100%;font-size:1rem;background-color:#f2f2f2;transition:border .3s}
section#commande select:focus{border-color:#0094FF;outline:none}
section#commande .message p{font-size:12px}
section#commande .message{display:flex;align-items:center;justify-content:space-evenly;margin:20px 0}
section#commande .adresse{display:flex;flex-direction:column;gap:20px;margin:10px 0 20px}
section#commande .expedier{margin-bottom:15px}
section#resultat{align-items:center;display:flex;flex-direction:column;gap:20px;margin:20px 0;padding:20px 150px}
section#resultat .parent{cursor:pointer;display:grid;grid-column-gap:20px;grid-row-gap:20px;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr)}
section#resultat .parent .product{align-items:center;background:#E5E7E9;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;padding:15px}
.accordion{font-size:15px;outline:none;text-align:left;transition:.4s;width:100%}
.accordion:hover,.active{background-color:#ccc}
.panel{background-color:#fff;max-height:0;overflow:hidden;padding:0 18px;transition:max-height .2s ease-out;display: flex;flex-direction: column;gap: 5px;}
section#commande #panier,section#commande .reference,section#commande .commande__container__left form{display:flex;flex-direction:column;gap:20px}
section#commande .commande__container__left form .form-group,section#commande .adresse .form-group{display:flex;gap:30px}
section#commande .commande__container__left form .form-control,section#commande .adresse .form-control{display:flex;flex-direction:column;gap:10px;width:100%}
section#mention{padding:40px 20px;margin:auto;border-radius:10px;background:#f9faf9}
section#mention .container{max-width:1200px;display:flex;flex-direction:column;gap:25px;margin:auto}
section#mention h1{margin-bottom:20px;text-align:center;font-size:2rem}
section#mention .mention{background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}
section#mention .mention h2{font-size:1.5rem;margin-bottom:10px;padding-bottom:5px;border-bottom:2px solid #ddd}
section#mention .mention p{margin:15px 0;line-height:1.6;color:#333}
section#mention .mention ul{padding-left:20px}
section#mention .mention li{margin-bottom:8px;list-style-type:disc}
section#content form div input{border-radius:10px;padding:5px;border:#000 1px solid}
section#content form{display:flex;flex-direction:column;gap:10px;align-items:center}
section#resultat .container #loading img, section#strat .container #loading2 img, section#promo .container #loading3 img{width:8%}
.contenaire{width:80%;margin:auto;overflow:hidden;padding:0 20px}
section#confirmed,section#commande{background:#fff;box-shadow:0 0 10px 10px #0000001a;margin:20px 0;padding:20px;border-radius:5px}
section#confirmed .price,section#commande .price{white-space:nowrap}
section#confirmed table,section#commande table{width:100%;border-collapse:collapse;margin-bottom:20px}
section#confirmed th,section#confirmed td,section#commande th,section#commande td{text-align:left;padding:12px;border:1px solid #ddd}
section#confirmed th,section#commande th{background-color:#f2f2f2}
section#confirmed .product-info .info,section#commande .product-info .info{display:flex;gap:10px;flex-direction:column}
section#confirmed .product-info .img img,section#commande .product-info .img img{width:275px;border-radius:20px;height:225px}
section#confirmed .product-image,section#commande .product-image{width:80px;height:80px;object-fit:cover;margin-right:20px}
section#confirmed .order-summary,section#commande .order-summary{display:flex;justify-content:space-between;margin-bottom:20px}
section#confirmed .order-summary > div,section#commande .order-summary > div{flex:1}
section#confirmed .billing-address,section#commande .billing-address{background-color:#f2f2f2;padding:15px;border-radius:5px}
section#confirmed .provoke,section#commande .provoke{display:flex;flex-direction:column;gap:7px}
footer .contenu .mail{margin-bottom:10px}
.hover-effect:hover,footer .contenu .produit ul li a:hover{color:#0094FF}
footer .contenu .reseau svg:hover{fill:#0094FF}
.btn-group{display:flex;gap:10px;justify-content:center;margin-top:10px}
.cookie-banner{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);width:90%;max-width:600px;background-color:#444;color:#fff;text-align:center;padding:15px 20px;border-radius:8px;box-shadow:0 4px 10px #0000004d;z-index:1000}
.cookie-banner p{margin:0;font-size:.9rem}
.cookie-banner .btn-group{display:flex;justify-content:center;gap:10px;margin-top:10px}
.cookie-banner button{padding:8px 16px;font-size:.85rem;border-radius:20px;border:none;cursor:pointer;transition:background-color .3s ease}
.cookie-banner button.btn-primary{background-color:#007ACC;color:#fff}
.cookie-banner button.btn-secondary{background-color:#555;color:#fff}
.cookie-banner button.btn-secondary:hover{background-color:#777}
.cookie-link{color:#0094FF;text-decoration:underline;font-weight:500}
.cookie-link:hover{color:#00c3ff}
#custom-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;z-index:9998;display:none}
#custom-popup-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#333;color:#fff;border-radius:12px;box-shadow:0 8px 20px #0000004d;width:90%;max-width:600px;text-align:center;padding:20px;z-index:9999;display:none;transition:transform .3s ease,opacity .3s ease}
#close-popup{position:absolute;top:5px;right:12px;background:transparent;border:none;cursor:pointer;font-size:24px;color:#ff5c5c}
#custom-popup-container .title{font-size:1.8rem;font-weight:700;color:#0094FF;margin-bottom:10px}
#promopourcentage{font-size:1.5rem;font-weight:700;font-style:italic;color:#fff;margin:15px 0}
#pttext,#pptext{color:#ccc;font-size:1rem;margin-top:5px}
#custom-popup-container a{display:inline-block;background:#007ACC;color:#fff;text-decoration:none;padding:10px 20px;border-radius:5px;margin-top:20px;transition:background-color .3s ease}
#custom-popup-container img{width:40%;border-radius:10px;margin:15px 0;max-width:200px}
#custom-popup-container .text{display:flex;flex-direction:column;gap:10px;align-items:center;padding:10px 20px}
.btn-back{margin:auto;display:none}
section#reset form button{background-color:#007ACC;border:none;border-radius:10px;color:#FFF;padding:10px;cursor:pointer}
section#commande h2,section#confirmed h2{margin:20px 0}
section#resultat .container a,.hover-effect{color:#fff;text-decoration:none}
footer .contenu .mail .doc{display:flex;justify-content:space-between}
section#strat #filters form #closeFilter,#btn-filtre,#icon-search,.hidden,.cookie-banner.hidden{display:none}
section#confirmed .product-info,section#commande .product-info{display:flex;align-items:center;gap:20px}
section#strat .parent .product h3,section#resultat .container #loading, section#strat .container #loading2, section#promo .container #loading3, section#confirmed h1,section#commande h1{text-align:center}
.cookie-banner button.btn-primary:hover,#custom-popup-container a:hover{background-color:#007acc}
section#mention ul{padding:0 20px}
section#form label.required::after,section#bande-de-chant label.required-field::after{content:" *";color:red}
.emoji-container{display:flex;align-items:center;justify-content:center;gap:8px;background-color:#ebf8ff;padding:12px;border-radius:8px}
.emoji{font-size:2rem;cursor:pointer;transition:transform .2s}
.emoji:hover{transform:scale(1.2)}
.emoji-text{color:#4a5568;font-size:1rem}
.modal-content{display:none;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a;max-width:900px;width:50%;max-height:90vh;overflow-y:auto;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:11}
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #ddd}
.modal-title{font-size:1.25rem;font-weight:600;color:#333}
.modal-close-btn{font-size:1.5rem;color:#555;background:none;border:none;cursor:pointer}
.modal-close-btn:hover{color:#333}
.modal-body{display:grid;grid-template-columns:repeat(2,1fr);grid-column-gap:20px;padding:24px;justify-items:center;align-items:center}
.image-container{background-color:#f0f0f0;border-radius:8px;padding:16px;display:flex;align-items:center;justify-content:center}
.panel-image{height:240px;width:240px;object-fit:contain}
.details-container{display:flex;flex-direction:column;gap:12px}
.detail-title{font-size:.875rem;font-weight:500;color:#555}
.detail-text{font-size:1rem;color:#333}
.price-text{font-size:1.5rem;font-weight:700;color:#0073e6}
.total-price-text{font-size:1.125rem;font-weight:700;color:#e60000}
.modal-footer{padding:16px;display:flex;justify-content:space-between;align-items:center;background-color:#f9f9f9;border-top:1px solid #ddd}
.quantity-controls{display:flex;align-items:center}
.quantity-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:#f0f0f0;border:1px solid #ddd;cursor:pointer}
.quantity-btn:hover{background-color:#e6e6e6}
.quantity-input{width:60px;height:32px;text-align:center;border:1px solid #ddd;font-size:1rem}
.add-to-cart-btn{background-color:#0073e6;color:#fff;padding:8px 16px;border-radius:4px;font-size:1rem;cursor:pointer;border:none}
.add-to-cart-btn:hover{background-color:#005bb5}
.dialog-overlay {position:fixed;top:50%;left:50%;max-width:1000px;max-height:65vh;z-index: 999;transform:translate(-50%, -50%);}
#dialog{display:none}
.dialog-content{background:#fff;max-width:900px;padding:15px;border-radius:10px;position:relative;max-height:90vh;overflow-y:auto}
.close-btn-strat{position:absolute;top:10px;right:10px;background:#fff;border:none;font-size:20px;cursor:pointer;padding:5px;height:2.25rem;width:2.25rem;border-radius:100%;box-shadow:0 4px 6px -1px #0000001a}
.dialog-title{font-size:1.5rem;line-height:2rem;margin-bottom:10px}
.product-details-panel{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.product-image img{width:400px;height:150px;object-fit:cover;border-radius:8px;border:1px solid #ddd;aspect-ratio:1/1}
.product-info{display:grid;grid-template-columns:repeat(2,1fr);align-items:center}
.product-info-text{display:flex;flex-direction:column}
.text-first{font-size:14px;font-weight:500;color:#757575}
.product-info p{margin:5px 0}
#dialog h3{font-size:18px;font-weight:600;text-align:left!important;margin-top:10px}
.table-container{overflow-x:auto;margin:10px 0}
.table-container table{width:100%;border-collapse:collapse}
.table-container th,.table-container td{padding:8px;text-align:left;font-size:14px}
.table-container td{white-space:wrap}
.table-container td:nth-child(2){width:25%}
.table-container th{white-space:nowrap;border-bottom:1px solid #ddd;color:#757575;font-weight:500}
.table-container tr:hover{background-color:#f5f5f580}
.table-container tr td input{width:5rem;height:2.25rem;padding:5px;border:1px solid #ddd;border-radius:5px}
.product-card{border:1px solid #ddd;border-radius:8px;overflow:hidden;background:#fff;transition:box-shadow .3s ease-in-out;cursor:pointer}
.product-card:hover{box-shadow:0 4px 10px #0000001a}
.product-image-container{width:100%;height:180px;overflow:hidden}
.product-image{width:100%;height:100%;object-fit:cover}
.product-image-contain{width:100%;height:100%;object-fit:contain}
.product-category{display:block;font-size:14px;color:#666;margin-bottom:5px}
.product-title{font-size:18px;margin-bottom:5px}
.product-code{font-size:14px;color:#888}
.product-infos {padding: 15px;}
.header {display: flex;justify-content: space-between;align-items: start;}
.product-name {font-size: 18px;font-weight: bold;color: #333;}
.product-brand {font-size: 14px;color: #434343;}
.info-button {background: none;border: none;font-size: 18px;cursor: pointer;color: #888;transition: color 0.2s;}
.info-button:hover {color: #555;}
.details {margin-top: 10px;}
.product-dimensions {font-size: 14px;color: #666;}
.product-reference {font-size: 12px;color: #676666;}
.product-price {font-size: 20px;font-weight: bold;color: #007bff;margin-top: 5px;}
#dialog .footer{text-align:right}
#dialog .add-to-cart{background:#0056b3;color:#fff;border:none;padding:10px 15px;cursor:pointer;border-radius:5px}
#dialog .add-to-cart:hover{background:#0056b3}
.panel-table{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;width:100%;border-collapse:separate;border-spacing:0;border-radius:10px;overflow:visible;box-shadow:0 4px 20px #0000001a;background-color:#fff}
.panel-table thead th{background-color:#000;color:#fff;padding:10px 8px;text-align:center;font-weight:600;position:sticky;top:0;z-index:10;border:none;width:35px}
.panel-table thead th:first-child{text-align:left;padding-left:20px;width:150px}
.panel-table tbody th{text-align:left;padding:15px 20px;background-color:#164F81;color:#fff;font-weight:600;border-bottom:1px solid #ddd;border:none}
.panel-table tbody tr.dimension-row{background-color:#f8f8f8;font-size:.9em;font-weight:600}
.panel-table tbody tr.dimension-row td{padding:10px;text-align:left;color:#000;border:none}
.panel-table tbody td{padding:10px;text-align:center;border-bottom:1px solid #ddd}
.panel-table tbody tr:nth-child(even){background-color:#f0f0f0}
.panel-table tbody tr:hover{background-color:#0094ff33}
.category-header{background-color:#D12020;color:#fff;font-size:1.1em;padding:12px 20px;text-align:center}
.panel-table thead tr{background:#000}
section#pano .filter{display:flex;gap:20px;justify-content:center;align-items:flex-end;margin-bottom:20px}
section#pano .filter-item{display:flex;gap:10px;flex-direction:column}
section#pano select{padding:10px 100px 10px 10px;border-radius:5px;width:100%;font-size:1rem;background-color:#f0f0f0;border:none}
section#pano #resetButton{background-color:#c62828;color:#fff;border:none;padding:12px 15px;border-radius:4px;cursor:pointer;font-weight:500;transition:background-color .3s;margin-left:10px}
section#pano #resetButton:hover{background-color:#b71c1c}
section#form {background: #f9faf9;padding:1rem;}
section#form .form-container{margin:40px auto;padding:30px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;max-width:900px;background:#fff;border-radius:10px;gap:20px}
section#form .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;width:100%}
section#form .form-group{display:flex;flex-direction:column;width:100%}
section#form .form-group label{font-weight:700;margin-bottom:5px}
section#form .form-group input,.form-group textarea{padding:10px;border:1px solid #ddd;border-radius:5px;font-size:1rem}
section#form .form-group textarea{min-height:120px}
section#form form{display:flex;flex-direction:column;gap:15px;align-items:flex-start}
section#form form .form-group div{display:flex;flex-direction:column}
section#form .submit-button{width:100%;background:#c62828;color:#fff;border:none;padding:10px 15px;font-size:16px;cursor:pointer;border-radius:5px}
section#form .submit-button:hover{background:#b71c1c}
.support-section{text-align:center;padding:20px;background:#f9fafb;display:flex;gap:20px;flex-direction:column;}
.support-container{display:flex;justify-content:center;gap:20px;max-width:1000px;margin:auto}
.support-box{background:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 10px #0000001a;width:45%}
.support-text{color:#666;margin-bottom:15px}
.btn-support{display:inline-block;padding:10px 15px;color:#fff;background:#c62828;text-decoration:none;border-radius:5px;transition:.3s}
.btn-support:hover{background:#b71c1c;color:#fff}
#filter_form_brands, #filter_form_lengths, #filter_form_thicknesses, #filter_form_widths, #filter_form_gammes{display:flex;flex-direction:column;gap:5px}
section.colle{max-width:1280px;margin: 0 auto;}
@media screen and (max-width:480px) {
footer .contenu .logo{margin-bottom:20px;width:80%}
footer .contenu .mail .doc{justify-content:center}
footer .contenu .produit,footer .contenu .mail,footer .contenu .contact{display:flex;flex-direction:column;gap:15px;margin-bottom:20px;text-align:center}
footer .contenu .social .logo{align-items:center;display:flex;gap:10px;justify-content:center;margin-bottom:0}
footer .contenu .produit ul{list-style-type:none}
footer .contenu .produit ul li a,footer .contenu .mail a{color:#fff;text-decoration:none}
footer .contenu .contact .adresse,footer .contenu .contact .tel,footer .contenu .contact .email{align-items:center;display:flex;gap:10px}
footer .contenu .contact .adresse .svg,footer .contenu .contact .tel .svg,footer .contenu .contact .email .svg{border-image:linear-gradient(to left,#0094FF,#fff,red) 1;border-style:solid;border-width:2px;padding:5px}
footer .contenu .contact .adresse .svg svg,footer .contenu .contact .tel .svg svg,footer .contenu .contact .email .svg svg{fill:#fff;height:20px;width:20px}
footer .contenu .social{align-items:center;display:flex;flex-direction:column;gap:15px;text-align:center}
section#contact .container{flex-direction:column;gap:2rem;text-align:center}
section#contact .right{width:80%}
section#partenaires .slider{height:200px;position:relative;width:300px}
section#moment .parent,section#strat .parent,section#promo .parent,section#resultat .parent{grid-template-columns:repeat(1,1fr)}
section#moment .parent .product .img,section#strat .parent .product .img{display:flex;justify-content:center}
header .container .logo{padding:10px;width:25%}
header .container .search .search-container input#search-bar,section#strat .search .search-container input{border:1px solid #D0CFCE;border-radius:20px;font-size:1rem;height:45px;outline:none;padding:0 20px;transition:border .35s ease;width:calc(100% - 45px)}
header .container .search .search-container .search-icon{height:45px;position:absolute;right:50px;top:50%;transform:translateY(-50%);width:45px}
header nav ul{align-items:center;display:flex;flex-direction:column;gap:20px;list-style-type:none;text-decoration:none}
header nav ul li a{color:#000;font-size:26px;text-decoration:none}
header .menu-toggle{cursor:pointer;display:block}
header .bar{background-color:#000;height:3px;margin:5px 0;transition:.4s;width:25px}
header .menu-toggle.active2 .bar:nth-child(1){transform:rotate(-45deg) translate(-5px,6px)}
header .menu-toggle.active2 .bar:nth-child(2){opacity:0}
header .menu-toggle.active2 .bar:nth-child(3){transform:rotate(45deg) translate(-5px,-6px)}
header .parentMenu{display:flex;justify-content:center;margin:10px 0}
section#strat .top{align-items:center;flex-direction:column;margin-bottom:5px;gap:10px}
section#strat .top .search-container{padding:0;width:420px}
header .container .search svg path{cursor:pointer;fill:#fff}
header .container .search #search-general-form.active3{display:block;margin:0 0 0 50px;position:absolute;top:6vh}
header .container .search{align-items:center;display:flex;flex-direction:column;position:relative}
section#heroes .hero-text{left:50%}
section#strat .search .search-container .search-icon{right:25px}
section#strat #filters{padding:0;position:initial}
section#strat #filters #btn-filtre{background-color:#007ACC;bottom:0;color:#fff;cursor:pointer;display:flex;left:50%;padding:10px;position:fixed;transform:translate(-50%,-50%)}
section#strat #filters form.active4{background:#fff;left:50%;position:fixed;top:50%;transform:translate(-50%,-50%);width:100%;z-index:2;display: grid;grid-template-columns: repeat(3, 1fr);grid-template-rows: auto;grid-column-gap: 0px;grid-row-gap: 0px;}
section#strat #filters h2{grid-area: 1 / 1 / 2 / 4;}
section#strat #filters form .form-control:nth-child(3){grid-area: 2 / 1 / 2 / 4;}
section#strat #filters form .form-control:nth-child(4){grid-area: 3/1/4/4;}
section#strat #filters form .form-control:nth-child(5){grid-area:4/1/5/2;}
section#strat #filters form .form-control:nth-child(6){grid-area:4/2/5/3;}
section#strat #filters form .form-control:nth-child(7){grid-area:4/3/5/4;}
section#strat #filters form button{grid-area: 5 / 1 / 6 / 4;}
section#strat #filters form #closeFilter{color:red;cursor:pointer;display:block;position:absolute;right:10px;top:10px}
.table-responsive td{background:#e5e7e9;margin-top:-1px;padding-left:150px!important;position:relative}
.table-responsive td::before{align-items:center;background-color:#e5e7e9;bottom:0;content:attr(data-label);display:flex;font-weight:700;left:0;position:absolute;top:0;width:130px}
.table-responsive th + td{padding-left:10px}
section#pano .con .img{width:30%}
header .container .search .search-container,section#strat .search .search-container,.panier{width:300px}
header nav,section#hero,header .logo #logo-1,header .container .search #search-general-form,section#strat #filters form,.table-responsive thead{display:none}
section#pano th:nth-child(0n+4),section#pano th:nth-child(0n+2),section#pano th:nth-child(0n+3){padding:5px 9px}
section#pano{overflow-x:auto}
section#contact,section#about,section#partenaire,section#moment,section#bande-de-chant,section#promo,section#pano,section#login,section#mention,section#resultat{padding:20px}
video{width:256px;height:145px}
section#commande .expedition{gap:20%}
section#commande .sousTotal,section#commande .total{gap:0;justify-content:space-between}
section#commande .commande__container__left form .form-group,section#commande .adresse .form-group{gap:20px;flex-direction:column}
section#commande .commande__container .commande__container__right textarea{width:100%;max-width:306px}
section#confirmed .product-info,section#commande .product-info{flex-direction:row}
.btn-back,#icon-search,header .logo #logo-2,.table-responsive table,.table-responsive tbody,.table-responsive tr,.table-responsive th,.table-responsive td{display:block}
section#confirmed .order-summary,section#commande .order-summary{flex-direction:column;gap:10px;padding:10px 0}
footer .contenu,section#strat,section#bande-de-chant form .form-group,section#commande .commande__container{flex-direction:column}
section#contact .container .img,section#pano table .img{width:100%}
footer .mention,section#bande-de-chant h2{text-align:center}
section#moment .parent div .img img,section#strat .parent div .img img,section#promo .parent div .img img,section#resultat .parent div .img img{width:235px;height:190px}
.hover-effect{text-align:left}
section#partenaire h1,section#contact h1,section#info h1,section#resultat h1{text-align:center}
section#strat.colle{padding:initial}
section#strat{gap:0}
section#bande-de-chant form .form-group div.form-control{align-items:center}
section#strat .parent .corian h3,section#resultat .parent .product h3{width:230px;text-align:center}
section#strat .parent .corian h1,section#resultat .parent .product h1{font-size:20px}
section#resultat .container .search-container{width:315px;display:flex;justify-content:center}
section#resultat .container .search-container input#search-bar{width:calc(100% - 5px)}
section#resultat .container .search-container .search-icon{right:30px}
header li:hover .submenu,footer li:hover .submenu{left:50%;transform:translateX(-50%)}
footer .submenu li:nth-child(8){width:110px;text-align:left}
#custom-popup-container .title{font-size:1rem;margin:0}
#custom-popup-container .text{padding:0}
#promopourcentage{font-size:.9rem;margin:10px 0}
#custom-popup-container img{margin:5px 0}
#pttext,#pptext{font-size:.8rem}
#custom-popup-container a{font-size:1rem;margin-top:10px;padding:5px 10px}
#custom-popup-container h2{font-size:1rem}
.modal-content{width:95%}
.modal-body{grid-template-columns:1fr;grid-row-gap:20px;padding:5px}
.add-to-cart-btn{font-size:revert}
.dialog-content{width:50%;margin: auto;max-height: inherit;}
.dialog-content .product-details{grid-template-columns:1fr}
.product-details-panel{grid-template-columns:1fr}
.dialog-content .product-image img{width:274px}
.panel-table{overflow-x:auto}
section#dash{flex-direction:column}
section#dash .sidebar{height:auto;border-radius:20px;margin:auto}
section#dash .cards,.history-header{flex-direction:column}
section#dash .card-content{overflow-y:auto;padding:10px}
.support-container{flex-direction:column}
.support-box{width:100%}
section#form .form-grid{grid-template-columns:1fr}
section#pano .filter{flex-direction:column;align-items:stretch}
section#tuto .container-video{grid-template-columns:repeat(1,minmax(0,1fr))}
section#dash .separator{margin:10px 0 5px}
section#dash .history-header{padding:0;gap:10px}
section#dash .card-icon{padding:0}
section#dash .card{padding:10px}
section#dash .overview{margin-bottom:20px}
section#dash .main-content{padding:1rem 2rem}
section#dash .order-header{flex-direction:column;gap:20px;align-items:flex-start}
section#dash .order-grid{grid-template-columns:1fr}
section#dash .order-item{flex-direction:column}
section#dash .order-item-img{width:100%;object-fit:fill}
section#info .container div div{flex-direction:column}
section#form.form-container{margin:0}
section#info h2, section#tuto h2{margin-bottom:2rem;}
section#info .container{padding:0;}
section#moment .parent {width: inherit;}
}