1110 lines
56 KiB
CSS
1110 lines
56 KiB
CSS
|
*{margin:0;padding:0;box-sizing:border-box;font-family:"Inter",sans-serif}
|
||
|
|
body{color:#222;font-family:"Inter",sans-serif;margin:0 auto;background:#f5f5f5;font-weight:400}
|
||
|
|
html{font-size:14px;font-family:"Inter",sans-serif}
|
||
|
|
img{max-width:100%;height:auto}
|
||
|
|
a{text-decoration:none;color: inherit;}
|
||
|
|
.clearfix{content:"";clear:both}
|
||
|
|
ul,li{list-style:none}
|
||
|
|
.gap-16{gap:16px;}
|
||
|
|
.gap-8 {gap: 8px;}
|
||
|
|
table{border-collapse:collapse;width:100%}
|
||
|
|
.ul,.ol{margin:0;padding:0;list-style:none}
|
||
|
|
.d-flex{display:flex!important}
|
||
|
|
.align-items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}
|
||
|
|
.justify-content-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
|
||
|
|
.justify-content-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
|
||
|
|
.justify-content-around{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-around}
|
||
|
|
.flex-around{justify-content:space-around}
|
||
|
|
.flex-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}
|
||
|
|
.flex-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
|
||
|
|
.global-breadcrumb ol{padding:13px 0}
|
||
|
|
.global-breadcrumb li:last-child .gach-cheo{display:none !important;}
|
||
|
|
.global-breadcrumb li:first-child span{margin-right:5px}
|
||
|
|
.grid{display:-ms-grid;display:grid;gap:12px}
|
||
|
|
.grid--6-cols{grid-template-columns:repeat(6,1fr)}
|
||
|
|
.grid--5-cols{grid-template-columns:repeat(5,1fr)}
|
||
|
|
.grid--4-cols{grid-template-columns:repeat(4,1fr)}
|
||
|
|
.grid--2-cols{grid-template-columns:repeat(2,1fr)}
|
||
|
|
.grid--3-cols{grid-template-columns:repeat(3,1fr)}
|
||
|
|
.grid--2-rows{grid-template-rows:repeat(2,1fr)}
|
||
|
|
.grid--product-details{-ms-grid-columns:3fr 1fr;grid-template-columns:3fr 1fr}
|
||
|
|
.grid--product-details-inside{-ms-grid-columns:5.13fr 6.48fr;grid-template-columns:7fr 5.76fr}
|
||
|
|
.justify-content-between{justify-content:space-between}
|
||
|
|
.d-block{display:block}
|
||
|
|
.d-none,.hide{display:none!important}
|
||
|
|
.flex-wrap{flex-wrap:wrap!important}
|
||
|
|
.text-center{text-align:center!important}
|
||
|
|
.align-items{align-items:center!important}
|
||
|
|
.space-between{justify-content:space-between!important}
|
||
|
|
.space-center{justify-content:center!important}
|
||
|
|
.d-block{display:block!important}
|
||
|
|
.flex-direction{flex-direction:column}
|
||
|
|
.container{padding:0 10px;max-width:1210px;margin:0 auto}
|
||
|
|
.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
|
||
|
|
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
|
||
|
|
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
|
||
|
|
.icon_2023{ background: url(../images/icon_2023.png) no-repeat;display:block}
|
||
|
|
.policy-1{width:46px;height:46px;background-position:-43px -58px;margin:0 auto 15px}
|
||
|
|
.policy-2{width:46px;height:46px;background-position:-94px -58px;margin:0 auto 15px}
|
||
|
|
.policy-3{width:54px;height:46px;background-position:-147px -58px;margin:0 auto 15px}
|
||
|
|
.success-form-svg{display:block;height:80px;width:80px;color:#49a0d9}
|
||
|
|
.circle{stroke-dasharray:76;stroke-dashoffset:76;animation:draw .5s forwards}
|
||
|
|
.tick{stroke-dasharray:18;stroke-dashoffset:18;animation:draw .5s forwards .6s}
|
||
|
|
@keyframes draw {
|
||
|
|
to{stroke-dashoffset:0}
|
||
|
|
}
|
||
|
|
.cart-success{width:500px;height:300px;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;position:fixed;color:#49a0d9}
|
||
|
|
.text-cart-success{font-size:24px;font-weight:600;line-height:1.6;padding-top:30px}
|
||
|
|
.ease-015s{transition:all ease .15s}
|
||
|
|
.success-form{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center}
|
||
|
|
.cart-ttip{display:none;position:absolute;background-color:#fff;border-radius:10px;width:400px;height:auto;right:0;top:50px;z-index:3;-webkit-box-shadow:0 1px 6px #000;box-shadow:0 1px 6px #000}
|
||
|
|
.cart-ttip-price-button{border-radius:5px;padding:10px;background:#0079c8;text-align:center;margin:12px}
|
||
|
|
.cart-ttip-item-container{max-height:300px;overflow:auto}
|
||
|
|
.cart-ttip-item-container .compare-item{height:auto;margin:10px 0;max-width:unset;margin:0;-webkit-box-shadow:none;box-shadow:none}
|
||
|
|
.cart-ttip-item-container .compare-item:hover{background:#0079c8}
|
||
|
|
.cart-ttip-item-container .compare-item:hover b{color:#fff !important;}
|
||
|
|
.cart-header .cau-noi{position:absolute;top:35px;width:130px;height:20px;right:0;top:40px;opacity:0}
|
||
|
|
.fixed-nav{position:fixed;top:0;left:0;right:0;z-index:5;background:#fff;-webkit-box-shadow:0 1px 6px #000;box-shadow:0 1px 6px #000;z-index:10;padding:4px 0!important}
|
||
|
|
|
||
|
|
|
||
|
|
.header-null-cart{width:100%!important;text-align:center;padding:30px;color:#000;font-weight:600}
|
||
|
|
.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}
|
||
|
|
.header-cart-item-price p{font-weight:700;width:auto}
|
||
|
|
.cart-header:hover .cart-ttip{display:block}
|
||
|
|
.cart-ttip .cart-ttip-price{padding:20px 28px 15px 10px;border-top:3px solid var(--pink);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}
|
||
|
|
.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}
|
||
|
|
.cart-ttip .cart-ttip-price p:nth-child(2){font-size:13px;font-weight:700;color:#0079c8;margin-left:0!important}
|
||
|
|
.cart-ttip .cart-ttip-price p:last-child{font-size:15px;font-weight:700}
|
||
|
|
.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 #000;box-shadow:0 1px 8px #000;padding:10px;border-radius:10px;max-width:360px;background:#fff}
|
||
|
|
.compare-item img{width:80px;border:5px}
|
||
|
|
.compare-item .compare-item-text{display:inline-block;padding:0 10px;width:100%;text-align: unset;}
|
||
|
|
.compare-item .compare-item-text p{background:none;color:#000;padding:0;width:100%;word-break:break-word;line-height:24px;margin-left:0;}
|
||
|
|
.compare-item .compare-item-text span{line-height:32px}
|
||
|
|
.search-results{display:none;border:1px solid #ddd;background:#fff;position:absolute;top:100%;left:0;width:100%;z-index:999}
|
||
|
|
.search-results-list{max-height:300px;overflow:auto;z-index:999}
|
||
|
|
.box-header .wrapper,.p-img,.product-detail-page .pd-info-left-group{overflow:hidden}
|
||
|
|
.search-results .item{background:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;gap:10px;padding:10px;width:100%;position:relative;text-decoration:none;font-weight:400}
|
||
|
|
.account .title-list a:hover,.footer-end-page,.product-detail-page .info-tech tr:nth-child(2n),.search-results a.item:hover{background-color:#f5f5f5}
|
||
|
|
.search-results img{width:60px}
|
||
|
|
.search-results .title{font-size:14px;color:#333;width: calc(100% - 60px - 10px);}
|
||
|
|
.search-results .price{color:#0079c8;font-weight:700}
|
||
|
|
.header{background:#fff}
|
||
|
|
.header .header-top-left .item{display:flex;align-items:center;padding:10px}
|
||
|
|
.header .header-top-left .item.phone{background:#ededed}
|
||
|
|
.header .header-top-left .item.phone .txt{color:#555}
|
||
|
|
.header .header-top-left .item:hover{color:#0079c8;font-weight:700}
|
||
|
|
.header .header-top-left .txt{margin-left:5px;font-size:13px}
|
||
|
|
.header .header-top-right .item{color:#777;font-size:13px;margin-left:30px}
|
||
|
|
.header .header-top-right .item:hover{color:#49a0d9;font-weight:700}
|
||
|
|
.header .icon_2023.ship{width:20px;height:15px;background-position:0 0}
|
||
|
|
.header .icon_2023.phone{width:20px;height:15px;background-position:-21px 0}
|
||
|
|
.header .header-mid{padding:25px 0}
|
||
|
|
|
||
|
|
.header .header-mid .logo{width:6%;margin-left:50px}
|
||
|
|
.header .header-mid-right .item{width:42px;height:42px;border:1px solid #f0f0f0;margin-right:12px;display:flex;align-items:center;text-align:center;justify-content:center;position:relative}
|
||
|
|
.header .header-mid-right .item.cart-home{width:calc(100% - 108px);margin-right:0;padding:0 10px}
|
||
|
|
.header .header-mid-right .item.cart-home .box-cart-header{position:relative}
|
||
|
|
.header .header-mid-right .item.cart-home .header-features-cart-amount{position:absolute;top:-5px;right:-7px;width:14px;height:14px;border-radius:50%;font-size:12px;background:#0079c8;color:#fff}
|
||
|
|
.header .header-mid-right .item.cart-home .txt{padding:0 5px;text-transform:uppercase;font-size:13px;margin-left:10px}
|
||
|
|
.header .header-mid-right .item .icon_2023.phone{width:24px;height:24px;background-position:-31px -24px}
|
||
|
|
.header .header-mid-right .item .icon_2023.account{width:24px;height:24px;background-position:-62px -24px}
|
||
|
|
.header .header-mid-right .item .icon_2023.cart{width:25px;height:25px;background-position:-92px -24px}
|
||
|
|
.header .header-mid-right .item:hover{background:#49a0d9}
|
||
|
|
.header .header-mid-right .item:hover .icon_2023{filter:brightness(100)}
|
||
|
|
.header .header-mid-right .item:hover .txt{color:#fff}
|
||
|
|
.header .header-mid-right .item:hover.cart-home{color:#fff}
|
||
|
|
.header .header-bottom{padding-bottom:15px}
|
||
|
|
.header .header-bottom .item{width:11%;position:relative}
|
||
|
|
.header .header-bottom .item .txt{text-align:center;margin-top:12px;font-size:12px;text-transform:uppercase;height:30px}
|
||
|
|
.header .header-bottom .item::before{position:absolute;content:"";width:2px;height:30px;right:0;top:38%;transform:translate(0,-50%);background:linear-gradient(90deg,rgba(153,153,153,0) 15%,#dedede 57.5%,rgba(153,153,153,0) 100%)}
|
||
|
|
.header .header-bottom .item:last-child::before{display:none}
|
||
|
|
.header .header-bottom .item:first-child .border-image{background:#ff3636}
|
||
|
|
.header .header-bottom .item:first-child .txt{color:#ff3636}
|
||
|
|
.header .header-bottom .item:hover .border-image{background:#49a0d9}
|
||
|
|
.header .header-bottom .item:hover .txt{color:#49a0d9}
|
||
|
|
.header .header-bottom .border-image{width:60px;height:60px;margin:0 auto;background:#f0f0f0;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:50%}
|
||
|
|
.header .header-bottom .border-image img{width:47px;height:26px;-o-object-fit:contain;object-fit:contain}
|
||
|
|
.form__input{position:relative;border:1px solid #ddd;width:650px;margin:0 60px}
|
||
|
|
.form__input .search-form{overflow:hidden;padding:3px;background:#fff;width:392px;position:relative;width:100%}
|
||
|
|
.form__input .submit-search{position:absolute;right:0;bottom:0;border:0;width:48px;height:41px;font-weight:300;background:#49a0d9;cursor:pointer}
|
||
|
|
.form__input .submit-search:hover{background:#ff3636;color:#fff}
|
||
|
|
.form__input .icon_2023.search{width:25px;height:28px;background-position:1px -21px;margin:0 auto}
|
||
|
|
.form__input .text_search{border:0;padding:0 5px 0 10px;width:calc(100% - 40px);height:100%;outline:none;color:#999;font-size:14px}
|
||
|
|
.form__input .searh-form-container{float:left;width:calc(100% - 60px);height:35px}
|
||
|
|
.swiper{width:100%;height:100%}
|
||
|
|
.group-btn-swiper{width:118px;position:absolute;right:10px;bottom:15px;background:#fff;border-radius:5px;z-index:9999}
|
||
|
|
.group-btn-swiper .content-btn{background:#fff;border-radius:5px}
|
||
|
|
.btn-next-prev{width:70px;position:relative;background:#fff;bottom:-12px}
|
||
|
|
.group-btn-swiper .swiper-button-next,.group-btn-swiper .swiper-button-prev{width:20px;height:20px;color:#222;border:1px solid #222;border-radius:50%}
|
||
|
|
.group-btn-swiper .swiper-button-next:after,.group-btn-swiper .swiper-button-prev:after{font-size:11px}
|
||
|
|
.group-pagination{width:calc(100% - 70px);position:relative;background:#fff;height:35px;border-radius:5px}
|
||
|
|
.group-pagination .swiper-pagination{bottom:7px;background:#fff}
|
||
|
|
.homepage .banner{margin-top:12px}
|
||
|
|
.homepage .banner .banner_homepage img{border-radius:20px;display:block;width: 100%;}
|
||
|
|
.homepage .product-saleoff{background: url(../images/background-product-saleoff.png) no-repeat;background-size:100% 100%;padding:20px 10px;border-radius:20px;margin-top:10px}
|
||
|
|
.homepage .product-saleoff .title{text-align:center;color:#fff;padding-bottom:20px;font-size:30px}
|
||
|
|
.homepage .product-saleoff .more-all{width:242px;height:50px;border:1px solid #fff;margin:10px auto 0;text-align:center;color:#fff;justify-content:center}
|
||
|
|
.homepage .product-saleoff .more-all #total{margin:0 5px}
|
||
|
|
.homepage .product-saleoff .more-all:hover{background:#0079c8}
|
||
|
|
.homepage .group-product-category{background:#fff;border-radius:20px 20px 0 0;border:1px solid #f0f0f0;margin-top:20px;border-bottom:none}
|
||
|
|
.homepage .group-product-category .group-title{padding:14px 10px;border-bottom:1px solid #f0f0f0}
|
||
|
|
.homepage .group-product-category .group-title .name{font-size:20px;text-transform:uppercase}
|
||
|
|
.homepage .group-product-category .group-title .item{padding-left:10px}
|
||
|
|
.homepage .group-product-category .group-title .item.active,.homepage .group-product-category .group-title .item:hover{padding:7px 10px;background:#49a0d9;border-radius:18px;color:#fff}
|
||
|
|
.homepage .group-product-category .group-title .item.active:hover{background:#0079c8}
|
||
|
|
.homepage .group-product-category .group-title .more-cate{margin-left:5px;color:#49a0d9;-webkit-text-decoration-line:underline;text-decoration-line:underline}
|
||
|
|
.homepage .group-product-category .group-title .more-cate:hover{font-weight:700}
|
||
|
|
.homepage .group-product-category .banner-sale-category img{display:block;height:100%;-o-object-fit:cover;object-fit:cover}
|
||
|
|
.homepage .group-product-category .banner-sale-category{width:290px;margin-right:10px}
|
||
|
|
.homepage .group-product-category .list-product{width:calc(100% - 300px)}
|
||
|
|
.homepage .big-product{width:30%}
|
||
|
|
.homepage .big-product .product-image{display:block;position:relative;width:100%;height:290px;overflow:hidden}
|
||
|
|
.homepage .big-product .product-image img{width:auto;position:absolute;top:0;left:0;right:0;bottom:0;max-width:100%;max-height:100%;margin:auto;-o-object-fit:cover;object-fit:cover;transition:.5s all;transform:scale(1)}
|
||
|
|
.homepage .big-product .product-image:hover img{transform:scale(1.05)}
|
||
|
|
.homepage .big-product .info-product{margin-top:20px;padding:15px}
|
||
|
|
.homepage .big-product .name-product{font-size:14px;line-height:16px;text-align:center;margin-bottom:5px;font-weight:400}
|
||
|
|
.homepage .big-product .name-product:hover a{color:#0079c8;font-weight:700}
|
||
|
|
.homepage .big-product .main-price{margin:10px 0}
|
||
|
|
.homepage .big-product .main-price .price{font-size:18px;color:#0079c8;font-weight:700;margin-right:7px}
|
||
|
|
.homepage .big-product .main-price .old-price{font-size:14px;color:#b7b7b7}
|
||
|
|
.homepage .big-product .product-add-cart{margin:30px auto 0;width:154px;height:36px;background:#49a0d9;border-radius:18px}
|
||
|
|
.homepage .big-product .unit-detail-amount-control{background:#fff;width:95px;border-radius:18px;height:32px;display:flex;align-items:center;justify-content:center;margin-left:2px}
|
||
|
|
.homepage .big-product .unit-detail-amount-control input{width:40px;border:none;outline:none}
|
||
|
|
.homepage .big-product .unit-detail-amount-control i{font-size:10px}
|
||
|
|
.homepage .big-product .unit-detail-amount-control a{width:55px;display:flex;align-items:center;justify-content:center}
|
||
|
|
.homepage .big-product .btn-buyNow{width:calc(100% - 95px);margin-right:5px;display:flex;align-items:center;justify-content:center}
|
||
|
|
.box-empty{width:100%}
|
||
|
|
.homepage .big-product .btn-buyNow .icon_2023.cart{width:26px;height:26px;display:block;background-position:-123px -24px}
|
||
|
|
.homepage .list-grid-small{width:70%;border-left:1px solid #f0f0f0;gap:0!important}
|
||
|
|
.homepage .feedback-customer{margin:20px 0}
|
||
|
|
.homepage .feedback-customer .title{margin-bottom:10px}
|
||
|
|
.homepage .feedback-customer .title h2{font-size:20px;text-transform:uppercase}
|
||
|
|
.homepage .feedback-customer .title .more-all{color:#49a0d9;text-transform:uppercase;font-size:14px;text-decoration:underline}
|
||
|
|
.homepage .feedback-customer .swiper-button-next,.homepage .feedback-customer .swiper-button-prev{color:#060606}
|
||
|
|
.homepage .feedback-customer .swiper-button-next:after,.homepage .feedback-customer .swiper-button-prev:after{font-size:40px}
|
||
|
|
.homepage .item-feedback{border-radius:20px;background:#fff}
|
||
|
|
.homepage .item-feedback .info-feedback{padding:10px}
|
||
|
|
.homepage .item-feedback .info-feedback .text{margin-bottom:10px;font-weight:600}
|
||
|
|
.homepage .item-feedback .image-feedback{width:100%;height:240px;position:relative}
|
||
|
|
.homepage .item-feedback .image-feedback img{width:auto;position:absolute;top:0;left:0;right:0;bottom:0;max-width:100%;max-height:100%;margin:auto;-o-object-fit:cover;object-fit:cover;transition:.5s all;transform:scale(1)}
|
||
|
|
.homepage .item-feedback .avatar{width:46px;height:46px;margin-right:10px}
|
||
|
|
.homepage .item-feedback .avatar img{display:block}
|
||
|
|
.homepage .item-feedback .user b{font-size:14px;margin-right:5px}
|
||
|
|
.item-product-sale{background:#fff;border-radius:15px;margin-right:10px;margin-bottom:10px;width:calc(50% - 10px);display:flex;padding:10px}
|
||
|
|
.item-product-sale:hover{box-shadow:inset #0079c8 0 0 0 2px}
|
||
|
|
.item-product-sale .product-image{display:block;position:relative;width:205px;height:205px}
|
||
|
|
.item-product-sale .product-image img{width:auto;position:absolute;top:0;left:0;right:0;bottom:0;max-width:100%;max-height:100%;margin:auto;-o-object-fit:cover;object-fit:cover}
|
||
|
|
.item-product-sale .info-product{width:calc(100% - 215px);margin-left:10px}
|
||
|
|
.item-product-sale .name-product{padding:10px 0;font-size:16px;display:block;font-weight:400}
|
||
|
|
.item-product-sale .name-product:hover a{color:#0079c8;font-weight:700}
|
||
|
|
.item-product-sale .summary-product{margin-bottom:20px}
|
||
|
|
.item-product-sale .summary-product span{display:block;font-size:14px;color:#b7b7b7;line-height:18px}
|
||
|
|
.item-product-sale .old-price{color:#b7b7b7}
|
||
|
|
.item-product-sale .price{font-size:24px;font-weight:700;color:#0079c8;padding-top:5px}
|
||
|
|
.item-product-sale .btn-cart{width:45px;height:45px;background:#49a0d9;border-radius:50%;display:flex;justify-content:center;align-items:center}
|
||
|
|
.item-product-sale .btn-cart .icon_2023.cart{width:26px;height:26px;display:block;background-position:-123px -24px}
|
||
|
|
.list-grid-small .product-item{border:1px solid #f0f0f0;padding:10px}
|
||
|
|
.list-grid-small .product-item .product-image{height:135px}
|
||
|
|
.product-item .product-image{display:block;position:relative;width:100%;height:270px;overflow:hidden}
|
||
|
|
.product-item{padding:10px 10px 20px}
|
||
|
|
.product-item .main-price{width:85%;margin:0 auto;align-items:center}
|
||
|
|
.product-item .product-image img{width:auto;position:absolute;top:0;left:0;right:0;bottom:0;max-width:100%;max-height:100%;margin:auto;-o-object-fit:cover;object-fit:cover;transition:.5s all;transform:scale(1)}
|
||
|
|
.product-item .product-image:hover img{transform:scale(1.05)}
|
||
|
|
.product-item .info-product{margin-top:10px}
|
||
|
|
.product-item .name-product{font-size:12px;line-height:15px;text-align:center;margin-bottom:5px;font-weight:400;height:30px}
|
||
|
|
.product-item .name-product:hover a{color:#0079c8;font-weight:700}
|
||
|
|
.product-item .old-price{font-size:13px;color:#b7b7b7}
|
||
|
|
.product-item .price{font-size:16px;color:#0079c8;font-weight:700}
|
||
|
|
.icon-star{background-image:url(../images/group_icon_start.png);width:170px;height:29px;vertical-align:text-bottom;display:inline-block;background-repeat:no-repeat}
|
||
|
|
.icon-star.star-0{background-position:0 -170px}
|
||
|
|
.icon-star.star-1{background-position:0 -136px}
|
||
|
|
.icon-star.star-2{background-position:0 -102px}
|
||
|
|
.icon-star.star-3{background-position:0 -68px}
|
||
|
|
.icon-star.star-4{background-position:0 -34px}
|
||
|
|
.icon-star.star-5{background-position:0 0}
|
||
|
|
.footer{background:#fff;padding:20px 0}
|
||
|
|
.footer .list-brand{padding:24px 0;border-bottom:1px solid #F0F0F0}
|
||
|
|
.box-list-item-brand{padding:0 10px;max-width:1210px;margin:0 auto}
|
||
|
|
.content-main-footer{gap:40px;margin-top:12px}
|
||
|
|
.content-main-footer .logo img{width:108px}
|
||
|
|
.content-main-footer .item{width:22%;color:#555}
|
||
|
|
.content-main-footer .item .title{font-weight:700;color:#000;margin:15px 0 9px}
|
||
|
|
.content-main-footer .icon_2023.map{width:20px;height:15px;background-position:-41px 0}
|
||
|
|
.content-main-footer .item span{margin-left:4px}
|
||
|
|
.content-main-footer .icon_2023.phone{width:20px;height:15px;background-position:-60px 0}
|
||
|
|
.content-main-footer .item .logo{margin-bottom:6px}
|
||
|
|
.content-main-footer .item a,.content-main-footer .item p{display:block;color:#555;margin-bottom:10px}
|
||
|
|
.content-main-footer .item a:hover{font-weight:700;color:#0079c8}
|
||
|
|
.box-icon-social-footer i{color:#fff;font-size:16px}
|
||
|
|
.box-icon-social-footer a{width:30px;height:30px;margin-right:12px;border-radius:6px;justify-content:center}
|
||
|
|
.box-icon-social-footer .icon-facebook{background-color:#4267B2}
|
||
|
|
.box-icon-social-footer .icon-youtobe{background-color:red}
|
||
|
|
.box-icon-social-footer .icon-instagram{background-color:#E3553E}
|
||
|
|
.end-title-footer{text-align:center;color:#555;padding:12px 0}
|
||
|
|
.box-search-more-category{background:#fff;padding:14px 12px 4px;border-radius:12px;margin:16px 0 11px;margin-top:0;}
|
||
|
|
.box-search-more-category h2{font-size:16px;margin-right:12px;line-height:17px}
|
||
|
|
.box-search-more-category .find-more-title{color:#0079C8;padding:8px;line-height:17px;background:#F0F0F0;border-radius:5px;margin-right:6px;margin-bottom:8px;font-weight:600}
|
||
|
|
.box-list-item-category{padding:16px 12px;background:#fff;border-radius:12px;margin-bottom:20px}
|
||
|
|
.box-list-item-category h1{margin-bottom:13px;font-size:24px}
|
||
|
|
.sort-list-category{background:#FFF;border:1px solid #EDEDED;border-radius:8px;padding:10px 15px}
|
||
|
|
select.sort-bar-select{border:none;text-transform:uppercase}
|
||
|
|
.sort-left select.sort-bar-select{margin-right:12px}
|
||
|
|
.box-category-list{padding:12px 10px}
|
||
|
|
.paging-link:hover,.paging-link.active{font-size:14px;border:1px solid #D9D9D9;border-radius:3px;width:36px;height:36px}
|
||
|
|
.paging-link{color:#000;font-size:14px;margin-right:8px;width:36px;height:36px}
|
||
|
|
.product-detail-page{background:#FFF;border-radius:12px;padding:35px 12px 30px}
|
||
|
|
.product-detail-page .product-images{min-width:0;width:48%;margin-right:12px}
|
||
|
|
.product-detail-page .product-descriptions{min-width:0;width:50%;margin-top:26px}
|
||
|
|
.product-detail-page .product-descriptions h1{font-weight:500;font-size:26px;line-height:31px;margin-bottom:18px}
|
||
|
|
.sprite-star{background:url(/static/assets/demo_audio/images/group_star.png);background-size:90px 100px!important;display:block;width:90px;height:16px}
|
||
|
|
.star0{background-position:-269px 218px!important}
|
||
|
|
.star1{background-position:-269px 234px!important}
|
||
|
|
.star2{background-position:-269px 250px!important}
|
||
|
|
.star3{background-position:-269px 267px!important}
|
||
|
|
.star4{background-position:-269px 183px!important}
|
||
|
|
.star5{background-position:-269px 300px!important}
|
||
|
|
.product-review span{color:#0079C8;margin-left:10px;font-size:14px;line-height:17px}
|
||
|
|
.product-review{position:relative;margin-right:10px}
|
||
|
|
.product-vist{color:#999;padding-left:14px;border-left:1px solid #000}
|
||
|
|
.product-vist b{color:#000;margin-right:5px}
|
||
|
|
.box-pricing-detail{margin:22px 0}
|
||
|
|
.box-pricing-detail .product-pricing-sale{color:#0079C8;font-size:28px;line-height:24px;font-weight:700;margin-right:12px}
|
||
|
|
.box-pricing-detail .product-pricing-origin{color:#B7B7B7;font-size:18px;font-weight:500;line-height:24px;text-decoration:line-through}
|
||
|
|
.box-pricing-detail .product-pricing-deal{background:#0079C8;border-radius:5px;padding:3px;color:#fff;margin-left:15px}
|
||
|
|
.box-descreption-detail li{white-space:pre-line;text-align:justify;margin-top:6px}
|
||
|
|
.box-policy-detail{border:1px solid #EDEDED;border-radius:12px;padding:20px;justify-content:space-between;margin:15px 0;gap:40px}
|
||
|
|
.item-policy-detail{width:33%;height:115px}
|
||
|
|
.item-policy-detail p{text-align:center}
|
||
|
|
.title-add-number{font-weight:600;font-size:16px;line-height:19px;margin-right:30px}
|
||
|
|
.box-add-number-sp .cart-quantity-select{display:inline-flex;align-items:center;border:1px solid #DDD;border-radius:5px}
|
||
|
|
.box-add-number-sp .js-quantity-change{padding:4px 8px;text-decoration:none;font-size:20px;line-height:26px;color:#000}
|
||
|
|
.box-add-number-sp .cart-quantity-select input{font-size:16px;border:none;width:50px;outline:none;text-align:center;color:#000;font-weight:600}
|
||
|
|
.product-buy{margin-top:16px}
|
||
|
|
.product-buy .btn-buy p{color:#FFF;font-weight:600;font-size:18px;line-height:22px;text-transform:uppercase}
|
||
|
|
.product-buy .btn-buy{border-radius:8px;height:52px;border:none;outline:none;cursor: pointer;}
|
||
|
|
.product-buy .buy-right-now{background:#FF3636}
|
||
|
|
.product-buy .add-cart-detail{background:#0079C8}
|
||
|
|
.section-descreption-product{margin-top:30px;border-bottom:1px solid #DDD;padding-bottom:16px}
|
||
|
|
.section-descreption-product .title,.section-review-product .title{font-weight:700;font-size:22px;line-height:22px;margin-bottom:12px;text-transform:uppercase}
|
||
|
|
.section-descreption-product span, .section-descreption-product p, .section-descreption-product strong{font-size: 16px !important; line-height: 18px !important;font-family: "Inter",sans-serif !important;}
|
||
|
|
.section-descreption-product img{display:block;padding: 10px 0; margin: 0 auto;}
|
||
|
|
.section-review-product .title{margin-top:30px;margin-bottom:23px}
|
||
|
|
.section-descreption-product p{font-size:14px;text-align:justify}
|
||
|
|
.box-bottom-detail{margin:25px 0 12px}
|
||
|
|
.box-bottom-detail .title{margin-bottom:16px;text-transform:uppercase}
|
||
|
|
.box-bottom-detail .product-item{background:#fff}
|
||
|
|
.review-info .title-review-info{font-weight:600;font-size:14px;line-height:17px;margin-bottom:10px}
|
||
|
|
.review-info .title-star{font-weight:600;font-size:36px;line-height:44px;color:#FF3636;margin-right:12px}
|
||
|
|
.box-review{margin-top:16px}
|
||
|
|
.review-info{width:40%}
|
||
|
|
.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#495057;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;-webkit-transition:border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;-o-transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;outline:0;resize:none}
|
||
|
|
.rating-form table tr td:first-child{width:100px}
|
||
|
|
.rating-form table td{padding:5px 0}
|
||
|
|
.btn-review{width:100%;background:#FFF;border:1px solid #0079C8;border-radius:8px;height:54px;cursor:pointer}
|
||
|
|
.btn-review .btn-blue{color:#0079C8;margin-left:8px}
|
||
|
|
.btn-review:hover{background:#0079C8}
|
||
|
|
.btn-review:hover .btn-blue{color:#fff}
|
||
|
|
.sprite-1star{background:url(../images/star_rating.png);display:block}
|
||
|
|
.star0{background-position:-269px 218px!important}
|
||
|
|
.star1{background-position:-269px 234px!important}
|
||
|
|
.star2{background-position:-269px 250px!important}
|
||
|
|
.star3{background-position:-269px 267px!important}
|
||
|
|
.star4{background-position:-269px 183px!important}
|
||
|
|
.star5{background-position:-269px 300px!important}
|
||
|
|
.rating-selection{display:inline-block}
|
||
|
|
.rating-selection input{opacity:0;float:right;width:17px;height:17px;padding:0;margin:0 0 0 -16px}
|
||
|
|
.rating-selection label:hover,.rating-selection label:hover~label{background-position:-16px -57px!important}
|
||
|
|
.rating-input:checked~.rating-star,.rating-input:checked~.rating-star:hover{background-position:-16px -57px!important}
|
||
|
|
.rating-selection label{position:relative;float:right;display:block;width:17px;height:17px;margin:0 3px;background-position:-16px -28px!important}
|
||
|
|
.list-review .comment-form-left{height:100%}
|
||
|
|
.list-review .comment-form-left .avatar-user{display:block;text-align:center;width:34px;height:34px;line-height:34px;margin-right:12px;border-radius:5px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;background:#d9d9d9;text-transform:uppercase;font-weight:700;font-size:17px}
|
||
|
|
.list-review .comment-form-right .time-review{margin-left:8px;font-weight:400;font-size:12px;line-height:15px;color:#888}
|
||
|
|
.list-review .comment-form-right .content{margin:8px 0}
|
||
|
|
.list-review .comment-form-right .txt{margin:8px 0}
|
||
|
|
.title-buyed{color:#00C814;margin-left:6px}
|
||
|
|
.list-review .comment-form-right .review-reply a{color:#49a0d9!important;font-weight:700}
|
||
|
|
.p-comment-group .cmt-form-group{border:1px solid #e1e1e1;border-radius:7px;overflow:hidden;margin-bottom:15px}
|
||
|
|
.p-comment-group .content-holder{outline:0;width:100%;border:0;padding:10px;height:122px;border-bottom:1px solid #e1e1e1;resize:none}
|
||
|
|
.reply-template .form-input{padding:12px}
|
||
|
|
.p-comment-group .form-group{margin:0}
|
||
|
|
.p-comment-group .inputText{float:left;border:1px solid #e1e1e1;margin-right:10px;height:30px;padding-left:10px;border-radius:4px;outline: none;}
|
||
|
|
.p-comment-group .btn-send-comment{background:#49a0d9;color:#fff;text-decoration:underline;border:0;width:128px;height:38px;border-radius:4px;float:right;text-decoration:none;font-weight:700;font-size:14px;margin: 16px 0px;cursor:pointer;}
|
||
|
|
.p-comment-group .cmt-form-group{border:1px solid #e1e1e1;border-radius:7px;overflow:hidden;margin-bottom:15px}
|
||
|
|
.comment-list{margin:0 12px}
|
||
|
|
.item_reply{border-bottom:1px solid #e1e1e1;background:#f9f9f9;padding:12px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
|
||
|
|
#js-review-holder .item{margin-bottom:12px}
|
||
|
|
.list-review{width:50%}
|
||
|
|
.comment-form-right{width:100%}
|
||
|
|
.scroll-top-btn{font-size:36px;width:60px;height:60px;position:fixed;bottom:100px;right:10px;background:#49a0d9;border-radius:50%;z-index:999;-webkit-box-shadow:0 1px 5px #000;box-shadow:0 1px 5px #000;color:#fff}
|
||
|
|
|
||
|
|
.btn-danger{color:#fff;background-color:#49a0d9;border-color:#49a0d9;display:block;text-align:center;width:100%;padding:10px;border-radius:10px}
|
||
|
|
#view-covid:hover #showroom_online_new,#support_top:hover #h_menu_sub_on1{transition:.25s all;opacity:1;visibility:visible;top:66px}
|
||
|
|
.header .right-header .item:hover{color:#222}
|
||
|
|
.container-cart #address.active{display:block}
|
||
|
|
.container-cart #address{display:none}
|
||
|
|
.product-detail .content-desc-detail .content-desc .content h1{line-height:1.2!important;font-size:20px}
|
||
|
|
.product-detail .product-detail-gallery .item-thumbnail img{height:100px}
|
||
|
|
.product-detail .product-detail-thumbnail{margin-top:10px}
|
||
|
|
.box-w {border-radius: 15px;background-color: #fff;padding: 12px;}
|
||
|
|
.table-contact tr{display:flex;margin-bottom: 10px;}
|
||
|
|
.table-contact tr td:first-child{width:140px;margin-right:15px;}
|
||
|
|
.table-contact tr td:last-child input{padding:4px 10px;outline: none;}
|
||
|
|
.btn-contact{border: none; color: #fff;width: 100px;padding: 4px 10px;background: red;cursor: pointer;}
|
||
|
|
|
||
|
|
.customer-content-group{max-width:825px;margin:20px auto;-webkit-box-shadow:0 0 7px 0 rgb(0 0 0 / 20%);box-shadow:0 0 7px 0 rgb(0 0 0 / 20%);background:#fff;padding:20px 0}
|
||
|
|
.customer-content-title{text-align:center;font-size:18px;font-weight:600}
|
||
|
|
.customer-content-title a{color:#222}
|
||
|
|
.customer-content-title a:first-child{margin-right:16px}
|
||
|
|
.customer-content-title a.current,.customer-content-title a:hover{color:var(--color-primary);border-bottom:1px solid var(--color-primary)}
|
||
|
|
.customer-form{margin:auto;max-width:616px}
|
||
|
|
.customer-form .item{margin-top:20px;font-weight:300}
|
||
|
|
.customer-form .item input{display:block;width:100%;border:1px solid #d7d7d7;padding:0 12px;height:42px;border-radius:5px;margin-top:5px;font-size:16px;outline:0}
|
||
|
|
.customer-form .item span{color:#d91605}
|
||
|
|
.customer-form .item p{font-size:14px;font-weight:400}
|
||
|
|
.btn-customer{width:100%;height:46px;border:0;border-radius:6px;background-color:#49a0d9;font-size:18px;font-weight:600;color:#fff;margin-top:30px;cursor:pointer}
|
||
|
|
.password-input{position:relative}
|
||
|
|
.show-pass{position:absolute;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);right:10px}
|
||
|
|
.forgot-password{display:block;text-align:right;color:#208ce8;margin:8px 0 0;font-size:14px}
|
||
|
|
.forgot-password-content{max-width:800px;padding-top:50px;margin:0 auto}
|
||
|
|
.forgot-password-content h2{font-size:26px;font-weight:600;margin-bottom:8px}
|
||
|
|
.forgot-password-content p{font-size:16px;margin-bottom:20px}
|
||
|
|
.forgot-password-content table{width:100%}
|
||
|
|
.forgot-password-content input{width:100%;padding:10px 8px;font-size:18px;border-radius:5px;outline:0;border:1px solid var(--color-primary)}
|
||
|
|
.forgot-password-content td:first-child{font-size:18px}
|
||
|
|
.btn-forgot-password{display:block;width:50%;margin:30px auto}
|
||
|
|
.js-alert-mess{font-size:16px;font-weight:500;color:#d91605}
|
||
|
|
|
||
|
|
.account .col-left{border-right:1px solid #f5f5f5}
|
||
|
|
.account .left-title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 60px 20px 0;width:220px}
|
||
|
|
.account .left-title span{font-size:16px;font-weight:400}
|
||
|
|
.account .left-title p{font-size:18px;margin-top:4px}
|
||
|
|
.account .title-list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px}
|
||
|
|
.account .title-list a{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:10px 14px}
|
||
|
|
.account .title-list a:hover{background-color:#f5f5f5}
|
||
|
|
.account .col-right{padding:10px}
|
||
|
|
.account .col-right h2{font-size:22px;font-weight:600;margin-bottom:16px}
|
||
|
|
.info-page table{width:520px}
|
||
|
|
.account .col-right .form-input{width:100%;padding-left:13px;border-radius:5px;border:1px solid #e1e1e1;height:38px;margin-bottom:8px}
|
||
|
|
.btn-change{padding:10px 20px;border:none;background-color:#ee2d24;color:#fff;border-radius:5px;font-size:16px;cursor:pointer}
|
||
|
|
.order-page table{font-size:16px}
|
||
|
|
.order-page td{padding:10px;border:1px solid #ccc}
|
||
|
|
.red-bold{color:#d91605;font-weight:600}
|
||
|
|
.customer-content-title a.current, .customer-content-title a:hover {color: #49a0d9;border-bottom: 1px solid #49a0d9;}
|
||
|
|
.box-account {padding: 30px 0;display: flex; gap: 10px;font-size: 16px;}
|
||
|
|
|
||
|
|
/*ARTICLE*/
|
||
|
|
.sprite-article {background-image: url(/static/assets/default/images/sprite-article.png);background-repeat: no-repeat;background-size: 120.5px 99px;display: block;}
|
||
|
|
.article-category{padding:0 0 16px;font-size: 18px;color: #000;text-transform: uppercase;}
|
||
|
|
.article-category ul{-ms-flex-pack:distribute!important;justify-content:space-between;font-size:18px}
|
||
|
|
.article-header{background:var(--blue);color:#fff}
|
||
|
|
.article-category ul li:hover, .article-category ul .active{color:#49a0d9;}
|
||
|
|
.article-category ul li img{width:unset}
|
||
|
|
.article-page .article-content{background-color:var(--white);padding:17px 0 60px}
|
||
|
|
.article-page .section-hero .sprite-article-icon-eye{-webkit-filter:brightness(0) invert(1);filter:brightness(0) invert(1)}
|
||
|
|
.article-page .section-hero.grid{-ms-grid-columns:11.44fr 40px 4.16fr;grid-template-columns:11.44fr 4.16fr;gap:40px}
|
||
|
|
.article-page .section-hero .col-left{min-width:0;border-radius:10px;overflow:hidden;height:max-content;}
|
||
|
|
.article-page .section-hero .col-right{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px}
|
||
|
|
.article-page .article-hero{position:relative;overflow:hidden;height:100%;border-bottom: 1px solid #D9D9D9;padding-bottom:12px;}
|
||
|
|
.article-page .article-hero-content .wrapper{gap:30px;margin:10px 0;}
|
||
|
|
.article-page .article-hero-content .wrapper h5{color:#DA251C;font-size: 16px;}
|
||
|
|
.article-page .article-hero-content .wrapper h4{font-size:18px;margin-top:10px;}
|
||
|
|
.article-page .article-hero a img{border-radius:10px;width:100%;}
|
||
|
|
|
||
|
|
.article-page .swiper-article-category{background:linear-gradient(90deg, #FF5C00 0%, #FFA800 100%);border-radius:20px;padding:5px 15px;display:inline-block;color:#fff}
|
||
|
|
.article-page .swiper-article-slider{position:relative}
|
||
|
|
.article-page .swiper-article-slider h2{font-size:30px;line-height:40px;font-weight:600;margin:8px 0 10px;max-width:740px}
|
||
|
|
.article-page .swiper-article-slider .wrapper{position:absolute;left:30px;bottom:23px;text-shadow: 1px 1px 1px #000;color:#fff;}
|
||
|
|
.article-page .swiper-button-next,.article-page .swiper-button-prev{background:rgba(202,202,202,.15)}
|
||
|
|
.article-page .section-main-content.grid{-ms-grid-columns:11.44fr 60px 4.16fr;grid-template-columns:11.44fr 4.16fr;gap:60px}
|
||
|
|
|
||
|
|
.article-page .section-main-content{padding-top:20px}
|
||
|
|
.article-page .article-box{margin-bottom:20px}
|
||
|
|
.article-page .article-box .title{
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
border-bottom: 1px solid #E1E1E1;
|
||
|
|
}
|
||
|
|
.article-page .article-item .sprite-article-icon-clock,.article-page .article-newest .sprite-article-icon-clock-small,.sprite-article-icon-clock{-webkit-filter:brightness(0%);filter:brightness(0%)}
|
||
|
|
.article-page .article-box .grid{gap:28px 18px;margin-top: 10px;}
|
||
|
|
.article-page .article-box .article-image{position:relative;border-radius:5px;overflow:hidden;display:block}
|
||
|
|
.article-page .article-box .article-image img{border-radius:5px;width:100%}
|
||
|
|
.article-page .article-box .article-image h4{position:absolute;left:10px;bottom:20px}
|
||
|
|
.article-page .article-box .article-text{margin:12px 0 10px;font-size:18px;line-height: 20px;}
|
||
|
|
.article-hero-features{font-size:13px}
|
||
|
|
.article-hero-features p{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
|
||
|
|
.article-hero-features p i{margin-right:8px}
|
||
|
|
.article-page .article-box-heading{display:inline-block;font-size:22px!important;line-height:36px;font-weight:700;border-bottom:2px solid #DA251C;text-transform:uppercase;padding-bottom: 10px;}
|
||
|
|
.article-content .swiper-pagination-bullet-active{background: linear-gradient(90deg, #FF5C00 7.14%, #FFA800 85.67%) !important;border-radius: 5px !important;width:30px !important;}
|
||
|
|
.article-box-title .article-box-heading{margin-bottom:0}
|
||
|
|
.article-box-title{margin-bottom:36px}
|
||
|
|
.col-left .article-box-heading{font-size: 25px !important;}
|
||
|
|
.article-box-heading-detail{margin-bottom:21px!important}
|
||
|
|
.article-hero-features-detail{padding-bottom:14px;border-bottom:1px solid #E1E1E1}
|
||
|
|
.article-page .article-box-btn{padding-top:40px;text-align:center;position:relative}
|
||
|
|
.article-page .article-box-btn a{display:inline-block;color:#000;padding:4px 12px;border:1px solid #D9D9D9;background: #D9D9D9;border-radius: 44.4073px;font-weight:700;font-size: 12px;}
|
||
|
|
.article-page .article-box-btn a:hover{background:#E10034;color: #fff;}
|
||
|
|
.article-page .article-newest-heading{font-size:26px;line-height:34px}
|
||
|
|
.article-page .article-newest{padding-bottom:48px}
|
||
|
|
.article-page .article-newest li:not(:last-child){margin-bottom:12px;padding-bottom: 10px;border-bottom: 0.727989px solid #D9D9D9;}
|
||
|
|
.article-page .article-newest img{max-width:180px;border-radius:10px}
|
||
|
|
.article-page .article-newest .wrapper{margin-bottom:8px}
|
||
|
|
.article-page .product-sale img{max-width:100px;margin-right:10px;border-radius: 8px;}
|
||
|
|
.article-page .product-sale .article-box-heading{margin-bottom:8px}
|
||
|
|
.article-page .product-sale li{padding-bottom:12px;margin-bottom:12px;border-bottom:2px solid #f6f6f6}
|
||
|
|
.article-page .product-sale li:last-child{border-bottom:none!important;}
|
||
|
|
.article-page .article-banner{padding-top:50px}
|
||
|
|
.article-page .section-promotional .article-box-btn::after{right:18%}
|
||
|
|
.article-page .section-promotional .article-box-btn::before{left:18%}
|
||
|
|
.article-page .section-videos{background-color:#041e42;padding:16px 30px 30px;border-radius:5px}
|
||
|
|
.article-page .section-videos .article-box-heading{margin-bottom:20px;font-style:25px}
|
||
|
|
.article-page .section-videos .header-global-item{display:inline-block;margin-top:20px}
|
||
|
|
.article-page .section-videos .article-box{margin-bottom:0}
|
||
|
|
.article-page .section-videos .text-video-artilce{font-size:20px;line-height:26px}
|
||
|
|
.article-page .section-videos i,.col-left ul .article-image i{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
|
||
|
|
.section-news,.section-video{display:none!important}
|
||
|
|
.sprite-article-icon-clock{width:20px;height:20px;background-position:-2.5px -2.5px!important}
|
||
|
|
.sprite-article-icon-clock-small{width:18px;height:18px;background-position:-1.875px -1.875px!important;background-size:90.375px 74.25px!important}
|
||
|
|
.sprite-article-icon-eye{width:20px;height:20px;background-position:-27.5px -2.5px!important}
|
||
|
|
.sprite-article-icon-gamepad{width:28px;height:28px;background-position:-52.5px -2.5px!important}
|
||
|
|
.sprite-article-icon-list{width:25px;height:25px;background-position:-2px -35px!important}
|
||
|
|
.sprite-article-icon-play{width:53.5px;height:53.5px;background-position:-31.5px -35.5px!important}
|
||
|
|
.sprite-article-icon-play-btn{width:28px;height:28px;background-position:-85.1px -2.5px!important}
|
||
|
|
.sprite-article-icon-tag{width:28px;height:28px;background-position:-90px -35.5px!important}
|
||
|
|
.sprite-article-icon-write{width:26px;height:28px;background-position:-90px -68.5px!important}
|
||
|
|
.box-content-right{width:213px}
|
||
|
|
.article-content-category{padding-top:0!important}
|
||
|
|
.article-box-title span{display:block;margin-top:10px}
|
||
|
|
.article-box-title span::before{content:'\f111';font-family:'Font Awesome 5 Free';color:#000;font-size:6px;margin-right:5px;font-weight:900}
|
||
|
|
.box-article-paging tr{display:flex; align-items:center; justify-content:flex-end;}
|
||
|
|
.box-article-paging td{display:flex; align-items:center; justify-content:center; }
|
||
|
|
.pagingViewed{
|
||
|
|
width: 30px;
|
||
|
|
height: 30px;
|
||
|
|
background: #FFB800;
|
||
|
|
text-align: center;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: block;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #000;
|
||
|
|
font-weight:700;
|
||
|
|
cursor: pointer;
|
||
|
|
margin-left: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pagingIntact:hover{
|
||
|
|
background: #FFB800;
|
||
|
|
color: #000;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pagingIntact{
|
||
|
|
width: 30px;
|
||
|
|
height: 30px;
|
||
|
|
background: #fff;
|
||
|
|
text-align: center;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: block;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #000;
|
||
|
|
margin-left: 10px;
|
||
|
|
border: 0.750264px solid #D9D9D9;
|
||
|
|
|
||
|
|
font-weight:700;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
.box-article-paging{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding-top:23px;margin-bottom:70px}
|
||
|
|
.article-box-detail{margin-top:18px}
|
||
|
|
.article-box-detail p{line-height:32px}
|
||
|
|
.article-box-detail h2,.article-box-detail h3{margin:12px 0}
|
||
|
|
.article-box-detail ol,.article-box-detail ul{padding-left:20px}
|
||
|
|
.article-box-detail img{margin:0 auto;padding:16px 0;width:unset;max-width:100%;height:auto}
|
||
|
|
.article-box-detail .toc_title img{width:30px}
|
||
|
|
.article-image-detail{height:unset!important;width:50%}
|
||
|
|
.article-item-detail{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
|
||
|
|
.list-item-artilce-detail{gap:29px!important}
|
||
|
|
.article-image-detail h4{bottom:10px!important}
|
||
|
|
.article-detail-text{width:calc(50% - 18px)}
|
||
|
|
.article-detail-text .line-clamp-2{-webkit-line-clamp:3;margin:0 0 10px!important}
|
||
|
|
.article-detail{margin-bottom:0!important}
|
||
|
|
.article-box-detail .archor-text-group{background-color:#f6f5f5;border-radius:20px;padding:16px 20px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:15px 0 23px}
|
||
|
|
.article-box-detail .archor-text-group ol{padding-bottom:20px}
|
||
|
|
.text-fint-toc img{margin-right:16px;}
|
||
|
|
#js-outp a{display:block;margin-bottom:8px;}
|
||
|
|
.box-home-artilce-left{width:calc(100% - 25% - 40px)}
|
||
|
|
.box-home-artilce-right{margin-left: 40px;}
|
||
|
|
.article-page .swiper-article-slider h2{font-size:28px;margin: 4px 0 6px;line-height: 30px;}
|
||
|
|
.col-left-bottom h4{font-size:16px;}
|
||
|
|
.col-left .article-box-heading{font-size: 20px !important;}
|
||
|
|
.article-page .article-box .article-text{font-size: 16px;}
|
||
|
|
.article-page .article-box-heading{font-size:20px !important;}
|
||
|
|
.article-page .article-hero-content .wrapper h5{font-size: 14px;}
|
||
|
|
.article-page .article-hero-content .wrapper{margin: 6px 0 4px;}
|
||
|
|
|
||
|
|
.article-category ul{font-size: 16px;}
|
||
|
|
.artilce-feature-right-top h5{font-size:14px;}
|
||
|
|
|
||
|
|
.section-category-article .article-box-heading{font-size: 20px !important;line-height: 23px;}
|
||
|
|
.section-category-article .article-box-title{margin-bottom:20px;}
|
||
|
|
.section-category-article .article-box ul{gap:16px!important;}
|
||
|
|
.section-category-article .article-box ul li{margin-bottom: 12px;}
|
||
|
|
.article-page .section-category-article .grid{gap:40px;}
|
||
|
|
.section-category-article .article-box .article-text{font-size:16px;}
|
||
|
|
.section-category-article .text-date{margin:0 18px 0 6px;}
|
||
|
|
|
||
|
|
.article-newest .title{margin-bottom: 20px;display: block;width: 100%;border-bottom: 1px solid #E1E1E1;}
|
||
|
|
.artilce-feature-right-top li{flex-direction: column;}
|
||
|
|
.artilce-feature-right-top a img{max-width: 100% !important;width: 100%;}
|
||
|
|
.artilce-feature-right-top h5{color: #DA251C;font-size:16px;}
|
||
|
|
|
||
|
|
.article-page .product-sale ul{margin-top:10px;}
|
||
|
|
.article-page .product-sale ul li .price{font-size:18px;color:#FA5252;margin-top:4px;}
|
||
|
|
.article-page .product-sale ul li .name{text-transform: uppercase;}
|
||
|
|
.article-page .product-sale ul li .box-img{filter: drop-shadow(0px 0.727989px 4.36793px rgba(0, 0, 0, 0.25));}
|
||
|
|
|
||
|
|
.article-detail .article-box-title{margin-bottom:12px;}
|
||
|
|
|
||
|
|
.box-home-artilce-left{width: calc(100% - 25% - 50px);}
|
||
|
|
.box-home-artilce-right{width: 25%;margin-left: 50px;}
|
||
|
|
|
||
|
|
.col-left-bottom{margin-top: 12px;}
|
||
|
|
.col-left-bottom h4{margin-top: 12px;font-size: 18px;height:40px}
|
||
|
|
.col-left-bottom .wrapper{margin: 4px 0;}
|
||
|
|
.col-left-bottom .article-hero{border-bottom:unset;padding-bottom:0;}
|
||
|
|
|
||
|
|
.col-left-top img{border-radius: 16px;width:100%;}
|
||
|
|
.article-page .article-hero:last-child{border-bottom:unset;}
|
||
|
|
.col-left-top .clock{width:auto;}
|
||
|
|
|
||
|
|
/*CART*/
|
||
|
|
.box-cart{
|
||
|
|
gap: 36px;
|
||
|
|
margin-top: 16px;
|
||
|
|
background: #fff;
|
||
|
|
padding: 0 12px 20px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
border-radius: 12px;
|
||
|
|
-webkit-border-radius: 12px;
|
||
|
|
-moz-border-radius: 12px;
|
||
|
|
-ms-border-radius: 12px;
|
||
|
|
-o-border-radius: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-left{
|
||
|
|
margin-top: 24px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-left .box-title .title{
|
||
|
|
font-size: 14px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-left .box-title .title a{
|
||
|
|
color: #FF5C00;
|
||
|
|
text-decoration: underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-left .fomr-login-cart{
|
||
|
|
width: 420px; background: #FFFFFF;
|
||
|
|
box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.25);
|
||
|
|
border-radius: 12px;
|
||
|
|
padding: 15px 15px 21px;
|
||
|
|
margin: 12px 0 26px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-left .fomr-login-cart input{
|
||
|
|
width: 100%;
|
||
|
|
padding: 11px;
|
||
|
|
border: 1px solid #D9D9D9;
|
||
|
|
border-radius: 5px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
outline: none;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-left .fomr-login-cart .btn-customer{
|
||
|
|
width: 163px;
|
||
|
|
background: #0079C8;
|
||
|
|
border-radius: 5px;
|
||
|
|
padding: 12px;
|
||
|
|
outline: none;
|
||
|
|
border: none;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #fff;
|
||
|
|
text-transform: uppercase;
|
||
|
|
margin-top:0;
|
||
|
|
display:block;
|
||
|
|
text-align:center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-info{
|
||
|
|
margin: 15px 0 17px;
|
||
|
|
text-transform: uppercase;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cart-customer-group input{
|
||
|
|
width: 100%;
|
||
|
|
border: 1px solid #D9D9D9;
|
||
|
|
border-radius: 5px;
|
||
|
|
height: 40px;
|
||
|
|
padding: 10px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
color: #8D8D8D;
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-adress{
|
||
|
|
gap: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.cart-customer-group textarea{
|
||
|
|
height: 132px;
|
||
|
|
border: 1px solid #D9D9D9;
|
||
|
|
border-radius: 5px;
|
||
|
|
padding: 10px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
color: #8D8D8D;
|
||
|
|
outline: none;
|
||
|
|
width: 100%;
|
||
|
|
resize: none;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-input{
|
||
|
|
margin-top: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-input .ship{
|
||
|
|
margin-bottom: 15px;
|
||
|
|
font-size: 14px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-input .ship input{
|
||
|
|
width: 12px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-input .ship span{
|
||
|
|
margin-left: 12px;
|
||
|
|
line-height: 18px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-input .ship a{
|
||
|
|
display: block;
|
||
|
|
color: #F12027;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cart-item-info{
|
||
|
|
padding: 0 12px;
|
||
|
|
margin-bottom:20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-cart-right{
|
||
|
|
background: #F0F0F0;
|
||
|
|
height: max-content;
|
||
|
|
margin-top: 16px;
|
||
|
|
padding: 5px 12px 14px;
|
||
|
|
border-radius: 0px 0px 12px 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-product-cart{
|
||
|
|
padding: 15px 0 23px;
|
||
|
|
background: #FFFFFF;
|
||
|
|
border-radius: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-product-cart .cart-image{
|
||
|
|
margin-right: 26px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-product-cart .cart-image .img-item{
|
||
|
|
border: 1px solid #E1E1E1;
|
||
|
|
padding: 6px;
|
||
|
|
width: 92px;
|
||
|
|
display: block;
|
||
|
|
height: 92px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-product-cart .cart-image .img-item .icon-deal-cart{
|
||
|
|
width: 30px;
|
||
|
|
position: absolute;
|
||
|
|
left: -10px;
|
||
|
|
top: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-cart-price .cart-info-product{
|
||
|
|
font-size: 14px;
|
||
|
|
margin-top: 10px;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-cart-price.item-cart-price{
|
||
|
|
color: #0079C8;
|
||
|
|
font-size: 16px;
|
||
|
|
line-height: 24px;
|
||
|
|
font-weight: 700;
|
||
|
|
margin: 10px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.buy-quantity{
|
||
|
|
border: 1px solid #999999;
|
||
|
|
border-radius: 5px;
|
||
|
|
width: 60px;
|
||
|
|
height: 36px;
|
||
|
|
text-align: center;
|
||
|
|
font-weight: 700;
|
||
|
|
outline: none;
|
||
|
|
margin-left: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.button-remove-pro{
|
||
|
|
margin-top: 14px;
|
||
|
|
font-size: 14px;
|
||
|
|
line-height: 17px;
|
||
|
|
color: #8D8D8D;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.button-remove-pro:hover{
|
||
|
|
color: #0079C8;
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-payment{
|
||
|
|
border-top: 1px solid #D9D9D9;
|
||
|
|
margin-top: 16px;
|
||
|
|
padding: 12px 12px 0;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
|
||
|
|
.total-product{
|
||
|
|
margin-top: 16px;
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-pey-method{
|
||
|
|
margin-top: 27px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.list-pay-method .label-container span{
|
||
|
|
font-size: 14px;
|
||
|
|
margin-left: 11px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.list-pay-method .label-container input{
|
||
|
|
cursor: pointer;
|
||
|
|
width: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.list-pay-method .label-container{
|
||
|
|
margin-bottom: 16px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cart-btn-buy button{
|
||
|
|
cursor: pointer;
|
||
|
|
background: #0079C8;
|
||
|
|
border-radius: 5px;
|
||
|
|
line-height: 44px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #fff;
|
||
|
|
text-transform: uppercase;
|
||
|
|
width: 100%;
|
||
|
|
border: none;
|
||
|
|
margin: 20px 0 15px;
|
||
|
|
font-weight: 700;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.cart-btn-buy button:hover{
|
||
|
|
color: red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-continute{
|
||
|
|
text-align: center;
|
||
|
|
width: 100%;
|
||
|
|
display: block;
|
||
|
|
color: #0079C8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-continute:hover{
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
|
||
|
|
.customer-province{overflow:inherit!important}
|
||
|
|
.item-province{position:relative}
|
||
|
|
.customer-item{width:100%;float:left;position:relative;margin-bottom:10px}
|
||
|
|
.customer-item .list-province{width:100%;float:left;overflow:auto;position:absolute;top:100%;left:0;z-index:10;-webkit-box-shadow:0 0 3px 0 #ccc;box-shadow:0 0 3px 0 #ccc;background:#fff;display:none}
|
||
|
|
.customer-item .list-province .search-province{width:100%;float:left;padding:10px;position:relative}
|
||
|
|
.customer-item .list-province .search-province i{position:absolute;z-index:1;font-size:16px;color:#999;right:20px;top:21px}
|
||
|
|
.customer-item .list-province .search-province-list{width:100%;float:left;max-height:400px;overflow:auto;list-style:none;margin:0;padding:0}
|
||
|
|
.customer-item .list-province li{width:100%;float:left;padding:0 10px;line-height:30px;font-size:14px;color:#288ad6;cursor:pointer}
|
||
|
|
.customer-item .list-province li:hover{background:#288ad6;color:#fff}
|
||
|
|
.item-province input{width:100%}
|
||
|
|
|
||
|
|
|
||
|
|
.send-cart-error,.send-cart-success{max-width:824px;margin:auto}
|
||
|
|
.send-cart-title{padding:30px 10px;text-align:center}
|
||
|
|
.send-cart-title-name{font-weight:600;color:var(--pink);font-size:28px;margin-bottom:8px}
|
||
|
|
.send-cart-title-descreption{font-weight:300;font-size:14px;line-height:20px;text-align:center}
|
||
|
|
.red-text{color:var(--pink)}
|
||
|
|
.send-cart-title-descreption a{font-weight:700;text-decoration:none}
|
||
|
|
.send-cart-info{padding:20px 15px;margin-top:12px;background:#f2f2f2;font-weight:300}
|
||
|
|
.send-cart-info p{margin-bottom:16px;width:100%}
|
||
|
|
.send-cart-info b{font-weight:700;width:200px;display:inline-block}
|
||
|
|
.send-cart-info span{width:calc(100% - 200px)}
|
||
|
|
.send-cart-detail-product{margin-top:15px;-webkit-box-shadow:0 0 5px 0 rgb(0 0 0 / 20%);box-shadow:0 0 5px 0 rgb(0 0 0 / 20%);border:1px solid #dee2e6!important}
|
||
|
|
.send-cart-product-title{padding:20px 15px;font-size:18px;font-weight:600;text-transform:uppercase;border-bottom:1px solid #dee2e6}
|
||
|
|
.send-cart-product-info{display:-webkit-box;display:-ms-flexbox;display:flex;padding:15px;width:100%;border-bottom:1px solid #dee2e6}
|
||
|
|
.send-cart-item-left{width:82px;margin-right:8px;text-align:center}
|
||
|
|
.send-cart-item-left img{width:100%;height:100%}
|
||
|
|
.send-cart-item-center a{font-size:14px;font-weight:600;color:#222;text-decoration:none}
|
||
|
|
.send-cart-item-center{width:362px}
|
||
|
|
.send-cart-item-right{width:calc(100% - 362px - 82px);text-align:right;line-height:20px}
|
||
|
|
.new-price,.total-price{font-size:18px;color:var(--pink);font-weight:800}
|
||
|
|
.new-price{color:#000!important}
|
||
|
|
.old-price{font-size:16px;color:#888;text-decoration:line-through}
|
||
|
|
.number-item{font-weight:700;font-size:12px}
|
||
|
|
.total-item{color:var(--pink);font-size:16px;font-weight:800}
|
||
|
|
.send-cart-total{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;padding:15px}
|
||
|
|
.send-cart-total p:first-child{font-size:16px;font-weight:700}
|
||
|
|
.again-cart{display:block;text-decoration:none;padding:22px 0 100px;text-align:center;color:var(--pink);font-weight:600;font-size:22px;text-transform:uppercase}
|
||
|
|
.send-cart-item-center a:hover{color:#d60000}
|
||
|
|
.send-cart-error-descreption{text-align:center}
|
||
|
|
.send-cart-error-title{color:var(--pink);font-size:28px;font-weight:700;margin:15px 0}
|
||
|
|
.send-cart-error-descreption p:nth-child(3){font-size:15px;margin-bottom:15px}
|
||
|
|
.send-cart-error-descreption p:last-child{font-size:15px;margin-bottom:48px}
|
||
|
|
.sprite-send-cart-face{background-position:-103px -96.5px!important;width:30px;height:30px;background-size:155px 131.5px!important;margin:0 auto}
|
||
|
|
.customer-content-group{max-width:825px;margin:20px auto;-webkit-box-shadow:0 0 7px 0 rgb(0 0 0 / 20%);box-shadow:0 0 7px 0 rgb(0 0 0 / 20%);background:#fff;padding:20px 0}
|
||
|
|
|
||
|
|
.message-voucher{margin-bottom:10px;}
|
||
|
|
|
||
|
|
|
||
|
|
/*DEAL HOME*/
|
||
|
|
.box-deal-home{
|
||
|
|
margin: 0 0 26px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-deal-home .title-deal{
|
||
|
|
color: #FF3636;
|
||
|
|
margin: 20px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-deal-home .title-deal .title{
|
||
|
|
font-size: 24px;
|
||
|
|
margin: 0 20px 0 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.global-time-deal p{
|
||
|
|
width: 42px;
|
||
|
|
height: 42px;
|
||
|
|
background: #FF3636;
|
||
|
|
color: #fff;
|
||
|
|
margin-right: 6px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
border-radius: 5px;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.global-time-deal span{
|
||
|
|
margin-right: 6px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-deal-right{
|
||
|
|
color: #49A0D9;
|
||
|
|
font-size: 14px;
|
||
|
|
text-decoration: underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-content-deal .p-img{
|
||
|
|
position: relative;
|
||
|
|
margin-bottom: 12px;
|
||
|
|
padding-bottom: 100%;
|
||
|
|
border-radius: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-content-deal .p-img img{
|
||
|
|
position: absolute;
|
||
|
|
margin: auto 0;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
right: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-content-deal .p-item{
|
||
|
|
background: #FFFFFF;
|
||
|
|
border-radius: 15px;
|
||
|
|
padding:15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-content-deal .p-name{
|
||
|
|
font-weight: 400;
|
||
|
|
font-size: 16px;
|
||
|
|
line-height: 20px;
|
||
|
|
margin-bottom: 6px;
|
||
|
|
height:40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-content-deal .p-summary{
|
||
|
|
font-size: 13px;
|
||
|
|
line-height: 18px;
|
||
|
|
color: #999999;
|
||
|
|
height:54px;
|
||
|
|
margin-bottom:14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.ws-pre-line {
|
||
|
|
white-space: pre-line;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-price-deal{margin-bottom:22px;}
|
||
|
|
|
||
|
|
.box-price-deal .p-price{color: #0079C8;font-size: 18px;line-height: 24px;margin-right:10px;font-weight: 700;}
|
||
|
|
.box-price-deal .p-market-price{font-size: 14px;line-height: 24px;color: #9E9E9E;text-decoration-line: line-through;}
|
||
|
|
|
||
|
|
.p-quantity-sale {
|
||
|
|
position: relative;
|
||
|
|
height: 20px;
|
||
|
|
font-size: 10px;
|
||
|
|
line-height: 12px;
|
||
|
|
text-align: center;
|
||
|
|
margin-top: 12px;
|
||
|
|
width: calc(100% - 43px - 20px);
|
||
|
|
margin-right: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.icon-fire-deal{
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
bottom: 0;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
.p-quantity-sale p {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
background: repeating-linear-gradient(to right,#ffb800 0,#ff7a30 50%,#ffb800 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;
|
||
|
|
border-radius: 10px;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.p-quantity-sale .bg-gradient{
|
||
|
|
background: linear-gradient(270deg, #FFB800 0%, #FF7A30 100%);
|
||
|
|
opacity: 0.3;
|
||
|
|
border-radius: 10px;
|
||
|
|
height: 100%;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.p-quantity-sale span {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%,-50%);
|
||
|
|
color: #fff;
|
||
|
|
font-weight: 500;
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.box-content-deal .p-item .btn-cart-product{
|
||
|
|
width: 43px;
|
||
|
|
height: 43px;
|
||
|
|
background: #49a0d9;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.box-content-deal .p-item .btn-cart-product .cart{
|
||
|
|
width: 26px;
|
||
|
|
height: 26px;
|
||
|
|
display: block;
|
||
|
|
background-position: -123px -24px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.product-pricing-features{
|
||
|
|
background: #FFFFFF;
|
||
|
|
border: 1px solid #FF3636;
|
||
|
|
border-radius: 12px;
|
||
|
|
padding: 15px 15px 20px;
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.product-pricing-features .title-top{
|
||
|
|
margin-bottom:15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.product-pricing-features .title-top h2{
|
||
|
|
font-weight: 700;
|
||
|
|
font-size: 22px;
|
||
|
|
line-height: 27px;
|
||
|
|
color: #FF3636;
|
||
|
|
margin-left: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.wrapper-title .title{
|
||
|
|
font-size:12px;
|
||
|
|
font-weight: 600;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.wrapper-title .global-time-deal p{
|
||
|
|
width:36px;
|
||
|
|
height:36px;
|
||
|
|
font-size:20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.wrapper-title .p-quantity-sale {width:100%;margin-left:10px;}
|
||
|
|
|
||
|
|
#deal-line-detail{width: 42%;}
|
||
|
|
|
||
|
|
|
||
|
|
.fixed-nav .logo{width: 4% !important;}
|
||
|
|
|
||
|
|
@-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}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 1610px) {
|
||
|
|
html{font-size:16px}
|
||
|
|
.container{max-width:1610px}
|
||
|
|
.header .header-top-left .txt,.header .header-top-right .item{font-size:16px}
|
||
|
|
.form__input{width:750px}
|
||
|
|
.form__input .searh-form-container{height:42px}
|
||
|
|
.form__input .submit-search{height:50px}
|
||
|
|
.header .header-mid .logo{margin-left:65px}
|
||
|
|
.header .header-mid-right .item{width:60px;height:50px;margin-right:16px}
|
||
|
|
.header .header-mid-right .item.cart-home{padding:0 10px}
|
||
|
|
.header .header-bottom .item .txt{font-size:14px}
|
||
|
|
.product-item .name-product{font-size:14px}
|
||
|
|
.homepage .group-product-category .group-title .name,.homepage .feedback-customer .title h2{font-size:24px}
|
||
|
|
.homepage .group-product-category .group-title{padding:20px 10px}
|
||
|
|
.homepage .feedback-customer{margin:30px 0}
|
||
|
|
.category-deal{grid-template-columns: repeat(5,1fr);}
|
||
|
|
.product-pricing-features .title-top h2{font-size:24px}
|
||
|
|
.wrapper-title .title{font-size:16px;}
|
||
|
|
.wrapper-title .global-time-deal p{width:42px;height:42px;}
|
||
|
|
|
||
|
|
}
|