body {background: #fff; font-family: "dm-sans", sans-serif; line-height: 1.3; font-size: 18px;}
h1 {font-size: 64px; font-weight: 900; color: #000; line-height: 1.2;}
a {text-decoration: none;}
p {color: #000; font-size: 18px; line-height: 1.5; margin-bottom: 10px; font-weight: 300;}
p:last-child {margin-bottom: 0px;}

.wrapper-lrg {max-width: 1820px; width: 100%; margin: 0 auto;}

.grid {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 50px;}
.grid-3 {display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 30px;}

.button-dark, .button-light {display: inline-block; text-align: center; border-radius: 10px; line-height: 1; padding: 14px 20px 12px; font-size: 17px; font-weight: 400; box-sizing: border-box; transition: 0.5s; font-family: inherit;}
.button-light {background: #fff; color: #000; border: 1px solid #D5D5D5; }
.button-dark {background: #000; color: #fff; border: 1px solid #000;}

.button-dark:hover, .button-light:hover {color: #fff; background: #FA7406; border: 1px solid #FA7406;}

header {height: auto; box-sizing: border-box; position: fixed; top: 0px; overflow: visible; z-index: 999; width: 100%;}
.header-top > .wrapper-lrg {display: flex;}
.header-top > .wrapper-lrg .left {flex: 1; display: flex; align-items: center;}
.header-top > .wrapper-lrg .left a.logo {display: block; width: 150px; margin-right: 20px;}
.header-top > .wrapper-lrg .left span {display: block; color: #fff; font-size: 19px; font-weight: 500; padding: 35px 30px 35px 50px; position: relative; cursor: pointer;}
.header-top > .wrapper-lrg .left span::after {content: ""; background: #fff; position: absolute; right: 5px; background: url('/new/img/arrow.svg'); background-repeat: no-repeat; background-size: contain; width: 12px; height: 8px; top: 50%; transform: translateY(-50%) rotate(0deg); transition: 0.5s;}

.header-top > .wrapper-lrg .left span:hover::after {transform: translateY(-50%) rotate(180deg);}

.header-top > .wrapper-lrg .left .container-drop {display: grid; grid-template-columns: 1fr 3fr; position: absolute; margin: 0; top: 93px; background: #F4F4F4; color: #000; box-sizing: border-box;box-shadow: 0px 10px 10px #0004; transition: 0.3s; overflow: hidden; z-index: 99999; height: auto; max-height: 0px; width: 100%; left: 0px; border-radius: 0 0 25px 25px;}

.menu-left {background: #F4F4F4; text-align: right; padding: 30px; box-sizing: border-box;}
.menu-left a {font-size: 16px; position: relative;}
.menu-left a.active::after {content: ""; background: #F4F4F4; display: block; width: 20px; height: 20px; position: absolute; right: -40px; top: 50%; transform: translateY(-50%) rotate(45deg);}
.menu-right {background: #fff; box-sizing: border-box; padding: 30px;}
.menu-right ul {column-count: 3;}
.menu-right ul li a {border-radius: 5px; display: inline-block!important;}
.menu-right ul li a:hover {background: #EFEFEF;}

.header-top > .wrapper-lrg .left span:hover + .container-drop, .header-top > .wrapper-lrg .left .container-drop:hover { max-height: 1000px;}

.container-drop ul {margin: 0; text-decoration: none; color: #000; list-style: none;}
.container-drop ul li ul {display: none;}
.container-drop ul li a {text-decoration: none; color: #000; font-weight: 500; display: block; font-size: 16px; padding: 12px 10px 8px; transition: 0.5s;}

.header-top > .wrapper-lrg .right {flex: 1; display: flex; justify-content: flex-end; align-items: center;}
.header-top > .wrapper-lrg .right a {text-decoration: none; color: #fff; font-size: 10px; text-transform: uppercase; font-weight: 500; margin: 0 5px; padding: 5px; background: #1C1C1C; transition: 0.5s; border-radius: 5px; min-width: 53px; text-align: center;}
.header-top > .wrapper-lrg .right a:first-child {margin-left: 0px;}
.header-top > .wrapper-lrg .right a figure, .header-top > .wrapper-lrg .right a img {height: 20px; width: 20px; object-fit: contain; margin: 5px auto;}
.header-top > .wrapper-lrg .right a figure {mask-image: url('/new/img/hot-deals.svg'); mask-repeat:no-repeat; background: linear-gradient(180deg, rgba(255,206,0,1) 0%, rgba(250,116,6,1) 100%);}

.header-top > .wrapper-lrg .right a:hover {background: #2B2B2B; box-shadow: 0 0px 5px 2px #0003;}

.mobile-menu-bottom {display: none; width: 100%; background: #000; box-sizing: border-box; padding: 0 20px; justify-content: space-between; grid-gap: 30px; align-items: center; grid-gap: 5px;}
.mobile-menu-bottom a {text-decoration: none; color: #fff; font-size: 10px; text-transform: uppercase; font-weight: 500; margin: 0 2px; padding: 5px; background: #000; transition: 0.5s; border-radius: 5px; min-width: auto; text-align: center;}
.mobile-menu-bottom a:first-child {margin-left: 0px;}
.mobile-menu-bottom a figure, .mobile-menu-bottom a img {height: 25px; width: 25px; object-fit: contain; margin: 5px auto;}
.mobile-menu-bottom a figure {mask-image: url('/new/img/hot-deals.svg'); mask-repeat:no-repeat; background: linear-gradient(180deg, rgba(255,206,0,1) 0%, rgba(250,116,6,1) 100%); mask-position: center;}

.mobile-menu-bottom.right .ab-com {margin: 0 !important; padding:0px!important; display: flex; justify-content: flex-end;}
.mobile-menu-bottom.right .ab-com img {width: 80px!important}
.mobile-menu-bottom .flex-row {justify-content: flex-start;}

.mobmenu {background: none; padding: 25px; position: fixed;}

.hot-deals {color: #fa7406!important;}

.search-2024 {margin: auto;}
.search-2024 input, .search-2024 select {background: #000; box-sizing: border-box; font-size: 16px; text-align: center; border:0; width: auto; font-family: inherit; border-radius: 10px; padding: 22px 20px 18px; outline: 0; max-width: 198px; text-overflow: ellipsis; -webkit-appearance: none;}
.search-2024 select {color: #A5A5A550;}
.search-2024 input, .search-2024 select.changed {color: #fff;}
.search-2024 input::placeholder {color: #A5A5A550; opacity: 1; font-weight: 300;}
.search-2024 input:last-of-type {background: #2B2B2B; color: #A5A5A550}

.header-top {background: #1C1C1C; }
.header-bottom {background: #000; border-radius: 0 0 20px 20px;}
.header-bottom .wrapper-lrg {display: flex; align-items: center;}
.header-bottom p, .header-bottom a {color: #fff; font-size: 14px; font-weight: 300;  padding: 10px; margin: 0; transition: 0.5s;}
.header-bottom a {text-decoration: none;}
.header-bottom a:hover {color: #FA7406}
.header-bottom p {font-weight: 500;}

.right .ab-com {margin: 10px 0 0 0!important; padding:10px!important}
.right .ab-com img {display: block; width: 84px!important; height: auto!important; margin: 0!important; }

.home-banner {position: relative;}
.home-banner .grid-3 {height: 100vh; grid-gap: 0px;}
.home-banner figure {position: relative;}
.home-banner figure img {width: 100%; height: 100%; object-fit: cover; transition: 0.5s; filter: grayscale(1);}
.home-banner figure a {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 20px; text-transform: uppercase; color: #000; text-decoration: none; text-align: center; width: 450px; background: #fff; padding: 32px 30px 28px; box-sizing: border-box; border-radius: 10px; transition: 0.5s; z-index: 1; display: block;}
.home-banner figure a:hover ~ img {filter: grayscale(0);}
.home-banner figure a:hover {background: #000; color: #fff;}

.homeSwiper {display: none; height: 90vh; background: #000;}
.homeSwiper figure {height: 100%;}

.brand-scroll {padding: 35px 0; background: #000; border-radius: 25px 25px 0 0; position: absolute; bottom: 0px; width: 100%; z-index: 1;}
.brand-scroll .brandSwiper .swiper-wrapper {transition-timing-function: linear; align-items: center; transition-duration: 5000ms;}
.brand-scroll .brandSwiper .swiper-slide {border-right: 1px solid #404040; box-sizing: border-box;}
.brand-scroll .brandSwiper .swiper-slide img {max-height: 40px; object-fit: contain; max-width: 215px; margin: 0 auto;}

.intro {padding: 100px 0; background: #F4F4F4; border-radius: 0 0 25px 25px;}
.intro h1 {margin-bottom: 30px;}
.intro p {max-width: 545px;}

.custom-pagination .swiper-pagination {position: relative; bottom: auto!important; display: flex;}
.custom-pagination .swiper-pagination-bullet {display: inline-block; text-align: center; border-radius: 10px; line-height: 1; padding: 14px 20px 12px; font-size: 17px; font-weight: 400; box-sizing: border-box; transition: 0.5s; width: auto; background: #fff; color: #000; border: 1px solid #D5D5D5; height: auto; opacity: 1; margin: 0 5px 0 0!important;}
.custom-pagination .swiper-pagination-bullet-active {background: #000; color: #fff; border: 1px solid #000;}

.custom-pagination .swiper-pagination-bullet:hover {color: #fff; background: #FA7406; border: 1px solid #FA7406;}

.products-new > .wrapper > .flex-row {margin: 100px 0 50px;}

.products-new .item {position: relative;}
.products-new .item figure {background: #EFEFEF; box-sizing: border-box; padding: 25px; height: 310px; border-radius: 20px;overflow: hidden;}
.products-new .item figure img {height: 100%; width: 100%; object-fit: contain; mix-blend-mode: multiply;}
.products-new .item h2 {font-size: 23px; font-weight: 600; margin: 20px 0 10px; color: #000;}
.products-new .item p {margin: 0; font-size: 17px; font-weight: 300;}
.products-new .item p span {font-size: 23px; font-weight: 400;}
.products-new .item .grid {grid-gap: 20px; margin: 20px 0 50px;}

.products-new .one-day figure span {position: absolute; top: 20px; right: 20px; display: inline-block; font-size: 12px; color: #fff; box-sizing: border-box; padding: 7px 10px 5px; background: #000; border-radius: 5px; line-height: 1;}

.standard-content {background: #000;}
header + .standard-content {padding-top: 135px;}

.future {background: #F4F4F4 url(../img/footer-bg.png) top right no-repeat;}

.newsletter-new {max-width: 1720px; width: 100%; margin: 50px auto 0; background: #1C1C1C; border-radius: 20px; box-sizing: border-box; padding: 60px;}
.newsletter-new h3 {color: #fff; font-size: 64px; font-weight: 500; max-width: 420px; line-height: 1.1; margin-bottom: 20px;}
.newsletter-new article {max-width: 500px;}
.newsletter-new article p {color: #fff;}
.newsletter-new article p strong {font-weight: 500;}

.signup-field {position: relative;}
.signup-field button {position: absolute; right: 5px; top: 6px;}
.signup-field input {max-width: 460px; width: 100%; border-radius: 10px; font-size: 22px; border: 1px solid #fff; padding: 17px 15px 15px;; box-sizing: border-box; outline: 0; font-weight: 300; font-family: inherit;}
.signup-field input::placeholder {color: #606060; opacity: 1;}

.social {display: flex; mix-blend-mode: multiply; grid-gap: 5px;}
.signup-field #systemMessage.highlight_message {box-sizing: border-box; margin-top: -10px; padding: 20px 10px 10px; border-radius: 0 0 10px 10px}

footer {padding: 0;}
footer .flex-row {padding: 100px 0; max-width: 1720px; width: 100%; margin: 0 auto; align-items: initial;}
footer .flex-row .left {padding-left: 50px;}
footer .flex-row .right {float: none; display: flex; justify-content: space-between; flex-direction: column; align-items: flex-end;}
footer .flex-row .right > img {max-width: 124px;}
footer ul li a {color: #838383; font-size: 20px; font-weight: 300; font-family: "dm-sans", sans-serif; transition: 0.3s; margin-bottom: 15px; padding: 0;}
footer ul li a:hover {color: #000;}
footer ul li:first-child a {font-size: 30px; font-weight: 500; color: #000;}
footer ul li:last-child a {margin-bottom: 0px;}
footer .copyright {margin: 0; padding: 25px 0; background: #fff; border-top: 1px solid #E2E2E2;}
footer .copyright p, footer .copyright a {color: #83838350; font-size: 14px; font-weight: 300;}
