style.css

*{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;text-decoration:none;font-family:"Kumbh Sans",sans-serif}body{top:0;bottom:0}.lightBox{position:fixed;width:100%;top:0;left:0;bottom:0;z-index:5;background-color:rgba(0,0,0,.9);display:none}.lightBox .productDisplay{margin:8rem auto 0 auto;height:27rem;max-width:25rem}.lightBox .productDisplay .productImage{cursor:pointer;height:75%;border-radius:6px;position:relative}.lightBox .productDisplay .productImage .closeLightBox{position:absolute;top:-3rem;right:0;font-size:1.4rem;color:#fff}.lightBox .productDisplay .productImage .LightBoxImageSlides{position:absolute;width:100%;height:100%;border-radius:6px;overflow:hidden;display:none}.lightBox .productDisplay .productImage .LightBoxImageSlides img{width:100%;height:100%;border-radius:6px}.lightBox .productDisplay .productImage .active{display:block}.LightBoxCarousel{width:100%;height:100%;position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.LightBoxCarousel div{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:40px;height:40px;border-radius:50%;background-color:#fff;cursor:pointer}.LightBoxCarousel div i{position:relative;font-size:1.3rem;z-index:-1}.LightBoxCarousel .LBprevious{margin-left:-15px;z-index:10}.LightBoxCarousel .LBnext{margin-right:-15px;z-index:10}.LBproducts{cursor:pointer;height:21%;margin-top:3%;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.LBproducts div{width:22%;border-radius:6px;-khtml-border-radius:6px}.LBproducts div img{width:100%;height:100%;border-radius:6px;-khtml-border-radius:6px}.LBproducts .activeState{outline:3px solid #ff7a16;opacity:.5}.container{overflow:hidden;margin:auto;width:95%;max-width:1250px;position:relative;padding:0 5%}.hamburger{position:absolute;z-index:4;top:0;left:0;bottom:0;width:60%;background-color:#fff;-webkit-transform:translateX(-160%);transform:translateX(-160%);-webkit-transition:-webkit-transform .4s ease-in;transition:-webkit-transform .4s ease-in;transition:transform .4s ease-in;transition:transform .4s ease-in, -webkit-transform .4s ease-in;-webkit-box-shadow:-1px 2px 6px 0px rgba(0,0,0,.75);box-shadow:-1px 2px 6px 0px rgba(0,0,0,.75)}.hamburger ul{margin:5.5rem 0 0 1.5rem}.hamburger ul li{margin:1.5rem}.hamburger ul li a{color:#000;font-weight:600}header{position:relative;border-bottom:1px solid #e8e7ec}header .ham{cursor:pointer;position:absolute;left:15px;top:23px;-webkit-transform:translateY(50%);transform:translateY(50%);z-index:4;display:none}header .ham i{font-size:1.3rem}header a{font-size:clamp(.9rem,1.5vw,1rem);color:#b4b5b9}header nav{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}header nav>div{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}header nav .leftSect{width:75%}header nav .leftSect .logo{width:5.5rem;height:1.6rem;cursor:pointer;margin-right:5%}header nav .leftSect .logo img{width:100%;height:100%;display:block}header nav .leftSect ul{height:5.2rem;width:75%;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;padding-top:4px}header nav .leftSect ul li{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-bottom:3px}header nav .leftSect ul li:hover{border-bottom:3px solid #ff7a16;padding-bottom:0}header nav .leftSect ul li:hover a{color:#000}header nav .rightSect{width:20%;-ms-flex-pack:distribute;justify-content:space-around}header nav .rightSect figure{cursor:pointer;width:30px}header nav .rightSect figure img{width:100%;height:100%}header nav .rightSect .cart{width:25px;position:relative}header nav .rightSect .cart .displayNum{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:15px;height:12px;background-color:#ff7a16;color:#fff;border-radius:9px;top:-8px;right:0;z-index:-1;display:none;font-size:.5rem}header nav .rightSect .cart:hover img{-webkit-filter:brightness(0) saturate(100%);filter:brightness(0) saturate(100%)}header nav .rightSect .avatar{border-radius:50%}header nav .rightSect .avatar:hover{outline:2px solid #ff7a16}header .cartDetails{position:absolute;right:0;top:4rem;overflow:auto;width:19rem;background-color:#fff;z-index:4;border-radius:6px;-webkit-box-shadow:0px 0px 8px -1px rgba(0,0,0,.5);box-shadow:0px 0px 8px -1px rgba(0,0,0,.5);display:none}header .cartDetails .myCart{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:15px;border-bottom:1px solid #b4b5b9}header .cartDetails .myCart h4{font-size:1rem}header .cartDetails .myCart .closeCart{font-size:1rem;cursor:pointer}header .cartDetails .cartList{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:15px;display:none}header .cartDetails .cartList .productIcon{width:45px;height:45px;border-radius:5px}header .cartDetails .cartList .productIcon img{width:100%;height:100%;border-radius:5px}header .cartDetails .cartList i{cursor:pointer}header .cartDetails .cartList .prodDetailing h5{margin-top:.5rem;font-size:.85rem;display:inline;font-weight:500;color:#b4b5b9}header .cartDetails .cartList .prodDetailing h4{font-size:.85rem;display:inline;margin-left:.3rem;font-weight:600}header .cartDetails .cartList .prodDetailing>p{font-size:.85rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#b4b5b9;margin-bottom:.5rem}header .cartDetails .checkOut{padding:15px;margin-bottom:1rem;display:none}header .cartDetails .checkOut button{width:100%;padding:10px;background-color:#ff7a16;border:none;color:#fff;border-radius:6px;font-size:1.05rem;cursor:pointer}header .cartDetails .emptyCart{height:10rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-weight:600;color:#b4b5b9}header .active{display:block}.productSection{padding:10px 20px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;margin-top:4rem}.productSection>*{width:40%}.productDisplay{width:55%;max-width:25rem}.productDisplay .productImage{cursor:pointer;height:21rem;border-radius:6px;position:relative}.productDisplay .productImage .imageSlides{position:absolute;width:100%;height:100%;border-radius:6px;overflow:hidden;display:none}.productDisplay .productImage .imageSlides img{width:100%;height:100%;border-radius:6px}.productDisplay .productImage .imageSlides img:hover{-webkit-transform:scale(1.2);transform:scale(1.2)}.productDisplay .productImage .active{display:block}.productDisplay .products{cursor:pointer;height:5rem;margin-top:1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.productDisplay .products div{width:22%;border-radius:6px;-khtml-border-radius:6px;overflow:hidden}.productDisplay .products div img{width:100%;height:100%;border-radius:6px;-khtml-border-radius:6px}.productDisplay .products .activeState{outline:3px solid #ff7a16;opacity:.5}.LBproduct{overflow:hidden}.productSlide:hover,.LBproduct:hover{opacity:.5}.productSlide:hover img,.LBproduct:hover img{-webkit-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .5s ease-in;transition:-webkit-transform .5s ease-in;transition:transform .5s ease-in;transition:transform .5s ease-in, -webkit-transform .5s ease-in}.navigation .carousel{width:100%;height:100%;position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.navigation .carousel div{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:40px;height:40px;border-radius:50%;background-color:rgba(255,255,255,.5);cursor:pointer;display:none}.navigation .carousel div i{position:relative;font-size:1.3rem}.navigation .carousel .previous{margin-left:1rem}.navigation .carousel .next{margin-right:1rem}.navigation:hover .carousel div{display:-webkit-box;display:-ms-flexbox;display:flex}.navigation:hover .imageSlides img{-webkit-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .6s ease-in-out;transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out;transition:transform .6s ease-in-out, -webkit-transform .6s ease-in-out}.prouctDetails{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.prouctDetails h1{color:#f28735;font-size:clamp(.9rem,1.5vw,1rem);margin-bottom:1rem}.prouctDetails h2{font-size:clamp(1.7rem,4vw,2.4rem);margin-bottom:1rem}.prouctDetails p{line-height:1.5rem;font-size:clamp(.9rem,2vw,1rem);margin-bottom:1rem}.prouctDetails .price{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:1.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.prouctDetails .price .recentPrice{position:relative;font-size:clamp(1.2rem,2.5vw,1.4rem);font-weight:700;display:-webkit-box;display:-ms-flexbox;display:flex}.prouctDetails .price .percentReduction{padding:2px;font-size:clamp(.9rem,2vw,1rem);margin-left:.5rem;color:#e3905a;background-color:#feeedf;border-radius:3px}.prouctDetails .price .priceSlash{color:#bfc3c6;font-weight:600;text-decoration:line-through}.prouctDetails .about{color:#6a6b6f}.itemManagement{display:-webkit-box;display:-ms-flexbox;display:flex}.itemManagement .addItems{margin-right:3%;display:-webkit-box;display:-ms-flexbox;display:flex;width:30%;text-align:center;cursor:pointer;border-radius:6px;background-color:#f7f8fd}.itemManagement .addItems div{padding:7px;width:33.3%}.itemManagement .addItems div i{color:#ff7a16}.itemManagement .addToCart{display:-webkit-box;display:-ms-flexbox;display:flex;width:50%;cursor:pointer;border-radius:6px;background-color:#ff7a16;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.itemManagement .addToCart i{color:#fff;margin-right:.7rem}.itemManagement .addToCart div{color:#fff;font-size:clamp(.85rem,1.5vw,.9rem)}.active{display:block}@media(max-width: 780px){.container{padding:0 2.5%}.productSection{padding:10px 10px}.productSection .addToCart{width:55%}.productSection .addItems{width:35%}}@media(max-width: 685px){.container{padding:5px 2%;width:100%}.productSection{padding:5px 0}.productSection .addToCart{width:60%}.productSection .addItems{width:35%}}@media(max-width: 670px){.container{padding:0}header{padding:0 3px}}@media(max-width: 685px){header .cartDetails{right:10px}}@media(max-width: 575px){.lightBox{display:none}header .ham{display:block}header nav{height:5rem}header nav .rightSect{width:30%}.leftSect .category{display:none}.leftSect .logo{margin-right:0;margin-left:2.5rem}header .cartDetails{top:6rem;width:95%;left:2.5%;overflow:auto}header .cartDetails .cartList{padding:15px}header .cartDetails .cartList .productIcon{width:70px;height:70px}header .cartDetails .cartList .prodDetailing{width:70%}header .cartDetails .cartList .prodDetailing h5{font-size:clamp(1.1rem,2vw,1.25rem)}header .cartDetails .cartList .prodDetailing h4{font-size:clamp(1.1rem,2vw,1.25rem)}header .cartDetails .cartList .prodDetailing>p{font-size:clamp(1.1rem,2vw,1.25rem)}.productSection{padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top:0}.productSection>*{width:100%}.productDisplay{max-width:100%}.productDisplay .productImage{height:25rem;border-radius:0;-webkit-transition:height .4s ease-in;transition:height .4s ease-in}.productDisplay .productImage .imageSlides{border-radius:0}.productDisplay .productImage .imageSlides img{border-radius:0}.productDisplay .products{display:none}.navigation .carousel div{display:-webkit-box;display:-ms-flexbox;display:flex;background-color:#fff}.prouctDetails{padding:25px 20px 60px 20px}.prouctDetails .price{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.prouctDetails .price .recentPrice{font-size:clamp(1.3rem,2.5vw,1.5rem);font-weight:800}.prouctDetails p{font-size:clamp(.9rem,2vw,1.2rem)}.prouctDetails h2{font-size:clamp(1.6rem,5vw,2.4rem);margin-bottom:1rem}.itemManagement{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.itemManagement .addItems{width:100%;height:60px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.itemManagement .addToCart{width:100%;margin-top:1.5rem;height:60px}.itemManagement .addToCart i{font-size:clamp(1rem,1.5vw,1.2rem)}.itemManagement .addToCart div{font-size:clamp(1rem,1.5vw,1.2rem)}}@media(max-width: 320px){.navigation .previous{left:10px}.navigation .next{right:10px}.productDisplay .productImage{height:20rem}header .cartDetails{width:98%;left:1%}header .cartDetails .cartList{padding:15px}header .cartDetails .cartList .productIcon{width:50px;height:50px}}