/***** fonts et reset *****/ @import url('https://fonts.googleapis.com/css?family=Barlow:400,500,600,700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap'); @media (min-width:1201px) { a, #header .dropdown .expand-more { transition:all 300ms ease-in-out;} } /*** global ***/ body { font:normal 15px/30px "Barlow"; letter-spacing:0.4px;} #wrapper { box-shadow:none; padding:0; background:#fff; overflow:hidden;} a:focus { outline:none; color:inherit; text-decoration:none;} @media (max-width:767px) { body { font-size: 14px; line-height: 180%;} } /***** scollbar *****/ ::-webkit-scrollbar { width: 6px; background-color:#111;} ::-webkit-scrollbar-thumb { background-color:#bfa477;} /*** header ***/ #header { color:#222; width: 100%; font-size: 0; line-height: 0; letter-spacing: 0; position: fixed; left: 0; top: 0; z-index: 200; transition: all 300ms ease;} #header .container { width: 90vw; min-width: inherit; padding: 0;} #header .header-nav { background: #111; border:none; margin:0;} #header .header-nav .titre_site { font: 400 14px/42px "Barlow"; margin: 0; color: #fff; display: inline-block;} #header .header-nav .tel { font: 400 14px/42px "Barlow"; margin: 0; color: #fff; padding-left: 28px; background: url("../img/tel.svg") 0 50% no-repeat; position: absolute; left: 300px; top: 0; width: max-content;} #header .header-nav .tel span { color: #bfa477;} #header .header-nav a { color:#fff; font-size:14px;} #header .header-nav .user-info { margin:0 50px 0 40px;} #header .header-nav .user-info a { display:inline-block; vertical-align: top; line-height:44px;} #header .header-nav .user-info a i { display:none;} #header .header-nav .language-selector { margin:0;} #header .header-nav .language-selector button { cursor:pointer;} #header .dropdown .expand-more { color:#fff; font-size: 14px; line-height: 42px; display: inline-block;vertical-align: top;} #header .dropdown .material-icons.expand-more { font-size: 17px; line-height: 44px; height: 44px; margin: 0 -4px 0 4px;} #header .dropdown-menu { border:none; background:#bfa477; margin:0; left:-1.5rem;} #header .header-nav .blockcart { height: auto; padding: 0; margin: 0; background: none;} #header .header-nav .blockcart .header { margin: 0; display: block; height: 44px; line-height: 42px; background: #bfa477; padding:0 30px 0 25px;} #header .header-nav .blockcart .header a { display:block;} #header .header-nav .blockcart .header i { font: inherit; font-size: 0; width: 28px; height: 44px; background: url(../img/cart.svg) 0 48% no-repeat; vertical-align: top;} #header .header-nav .blockcart .header span { font-size: 14px; color: #000;} #header .header-nav .cart-products-count { padding-left: 5px;} #header .header-nav .cart-preview.active { background:none;} #header .header-top { padding: 0;} #header .header-top .logo_site { width: 180px; height: 50px; display:block; background:url(../img/logo.svg) 50% / contain no-repeat; position: absolute; left: 0; top: calc(50% - 25px); transform-origin: left center;} #header .header-top .nav_search { text-align:center; padding:0 15px;} #header .header-top .menu { margin:0; padding:0;} #header .header-top .top-menu { margin:0;} #header .top-menu li { margin:0 20px; position:relative;} #header .top-menu li:first-child a[data-depth="0"] { font-weight: 600; text-transform: uppercase; letter-spacing: 0.8px;} #header .top-menu li.current>a { color:#bfa477;} #header .top-menu a[data-depth="0"] { padding: 0; text-transform: none; height: 106px; font: 400 16px/104px "Barlow"; transition: all 300ms ease;} #header .sub-menu { box-shadow: 0 0 50px 0 #00000010; width: 240px; min-width: inherit; top: 80% !important; left: -25px; margin: 0; padding: 15px 0; text-align: left; background: #fff;} #header .sub-menu ul[data-depth="1"]>li { float: none; margin:0;} #header .sub-menu a[data-depth="1"] { padding: 0 25px; font: 400 15px/35px "Barlow"; letter-spacing: 0.6px; text-transform:none; background: url("../img/arrow_list.svg") calc(100% - 25px) 55% no-repeat;} #header .sub-menu ul[data-depth="1"]>.current a { color:#222;} #header .sub-menu ul[data-depth="2"] { display: none;} #header .header-top .search-widget { position:absolute; right:0; top: calc(50% - 25px); width:250px; min-width:inherit; transition: top 300ms ease-in-out;} #header .search-widget form input[type=text] { border:1px solid #ddd; padding:0 20px 2px 20px; height:50px; font-size:14px; letter-spacing:0.4px; outline:none !important;} #header .search-widget form button[type=submit] { bottom:0; right:0; width:40px; height:100%; background:url(../img/search.svg) 2px 16px no-repeat; padding:0; cursor:pointer;} #header .search-widget form button[type=submit] i { display:none;} #header .language-selector li a { line-height: 30px; } @media (min-width:1201px) { #header .top-menu li:hover>a, #header .language-selector:hover .expand-more, #header .sub-menu ul[data-depth="1"]>.current a:hover, #header .header-nav a:hover { color:#bfa477;} #header .header-nav .language-selector a:hover { color:#000;} .sticky #header { top: -44px; box-shadow: 0 0 50px 0 #00000010;} .sticky.scrolling_top #header { top: 0;} .sticky:not(.scrolling_top) #header .top-menu a[data-depth="0"] { height: 86px; line-height: 84px;} } @media (max-width:1300px) { #header .top-menu li { margin: 0 30px 0 0;} } @media (max-width:1200px) { #header .header-nav .tel { left: 300px; width: 120px; font-size: 0; line-height: 0; padding-left: 25px;} #header .header-nav .tel span { font-size: 14px; line-height: 44px; display: inline-block; color: #fff;} #header .header-top .menu { width: 100%;} #header .header-top #top-menu { padding: 76px 0 0 0; text-align: center;} #header .header-top #top-menu li:last-child { margin: 0;} #header .top-menu a[data-depth="0"] { height: 60px; line-height: 58px;} #header .sub-menu { margin-top: -60px;} #header .header-top .search-widget { margin: 0; width: 55vw; top: 18px;} #header .header-top .logo_site { width: 150px; top: 18px;} .sticky #header { top: -124px;} .sticky.scrolling_top #header { top: 0;} } @media (max-width:1000px) { #header .header-nav .tel { display: none;} } @media (max-width:767px) { #header .container .row { margin: 0;} #header .header-top .clearfix { width: 80%; position: fixed; left: 0; } #header .header-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 500;} #header .header-nav .top-logo { display: none;} #header .header-nav .user-info { margin: 0;} #header .header-nav .user-info a { width: 70px; height: 50px; background: url("../img/icon_account.svg") 50% 48% no-repeat;} #header .header-nav #menu-icon { width: 50px; height: 50px; margin: 0 0 0 -13px; position: relative;} #header .header-nav #menu-icon i { width: 24px; height: 2px; background: #fff; position: absolute; right: 13px; top: 50%; margin: -1px 0 0 0; font-size: 0;} #header .header-nav #menu-icon i:before { width: 100%; height: 2px; background: #fff; position: absolute; right: 0; top: 7px; content: ""; transition: none;} #header .header-nav #menu-icon i:after { width: 100%; height: 2px; background: #fff; position: absolute; right: 0; top: -7px; content: ""; transition: none;} #header .header-nav #menu-icon { width: 50px; height: 50px; margin: 0 0 0 -13px; position: relative;} #header .header-nav #menu-icon i { width: 24px; height: 2px; background: #fff; position: absolute; right: 13px; top: 50%; margin: -1px 0 0 0; font-size: 0;} #header .header-nav #menu-icon i:before { width: 100%; height: 2px; background: #fff; position: absolute; right: 0; top: 7px; content: ""; transition: none;} #header .header-nav #menu-icon i:after { width: 100%; height: 2px; background: #fff; position: absolute; right: 0; top: -7px; content: ""; transition: none;} #header.is-open .header-nav #menu-icon i { height: 0;} #header.is-open .header-nav #menu-icon i:before { top: 0; transform: rotate(45deg);} #header.is-open .header-nav #menu-icon i:after { top: 0; transform: rotate(-45deg);} #header .header-nav .cart-preview .shopping-cart { vertical-align: top;} #header .header-nav .blockcart.inactive .cart-products-count { display: inline-block; vertical-align: top; font-size: 0; letter-spacing: 0; height: 50px; padding: 0 20px 0 0;} #header .header-nav .blockcart .cart-products-count { font-size: 15px;} #header .header-nav .blockcart .header { width: auto; height: 50px; padding: 0; margin-right: -5vw; font-size: 0; letter-spacing: 0; line-height: 48px;} #header .header-nav .blockcart .header i { width: 38px; height: 50px; background-position: 100% 48%;} #header .header-nav .blockcart .header span { padding: 0 20px 0 8px;} #header .header-top { background: #fff; height: auto;} #header .header-top .logo_site { width: 130px; background-image: url("../img/logo_mobile.svg"); position: fixed; left: calc(24px + 10vw); top: 0; z-index: 500;} #header .header-top .nav_search { padding: 0;} #header .header-top .search-widget { position: absolute; top: 50px; width: auto; right: -5vw; left: -5vw; margin: 0; padding: 12px 5vw; background: #fff; z-index: 5;} #header .search-widget form input[type=text] { height: 44px;} #header .search-widget form button[type=submit] { background-position: 2px 13px;} #header .header-top #top-menu { padding: 15px 0; margin-bottom: 20px; text-align: left;} #header .top-menu li { margin: 0;} #header .top-menu a[data-depth="0"] { border-color: #ddd; height: 56px; line-height: 54px;} #header .sub-menu { margin: 0; padding: 0; text-align: left;} #mobile_top_menu_wrapper { padding: 118px 0 0 0;} #mobile_top_menu_wrapper .js-top-menu-bottom .language-selector-wrapper { padding: 0;} #mobile_top_menu_wrapper .top-menu .sub-menu ul { padding-top: 15px;} #mobile_top_menu_wrapper .top-menu .sub-menu li>a { color: #222; padding: 0; font-weight: 400;} #mobile_top_menu_wrapper .top-menu .navbar-toggler { display: inline-block; vertical-align: middle; padding: 0; border: none; height: 34px; width: 50px; background: #f2f2f2;} #mobile_top_menu_wrapper .top-menu .navbar-toggler i { margin: 6px 13px;} #mobile_top_menu_wrapper .top-menu ul .navbar-toggler { background: #fff; height: 36px;} #mobile_top_menu_wrapper .top-menu ul .navbar-toggler i { margin: 8px 16px; font-size: 20px;} #header .sub-menu a[data-depth="1"] { background-position: calc(100% - 20px) 55%;} #header .sub-menu ul[data-depth="2"] { display: block;} #mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="2"] { padding: 0;} #mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="2"] li a { padding: 5px 10px;} #_mobile_language_selector { font-size: 14px; line-height: 20px;} #_mobile_language_selector select.link { border: 1px solid #ccc; padding: 4px 20px 6px 10px; margin-left: 5px; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url("../img/arrow_down.svg") 85% 50% no-repeat;} } /***** footer *****/ #footer { padding-top: 20px; position: relative;} .atouts { background: #111;} .atouts .blockreassurance { padding: 100px 15px 0 15px; position:relative;} .atouts .blockreassurance .block-icon { height:auto; line-height:0;} .atouts .blockreassurance .block-icon img, .atouts .blockreassurance .block-icon svg { width: auto; height: 40px;} .atouts .blockreassurance .block-title { font: 600 16px/24px "Barlow"; text-transform: uppercase; letter-spacing: 1.4px; display: block; color: #fff; margin: 20px 0 0 0;} .atouts .blockreassurance p { font: 400 italic 16px/24px "PT Serif"; text-transform: none; letter-spacing: 0.4px; margin: 0;} .atouts .block-social { display: none;} .footer-container { margin:0; padding: 100px 0 0 0; box-shadow:none; background: #111; color:#fff;} .footer-container .container { position:relative; padding: 0;} .footer-container .row { position:relative;} #block_myaccount_infos .myaccount-title a { color: #fff;} .bloc_footer { float:none; display:inline-block; vertical-align:top; width: 20%;} .bloc_footer .col-md-6 { float:none; width:auto;} .bloc_footer .h3 { font:700 16px/50px "Barlow"; color:#fff; text-transform:uppercase; letter-spacing:1.4px; margin-bottom:5px;} .bloc_footer ul, .bloc_footer li { margin:0;} .bloc_footer li a { color:#fff; font-size:14px; line-height:30px; letter-spacing:0.4px;} .block-contact { width:auto;} .block-contact p { color:#fff; font-size:14px; line-height:30px; letter-spacing:0.4px; margin-bottom:10px;} .block-contact .tel, .block-contact .mail { font-size:14px; line-height:20px; letter-spacing:0.4px; padding-left:30px; display:inline-block; color:#fff;} .block-contact .tel { background:url(../img/tel.svg) 0 50% no-repeat; margin-bottom:10px;} .block-contact .mail { background:url(../img/lettre.svg) 1px 60% no-repeat;} .footer-container .rs { position:absolute; right:15px; top:10px; font-size:0; letter-spacing:0;} .footer-container .rs a { width:50px; height:50px; display:inline-block; vertical-align:middle; margin-left:10px;} .footer-container .rs .facebook { background:url(../img/facebook.svg) 50% no-repeat #bfa477;} .footer-container .rs .instagram { background:url(../img/instagram.svg) 50% no-repeat #bfa477;} .footer-container .rs .scroll { background:url(../img/scrolltop.svg) 50% 50% no-repeat #333;} .footer_bottom { padding:20px 15px; line-height:0; margin: 80px 0 0 0;} .footer_bottom li { display:inline-block; font-size:11px; line-height:30px; letter-spacing:0.6px; margin:0 24px 0 0; position:relative;} .footer_bottom li:after { width:1px; height:8px; content:""; position:absolute; right:-14px; top:11px; background:#bfa477;} .footer_bottom li:last-child:after { display:none;} .footer_bottom li a { font-size:11px; color:#fff; text-decoration:none;} .toponweb { display: block; z-index: 85; position: absolute; right: 0; bottom: 20px;} .toponweb img { width: 76px; height: auto; display: block; margin: 0 auto; filter: invert(1);} @media (max-width:1200px) { #footer { padding-top: 0;} .atouts .blockreassurance { padding-top: 80px;} .footer-container { padding-top: 80px;} .footer_bottom { margin-top: 60px;} } @media (max-width:1000px) { .bloc_footer { width:33.33%;} .block-contact { width: auto; float: none; padding: 0 15px; margin-top: 30px;} } @media (max-width:767px) { #footer { padding-top: 20px;} .footer-container { padding-top: 0;} .bloc_footer { width:100%; padding: 0;} .block-contact { width: auto; float: none; padding: 0 15px; margin-top: 30px;} .block-contact .hidden-sm-down { display: block !important;} .footer-container .rs { position: static; margin-block: calc(var(--marginSpace) * 0.65); padding-top: 5px;} .footer-container .rs a { margin: 0 10px 0 0;} .footer-container .rs a.scroll { float: right; margin: 0;} .footer-container .row { margin: 0;} .atouts .blockreassurance { padding: var(--paddingSpace) 0;} .atouts .blockreassurance:after, .atouts .blockreassurance:before { display: none;} .atouts .blockreassurance .block-title { margin: 15px 0 0 0;} .atouts .blockreassurance>.row { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 30px 10px; margin: 0; padding: 0;} .atouts .blockreassurance>.row:after { display: none;} .atouts .blockreassurance>.row>div { float: none; width: 100%; padding: 0;} .footer-container .links { margin-bottom: 15px; background: #333;} .footer-container .links .title { padding: 0 0 0 20px; border: none; background: #333;} .footer-container .links .h3 { line-height: 50px; font-size: 16px;} .footer-container .links:not(.block-contact) .h3 { text-transform: none; font-weight: 500; letter-spacing: 0.8px;} .footer-container .float-xs-right { line-height: 0;} .footer-container .links .navbar-toggler { background: none; height: 50px; width: 50px; border: none;} .footer-container .links .navbar-toggler i { margin: 13px;} .footer-container .links ul { background: none; padding: 5px 20px 15px 20px;} .footer-container .links ul>li { padding: 0; border: none; font-weight: 400;} .footer-container .links ul>li a { color: #fff;} .footer-container .block-contact { display: block; margin-top: calc(var(--marginSpace) * 0.6); background: none;} .footer-container .block-contact .h3 { line-height: 180%; margin-bottom: 10px;} .footer_bottom { padding: 15px 0; margin-top: 40px;} } @media (max-width:575px) { .atouts .blockreassurance>.row { display: grid; grid-template-columns: 1fr; grid-gap: 12px;} .atouts .blockreassurance>.row>div { display: grid; grid-template-columns: 80px 1fr; grid-gap: 5px 20px;} .atouts .blockreassurance .block-icon { width: auto; margin: 0; float: none; grid-row: span 2; border: 1px solid #ffffff35; height: 64px; display: grid; align-items: center;} .atouts .blockreassurance .block-icon img, .atouts .blockreassurance .block-icon svg { height: 30px; margin: 0 auto; display: block;} .atouts .blockreassurance .block-title { font-size: 14px; line-height: 140%; margin: 0; height: auto; max-width: none; padding: 0; align-self: end;} .atouts .blockreassurance p { font-size: 14px; line-height: 140%; align-self: start;} .footer-container .links .h3 { font-size: 14px;} .footer_bottom { margin-top: 20px;} .footer_bottom li { display: block;} .footer_bottom li:after { display: none;} } #wrapper>.container { padding-top: 150px; padding-inline: 0; width: 90vw;} @media (max-width:1200px) { #wrapper>.container { padding-top: 190px;} } @media (max-width:767px) { #wrapper>.container { padding-top: 118px;} } /*** slider ***/ .carousel { box-shadow:none; padding: 0 0 0 0; /*width: 90vw; transform: translateX(-50%); margin-left: 50%; max-width: 1500px;*/} .carousel:before { width:100vw; background:#eee; position:absolute; left: 50%; top: 0; bottom: -230px; z-index:0; content:"";} .carousel .carousel-inner { height: auto; /*max-height: 725px; min-height: 440px;*/ margin:0;} .carousel .carousel-control { width:50px; height:50px; border-radius:50%; top:auto; bottom: 30px;} .carousel .carousel-control span { display:none;} .carousel .carousel-control.right { background:url(../img/arrow_next.svg) 50% no-repeat #fff; left:90px;} .carousel .carousel-control.left { background:url(../img/arrow_prev.svg) 50% no-repeat #fff; left:30px;} .carousel .carousel-item .caption { left:auto; right:60px; bottom:45px; text-align:right; max-width:400px;} .carousel .carousel-item .caption h2 { font:700 40px/50px "Barlow"; letter-spacing:4px;} .carousel .carousel-item .caption p { margin-bottom:0;} @media (max-width:1200px) { .carousel .carousel-inner { height:auto; max-height:none; min-height:inherit;} } @media (max-width:991px) { .carousel { margin-bottom: 60px; padding:0; background: #eee; width: 100vw; transform: none; margin-left: -50vw; left: 50%; right: inherit;} .carousel:before { display: none;} .carousel .direction { top: 100%;} .carousel .carousel-control { bottom: -25px; box-shadow: 0 0px 5px 0px #00000010;} .carousel .carousel-control.right { left: 50%; margin-left: 5px;} .carousel .carousel-control.left { left: 50%; margin-left: -55px;} .carousel .carousel-item .caption { text-align:center; width: 90vw; max-width: 690px; margin: 0 auto; padding: 50px 0 70px 0;} .carousel .carousel-indicators { display: none;} .carousel .carousel-item .caption .display-1 { font:700 30px/40px "Barlow";} } @media (max-width:767px) { .carousel { margin-bottom: 40px;} .carousel .carousel-item .caption { padding: 25px 0 60px 0;} .carousel .carousel-item .caption .display-1 { font-size: 16px; line-height: 26px; letter-spacing: 2px;} .carousel .carousel-control { width: 44px; height: 44px; bottom: -25px;} .carousel .carousel-control.right { margin-left: 2px;} .carousel .carousel-control.left { margin-left: -52px;} } /*** CTA sous le slider ***/ .bloc_cta { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 30px; margin-top: 60px; margin-bottom: 100px; /*width: 90vw; transform: translateX(-50%); margin-left: 50%; max-width: 1500px;*/} .bloc_cta .item { position: relative; font: 400 16px/24px "Barlow"; letter-spacing: 0.6px;} .bloc_cta img { width: 100%; height: auto; display: block;} .bloc_cta .titre { font: 700 22px/26px "Barlow"; letter-spacing: 1.4px; text-transform: uppercase; color: #fff; margin-bottom: 16px;} .bloc_cta .fidelity { background: #edd8d4; color: #846e62;} .bloc_cta .fidelity .text { position: absolute; left: 0; bottom: 0; min-height: 50%; background: #edd8d4; padding: 0 30px 20px 30px;} .bloc_cta .fidelity .icons { display: grid; grid-template-columns: 60px 60px 60px 60px; grid-gap: 10px; margin: -30px 0 34px 0;} .bloc_cta .fidelity .icons img { width: 60px; height: 60px; background: #fff; border-radius: 50%;} .bloc_cta .fidelity .titre { color: #846e62; margin-bottom: 10px; letter-spacing: 1.2px;} .bloc_cta .mini_murphy { background: #9fc6d4;} .bloc_cta .mini_murphy .text { position: absolute; left: 0; bottom: 0; padding: 0 30px 25px 30px;} .bloc_cta .mini_murphy span { display: block; width: 230px; height: 32px; background: #5c829a; font-size: 12px; line-height: 30px; padding: 0 20px; margin-top: 6px; letter-spacing: 0.8px; color: #fff;} .bloc_cta .service { background: #eae1d4;} .bloc_cta .service .tel { background: #fff; padding: 34px 40px; display: block; font: 500 20px/25px "Barlow"; position: absolute; left: 0; top: 0; width: 100%; z-index: 20; color: #111;} .bloc_cta .service .tel:after { width: 70px; height: 70px; border-radius: 50%; border: 1px solid #ccc; background: url("../img/icon_customer_service.svg") 50% no-repeat #fff; content: ""; position: absolute; right: 40px; top: 50%; transform: translateY(-50%);} .bloc_cta .service .tel span { color: #bfa477; display: block; font: 700 25px/30px "Playfair Display"; margin-bottom: 2px;} .bloc_cta .service .text { padding: 160px 40px 40px 40px; display: grid; align-items: center; position: relative; height: 100%;} .bloc_cta .service .text ul li { padding: 12px 0 14px 30px; background: url("../img/check_gold.svg") 0 50% no-repeat;} @media (max-width:1200px) { .bloc_cta { grid-template-columns: 1fr 1fr;} .bloc_cta .service { background: #eae1d4; grid-column: span 2; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 30px; align-items: center; background: none;} .bloc_cta .service .tel { position: relative;} .bloc_cta .service .text { padding: 40px; height: auto; background: #eae1d4;} } @media (max-width:1000px) { .bloc_cta { grid-gap: 20px; margin-top: 40px;} .bloc_cta .titre { font-size: 20px; line-height: 24px;} .bloc_cta .service { grid-gap: 20px;} } @media (max-width:760px) { .bloc_cta { grid-template-columns: 1fr;} .bloc_cta .titre { font-size: 20px; line-height: 24px;} .bloc_cta .service { grid-column: auto; display: block;} .bloc_cta .service .tel { border: 1px solid #eae1d4; border-bottom: 0;} } @media (max-width:600px) { .bloc_cta { grid-gap: 10px; margin-top: 25px;} .bloc_cta .item { font-size: 14px; line-height: 22px;} .bloc_cta .titre { font-size: 18px; line-height: 22px;} .bloc_cta .fidelity .text { padding: 0 20px 20px 20px;} .bloc_cta .fidelity .icons { grid-template-columns: 50px 50px 50px 50px; margin: -25px 0 25px 0;} .bloc_cta .fidelity .icons img { width: 50px; height: 50px;} .bloc_cta .fidelity .titre { margin-bottom: 5px;} .bloc_cta .mini_murphy .text { padding: 0 20px 15px 20px;} .bloc_cta .mini_murphy span { width: 110%; height: 30px; line-height: 28px; padding: 0 20px; margin-top: 6px;} .bloc_cta .service .tel { padding: 22px 25px; font-size: 18px; line-height: 24px;} .bloc_cta .service .tel:after { width: 60px; height: 60px; right: 25px; background-size: 26px auto;} .bloc_cta .service .tel span { font-size: 17px; line-height: 21px; margin-bottom: 2px;} .bloc_cta .service .text { padding: 20px 25px;} } /***** class *****/ .h1, .h2, .h3, .titre_main { font: 400 clamp(30px, 3.5vw, 40px)/140% "PT Serif"; color:#bfa477; text-transform:none; margin-bottom: clamp(10px, 2.2vw, 15px); position:relative;} .h1 span { display: block; font-size: 30px; line-height: 40px; color: #111; margin-top: 5px;} .sous_titre { font: 400 clamp(20px, 2.2vw, 24px)/140% "PT Serif"; color:#bb9c51; position:relative; margin-bottom: clamp(10px, 2.2vw, 15px);} .chapo { font:400 15px/30px "Barlow";} .link_custom { font: 700 13px/50px "Barlow"; text-transform:uppercase; letter-spacing:1px; height:54px; border:1px solid #bfa477; display:inline-block; vertical-align:middle; color:#bfa477; padding:0 30px;} .read_more { display: inline-block; cursor: pointer; border-bottom: 1px solid #bfa477; line-height: 24px;} .hide_content { padding: 40px 0;} .hide_content .sous_titre { font-size: 20px; line-height: 30px; color: #111; margin-bottom: 15px;} .hide_content .ul_list { margin:-5px 0 20px 0; list-style-type:none; line-height:30px;} .hide_content .ul_list li { padding:5px 0 5px 25px; background:url(../img/list.svg) 0 12px no-repeat; font:italic 16px/24px "Pt Serif"; letter-spacing:0.2px; margin:0;} .hide_content p { margin-bottom: 15px !important;} @media (min-width:1201px) { .link_custom:hover { background:#bfa477; color:#fff;} } @media (max-width:767px) { .chapo { font-size: 14px; line-height: 180%;} .link_custom { height: 46px; line-height: 42px; padding: 0 25px;} } /***** bloc grid *****/ .bloc_grid { display:grid; grid-template-columns:58% 1fr; align-items:center; position:relative; margin:100px 0;} .bloc_grid.align_top { align-items:start;} .bloc_grid :last-child { margin-bottom:0;} .bloc_grid .photo { position:relative;} .bloc_grid .texte { position:relative; z-index:5; padding-left:80px;} .bloc_grid .texte :last-child { margin-bottom:0;} .bloc_grid img { width:100%; height:auto; object-fit:cover; display:block; position:relative; z-index:10;} .bloc_grid p { margin-bottom:20px;} .bloc_grid p a { color:#bb9c51;} .bloc_grid .link_custom { margin-top:10px;} .bloc_grid.reverse .texte { grid-area:1 / 1; padding:0;} .bloc_grid.reverse .photo { grid-area:1 / 2; padding-left:80px;} @media (min-width:1201px) { .bloc_grid .slick-arrow:hover { background-color:rgba(0,0,0,0.75);} } @media (max-width:1200px) { .bloc_grid { grid-template-columns:1fr 1fr;} .bloc_grid .texte { padding-left:60px;} .bloc_grid.reverse .photo { padding-left:60px;} } @media (max-width:1000px) { .bloc_grid { grid-template-columns:1fr; grid-gap:60px; margin:80px 0;} .bloc_grid .texte { padding:0;} .bloc_grid.reverse .texte { grid-area:2; padding:0;} .bloc_grid.reverse .photo { grid-area:1;} } @media (max-width:600px) { .bloc_grid { grid-gap: 30px; margin: 50px 0;} } /***** bloc texte *****/ .bloc_texte { margin: 100px auto; position:relative;} .bloc_texte.small { max-width:80%;} .bloc_texte :last-child { margin-bottom:0;} .bloc_texte img, .bloc_texte video { width:100%; height:auto; display:block; line-height:0;} @media (max-width:1000px) { .bloc_texte { margin: 80px 0;} .bloc_texte.small { max-width:none;} } @media (max-width:600px) { .bloc_texte { margin: 50px 0;} } /***** custom bloc *****/ #custom-text { text-align:left; padding:0; border-radius:0; margin:0;} #custom-text .marque:after { width:272px; height:380px; background:url(../img/shape.svg) 50% no-repeat #fff; position:absolute; right:-100px; top:100px; z-index:0; content:"";} #custom-text .marque .titre_main span { font:700 40px/50px "Barlow"; text-transform:uppercase; color:#111; letter-spacing:4px; display:block;} #custom-text .marque img { max-width: 750px;} #custom-text .regimes { text-align: center; padding:20px 0; width: 90vw; transform: translateX(-50%); margin-left: 50%; max-width: 1500px; } #custom-text .regimes .titre_main { text-align: center; margin-top:-10px;} #custom-text .regimes .grid { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; grid-gap:30px; text-align:left; margin:40px 0 60px 0;} #custom-text .regimes .grid a { display:block; position:relative; background:#111;} #custom-text .regimes .grid a img { width:100%; height:auto; display:block; transition:opacity 400ms ease-in-out;} #custom-text .regimes .grid a span { position:absolute; left:0; top:-10px; font:700 30px/40px "Barlow"; text-transform:uppercase; color:#fff; letter-spacing:3px; padding:30px;} @media (min-width:1201px) { #custom-text .regimes .grid a:hover img { opacity:0.75;} } @media (max-width:1200px) { #custom-text .regimes .grid { grid-template-columns:1fr 1fr;} #custom-text .marque:after { display: none;} } @media (max-width:1000px) { #custom-text .regimes { padding: 0;} } @media (max-width:767px) { #custom-text .marque .titre_main span { font-size: 25px; line-height: 35px; letter-spacing: 3px;} #custom-text .regimes { text-align: left;} #custom-text .regimes .grid { margin: 30px 0 35px 0;} #custom-text .regimes .grid a span { font-size: 20px; line-height: 30px;} } @media (max-width:540px) { #custom-text .regimes .grid { grid-template-columns: 1fr; grid-gap: 6.5vw;} #custom-text .regimes .grid a span { padding: 6.5vw; top: -5px;} } #custom-text .about .titre_main span { font:400 14px/30px "Barlow"; text-transform:uppercase; color:#111; letter-spacing:1.4px; display:block; margin-top:5px;} @media (max-width:1000px) { #custom-text .about { grid-gap: 0;} #custom-text .about .photo { display: none;} } /***** breadcrumb *****/ #wrapper .breadcrumb { background:#f2f2f2; position:relative; padding: 15px 0; margin-bottom:60px;} #wrapper .breadcrumb:after { width:100%; height:100%; background:#f2f2f2; position:absolute; left:100%; top:0; content:"";} #wrapper .breadcrumb:before { width:100%; height:100%; background:#f2f2f2; position:absolute; left:-100%; top:0; content:"";} #wrapper .breadcrumb ol { font-size:11px; line-height:20px; letter-spacing:0.6px; color:#222;} #wrapper .breadcrumb li { position:relative; margin-right:24px;} #wrapper .breadcrumb li:after { width:1px; height:8px; position:absolute; right:-13px; top:3px; background:#bfa477; margin:0; content:"";} #wrapper .breadcrumb li:last-child { color:#222;} #wrapper .breadcrumb li:last-child:after { display:none;} #wrapper .breadcrumb li a { color:#222;} /***** listing *****/ #category .block-category { padding:0; border:none; min-height:inherit; margin-bottom: var(--margin-space--small);} #category .block-category h1 { font: 400 45px/55px "PT Serif"; color: #bfa477; text-transform: none; margin-bottom: clamp(10px, 2.2vw, 15px);} #category .block-category .chapo { margin-bottom: 10px; color: #222; max-width: 850px;} #category .category-cover { display:none;} #category #left-column { display:none;} #category #content-wrapper { padding:0; float:none; width:100%;} #category #js-product-list { line-height:0;} /* listing produits #category #left-column .block-categories { padding:280px 40px 40px 40px; background:url(../img/kmhaircare_produits.jpg) 0 0 no-repeat #eee; background-size:100% auto;} #category #left-column .block-categories a.h6 { font:500 16px/30px "Barlow"; color:#bfa477; text-transform:uppercase; letter-spacing:1.4px; margin-bottom:5px;} #category #left-column .category-top-menu { margin:0;} #category #left-column .category-sub-menu { margin:0;} #category #left-column .category-sub-menu a { font-size:14px; line-height:25px; font-weight:400; padding:0 0 0 22px; background:url(../img/list.svg) 0 50% no-repeat; border:none; margin:10px 0 0 0;} */ /* #category.category-id-3 #left-column { display:block; padding:0 60px 0 0;} #category.category-id-3 #content-wrapper { float:left; width:75%;} #category.category-id-3 #category-description { padding-top:20px;} #category.category-id-3 #products .products { grid-template-columns:1fr 1fr 1fr;} */ @media (max-width:1200px) { /* #category.category-id-3 #left-column { display: none;} #category.category-id-3 #content-wrapper { float: none; width: 100%;} #category.category-id-3 #products .products { grid-template-columns: 1fr 1fr;} */ } @media (max-width: 991px) { /*#category.category-id-3 .sort-by { padding-right: 10px;}*/ } @media (max-width: 767px) { #category .block-category h1 { font-size: 25px; line-height: 35px;} #products .up { display: none;} } @media (max-width: 540px) { /*#category.category-id-3 #products .products { grid-template-columns: 1fr; grid-gap: 6.5vw;}*/ } /* listing régimes */ .grid_sub_cateroy { display: flex; flex-wrap: wrap; gap: 32px 16px; margin-bottom: var(--margin-space--medium); padding-top: 10px;} .grid_sub_cateroy a { display: block; position: relative; max-width: clamp(140px, 13vw, 180px);} .grid_sub_cateroy img { width: 100%; height: auto; display: block; transition: all 300ms ease;} .grid_sub_cateroy h3 { margin: 12px 0 0 0; font-size: 16px; line-height: 120%; font-weight: 500; color: #222; display: block;} .category-id-6 .grid_sub_cateroy { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: var(--margin-space--large);} .category-id-6 .grid_sub_cateroy a { max-width: none;} .category-id-6 .grid_sub_cateroy h3 { position: absolute; left: 20px; top: 20px; font: 700 22px/140% "Barlow"; text-transform: uppercase; color: #fff; letter-spacing: 2px; margin: 0;} .category-id-6 #products { display:none;} @media (min-width:1201px) { .grid_sub_cateroy a:hover img { transform: scale(0.95);} .category-id-6 .grid_sub_cateroy a:hover img { transform: scale(1); filter: brightness(0.65);} } @media (max-width:1200px) { .grid_sub_cateroy { gap: 16px; width: 100vw; margin-left: -5vw; overflow-x: auto; padding-inline: 5vw; flex-wrap: nowrap;} .grid_sub_cateroy::-webkit-scrollbar { display: none;} .grid_sub_cateroy a { max-width: none; min-width: clamp(140px, 40vw, 160px);} .category-id-6 .grid_sub_cateroy { grid-template-columns: repeat(3, 1fr);} } @media (max-width: 991px) { .category-id-6 .grid_sub_cateroy { grid-template-columns: repeat(2, 1fr);} } @media (max-width: 767px) { .grid_sub_cateroy { gap: 12px;} .grid_sub_cateroy h3 { font-size: 15px;} .category-id-6 .grid_sub_cateroy h3 { font-size: 16px; line-height: 100%;} .category-id-6 .grid_sub_cateroy img { filter: brightness(0.9);} } /*** reset box shadow ***/ .block-categories, .block-category, .brands-sort .select-title, .products-sort-order .select-title, .suppliers-sort .select-title, .pagination .page-list { box-shadow:none;} /*** custom bloc produit liste ***/ #products .products, .featured-products .products, .product-accessories .products, .product-miniature .products { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 16px; padding: 0 15px;} .featured-products .products { padding: 0; margin: 0;} @media (max-width:1200px) { #products .products, .featured-products .products, .product-accessories .products, .product-miniature .products { grid-template-columns: 1fr 1fr 1fr;} } @media (max-width:1000px) { #products .products, .featured-products .products, .product-accessories .products, .product-miniature .products { grid-template-columns: 1fr 1fr;} } @media (max-width:767px) { #products .products, .featured-products .products, .product-accessories .products, .product-miniature .products { grid-gap: 12px;} } /* @media (max-width:540px) { #products .products, .featured-products .products, .product-accessories .products, .product-miniature .products { grid-template-columns: 1fr; grid-gap: 6.5vw;} } */ .page-index #products .product, .page-index .featured-products .product, .page-index .product-accessories .product, .page-index .product-miniature .product, .page-search #products .product, .page-search .featured-products .product, .page-search .product-accessories .product, .page-search .product-miniature .product { width:auto; min-width:inherit;} #products .product-miniature, .featured-products .product-miniature, .product-accessories .product-miniature, .product-miniature .product-miniature { margin:0; display:block;} #products .thumbnail-container, .featured-products .thumbnail-container, .product-accessories .thumbnail-container, .product-miniature .thumbnail-container { margin:0; /*box-shadow:0 0 20px rgb(0 0 0 / 10%);*/ box-shadow: none; border: 1px solid #ddd; width: auto; height: auto;} /* @media (max-width:540px) { #products .thumbnail-container, .featured-products .thumbnail-container, .product-accessories .thumbnail-container, .product-miniature .thumbnail-container { box-shadow:0 0 15px rgb(0 0 0 / 10%);} } */ #products .thumbnail-container .product-thumbnail, .featured-products .thumbnail-container .product-thumbnail, .product-accessories .thumbnail-container .product-thumbnail, .product-miniature .thumbnail-container .product-thumbnail { height: auto; padding: clamp(20px, 2.2vw, 30px) 5px 5px 5px;} #products .thumbnail-container .product-thumbnail img, .featured-products .thumbnail-container .product-thumbnail img, .product-accessories .thumbnail-container .product-thumbnail img, .product-miniature .thumbnail-container .product-thumbnail img { position:static; display:block; margin:0 auto;} #products .highlighted-informations, .featured-products .highlighted-informations, .product-accessories .highlighted-informations, .product-miniature .highlighted-informations { width:150px; padding:0; height:45px; box-shadow:none; border:1px solid #bfa477; left:50%; margin-left:-75px; bottom:45px; transition:all 400ms ease-in-out; opacity:0;} #products .thumbnail-container:focus .highlighted-informations.no-variants, #products .thumbnail-container:hover .highlighted-informations.no-variants, .featured-products .thumbnail-container:focus .highlighted-informations.no-variants, .featured-products .thumbnail-container:hover .highlighted-informations.no-variants, .product-accessories .thumbnail-container:focus .highlighted-informations.no-variants, .product-accessories .thumbnail-container:hover .highlighted-informations.no-variants, .product-miniature .thumbnail-container:focus .highlighted-informations.no-variants, .product-miniature .thumbnail-container:hover .highlighted-informations.no-variants { bottom:45px; opacity:1;} #products .highlighted-informations .quick-view, .featured-products .highlighted-informations .quick-view, .product-accessories .highlighted-informations .quick-view, .product-miniature .highlighted-informations .quick-view { font:700 13px/43px "Barlow"; letter-spacing:1px; text-transform:uppercase; color:#bfa477;} #products .highlighted-informations i, .featured-products .highlighted-informations i, .product-accessories .highlighted-informations i, .product-miniature .highlighted-informations i { display:none;} #products .product-description, .featured-products .product-description, .product-accessories .product-description, .product-miniature .product-description { position: static; width: 100%; height: auto; min-height: inherit; padding-bottom: clamp(20px, 2.2vw, 30px); text-align: center;} @media (max-width:767px) { #products .product-description, .featured-products .product-description, .product-accessories .product-description, .product-miniature .product-description { min-height: inherit; box-shadow: none;} } #products .thumbnail-container:focus .product-description:after, #products .thumbnail-container:hover .product-description:after, .featured-products .thumbnail-container:focus .product-description:after, .featured-products .thumbnail-container:hover .product-description:after, .product-accessories .thumbnail-container:focus .product-description:after, .product-accessories .thumbnail-container:hover .product-description:after, .product-miniature .thumbnail-container:focus .product-description:after, .product-miniature .thumbnail-container:hover .product-description:after { display:none;} #products .product-title, .featured-products .product-title, .product-accessories .product-title, .product-miniature .product-title { margin: 0 0 5px 0; line-height: inherit; text-align: center; padding: 0 12px;} #products .product-title a, .featured-products .product-title a, .product-accessories .product-title a, .product-miniature .product-title a { font: 700 15px/160% "Barlow"; letter-spacing:1.6px; text-transform: uppercase; color: #222; display: block;} #products .product-description p, .featured-products .product-description p, .product-accessories .product-description p, .product-miniature .product-description p { letter-spacing: 0.4px; color: #222; padding: 0 10px 2px 10px; font-size: 12px; line-height: 25px; position: absolute; right: 10px; top: 10px; background: #eee;} @media (max-width:767px) { #products .product-description p, .featured-products .product-description p, .product-accessories .product-description p, .product-miniature .product-description p { margin-bottom:15px; font-size: 11px; line-height: 22px; padding: 0 8px 1px 8px; right: 8px; top: 8px;} } #products .product-price-and-shipping, .featured-products .product-price-and-shipping, .product-accessories .product-price-and-shipping, .product-miniature .product-price-and-shipping { font:400 20px/30px "PT Serif"; letter-spacing:0.4px; color:#bfa477;} #products .regular-price, .featured-products .regular-price, .product-accessories .regular-price, .product-miniature .regular-price { color:#888; font-size:16px; margin-right:5px;} .product-flags { width:auto; top:15px; left:15px;} .product-flags li.product-flag { background:#bfa477;} #products .product-miniature .product-flags li.product-flag, .featured-products .product-miniature .product-flags li.product-flag, .product-accessories .product-miniature .product-flags li.product-flag, .product-miniature .product-miniature .product-flags li.product-flag { width:auto; padding:0 10px; font:400 10px/25px "Barlow"; letter-spacing:1.6px; text-transform:uppercase; min-height:inherit; min-width:inherit; margin:0 0 5px 0; box-shadow:none;} .product-flags li.product-flag.discount, .product-flags li.product-flag.discount-amount, .product-flags li.product-flag.discount-percentage { background-color:#111; display:none;} #products .all-product-link, .featured-products .all-product-link, .product-accessories .all-product-link, .product-miniature .all-product-link { font:700 13px/56px "Barlow"; text-transform:uppercase; letter-spacing:1px; height:60px; border:1px solid #bfa477; display:inline-block; vertical-align:middle; color:#bfa477; padding:0 30px; margin:30px 0 0 0;} @media (max-width:767px) { #products .all-product-link, .featured-products .all-product-link, .product-accessories .all-product-link, .product-miniature .all-product-link { margin: 20px 0 0 0;} #products .product-title a, .featured-products .product-title a, .product-accessories .product-title a, .product-miniature .product-title a { font-size: 14px; line-height: 140%;} #products .product-price-and-shipping, .featured-products .product-price-and-shipping, .product-accessories .product-price-and-shipping, .product-miniature .product-price-and-shipping { font-size: 18px;} } @media (max-width:575px) { #products .product-title a, .featured-products .product-title a, .product-accessories .product-title a, .product-miniature .product-title a { font-size: 10px;} } @media (min-width:1201px) { #products .all-product-link:hover, .featured-products .all-product-link:hover, .product-accessories .all-product-link:hover, .product-miniature .all-product-link:hover { color:#fff; background:#bfa477;} } @media (max-width:767px) { #products .thumbnail-container .product-description, .featured-products .thumbnail-container .product-description, .product-accessories .thumbnail-container .product-description { box-shadow: none;} } /*** custom total produit + trier + pagination ***/ #category .products-selection { margin-bottom: var(--margin-space--medium);} #category .products-selection, #category .products-selection p { font-size:14px; letter-spacing:0.4px;} .brands-sort .select-title, .products-sort-order .select-title, .suppliers-sort .select-title { color:#222; border:1px solid #ccc; height:50px; padding:0 15px 0 20px; font-size:14px; line-height:48px; letter-spacing:0.4px;} .brands-sort .select-title .material-icons, .products-sort-order .select-title .material-icons, .suppliers-sort .select-title .material-icons { font-size:17px; height:48px; line-height:50px;} .brands-sort .dropdown-menu, .products-sort-order .dropdown-menu, .suppliers-sort .dropdown-menu { width:calc(100% - 30px); padding:0; background:#eee; box-shadow:none;} .brands-sort .select-list, .products-sort-order .select-list, .suppliers-sort .select-list { padding:0 20px; font-size:14px; line-height:50px; height:50px;} .pagination { font-size:14px; letter-spacing:0.4px; margin:60px 0;} .pagination .col-md-4 { padding:0;} .pagination>div:first-child { line-height:50px;} .pagination .page-list { padding:0;} .pagination a { text-decoration:none; display:inline-block; font:400 14px/50px "Barlow"; padding:0 4px; letter-spacing:0.4px;} .pagination a .material-icons { display:none;} .pagination .current a { font-size:14px; font-weight:700;} .pagination .previous, .pagination .next { display:inline-block; border:1px solid #bfa477; line-height:48px; height:50px; padding:0 25px;} .pagination a:not(.previous):not(.next) { letter-spacing:0.4px;} @media (max-width:1200px) { .products-selection .sort-by-row { justify-content: end;} .products-selection .sort-by { display: none;} .products-selection .products-sort-order { float: none;} } @media (max-width:575px) { .pagination { margin: 20px 0 40px 0;} } /*** btn ***/ .btn { font:700 13px/56px "Barlow"; letter-spacing:0.8px; text-transform:uppercase; height:60px; display:inline-block; vertical-align:middle; color:#bfa477; padding:0 30px; background:none; border:1px solid #bfa477; transition:all 400ms ease-in-out;} .btn-primary, .btn-secondary, .btn-tertiary { box-shadow:none; padding:0 30px;} .btn-primary:focus, .btn-secondary:focus, .btn-tertiary:focus { background:inherit; border:1px solid #bfa477; color:inherit;} .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus { outline:none; outline-offset:0;} .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.btn-primary.dropdown-toggle.focus, .open>.btn-primary.dropdown-toggle:focus, .open>.btn-primary.dropdown-toggle:hover { border-color:#bfa477; background:#bfa477;} .product-actions .add-to-cart { width:220px; height:60px; padding:0 0 0 50px; text-align:left; position:relative;} .product-actions .add-to-cart:after { width:12px; height:2px; background:#bfa477; content:""; position:absolute; left:30px; top:50%; margin-top:-1px; transition:background 400ms ease-in-out;} .product-actions .add-to-cart:before { width:2px; height:12px; background:#bfa477; content:""; position:absolute; left:35px; top:50%; margin-top:-6px; transition:background 400ms ease-in-out;} .product-actions .add-to-cart i { display:none;} @media (min-width:1201px) { .btn-primary:hover, .btn-secondary:hover, .btn-tertiary:hover { background-color:#bfa477; color:#fff;} .product-actions .add-to-cart:disabled { background-color:#fff; color:#bfa477; border-color: #bfa477; opacity: 0.5;} .product-actions .add-to-cart:not(:disabled):hover:after, .product-actions .add-to-cart:not(:disabled):hover:before { background:#fff;} } @media (max-width: 767px) { .product-actions .add-to-cart { width: 190px; padding: 0; text-align: center;} .product-actions .add-to-cart:after, .product-actions .add-to-cart:before { display: none;} } .bootstrap-touchspin { box-shadow:none;} .has-discount .page-content.page-cms ul, .has-discount.product-price, .has-discount p, .page-content.page-cms .has-discount ul { color:#bfa477;} .has-discount .discount { display:none;} .page-content.page-cms ul, p { margin-bottom: clamp(10px, 2.2vw, 15px); font-size:15px;} @media (max-width: 767px) { .page-content.page-cms ul, p { font-size:14px;} } /*** fiche produit ***/ #product #content { max-width:100%;} #product .product-cover { max-width: 650px; margin-inline: auto;} .product-flags li.product-flag { width:auto; padding:0 10px; font:400 10px/25px "Barlow"; letter-spacing:1.6px; text-transform:uppercase; min-height:inherit; min-width:inherit; margin:0 0 5px 0; box-shadow:none;} .product-cover img { box-shadow:none;} .product-cover .layer { background:url(../img/loupe.svg) 50% no-repeat rgba(255,255,255,0.5); transition:opacity 400ms ease-in-out;} .product-cover .layer i { display:none;} .product-images>li.thumb-container>.thumb { box-shadow:none; margin-bottom:10px;} .images-container .product-images>li.thumb-container>.thumb { margin-right:10px; border: 1px solid #ddd; padding: 5px;} .product-images>li.thumb-container>.thumb.selected, .product-images>li.thumb-container>.thumb:hover { border: 1px solid #bfa477;} .product-container { margin-bottom: var(--margin-space--medium);} .product_content_wrap { max-width: 700px; margin-inline: auto;} .product-container h1 { font:700 40px/50px "Barlow"; text-transform:uppercase; color:#111; letter-spacing:4px; display:block;} .product-price .current-price { font:400 italic 45px/55px "PT Serif";} .product-prices div { margin:0;} .product-prices .tax-shipping-delivery-label { font:400 italic 16px/20px "PT Serif"; margin-top:10px;} .product-discount .regular-price { font:400 italic 16px/30px "PT Serif"; color:#888;} .product-information { margin-top:35px;} .product-add-to-cart { margin-top:40px;} .product-add-to-cart .control-label { display:none;} .product-quantity .qty { margin-right:10px;} .product-quantity #quantity_wanted { height:60px; width:60px; padding:15px;} .product-quantity .input-group-btn-vertical .btn { width:30px; height:31px;} .product-quantity .input-group-btn-vertical .btn i { top:50%; left:50%; transform:translate(-50%,-50%); color:#222;} .social-sharing span { font-size:11px; letter-spacing:0.6px; padding-right:10px;} .social-sharing li { width:50px; height:50px; margin:0 0 0 10px; box-shadow:none; transition:background 400ms ease-in-out; vertical-align:top;} .social-sharing li:before { display:none;} .facebook.icon-gray, .facebook.icon-gray:hover { background:url(../img/facebook_gray.svg) 50% no-repeat #eee;} .twitter.icon-gray, .twitter.icon-gray:hover { background:url(../img/twitter_gray.svg) 50% no-repeat #eee;} .pinterest.icon-gray, .pinterest.icon-gray:hover { background:url(../img/pinterest_gray.svg) 50% no-repeat #eee;} .product-variants>.product-variants-item ul li { margin-right: 10px;} .radio-label { border: 1px solid #ccc; box-shadow: none; padding: 5px 15px; font-size: 14px; font-weight: 400; transition: all 400ms ease-in-out;} .input-color:checked+span, .input-radio:checked+span { border: 1px solid #eee; background: #eee;} #product-details .label { font: 400 15px/30px "Barlow"; color: #222; margin-right: 10px;} .product-information .product-features { margin: 20px 0 0 0;} .product-information .product-features .h6 { font: 400 15px/30px "Barlow"; color: #222; margin-bottom: 15px;} .product-features>dl.data-sheet dd.value, .product-features>dl.data-sheet dt.name { margin: 0 1px 1px 0; background: #eee; padding: 10px 15px; font-size: 14px;} .product-features>dl.data-sheet dd.value:nth-of-type(2n), .product-features>dl.data-sheet dt.name:nth-of-type(2n) { background: #eee;} @media (min-width:1201px) { .input-color:hover+span, .input-radio:hover+span { border: 1px solid #eee; background: #eee;} .facebook.icon-gray:hover, .twitter.icon-gray:hover, .pinterest.icon-gray:hover { background-color:#fff;} } @media (max-width: 991px) { .product-container h1 { font-size: 30px; line-height: 40px;} .product-price .current-price { font-size: 35px; line-height: 45px;} } @media (max-width: 767px) { .product-container h1 { font-size: 25px; line-height: 35px;} .product-price .current-price { font-size: 30px; line-height: 40px;} .product-quantity #quantity_wanted { width:50px;} } .tabs { padding:0; box-shadow:none; margin-top:60px;} .tabs .nav-tabs { border:none;} .tabs .nav-tabs .nav-item { margin:0 20px 0 0;} .nav-tabs .nav-link { font:700 16px/26px "Barlow"; letter-spacing:1.6px; text-transform:uppercase; color:#222; padding:0;} .tabs .nav-tabs .nav-link.active, .tabs .nav-tabs .nav-link:hover { border:none;} .tabs .tab-pane { padding-top:25px;} #product .featured-products { padding-bottom: 40px;} #product .featured-products h2 { font:400 30px/40px "PT Serif"; color:#bfa477; margin-bottom: var(--margin-space--small); position:relative; } @media (max-width:1000px) { #product .featured-products { padding-bottom: 0;} } @media (max-width: 767px) { #product .featured-products h2 { font-size: 20px; line-height: 30px;} } /*** zoom fiche produit ***/ #product-modal .modal-content .modal-body .image-caption { display:none;} #product-modal .modal-content .modal-body .product-images { margin-left:30px;} #product-modal .modal-content .modal-body .product-images img { width:100px;} #product-modal .modal-content .modal-body .product-images img:hover { border:none;} /*** quickview ***/ .modal-content { border:none; border-radius:0;} .quickview .modal-header .close { margin:0; line-height:30px; font-size:40px; width:30px; height:30px; position:absolute; right:12px; top:10px; text-align:center; z-index:10; font-weight:400; text-shadow:none; transition:all 400ms ease-in-out;} .quickview .modal-header { padding:0;} .quickview .modal-body { padding:40px;} .quickview .modal-content { background:#fff; min-height:inherit;} .quickview .modal-content .h1 { font:700 30px/46px "Barlow"; letter-spacing:1.6px; text-transform:uppercase; color:#222;} .quickview .product-price .current-price { font-size:35px; line-height:45px;} .quickview #product-description-short { margin-top:25px;} .quickview .mask, .quickview .modal-footer { display:none;} /*** cart ***/ #blockcart-modal { padding:0 !important;} #blockcart-modal .modal-title { color:#222; font-size:16px;} #blockcart-modal .modal-title i.material-icons { margin-right:10px; line-height:20px;} #blockcart-modal .cart-content-btn i { display:none;} #blockcart-modal .product-name { font:700 16px/26px "Barlow"; letter-spacing:1.6px; text-transform:uppercase; color:#222;} #blockcart-modal .product-price { font:400 italic 25px/35px "PT Serif"; color:#bfa477;} #blockcart-modal .cart-content .page-content.page-cms ul.cart-products-count, #blockcart-modal .cart-content p.cart-products-count, .page-content.page-cms #blockcart-modal .cart-content ul.cart-products-count, #blockcart-modal .cart-content .page-content.page-cms ul, #blockcart-modal .cart-content p, .page-content.page-cms #blockcart-modal .cart-content ul { color:#222; font-size:16px;} @media (max-width: 575px) { #blockcart-modal .cart-content .cart-content-btn { display: block;} #blockcart-modal .cart-content .cart-content-btn button { margin: 0 0 10px 0; width: 100%;} #blockcart-modal .cart-content .btn { width: 100%; margin: 0;} } #cart .card { border:1px solid #ccc; box-shadow:none;} #cart .card .h1 { padding:0 20px;} #cart .card .product-price .current-price { font-size:25px; line-height:35px;} #cart .card .product-line-info a { font:700 14px/20px "Barlow"; letter-spacing:1.6px; text-transform:uppercase; color:#222;} #cart .card .product-discount .regular-price { font-size:14px;} #cart .bootstrap-touchspin input.form-control, #cart .bootstrap-touchspin input.input-group { height:60px; width:60px; padding:15px;} #cart .input-group-btn-vertical .btn { width:30px; height:31px;} #cart .input-group-btn-vertical .btn i { top:50%; left:50%; transform:translate(-50%,-50%); color:#222;} @media (max-width: 1200px) { .product-line-grid-right .price, .product-line-grid-right .qty { width: 100%;} } .btn.disabled, .btn.disabled:hover { background: #fff;} .card { box-shadow: none; border: 1px solid #ccc;} .form-control { border: 1px solid #ccc;} .page-customer-account #content, .page-my-account #content .links a span.link-item { box-shadow: none; border: 1px solid #ccc;} /***** custom cms *****/ #custom-text .page-content.page-cms ul, #custom-text p, .page-content.page-cms #custom-text ul { font-size:15px; line-height:30px; color:#111;} #main .page-header { display:none;} .page-content.page-cms { padding:0; text-align:left;} .page-content.page-cms strong { font-weight:600;} .page-content.page-cms .ul_list { margin:-5px 0 20px 0; list-style-type:none; line-height:30px;} .page-content.page-cms .ul_list li { padding:5px 0 5px 25px; background:url(../img/list.svg) 0 12px no-repeat; font:italic 16px/24px "Pt Serif"; letter-spacing:0.2px; margin:0;} @media (max-width:767px) { .page-content.page-cms { padding: 20px 0 0 0;} } /* bloc grid */ .page-content.page-cms .bloc_grid { grid-template-columns:50% 50%;} .page-content.page-cms .bloc_grid .texte :last-child { margin-bottom: 0;} .page-content.page-cms .bloc_grid.reverse .photo { padding:0;} .page-content.page-cms .bloc_grid.reverse .texte { padding:0 80px 0 0;} @media (max-width:1200px) { .page-content.page-cms .bloc_grid.reverse .texte { padding:0 60px 0 0;} } @media (max-width:1000px) { .page-content.page-cms .bloc_grid { grid-template-columns: 100%;} } /***** page contact *****/ .bloc_contact .sous_titre { margin-bottom: 5px;} .bloc_contact p b { font-size: 18px; font-weight: 600;} .bloc_contact .tel { padding-left: 30px; background: url(../img/tel.svg) 0 50% no-repeat; display: inline-block; 30px; color: #222;} .bloc_contact .email { padding-left: 30px; background: url(../img/lettre.svg) 0 50% no-repeat; display: inline-block; color: #222; margin-top: 10px;} /***** compte *****/ .page-addresses .address, .page-authentication #content { box-shadow:none; border:1px solid #ccc;} .input-group .input-group-btn>.btn[data-action=show-password] { width:80px; text-align:center; padding:0; line-height:38px; height:38px;} .page-customer-account #content .no-account { font-size:15px;} /***** paiement *****/ body#checkout #header .header-nav { box-shadow: none; background: #fff; padding: 32px 0;} body#checkout #header .header-nav #_desktop_logo a { width: 200px; height: 56px; background: url(../img/logo.svg) 50% no-repeat; display: block;} body#checkout #header .header-nav .logo { display: none;} body#checkout section.checkout-step { border: 1px solid #ccc; border-bottom: none; box-shadow: none;} body#checkout section.checkout-step .step-title { font: 400 25px/35px "PT Serif"; text-transform: none;} body#checkout #contact-link { font-size: 0;} body#checkout #contact-link span { font-size: 14px; padding-left: 30px; background: url(../img/tel.svg) 0 50% no-repeat; display: inline-block; line-height: 30px;} body#checkout a:hover { color: #bfa477;} body#checkout section.checkout-step:last-child { border: 1px solid #ccc;} body#checkout #footer { display: none !important;} @media (max-width:767px) { body#checkout #header { background: #fff;} body#checkout #header .header-nav { background: #111; padding: 0; margin-bottom: 6.5vw;} body#checkout section.checkout-step .step-title { font-size: 18px; line-height: 28px;} body#checkout #header .header-nav #_mobile_logo { display: block; position: absolute; left: 66px; top: 16px; padding: 0;} body#checkout #header .header-nav #_mobile_logo a { width: 125px; height: 18px; background: url("../img/logo_mobile.svg") 50% no-repeat; display: block;} } .custom-info-message { margin: 10px 0 40px 0; padding: 10px 20px; border:1px solid #bfa477; color:#bfa477; border-radius: 5px; font-size: 13px; line-height: 22px; font-weight:600;} :root { --margin-space--large: clamp(60px, 10vw, calc(90px + 2vw)); --margin-space--medium: clamp(30px, 2.8vw, 60px); --margin-space--small: clamp(20px, 2.2vw, 30px); --inner-padding-l: clamp(30px, 3vw, 70px); --inner-padding-m: clamp(25px, 2.4vw, 40px); --inner-padding-s: clamp(20px, 2vw, 30px); } @media (max-width:1000px) { :root { --marginSpace: clamp(45px, 12vw, 70px); --paddingSpace: clamp(45px, 12vw, 70px); } } .m-b--null { margin-bottom: 0;} .ms-t--large { margin-top: var(--margin-space--large);} .ms-b--large { margin-bottom: var(--margin-space--large);} .ms-tb--large { margin-block: var(--margin-space--large);} .ms-t--medium { margin-top: var(--margin-space--medium);} .ms-b--medium { margin-bottom: var(--margin-space--medium);} .ms-tb--medium { margin-block: var(--margin-space--medium);} .ms-t--small { margin-top: var(--margin-space--small);} .ms-b--small { margin-bottom: var(--margin-space--small);} .ms-tb--small { margin-block: var(--margin-space--small);} /***** slick *****/ .slick-slider { position:relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent;} .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0;} .slick-list:focus { outline: none;} .slick-list.dragging { cursor: pointer; cursor: hand;} .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0 0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); -o-transform: translate3d(0,0,0); transform: translate3d(0,0,0);} .slick-track { position: relative; top: 0; left: 0; display: block;} .slick-track:before, .slick-track:after { display: table; content: '';} .slick-track:after { clear: both;} .slick-loading .slick-track { visibility: hidden;} .slick-slide { display: none; float: left; height: 100%; min-height: 1px;} [dir='rtl'] .slick-slide { float: right;} .slick-slide img { display: block;} .slick-slide.slick-loading img { display: none;} .slick-slide.dragging img { pointer-events: none;} .slick-initialized .slick-slide { display: block;} .slick-loading .slick-slide { visibility: hidden;} .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;} /** slick arrows **/ .slick-arrow { width: 40px; height: 60px; border-radius: 0; border: 0; padding: 0; font-size: 0; cursor: pointer; background: url("../img/arrow_slider.svg") 55% 50% no-repeat;} .slick-disabled { opacity: 0.35; cursor: default;} .slick-prev { transform: rotate(180deg);} /** slick dots **/ .slick-dots { width: 100%; text-align: center; line-height: 0;;} .slick-dots li { display: inline-block; vertical-align: middle; margin: 0 8px;} .slick-dots button { border: none; font-size: 0; border-radius: 50%; padding: 0; width: 10px; height: 10px; background: var(--blue); opacity: 0.35; cursor: pointer;} .slick-active button { opacity: 1; transform: scale(1.2);} @media (max-width:700px) { .slick-arrow { width: 30px; height: 50px;} .slick-prev, .slick-next { background-size: auto 20px;} .slick-dots li { margin: 0 5px;} .slick-dots button { width: 8px; height: 8px;} } .titre_cap { font: 600 clamp(25px, 2.6vw, 35px)/120% "Barlow"; text-transform: uppercase; letter-spacing: 1.2px;} .titre_cap.bigger { font-size: clamp(35px, 3.8vw, 45px);} .titre_main span { display: block; color: #222; margin: 5px 0;} .container { width: 90vw;} .container--small { max-width: 1200px; margin-inline: auto;} @media (min-width: 1200px) { .container { width: 90vw; max-width: 1600px; padding-inline: 0;} } @media (min-width: 992px) { .container { width: 90vw;} } @media (min-width: 576px) { .container { width: 90vw;} } @media (max-width: 1200px) { .titre_cap { font-weight: 700;} } /***** bloc txt img *****/ .bloc_txt_img { position: relative;} .bloc_txt_img .bloc_wrap { display: grid; grid-template-columns: 1fr 50%; grid-gap: 5vw; align-items: center; position: relative;} .bloc_txt_img .bloc_wrap>.item { position: relative;} .bloc_txt_img .bloc_wrap>.item :last-child { margin-bottom: 0;} .bloc_txt_img .bloc_wrap .txt { margin: 0;} .bloc_txt_img .bloc_wrap .txt .wrap { max-width: 600px; margin: 0 auto;} .bloc_txt_img .bloc_wrap img, .bloc_txt_img .bloc_wrap video { width: 100%; height: auto; object-fit: cover; display: block; border-radius: var(--imgRadius);} .bloc_txt_img .bloc_wrap .link { margin-top: 10px;} .bloc_txt_img .bloc_wrap .multi_links { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 12px; margin-top: 25px;} .bloc_txt_img .bloc_wrap .multi_links .link_custom { margin: 0; text-align: center; padding: 0;} .bloc_txt_img.reverse .bloc_wrap { grid-template-columns: 50% 1fr;} .bloc_txt_img.reverse .bloc_wrap>.item:last-child { grid-area: 1 / 1;} .bloc_txt_img.reverse .bloc_wrap>.item:first-child { grid-area: 1 / 2;} .bloc_txt_img.align_start .bloc_wrap { align-items: start;} @media (max-width:1200px) { .bloc_txt_img .bloc_wrap { align-items: start;} } @media (max-width:1000px) { .bloc_txt_img .bloc_wrap { grid-template-columns: 100%; grid-gap: 40px;} .bloc_txt_img .bloc_wrap .txt .wrap { width: 90vw; max-width: none;} .bloc_txt_img.reverse .bloc_wrap { grid-template-columns: 1fr;} .bloc_txt_img.reverse .bloc_wrap>.item:last-child { grid-area: 2;} .bloc_txt_img.reverse .bloc_wrap>.item:first-child { grid-area: 1;} } @media (max-width:700px) { .bloc_txt_img .bloc_wrap { grid-gap: 30px;} .bloc_txt_img .bloc_wrap p { margin-bottom: 10px;} .bloc_txt_img .bloc_wrap .multi_links { grid-template-columns: 1fr; margin-top: 20px;} } /***** grid bloc *****/ .grid_bloc { position: relative;} .grid_bloc:before { width: auto; height: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: var(--bgColorLight); transition: none; z-index: -1; visibility: hidden; content: "";} .grid_bloc .bloc_wrap { display: grid; grid-gap: 32px;} .grid_bloc.align_start .bloc_wrap { align-items: start;} .grid_bloc .item { position: relative;} .grid_bloc .item :last-child { margin-bottom: 0;} .grid_bloc .item img { width: 100%; height: auto; object-fit: cover; display: block; border-radius: var(--imgRadius);} @media (max-width:1200px) { .grid_bloc:before { left: 0; right: 0; top: 0; bottom: 0; border-radius: 0;} } @media (max-width:700px) { .grid_bloc .bloc_wrap { grid-gap: 10px;} } /* custom colums */ .grid_bloc.col_2 .bloc_wrap { grid-template-columns: repeat(2, 1fr);} .grid_bloc.col_3 .bloc_wrap { grid-template-columns: repeat(3, 1fr);} .grid_bloc.col_4 .bloc_wrap { grid-template-columns: repeat(4, 1fr);} .grid_bloc.col_5 .bloc_wrap { grid-template-columns: repeat(5, 1fr);} .grid_bloc.col_6 .bloc_wrap { grid-template-columns: repeat(5, 1fr);} .grid_bloc.col_7 .bloc_wrap { grid-template-columns: repeat(7, 1fr);} .grid_bloc.col_8 .bloc_wrap { grid-template-columns: repeat(8, 1fr);} @media (max-width:1200px) { .grid_bloc.col_4 .bloc_wrap { grid-template-columns: 1fr 1fr;} .grid_bloc.col_7 .bloc_wrap { grid-template-columns: repeat(6, 1fr);} } @media (max-width:1000px) { .grid_bloc.col_3 .bloc_wrap { grid-template-columns: 1fr;} .grid_bloc.col_7 .bloc_wrap { grid-template-columns: repeat(4, 1fr);} } @media (max-width:700px) { .grid_bloc.col_2 .bloc_wrap, .grid_bloc.col_3 .bloc_wrap, .grid_bloc.col_4 .bloc_wrap { grid-template-columns: 1fr;} .grid_bloc.col_7 .bloc_wrap { grid-template-columns: repeat(3, 1fr);} } /* swipe mobile */ @media (max-width:700px) { .swipe_mobile .bloc_wrap { display: flex; gap: 10px; width: 100vw; margin-left: -5vw; overflow-x: auto; padding: 0 5vw;} .swipe_mobile .bloc_wrap::-webkit-scrollbar { display: none;} .swipe_mobile .bloc_wrap .item { min-width: clamp(280px, 75vw, 360px);} } .home_slider { position: relative; width: 80vw; max-width: 1500px; left: 50%; transform: translateX(-50%); margin: 10px 0 var(--margin-space--medium) 0;} .home_slider .slick-list { overflow: visible;} .home_slider img, .home_slider video { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 15/7.25;} .home_slider a { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 15;} .home_slider .slick-slide { position: relative;} .home_slider .slick-dots { width: 100%; text-align: center; margin: 25px 0 0 0; line-height: 0;} .home_slider .slick-dots li { margin: 0 8px; vertical-align: top; line-height: 0; padding: 10px 0; cursor: pointer;} .home_slider .slick-dots button { width: 40px; height: 4px; border-radius: 0; display: inline-block; background: #ddd; opacity: 1; font-size: 0; padding: 0; border: none; transform: none;} .home_slider .slick-dots .slick-active button { width: 40px; height: 4px; background: #bb9c51; opacity: 1;} .home_slider article .titre_cap { position: absolute; left: 5%; bottom: 10%; width: 90%; text-align: center; z-index: 15; color: #fff; margin: 0; text-transform: none; letter-spacing: 0.6px; font-size: clamp(30px, 3vw, 55px);} .home_slider article .titre_cap span { font: 400 italic 22px/140% "PT Serif"; letter-spacing: 0.4px; display: block; margin: 15px 0 0 0;} @media (min-width:768px) { .home_slider .slick-slide article { transform: scale(0.85); transition: all 2000ms ease; will-change: transform; transform-origin: center;} .home_slider .slick-slide.is-center-slide article { transform: scale(1); opacity: 1;} } @media (max-width:1200px) { .home_slider { width: 100vw; margin-top: 0;} .home_slider .slick-dots { margin-top: 20px;} } @media (max-width:800px) { .home_slider img, .home_slider video { aspect-ratio: 1/1;} .home_slider article .titre_cap { font-size: clamp(22px, 6vw, 35px); padding: 0 10px;} .home_slider article .titre_cap span { font-size: clamp(16px, 4vw, 20px); margin-top: clamp(10px, 2.2vw, 15px);} } @media (max-width:767px) { .home_slider .slick-dots { margin-top: 10px;} .home_slider .slick-dots li { margin: 0 6px; padding: 8px 0;} .home_slider .slick-dots button { width: 30px; height: 3px;} .home_slider .slick-dots .slick-active button { width: 30px; height: 3px;} } .home_cta .bloc_wrap { grid-gap: 16px;} .home_cta .item .filter { position: absolute; left: 20px; right: 20px; bottom: 20px; z-index: 15; padding: 20px 25px; background: #ffffff60; backdrop-filter: blur(8px); border: 1px solid #ffffff90;} .home_cta .item img { height: 100%;} .home_cta .item .txt p { line-height: 160%;} .home_cta .item .titre_cap { font-size: 20px; margin-bottom: 5px;} .home_cta .service { background: #111; display: grid; align-items: center;} .home_cta .service:before { display: none;} .home_cta .service .txt { padding: clamp(25px, 2.4vw, 50px);} .home_cta .service ul { border-top: 1px solid #ffffff35; padding-top: 25px;} .home_cta .service ul li { color: #fff; background: url(../img/check_gold.svg) 0 50% no-repeat; padding-left: 25px;} .home_cta .service .tel { padding-left: 70px; color: #bb9c51; display: block; font-size: 24px; margin-bottom: 30px; position: relative;} .home_cta .service .tel:before { width: 50px; height: 50px; background: url(../img/tel.svg) 50% no-repeat #fff; position: absolute; left: 0; top: 6px; content: "";} .home_cta .service .tel span { display: block; font-size: 20px; color: #fff;} @media (max-width:1200px) { .home_cta.col_3 .bloc_wrap { grid-template-columns: 1fr 1fr; padding-top: 10px;} .home_cta .item .filter { left: 15px; right: 15px; bottom: 15px; padding: 18px 22px;} .home_cta .service { display: none;} } @media (max-width:1000px) { .home_cta.col_3 .bloc_wrap { grid-template-columns: 1fr;} .home_cta .item img { max-height: 320px;} } @media (max-width:767px) { .home_cta .item .titre_cap { font-size: 16px;} } .featured-products .titre_main { margin: -10px 0 5px 0;} .featured-products .sous_titre { color: #222; margin-bottom: var(--margin-space--small);} .home_slider_products { position: relative; padding-top: 5px;} .home_slider_products:after { display: none;} .home_slider_products .products { display: block;} .home_slider_products .products .slick-slide { margin-right: 16px; width: clamp(280px, 25vw, 360px); margin-inline: 8px;} .home_slider_products .slider_nav { position: absolute; left: calc(50% - 48vw); top: calc(50% - 30px); width: 96vw; height: 0; z-index: 50;} .home_slider_products .slider_nav .slick-arrow { background-color: #fff; box-shadow: 0 0 50px 0 #00000015; } .home_slider_products .slider_nav .slick-next { float: right;} .home_km .img:before { border: 2px solid #fff; position: absolute; left: -1px; top: -1px; right: -1px; bottom: -1px; z-index: 20; content: "";} .home_km .img video { aspect-ratio: 7/8;} .home_km .img img.logo { width: auto; position: absolute; left: 30px; top: 30px; z-index: 50; transform: scale(0.8); transform-origin: left top;} .home_km .txt .titre_main { margin-top: -15px;} .home_km .link_custom { float: right; margin-top: 45px;} .home_km_cat .bloc_wrap { grid-gap: 32px 16px; margin-top: 45px;} .home_km_cat img { transition: all 300ms ease;} .home_km_cat .titre { margin: 12px 0 0 0; font-size: 16px; line-height: 120%; font-weight: 500; color: #222; display: block;} @media (min-width:1201px) { .home_slider_products .products .slick-list { overflow: visible;} .home_km_cat .item:hover img { transform: scale(0.95);} } @media (max-width:1200px) { .home_slider_products .products { width: 100vw;} .home_slider_products .products::-webkit-scrollbar { display: none;} .home_slider_products .products:not(.slick-initialized) { display: flex; gap: 16px; width: 100vw; margin-left: -5vw; overflow-x: auto; padding: 0 5vw; justify-content: start; flex-wrap: nowrap;} .home_slider_products .products:not(.slick-initialized) .product { min-width: clamp(220px, 40vw, 290px);} } @media (max-width:1000px) { .home_km .link_custom { float: none; margin-top: var(--margin-space--medium);} .home_km_cat .bloc_wrap { display: flex; gap: 16px; width: 100vw; margin-left: -5vw; overflow-x: auto; padding: 0 5vw; margin-top: var(--margin-space--medium);} .home_km_cat .bloc_wrap::-webkit-scrollbar { display: none;} .home_km_cat .bloc_wrap .item { min-width: 180px;} } @media (max-width:767px) { .home_km .link_custom { width: 100%; text-align: center;} .home_slider_products { padding-top: 0;} .home_slider_products .products:not(.slick-initialized) { gap: 12px;} .home_km_cat .bloc_wrap { gap: 12px;} .home_km_cat .bloc_wrap .item { min-width: clamp(140px, 40vw, 180px);} .home_km_cat .titre { font-size: 15px;} } .brands { margin-top: -40px;} .brands .bloc_wrap { padding-top: 5px;} .brands .item:before { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: linear-gradient(to top, rgba(0, 0, 0, 60%) 10%, rgba(0, 0, 0, 0) 65%); opacity: 0.75; z-index: 10; content: "";} .brands .item img { transition: all 300ms ease;} .brands .item img.logo { width: auto; position: absolute; left: 25px; top: 25px; z-index: 50; transform: scale(0.6); transform-origin: left top;} .brands .item .txt { position: absolute; left: 0; right: 0; bottom: 0; color: #fff; z-index: 15; padding: 35px 50px 35px 35px;} .brands .item .txt p { color: #fff; line-height: 180%;} .brands .item a { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 20; font-size: 0; background: url("../img/arrow_link.svg") right+20px bottom+20px no-repeat;} @media (min-width:1201px) { .brands .item:hover img { filter: brightness(0.65);} } @media (max-width:1400px) { .brands .bloc_wrap { grid-gap: 24px;} .brands .item .txt { padding: 25px 50px 25px 25px;} } @media (max-width:1200px) and (min-width:901px) { .brands .bloc_wrap { display: flex; gap: 16px; width: 100vw; margin-left: -5vw; overflow-x: auto; padding: 0 5vw;} .brands .bloc_wrap::-webkit-scrollbar { display: none;} .brands .bloc_wrap .item { min-width: 40vw;} } @media (max-width:900px) { .brands { margin-top: 0;} .brands .bloc_wrap { padding-top: 0;} } @media (max-width:575px) { .brands .bloc_wrap { margin-top: -5px; grid-gap: 16px;} .brands .item img:not(.logo) { aspect-ratio: 1/1; filter: brightness(0.85);} .brands .item .txt { padding: 20px 50px 20px 20px; display: none;} .brands .item .txt p { line-height: 160%;} } .home_gallery { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 16px; margin-top: 5vw;} .home_gallery img:first-child { grid-column: span 2; height: 100%;} @media (max-width:1000px) { .home_about .img { display: none;} .home_about.reverse .bloc_wrap>.item:last-child { grid-area: 1;} } /***** moving img *****/ .moving_img { position: relative; overflow: hidden; padding: 10px 0; width: calc(100vw - 80px); left: 50%; transform: translateX(-50%);} .moving_img .row { width: auto; display: flex;} .moving_img .row .grid { width: auto; display: flex; animation: moving_img 80s linear infinite;} .moving_img .row .grid div { padding: 0 8px;} .moving_img .row .grid img { width: auto; height: clamp(160px, 40vw, 625px); display: block; border-radius: var(--imgRadius); object-fit: cover; transition: all 300ms ease-in-out;} @keyframes moving_img { 0% { transform: translate(0, 0);} 100% { transform: translate(-100%, 0);} } @media (max-width:1200px) { .moving_img { width: 100vw;} } @media (max-width:1000px) { .moving_img .row .grid img { height: clamp(160px, 70vw, 380px);} } @media (max-width:700px) { .moving_img .row .grid div { padding: 0 6px;} }