@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap);@import url(https://fonts.googleapis.com/css?family=Inconsolata|Merriweather);.lds-ellipsis{display:inline-block;height:80px;position:relative;width:80px}.lds-ellipsis div{animation-timing-function:cubic-bezier(0,1,1,0);background:#71b6f9;border-radius:50%;height:13px;position:absolute;top:33px;width:13px}.lds-ellipsis div:first-child{animation:lds-ellipsis1 .6s infinite;left:8px}.lds-ellipsis div:nth-child(2){animation:lds-ellipsis2 .6s infinite;left:8px}.lds-ellipsis div:nth-child(3){animation:lds-ellipsis2 .6s infinite;left:32px}.lds-ellipsis div:nth-child(4){animation:lds-ellipsis3 .6s infinite;left:56px}@keyframes lds-ellipsis1{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes lds-ellipsis3{0%{transform:scale(1)}to{transform:scale(0)}}@keyframes lds-ellipsis2{0%{transform:translate(0)}to{transform:translate(24px)}}*{box-sizing:border-box;font-family:Open Sans,sans-serif;margin:0;padding:0}body{line-height:1.5}.card-wrapper{margin:0 auto;max-width:1100px}img{display:block;width:100%}.img-display{overflow:hidden}.img-showcase{display:flex;transition:all .5s ease;width:100%}.img-showcase img{min-width:100%}.img-select{display:flex}.img-item{margin:.3rem}.img-item:first-child,.img-item:nth-child(2),.img-item:nth-child(3){margin-right:0}.img-item:hover{opacity:.8}.product-content{padding:2rem 1rem}.product-title{color:#12263a;font-size:3rem;font-weight:700;margin:1rem 0;position:relative;text-transform:capitalize}.product-title:after{background:#12263a;bottom:0;content:"";height:4px;left:0;position:absolute;width:80px}.product-link{background:#256eff;color:#fff;display:inline-block;font-size:.9rem;font-weight:400;margin-bottom:.5rem;padding:0 .3rem;text-decoration:none;text-transform:uppercase;transition:all .5s ease}.product-link:hover{opacity:.9}.product-rating{color:#ffc107}.product-rating span{color:#252525;font-weight:600}.product-price{font-size:1rem;font-weight:700;margin:1rem 0}.product-price span{font-weight:400}.last-price span{color:#f64749;text-decoration:line-through}.new-price span{color:#256eff}.product-detail h2{color:#12263a;padding-bottom:.6rem;text-transform:capitalize}.product-detail p{font-size:.9rem;opacity:.8;padding:.3rem}.product-detail ul{font-size:.9rem;margin:1rem 0}.product-detail ul li{background:url(https://fadzrinmadu.github.io/hosted-assets/product-detail-page-design-with-image-slider-html-css-and-javascript/checked.png) 0 no-repeat;background-size:18px;font-weight:600;list-style:none;margin:.4rem 0;opacity:.9;padding-left:1.7rem}.product-detail ul li span{font-weight:400}.purchase-info{margin:1.5rem 0}.purchase-info .btn,.purchase-info input{border:1.5px solid #ddd;border-radius:25px;margin-bottom:1rem;margin-right:.2rem;outline:0;padding:.45rem .8rem;text-align:center}.purchase-info input{width:60px}.purchase-info .btn{color:#fff;cursor:pointer}.purchase-info .btn:first-of-type{background:#256eff}.purchase-info .btn:last-of-type{background:#f64749}.purchase-info .btn:hover{opacity:.9}.social-links,.social-links a{align-items:center;display:flex}.social-links a{border:1px solid #000;border-radius:50%;color:#000;font-size:.8rem;height:32px;justify-content:center;margin:0 .2rem;text-decoration:none;transition:all .5s ease;width:32px}.social-links a:hover{background:#000;border-color:#0000;color:#fff}@media screen and (min-width:992px){.card{grid-gap:1.5rem;display:grid;grid-template-columns:repeat(2,1fr)}.card-wrapper{align-items:center;height:100vh}.card-wrapper,.product-imgs{display:flex;justify-content:center}.product-imgs{flex-direction:column}.product-content{padding-top:0}}.navbar{background-color:#333;overflow:hidden}.navbar a{color:#fff;float:left;font-size:16px;padding:14px 16px;text-align:center;text-decoration:none}.subnav{float:left;overflow:hidden}.subnav .subnavbtn{background-color:inherit;border:none;color:#fff;font-family:inherit;font-size:16px;margin:0;outline:none;padding:14px 16px}.navbar a:hover,.subnav-content,.subnav:hover .subnavbtn{background-color:#000}.subnav-content{display:none;left:0;position:absolute;width:100%;z-index:10000}.subnav-content a{color:#fff;float:left;text-decoration:none}.subnav-content a:hover{background-color:#eee;color:#000}.subnav:hover .subnav-content{display:block}body{background-color:#1a2027;font-family:Inconsolata,monospace;margin:0;width:100%}button{cursor:pointer}.cont{flex-direction:row;flex-wrap:wrap}.cont,.contVip{align-items:stretch;box-sizing:border-box;display:flex;height:100%;width:100%}.contVip{flex:50% 1;flex-direction:row;flex-wrap:wrap}.imgdimVip{height:180px;width:380px}.imgdim{height:180px;object-fit:cover;width:180px}@media only screen and (max-width:340px){.imgdim{height:140px;width:140px}}@media only screen and (max-width:375px){.imgdim{height:93px;width:93px}}@media only screen and (min-width:376px){.imgdim{height:100px;width:100px}}@media only screen and (min-width:390px){.imgdim{height:130px;width:130px}@media only screen and (min-width:412px){.imgdim{height:134px;width:134px}}@media only screen and (min-width:414px){.imgdim{height:135px;width:135px}}@media only screen and (min-width:430px){.imgdim{height:140px;width:140px}}@media only screen and (min-width:992px){.imgdim{height:170px;width:170px}}@media only screen and (min-width:1200px){.imgdim{height:185px;width:185px}}}
/*# sourceMappingURL=main.6d001e60.css.map*/