Update 20/04/2023

demo-audio-3/css/style_mobile.css

@@ -0,0 +1,261 @@
+:root{--color-primary:#ff9d06;--color-secondary:#041e42;--white:#fff;--black:#000;--red:#e80000;--gray:#b7b7b7;--gray-2:#d9d9d9;--box-shadow:0px 1px 6px rgba(0, 0, 0, 0.2)}
+*,::after,::before{padding:0;margin:0;-webkit-box-sizing:inherit;box-sizing:inherit}
+html{font-size:14px}
+body{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Inter,sans-serif;color:#000;word-break:break-word;line-height:1.3;font-weight:400;background-color:#fff}
+input[type=number]::-webkit-inner-spin-button{opacity:1}
+@-webkit-keyframes gradient-bg-antimation{
+0%{background-position:0 0}
+100%{background-position:-200% 0}
+}
+@keyframes gradient-bg-antimation{
+0%{background-position:0 0}
+100%{background-position:-200% 0}
+}
+.container{max-width:768px;width:100%;padding:0 10px;margin:0 auto}
+.grid{gap:10px}
+.box-w{border-radius:15px;background-color:#fff;padding:12px}
+.border-none{border:0!important}
+.box-empty{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;font-size:24px;line-height:28px;width:100%;height:430px;color:red}
+.alert-mess{text-align:center;padding:50px 30px;font-size:20px;font-weight:500;color:red}
+.static-html{max-height:500px;overflow:hidden;-webkit-transition:.8s;-o-transition:.8s;transition:.8s;position:relative}
+.static-html.blur:after{content:"";position:absolute;left:0;right:0;bottom:0;height:100px;background:-o-linear-gradient(transparent,#fff);background:-webkit-gradient(linear,left top,left bottom,from(transparent),to(#fff));background:linear-gradient(transparent,#fff)}
+.static-html iframe{display:block;margin:0 auto}
+.paging{padding:0 10px 32px;margin-top:32px;text-align:center}
+.paging-link.active,.paging-link:hover{color:#fff;background:var(--color-primary);font-weight:500}
+.paging-link{display:-webkit-inline-box!important;display:-ms-inline-flexbox!important;display:inline-flex!important;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:8px;border-radius:5px;color:#000;font-size:14px;line-height:18px;text-decoration:none;text-transform:capitalize;width:32px;height:32px}
+.routing .list{display:-webkit-box;display:-ms-flexbox;display:flex;padding:12px 0;margin-bottom:12px;border-bottom:1px solid #e9e9e9;list-style:none;text-transform:uppercase}
+.routing .routing-link{position:relative;font-size:13px;font-weight:400;padding:0 10px;text-decoration:none}
+.routing .routing-link:first-child{padding-left:0}
+.routing .routing-link:last-child{color:var(--color-primary);max-width:700px;overflow:hidden;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}
+.routing .routing-link:not(:last-child)::before{content:"";position:absolute;top:50%;right:0;-webkit-transform:translateY(-50%) rotate(25deg);-ms-transform:translateY(-50%) rotate(25deg);transform:translateY(-50%) rotate(25deg);width:1px;height:80%;border-right:1px solid #000}
+.success-form{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;background:rgba(0,0,0,.5);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}
+.success-form .cart-success{width:500px;height:300px;background:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:fixed}
+.success-form .success-form-svg{display:block;height:80px;width:80px;color:var(--color-primary)}
+.success-form .text-cart-success{font-size:24px;font-weight:600;line-height:1.6;padding-top:30px}
+.header-cart:hover .cart-ttip{display:block}
+.cart-ttip{display:none;position:absolute;background-color:#fff;border-radius:10px;width:400px;height:auto;right:0;top:40px;z-index:3;-webkit-box-shadow:0 1px 6px rgb(0 0 0 / 25%);box-shadow:0 1px 6px rgb(0 0 0 / 25%)}
+.cart-ttip .cart-ttip-price-button{border-radius:5px;padding:10px;background:var(--color-primary);text-align:center;margin:0 12px 12px}
+.cart-ttip .cart-ttip-item-container{max-height:300px;overflow:auto}
+.cart-ttip .cart-ttip-item-container .compare-item{height:auto;margin:0;max-width:unset;-webkit-box-shadow:none;box-shadow:none}
+.cart-ttip .cart-ttip .header-null-cart{width:100%!important;text-align:center;padding:30px;color:#000;font-weight:600}
+.cart-ttip .header-cart-item-price{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;margin-top:10px}
+.cart-ttip .cart-ttip-price,.compare-item,.header-nav-menu a{display:-webkit-box;display:-ms-flexbox}
+.cart-ttip .header-cart-item-price p{font-weight:700;width:auto}
+.cart-ttip .cart-ttip-price{padding:10px 20px 10px 10px;border-top:3px solid var(--color-primary);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end!important;-ms-flex-pack:end!important;justify-content:flex-end!important;gap:6px;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}
+.cart-ttip .cart-ttip-price p{color:#000;width:auto;padding:0;margin:0}
+.cart-ttip .cart-ttip-price p:first-child{font-size:15px;font-weight:700;text-transform:uppercase;-webkit-transform:translateY(2px);-ms-transform:translateY(2px);transform:translateY(2px)}
+.cart-ttip .cart-ttip-price p:nth-child(2){font-size:13px;font-weight:200;color:var(--color-primary);margin-left:0!important}
+.cart-ttip .cart-ttip-price p:last-child{font-size:15px;font-weight:700}
+.cart-ttip .compare-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;-webkit-box-shadow:0 1px 8px rgb(0 0 0 / 25%);box-shadow:0 1px 8px rgb(0 0 0 / 25%);padding:10px;border-radius:10px;max-width:360px;background:#fff}
+.cart-ttip .compare-item img{width:80px;border:5px}
+.cart-ttip .compare-item .compare-item-text{display:inline-block;padding:0 10px;-webkit-box-flex:1;-ms-flex:1;flex:1}
+.cart-ttip .compare-item .compare-item-text p{background:0 0;color:#000;padding:0;width:100%;word-break:break-word;font-size:14px;line-height:20px;margin-left:0;height:40px}
+.cart-ttip .header-null-cart{width:100%;text-align:center;padding:24px;color:#000;font-size:14px;font-weight:600}
+.scroll-top-btn{display:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:24px;width:55px;height:55px;position:fixed;bottom:100px;right:20px;background:var(--color-primary);border-radius:50%;z-index:999;-webkit-box-shadow:0 1px 5px rgb(0 0 0 / 20%);box-shadow:0 1px 5px rgb(0 0 0 / 20%);color:#fff}
+.view-more-content-btn{display:block;text-align:center;margin:20px 0;font-size:16px;line-height:20px;font-weight:600;color:var(--color-secondary)}
+.static-icons{background-image:url(/images/static-icons-map.png);background-repeat:no-repeat;display:inline-block;background-size:296.5px 236px}
+.static-icon-5-stars{width:64px;height:11px;background-position:-1.5px -1.5px;background-size:198px 157px}
+.static-icon-customer-avatar{width:30px;height:30px;background-position:-104px -3px}
+.static-icon-feature-cart{width:45px;height:27px;background-position:-139px -3px}
+.static-icon-feature-delivery{width:52px;height:52px;background-position:-3px -35px}
+.static-icon-feature-fly-gift{width:23px;height:38px;background-position:-60px -35px}
+.static-icon-feature-mail{width:33px;height:26px;background-position:-139px -35px}
+.static-icon-feature-money-pig{width:35px;height:35px;background-position:-88px -66px}
+.static-icon-feature-phone{width:31px;height:32px;background-position:-177px -35px}
+.static-icon-feature-reward{width:42px;height:42px;background-position:-128px -72px}
+.static-icon-feature-support{width:42px;height:42px;background-position:-3px -119px}
+.static-icon-feature-support-2{width:42px;height:42px;background-position:-50px -119px}
+.static-icon-filter-mb{width:21px;height:20px;background-position:-175px -72px}
+.static-icon-gift{width:18px;height:18px;background-position:-189px -3px}
+.static-icon-gray-close{width:31px;height:31px;background-position:-174px -96px}
+.static-icon-gray-close-mb{width:21px;height:21px;background-position:-96px -131px}
+.static-icon-green-box{width:13px;height:13px;background-position:-3px -97px}
+.static-icon-grid-style{width:22px;height:23px;background-position:-122px -131px}
+.static-icon-header-cart{width:35px;height:39px;background-position:-149px -132px}
+.static-icon-header-cart-mb{width:29px;height:32px;background-position:-3px -176px}
+.static-icon-header-user{width:40px;height:40px;background-position:-212px -3px}
+.static-icon-list-style{width:25px;height:23px;background-position:-212px -46px}
+.static-icon-location{width:14px;height:15px;background-position:-87px -46px}
+.static-icon-menu{width:30px;height:23px;background-position:-210px -74px}
+.static-icon-menu-mb{width:30px;height:23px;background-position:-210px -102px}
+.static-icon-phone-shake{width:14px;height:14px;background-position:-105px -47px}
+.static-icon-sale-fire{width:22px;height:26px;background-position:-210px -130px}
+.static-icon-social-fb{width:15px;height:28px;background-position:-237px -130px}
+.static-icon-social-fb-logo{width:38px;height:38px;background-position:-97px -161px}
+.static-icon-social-gg-news{width:28px;height:28px;background-position:-189px -161px}
+.static-icon-social-instagram{width:28px;height:28px;background-position:-221px -163px}
+.static-icon-social-instagram-logo{width:38px;height:38px;background-position:-37px -196px}
+.static-icon-social-twitter{width:33px;height:26px;background-position:-140px -196px}
+.static-icon-social-youtube{width:37px;height:26px;background-position:-177px -196px}
+.static-icon-social-youtube-logo{width:38px;height:38px;background-position:-256px -3px}
+.global-logo{display:-webkit-box;display:-ms-flexbox;display:flex}
+.global-socials .list{display:-ms-grid;display:grid;height:60px;-ms-grid-columns:(1fr)[5];grid-template-columns:repeat(5,1fr)}
+.global-socials .line-white-block{height:1px;background-color:#fff;margin:0 -10px}
+.global-socials .item .link{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;height:100%;border-left:1px solid #fff;border-top:1px solid transparent;border-bottom:1px solid transparent}
+.global-socials .item .link:hover{background-color:#fff;border-color:var(--color-primary)}
+.global-socials .item .link:hover i{-webkit-filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%);filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%)}
+.global-socials .item:last-child{border-right:1px solid #fff}
+.section-deal .line-block{width:100%;height:2px;background-color:var(--red)}
+.section-deal .global-deal-time-countdown{display:inline-block;padding:8px 12px;background-color:var(--red);border-radius:12px;font-size:20px;line-height:24px;font-weight:600;color:#fff}
+.p-item{min-width:0}
+.p-item .p-thumbs{position:relative;border:1px solid var(--gray-2);border-radius:12px;overflow:hidden}
+.p-item .p-thumbs .p-image{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;padding-bottom:100%}
+.p-item .p-thumbs .p-image img{position:absolute;bottom:0;right:0;top:0;left:0;margin:auto 0}
+.p-item .p-thumbs .swiper-pagination{width:unset;left:6px;bottom:6px}
+.p-item .p-thumbs .swiper-pagination-bullet{width:10px;height:10px}
+.p-item .p-thumbs .swiper-pagination-bullet-active{background-color:var(--color-primary)}
+.p-item .p-price-sale-off{position:absolute;top:16px;left:16px;padding:9px;background-color:var(--red);color:#fff;font-size:15px;line-height:18px;border-radius:8px;z-index:9}
+.p-item .p-name{font-weight:500;font-size:13px;line-height:17px}
+.p-item .p-price-sale{font-size:18px;line-height:24px;font-weight:700;color:var(--color-primary)}
+.p-item .p-price-stock{font-size:13px;line-height:24px;font-weight:500;color:#b7b7b7}
+.p-item .p-quantity{font-size:13px;line-height:12px;font-weight:500;color:#099268;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:4px}
+.p-item .p-quantity-deal{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;color:var(--gray)}
+.p-item .p-quantity-deal .deal-quantity{color:#000}
+.p-item .p-wrapper-deal{height:10px;width:100%}
+.p-item .p-wrapper-deal .deal-line{position:absolute;top:0;left:0;bottom:0;width:100%;border-radius:5px;background:-o-linear-gradient(right,var(--color-primary) 0,var(--red) 100%);background:-o-linear-gradient(right,var(--color-primary) 0,var(--red) 100%);background:-webkit-gradient(linear,right top,left top,color-stop(0,var(--color-primary)),to(var(--red)));background:-o-linear-gradient(right,var(--color-primary) 0,var(--red) 100%);background:linear-gradient(270deg,var(--color-primary) 0,var(--red) 100%)}
+.p-item .p-wrapper-deal .deal-line.total{opacity:.3}
+.p-item .p-wrapper-deal .deal-line.remaining{background:-o-repeating-linear-gradient(left,var(--color-primary) 0,var(--red) 50%,var(--color-primary) 100%);background:repeating-linear-gradient(to right,var(--color-primary) 0,var(--red) 50%,var(--color-primary) 100%);background-size:200% auto;background-position:0 100%;-webkit-animation:2s linear infinite forwards gradient-bg-antimation;animation:2s linear infinite forwards gradient-bg-antimation}
+.p-item .p-rating span{font-size:12px;margin-top:2px!important}
+.global-header .header-top{height:54px;display:-webkit-box;display:-ms-flexbox;display:flex}
+.global-header .search-bar{position:relative;max-width:874px;margin:0 auto}
+.global-header .search-bar .search-bar-input{width:100%;height:36px;border:1px solid var(--color-secondary);border-radius:10px;padding-left:12px;outline-color:#041a38;font-size:13px;line-height:17px}
+.global-header .search-bar .search-bar-btn{width:80px;height:36px;color:#fff;background-color:var(--color-secondary);font-size:13px;line-height:17px;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;border-radius:0 10px 10px 0;border:0;position:absolute;top:0;right:0;cursor:pointer}
+.global-header .search-bar .search-bar-btn::after{content:"";position:absolute;top:50%;left:-8px;width:10px;height:10px;-webkit-transform:rotate(45deg) translateY(-50%);-ms-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%);background-color:var(--color-secondary)}
+.global-header .header-func{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:14px;color:#888;font-weight:600}
+.global-header .header-cart .header-cart-amount{width:20px;height:20px;background-color:var(--color-primary);border-radius:50%;position:absolute;top:-8px;right:-8px;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;font-size:12px;line-height:12px;font-weight:700;font-style:normal;color:#000}
+.global-header .header-navbar{position:relative}
+.global-header .header-navbar-list{position:absolute;top:100%;left:0;right:0;background-color:#fff;font-size:15px;line-height:32px;padding:8px 12px;-webkit-box-shadow:0 1px 8px rgba(0,0,0,.15);box-shadow:0 1px 8px rgba(0,0,0,.15);z-index:999}
+.global-header .header-navbar-list .item .image{width:30px;height:30px}
+.global-header .header-navbar .header-navbar-menu{width:308px;height:60px;font-size:22px;line-height:26px;font-weight:600;text-transform:uppercase;color:#fff;background-color:var(--color-secondary);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;gap:8px;cursor:pointer}
+.homepage .section-hero .section-hero-features{display:-ms-grid;display:grid;-ms-grid-columns:1fr 10px 1fr 10px 1fr;grid-template-columns:repeat(3,1fr);gap:10px;height:100%;background-color:#fff}
+.homepage .section-hero .section-hero-features .item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:16px;padding:8px;text-align:center;font-size:12px;border:1px solid #d9d9d9}
+.homepage .section-category .heading{background-color:#e9e9e9;border-radius:8px}
+.homepage .section-category .heading .title{padding:10px 12px;font-size:20px;line-height:32px;background-color:var(--color-primary);color:#fff;display:inline-block;border-radius:8px 0 0 8px;position:relative}
+.homepage .section-category .heading .title::after{content:"";position:absolute;top:50%;right:-2px;width:15px;height:15px;-webkit-transform:rotate(45deg) translateY(-50%);-ms-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%);background-color:var(--color-primary)}
+.homepage .section-category .content .banner{border-radius:15px;overflow:hidden}
+.homepage .section-category .product-best-seller{background:#fff;border:1px solid var(--gray-2);border-radius:15px;overflow:hidden}
+.homepage .section-category .product-best-seller .header{background:#e9e9e9;border-bottom:1px solid var(--gray-2);border-radius:15px 15px 0 0;font-size:20px;line-height:24px;font-weight:700;text-transform:uppercase;text-align:center;padding:22px 0 18px}
+.homepage .section-category .product-best-seller .p-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px}
+.homepage .section-category .product-best-seller .item:not(:last-child){margin-bottom:38px}
+.homepage .section-category .product-best-seller .p-thumbs{max-width:148px;width:100%;height:-webkit-max-content;height:-moz-max-content;height:max-content}
+.homepage .section-category .product-best-seller .p-name{font-size:14px;line-height:18px;margin-top:0!important}
+.homepage .section-category .product-best-seller .p-price-sale{font-size:18px;line-height:18px}
+.homepage .section-category .product-best-seller .p-price-stock{font-size:14px;line-height:14px}
+.homepage .section-category .product-best-seller .p-quantity{margin:8px 0 0!important}
+.homepage .section-category .product-best-seller .p-price-sale-off{font-size:13px;line-height:14px;padding:6px;top:10px;left:10px}
+.homepage .section-customer{background-color:#f5f5f5;margin-bottom:-24px}
+.homepage .section-customer .heading{position:relative;font-size:20px;line-height:24px;font-weight:600;text-align:center;padding:24px 0 40px}
+.homepage .section-customer .heading::after{content:"";position:absolute;top:72%;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);max-width:254px;width:100%;height:2px;background-color:#888}
+.homepage .section-customer .item{position:relative;padding-bottom:92px}
+.homepage .section-customer .item .bg-image{border-radius:12px;overflow:hidden;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.2);box-shadow:0 1px 5px rgba(0,0,0,.2)}
+.homepage .section-customer .item .content{position:absolute;bottom:0;left:8px;right:8px;background:#fff;-webkit-box-shadow:0 1px 6px rgba(0,0,0,.25);box-shadow:0 1px 6px rgba(0,0,0,.25);border-radius:12px;padding:6px}
+.homepage .section-customer .item .line-block{width:100%;height:1px;background-color:var(--gray-2)}
+.product-page .category-child .list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px;overflow:auto;white-space:nowrap}
+.product-page .category-child .list .list-item{max-width:150px;width:100%}
+.product-page .category-child .item .image{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;padding-bottom:100%}
+.product-page .category-child .item .picture{position:absolute;bottom:0;right:0;top:0;left:0;margin:auto 0}
+.product-page .grid--product-page{-ms-grid-columns:1fr 4fr;grid-template-columns:1fr 4fr;border-top:1px solid #e9e9e9}
+.product-page .sort{border-top:1px solid #f0f0f0}
+.product-page .sort .sort-by-collection select{width:130px;height:36px;font-size:13px;line-height:17px;outline:0;border-radius:8px;padding:0 10px;border:1px solid #e9e9e9}
+.product-page .sort .sort-by-display .static-icons.active,.product-page .sort .sort-by-display .static-icons:hover{-webkit-filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%);filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%)}
+.product-page .filter-popup .filter-popup-btn{width:67px;height:36px;border:1px solid #e9e9e9;border-radius:8px;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}
+.product-page .filter-popup .filter-popup-btn .icon{max-width:16px}
+.product-page .popup-filter-group{background:rgba(0,0,0,.3);z-index:10000;position:fixed;top:0;left:0;right:0;bottom:0;display:none}
+.product-page .popup-filter-group .main-content{height:100%;width:85%;position:absolute;top:0;right:0;bottom:0;background:#fff}
+.product-page .popup-filter-group .item .list-holder{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
+.product-page .popup-filter-group .item .list-holder .current{color:var(--color-primary)}
+.product-page .popup-filter-group .popup-header{padding:12px 10px;-webkit-box-shadow:0 0 6px 1px #ebebeb;box-shadow:0 0 6px 1px #ebebeb}
+.product-page .popup-filter-group .popup-footer{padding:8px 10px;display:-webkit-box;display:-ms-flexbox;display:flex;text-align:center;-webkit-box-shadow:0 -1px 6px 1px #ebebeb;box-shadow:0 -1px 6px 1px #ebebeb;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end}
+.product-page .popup-filter-group .brand-item a{-webkit-box-align:center;display:-webkit-box;display:-ms-flexbox}
+.product-page .popup-filter-group .popup-footer a{font-size:14px;padding:0 5px;color:var(--color-primary);line-height:36px;border-radius:5px;margin-left:5px;border:1px solid var(--color-primary);font-weight:600}
+.product-page .popup-filter-group .brand-item .current,.product-page .popup-filter-group .popup-footer a:last-child{background:var(--color-primary);color:#fff}
+.product-page .popup-filter-group .popup-body{height:calc(100% - 55px);overflow:auto;padding:12px 10px}
+.product-page .popup-filter-group .btn-close-menu{display:inline-block;text-align:center;border:1px solid red!important;border-radius:5px;width:84px;line-height:34px;color:#fff!important;background:red!important}
+.product-page .popup-filter-group .item{margin-top:30px}
+.product-page .popup-filter-group .item .list-holder a{display:block;width:49%;color:#4a90e2;margin-bottom:10px}
+.product-page .popup-filter-group .item .list-holder .icon-square{color:#555;margin:0 5px -2px 0;display:inline-block;width:11px;height:11px;border:1px solid #666;border-radius:3px;position:relative}
+.product-page .popup-filter-group .list-holder .current .icon-square{border-color:var(--color-primary)}
+.product-page .popup-filter-group .list-holder .current .icon-square::before{content:"\f00c";font-family:FontAwesome;font-style:normal;line-height:1;font-size:11px;position:absolute;top:0;color:var(--color-primary)}
+.product-page .popup-filter-group .brand-item .title,.product-page .popup-filter-group .item .title{font-weight:700;margin-bottom:10px;text-transform:uppercase;font-size:15px}
+.product-page .popup-filter-group .brand-item a{-ms-flex-align:center;-webkit-box-align:center;align-items:center;border:1px solid #e0e0e0;border-radius:4px;color:#333;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:14px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:40px}
+.product-page .popup-filter-group .brand-item a img{max-height:30px}
+.product-page .popup-filter-group .list-holder{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
+.product-page .popup-filter-group .brand-item .list-holder{display:-ms-grid;display:grid;grid-auto-rows:minmax(-webkit-min-content,-webkit-max-content);grid-auto-rows:minmax(min-content,max-content);-ms-grid-columns:(minmax(0,1fr))[2];grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:6px;margin-bottom:10px;max-height:133px;overflow:hidden}
+.product-page .popup-filter-group label{width:50%;color:#4a90e2;margin-bottom:10px}
+.product-page .popup-filter-group label input{margin:0 5px}
+.product-page .popup-filter-group .btn-view-more-popup{font-size:14px;color:var(--color-secondary);padding:4px 0;display:block;margin:0 auto}
+.product-page .description{padding-top:16px;border-top:1px solid #e9e9e9}
+.product-detail-page .line-gray-block{width:100%;height:1px;background-color:#e9e9e9}
+.product-detail-page .product-features .box{border:1px solid #d9d9d9;border-radius:15px;overflow:hidden}
+.product-detail-page .product-features .box .title{border-bottom:2px solid var(--color-primary);padding:16px 16px 12px}
+.product-detail-page .product-features .box .item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:75px;padding:0 16px;font-size:16px}
+.product-detail-page .product-features .box .item:not(:last-child){border-bottom:1px solid #e9e9e9}
+.product-detail-page .product-support.box .title{border-bottom:1px solid #d9d9d9}
+.product-detail-page .product-support.box .item:first-child{border:0}
+.product-detail-page .product-thumbs .gallery-top{border:1px solid #d9d9d9;border-radius:15px}
+.product-detail-page .product-thumbs .gallery-thumbs .swiper-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box}
+.product-detail-page .product-thumbs .gallery-thumbs .swiper-slide{border:1px solid #d9d9d9;border-radius:10px}
+.product-detail-page .product-thumbs .gallery-thumbs .swiper-slide-thumb-active{border-color:var(--color-primary)}
+.product-detail-page .product-info .pro-name{font-size:18px;line-height:26px;font-weight:600;text-transform:uppercase}
+.product-detail-page .product-info .pro-price-sale{font-weight:700;font-size:24px;line-height:24px;color:var(--color-primary)}
+.product-detail-page .product-info .pro-price-stock{font-size:14px;line-height:24px}
+.product-detail-page .product-info .pro-price-sale-off{font-size:13px;font-weight:600;line-height:24px;border-radius:8px;padding:2px 6px;background-color:var(--red);color:#fff}
+.product-detail-page .product-info .pro-status{color:#099268;font-weight:500}
+.product-detail-page .product-info .pro-status .static-icons{background-size:444.75px 354px;width:19px;height:19px;background-position:-4.5px -145.5px}
+.product-detail-page .product-info .pro-special-offer{position:relative;margin-top:36px}
+.product-detail-page .product-info .pro-special-offer .title{position:absolute;top:-18px;left:18px;height:36px;color:#fff;background-color:var(--red);border-radius:21px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;padding:0 16px}
+.product-detail-page .product-info .pro-special-offer .list-w{padding:24px 12px 12px 32px;border:1px solid var(--red);border-radius:15px;line-height:26px}
+.product-detail-page .section-product .pro-cart .pro-cart-quantity{max-width:60px;width:100%;height:52px;background:#f0f0f0;border-radius:5px;outline:0;border:0;padding:12px 18px;font-size:16px;font-weight:700}
+.product-detail-page .section-product .pro-cart .pro-cart-btn{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;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;height:52px;border-radius:8px;color:#fff;background-color:var(--color-primary);border:1px solid var(--color-primary)}
+.product-detail-page .section-product .pro-cart .pro-cart-btn.buy-now:hover{color:var(--color-primary);background-color:#fff}
+.product-detail-page .section-product .pro-cart .pro-cart-btn.installment{background:#0085ff;border-color:#0085ff}
+.product-detail-page .section-product .pro-cart .pro-cart-btn.installment:hover{color:#0085ff;background-color:#fff}
+.product-detail-page .section-product .pro-deal{background-color:var(--red);border-radius:10px;padding:8px}
+.product-detail-page .section-product .pro-deal .global-deal-time-countdown{color:var(--red);background-color:#fff;border-radius:10px;font-size:20px;line-height:24px;padding:6px 8px}
+.product-detail-page .section-product .pro-deal .deal-line.total{background:#fff;opacity:1}
+.product-detail-page .section-product .pro-deal .deal-line.remaining{background:-o-repeating-linear-gradient(left,#e89900 0,#ffc806 50%,#e89900 100%);background:repeating-linear-gradient(to right,#e89900 0,#ffc806 50%,#e89900 100%)}
+.product-detail-page .section-product .pro-deal .p-quantity-deal{color:#fff;font-weight:400}
+.product-detail-page .section-product .pro-deal .p-quantity-deal .deal-quantity{color:#fff}
+.product-detail-page .section-product-attr .attr-list-name .list{white-space:nowrap;overflow:auto}
+.product-detail-page .section-product-attr .attr-list-name .item{position:relative;font-weight:700;font-size:20px;line-height:24px;color:#b9b9b9;cursor:pointer}
+.product-detail-page .section-product-attr .attr-list-name .title{font-size:inherit;line-height:inherit}
+.product-detail-page .section-product-attr .attr-list-name .item:not(:first-child)::before{content:"/";position:absolute;top:0;left:-15px}
+.product-detail-page .section-product-attr .attr-list-name .title.active,.product-detail-page .section-product-attr .attr-list-name .title:hover{color:#000}
+.product-detail-page .section-product-attr .pro-spec table{width:100%;border-collapse:collapse}
+.product-detail-page .section-product-attr .pro-spec table tr:nth-child(odd){background:#f0f0f0}
+.product-detail-page .section-product-attr .pro-spec table td:nth-child(odd),.product-detail-page .section-product-attr .pro-spec table th:nth-child(odd){font-weight:700;width:30%}
+.product-detail-page .section-product-attr .pro-spec table td,.product-detail-page .section-product-attr .pro-spec table th{padding:10px;text-align:left}
+.cart-page .form-input{font-size:13px;line-height:18px;width:100%;background:#f5f5f5;border-radius:8px;border:0;outline-color:var(--color-secondary);padding:11px 12px;margin-bottom:10px}
+.cart-page .form-btn{width:100%;height:40px;border-radius:8px;font-weight:700;font-size:13px;line-height:17px;text-align:center;text-transform:uppercase;color:#fff;border:0;cursor:pointer}
+.cart-page .line-blue-block{height:4px;width:100%;background-color:var(--color-secondary)}
+.c-item{padding:12px;border-bottom:1px solid #ddd;font-size:18px;line-height:24px}
+.c-item .c-img{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:158px}
+.c-item .c-delete:hover{cursor:pointer;-webkit-filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%);filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%)}
+.c-item .c-info{font-size:13px;line-height:24px}
+.c-item .c-quantity{max-width:72px;width:100%;height:40px;background:#f0f0f0;border-radius:5px;outline:0;border:0;padding:12px 20px;font-size:16px;font-weight:700;text-align:center;margin-left:8px}
+.cart-page .section-product{border:1px solid var(--color-secondary);padding-bottom:28px}
+.cart-page .section-product .title{padding:19px 0}
+.cart-page .section-product .voucher{padding-top:16px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px}
+.cart-page .section-product .voucher .voucher-input{padding:11px 12px;max-width:372px;font-size:13px;line-height:18px;margin-bottom:0}
+.cart-page .section-product .voucher .voucher-btn{max-width:110px}
+.cart-page .section-login .title{background-color:#f5f5f5;padding:16px}
+.cart-page .section-login .login-btn{max-width:190px;font-size:16px}
+.cart-page .customer .customer-form textarea{max-height:114px;resize:none}
+.cart-page .col-right .list-radio .item:not(:last-child){margin-bottom:16px}
+.cart-page .col-right .list-radio .item label{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex}
+.cart-page .col-right .list-radio .item label:before{content:"";display:inline-block;position:relative;top:0;margin:0 5px 0 0;width:14px;height:14px;border-radius:50%;border:1px solid var(--color-primary);background-color:transparent}
+.cart-page .col-right .list-radio .item input[type=radio]:checked+label:after{content:"";border-radius:50%;width:9px;height:9px;position:absolute;top:2.5px;left:2.5px;display:block;background:var(--color-primary)}
+.cart-page .col-right .cart-send{border:1px solid #ddd}
+.cart-page .col-right .cart-send .cart-send-item{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;font-size:13px;line-height:40px;padding:0 20px}
+.cart-page .col-right .cart-send .cart-send-item:not(:last-child){border-bottom:1px solid #e9e9e9}
+.cart-page .col-right .cart-send-submit-btn{font-size:16px}
+.global-footer .global-logo{margin-left:unset;max-width:230px}
+.global-footer .col-title{font-size:16px;line-height:20px;font-weight:600;padding:10px;margin-left:-10px;margin-right:-10px;border-top:1px solid #e9e9e9}
+.global-footer .col-list{line-height:32px}
+.global-footer a:hover{color:var(--color-primary)}
+.global-footer .footer-top{background-color:var(--color-primary)}
+.global-footer .newsletter .newsletter-input{width:100%;height:36px;border:0;border-radius:10px;padding-left:12px;outline:0;font-size:13px;line-height:17px}
+.global-footer .newsletter .newsletter-btn{width:70px;height:36px;color:#fff;background-color:var(--color-secondary);font-size:13px;line-height:17px;font-weight:600;text-transform:uppercase;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;border-radius:0 10px 10px 0;border:0;position:absolute;top:0;right:0;cursor:pointer}
+.global-footer .newsletter .newsletter-btn::after{content:"";position:absolute;top:50%;left:-9px;width:10px;height:10px;-webkit-transform:rotate(45deg) translateY(-50%);-ms-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%);background-color:var(--color-secondary)}
+.global-footer .copy-right{background-color:#f5f5f5;color:#555}
+.global-footer .accordion-content{max-height:0;-webkit-transition:max-height .3s ease-out;-o-transition:max-height .3s ease-out;transition:max-height .3s ease-out;overflow:hidden}

demo-audio-3/css/style_pc.css

@@ -0,0 +1,284 @@
+:root{--color-primary:#ff9d06;--color-secondary:#041e42;--white:#fff;--black:#000;--red:#e80000;--gray:#b7b7b7;--gray-2:#d9d9d9;--box-shadow:0px 1px 6px rgba(0, 0, 0, 0.2)}
+*,::after,::before{padding:0;margin:0;-webkit-box-sizing:inherit;box-sizing:inherit}
+html{font-size:16px}
+body{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Inter,sans-serif;color:#000;min-width:1220px;word-break:break-word;line-height:1.3;font-weight:400;background-color:#fff}
+input[type=number]::-webkit-inner-spin-button{opacity:1}
+@-webkit-keyframes gradient-bg-antimation{
+0%{background-position:0 0}
+100%{background-position:-200% 0}
+}
+@keyframes gradient-bg-antimation{
+0%{background-position:0 0}
+100%{background-position:-200% 0}
+}
+.container{max-width:1620px;width:100%;padding:0 10px;margin:0 auto}
+.box-w{border-radius:15px;background-color:#fff;padding:12px}
+.border-none{border:0!important}
+.box-empty{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;font-size:24px;line-height:28px;width:100%;height:430px;color:red}
+.alert-mess{text-align:center;padding:50px 30px;font-size:20px;font-weight:500;color:red}
+.static-html{max-height:500px;overflow:hidden;-webkit-transition:.8s;-o-transition:.8s;transition:.8s;position:relative}
+.static-html.blur:after{content:"";position:absolute;left:0;right:0;bottom:0;height:100px;background:-o-linear-gradient(transparent,#fff);background:-webkit-gradient(linear,left top,left bottom,from(transparent),to(#fff));background:linear-gradient(transparent,#fff)}
+.static-html iframe{display:block;margin:0 auto}
+.paging{padding:0 10px 32px;margin-top:56px;text-align:center}
+.paging-link.active,.paging-link:hover{color:#fff;background:var(--color-primary);font-weight:500}
+.paging-link{display:-webkit-inline-box!important;display:-ms-inline-flexbox!important;display:inline-flex!important;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:8px;border-radius:5px;color:#000;font-size:20px;line-height:21px;text-decoration:none;text-transform:capitalize;width:40px;height:40px}
+.routing .list{display:-webkit-box;display:-ms-flexbox;display:flex;padding:16px 0;margin-bottom:16px;border-bottom:1px solid #e9e9e9;list-style:none;text-transform:uppercase}
+.routing .routing-link{position:relative;font-size:14px;font-weight:400;padding:0 10px;text-decoration:none}
+.routing .routing-link:first-child{padding-left:0}
+.routing .routing-link:last-child{color:var(--color-primary);max-width:700px;overflow:hidden;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}
+.routing .routing-link:not(:last-child)::before{content:"";position:absolute;top:50%;right:0;-webkit-transform:translateY(-50%) rotate(25deg);-ms-transform:translateY(-50%) rotate(25deg);transform:translateY(-50%) rotate(25deg);width:1px;height:80%;border-right:1px solid #000}
+.success-form{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;background:rgba(0,0,0,.5);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}
+.success-form .cart-success{width:500px;height:300px;background:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:fixed}
+.success-form .success-form-svg{display:block;height:80px;width:80px;color:var(--color-primary)}
+.success-form .text-cart-success{font-size:24px;font-weight:600;line-height:1.6;padding-top:30px}
+.header-cart:hover .cart-ttip{display:block}
+.cart-ttip{display:none;position:absolute;background-color:#fff;border-radius:10px;width:400px;height:auto;right:0;top:40px;z-index:3;-webkit-box-shadow:0 1px 6px rgb(0 0 0 / 25%);box-shadow:0 1px 6px rgb(0 0 0 / 25%)}
+.cart-ttip .cart-ttip-price-button{border-radius:5px;padding:10px;background:var(--color-primary);text-align:center;margin:0 12px 12px}
+.cart-ttip .cart-ttip-item-container{max-height:300px;overflow:auto}
+.cart-ttip .cart-ttip-item-container .compare-item{height:auto;margin:0;max-width:unset;-webkit-box-shadow:none;box-shadow:none}
+.cart-ttip .cart-ttip .header-null-cart{width:100%!important;text-align:center;padding:30px;color:#000;font-weight:600}
+.cart-ttip .header-cart-item-price{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;margin-top:10px}
+.cart-ttip .cart-ttip-price,.compare-item,.header-nav-menu a{display:-webkit-box;display:-ms-flexbox}
+.cart-ttip .header-cart-item-price p{font-weight:700;width:auto}
+.cart-ttip .cart-ttip-price{padding:10px 20px 10px 10px;border-top:3px solid var(--color-primary);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end!important;-ms-flex-pack:end!important;justify-content:flex-end!important;gap:6px;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}
+.cart-ttip .cart-ttip-price p{color:#000;width:auto;padding:0;margin:0}
+.cart-ttip .cart-ttip-price p:first-child{font-size:15px;font-weight:700;text-transform:uppercase;-webkit-transform:translateY(2px);-ms-transform:translateY(2px);transform:translateY(2px)}
+.cart-ttip .cart-ttip-price p:nth-child(2){font-size:13px;font-weight:200;color:var(--color-primary);margin-left:0!important}
+.cart-ttip .cart-ttip-price p:last-child{font-size:15px;font-weight:700}
+.cart-ttip .compare-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;-webkit-box-shadow:0 1px 8px rgb(0 0 0 / 25%);box-shadow:0 1px 8px rgb(0 0 0 / 25%);padding:10px;border-radius:10px;max-width:360px;background:#fff}
+.cart-ttip .compare-item img{width:80px;border:5px}
+.cart-ttip .compare-item .compare-item-text{display:inline-block;padding:0 10px;-webkit-box-flex:1;-ms-flex:1;flex:1}
+.cart-ttip .compare-item .compare-item-text p{background:0 0;color:#000;padding:0;width:100%;word-break:break-word;font-size:14px;line-height:20px;margin-left:0;height:40px}
+.cart-ttip .header-null-cart{width:100%;text-align:center;padding:24px;color:#000;font-size:14px;font-weight:600}
+.scroll-top-btn{display:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:24px;width:55px;height:55px;position:fixed;bottom:100px;right:20px;background:var(--color-primary);border-radius:50%;z-index:999;-webkit-box-shadow:0 1px 5px rgb(0 0 0 / 20%);box-shadow:0 1px 5px rgb(0 0 0 / 20%);color:#fff}
+.view-more-content-btn{display:block;text-align:center;margin:20px 0;font-size:16px;line-height:20px;font-weight:600;color:var(--color-secondary)}
+.static-icons{background-image:url(/images/static-icons-map.png);background-repeat:no-repeat;display:inline-block;background-size:296.5px 236px}
+.static-icon-5-stars{width:96px;height:15px;background-position:-3px -3px}
+.static-icon-customer-avatar{width:30px;height:30px;background-position:-104px -3px}
+.static-icon-feature-cart{width:45px;height:27px;background-position:-139px -3px}
+.static-icon-feature-delivery{width:52px;height:52px;background-position:-3px -35px}
+.static-icon-feature-fly-gift{width:23px;height:38px;background-position:-60px -35px}
+.static-icon-feature-mail{width:33px;height:26px;background-position:-139px -35px}
+.static-icon-feature-money-pig{width:35px;height:35px;background-position:-88px -66px}
+.static-icon-feature-phone{width:31px;height:32px;background-position:-177px -35px}
+.static-icon-feature-reward{width:42px;height:42px;background-position:-128px -72px}
+.static-icon-feature-support{width:42px;height:42px;background-position:-3px -119px}
+.static-icon-feature-support-2{width:42px;height:42px;background-position:-50px -119px}
+.static-icon-filter-mb{width:21px;height:20px;background-position:-175px -72px}
+.static-icon-gift{width:18px;height:18px;background-position:-189px -3px}
+.static-icon-gray-close{width:31px;height:31px;background-position:-174px -96px}
+.static-icon-gray-close-mb{width:21px;height:21px;background-position:-96px -131px}
+.static-icon-green-box{width:13px;height:13px;background-position:-3px -97px}
+.static-icon-grid-style{width:22px;height:23px;background-position:-122px -131px}
+.static-icon-header-cart{width:35px;height:39px;background-position:-149px -132px}
+.static-icon-header-cart-mb{width:29px;height:32px;background-position:-3px -176px}
+.static-icon-header-user{width:40px;height:40px;background-position:-212px -3px}
+.static-icon-list-style{width:25px;height:23px;background-position:-212px -46px}
+.static-icon-location{width:14px;height:15px;background-position:-87px -46px}
+.static-icon-menu{width:30px;height:23px;background-position:-210px -74px}
+.static-icon-menu-mb{width:30px;height:23px;background-position:-210px -102px}
+.static-icon-phone-shake{width:14px;height:14px;background-position:-105px -47px}
+.static-icon-sale-fire{width:22px;height:26px;background-position:-210px -130px}
+.static-icon-social-fb{width:15px;height:28px;background-position:-237px -130px}
+.static-icon-social-fb-logo{width:38px;height:38px;background-position:-97px -161px}
+.static-icon-social-gg-news{width:28px;height:28px;background-position:-189px -161px}
+.static-icon-social-instagram{width:28px;height:28px;background-position:-221px -163px}
+.static-icon-social-instagram-logo{width:38px;height:38px;background-position:-37px -196px}
+.static-icon-social-twitter{width:33px;height:26px;background-position:-140px -196px}
+.static-icon-social-youtube{width:37px;height:26px;background-position:-177px -196px}
+.static-icon-social-youtube-logo{width:38px;height:38px;background-position:-256px -3px}
+.global-logo{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:230px;margin-left:auto}
+.global-socials{display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[5];grid-template-columns:repeat(5,1fr)}
+.global-socials .item .link{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;height:100%;border-left:1px solid #fff;border-top:1px solid transparent;border-bottom:1px solid transparent}
+.global-socials .item .link:hover{background-color:#fff;border-color:var(--color-primary)}
+.global-socials .item .link:hover i{-webkit-filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%);filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%)}
+.global-socials .item:last-child{border-right:1px solid #fff}
+.section-deal .line-block{width:100%;height:2px;background-color:var(--red)}
+.section-deal .global-deal-time-countdown{padding:10px 22px;background-color:red;border-radius:12px;font-size:24px;line-height:30px;font-weight:600;color:#fff}
+.p-item{min-width:0}
+.p-item .p-thumbs{position:relative;border:1px solid var(--gray-2);border-radius:15px;overflow:hidden}
+.p-item .p-thumbs .p-image{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;padding-bottom:100%}
+.p-item .p-thumbs .p-image img{position:absolute;bottom:0;right:0;top:0;left:0;margin:auto 0}
+.p-item .p-thumbs .swiper-pagination{width:unset;left:12px}
+.p-item .p-thumbs .swiper-pagination-bullet{width:10px;height:10px}
+.p-item .p-thumbs .swiper-pagination-bullet-active{background-color:var(--color-primary)}
+.p-item .p-price-sale-off{position:absolute;top:16px;left:16px;padding:9px;background-color:var(--red);color:#fff;font-size:15px;line-height:18px;border-radius:8px;z-index:9}
+.p-item .p-name{font-weight:500;font-size:16px;line-height:19px}
+.p-item .p-price-sale{font-size:20px;line-height:24px;font-weight:700;color:var(--color-primary)}
+.p-item .p-price-stock{font-size:16px;line-height:24px;font-weight:500;color:#b7b7b7}
+.p-item .p-quantity{font-size:13px;line-height:12px;font-weight:500;color:#099268;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:4px}
+.p-item .p-quantity-deal{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;color:var(--gray)}
+.p-item .p-quantity-deal .deal-quantity{color:#000}
+.p-item .p-wrapper-deal{height:10px;width:100%}
+.p-item .p-wrapper-deal .deal-line{position:absolute;top:0;left:0;bottom:0;width:100%;border-radius:5px;background:-o-linear-gradient(right,var(--color-primary) 0,var(--red) 100%);background:-webkit-gradient(linear,right top,left top,color-stop(0,var(--color-primary)),to(var(--red)));background:-o-linear-gradient(right,var(--color-primary) 0,var(--red) 100%);background:linear-gradient(270deg,var(--color-primary) 0,var(--red) 100%)}
+.p-item .p-wrapper-deal .deal-line.total{opacity:.3}
+.p-item .p-wrapper-deal .deal-line.remaining{background:-o-repeating-linear-gradient(left,var(--color-primary) 0,var(--red) 50%,var(--color-primary) 100%);background:repeating-linear-gradient(to right,var(--color-primary) 0,var(--red) 50%,var(--color-primary) 100%);background-size:200% auto;background-position:0 100%;-webkit-animation:2s linear infinite forwards gradient-bg-antimation;animation:2s linear infinite forwards gradient-bg-antimation}
+.global-header .header-top{height:124px;padding-top:16px}
+.global-header .header-search{margin-left:52px}
+.global-header .search-bar{position:relative;max-width:874px;height:52px;margin:0 auto;margin-top:12px}
+.global-header .search-bar .search-bar-input{width:100%;height:52px;border:1px solid var(--color-secondary);border-radius:10px;padding-left:18px;outline-color:#041a38;font-size:16px;line-height:20px}
+.global-header .search-bar .search-bar-btn{width:110px;height:52px;color:#fff;background-color:var(--color-secondary);font-size:16px;line-height:20px;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;border-radius:0 10px 10px 0;border:0;position:absolute;top:0;right:0;cursor:pointer}
+.global-header .search-bar .search-bar-btn::after{content:"";position:absolute;top:50%;left:-9px;width:10px;height:10px;-webkit-transform:rotate(45deg) translateY(-50%);-ms-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%);background-color:var(--color-secondary)}
+.global-header .header-func{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:14px;color:#888;font-weight:600}
+.global-header .header-cart .header-cart-amount{width:26px;height:26px;background-color:var(--color-primary);border-radius:50%;position:absolute;top:-13px;right:-10px;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;font-size:14px;font-weight:700;font-style:normal;color:#000}
+.global-header .header-bottom{background-color:var(--color-primary)}
+.global-header .header-navbar{position:relative}
+.global-header .header-navbar-list{position:absolute;top:100%;left:0;right:0;background-color:#fff;font-size:15px;line-height:32px;padding:8px 12px;-webkit-box-shadow:0 1px 8px rgba(0,0,0,.15);box-shadow:0 1px 8px rgba(0,0,0,.15);z-index:999}
+.global-header .header-navbar-list .item .image{width:30px;height:30px}
+.global-header .header-navbar .header-navbar-menu{width:308px;height:60px;font-size:22px;line-height:26px;font-weight:600;text-transform:uppercase;color:#fff;background-color:var(--color-secondary);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;gap:8px;cursor:pointer}
+.homepage .section-hero{background-color:#12051f}
+.homepage .section-hero .swiper-section-hero{margin-left:308px}
+.homepage .section-hero .section-hero-features{display:-ms-grid;display:grid;-ms-grid-rows:(1fr)[3];grid-template-rows:repeat(3,1fr);height:100%;background-color:#fff}
+.homepage .section-hero .section-hero-features .item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:36px;text-align:center;gap:16px;border-bottom:1px solid var(--gray-2)}
+.homepage .section-category .heading{background-color:#e9e9e9;border-radius:8px}
+.homepage .section-category .heading .title{padding:15px 20px;font-size:24px;line-height:32px;background-color:var(--color-primary);color:#fff;display:inline-block;border-radius:8px 0 0 8px;position:relative}
+.homepage .section-category .heading .title::after{content:"";position:absolute;top:50%;right:-2px;width:15px;height:15px;-webkit-transform:rotate(45deg) translateY(-50%);-ms-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%);background-color:var(--color-primary)}
+.homepage .section-category .content .banner{border-radius:15px;overflow:hidden}
+.homepage .section-category .product-best-seller{background:#fff;border:1px solid var(--gray-2);border-radius:15px;overflow:hidden}
+.homepage .section-category .product-best-seller .header{background:#e9e9e9;border-bottom:1px solid var(--gray-2);border-radius:15px 15px 0 0;font-size:20px;line-height:24px;font-weight:700;text-transform:uppercase;text-align:center;padding:22px 0 18px}
+.homepage .section-category .product-best-seller .p-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px}
+.homepage .section-category .product-best-seller .item:not(:last-child){margin-bottom:38px}
+.homepage .section-category .product-best-seller .p-thumbs{max-width:148px;width:100%;height:-webkit-max-content;height:-moz-max-content;height:max-content}
+.homepage .section-category .product-best-seller .p-name{font-size:14px;line-height:18px;margin-top:0!important}
+.homepage .section-category .product-best-seller .p-price-sale{font-size:18px;line-height:18px}
+.homepage .section-category .product-best-seller .p-price-stock{font-size:14px;line-height:14px}
+.homepage .section-category .product-best-seller .p-quantity{margin:8px 0 0!important}
+.homepage .section-category .product-best-seller .p-price-sale-off{font-size:13px;line-height:14px;padding:6px;top:10px;left:10px}
+.homepage .section-customer{background-color:#f5f5f5;margin-bottom:-24px}
+.homepage .section-customer .heading{position:relative;font-size:32px;line-height:38px;font-weight:600;text-align:center;padding:55px 0}
+.homepage .section-customer .heading::after{content:"";position:absolute;top:72%;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);max-width:254px;width:100%;height:2px;background-color:#888}
+.homepage .section-customer .item{position:relative;padding-bottom:92px}
+.homepage .section-customer .item .bg-image{border-radius:15px;overflow:hidden;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.2);box-shadow:0 1px 5px rgba(0,0,0,.2)}
+.homepage .section-customer .item .content{position:absolute;bottom:0;left:16px;right:16px;background:#fff;-webkit-box-shadow:0 1px 6px rgba(0,0,0,.25);box-shadow:0 1px 6px rgba(0,0,0,.25);border-radius:15px;padding:16px}
+.homepage .section-customer .item .line-block{width:100%;height:1px;background-color:var(--gray-2)}
+.product-page .category-child .list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:80px;padding:0 50px}
+.product-page .category-child .list .list-item{max-width:150px;width:100%}
+.product-page .category-child .item .image{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;padding-bottom:100%}
+.product-page .category-child .item .picture{position:absolute;bottom:0;right:0;top:0;left:0;margin:auto 0}
+.product-page .grid--product-page{-ms-grid-columns:1fr 4fr;grid-template-columns:1fr 4fr;border-top:1px solid #e9e9e9}
+.product-page .sort{border-bottom:1px solid #f0f0f0}
+.product-page .sort .sort-by-collection select{width:156px;height:42px;font-size:16px;line-height:20px;outline:0;border-radius:8px;padding:0 10px;border:1px solid #e9e9e9}
+.product-page .sort .sort-by-display .static-icons.active,.product-page .sort .sort-by-display .static-icons:hover{-webkit-filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%);filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%)}
+.product-page .filter{border:1px solid #e9e9e9;border-radius:12px;padding:16px 8px}
+.product-page .filter .filter-item{border-top:1px solid #e9e9e9;padding-top:12px}
+.product-page .filter .filter-item .list .check-box{display:inline-block;width:16px;height:16px;background-color:#e9e9e9;border-radius:3px}
+.product-page .description{padding-top:16px;border-top:1px solid #e9e9e9}
+.product-detail-page .line-gray-block{width:100%;height:1px;background-color:#e9e9e9}
+.product-detail-page .product-features .box{border:1px solid #d9d9d9;border-radius:15px;overflow:hidden}
+.product-detail-page .product-features .box .title{border-bottom:2px solid var(--color-primary);padding:16px 16px 12px}
+.product-detail-page .product-features .box .item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:75px;padding:0 16px}
+.product-detail-page .product-features .box .item:not(:last-child){border-bottom:1px solid #e9e9e9}
+.product-detail-page .product-support.box .title{border-bottom:1px solid #d9d9d9}
+.product-detail-page .product-support.box .item:first-child{border:0}
+.product-detail-page .product-thumbs .gallery-top{border:1px solid #d9d9d9;border-radius:15px}
+.product-detail-page .product-thumbs .gallery-thumbs .swiper-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box}
+.product-detail-page .product-thumbs .gallery-thumbs .swiper-slide{border:1px solid #d9d9d9;border-radius:10px}
+.product-detail-page .product-thumbs .gallery-thumbs .swiper-slide-thumb-active{border-color:var(--color-primary)}
+.product-detail-page .product-info .pro-name{font-size:24px;line-height:32px;font-weight:600;text-transform:uppercase}
+.product-detail-page .product-info .pro-price-sale{font-weight:700;font-size:26px;line-height:24px;color:var(--color-primary)}
+.product-detail-page .product-info .pro-price-stock{font-size:16px;line-height:24px}
+.product-detail-page .product-info .pro-price-sale-off{font-size:15px;font-weight:600;line-height:24px;border-radius:8px;padding:6px;background-color:var(--red);color:#fff}
+.product-detail-page .product-info .pro-status{color:#099268;font-weight:500}
+.product-detail-page .product-info .pro-status .static-icons{background-size:444.75px 354px;width:18.5px;height:18.5px;background-position:-4.5px -145.5px}
+.product-detail-page .product-info .pro-special-offer{position:relative;margin-top:36px}
+.product-detail-page .product-info .pro-special-offer .title{position:absolute;top:-21px;left:28px;height:42px;color:#fff;background-color:var(--red);border-radius:21px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;padding:0 16px}
+.product-detail-page .product-info .pro-special-offer .list-w{padding:30px 15px 15px 40px;border:1px solid var(--red);border-radius:20px;line-height:28px}
+.product-detail-page .section-product .pro-cart .pro-cart-quantity{max-width:72px;width:100%;height:52px;background:#f0f0f0;border-radius:5px;outline:0;border:0;padding:12px 18px;font-size:16px;font-weight:700}
+.product-detail-page .section-product .pro-cart .pro-cart-btn{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;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;height:52px;border-radius:8px;color:#fff;background-color:var(--color-primary);border:1px solid var(--color-primary)}
+.product-detail-page .section-product .pro-cart .pro-cart-btn.buy-now:hover{color:var(--color-primary);background-color:#fff}
+.product-detail-page .section-product .pro-cart .pro-cart-btn.installment{background:#0085ff;border-color:#0085ff}
+.product-detail-page .section-product .pro-cart .pro-cart-btn.installment:hover{color:#0085ff;background-color:#fff}
+.product-detail-page .section-product .pro-deal{background-color:var(--red);border-radius:10px;padding:8px}
+.product-detail-page .section-product .pro-deal .global-deal-time-countdown{color:var(--red);background-color:#fff;border-radius:10px;font-size:20px;line-height:24px;padding:7px 8px}
+.product-detail-page .section-product .pro-deal .deal-line.total{background:#fff;opacity:1}
+.product-detail-page .section-product .pro-deal .deal-line.remaining{background:-o-repeating-linear-gradient(left,#e89900 0,#ffc806 50%,#e89900 100%);background:repeating-linear-gradient(to right,#e89900 0,#ffc806 50%,#e89900 100%)}
+.product-detail-page .section-product .pro-deal .p-quantity-deal{color:#fff;font-weight:400}
+.product-detail-page .section-product .pro-deal .p-quantity-deal .deal-quantity{color:#fff}
+.product-detail-page .section-product-attr .attr-list-name .item{position:relative;font-weight:700;font-size:24px;line-height:29px;color:#b9b9b9;cursor:pointer}
+.product-detail-page .section-product-attr .attr-list-name .title{font-size:inherit;line-height:inherit}
+.product-detail-page .section-product-attr .attr-list-name .item:not(:first-child)::before{content:"/";position:absolute;top:0;left:-20px}
+.product-detail-page .section-product-attr .attr-list-name .title.active,.product-detail-page .section-product-attr .attr-list-name .title:hover{color:#000}
+.product-detail-page .section-product-attr .pro-spec table{width:100%;border-collapse:collapse}
+.product-detail-page .section-product-attr .pro-spec table tr:nth-child(odd){background:#f0f0f0}
+.product-detail-page .section-product-attr .pro-spec table td:nth-child(odd),.product-detail-page .section-product-attr .pro-spec table th:nth-child(odd){font-weight:700;width:30%}
+.product-detail-page .section-product-attr .pro-spec table td,.product-detail-page .section-product-attr .pro-spec table th{padding:10px;text-align:left}
+.cart-page .form-input{font-size:16px;line-height:20px;width:100%;background:#f5f5f5;border-radius:8px;border:0;outline-color:var(--color-secondary);padding:13px 12px;margin-bottom:16px}
+.cart-page .form-btn{width:100%;height:52px;border-radius:8px;font-weight:700;font-size:18px;line-height:23px;text-align:center;text-transform:uppercase;color:#fff;border:0;cursor:pointer}
+.cart-page .line-blue-block{height:4px;width:100%;background-color:var(--color-secondary)}
+.c-item{padding:16px 0;border-bottom:1px solid #ddd;font-size:18px;line-height:24px}
+.c-item .c-img{max-width:158px}
+.c-item .c-delete:hover{cursor:pointer;-webkit-filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%);filter:invert(30%) sepia(57%) saturate(2610%) hue-rotate(352deg) brightness(101%) contrast(106%)}
+.c-item .c-name{font-size:inherit;line-height:inherit}
+.c-item .c-quantity{max-width:80px;width:100%;height:52px;background:#f0f0f0;border-radius:5px;outline:0;border:0;padding:12px 20px;font-size:16px;font-weight:700}
+.cart-page .section-product{border:1px solid var(--color-secondary);padding-bottom:28px}
+.cart-page .section-product .title{padding:19px 0}
+.cart-page .section-product .voucher{padding-top:16px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
+.cart-page .section-product .voucher .voucher-input{padding:14px 12px;max-width:372px;margin:0 16px;font-size:18px;line-height:24px}
+.cart-page .section-product .voucher .voucher-btn{max-width:168px}
+.cart-page .section-login .title{background-color:#f5f5f5;padding:22px 16px}
+.cart-page .section-login .login-btn{max-width:253px}
+.cart-page .customer .customer-form textarea{max-height:114px;resize:none}
+.cart-page .col-right .list-radio .item:not(:last-child){margin-bottom:16px}
+.cart-page .col-right .list-radio .item label{position:relative;display:block}
+.cart-page .col-right .list-radio .item label:before{content:"";display:inline-block;position:relative;top:0;margin:0 5px 0 0;width:13px;height:13px;border-radius:50%;border:1px solid var(--color-primary);background-color:transparent}
+.cart-page .col-right .list-radio .item input[type=radio]:checked+label:after{content:"";border-radius:50%;width:9px;height:9px;position:absolute;top:5px;left:2.5px;display:block;background:var(--color-primary)}
+.cart-page .col-right .cart-send{border:1px solid #ddd}
+.cart-page .col-right .cart-send .cart-send-item{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;font-size:16px;line-height:60px;padding:0 20px}
+.cart-page .col-right .cart-send .cart-send-item:not(:last-child){border-bottom:1px solid #e9e9e9}
+.cart-page .col-right .cart-send-submit-btn{max-width:372px}
+.global-footer .global-logo{margin-left:unset}
+.global-footer .col-title{font-size:16px;line-height:20px;font-weight:600;margin-bottom:12px}
+.global-footer .col-list{line-height:32px}
+.global-footer a:hover{color:var(--color-primary)}
+.global-footer .footer-top{background-color:var(--color-primary)}
+.global-footer .footer-top .row{height:60px}
+.global-footer .newsletter .newsletter-input{width:100%;height:42px;border:0;border-radius:10px;padding-left:18px;outline:0;font-size:16px;line-height:20px}
+.global-footer .newsletter .newsletter-btn{width:110px;height:42px;color:#fff;background-color:var(--color-secondary);font-size:16px;line-height:20px;font-weight:600;text-transform:uppercase;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;border-radius:0 10px 10px 0;border:0;position:absolute;top:0;right:0;cursor:pointer}
+.global-footer .newsletter .newsletter-btn::after{content:"";position:absolute;top:50%;left:-9px;width:10px;height:10px;-webkit-transform:rotate(45deg) translateY(-50%);-ms-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%);background-color:var(--color-secondary)}
+.global-footer .copy-right{background-color:#f5f5f5;color:#555}
+@media (max-width:1600px){
+html{font-size:14px}
+.container{max-width:1220px}
+.grid{gap:12px}
+.grid--5-cols{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}
+.row{margin-right:-6px;margin-left:-6px}
+.no-gutters{margin-right:0;margin-left:0}
+.col,.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-auto,.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{padding-left:6px;padding-right:6px}
+.routing .list{padding:12px 0}
+.global-header .header-navbar .header-navbar-menu{font-size:18px;line-height:24px;height:52px;width:280px}
+.global-header .header-routing .list{font-size:16px;line-height:20px}
+.global-footer .footer-top .row{height:52px}
+.global-footer .footer-top .row .text-20{font-size:16px;line-height:20px}
+.section-deal .heading .text-32{font-size:28px;line-height:32px}
+.section-deal .global-deal-time-countdown{font-size:20px;line-height:24px}
+.homepage .section-hero .swiper-section-hero{margin-left:280px}
+.homepage .section-hero .section-hero-features .item{font-size:13px;padding:15px}
+.homepage .section-category .heading .title{line-height:26px}
+.homepage .section-category .product-best-seller .list{padding:16px 12px!important}
+.homepage .section-category .product-best-seller .p-item{gap:8px}
+.homepage .section-category .product-best-seller .p-thumbs{max-width:120px}
+.homepage .section-category .product-best-seller .p-price-sale{font-size:16px;line-height:16px}
+.homepage .section-category .product-best-seller .p-rating{margin:8px 0!important}
+.homepage .section-category .product-best-seller .p-rating i{width:64px;height:11px;background-position:-1.5px -1.5px;background-size:198px 157px}
+.homepage .section-category .product-best-seller .p-rating span{display:none}
+.product-page .filter .title{font-size:18px}
+.product-page .product-list{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}
+.product-detail-page .product-features .box .title{font-size:16px;line-height:20px}
+.product-detail-page .product-features .box .item{height:60px}
+.product-detail-page .product-info .pro-name{font-size:20px;line-height:24px}
+.product-detail-page .product-info .pro-sub-info{font-size:13px;gap:0;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
+.product-detail-page .product-info .pro-price-sale{font-size:24px}
+.product-detail-page .product-info .pro-price-sale-off,.product-detail-page .product-info .pro-price-stock{font-size:14px}
+.product-detail-page .section-product .pro-deal{padding:4px 8px}
+.product-detail-page .section-product .global-deal-time-countdown{font-size:16px;line-height:20px}
+.product-detail-page .section-product .pro-deal-time-left .title{font-size:13px}
+.product-detail-page .section-product .pro-deal-quantity{margin-left:20px!important}
+.product-detail-page .section-product .pro-cart .pro-cart-btn b{font-size:16px}
+.product-detail-page .section-product .pro-cart .pro-cart-btn span{font-size:11px}
+.c-item{font-size:16px;line-height:20px}
+.c-item .c-img{max-width:130px}
+.cart-page .form-btn{font-size:16px;line-height:20px}
+.cart-page .section-product .voucher .voucher-input{padding:13px 12px;font-size:16px;line-height:20px;margin:0 12px 0 16px}
+.cart-page .section-product .voucher .voucher-btn{height:46px;max-width:140px}
+.cart-page .col-right .list-radio .item input[type=radio]:checked+label:after{top:3px;left:2px;width:8px;height:8px}
+}

demo-audio-3/js/main_mobile.js

@@ -0,0 +1,302 @@
+// READY FUNCTIONS
+$(document).ready(function () {
+  homepageHandler();
+  globalHandler();
+})
+
+// GLOBAL FUNCTIONS
+function globalHandler() {
+  swiperProductThumbs();
+  footerArccodion();
+}
+
+// FOOTER ARC
+function footerArccodion() {
+  document.querySelectorAll(".accordion").forEach((acc) => {
+    acc.addEventListener("click", function () {
+      const nextEl = this.nextElementSibling;
+      if (nextEl.style.maxHeight) {
+        nextEl.style.maxHeight = null;
+        nextEl.style.marginBottom = "0px";
+      } else {
+        nextEl.style.maxHeight = nextEl.scrollHeight + "px";
+        nextEl.style.marginBottom = "10px";
+      }
+    });
+  });
+}
+
+function viewMoreContent(target) {
+  let htmlStaticBlock = $(target).find(".static-html");
+  let viewMoreBtn = $(target).find(".js-view-more-content");
+
+  htmlStaticBlock.toggleClass("max-height-none").toggleClass("blur");
+  viewMoreBtn.html().trim() === "Xem thêm +" ? viewMoreBtn.html("Thu gọn -") : viewMoreBtn.html("Xem thêm +");
+  if (!$(".static-html").hasClass("max-height-none")) document.querySelector(target).scrollIntoView({ behavior: 'smooth' });
+}
+
+function swiperProductThumbs() {
+  new Swiper(".swiper-product-thumbs", {
+    slidesPerView: 1,
+    spaceBetween: 10,
+    rewind: true,
+    speed: 1000,
+    autoplay: {
+      delay: 2500,
+      disableOnInteraction: false,
+      pauseOnMouseEnter: "true",
+    },
+    pagination: {
+      el: ".swiper-pagination",
+      clickable: true,
+    },
+    breakpoints: {
+      768: {
+        spaceBetween: 12,
+      },
+    },
+  });
+}
+
+// HOMEAPGE FUNCTIONS
+function homepageHandler() {
+  swiperSectionHero();
+  swiperSectionHomepageBanner();
+}
+
+function swiperSectionHero() {
+  new Swiper(".swiper-section-hero", {
+    slidesPerView: 1,
+    spaceBetween: 10,
+    rewind: true,
+    speed: 1000,
+    autoplay: {
+      delay: 2500,
+      disableOnInteraction: false,
+      pauseOnMouseEnter: "true",
+    },
+    breakpoints: {
+      768: {
+        spaceBetween: 12,
+      },
+    },
+  });
+}
+
+function swiperSectionHomepageBanner() {
+  new Swiper(".swiper-section-homepage-banner", {
+    slidesPerView: 1,
+    spaceBetween: 10,
+    rewind: true,
+    speed: 1000,
+    autoplay: {
+      delay: 2500,
+      disableOnInteraction: false,
+      pauseOnMouseEnter: "true",
+    },
+    breakpoints: {
+      768: {
+        spaceBetween: 12,
+      },
+    },
+  });
+}
+
+// CATEGORY
+function categoryHandler() {
+  $('.js-filter-title').click(function () {
+    var check = $(this).parents('.item');
+    if (check.hasClass('active') == true) {
+      check.removeClass('active');
+      $('.product-cate-bannner, .box-product-hot, .p-filter-group').removeClass('active');
+    } else {
+      $('.filter-list-box .item').removeClass('active')
+      $(this).parents('.item').addClass('active')
+      $('.product-cate-bannner, .box-product-hot, .p-filter-group').addClass('active');
+    }
+  });
+
+  $('.js-sort-check .sort-by-list a').each(function () {
+    if ($(this).hasClass('current') == true) {
+      var name = $(this).text();
+      $('.js-sort-check span').text(name)
+    }
+  });
+
+  $('.js-filter-selected').click(function () {
+    if ($(this).hasClass('current') == true) {
+      $(this).removeClass('current');
+    } else {
+      $(this).parents('.js-filter-item').find('.js-filter-selected').removeClass('current');
+      $(this).addClass('current');
+    }
+  });
+
+  $(".popup-filter-group").on("click", function (e) {
+    if (e.target === document.querySelector(".popup-filter-group")) {
+      $(".popup-filter-group").css("display", "none");
+      $("body").removeClass("overflow-hidden");
+    }
+  })
+}
+
+// CHECK VIEW MORE POPUP
+function filterPopupListViewMore() {
+  $(".list-holder").each(function () {
+    let summaryHeight = $(this).height();
+    if (summaryHeight >= 133) {
+    } else {
+      $(this).next().css("display", "none");
+    }
+  })
+}
+
+// ONCLICK VIEW MORE POPUP
+function showFilterMoreBtn(_this) {
+  $(_this).prev().toggleClass("view-more");
+  let viewMoreEle = $(_this).find(".js-view-more-popup");
+  let viewMoreIcon = $(_this).find(".fa-angle-double-down");
+
+  viewMoreEle.html() === "Xem thêm" ? viewMoreEle.html("Thu gọn") : viewMoreEle.html("Xem thêm");
+  viewMoreIcon.toggleClass("rotate-90deg");
+}
+
+// filter
+function _getLink(current_url) {
+  var brand = 'brand=';
+  var max = '&max=';
+  var min = '&min=';
+  var attr = '&filter=';
+
+  if ($('.js-brand-list a').hasClass('current') == true) {
+    brand = '&brand=' + $('.js-brand-list .current').attr('data-brand');
+  }
+
+  if ($('.js-price-list a').hasClass('current') == true) {
+    max = '&max=' + $('.js-price-list .current').attr('data-max');
+  }
+
+  if ($('.js-price-list a').hasClass('current') == true) {
+    min = '&min=' + $('.js-price-list .current').attr('data-min');
+  }
+
+  $('.js-attr-list .current').each(function () {
+    attr += $(this).attr('data-attr') + '_'
+  });
+
+  var sort = '';
+  if (GetURLParameter('sort')) {
+    sort = '&sort=' + GetURLParameter('sort')
+  }
+
+  var link = current_url + brand + max + min + attr + sort;
+
+  location.href = link;
+}
+
+function _openFilter() {
+  $('.popup-filter-group').fadeIn(150);
+  $('body').addClass('overflow-hidden');
+  $('#js-p-filter-group .item.active').removeClass('active');
+  $('.product-cate-bannner, .box-product-hot, .p-filter-group').removeClass('active');
+  filterPopupListViewMore();
+}
+
+function _closeFilter() {
+  $('.popup-filter-group').hide();
+  $('body').removeClass('overflow-hidden bg-filter');
+}
+// end filter
+
+function GetURLParameter(sParam) {
+  var sPageURL = window.location.search.substring(1);
+  var sURLVariables = sPageURL.split('&');
+  for (var i = 0; i < sURLVariables.length; i++) {
+    var sParameterName = sURLVariables[i].split('=');
+    if (sParameterName[0] == sParam) {
+      return sParameterName[1];
+    }
+  }
+}
+
+// PRODUCT DETAIL
+function detailHandler() {
+
+}
+
+let galleryThumbs = new Swiper(".gallery-thumbs", {
+  spaceBetween: 12,
+  slidesPerView: 4,
+  slideToClickedSlide: true,
+  freeMode: true,
+  watchSlidesProgress: true,
+  centerInsufficientSlides: true,
+  breakpoints: {
+    1600: {
+      spaceBetween: 16,
+    },
+  },
+});
+
+let galleryTop = new Swiper(".gallery-top", {
+  spaceBetween: 12,
+  slidesPerView: 1,
+  speed: 1000,
+  autoplay: {
+    delay: 2500,
+    disableOnInteraction: false,
+    pauseOnMouseEnter: "true",
+  },
+  breakpoints: {
+    1600: {
+      spaceBetween: 16,
+    },
+  },
+  thumbs: {
+    swiper: galleryThumbs,
+  },
+  // AUTO SILDED AT FISRT AND END
+  on: {
+    slideChange: function () {
+      let activeIndex = this.activeIndex + 1;
+
+      let activeSlide = document.querySelector(
+        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex})`
+      );
+      let nextSlide = document.querySelector(
+        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex + 1})`
+      );
+      let prevSlide = document.querySelector(
+        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex - 1})`
+      );
+
+      if (
+        nextSlide &&
+        !nextSlide.classList.contains("swiper-slide-visible")
+      ) {
+        this.thumbs.swiper.slideNext();
+      } else if (
+        prevSlide &&
+        !prevSlide.classList.contains("swiper-slide-visible")
+      ) {
+        this.thumbs.swiper.slidePrev();
+      }
+    },
+  },
+});
+
+function toggleAttr(target, _this) {
+  $('[data-type="attr-item-content"]').addClass('d-none');
+  $(target).toggleClass('d-none');
+  $(_this).closest('.attr-list-name').find('.title').removeClass('active');
+  $(_this).addClass('active');
+}
+
+// CART
+function cartHandler() {
+
+}
+
+function toggleDisplay(target) {
+  $(target).toggleClass('d-none');
+}

demo-audio-3/js/main_pc.js

@@ -0,0 +1,174 @@
+// READY FUNCTIONS
+$(document).ready(function () {
+  homepageHandler();
+  globalHandler();
+})
+
+// GLOBAL FUNCTIONS
+function globalHandler() {
+  swiperProductThumbs();
+}
+
+function viewMoreContent(target) {
+  let htmlStaticBlock = $(target).find(".static-html");
+  let viewMoreBtn = $(target).find(".js-view-more-content");
+
+  htmlStaticBlock.toggleClass("max-height-none").toggleClass("blur");
+  viewMoreBtn.html().trim() === "Xem thêm +" ? viewMoreBtn.html("Thu gọn -") : viewMoreBtn.html("Xem thêm +");
+  if (!$(".static-html").hasClass("max-height-none")) document.querySelector(target).scrollIntoView({ behavior: 'smooth' });
+}
+
+function swiperProductThumbs() {
+  new Swiper(".swiper-product-thumbs", {
+    slidesPerView: 1,
+    spaceBetween: 12,
+    rewind: true,
+    speed: 1000,
+    autoplay: {
+      delay: 2500,
+      disableOnInteraction: false,
+      pauseOnMouseEnter: "true",
+    },
+    pagination: {
+      el: ".swiper-pagination",
+      clickable: true,
+    },
+    breakpoints: {
+      1600: {
+        spaceBetween: 16,
+      },
+    },
+  });
+}
+
+// HOMEAPGE FUNCTIONS
+function homepageHandler() {
+  swiperSectionHero();
+  swiperSectionHomepageBanner();
+}
+
+function swiperSectionHero() {
+  new Swiper(".swiper-section-hero", {
+    slidesPerView: 1,
+    spaceBetween: 12,
+    rewind: true,
+    speed: 1000,
+    autoplay: {
+      delay: 2500,
+      disableOnInteraction: false,
+      pauseOnMouseEnter: "true",
+    },
+    breakpoints: {
+      1600: {
+        spaceBetween: 16,
+      },
+    },
+  });
+}
+
+function swiperSectionHomepageBanner() {
+  new Swiper(".swiper-section-homepage-banner", {
+    slidesPerView: 2,
+    spaceBetween: 12,
+    rewind: true,
+    speed: 1000,
+    autoplay: {
+      delay: 2500,
+      disableOnInteraction: false,
+      pauseOnMouseEnter: "true",
+    },
+    breakpoints: {
+      1600: {
+        spaceBetween: 16,
+      },
+    },
+  });
+}
+
+// PRODUCT DETAIL
+function detailHandler() {
+
+}
+
+let galleryThumbs = new Swiper(".gallery-thumbs", {
+  spaceBetween: 12,
+  slidesPerView: 4,
+  slideToClickedSlide: true,
+  freeMode: true,
+  watchSlidesProgress: true,
+  centerInsufficientSlides: true,
+  breakpoints: {
+    1600: {
+      spaceBetween: 16,
+    },
+  },
+});
+
+let galleryTop = new Swiper(".gallery-top", {
+  spaceBetween: 12,
+  slidesPerView: 1,
+  speed: 1000,
+  autoplay: {
+    delay: 2500,
+    disableOnInteraction: false,
+    pauseOnMouseEnter: "true",
+  },
+  breakpoints: {
+    1600: {
+      spaceBetween: 16,
+    },
+  },
+  thumbs: {
+    swiper: galleryThumbs,
+  },
+  // AUTO SILDED AT FISRT AND END
+  on: {
+    slideChange: function () {
+      let activeIndex = this.activeIndex + 1;
+
+      let activeSlide = document.querySelector(
+        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex})`
+      );
+      let nextSlide = document.querySelector(
+        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex + 1})`
+      );
+      let prevSlide = document.querySelector(
+        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex - 1})`
+      );
+
+      if (
+        nextSlide &&
+        !nextSlide.classList.contains("swiper-slide-visible")
+      ) {
+        this.thumbs.swiper.slideNext();
+      } else if (
+        prevSlide &&
+        !prevSlide.classList.contains("swiper-slide-visible")
+      ) {
+        this.thumbs.swiper.slidePrev();
+      }
+    },
+  },
+});
+
+$('[data-fancybox="gallery"]').fancybox({
+  thumbs: {
+    autoStart: true
+  }
+});
+
+function toggleAttr(target, _this) {
+  $('[data-type="attr-item-content"]').addClass('d-none');
+  $(target).toggleClass('d-none');
+  $(_this).closest('.attr-list-name').find('.title').removeClass('active');
+  $(_this).addClass('active');
+}
+
+// CART
+function cartHandler() {
+
+}
+
+function toggleDisplay(target) {
+  $(target).toggleClass('d-none');
+}

demo-audio-3/test.html

@@ -0,0 +1,34 @@
+<!-- <i class="static-icons static-icon-5-stars"></i>
+  <i class="static-icons static-icon-customer-avatar"></i>
+  <i class="static-icons static-icon-feature-cart"></i>
+  <i class="static-icons static-icon-feature-delivery"></i>
+  <i class="static-icons static-icon-feature-fly-gift"></i>
+  <i class="static-icons static-icon-feature-mail"></i>
+  <i class="static-icons static-icon-feature-money-pig"></i>
+  <i class="static-icons static-icon-feature-phone"></i>
+  <i class="static-icons static-icon-feature-reward"></i>
+  <i class="static-icons static-icon-feature-support"></i>
+  <i class="static-icons static-icon-feature-support-2"></i>
+  <i class="static-icons static-icon-filter-mb"></i>
+  <i class="static-icons static-icon-gift"></i>
+  <i class="static-icons static-icon-gray-close"></i>
+  <i class="static-icons static-icon-gray-close-mb"></i>
+  <i class="static-icons static-icon-green-box"></i>
+  <i class="static-icons static-icon-grid-style"></i>
+  <i class="static-icons static-icon-header-cart"></i>
+  <i class="static-icons static-icon-header-cart-mb"></i>
+  <i class="static-icons static-icon-header-user"></i>
+  <i class="static-icons static-icon-list-style"></i>
+  <i class="static-icons static-icon-location"></i>
+  <i class="static-icons static-icon-menu"></i>
+  <i class="static-icons static-icon-menu-mb"></i>
+  <i class="static-icons static-icon-phone-shake"></i>
+  <i class="static-icons static-icon-sale-fire"></i>
+  <i class="static-icons static-icon-social-fb"></i>
+  <i class="static-icons static-icon-social-fb-logo"></i>
+  <i class="static-icons static-icon-social-gg-news"></i>
+  <i class="static-icons static-icon-social-instagram"></i>
+  <i class="static-icons static-icon-social-instagram-logo"></i>
+  <i class="static-icons static-icon-social-twitter"></i>
+  <i class="static-icons static-icon-social-youtube"></i>
+  <i class="static-icons static-icon-social-youtube-logo"></i> -->