/* ============================================================ CSS gộp — Hoa Anh Đào. Mốc chia: 768px. MỤC LỤC 1. Mục lục (khối chú thích này) 2. Mobile — nguyên văn assets/mobi/css/style2.css, bọc @media (max-width: 767px) 3. Desktop — nguyên văn assets/front/css/main2.css, bọc @media (min-width: 768px) 4. Ghi đè co giãn — chỉ áp dưới 1170px, từ 1170px trở lên giữ nguyên Mục 2 và 3 là bản sao nguyên văn, không đổi thứ tự thuộc tính. Mọi điều chỉnh mới chỉ đặt ở mục 4. ============================================================ */ /* ===== 2. MOBILE ===== */ @media (max-width: 767px) { @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-regular-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-regular-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-regular-webfont.ttf) format("truetype");font-weight:400;font-style:normal} @font-face{font-family:"Roboto Condensed";src:url(../../fonts/roboto/robotocondensed-regular-webfont.woff2) format("woff2"),url(../../fonts/roboto/robotocondensed-regular-webfont.woff) format("woff"),url(../../fonts/roboto/robotocondensed-regular-webfont.ttf) format("truetype");font-weight:400;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-italic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-italic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-italic-webfont.ttf) format("truetype");font-weight:400;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-bold-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-bold-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-bold-webfont.ttf) format("truetype");font-weight:700;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-bolditalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-bolditalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-bolditalic-webfont.ttf) format("truetype");font-weight:700;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-medium-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-medium-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-medium-webfont.ttf) format("truetype");font-weight:500;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-mediumitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-mediumitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-mediumitalic-webfont.ttf) format("truetype");font-weight:500;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-light-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-light-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-light-webfont.ttf) format("truetype");font-weight:300;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-lightitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-lightitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-lightitalic-webfont.ttf) format("truetype");font-weight:300;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-black-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-black-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-black-webfont.ttf) format("truetype");font-weight:900;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-blackitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-blackitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-blackitalic-webfont.ttf) format("truetype");font-weight:900;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-thin-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-thin-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-thin-webfont.ttf) format("truetype");font-weight:100;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-thinitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-thinitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-thinitalic-webfont.ttf) format("truetype");font-weight:100;font-style:italic} @font-face{font-family:Avo;src:url(../../fonts/utm_avo/UTM_Avo.ttf);font-weight:400} @font-face{font-family:Avo;src:url(../../fonts/utm_avo/UTM_AvoBold.ttf);font-weight:700} @font-face{font-family:OpenSans;src:url(../../fonts/open-sans/OpenSans-Regular.ttf);font-weight:400} @font-face{font-family:OpenSans;src:url(../../fonts/open-sans/OpenSans-Semibold.ttf);font-weight:500} @font-face{font-family:OpenSans;src:url(../../fonts/open-sans/OpenSans-Light.ttf);font-weight:300} @font-face{font-family:Myriad Semibold;src:url(../../fonts/myriad/MYRIADPRO-SEMIBOLD.woff2) format("woff2"),url(../../fonts/myriad/MYRIADPRO-SEMIBOLD.woff);font-weight:normal;font-style:normal} html{-webkit-text-size-adjust:100%} *{-webkit-overflow-scrolling:touch} body{margin:0;padding:0;font-family:Helvetica,Arial,sans-serif;font-size:11pt;color:#636466;transition:background-color .5s} body,input,button,option,textarea,label,legend,h1,h2,h3,h4,h5,h6,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:#444;font:13px/20px Roboto,Helvetica,Arial,sans-senif;outline:medium none} input{display:block;background:#fff} h1,h2,h3,h4,h5,h6,figure,ul,li{padding:0;margin:0} ul,li{padding:0;margin:0;list-style:none} a{text-decoration:none;color:#333} a:hover{color:#636466} .flex_box_row,.flex_box_column{display:flex} .flex_box_row{flex-direction:row} .flex_box_column{flex-direction:column} .article_search::before { content: "\f002"; font-family: FontAwesome; color: #4E4E4E; font-size: 16px; } .article_search { border: medium none; cursor: pointer; float: right; height: 32px; position: absolute; width: 32px; z-index: 0; background: 0 0; right: 5px; top: 5%; } .fit-category { max-height: 160px; width: 100%; object-fit: cover; overflow: hidden; border-radius: 10px; } .item_genki .title{position: relative;} .item_genki .title:after { content: ""; background: #575050; width: 60%; height: 1px; position: absolute; bottom: -2px; left: 21%; } figure{margin:0} .swal2-title{font-weight:400!important;line-height:25pt!important;font-size:20pt} .swal2-content{font-family:Opensans;font-weight:300} @media all and (min-width: 320px) { body{padding-top:97px} .nav-up{top:-97px} header{height:95px;position:fixed;top:0;transition:top .2s ease-in-out;width:100%;background:#fff;background:rgba(255,255,255,.97);border-bottom:1px solid #f5f5f5;z-index:99999} header .topBar{color:#fff;background-image: linear-gradient(to right,#ECEEED,#EDEFEE);;cursor:pointer} header .topBar i{font-size:13pt} header .topBar p{margin:0;padding:5px 0;text-align:center;font-weight:700;font-size: 11px;color: #040605;} header .mainMenu{margin:10px 0} header .mainMenu .flex_box_row .item{padding:0 5px;text-align:center;cursor:pointer;} header .mainMenu .flex_box_row .item i{font-size:16pt} header .mainMenu .flex_box_row .item svg{width:24px;height:24px;display:block;margin:auto;color:#000} header .mainMenu .flex_box_row .item .title{font-size:8pt;line-height:20px} header .mainMenu .flex_box_row .logo{flex-grow:1;margin:0;padding:0} header .mainMenu .logo img{width:50px} header .mainMenu .flex_box_row{align-items:center} header .mainMenu #numProInCart{pointer-events:none;position:absolute;top:35px;background:#ff3200;color:#fff;border-radius:50px;width:20px;height:20px;padding:0;right:10px;font-weight:700;font-size:8pt;text-align:center} .sidenav{height:100%;width:0;position:fixed;z-index:9999;top:0;left:0;background-color:#fff;overflow-y:scroll;overflow-x:hidden;transition:.3s;padding-top:0;max-width:100%} .sidenav a{transition:.3s} .menu-mobile-header { position: sticky; top: 0; z-index: 2; height: 56px; display: flex; align-items: center; justify-content: center; grid-gap: 12px; padding: 0 20px; background: #E5E5E5; } .menu-mobile-search-input { width: 100%; border-radius: 100px; border: solid 1px #ebebeb; background-color: #fff; padding: 0 12px; display: flex; align-items: center; } .mobile-search-input { width: 100%; height: 30px; outline: none; border: 0; border-radius: 0; padding: 0; margin: 0; font-size: 14px; line-height: 1.43; font-weight: 400; } .closebtn{color: #fff; font-size: 27px;} .closebtn:hover{color:#fff} header .searchMain{position:absolute;z-index:10000;top:0;left:0;right:0;background:#fff;bottom:0;display:none;width:100vw;height:150vh;background-color:hsla(0,0%,100%,.97)} header .searchMain .topBox{padding:8px;background: #a5a5a5;} header .searchMain .searchInput{flex-grow:1;border-radius:5px;margin-right:10px;background:#fff;align-items:center} header .searchMain .searchInput input{flex-grow:1;border:none;background:none;font-size:11pt;text-indent:0;margin:0;padding:0} header .searchMain .searchInput i{font-size:12pt;padding:0 12px} header .searchMain .btnCancel{line-height:37px;color:#fff;font-size:10pt;cursor:pointer} nav .group{border-bottom:1px solid #e6e6e6;max-width:450px;margin:auto;padding:0 20px} nav .group:last-child{border-bottom:none} nav .group ul{margin-left:20px} nav .group .title{font-weight:700;padding:12px 0;text-transform:uppercase;color:#000} nav .group .title i{float:right} nav .group ul li{padding:10px 0} nav .group ul li:first-child{padding-top:0} .menu .groupUser{background:#f5f5f5;text-align:center;padding:15px 0} .menu.logged .groupUser.Info{background-image:linear-gradient(to right,#ed4596,#f59a8e)} .menu.logged .groupUser .avt{border-radius:100px;overflow:hidden;border:1px solid #fff;display:inline-block;width:50px;height:50px} .menu.logged .groupUser .nameUser{font-weight:700;color:#fff;font-size:13pt;line-height:20pt} .menu .groupUser.flex_box_row{padding-top:0} .menu.logged .groupUser.flex_box_row{padding-top:15px} .menu .groupUser a{text-align:center;width:43%;display:inline-block;margin:0 5px;border-radius:5px;font-weight:700;max-width:450px} .menu .groupUser .btnRegister{color:#e90b5a;border:1px solid #e90b5a;padding:9px 0} .menu .groupUser .btnLogin{background-image:linear-gradient(to right,#ed4596,#f59a8e);color:#fff;padding:10px 0} .menu .groupUser .btnLogOut{color:#e90b5a;position:absolute;right:0;top:5px;width:auto;background:#fff;padding:5px 10px;font-weight:400} .menu .groupUser .item svg{display:block;width:24px;height:24px;margin:0 auto 10px} .menu .groupUser.flex_box_row a{font-weight:400;font-size:8pt} nav .menuLv2{display:none} header .groupInfo{background:#f5f5f5;align-items:center;justify-content:center} header .groupInfo .icon svg{height:20px} header .groupInfo .icon{padding:20px;width:60px;text-align:center} header .groupInfo .detail{flex-grow:1;padding:20px 20px 20px 0} header .listAutoComplete .all{overflow-y:scroll;height:70vh;box-shadow:0 5px 15px 0 #e5e5e5;padding:10px 25px} header .listAutoComplete li{border-bottom:1px solid #e6e6e6;padding:5px 0} header .listAutoComplete li a{font-size:10pt;color:#636466} header .listAutoComplete li a:hover{color:#ed4596} header .listAutoComplete li.title{font-weight:500;color:#555;margin-top:15px;text-transform:uppercase;font-size:10.5pt;font-family:OpenSans} header .listAutoComplete li.title span{text-transform:none;font-weight:300;display:none} header .listAutoComplete ul:first-child li.title{margin-top:0} section .groupPrice .priceBig{font-size:13pt;font-weight:300;position:relative} section .groupPrice .priceFinal{color: #E52558;font-weight: bold;} section .groupPrice .priceDiscount{position:relative} section .groupPrice .linethow{text-decoration:line-through;color:#999} .list_image_detail{position:relative} .list_image_detail .downPercent{position: absolute;top: 0;color: #ffff;font-size: 17px;text-align: center;padding: 5px 0;width: 48px;z-index: 100;background: #FB1D56;left: 22px;font-weight: bold;border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;} .list_image_detail .downPercent:after{content:"";width:0;height:0;left:0;bottom:-8px;position:absolute;} .buy1get1free{position:absolute;top:17px;right:5px;background:rgba(255,212,36,.9);color:#ee4d2d;font-size:7pt;text-align:center;padding:2px 0;width:36px;font-weight:700;font-family:Arial;z-index:2;animation-name:buy1get1free;animation-duration:2s;animation-iteration-count:infinite} .buy1get1free:after{content:"";width:0;height:0;left:0;bottom:-8px;border-style:solid;position:absolute;border-width:0 18px 8px;border-color:transparent rgba(255,212,36,.9)} } @keyframes buy1get1free { 0%{color:red} 50%{color:#fff} 100%{color:red} } .banner_header_product{text-align:center;z-index:1;position:absolute;left:0} .promotion_limited{font-weight:700;text-align:center;font-family:Roboto;font-size:14px;overflow:hidden;background:linear-gradient(90deg,red,yellow,red);background-size:60%;animation:animate 3s linear infinite;-webkit-background-clip:text;-webkit-text-fill-color:rgba(255,255,255,0);margin-top:0} @keyframes animate { 0%{background-position:-500%} 100%{background-position:100%} } .header_large{width:100%;left:0;} .header_small{width:100%;} .title_brand{font-family: Myriad Semibold;color: #333;text-align: center;font-size: 15px;} section#promotion .bannerFull{line-height:12px} section#promotion .bannerFull img{max-width:100%} section#promotion .container{background:#fff;margin:15px auto;max-width:95%} section#promotion .listProduct li{display:inline-block;width:45%;vertical-align:top;cursor:pointer;margin:35px 2%} section#promotion .listProduct li figure{text-align:center} section#promotion .listProduct li figure img{height:200px} section#promotion .listProduct li .price{font-weight:700;margin:5px 0} section#promotion .listProduct li h2{margin:5px 0;font-size:11pt;min-height:40px} section#promotion .listProduct li .price .dl{text-decoration:line-through;color:#999;font-weight:400} section#promotion .listProduct li .btnAddCart{border:1px solid #717476;text-align:center;padding:5px;font-size:10pt;text-transform:uppercase} section#promotion .listProduct li:hover .btnAddCart{border-color:#ef4679;color:#ef4679} section#promotion .ckProduct{margin:auto} section#promotion .ckProduct .deCk{display:flex;float:none;margin:10px auto;align-items:center;max-width:425px} section#promotion .ckProduct .deCk .ttCK{line-height:20px;width:100%;font-size:10pt} footer{border-top:5px solid #f5f5f5;margin-top:25px;background: #F3F3F3;} .list-about-footer{border-bottom: 1px solid #898989!important; margin-left: 13px; margin-right: 13px;} .list-about-footer .fa-chevron-down:before { color: #666; display: block; float: left; font-family: FontAwesome; font-size: 15px; font-style: normal; font-weight: 400; margin-left: 5px; text-align: center; width: 35px; } .footer-actions a { width: 35px; height: 80px; } .footer-actions img { width: 49px; height: 63px; } .list-about-footer li { font-size: 13px; margin-left: 20px; padding-bottom: 10px; font-weight: 600;} .footer-actions a{padding: 0px 4px;} footer .listLink{text-align:center;max-width:580px;margin:30px auto 20px} footer .listSocial li{display:inline-block;margin:0 10px} footer .listSocial li i{color:#fff;font-size:15pt} footer .listSupport li{display:inline-block;width:46%;text-align:center;vertical-align:top;padding:10px 5px} footer .listSupport li a{font-size:10pt;font-family:OpenSans;font-weight:400} footer .listSupport li i{width:20px;text-align:center} footer .coppyRight{text-align:center;margin:20px 0;font-size:8pt} footer .coppyRight ul li{display:inline-block;border-right:1px solid #ccc;margin-left:-3px;padding:0 15px} footer .coppyRight ul li:last-child{border:none} footer .listInfo{max-width:580px;margin:auto} footer .listInfo .lv1{background:#f5f5f5;border-bottom:1px solid #fff;min-height:55px;line-height:55px} footer .listInfo a{align-items:center} footer .listInfo a span{flex-grow:1} footer .listInfo svg{width:20px;padding:15px 25px} footer .listInfo a i{padding-right:25px} footer .listInfo .lv1 .lv2{background:#fff;padding-left:70px;display:none} footer .backTop i{font-weight:700;font-size:18pt} footer .backTop{text-align:center;cursor:pointer;color:#e90b5a;font-weight:700} footer .infoShip{background:#f5f5f5;padding:20px 0;font-size:14pt;margin:28px 0;font-family:OpenSans;font-weight:500} footer .infoHelp{text-align:center;line-height:20px;margin-bottom:0;margin-top:25px;font-size:10pt} footer .infoHelp span{color:#e90b5a;font-weight:700} footer .appInfo{text-align:center;margin-bottom:25px} footer .appInfo p{font-family:OpenSans;line-height:18pt;font-weight:500} footer .appInfo p span{font-weight:400} footer .appInfo ul li{display:inline-block} footer .appInfo ul li img{width:125px} .hotline-phone-ring-wrap{position:fixed;bottom:0;left:0;z-index:999999} .hotline-phone-ring{position:relative;visibility:visible;background-color:transparent;width:110px;height:110px;cursor:pointer;z-index:11;-webkit-backface-visibility:hidden;-webkit-transform:translateZ(0);transition:visibility .5s;left:0;bottom:0;display:block} .hotline-phone-ring-circle{width:85px;height:85px;top:10px;left:10px;position:absolute;background-color:transparent;border-radius:100%;border:2px solid #e60808;-webkit-animation:phonering-alo-circle-anim 1.2s infinite ease-in-out;animation:phonering-alo-circle-anim 1.2s infinite ease-in-out;transition:all .5s;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;opacity:.5} .hotline-phone-ring-circle-fill{width:55px;height:55px;top:25px;left:25px;position:absolute;background-color:#ef4679;border-radius:100%;border:2px solid transparent;-webkit-animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;transition:all .5s;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%} .hotline-phone-ring-img-circle{background-color:#ef4679;width:33px;height:33px;top:37px;left:37px;position:absolute;background-size:20px;border-radius:100%;border:2px solid transparent;-webkit-animation:phonering-alo-circle-img-anim 1s infinite ease-in-out;animation:phonering-alo-circle-img-anim 1s infinite ease-in-out;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;align-items:center;justify-content:center} .hotline-phone-ring-img-circle .pps-btn-img{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex} .hotline-phone-ring-img-circle .pps-btn-img img{width:20px;height:20px} .hotline-bar{position:absolute;background:#ef4679;height:40px;width:150px;line-height:40px;border-radius:3px;padding:0 10px;background-size:100%;cursor:pointer;transition:all .8s;-webkit-transition:all .8s;z-index:9;box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.1);border-radius:50px!important;left:33px;bottom:37px;display:none} .hotline-bar > a{color:#fff;text-decoration:none;font-size:15px;font-weight:700;text-indent:50px;display:block;letter-spacing:1px;line-height:40px;font-family:Arial} .hotline-bar > a:hover,.hotline-bar > a:active{color:#fff} @-webkit-keyframes phonering-alo-circle-anim{0%{-webkit-transform:rotate(0) scale(0.5) skew(1deg);-webkit-opacity:.1}30%{-webkit-transform:rotate(0) scale(0.7) skew(1deg);-webkit-opacity:.5}100%{-webkit-transform:rotate(0) scale(1) skew(1deg);-webkit-opacity:.1}}@-webkit-keyframes phonering-alo-circle-fill-anim{0%{-webkit-transform:rotate(0) scale(0.7) skew(1deg);opacity:.6}50%{-webkit-transform:rotate(0) scale(1) skew(1deg);opacity:.6}100%{-webkit-transform:rotate(0) scale(0.7) skew(1deg);opacity:.6}}@-webkit-keyframes phonering-alo-circle-img-anim{0%{-webkit-transform:rotate(0) scale(1) skew(1deg)}10%{-webkit-transform:rotate(-25deg) scale(1) skew(1deg)}20%{-webkit-transform:rotate(25deg) scale(1) skew(1deg)}30%{-webkit-transform:rotate(-25deg) scale(1) skew(1deg)}40%{-webkit-transform:rotate(25deg) scale(1) skew(1deg)}50%{-webkit-transform:rotate(0) scale(1) skew(1deg)}100%{-webkit-transform:rotate(0) scale(1) skew(1deg)}} a,.add_cart,.owl-buttons div{transition:all .2s ease 0s} a{text-decoration:none;color:#444} ul{list-style:none} .containerpx{position:fixed;width:100%;background:#fff;border-bottom:1px solid #E2E2E2;z-index:99999;height:50px;box-shadow:0 3px 10px 0 rgba(0,0,0,0.05)} .containerpx img{height:43px} .containerpx .menu{top:15px!important} .containerpx .cart_header{margin-top:15px!important} a.cart{background-position:left 0 top -32px;float:right} .right_logo{position:absolute;right:10px;top:0} .right_logo .cart_header{background:url(../../mobi/icon/cart.png) no-repeat;width:20px;height:25px;display:block;margin-top:20px;float:right} .list_menu_h{clear:both;padding:0;height:96px;position:relative} .container{clear:both;margin:auto;color:#000} .menuRight .iteam_menu{width:31%;padding:20px 0} .menuRight_ac .iconVipRight{height:45px!important;padding-top:20px!important} .menuRight_ac{top:50px!important} section{margin:auto;max-width:640px;width:100%;overflow:hidden} aside.banner{ clear: both; margin-top: 10px; overflow: hidden; width: 97%; padding: 0px 6px;} .aside.banner .owl-controls{display:table} aside.homenews{clear:both;margin:4px;background:#fff;border-radius:4px} aside.banner .sl{clear:both;display:block} .searchAjaxTop,.searchAjaxTopBt{background:none repeat scroll 0 0 #FFF;border:1px solid #ececec;box-shadow:0 1px 3px rgba(204,204,204,0.5);clear:both;margin-top:0;overflow:hidden;position:absolute;width:563px;z-index:10;display:none} .searchAjaxTopBt a,.searchAjaxTopBt span{color:#444!important} .searchAjaxTop ul,.searchAjaxTopBt ul{padding:0;margin:0;list-style:none} .searchAjaxTop ul li,.searchAjaxTopBt ul li{height:25px;line-height:25px;padding-left:5px} .searchAjaxTop ul li.le,.searchAjaxTopBt ul li.le{background:#F6F6F6;color:#555} .searchAjaxTop ul li:hover,.searchAjaxTopBt ul li:hover{background:#d5e8f4;cursor:pointer;color:#d6392b} .searchAjaxTop ul li a,.searchAjaxTopBt ul li a{float:left;height:25px;overflow:hidden;padding-right:10px;width:440px} .searchAjaxTop ul li span,.searchAjaxTopBt ul li span{float:right;padding-right:5px;text-align:right} .searchAjaxTop ul li a:hover,.searchAjaxTopBt ul li a:hover{color:#d7042b} aside.homenews figure,.right_product_A figure{border-top:6px solid #f8f8f8;clear:both;font-size:14px;height:32px;line-height:32px;margin:7px 0 0;padding:0;text-align:left;text-transform:uppercase} .homenews .banner_news{clear:both} .homenews .banner_news .iamges{float:left;width:90px;padding-right:10px;max-height:60px;overflow:hidden;position:relative} .homenews .banner_news .banner_news_in h3{position:relative;display:inline} .homenews .banner_news .iamges img{max-width:100%;border-radius:2px} .homenews .banner_news .banner_news_in{clear:both;border-bottom:1px solid #eee;padding:8px 10px} .menuRight{background:rgba(0,0,0,.75);box-shadow:0 1px 2px rgba(0,0,0,0.2);position:fixed;top:64px;width:100%;z-index:99999;border-top:1px solid #ccc;display:none;height:100%} nav{background:#fff} .menuRight a:hover{color:#333} .iconVipRight{background:#ef4679 none repeat scroll 0 0;height:50px;padding-top:14px;position:absolute;left:0;text-align:center;top:-65px;width:57px;cursor:pointer;color:#fff} .menuHiden{padding-left:20px;display:none} .menuHiden ul li{padding-top:5px;padding-bottom:5px} .iconVipRight span:before{content:"\f00d";font-family:FontAwesome;display:block;font-family:FontAwesome;font-size:16px;margin-top:-3px;position:relative} aside.homenews h3 a,.right_product_A h3 a{font-size:14px} aside.homenews figure a,.right_product_A figure a{display:inline-block;float:left;padding-left:15px;padding-right:16px;position:relative;font-weight:700} .price_cgg{color:#ef4679;} .price{display: flex;flex-direction: column;height: 25px;} aside.homenews .date-time{color:#9e9e9e;display:block;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:11px;font-weight:700;margin-left:10px;margin-top:-25px;position:absolute} .slider_row_top_home{margin-top:20px} aside.homenews .date-time .fa:before{content:"";display:inline-block;font-family:FontAwesome;font-feature-settings:normal;font-kerning:auto;font-language-override:normal;font-size:inherit;font-size-adjust:none;font-stretch:normal;font-style:normal;font-synthesis:weight style;font-variant:normal;font-weight:400;line-height:1;margin-right:3px;text-rendering:auto;transform:translate(0px,0px)} .search_boder{background:#929599 none repeat scroll 0 0;clear:both;padding:3px} aside.slider_row{clear:both;position:relative} div.navicate{clear:both;height:34px;position:relative;z-index:99} .navicate-new a span{font-size: 12px;} .slider_row_top_home .navicate{padding-bottom:4px} .line-before, .line-after {content: "";position: absolute;top: 50%;border: 1px solid #e5e5e5;width: 21%;} .line-before {left: 6px;} .line-after {right: 5px;} .navicate_thd{height:43px!important;padding-top:5px} div.navicate .parent{text-align:center;margin:-1px;padding-left:14px;padding-right:14px;display: flex;background: linear-gradient(to left, #f8d2c0, #fbeed7, #f8d2c0);justify-content: center;align-items: center;} .iteam_menu{width:19%;text-align:center;overflow:hidden;display:inline-block;vertical-align:top} .iteam_menu a{display:block;clear:both} .iteam_menu a img{max-width:51px} .menu_inbout{clear:both;position:relative;background:#fff;border-radius:3px} .iteam_menu .h_titie_menu{color:#000;line-height:14px;font-size:12px;padding-left:4px;padding-right:4px;font-weight:700} div.navicate .parent a{font-size:23px;line-height:36px;color:#545051;font-weight:700;letter-spacing: 1.5px;} .menuHidenth{width:800px!important;margin-left:-600px!important} .menuHidenth li{width:150px!important;float:left;height:22px} .menuHidenth li a{font-weight:400!important;font-size:13px!important} div.navicate div.sub i:before{color:#ccc;content:"\f105";display:block;float:right;font-family:FontAwesome;font-size:18px;font-style:normal;font-weight:400;line-height:16px;margin-left:10px;margin-right:6px;margin-top:2px} .slider_row .baner_row{clear:both;display:block;height:auto;width:100%} .item-buy-category p {border-top: 2px solid #e5e5e5;padding: 10px 0px 10px 0px;background: #e5e5e5;margin-bottom: 0;font-size: 16px;color: #343434;} .price{font:400 15px/22px Helvetica,Arial,sans-senif} sup{top:-.5em} sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline} .lc__section-review { color: #767979; } .u-flex { display: flex; align-items: center; } .box-title { font-size: 20px; padding: 10px; } .badge { display: inline-block; padding: 0.25em 0.4em; font-size: 61%; font-weight: 700; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 3px; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; background: #FE1D55; color: #fff; } .lc__reviews-rating { border-top: 1px solid #F1F3F2; border-bottom: 1px solid #F1F3F2; padding: 17px 0px; } .lc__reviews-rating .list { display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .lc__reviews-rating .list .item { flex: 0 0 100%; max-width: 100%; } .lc__starviews { text-align: center; } .txt-tit { font-size: 18px; padding-bottom: 14px; } .lc__starviews .number { font-size: 42px; color: #FE1D55; font-weight: 600; } .lc__rating-star i:before { color: #B2B2B2; display: block; float: left; font-family: FontAwesome; font-size: 16px; font-style: normal; font-weight: 400; text-align: center; width: 15px; content: "\f005"; cursor: pointer; margin-right: 5px; } .lc__rating-star i.active:before { color: #FDC558; } .txt-view { font-size: 14px; color: #9ba0ab; padding-top: 20px; } .lc__reviews-progressviews { padding: 10px; } .progress-line.progress-sm { height: 8px; border-radius: 6px; } .lc__cmt-block { padding: 14px; border-bottom: 1px solid #ddd; } .lc__cmt-block:last-child{border-bottom: none;} .avatar-rounded .avatar-picture, .avatar-circle .avatar-picture { display: flex; justify-content: center; align-items: center; background: #b6c0ce; padding: 15px 22px; border-radius: 50%; } .lc__cmt-content { position: relative; padding-left: 14px; } .avatar-name { font-weight: 700; font-size: 17px; } .comment-month .lc__rating-star { justify-content: start; } .lc__cmt-content--full { font-size: 17px; } .lc__cmt-avatar { margin-right: 10px; } .ratings{clear:both;display:table;font-size:11px;margin:auto;position:relative;text-align:left} .rating-box::before{font-family:"FontAwesome";content:"\f005\f005\f005\f005\f005";letter-spacing:2px;color:#ccc;position:relative} .rating-box .rating::before{content:"\f005\f005\f005\f005\f005";font-family:"FontAwesome";letter-spacing:2px} .rating-box .rating{color:#000;height:20px;overflow:hidden;position:absolute;top:0;left:0} .slider_row .selling .images{clear:both;display:block;height:170px;overflow:hidden;padding-top:7px} .slider_row .selling .images img{vertical-align:middle;max-height:170px} .owl-carousel .owl-wrapper:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0} .owl-carousel{display:none;position:relative;width:100%;-ms-touch-action:pan-y} .owl-carousel .owl-wrapper{display:none;position:relative;-webkit-transform:translate3d(0px,0px,0px)} .owl-carousel .owl-wrapper-outer{overflow:hidden;position:relative;width:100%} .owl-carousel .owl-wrapper-outer.autoHeight{-webkit-transition:height 500ms ease-in-out;-moz-transition:height 500ms ease-in-out;-ms-transition:height 500ms ease-in-out;-o-transition:height 500ms ease-in-out;transition:height 500ms ease-in-out} .owl-carousel .owl-item{float:left} .row_product_km .owl-controls{display:none!important} .thuong_hieu_list{clear:both;text-align:center;background:#fff;margin-left:4px;margin-right:4px;padding:10px 4px 4px;border-radius:4px} .thuong_hieu_list a{padding-left:10px} .thuong_hieu_list a img{padding-right:10px} .timmer_deal_brand{display: flex;align-items: center;} .item_count_down{display: inline-block;padding: 1px 0px;text-align: center;width: 25px;border-radius: 5px;color: #838383;background: #FEFEFE;font-weight: 700;font-size: 12px;margin: 0px 5px;vertical-align: top;} .owl-controls .owl-page,.owl-controls .owl-buttons div{color: #fff;font-size: 24px;font-style: normal;font-weight: 400;height: 30px;line-height: 25px;padding-left: 8px;position: absolute;right: 50%;width: 13px;border-radius: 2px 0 0 2px;background: none; bottom: -35px;} .owl-controls{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)} .grabbing{cursor:url(grabbing.png) 8 8,move} .owl-carousel .owl-wrapper,.owl-carousel .owl-item{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)} .owl-origin{-webkit-perspective:1200px;-webkit-perspective-origin-x:50%;-webkit-perspective-origin-y:50%;-moz-perspective:1200px;-moz-perspective-origin-x:50%;-moz-perspective-origin-y:50%;perspective:1200px} .owl-fade-out{z-index:10;-webkit-animation:fadeOut .7s both ease;-moz-animation:fadeOut .7s both ease;animation:fadeOut .7s both ease} .owl-fade-in{-webkit-animation:fadeIn .7s both ease;-moz-animation:fadeIn .7s both ease;animation:fadeIn .7s both ease} .owl-backSlide-out{-webkit-animation:backSlideOut 1s both ease;-moz-animation:backSlideOut 1s both ease;animation:backSlideOut 1s both ease} .owl-backSlide-in{-webkit-animation:backSlideIn 1s both ease;-moz-animation:backSlideIn 1s both ease;animation:backSlideIn 1s both ease} .owl-goDown-out{-webkit-animation:scaleToFade .7s ease both;-moz-animation:scaleToFade .7s ease both;animation:scaleToFade .7s ease both} .owl-goDown-in{-webkit-animation:goDown .6s ease both;-moz-animation:goDown .6s ease both;animation:goDown .6s ease both} .owl-fadeUp-in{-webkit-animation:scaleUpFrom .5s ease both;-moz-animation:scaleUpFrom .5s ease both;animation:scaleUpFrom .5s ease both} .owl-fadeUp-out{-webkit-animation:scaleUpTo .5s ease both;-moz-animation:scaleUpTo .5s ease both;animation:scaleUpTo .5s ease both} @-webkit-keyframes empty {0%{opacity:1}} @-moz-keyframes empty {0%{opacity:1}} @keyframes empty{0%{opacity:1}}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-moz-keyframes fadeIn{0%{opacity:0}100%{opacity:1}} @keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@-moz-keyframes fadeOut{0%{opacity:1}100%{opacity:0}} @keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@-webkit-keyframes backSlideOut{25%{opacity:.5;-webkit-transform:translateZ(-500px)}75%{opacity:.5;-webkit-transform:translateZ(-500px) translateX(-200%)}100%{opacity:.5;-webkit-transform:translateZ(-500px) translateX(-200%)}}@-moz-keyframes backSlideOut{25%{opacity:.5;-moz-transform:translateZ(-500px)}75%{opacity:.5;-moz-transform:translateZ(-500px) translateX(-200%)}100%{opacity:.5;-moz-transform:translateZ(-500px) translateX(-200%)}} @keyframes backSlideOut{25%{opacity:.5;transform:translateZ(-500px)}75%{opacity:.5;transform:translateZ(-500px) translateX(-200%)}100%{opacity:.5;transform:translateZ(-500px) translateX(-200%)}}@-webkit-keyframes backSlideIn{0%,25%{opacity:.5;-webkit-transform:translateZ(-500px) translateX(200%)}75%{opacity:.5;-webkit-transform:translateZ(-500px)}100%{opacity:1;-webkit-transform:translateZ(0) translateX(0)}}@-moz-keyframes backSlideIn{0%,25%{opacity:.5;-moz-transform:translateZ(-500px) translateX(200%)}75%{opacity:.5;-moz-transform:translateZ(-500px)}100%{opacity:1;-moz-transform:translateZ(0) translateX(0)}} @keyframes backSlideIn{0%,25%{opacity:.5;transform:translateZ(-500px) translateX(200%)}75%{opacity:.5;transform:translateZ(-500px)}100%{opacity:1;transform:translateZ(0) translateX(0)}}@-webkit-keyframes scaleToFade{to{opacity:0;-webkit-transform:scale(.8)}}@-moz-keyframes scaleToFade{to{opacity:0;-moz-transform:scale(.8)}} @keyframes scaleToFade{to{opacity:0;transform:scale(.8)}}@-webkit-keyframes goDown{from{-webkit-transform:translateY(-100%)}}@-moz-keyframes goDown{from{-moz-transform:translateY(-100%)}} @keyframes goDown{from{transform:translateY(-100%)}}@-webkit-keyframes scaleUpFrom{from{opacity:0;-webkit-transform:scale(1.5)}}@-moz-keyframes scaleUpFrom{from{opacity:0;-moz-transform:scale(1.5)}} @keyframes scaleUpFrom{from{opacity:0;transform:scale(1.5)}}@-webkit-keyframes scaleUpTo{to{opacity:0;-webkit-transform:scale(1.5)}}@-moz-keyframes scaleUpTo{to{opacity:0;-moz-transform:scale(1.5)}} @keyframes scaleUpTo {to{opacity:0;transform:scale(1.5)}} aside.slider_row .row_product{clear:both;margin:auto;margin:4px;border-radius:4px;overflow:hidden} aside.slider_row .owl-buttons div{color:#fff;font-size:24px;font-style:normal;font-weight:400;height:30px;line-height:25px;padding-left:8px;position:absolute;right:25px;top:21%;width:13px;border-radius:2px 0 0 2px;background: none;} aside.slider_row .owl-buttons div:hover{background:#808283} aside.slider_row .row_product .owl-item .images,aside.product_l .product_item .images,.row_product_lq .images{clear:both;display:block;height:196px;overflow:hidden;text-align:center;font-weight:700} aside.slider_row .row_product .owl-item h2,.row_product_lq .owl-item h2{clear:both;height:36px;overflow:hidden;padding:5px;text-align:center} aside.slider-cate .owl-buttons div{top: 31%;} aside.slider_row .row_product .owl-item h2 a{color:#666;font-size:13px;font-style:normal;font-weight:400} aside.banner img{width:100%;border-radius: 10px;} aside.slider_row .row_product .owl-item h2 a:hover{color:#e11f26} aside.slider_row .row_product .owl-item .price,aside.product_l .product_item .price,.row_product_lq .price{clear:both;font-size:15px;margin:auto;text-align:center;font-weight: bold;} aside.manufacturer{background:#fff none repeat scroll 0 0;display:table;padding-bottom:20px;width:100%} .banner_home .owl-controls{display:table;margin:-5px auto auto;overflow:hidden;position:relative} .banner_home .owl-controls .owl-buttons{display:none} .banner_home .owl-controls .owl-pagination div{float:left;margin:0 5px} .banner_home .owl-controls .owl-page span:hover,.banner_home .owl-controls .active span{background:#d62e4d!important} .banner_home .owl-controls .owl-page span{background:rgba(216,216,216,0.5) none repeat scroll 0 0;border-radius:20px;display:block;height:12px;margin:5px 1px 5px 4px;opacity:1;width:12px} .row_product_lq .row_product_h{clear:both;height:328px} /*aside.slider_row .row_product .row_product_h:nth-child(2n+1){border-right:2px solid #f3f3f3} aside.slider_row .row_product_km .row_product_h:nth-child(2n+1){border-right:4px solid #f3f3f3}*/ aside.slider_row .row_product_km .row_product_h{border-radius:4px} aside.slider_row .row_product .row_product_h{margin-right: 10px;overflow:hidden;padding-bottom:10px;text-align:center;background:#fff;position:relative;margin-bottom:2px;} /* .pro_pos_giga{background:#ef4679;position:absolute;float:right;padding:4px;color:#fff;border-radius:3px;height:30px;width:30px;text-align:center;line-height:30px;left:24px;top:42%} */ .pro_pos_giga{background:#ef4679;position:absolute;float:right;padding:4px;color:#fff;border-radius:35px;height:30px;width:30px;text-align:center;line-height:30px;left:117px;top:33%} .pro_pos_giga span{font-weight:700} aside.slider_row .row_product .row_product_h img{max-height:180px;max-width:100%} aside.slider_row .row_product .row_product_h .images{height:186px;border: 2px solid #D6D6D6;border-radius: 10px;} aside.slider_row .row_product .row_product_h h2{position: relative;font-weight:400;height:33px;overflow:hidden;padding:5px 15px;text-align:center;padding: 11px 0px;} aside.slider_row .row_product .row_product_h h2::after{content: ""; background: #c4c4c4; width: 140px; height: 2.2px; position: absolute; bottom: 1px; left: 50%; transform: translateX(-50%);} .connection-pnj { box-sizing: border-box; padding-top: 20px; margin-left: 13px; /* width: 100%; */ margin-bottom: 20px; } .footer-stay-connected{ margin-left: 13px; } .ty-footer-general__header { font-size: 18px; text-transform: uppercase; font-weight: bold; padding-bottom: 0px; } .connection-pnj h2 span { text-transform: uppercase; font-weight: 700; color: #282828; } .connect-us-outer { display: inline-block; } .connect-us-outer a { display: inline-block; text-align: center; margin-right: 7px; } .connect-us-outer i { display: inline-block; height: 35px; width: 35px; } .connection-pnj .ty-float-left { float: none; } .payment-methods-outer { margin-bottom: 0px; } .ty-footer-general__header { padding-right: 0; text-align: left; } .ty-footer-general__header span { font-size: 13px; color: #282828; } .payment-methods-inner { display: flex; justify-content: initial; } .payment-methods-inner > div { display: -ms- flexbox; display: -moz- flex; display: -webkit- flex; display: flex; } .payment-methods-inner > div .item { margin-right: 8px; } .payment-methods-inner > div img { width: 38px; } .title-chungnhan { font-size: 13px; font-weight: 700; padding: 5px 0 0; margin: 0 0 5px; color: #282828; text-transform: uppercase; } .actions-mobile{display: flex;align-items: center;justify-content: space-evenly;padding: 10px;} .actions-mobile a{display: flex;padding: 4px 6px;margin: 3px;border-radius: 4px;} .actions-mobile .more{display: flex;} .thuong_hieu_list-mobile .item{display: flex;align-items: center;padding: 6px;margin: 6px;border-radius: 50px;color: #333;text-align: center;justify-content: center;font-weight: bold;letter-spacing: 0.1px;} .thuong_hieu_list-mobile .item-cate{display: flex;align-items: center;background: #ef4679;padding: 8px;margin: 8px;border-radius: 50px;color: #fff;text-align: center;justify-content: center;} .thuong_hieu_list-mobile .owl-buttons div.owl-next:before{content: "\f105" !important;padding-left: 4px !important;} .thuong_hieu_list-mobile .owl-buttons div:before{color: #333;font-family: FontAwesome;font-size: 24px;font-style: normal;font-weight: normal;line-height: 29px;position: relative;text-align: center;transition: all 0.4s ease 0s;} .row_product_deal .owl-buttons div:before{color: #9C9C9C;font-family: FontAwesome;font-size: 24px;font-style: normal;font-weight: normal;line-height: 29px;position: relative;text-align: center;transition: all 0.4s ease 0s;} .row_product_deal .owl-buttons div.owl-next:before{content: "\f105" !important;padding-left: 4px !important;} .thuong_hieu_list-mobile .item.active{color: #E43256!important;} .thuong_hieu_list-v1{cursor: pointer;background: linear-gradient(to left, #f8d2c0, #fbeed7, #f8d2c0);} .buy-category-hot .item{display: flex; align-items: center;padding: 7px;} .buy-category-hot li {display: flex; align-items: center;} .buy-category-hot img{width: 30px;} .discount-hot {display: flex; align-items: center;justify-content: center;} .discount-hot .login-hot{padding: 2px 9px;border-radius: 3px;color: #414141;border: 1px solid;margin: 10px 0px 20px;} .receive-now{background: #ef4679;padding: 9px 20px;color: #fff;border-radius: 10px;} .mini-banner img{width: 100%;height: 100px;border-radius: 7px;} .mini-banner .item{padding: 10px;} .post-hot-wp { background: #f5f5f5; padding: 10px 0px 0px 0px; margin: 10px 0px 0px 0px; height: 334px; } .post-hot .item .title:after { content: ""; background: #575050; width: 60%; height: 1px; position: absolute; bottom: -3px; left: 21%; } .post-hot{margin-top: 14px;} .post-hot .item img{width: 100%;border-radius: 10px;} .post-hot .item .title { font-size: 14px; text-transform: uppercase; line-height: 1.5; position: relative; font-weight: bold; color: #4F4F4F; /* -webkit-text-stroke: thin; */ text-decoration: none; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; } .post-hot .item{padding: 0px 15px 0px 15px; text-align: center; display: block;} .item-hot .check{text-align: center;display: flex;justify-content: center;padding: 0px 5px;align-items: center;margin-top: 0px;position: absolute;bottom: 20px;left: 58px;} .item-hot .check .receive-now {font-size: 9px;background: #fd1d55;padding: 0px 1px;border-radius: 4px;color: #fff;font-weight: bold;width: 79px;} .item-hot .owl-item{width: 230px!important;} .brand-left li{display: flex; flex-direction: column; align-items: center; padding: 24px 3px; text-align: center; border-bottom: 2px solid #F5F6F5;} .brands{font-size: 18px;} .brand-right{padding: 10px;margin: 0px 3px;width: 800px;} .brand-left{width: 80%;} .brand-right .thuong_hieu_list{display: flex;flex-wrap: wrap;align-items: center;margin: 0;padding: 0px;justify-content: space-between;} .brand-right .thuong_hieu_list img{width: 100px;} .brand-right .list ul{display: flex;flex-wrap:wrap;} .brand-right .list ul .item{padding: 9px 7px;width: 27%;margin: 4px 4px 4px 0px;text-align: center;border-radius: 3px;} .img-menu{width: 100%;height: 100px;} .brand-right .item-parent {display: flex;justify-content: space-between;} .modal { position: fixed; top: 37px; left: 0; z-index: 1050; width: 100%; height: 100%; overflow: hidden; outline: 0; display: none; } .check-form-review { display: flex; align-items: center; padding-bottom: 10px; } .modal.is-visible { visibility: visible; display: block; } .modal-overlay { position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 100%; background: hsla(0, 0%, 0%, 0.5); opacity: 0; transition: visibility 0s linear 0.3s, opacity 0.3s; visibility: hidden; } .modal.is-visible .modal-overlay { opacity: 1; visibility: visible; transition-delay: 0s; } .modal-wrapper { position: absolute; z-index: 9999; top: 6em; left: 50%; width: 32em; margin-left: -16em; background-color: #fff; box-shadow: 0 0 1.5em hsla(0, 0%, 0%, 0.35); } .modal-header { position: relative; background-color: #fff; box-shadow: 0 1px 2px hsla(0, 0%, 0%, 0.06); display: flex; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: justify; justify-content: space-between; padding: 0.7rem 1rem; border-bottom: 1px solid #dee2e6; border-top-left-radius: calc(0.3rem - 1px); border-top-right-radius: calc(0.3rem - 1px); } .modal-heading { font-size: 1.125em; margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .close-review i:before { color: #666; display: block; float: left; font-family: FontAwesome; font-size: 20px; font-style: normal; font-weight: 400; margin-left: 5px; text-align: center; width: 35px; cursor: pointer; } .modal-body { padding: 2rem 2rem 0rem 2rem; } .modal-content { position: relative; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border-radius: 0.3rem; outline: 0; } .row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .col-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .col-md-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .form-group { margin-bottom: 1rem; margin-right: 11px; } .form-input { position: relative; display: block; width: 100%; font-family: inherit; padding: 5.5px 0px 5.5px 7px; color: #334155; background-color: #fff; background-clip: padding-box; border: 1px solid #d8e0e8; font-size: 11px; transition: all 0.3s; } .title-star { text-align: center; font-size: 16px; margin: 0; margin-bottom: 9px; } .lc__rating-star { display: flex; margin-bottom: 0; justify-content: center; } .lc__rating-star i:before { color: #B2B2B2; display: block; float: left; font-family: FontAwesome; font-size: 20px; font-style: normal; font-weight: 400; margin-left: 5px; text-align: center; width: 18px; content: "\f005"; cursor: pointer; } .modal-footer { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; align-items: center; -ms-flex-pack: end; justify-content: center; padding: 0.75rem; border-top: 1px solid #dee2e6; border-bottom-right-radius: calc(0.3rem - 1px); border-bottom-left-radius: calc(0.3rem - 1px); } .btn_evaluate { color: #fff; background-color: #6c757d; border-color: #6c757d; border: none; padding: 8px 24px; cursor: pointer; } .list-brand{padding-bottom: 10px;} .brand-right .list-post-head{display: flex;align-items: center;justify-content: space-between;} .brand-right .list-post-body img{width: 100%} .brand-right .list-post-body .title{font-weight: bold;font-size: 12px;} .brand-right .list-post-body .des{margin:0;font-size: 11px;} .brand-right .list-post-body .item{width: 100%} .brand-right .list-post-body .owl-item{width: 300px!important;} .brand-right .list-brand h2 span .fa-caret-right:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .brand-right .list-brand .all{display: flex;font-size: 12px;padding-right: 26px;} .brand-right .list-brand .all .fa-angle-right:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 15px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 14px;} .list-brand .item_lv2{ width: 30%; margin: 4px 4px 4px 0px; border-radius: 3px; text-align: center;} .form-cart .input-row{display: flex;justify-content: center;} .form-cart .input-row input{margin-top: 0;} .form-cart .select-row{margin: 10px 0px;} .form-cart .select-row select{ padding: 10px; border: 1px solid #dedede; border-radius: 5px;} .form-cart .address {width: 100%!important;} .form-cart .note {margin: 10px auto!important;} .complete-order-destop{display: none;} .complete-order-mobile{width: 90%!important;margin: 0px 16px!important;} .login-cart{margin: 15px 0px 0px;} .login-cart span:first-child{font-size: 12px;} .login-cart span:last-child{font-size: 12px;font-weight: bold;text-decoration: underline;} .thuong_hieu_list-mobile{margin: 20px 0px 10px 0px; padding: 0; height: 44px;} aside.manufacturer .row_manufacturer img{display:block;float:left;padding-left:20px;padding-right:20px;padding-top:11px} aside.manufacturer .row_manufacturer .sakura img{padding-top:0!important} .showroom{padding-left:6px;padding-right:6px;padding-top:2px} .clear{clear:both} .seeMore{background:#fff;cursor:pointer;display:block;overflow:hidden;padding:10px;position:relative;text-align:center;margin:14px 0 0;border-radius:2px} .seeMore span:before{content:"\f0d7";font-family:FontAwesome;font-size:14px} .fb:before{content:"\f09a"} .tw:before{content:"\f099"} .gg:before{content:"\f0d5"} .ytb:before{content:"\f167"} .ist:before{content:"\f16d"} .row_manufacturer{border-top:1px solid #dedede;margin-top:18px;padding-top:10px} .row_manufacturer .nav_manufacturer{float:left;font-size:15px;padding-right:18px;padding-top:18px} aside.slider_row .row_product .owl-item .price span,.slider_row .selling .price span,aside.product_l .product_item .price span,.row_product_lq .price span,.row_product .price span{color:#888!important;text-decoration:line-through;font-weight:400;margin-right:5px} .brackRum{font-size:12px} aside.navigation{clear:both;height:25px;line-height:25px;margin-top:93px} .cart_oder ul{clear:both;padding:8px} .cart_oder ul li{padding:15px 0} .bottom_cart li{clear:both} .cart_oder ul li.dg,.cart_oder ul li.tt{width:100px;text-align:center} .cart_oder ul li.sl{width:70px;text-align:center} .bottom_cart{border-bottom:1px solid #e3e3e3;border-left:1px solid #e3e3e3;border-right:1px solid #e3e3e3;overflow:hidden} .bottom_cart .cartImg{height:90px} .bottom_cart .cartImgIn{float:left;width:90px;text-align:center;margin-right:10px} .bottom_cart li{padding-top:5px;padding-bottom:5px} .bottom_cart li.dg,.bottom_cart li.tt{line-height:60px} .bottom_cart .capnhatCartTxt{border:1px solid #ddd;height:20px;line-height:20px;margin-top:17px;text-align:center;width:40px} .cart_oder{margin-top:10px;margin-left:4px;margin-right:4px} .cart_right{float:right;padding-bottom:8px;padding-top:5px} .btdatHang{background: #B4B4B4;clear:both;color:#fff;cursor:pointer;font-weight:700;height:34px;line-height:34px;padding-left:20px;padding-right:20px;text-align:center} .btdatHang:hover,.boxDathang .dhnBottomRight:hover{background:#d62e4d} .bottom_cart .tt,#tongTienCart{} .cart_left{clear:both;margin-bottom:10px;margin-top:15px} .cart_left #ma_giam_gia{border:1px solid #dedede;text-indent:5px;height:25px;float:right;width:70%;display:block;background:rgba(0,0,0,0) none repeat scroll 0 0} .cart_left_tt{clear:both;float:left;line-height:30px;font-weight:700} .tHBottomHClum{float:left;width:33.33%} .tHBottomHClum_ti{clear:both;font-weight:700;padding-left:5px} .Cart_title_pro{display:block;overflow:hidden;margin-bottom:5px;font-size:10pt;line-height:12pt} .delete_Cart{color:#B14C65;cursor:pointer;float:left;padding-right:10px} .delete_Cart:before{content:"\f057";font-family:FontAwesome;color:#B14C65;font-size:16px;padding-right:3px} .title_gio_hang{clear:both;font-weight:500;color:#333;padding:10px 0;text-indent:15px} .banner_km_h{clear:both;margin-left:4px;margin-right:4px;border-radius:2px;overflow:hidden;position:relative;margin-bottom:-10px} .boxDathang{background:#fff none repeat scroll 0 0;border-radius:2px;clear:both;padding-bottom:20px;overflow:hidden} .lineDhnh{clear:both;margin-left:4px;margin-right:4px;position:relative} .boxDathang .boxDathangTitile{clear:both;font-size:14px;padding:2px 10px;text-align:center} .boxDathang .boxDathangTitile .boxDathangTitileBot{clear:both;font-size:12px} .boxDathang .boxDathangTitile .boxDathangTitileTop{clear:both;color:#288ad6} .boxDathang input,.boxDathang textarea,.boxDathang .dhn_gioi_tinh{border:1px solid #dedede;margin-top:12px;line-height:20pt;text-indent:5px;background:rgba(0,0,0,0) none repeat scroll 0 0;display:block} .boxDathang #dhn_ho_ten{width: 100%!important} .boxDathang .inLhVews,.boxDathang .inLhVewsTex,.boxDathang #dhn_ho_ten{clear:both;display:block;width:90%;margin:10px auto;height:29px} .form-cart-destop{display: none!important} #dhn_Ghichu{height:100px} .boxDathang input{border-radius: 4px; padding: 6px 6px;} #dhn_email{width: 100%!important; margin-bottom: 10px;} #dhn_so_di_dong{width: 100%!important} .lineDhnh select{height:40px;width:91%;max-width:384px;padding-left:5px;border:1px solid #e5e5e5} .boxDathang .dhnBottomRight{background:#ef4679 none repeat scroll 0 0;color:#fff;margin:5px auto auto;padding:5px;text-align:center;width:184px;cursor:pointer;clear:both;border-radius:2px;line-height:20pt;font-weight:500} .title_nhan_hang{text-align:center;line-height:20px;text-indent:0} .title_nhan_hang span{display:block;font-weight: bold;} .title_nhan_hang span.xnHn_bt{line-height:25px!important;font-weight:400;color: #707070;} .error{border:1px solid #d62e4d!important;color:#d62e4d!important} .theleall{clear:both} .theleall img{display:block;width:100%;max-width:640px} h1.titile_km{clear:both;text-align:center;padding-top:15px;padding-bottom:10px;font-size:15px;font-weight:700} .btdatHang_TT{color:#444;cursor:pointer;padding-top:18px} .btdatHang_TT:before{content:"\f104";font-family:FontAwesome;margin-right:4px} .clear10px{clear:both;height:10px} #cart_dathang{overflow:hidden;padding-top:20px;width:100%} #cart_dathang .thongbao{padding-left:10px;padding-right:10px;display:block;text-align:center} .cart_oder_edut{clear:both} .menu_inbout .owl-next{display: none;} .giam_gia_cart{clear:both;text-align:right} .list-voucher{display: flex; flex-wrap: wrap;} .list-voucher img{ max-width: 94%; padding-left: 0; flex: 0 0 32.3%; display: flex;} .list-voucher .check{ text-align: center; display: flex; justify-content: center; align-items: center; margin-top: 0px; position: absolute; bottom: 5px; left: 35px;} .list-voucher .check .receive-now{ font-size: 9px; background: #fd1d55; padding: 1px 13px; border-radius: 4px; color: #fff; font-weight: bold; line-height: 14px;} .HotLineFootB{background:#f1f1f1 none repeat scroll 0 0;border-top:0 solid #d8d8d8;bottom:0;box-shadow:0 3px 8px rgba(3,3,3,0.26);color:#333;font-size:14px;padding-bottom:5px;padding-top:5px;position:fixed;text-align:center;width:100%;z-index:99999} .HotLineFootB a,.HotLineFootB a:hover{color:#d62e4d;font-weight:700;font-size:14px} .icon_check:before,.icon_trophy:before,.icon_hand_o_right:before,.icon_bolt:before,.icon_umbrella:before,.icon_double_right:before,.icon_f06b:before,.icon_sign_in:before,.icon_long_arrow_right:before,.icon_quote_left:before,.icon_quote_right:before{font-family:FontAwesome;margin-right:4px;float:left} .icon_check:before{content:"\f00c";font-size:14px;color:#d62e4d} .icon_trophy:before{content:"\f091";font-size:24px;color:#ffa001} .icon_hand_o_right:before{content:"\f0a4";font-size:24px;color:#38538a} .icon_bolt:before{content:"\f0e7";font-size:16px;color:#ffa001} .icon_umbrella:before{content:"\f0e9";font-size:25px;color:#666} .icon_double_right:before{content:"\f101";font-size:20px} .icon_f06b:before{content:"\f06b";font-size:22px;color:#666} .icon_sign_in:before{content:"\f090";font-size:16px;color:#fea204} .icon_long_arrow_right:before{content:"\f178";font-size:13px;color:#666} .icon_quote_left:before{content:"\f10d";font-size:20px} .icon_quote_right:before{content:"\f10d";font-size:20px} .yctvGioiThieu{padding-left:4px;padding-right:4px} .HotLineFootBl{float:left;margin-left:6px;padding-top:4px} .dhVFott{float:right;display:block;margin-right:4px;background:#ef4679;color:#fff!important;font-size:12px!important;padding:4px 10px} .bo_kem_tr_t{background:rgba(255,255,255,.7);clear:both;font-family:arial;font-size:14px;line-height:20px;padding:17px 4px;position:absolute;text-align:center;font-weight:700;z-index:500;bottom:37%;width:100%} .tai_sao_mhhad{clear:both;margin:4px;margin-top:4px;border-radius:2px;overflow:hidden;margin-top:15px} .showroom_kd img{width:100%;border-radius:2px} .showroom_kd_all .owl-controls{display:none!important} .showroom_kd_all{clear:both;position:relative} .tai_sao_mh_content .iteam_ts{clear:both;padding-bottom:9px;margin-left:4px} .xem_them{font-size:13px;font-weight:300;text-align:center;padding-top:12px;padding-bottom:12px;clear:both;background:#fff} .xem_them a span{font-weight:700} .ft_goi_mh{background:url(../../mobi/images/icon_phone.png) no-repeat left 18px;padding-left:35px;margin:20px auto 0;display:table} .ft_goi_mh .gmh_phone{clear:both;color:#ef4679;font-size:22px;padding-top:4px;padding-bottom:4px} .dkNmkmthad{clear:both;font-weight:700;padding-left:10px;padding-top:14px;font-size:14px} .dKemail{clear:both;height:30px;border:2px solid #fff;background:#fff;border-radius:2px} .dKemail input{width:69%;display:block;float:left;color:#333;height:24px;padding-left:17px;border:none;margin-top:2px} .dKemail_in{background:#929599;padding:3px;margin-top:6px} .dKemail button{float:right;color:#fff;background:#ef4679;display:block;height:35px;border:none;padding-left:16px;padding-right:16px;margin:-2px;border-radius:0 2px 2px 0} .dKemail_in{text-align:center;color:#fff} .footer_call_all{position:fixed;width:100%;bottom:0;z-index:500;background:#ef4679;left:0;right:0;box-shadow:0 0 10px 3px #ccc} .footer_call_all .call_left,.footer_call_all .call_right{float:left;width:50%;text-align:center;color:#fff;padding-top:10px;padding-bottom:10px;display:block;cursor:pointer;background-image:linear-gradient(to right,#ed4596,#f59a8e);text-transform:capitalize} .footer_call_all .call_left{background:#f3f3f3;color:#333} .footer_call_all .call_left i{color:red} .flex_column,.flex_row{display:flex;flex-wrap:nowrap;align-content:stretch} .flex_row{flex-direction:column} nav .login{text-align:center} nav .category{text-align:center} nav .infoApp,nav .login{clear:both;background:#f2f2f2} .infoApp h3{font-size:12pt;text-align:center;padding:15px 0;line-height:20pt;font-weight:300} .infoApp h3 span{font-weight:700} .infoApp .flex_column{text-align:center;justify-content:center} .infoApp .flex_item{margin:0 5px} .infoApp .flex_item img{width:150px} .step-indicator{border-collapse:separate;display:table;margin-left:0;position:relative;table-layout:fixed;text-align:center;vertical-align:middle;padding:20px 0} .step-indicator li{display:table-cell;position:relative;float:none;padding:0;width:1%} .step-indicator li:after{background-color:#e5e5e5;content:"";display:block;height:1px;position:absolute;width:100%;top:28px;left:50%} .step-indicator li:last-child:after{display:none} .step-indicator li.active .step{border-color:#ef4679;color:#ef4679} .step-indicator li .caption{color:#999;margin-top:5px;font-size:10pt} .step-indicator li.active .caption,.step-indicator li.active .step_icon i{color:#ef4679;border-color:#ef4679} .step-indicator li.complete:after{background-color:#ef4679} .step-indicator li.complete .caption{color:#ef4679} .step-indicator li.complete .step_icon i{background:#ef4679;color:#fff;border-color:#ef4679} .step-indicator li .step{background-color:#fff;border-radius:50%;border:1px solid $wizard-color-neutral;color:$wizard-color-neutral;font-size:$wizard-step-font-size;height:$wizard-step-width-height;line-height:$wizard-step-width-height;margin:0 auto;position:relative;width:$wizard-step-width-height;z-index:1} .step-indicator li:hover{cursor:pointer} .step-indicator .step_icon i{padding:15px;background:#fff;border-radius:50px;border:1px solid #999;position:relative;z-index:500;width:15px;color:#999} .des_pay i{border-style:solid;border-width:1px;border-radius:50px;display:inline-block;padding:10px;width:13px} .des_pay i.fa-check{color:#0F0;border-color:#0F0} .des_pay i.fa-times{color:red;border-color:red} nav .login{display:flex;justify-content:center} nav .login li{border-color:#ef4679;border-style:solid;border-width:1px;margin:10px;display:block;width:50%} nav .login li.bac_tra{background:#fff} nav .login li.bac_full{background:#ef4679} nav .login li.bac_tra a{color:#ef4679} nav .login li.bac_full a{color:#fff} nav .login li a{display:block;padding:8px 10px} .list_info_edit,.list_info_edit li{padding:0} .list_info_edit input{width:100%;display:block;padding:0;margin:5px auto 0;line-height:30px;text-indent:5px;background:rgba(0,0,0,0) none repeat scroll 0 0;border-color:#f9f9f9;color:#333;border-radius:0;display:block} .list_info_edit input.enabled{border-color:#d2d2d2} #editSaveInfo .edit{color:#00af1d;font-weight:700} #editSaveInfo .save{color:red;font-weight:700} .magiamgia{display:flex;align-items:center;border:1px solid #f59a8e;margin:10px 0 5px} .magiamgia .input{flex-grow:1;padding-right:5px} .magiamgia .input input{width:100%;border:none;text-indent:10px} #thongBaoMgg{color:red} .content_list .title{position: relative;} .content_list .title:after { content: ""; background: #575050; width: 60%; height: 1px; position: absolute; bottom: 2px; left: 21%; } #tt_tt,#tt_momo,#tt_zalo{margin:0 auto;display:block;text-align:center} #form_tt tr:last-child td{border-bottom:none;padding:8px 0} .multiColor{position:relative;margin-bottom:50px} .multiColor ul{position:absolute;left:0;right:0;z-index:100} .listColor li{border:1px solid #e5e5e5;margin:-1px 0;padding:0;cursor:pointer;background:#fff;clear:both;overflow:hidden} .listColor li:hover{background:#f0f0f0} .listColor li.item{display:none} .listColor li span{vertical-align:middle;height:28px;display:block;float:left} .listColor li span.colorCode{width:30px;margin-right:5px} .listColor li span.colorName{line-height:28px;text-indent:5px} .listColor li.seleted i{float:right;line-height:28px;margin-right:10px} #form_tt .fa.fa-square-o{color:#ccc} #form_tt .fa-check-square-o{color: #FC235C;font-size: 25px;} .multiColor .titleColor{font-weight:700;float:left;line-height:28px} .multiColor_2{margin-bottom:15px;text-align:center;border:1px solid #e5e5e5;padding:10px 0 5px;background:#fff} .multiColor_2 span{width:35px;height:35px;display:inline-block;cursor:pointer;margin-right:10px;border-width:2px;border-style:solid;box-shadow:2px 2px 5px 2px #ccc;border-radius:100px} .multiColor_2 span.selected{border-color:#f47d3a!important} .listMultiSize{display:inline-block} .listMultiSize li{display: inline-block;margin: 0px 2px;border: 1px solid #ccc;color: #333;padding: 3px 6px;cursor: pointer;} .itemPriceSizeHidden{display:none} .itemPriceSizeShow{display:block} .listMultiSize li.outOfStockSize,.listMultiSize li.outOfStockSize:hover{border-color:rgba(0,0,0,.09);color:#999;cursor:not-allowed} .listMultiSize li.selected,.listMultiSize li:hover{border-color:#f44578;color:#f44578} .listVideo li{position:relative} .listVideo img.icon{position:absolute;left:46%;top:45%} .listVideo img.image{max-width:100%} .listVideo img.icon{width:60px} .list_brand {display: inline-flex;} .list_brand_child {margin:0 30px 0 30px!important;font-weight: bold;} .brand_right_button { width: 94%; font-weight: bold; font-size: 10pt; text-align: center; display: flex; background: #a5a5a5; color: #fff; justify-content: center; padding: 5px 0px; border-radius: 6px;} @media all and (min-width: 320px) { aside.banner iframe{width:95%;height:214px;margin:0 11px} } @media all and (min-width: 400px) { aside.slider_row .row_product .row_product_h .images{height: 186px;border: 2px solid #D6D6D6;border-radius: 10px;} .header_small{top: 0} } @media all and (min-width: 480px) { aside.banner iframe{height:257px;margin:0 13px} } @media all and (min-width: 600px) { header .topBar p{font-size:11pt} header .mainMenu .flex_box_row .item{padding:0 10px} .menu .groupUser a{width:46%} footer .appInfo p{line-height:23pt;font-size:15pt} aside.banner iframe{height:340px;margin:0 15px} } .mobile-footer { font-family: Arial, sans-serif; padding: 15px; } .footer-section { border-bottom: 1px solid #ccc; margin-bottom: 10px; } .accordion-toggle { width: 100%; text-align: left; padding: 14px; font-size: 16px; background-color: #f8f8f8; border: none; outline: none; font-weight: bold; display: flex; justify-content: space-between; align-items: center; cursor: pointer; } .accordion-toggle i { transition: transform 0.3s ease; } .accordion-toggle.active i { transform: rotate(180deg); } .accordion-content { max-height: 0; overflow: hidden; transition: all 0.3s ease; padding-left: 15px; } .accordion-content a, .accordion-content p { display: block; padding: 10px 0; font-size: 15px; color: #333; text-decoration: none; } .accordion-content a:hover { color: #e74c3c; } } /* ===== hết mục 2 ===== */ /* ===== 3. DESKTOP ===== */ @media (min-width: 768px) { .slide-container{margin:0 auto} .slide-stage{clear:both;height:340px;position:relative} .slide-image{left:0;position:absolute;top:0;opacity:0;display:none} .slide-image:first-child{opacity:1;display:block} .slide-pager{height:20px} .slide-pager ul{clear:both} .slide-pager-slot{cursor:pointer;display:block;float:left;list-style:outside none none;margin-right:5px;margin-top:6px;overflow:hidden;width:166px} .slide-pager-slot:last-child{margin-right:0!important} .slide-pager ul .focus:before,.slide-pager-slot:hover:before{border:4px solid #e74c3c;content:"";display:block;height:58px;position:absolute;width:160px} @font-face{font-family:FontAwesome;src:url(../../fonts/fontawesome-webfont.eot?v=4.3.0);src:url(../../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format("embedded-opentype"),url(../../fonts/fontawesome-webfont.woff2?v=4.3.0) format("woff2"),url(../../fonts/fontawesome-webfont.woff?v=4.3.0) format("woff"),url(../../fonts/fontawesome-webfont.ttf?v=4.3.0) format("truetype"),url(../../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format("svg");font-weight:400;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-regular-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-regular-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-regular-webfont.ttf) format("truetype");font-weight:400;font-style:normal} @font-face{font-family:"Roboto Condensed";src:url(../../fonts/roboto/robotocondensed-regular-webfont.woff2) format("woff2"),url(../../fonts/roboto/robotocondensed-regular-webfont.woff) format("woff"),url(../../fonts/roboto/robotocondensed-regular-webfont.ttf) format("truetype");font-weight:400;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-italic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-italic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-italic-webfont.ttf) format("truetype");font-weight:400;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-bold-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-bold-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-bold-webfont.ttf) format("truetype");font-weight:700;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-bolditalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-bolditalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-bolditalic-webfont.ttf) format("truetype");font-weight:700;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-medium-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-medium-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-medium-webfont.ttf) format("truetype");font-weight:500;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-mediumitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-mediumitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-mediumitalic-webfont.ttf) format("truetype");font-weight:500;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-light-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-light-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-light-webfont.ttf) format("truetype");font-weight:300;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-lightitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-lightitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-lightitalic-webfont.ttf) format("truetype");font-weight:300;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-black-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-black-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-black-webfont.ttf) format("truetype");font-weight:900;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-blackitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-blackitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-blackitalic-webfont.ttf) format("truetype");font-weight:900;font-style:italic} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-thin-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-thin-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-thin-webfont.ttf) format("truetype");font-weight:100;font-style:normal} @font-face{font-family:Roboto;src:url(../../fonts/roboto/roboto-thinitalic-webfont.woff2) format("woff2"),url(../../fonts/roboto/roboto-thinitalic-webfont.woff) format("woff"),url(../../fonts/roboto/roboto-thinitalic-webfont.ttf) format("truetype");font-weight:100;font-style:italic} @font-face{font-family:MANE;src:url(../../fonts/sfu-avantgardeitcbybt-book.otf);font-weight:400;font-style:normal} @font-face{font-family:Myriad Semibold;src:url(../../fonts/myriad/MYRIADPRO-SEMIBOLD.woff2) format("woff2"),url(../../fonts/myriad/MYRIADPRO-SEMIBOLD.woff);font-weight:normal;font-style:normal} body{padding:0;margin:0;background:#fff} body,button,h1,h1 a,h2,h2 a,h3,h3 a,h4,h4 a,h5,h5 a,h6,h6 a,input,label,legend,option,textarea{color:#444;font:13px/20px Muli,Roboto,Helvetica,Arial,sans-senif;outline:medium none} figure,h1,h2,h3,h4,h5,h6,li,ul{padding:0;margin:0} .add_cart,.owl-buttons div,a{transition:all .2s ease 0s} a{text-decoration:none;color:#444;transition:all .2s ease 0s} ul{list-style:none} header .topbar{background:#e9e9e9;color:#fff;font-size:13px;height:30px;border-radius: 5px;} header .topbar .hotline_r{float:right;padding-right: 15px;} header .topbar a{color:#1F1F1F; font-weight: 600;} header .topbar div{line-height:30px; justify-content: space-between; align-items: center;color: #1F1F1F;font-weight: 600;} header .topbar .pTitile{float:left;} header .topbar .title{float:left;position: relative;padding: 0px 25px;} header .topbar .about-hoaanhdao{float:left;position: relative;padding: 0px 25px;} header .topbar .about-hoaanhdao::after { content: ""; background: #1F1F1F; width: 1px; height: 16px; position: absolute; top: 6px; right: 12px; } header .topbar .title::after{content: "";background: #1F1F1F; width: 1px;height: 16px;position: absolute;top: 6px;right: 12px;} header h1 img,header h2 img, header .logo_had img{width:68px} header .topbar .pDetail{color:#fff;float:left;font-family:Arial,sans-senif;font-size:15px;font-weight:500;line-height:33px;font-weight:700;margin-right:10px} .pTitileTongd{padding-left:29px} a.cart{background-position:left 0 top -32px;float:right;padding-left:30px} .container{clear:both;margin:auto;width:1170px;position:relative;display:table} header h1,header h2, header .logo_had{margin:60px 0 0 504px;padding:6px 10px 0;position:absolute;z-index:9} header h1 strong,header h2 strong{text-indent:-999em;overflow:hidden;position:absolute;font-size:0} header .formSearch{background:#fff none repeat scroll 0 0;width:397px;z-index:10;height:32px;border-radius:1px;position:absolute;top:68px;border:1px solid #d5d5d5;border-radius:5px;padding:2px 0px;} header .actions{background:#fff none repeat scroll 0 0;width:495px;z-index:10;height:92px;border-radius:1px;position:absolute;top:55px;border-radius:21px;padding:2px 0px;right: -15px;} header .actions a{background: transparent;padding: 8px 19px;margin: 4px 1px;border-radius: 10px;font-size: 10px;font-weight: bold;align-items: center;display: flex;text-transform: uppercase;} header .actions a span{transform: translateY(3px);} header .actions .action-order{display: flex;justify-content: end;} header .actions .action-order .cart-header{display: flex;justify-content: center;position: relative;} header .actions .action-order .cart-header .num-cart-header{position: absolute;background: #ff589c;color: #fff;font-size: 11px;bottom: 25px;height: 21px;width: 6px;display: flex;align-items: center;border-radius: 14px;left: 92px;} header .actions .auth-header{display: flex;justify-content: center;align-items: center;} .thuong_hieu_list{cursor:pointer;} .thuong_hieu_list-v1{cursor:pointer;background: linear-gradient(to left, #f8d2c0, #fbeed7, #f8d2c0);border-radius: 6px;} .thuong_hieu_list-v1 a .fa-chevron-down:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 10px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;} .fa-info-circle:before{ color: #666; display: block; float: left; font-family: FontAwesome; font-size: 19px; font-style: normal; font-weight: 400; text-align: center; padding-right: 10px;} .fa-sign-out-alt:before{color: #666; display: block; float: left; font-family: FontAwesome; font-size: 19px; font-style: normal; font-weight: 400; text-align: center; padding-right: 10px;} .thuong_hieu_list .owl-item{text-align:center} .thuong_hieu_list li{text-align:center;display:flex;align-items:center;height:70px;justify-content:center;color: #333;border-radius: 59px;font-weight: bold;font-size: 13px;} .thuong_hieu_list-v1 li.active{color: #FD1F56;font-weight: bold;} .thuong_hieu_list-v1 li.active .fa-chevron-down:before{color: #FD1F56;font-weight: bold;} .see_more-wp{text-align: end;} .see_more{color: #929292;font-size: 15px;} .thuong_hieu_list a img{opacity:1;transition:ease-in-out .3s all 0s;max-width:150px} .thuong_hieu_list a:hover img{opacity:1} .thuong_hieu_m{position:absolute;left:10px;border:1px solid #d5d5d5;padding:7px 80px;border-radius:21px;top:64px;z-index:999;background:#fff} .line_cTh{border-bottom:5px solid #ececec;border-left:9px solid transparent;border-right:9px solid transparent;height:0;left:60px;margin-top:-7px;position:absolute;width:0} .tHTopH{border-bottom:1px solid #f0f0f0;margin-right:10px;padding-bottom:10px;display:table} .tHTopH a{display:block;float:left;width:147px;line-height:25px;font-size:12px} .tHBottomH{clear:both} .tHBottomHClum{float:left;width:147px;padding-top:10px} .list_menu_h{clear:both;padding-top:20px;padding-bottom:10px;width:1170px;margin:auto;margin-top:auto;background:#e5e5e5;margin:20px 0 20px 0} .list_menu_h .iteam_menu{width:99px;float:left;text-align:center;padding-left:7px;padding-right:7px} .list_menu_h .iteam_menu img{width:70px;display:block;margin:auto;padding-bottom:8px} .iteam_menu_right{margin-right:0!important} .iteam_menu_qa{width:120px!important} .iteam_menu_bd{width:110px!important} header .formSearch .button{border:medium none;cursor:pointer;float:right;height:32px;position:relative;width:32px;z-index:99999;background:0 0} header .formSearch .button:before{content:"\f002";font-family:FontAwesome;color:#ef4679;font-size:16px} .thuong_hieu_m:after{content:"\f0d7";font-family:FontAwesome;color:#ccc;font-size:14px} header .cart_top{float:right;margin-right:15px;background:url(../../images/cart.png) no-repeat 0;padding-left:16px} header .cart_top .tit{display:block;float:right;padding-left:6px;padding-right:4px;padding-top:1px} .hDhtdal{float:left;padding-left:15px} header .cart_top .count{background:#ef4679 none repeat scroll 0 0;color:#fff;display:block;float:right;font:400 14px/24px Ubuntu,sans-serif;margin-top:3px;padding:0 8px;position:relative;border-radius:3px} header .menu nav .menu_leve_1 .home{margin-left:15px!important} header .menu nav .menu_leve_1:last-child a.parent{margin-right:0!important} header .formSearch input{border:medium none;font-family:Roboto,Helvetica,Arial,sans-senif;font-size:13px;font-weight:400;padding-left:13px;width:175px;margin-top:5px;position:relative;float:left;display:block;margin-left:6px} header .menu{clear:both;position:relative;padding-top:120px;width:1170px;margin:auto} header .menu nav .menu_leve_1{float:left} header .menu nav a{color:#333;display:block;font-size:13px;line-height:27px;margin-left:10px;margin-right:10px} .menuHiden li{width:200px;padding-left:10px} .menuHidenpro_2{width:210px} .menuHidenpro_1{width:650px} .lSAction > .lSPrev, .lSAction > .lSNext{ display: none; } #hamber_menu {float: left;width: 150px;position: relative;margin-right: 0px} #hamber_menu:before {content: "";position: absolute;right: -2px;top: 7px;width: 1.2px;height: 18px;background: #5B5B5B;} #hamber_menu a.txt_color_1 {display: block;float: left;padding: 0px 0px 3px 0px;font-size: 15px;line-height: 32px;position: relative;width: 100%;font-weight: 500;text-wrap: nowrap;} .img_banner_landdin_page {position: absolute;right: -50px;bottom: 0;z-index: 5;} .item_sub_menu_bar {color: #326e51;padding-top: 2px;transform: translateY(2px);z-index: 9;} .item_sub_menu_bar .item-lv1 {text-transform: uppercase;color: #5B5B5B;display: inline-block;padding: 0 30px;margin-top: 3px;line-height: 18px;font-weight: bold;;font-size: 16px;position: relative;letter-spacing: 3.2px;height: 100%;} .item_sub_menu_bar .item-lv1::after {content: "";position: absolute;right: -2px;top: 1px;width: 2.1px;height: 18px;background: #414141;} .item_sub_menu_bar .item-lv1:last-child::after {content: "";position: absolute;right: -2px;top: 1px;width: 1.1px;height: 18px;background: none;} .item_sub_menu_bar .item-lv1:nth-child(2)::after {content: "";position: absolute;right: -2px;top: 1px;width: 1px;height: 18px;} .slider_row_discount{margin-top: 25px;border-radius: 10px;} .discount-hot {position: relative;padding: 20px;text-align: center; /* Căn giữa nội dung */} .discount-hot h2.parent {position: relative;font-size: 49px;font-family: 'Inter';letter-spacing: 9.5px;background-color: #fff;padding: 0 10px;margin: 0; /* Đặt margin để không cách li chữ "MÃ KHUYẾN MÃI" ra ngoài */position: absolute; /* Đặt chữ "MÃ KHUYẾN MÃI" ở vị trí tuyệt đối trong khung */top: -51px; /* Điều chỉnh vị trí theo y để đè lên slider */left: 26%; /* Căn giữa ngang */transform: translateX(-50%); /* Căn giữa ngang */} aside.homenews .banner_news{height:196px;position:relative;width:300px} .q_HomeSlide{width:100%;height:330px;text-align:center} header{min-width:1024px;top:0;background:#fff;width:1170px;margin:auto;left:0;right:0;z-index:9999} .menuHiden{background:#fff none repeat scroll 0 0;box-shadow:0 5px 5px rgba(0,0,0,.2);position:absolute;z-index:999;transition:all .3s ease-in-out 0s;border-top:2px solid #929599;font-size:13px;display: none;} .menuHiden ul li{clear:both!important;font-size:15px!important;line-height:30px!important;padding-top:0!important;text-align:left;} header .menu nav a:hover{color:#e34d86} section{margin:auto;width:1170px} .q_HomeSlide .owl-controls .owl-page span{background:#c3cbc8 none repeat scroll 0 0;border-radius:20px;display:block;height:10px;margin:5px 7px;opacity:.5;width:10px} .q_HomeSlide .owl-controls .active span{background:#869791!important} .q_HomeSlide .owl-controls .owl-page{display:inline-block;margin:5px 2px 0} .thuong_hieu_m .parent{color:#9b9bb9;font-size:12px;padding-right:8px} aside.banner{float:left;height:413px;margin-top:10px;overflow:hidden;width:850px} aside.homenews{float:right;height:411px;overflow:hidden;padding-top:10px;width:300px;overflow:hidden} aside.banner .sl{clear:both;display:block} .tHBottomH{clear:both} .tHBottomHClum{float:left} .tHBottomHClum span{font-weight:700;display:block;clear:both} .tHBottomHClum a{font-size:12px;display:block;clear:both} .searchAjaxTop,.searchAjaxTopBt{background:none repeat scroll 0 0 #fff;border:1px solid #ececec;box-shadow:0 1px 3px rgba(204,204,204,.5);clear:both;margin-top:34px;overflow:hidden;position:absolute;width:563px;z-index:10;display:none} .searchAjaxTopBt a,.searchAjaxTopBt span{color:#444!important} .searchAjaxTop ul,.searchAjaxTopBt ul{padding:0;margin:0;list-style:none} .searchAjaxTop ul li,.searchAjaxTopBt ul li{height:25px;line-height:25px;padding-left:5px} .searchAjaxTop ul li.le,.searchAjaxTopBt ul li.le{background:#f6f6f6;color:#555} .searchAjaxTop ul li:hover,.searchAjaxTopBt ul li:hover{background:#d5e8f4;cursor:pointer;color:#d6392b} .searchAjaxTop ul li a,.searchAjaxTopBt ul li a{float:left;height:25px;overflow:hidden;padding-right:10px;width:440px} .searchAjaxTop ul li span,.searchAjaxTopBt ul li span{float:right;padding-right:5px;text-align:right} .searchAjaxTop ul li a:hover,.searchAjaxTopBt ul li a:hover{color:#d7042b} .brand_left_item a.active{color: red; font-weight: bold;} .right_product_A figure,aside.homenews figure{border-bottom:2px solid #ef4679;clear:both;font-size:14px;height:32px;line-height:32px;margin:7px 0 0;padding:0;text-align:left;text-transform:uppercase} .right_product_A .iamges,aside.homenews .iamges{border-bottom:1px solid #f2f2f2;border-left:1px solid #f2f2f2;border-right:1px solid #f2f2f2;clear:both;height:195px;overflow:hidden} .right_product_A .iamges img,aside.homenews .iamges img{min-height:196px;width:300px} .right_product_A h3,aside.homenews h3{background:rgba(0,0,0,0) linear-gradient(to bottom,transparent 0,rgba(0,0,0,.8) 100%) repeat scroll 0 0;height:57px;margin-top:-64px;overflow:hidden;padding-left:10px;padding-right:10px;padding-top:15px;position:absolute;width:279px;font-size:15px} aside.homenews figure b{border-bottom:32px solid #d93164;border-left:0 solid transparent;border-right:20px solid transparent;float:left;height:0;width:0} .right_product_A h3 a,aside.homenews h3 a{color:#fff;font-size:14px} .right_product_A figure a,aside.homenews figure a{background:#ef4679 none repeat scroll 0 0;color:#fff;display:inline-block;float:left;padding-left:16px;padding-right:16px;position:relative} aside.homenews .date-time{color:#9e9e9e;display:block;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:11px;font-weight:700;margin-left:10px;margin-top:-25px;position:absolute} aside.homenews .date-time .fa:before{content:"";display:inline-block;font-family:FontAwesome;font-feature-settings:normal;font-kerning:auto;font-language-override:normal;font-size:inherit;font-size-adjust:none;font-stretch:normal;font-style:normal;font-synthesis:weight style;font-variant:normal;font-weight:400;line-height:1;margin-right:3px;text-rendering:auto;transform:translate(0,0)} /* aside.slider_row{clear:both;width:1170px;position:relative} */ aside.slider_row{clear:both;position:relative} .topbarin{height:36px!important;box-shadow:0 3px 10px 0 rgba(0,0,0,.05);position:fixed;width:100%;z-index:999} header .topbarin h1,header .topbarin h2{height:26px!important;margin-top:2px!important;text-align:center} header .topbarin h1 img,header .topbarin h2 img{height:28px!important;margin-top:-7px!important;position:relative} .topbarin .formSearch{margin-top:2px!important} header .topbarin .hotline_r{padding-top:3px!important} .menuHidenth{width:610px!important;border:1px solid #ececec!important;box-shadow:0 1px 3px rgba(204,204,204,.5)!important;padding-left:16px;padding-top:12px;margin-top:5px;left:0;position:absolute;cursor:pointer} div.navicate div.sub i:before{color:#ccc;content:"\f105";display:block;float:right;font-family:FontAwesome;font-size:18px;font-style:normal;font-weight:400;line-height:16px;margin-left:10px;margin-right:6px;margin-top:2px} .price{font:700 14px/22px Helvetica,Arial,sans-senif} .actions-destop{display: flex;align-items: center;justify-content: center;padding: 0px 13px;height: 42px;} .actions-destop .cart{padding: 0px 10px;border-radius: 2px;display: flex;align-items: center;} .actions-destop .cart:hover{scale: 1.05;} .overlay_product .see-more{right: 50%;position: absolute;top: 26%;background: #333;z-index: 1000;color: #fff;padding: 10px 20px;transform: translateY(400%);opacity: 0;transform: translateX(50%)!important;text-wrap:nowrap;} .framePromotion::before{content: "";width: 100%;height: 51%;position: absolute;background: radial-gradient(#e9e6e6, transparent);top: 20px;right: 0;left: 0;bottom: 0;opacity: 0;} .title_bolo{position: absolute;width: 60%;left: 35px;margin: 0;text-transform: uppercase;background: #e5e5e5;border-radius: 5px;padding: 5px;font-weight: bold;padding-left: 17px;font-size: 10px;text-wrap: nowrap;z-index: 1;} .line-before, .line-after {content: "";position: absolute;top: 50%;border: 1px solid #e5e5e5;width: 26%;} .line-before {left: 0;} .line-after {right: 0;} .show-overlay .framePromotion::before {opacity: 1;} .overlay_product:hover .see-more{transform: translateY(0%);opacity: 0.7;transition: top 0.8s ease-out, opacity 0.8s ease-out;} .ratings{clear:both;display:table;font-size:11px;margin:auto;position:relative;text-align:left} .rating-box::before{font-family:FontAwesome;content:"\f005\f005\f005\f005\f005";letter-spacing:2px;color:#ccc;position:relative} .rating-box .rating::before{content:"\f005\f005\f005\f005\f005";font-family:FontAwesome;letter-spacing:2px} .rating-box .rating{color:#000;height:20px;overflow:hidden;position:absolute;top:0;left:0} .slider_row .selling .images{clear:both;display:block;height:170px;overflow:hidden;padding-top:7px} .slider_row .selling .images img{vertical-align:middle;max-height:170px} .owl-carousel .owl-wrapper:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0} .owl-carousel{display:none;position:relative;width:100%;-ms-touch-action:pan-y} .owl-carousel .owl-wrapper{display:none;position:relative;-webkit-transform:translate3d(0,0,0)} .owl-carousel .owl-wrapper-outer{overflow:hidden;position:relative;width:100%} .owl-carousel .owl-wrapper-outer.autoHeight{-webkit-transition:height .5s ease-in-out;-moz-transition:height .5s ease-in-out;-ms-transition:height .5s ease-in-out;-o-transition:height .5s ease-in-out;transition:height .5s ease-in-out} .owl-carousel .owl-item{float:left} .owl-controls .owl-buttons div,.owl-controls .owl-page{cursor:pointer} .owl-controls{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent} .grabbing{cursor:url(grabbing.png) 8 8,move} .owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)} .owl-origin{-webkit-perspective:1200px;-webkit-perspective-origin-x:50%;-webkit-perspective-origin-y:50%;-moz-perspective:1200px;-moz-perspective-origin-x:50%;-moz-perspective-origin-y:50%;perspective:1200px} .owl-fade-out{z-index:10;-webkit-animation:fadeOut .7s both ease;-moz-animation:fadeOut .7s both ease;animation:fadeOut .7s both ease} .owl-fade-in{-webkit-animation:fadeIn .7s both ease;-moz-animation:fadeIn .7s both ease;animation:fadeIn .7s both ease} .owl-backSlide-out{-webkit-animation:backSlideOut 1s both ease;-moz-animation:backSlideOut 1s both ease;animation:backSlideOut 1s both ease} .owl-backSlide-in{-webkit-animation:backSlideIn 1s both ease;-moz-animation:backSlideIn 1s both ease;animation:backSlideIn 1s both ease} .owl-goDown-out{-webkit-animation:scaleToFade .7s ease both;-moz-animation:scaleToFade .7s ease both;animation:scaleToFade .7s ease both} .owl-goDown-in{-webkit-animation:goDown .6s ease both;-moz-animation:goDown .6s ease both;animation:goDown .6s ease both} .owl-fadeUp-in{-webkit-animation:scaleUpFrom .5s ease both;-moz-animation:scaleUpFrom .5s ease both;animation:scaleUpFrom .5s ease both} .owl-fadeUp-out{-webkit-animation:scaleUpTo .5s ease both;-moz-animation:scaleUpTo .5s ease both;animation:scaleUpTo .5s ease both} @-webkit-keyframes empty { 0%{opacity:1} } @-moz-keyframes empty { 0%{opacity:1} } @keyframes empty { 0%{opacity:1} } @-webkit-keyframes fadeIn { 0%{opacity:0} 100%{opacity:1} } @-moz-keyframes fadeIn { 0%{opacity:0} 100%{opacity:1} } @keyframes fadeIn { 0%{opacity:0} 100%{opacity:1} } @-webkit-keyframes fadeOut { 0%{opacity:1} 100%{opacity:0} } @-moz-keyframes fadeOut { 0%{opacity:1} 100%{opacity:0} } @keyframes fadeOut { 0%{opacity:1} 100%{opacity:0} } @-webkit-keyframes backSlideOut { 25%{opacity:.5;-webkit-transform:translateZ(-500px)} 75%{opacity:.5;-webkit-transform:translateZ(-500px) translateX(-200%)} 100%{opacity:.5;-webkit-transform:translateZ(-500px) translateX(-200%)} } @-moz-keyframes backSlideOut { 25%{opacity:.5;-moz-transform:translateZ(-500px)} 75%{opacity:.5;-moz-transform:translateZ(-500px) translateX(-200%)} 100%{opacity:.5;-moz-transform:translateZ(-500px) translateX(-200%)} } @keyframes backSlideOut { 25%{opacity:.5;transform:translateZ(-500px)} 75%{opacity:.5;transform:translateZ(-500px) translateX(-200%)} 100%{opacity:.5;transform:translateZ(-500px) translateX(-200%)} } @-webkit-keyframes backSlideIn { 0%,25%{opacity:.5;-webkit-transform:translateZ(-500px) translateX(200%)} 75%{opacity:.5;-webkit-transform:translateZ(-500px)} 100%{opacity:1;-webkit-transform:translateZ(0) translateX(0)} } @-moz-keyframes backSlideIn { 0%,25%{opacity:.5;-moz-transform:translateZ(-500px) translateX(200%)} 75%{opacity:.5;-moz-transform:translateZ(-500px)} 100%{opacity:1;-moz-transform:translateZ(0) translateX(0)} } @keyframes backSlideIn { 0%,25%{opacity:.5;transform:translateZ(-500px) translateX(200%)} 75%{opacity:.5;transform:translateZ(-500px)} 100%{opacity:1;transform:translateZ(0) translateX(0)} } @-webkit-keyframes scaleToFade { to{opacity:0;-webkit-transform:scale(.8)} } @-moz-keyframes scaleToFade { to{opacity:0;-moz-transform:scale(.8)} } @keyframes scaleToFade { to{opacity:0;transform:scale(.8)} } @-webkit-keyframes goDown { from{-webkit-transform:translateY(-100%)} } @-moz-keyframes goDown { from{-moz-transform:translateY(-100%)} } @keyframes goDown { from{transform:translateY(-100%)} } @-webkit-keyframes scaleUpFrom { from{opacity:0;-webkit-transform:scale(1.5)} } @-moz-keyframes scaleUpFrom { from{opacity:0;-moz-transform:scale(1.5)} } @keyframes scaleUpFrom { from{opacity:0;transform:scale(1.5)} } @-webkit-keyframes scaleUpTo { to{opacity:0;-webkit-transform:scale(1.5)} } @-moz-keyframes scaleUpTo { to{opacity:0;-moz-transform:scale(1.5)} } @keyframes scaleUpTo { to{opacity:0;transform:scale(1.5)} } .slider_row{clear:both} .slider_row h2.parent-v1{clear:both;position:relative;text-align:center;display: flex;align-items: center;justify-content: space-between;background: linear-gradient(to left, #f8d2c0, #fbeed7, #f8d2c0);border-radius: 6px;padding: 12px;} .slider_row h2.parent{clear:both;position:relative;text-align:center;display: flex;align-items: center;} .timmer_deal_brand{display: flex;align-items: center;} .item_count_down{display: inline-block;padding: 3px 0px;text-align: center;width: 30px;border-radius: 5px;color: #767979;background: #fff;font-weight: 700;font-size: 16px;margin: 0px 8px;vertical-align: top;-webkit-text-stroke: thin;} .slider_row h2.parent a{font-family:Arial,Helvetica,sans-serif;color:#333;font-size:24px;font-weight:700;padding-left:12px;padding-right:12px;display:block;float:left;text-transform:uppercase} .buy-category-hot{display: flex;padding-left: 12px;padding-top: 17px;} .buy-category-hot .title{padding-right: 4px;font-size: 20px;} .buy-category-hot .list{display: flex; flex-wrap: wrap;align-items: center;} .buy-category-hot .list a{background: #ff589c;padding: 10px 30px;border-radius: 48px;margin: 5px 5px 9px 5px;color: #fff;} .buy-category-hot .list a.active{background: red;} .buy-category-hot .list a li{display: flex;align-items: center;} .buy-category-hot .list img{width: 30px;height: 100%;padding-right: 10px;} .item_category .active {color: red;} .item_category .fa-chevron-down:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 11px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;} .item_li {list-style: none;} .post-hot img{width: 100%; height: 305px;border-radius: 14px;} .post-hot .owl-buttons div:before {content: "";color: #ABABA8;font-family: FontAwesome;font-size: 33px;font-style: normal;font-weight: normal;position: relative;text-align: center;transition: all 0.4s ease 0s;border: 2px solid;padding: 0px 6px;height: 22px;display: block;border-radius: 18px;} .post-hot .owl-buttons div {border-radius: 2px 0 0 2px;top: 30%;padding-left: 9px;padding-right: 12px;position: absolute;right: 11px;text-align: center;z-index: 9;transform: rotate(180deg);} .post-hot{display: flex;flex-wrap: wrap;margin-top: 37px;margin-bottom: 0;z-index: 1000;margin-top: 4px;} .post-hot-wp {background: #f5f5f5;border-radius: 10px;padding: 10px 0px 0px 0px;margin: 10px 0px 40px 0px;height: 485px;} .post-hot .item{padding: 0px 10px 0px 10px;text-align: center;display: block;} .post-hot .item .title{font-size: 14px;text-transform: uppercase;line-height: 1.5;position: relative;font-weight: bold;color: #4F4F4F;-webkit-text-stroke: thin;text-decoration: none;-webkit-line-clamp: 1;-webkit-box-orient: vertical;} .post-hot .item .teaser{padding: 0px 40px;height: 40px;text-decoration: none;-webkit-line-clamp: 2;-webkit-box-orient: vertical;display: -webkit-box;overflow: hidden;} .post-hot .item .title:after{content: "";background: #575050;width: 60%;height: 1px;position: absolute;bottom: -3px;left: 21%;} .mini-banner{padding: 10px 6px;display: flex;flex-wrap: wrap;} .mini-banner .item{width: 100%} .mini-banner .item img{width: 96%; height: 220px;border-radius: 10px;} .xem_themdd{padding-bottom:20px} .content_v .row_product{clear:both;padding-bottom:11px;padding-top:20px} .content_v .row_product:first-child{padding-top: 7px} .mini-banner .owl-controls{display: none!important;} .q_HomeSlide .owl-pagination{margin-top:-10px} .slider_row .xem_them{font-size:13px;font-weight:300;text-align:center} .slider_row .xem_them a span{font-weight:700;color:#c3512f} aside.slider_row .owl-buttons div{border-right:1px solid #ddd;border-top:1px solid #ddd;font-style:normal;font-weight:400;height:20px;position:absolute;right:33px;top:48%;transform:rotate(45deg);width:20px} aside.slider_row .row_product .add_cart{border-radius:0 4px 0 0!important} .form-cart-mobile{display: none;} aside.slider_row .owl-buttons div:hover{border-color:#eaeaea!important} .right_product_A div.owl-prev::before,aside.homenews .owl-buttons div.owl-prev:before{content:"\f105"!important} .right_product_A .owl-buttons div,aside.homenews .owl-buttons div{border:1px solid #dfdfdf;color:#ddd;float:right;font-size:18px;font-style:normal;font-weight:400;height:24px;line-height:23px;margin-left:10px;padding-left:5px;position:relative;text-align:center;top:-227px;transition:all .4s ease 0s;width:14px} .right_product_A .owl-buttons div:before,aside.homenews .owl-buttons div:before{content:"";font-family:FontAwesome} aside.slider_row .owl-buttons .owl-prev{border-right:none!important;border-left:1px solid #ddd;border-bottom:1px solid #ddd!important;left:10px!important;border-top:none!important} .add_cart:hover i{color:#fff} .row_product_lq .images,aside.product_l .product_item .images,aside.slider_row .row_product .owl-item .images{clear:both;display:block;height:216px;overflow:hidden;text-align:center;border: 3px solid #d5d5d4;border-radius: 10px;} aside.product_l .product_item .images{max-width:93%;height:270px} .item-buy-category p{border-top: 2px solid #e5e5e5;padding: 10px 0px 10px 0px;background: #e5e5e5;margin-bottom: 0;font-weight: bold;font-size: 16px;-webkit-text-stroke: thin;color: #343434;} .row_product_lq .owl-item h2,aside.slider_row .row_product .owl-item h2{clear:both;height:43px;overflow:hidden;padding: 3px 5px;text-align:center;position: relative;} .row_product_lq .owl-item h2,aside.slider_row .row_product .owl-item h2:after{content: "";background: #c4c4c4;width: 140px;height: 2px;position: absolute;bottom: 0px;left: 19%;} aside.slider_row .row_product .owl-item h2 a{color:#666;font-size:13px;font-style:normal;font-weight:400;text-decoration: none;-webkit-line-clamp: 2;-webkit-box-orient: vertical;display: -webkit-box;overflow: hidden;} aside.slider_row .row_product .owl-item h2 a:hover{color:#e11f26} .row_product_lq .price,aside.product_l .product_item .price,aside.slider_row .row_product .owl-item .price{clear:both;font-size:15px;margin:auto;padding-top:5px;text-align:center;display: flex; flex-direction: column;height: 40px;} aside.manufacturer{background:#fff none repeat scroll 0 0;display:table;padding-bottom:20px;width:100%} .row_product_lq .row_product_h{clear:both;height:328px} .row_product_h_l,aside.slider_row .row_product .row_product_h{overflow: hidden;position: relative;width: 215px;margin: auto;border-radius: 4px;padding: 20px 0 20px 0;} aside.slider_row .row_product_khuyen_mai .row_product_h{overflow: hidden;position: relative;width: 267px;margin: auto;border-radius: 4px;padding: 20px 0 20px 0;} aside.slider_row .row_product_khuyen_mai .row_product_h img { max-height: 195px; max-width: 100%; } .discount-hot{display: flex;align-items: center;flex-direction: column;} .discount-hot .login-hot{padding: 5px 25px;border-radius: 3px;color: #333;border: 1px solid;-webkit-text-stroke: thin;} .item-hot .check{text-align: center; display: flex; justify-content: center; padding: 0px 16px; align-items: center; margin-top: 0px; position: absolute; bottom: 34px;} .item-hot .check .receive-now{font-size: 11px;background: #fd1d55;padding: 1px 13px;border-radius: 4px;color: #fff;font-weight: bold;} .list-voucher .check{ text-align: center; display: flex; justify-content: center; align-items: center; margin-top: 0px; position: absolute; bottom: 10px; left: 56px;} .list-voucher .check .receive-now{font-size: 11px;background: #fd1d55;padding: 1px 13px;border-radius: 4px;color: #fff;font-weight: bold;} .prd-hot{text-transform: uppercase;font-size: 16px;font-weight: 500;display: flex;justify-content: center;margin: 0;} .prd-hot .fa-caret-down:before{ color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;} .actions{text-align: center;} .actions a{background: #ef4679;} .actions .see-more{padding: 10px 30px;color: #fff;border-radius: 5px;} .actions .addCart{padding: 10px 20px;color: #fff;border-radius: 5px;} .row_product_h_l img,aside.slider_row .row_product .row_product_h img{max-height:195px;max-width:100%;transform: translateY(18px);} aside.manufacturer .row_manufacturer img{display:block;float:left;padding-left:20px;padding-right:20px;padding-top:11px} aside.manufacturer .row_manufacturer .sakura img{padding-top:0!important} footer{clear:both;font-size:13px;background:#fff;width:1170px;margin:auto; margin-top: 20px;} .list_menu_h .iteam_menu a{clear:both;font-size:14px;color:#333;font-family:sans-serif,arial;text-transform:capitalize} .footer-wp{border: 1px solid #d5d5d5;border-top-left-radius: 10px;border-top-right-radius: 10px;} footer .link{float: left; padding-right: 6px; line-height: 24px; padding-top: 14px; width: 389px; font-size: 12px; font-weight: bold;} footer .foterAdd{clear:both} footer .call{width:300px} footer .showroom{ width: 440px; line-height: 24px; margin-left: 91px; font-size: 11px; font-weight: bold;} footer .link ul a{padding-right:4px} footer .homeEmail{clear:both;padding-bottom:10px;padding-top:20px;background: #e9e9e9;border-top-left-radius: 10px;border-top-right-radius: 10px;} footer .regisPhone{float:left;height:38px;margin-top:2px;width:290px;position:relative;margin-left:50px} footer .regisPhone .title{clear:both;font-weight:700;font-size:14px;padding-bottom:5px} footer .regisPhone .iconsend{background:#929599 none repeat scroll 0 0;color:#fff;height:34px;line-height:32px;position:absolute;text-align:center;width:36px;cursor:pointer;right:0;border-radius:2px} footer .regisPhone .iconsend:hover{background:#ff9100} footer .regisPhone .iconsend:before{content:"\f105";font-family:FontAwesome;font-size:20px} footer .regisPhone #emailKm{border:medium none;float:left;font-size:14px;line-height:36px;width:260px;padding-left:7px;height:30px;border-radius:2px} .clear{clear:both} footer .connect{float:right;margin-top:20px;margin-right:10px} footer .foterAdd{clear:both;text-align:center} footer .link .titileSk{font-size: 12px;padding-bottom: 5px;-webkit-text-stroke: thin;text-transform: uppercase;font-weight: 700;color: #131313;} footer .connect a{display:inline-block;font-size:25px;height:32px;margin-left:10px;text-align:center;width:32px;font-family:FontAwesome} .ft_goi_mh{padding-left:60px;display:table;float:left;border-right:2px solid #CCCCCD;padding-right:60px} .ft_goi_mh:last-child {border-right: none;} .ft_goi_mh .gmh_phone{clear:both;font-size:26px;padding-top:10px;padding-bottom:10px;-webkit-text-stroke: medium;} footer .showroom br{padding-bottom:5px} footer .connect a:hover{color:#ff9100} .fb:before{content:"\f09a"} .tw:before{content:"\f099"} .gg:before{content:"\f0d5"} .ytb:before{content:"\f167"} .ist:before{content:"\f16d"} .dkbct{background: #fff none repeat scroll 0 0;border: 1px solid rgba(255,255,255,.2);border-radius: 5px;font-size: 11px;transform: translate(-78px, -10px); /* display: block;float: left;height: 44px;width: 100%;text-align: end; */ } .row_manufacturer{border-top:1px solid #dedede;margin-top:18px;padding-top:10px} .row_manufacturer .nav_manufacturer{float:left;font-size:15px;padding-right:18px;padding-top:18px} .row_product_lq .price span,.slider_row .selling .price span,aside.product_l .product_item .price span,aside.slider_row .row_product .owl-item .price span{color:#888!important;text-decoration:line-through;font-weight:400;margin-right:5px;} .brackRum{font-size:12px} aside.navigation{clear:both;height:21px;padding-top:6px;line-height:29px} section.content_ld{margin-top:10px!important;display:table;border-radius:2px} aside.navigation .brackRum{margin:auto;width:1170px} .add_cart{background:url(../../images/cart.png) no-repeat 6px #ef4679;border:1px solid #ef4679!important;color:#fff!important;display:none;position:absolute;padding:16px 12px 16px 16px;width:5px;border-radius:2px;right:0;top:0;cursor:pointer} add_cart:hover{background-color:#ff7572 !important background: #ff7572!important;color:#fff!important;border:1px solid #ff7572!important} .top_cart{background:#f7f7f7;height:30px;line-height:30px;width:656px} .cart_oder ul{clear:both} .cart_oder ul li{padding-right:10px;padding-left:10px;display:table-cell;height:100%;vertical-align:middle} .bottom_cart li{border-bottom:1px solid #e3e3e3;border-right:1px solid #e3e3e3} .cart_oder ul li.sp{width:300px} .cart_oder ul li.dg,.cart_oder ul li.tt{width:100px;text-align:center} .cart_oder ul li.sl{width:70px;text-align:center} .bottom_cart{border-left:1px solid #e3e3e3} .bottom_cart .cartImg{padding-right:5px;max-height:60px;width:auto!important;max-width:80%} .bottom_cart li{padding-top:5px;padding-bottom:5px} .bottom_cart li.dg,.bottom_cart li.tt{line-height:60px} .pro_pos_giga{background:#FD1D55;position:absolute;float:right;padding:0px 10px;color:#fff;border-radius:5px;height:30px;width:30px;text-align:center;line-height:30px;left:0;top:20px;z-index: 2;} .pro_pos_giga span{font-weight:700} .buy1get1free{z-index:100;position:absolute;top:17px;right:17px;background:rgba(255,212,36,.9);color:#ee4d2d;font-size:10pt;text-align:center;padding:10px 0;width:48px;font-weight:700;font-family:Arial;animation-name:buy1get1free;animation-duration:2s;animation-iteration-count:infinite} .buy1get1free:after{content:"";width:0;height:0;left:0;bottom:-8px;border-style:solid;position:absolute;border-width:0 24px 8px;border-color:transparent rgba(255,212,36,.9)} @keyframes buy1get1free { 0%{color:red} 50%{color:#fff} 100%{color:red} } .banner_header_product{text-align:center;z-index:1;position:absolute} .promotion_limited{font-family:Roboto;font-size:20px;overflow:hidden;background:#202020;background-size:60%;animation:promotion 3s linear infinite;-webkit-background-clip:text;-webkit-text-fill-color:rgba(255,255,255,0);font-weight: bold;z-index: 10; position: relative;} .buy-later{display: flex;align-items: center;margin: 5px 0px;} .buy-later p{margin: 0;margin-right: 5px;font-size: 17px;} .reduction{display: flex;align-items: center;background: #DBDBDB;padding: 10px;border-radius: 7px;} .reduction p:first-child{background: #FFFFFF;color: #A0A0A0;padding: 3px 8px;border-radius: 29px;font-weight: bold;margin-right: 10px;} .reduction p {margin: 0;font-size: 19px;line-height: 1.3;color: #3D3D3D;} .endow-combo{border: 3px dashed #D9D9D8;padding: 10px;border-radius: 5px;margin-top: 12px;max-height: 140px; overflow: auto;} .endow-combo h2{font-size: 20px;font-weight: bold;margin-bottom: 5px;} .endow-combo-product{display: flex;align-items: center;margin-bottom: 8px;height: 100px;} .endow-combo-product p {margin: 0;font-size: 15px;} .endow-combo-product .content{padding-left: 30px;} .endow-combo-product .title{font-weight: bold;color: #4A4A4A;} .endow-combo-product .plus{font-size: 50px;padding: 0px 20px;color: #9F9F9F;cursor: pointer;} .endow-combo-product .price{margin-bottom: 4px;} @keyframes promotion { 0%{background-position:-500%} 100%{background-position:100%} } .bottom_cart .capnhatCartTxt{border:1px solid #ddd;height:20px;line-height:20px;margin-top:17px;text-align:center;width:40px} .cart_oder{width:656px} .cart_right{float:right;padding-top:5px;padding-bottom:15px;margin-right:9px} .btdatHang{background:#B4B4B4;clear:both;cursor:pointer;height:34px;line-height:34px;margin-top:5px;padding-left:20px;padding-right:20px;text-align:center;border-radius:2px;color:#fff;display:block} .boxDathang .dhnBottomRight:hover,.btdatHang:hover{background:#d62e4d;color:#fff} #tongTienCart,.bottom_cart .tt{font-size:14px;font-weight:400} #tongTienCartFinal{color:red;font-weight:700;font-size:15pt} .cart_left{float:left;padding-bottom:10px;margin-left:9px} .cart_left .btdatHang{width:160px;margin-left:8px;border-radius:0} .cart_right_cp{text-align:right} .cart_left .btdatHang:hover{background:#d62e4d!important;color:#fff!important} .Cart_title_pro{display:block;overflow:hidden} .delete_Cart{cursor:pointer;color:#ef4679} .delete_Cart:before{content:"\f057";font-family:FontAwesome;color:#ef4679;font-size:16px;padding-right:3px} .title_gio_hang{clear:both;color:#333;padding-left:20px;height:40px;line-height:40px;font-weight:700;display: flex;flex-direction: column;align-items: center;justify-content: center;font-size: 19px;} #poup_all_to{background:#fff;transition:all .3s} .title_gio_hang .close_poup{border:2px solid #fff;border-radius:22px;color:#fff;cursor:pointer;display:block;float:right;font-size:16px;height:27px;line-height:27px;margin-right:10px;margin-top:5px;text-align:center;width:27px} .login-cart{padding: 16px 10px 0px 10px;} .login-cart span:last-child{padding: 7px 3px; border-radius: 31px; color: #4C4C4C; font-size: 14px; font-weight: bold; text-decoration: underline;} .select-row select{ margin: 10px 5px; border: 2px solid #dedede; padding: 7px 10px; border-radius: 10px;} .boxDathang{border: 2px solid #D4D5D3;border-radius:5px;clear:both;padding-bottom:30px;width:100%} .boxDathang .boxDathangTitile{clear:both;font-size:14px;padding:2px 10px;text-align:center} .boxDathang .boxDathangTitile .boxDathangTitileBot{clear:both;font-size:12px} .boxDathang .boxDathangTitile .boxDathangTitileTop{clear:both;color:#288ad6} .boxDathang .dhn_gioi_tinh,.boxDathang input,.boxDathang textarea{border:2px solid #dedede;padding:7px 16px; padding: 7px 16px; border-radius: 10px;} .boxDathang #dhn_ho_ten,.boxDathang .inLhVews,.boxDathang .inLhVewsTex{width:550px} .boxDathang .dhnBottomRight{background:#ef4679 none repeat scroll 0 0;color:#fff;margin:15px auto 5px;padding:10px 5px;text-align:center;width:140px;cursor:pointer} .title_nhan_hang{text-align:center;width:100%!important;padding:0!important} .title_nhan_hang span{display:block;line-height:30px} .title_nhan_hang span.xnHn_bt{line-height:14px!important;font-weight:400} .error,.errorr{border:1px solid #d62e4d!important;color:#d62e4d!important} .theleall{clear:both;margin:auto;padding:8px 35px 8px 14px;padding-bottom:10px;width:980px} h1.titile_km{clear:both;text-align:center;padding-top:15px;padding-bottom:10px;font-size:15px;font-weight:700} .thongbao{clear:both;width:360px;padding-left:10px;padding-right:10px;padding-bottom:20px;display:block;text-align:center} .icon_bolt:before,.icon_check:before,.icon_double_right:before,.icon_f06b:before,.icon_hand_o_right:before,.icon_long_arrow_right:before,.icon_quote_left:before,.icon_quote_right:before,.icon_sign_in:before,.icon_trophy:before,.icon_umbrella:before{font-family:FontAwesome;margin-right:4px;float:left} .icon_check:before{content:"\f00c";font-size:14px;color:#d62e4d} .icon_trophy:before{content:"\f091";font-size:24px;color:#ffa001} .icon_hand_o_right:before{content:"\f0a4";font-size:24px;color:#38538a} .icon_bolt:before{content:"\f0e7";font-size:16px;color:#ffa001} .icon_umbrella:before{content:"\f0e9";font-size:25px;color:#666} .icon_double_right:before{content:"\f101";font-size:20px} .icon_f06b:before{content:"\f06b";font-size:22px;color:#666} .icon_sign_in:before{content:"\f090";font-size:16px;color:#fea204} .icon_long_arrow_right:before{content:"\f178";font-size:13px;color:#666} .icon_quote_left:before{content:"\f10d";font-size:20px} .icon_quote_right:before{content:"\f10d";font-size:20px} .yctvMp{z-index:999;position:fixed;bottom:0;display:block;background:#ef4679;color:#fff;text-align:center;width:300px;padding-top:6px;padding-bottom:6px} .yctvMp span{clear:both;display:block;font-weight:700} .content_ld .brackRum{background:#fff none repeat scroll 0 0;clear:both;height:25px;margin-right:10px;overflow:hidden} .sahreViesalav{float:right;margin-top:-76px;padding-right:10px;position:relative} .sahreViesal .shareGoo{float:left;padding-right:4px} .brackRum span{display:block;float:left;padding-right:4px;font-size: 16px;} .brackRum h1{float:left;line-height:30px;padding-left:4px;font-size: 16px;font-weight: bold;} aside.content_top{clear:both;margin-top:8px;width:1180px} aside.content_top .item img{min-height:160px} .clear10px{clear:both;height:10px} article.content_list,aside.content_list{float:left;width:1170px; padding: 6px 6px; border-radius: 10px;} .content-body .title:after{content: ""; background: #575050; width: 60%; height: 1px; position: absolute; bottom: -3px; left: 21%;} article.content_list h2{font-size:18px} article.content_list h3{font-size:16px} article.content_list a{color:#494B4E} article.content_list ul, .category_product_content ul {padding:5px;list-style:none;list-style-type: disc !important;padding-left: 30px !important;} .category_product_content p {margin:0;} .category_product_content em img { max-width: 100%; } .content_border{display: table;margin-top: 8px;width: 905px;border-top: 1px solid #eee;border-left: 1px solid #eee;} .content-body{display: flex; flex-wrap: wrap;} .content-body-genki{display: flex;flex-wrap: wrap;justify-content: start;} .item_genki{max-width: 36%; flex: 0 0 32%; padding: 7px 9px; padding-right: 0;} .item_genki-wp{display: block; border: 2px solid #D4D5D3; border-radius: 6px;height: 100%;} .item_genki .title{position: relative;} .item_genki .title::after{content: ""; width: 165px; height: 2px; position: absolute; background: #9C9C9C; bottom: -5px; left: 17%;} .content-body .item{width: 47%;margin-right: 25px;} .content-body .item .title{font-weight: bold;position: relative;text-align: center;} .article_search::before{content: "\f002"; font-family: FontAwesome; color: #4E4E4E; font-size: 16px;} .article_search { border: medium none; cursor: pointer; float: right; height: 32px; position: absolute; width: 32px; z-index: 99999; background: 0 0; right: 5px; top: 3%; } .text-capitalize { text-transform: capitalize; } /* Áp dụng việc viết thường cho phần còn lại */ .text-lowercase { text-transform: lowercase; } .action-time{ font-size: 12px; display: flex; align-items: center; justify-content: center;} .put_cacul{display: flex; align-items: center; justify-content: center; background: #FD1D55; color: #fff; padding: 6px 0px; margin: 10px 0px; border-radius: 5px;} .content-body img{width: 100%;height: auto;} .filter-wp{display: flex;justify-content: space-between;align-items: center;} .filter-wp .input_search{height: 20px;width: 300px;border-radius: 7px;outline: none;padding: 4px 10px;border: 2px solid #cdcbcb;} aside.content_pro_hot .product_item{border-bottom:1px dotted #e8e8e8;border-radius:2px;clear:both;margin-bottom:15px;padding:10px} aside.content_pro_hot .product_item h2{clear:both;height:36px;overflow:hidden;padding:5px;text-align:center} aside.content_pro_hot .product_item .price{clear:both;font-size:15px;margin:auto;text-align:center} aside.content_pro_hot .product_item .price span{color:#888!important;font-weight:400;margin-right:5px;text-decoration:line-through} aside.content_pro_hot .product_item .images img{width:172px} aside.right_content{float:right;width:300px} aside.right_content .titile_h{background: #E2E2E2;border-radius: 5px;margin: 10px 0px;} aside.right_content .titile_h span{color:#000000;display:inline-block;line-height:32px;width: 100%;text-align: center;font-size: 18px;padding: 5px 0px;font-weight: bold;} aside.right_content .filter .content_v{clear:both;height:80px;padding-bottom:5px;padding-top:5px} aside.right_content .filter .content_v .images{float:left;width:120px;overflow:hidden;height:80px} aside.right_content .filter .content_v .images img{height:100%;border-radius: 5px;} aside.right_content .filter .content_v .detail{float:left;width:170px;float:right} aside.right_content .filter .content_v .detail a{font-weight:700} aside.right_content .filter .content_v .images span{background:rgba(0,0,0,.2) none repeat scroll 0 0;border-radius:0 2px 0 0;color:#fff;font-size:20px;height:32px;line-height:32px;margin:48px 0 0;position:absolute;text-align:center;width:32px} aside.right_content .filter{clear:both;padding-top:5px} aside.right_content .filter .content_v .images div{background:rgba(0,0,0,0) linear-gradient(to bottom,transparent 0,rgba(0,0,0,.8) 100%) repeat scroll 0 0;color:#fff;display:block;font-size:16px;height:24px;margin-top:45px;padding-left:8px;padding-top:11px;position:absolute;width:112px} aside.content_list .allV{float:left;height:356px;overflow:hidden;text-align:justify;width:100%} aside.content_list .allV .images{clear:both;height:300px;overflow:hidden;border-radius: 6px;padding: 5px;} aside.content_list .allV .images img{width:100%;min-height:215px} aside.content_list .allV h2{overflow:hidden;padding-right:10px;text-align:center;text-transform:uppercase} aside.content_list .allV h2 a{font-size:14px;font-weight:700} aside.content_list .allV figure{padding-right:21px;padding-top:5px;height:62px;overflow:hidden} .content_list .pagingDetail{height:37px;line-height:38px;margin-right:15px;text-align:center;font-size:15px} .content_list_de{padding-right:20px;width:834px!important} .content_list .pagingDetail a{padding-left:8px;padding-right:8px} .content_list .pagingDetail strong{color: #FD6E91;display:inline-block;height:37px;padding-left:15px;padding-right:15px;border-radius:2px} aside.content_pro_hot .product_item:last-child{border:none!important} h1.titile_dCon{font-family:arial;font-size:24px;letter-spacing:1px;line-height:140%;padding-top:5px;text-align:center;text-transform:uppercase;font-weight: bold;} article.content_list span.date{float:left;padding-bottom:4px;padding-top:4px;color:#777;font-weight: bold;} .sahreViesalDetail{float:right} .clear{clear:both} article.content_list img{height:auto!important;max-width:700px} .fiter_detail{clear:both} .cnShare{clear:both;display:table;height:18px;margin:auto;padding:2px} .content_list_top{padding:10px} .NewTitleH{border-bottom:1px solid #e4e4e4;clear:both;font-size:16px;height:4px;margin-bottom:30px;margin-top:9px;padding-bottom:6px;text-align:center} .newNews{clear:both;width:866px} .NewTitleH span{background:#fff none repeat scroll 0 0;font-family:arial;border:4px solid #eaeaea;padding:8px 20px 6px;border-radius:2px} .InContentA{clear:both;background:#fff;display:table} .tags{clear:both;padding-top:20px;padding-bottom:20px} .comentDetail{clear:both;background:#fff;padding:10px} .newNewsLeftD{float:left;margin-right:25px;overflow:hidden;padding-bottom:10px;width:260px} .newNewsLeftD .newNewsLeftDImg{clear:both;height:140px;overflow:hidden;border-radius:2px} .newNewsLeftD h3{height:40px;overflow:hidden;padding-top:6px} article.thele{border-right:1px solid #f1f1f1;float:left;width:860px} article.content_list img{max-width:100%;height:auto!important} article.content_list p{color:#333;font-size:14px;font-weight:400;line-height:21px;letter-spacing:.1px} .nav_content{clear:both;width:190px} aside.content_pro_hot .titile_hot{background:#e74c3c none repeat scroll 0 0;color:#fff;font-size:14px;font-weight:700;height:32px;line-height:32px;text-align:center} .cBHadVewi{background:#ef4679 none repeat scroll 0 0;padding:10px;color:#fff!important} section.product_d .images_d{float:left;overflow:hidden;text-align:center;width:450px;padding: 5px;} section.product_d .images_d img{max-height:450px;} aside.product_l .product_item .images img{max-height:266px;max-width:100%;transform: translateY(10px);} section.product_d .detailP{clear:both;background:#fff;display:table;padding:27px 0px 16px;margin-top:6px;width:1150px} #commentPhanTrang{background:#fff;padding-left:15px;padding-right:15px;padding-bottom:15px;max-height: 543px;overflow: auto;height: 100%;} section.product_d .detailP .owl-buttons div:before{content:"";color:#fff;font-family:FontAwesome;font-size:23px;font-style:normal;font-weight:400;line-height:29px;position:relative;text-align:center;transition:all .4s ease 0s} section.product_d .detailP .owl-buttons div{border-radius:2px 0 0 2px;bottom:50%;font-size:20px;height:29px;padding-left:9px;padding-right:6px;position:absolute;right:0;text-align:center;width:15px;z-index:9;background:rgba(216,216,216,.5) none repeat scroll 0 0} section.product_d .detailP .owl-buttons div.owl-prev{left:0!important;border-radius:0 2px 2px 0!important} section.product_d .detailP .owl-buttons div.owl-next:before{content:"\f105"!important;padding-left:4px!important} section.product_d .detailP .desProduct{float:left;padding-left:10px;width:675px} section.product_d .detailP .desProduct h1.detailPT{clear:both;font-size:20px;padding-bottom:10px;line-height:140%;font-weight: bold; color: #202020;text-transform: uppercase;} .pr_det_price{float:left;line-height:22px;margin-top:8px;padding-bottom:5px} .pr_det_price .price{float:left;font-size:20px} .pr_det_price .title{float:left;padding-right:10px;padding-top:5px} .pr_det_price .price span{color:#888!important;font-weight:400;margin-right:5px;text-decoration:line-through} .proFtiter{clear:both;font-size: 15px;padding: 8px 0px;position: relative;} .proFtiter:first-child::after{content: "";width: 2px;height: 12px;position: absolute;background: #282828;right: 20px;top: 13px;} .proFtiter span{color:#282828;font-size:14px} .pro_dg .pro_dg_tt{float:left;margin-top:8px} .pro_dg .ratings{font-size:15px} .proDha{clear:both;display:table} .proDha .buy-now{background:#FD1D55;color:#fff;cursor:pointer;float:left;padding:8px;text-align:center;width:150px;font-family:Arial,sans-senif;font-weight:700;margin-top:11px;border-radius: 5px;font-size: 15px;} .proDha .add-cart{background:#FD1D55;color:#fff;cursor:pointer;float:left;padding:8px;text-align:center;width:161px;font-family:Arial,sans-senif;font-weight:700;margin-top:11px;border-radius: 5px;font-size: 15px;margin-right: 10px;} .proDha .advise{background:#F9AEB0;color:#fff;cursor:pointer;float:left;padding:8px 10px;text-align:center;width:161px;font-family:Arial,sans-senif;font-weight:700;margin-top:11px;border-radius: 5px;font-size: 15px;} .num-cart{float: left;display: flex;align-items: center;transform: translateY(12px);border-radius: 6px;margin-right: 10px;border: 1px solid #DFE0DE;border-radius: 6px;} .num-cart span{font-size: 20px;padding: 6px 12px;cursor: pointer;border: 1px solid #DFE0DE;} .num-cart .input_number{width: 40px;text-align: center;border: none;} .content-detail-left{width: 837px;margin-right: 10px;} .content-detail{display: flex;} .content-detail .item-toggle{margin-bottom: 10px;} .content-detail .item-toggle .fa-chevron-down:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .content-detail .item-toggle .title{font-size: 20px;background: linear-gradient(to left, #DFDFDF, #F5F4F4, #DFDFDF);color: #333;padding: 18px 16px;border-radius: 4px;display: flex;align-items: center;justify-content: space-between;cursor: pointer;text-transform: uppercase;} .content-detail .item-toggle .product{display: none;width: 99.8%;border: 2px solid #F1F3F2;border-radius: 10px;} .content-detail .item-toggle .content-3{display: none;width: 99.8%;border: 2px solid #F1F3F2;border-radius: 10px;} .content-detail .item-toggle .title img{width: 20px;} .content-detail .list-toggle{margin-right: 10px;width: 100%;} .proDha .btDah .bttOp,.right_roduct_hd .btDah .bttOp,.right_roduct_hd .btYctuv .bttOp{clear:both;display:block;font-weight:700} .proDha .btYctuv{background:#fafafa none repeat scroll 0 0;border:1px solid #f1f1f1;color:#777;cursor:pointer;float:left;font-size:20px;font-weight:700;height:51px;line-height:51px;margin-left:10px;text-align:center;width:212px} .row_product_lq .owl-buttons{display:none} .rview-wp{display: flex;align-items: center;} .rview-wp span{border-right: 1px solid;padding: 0px 12px;color: #777777;font-size: 16px;color: #525252; font-weight: 600;} .rview-wp span:last-child{border: none;} .goiTongDa{padding-top:18px;text-align:start} .list-promotion{display: flex;align-items: center;padding-top: 10px;} .list-promotion h2{font-size: 35px;color: #ef0d51;font-weight: bold;} .list-voucher{ display: flex;flex-wrap: wrap;width: 100%;} .list-voucher img{max-width: 100%;flex: 0 0 33%;} .lc__section-review {color: #767979;} .u-flex {display: flex;align-items: center;} .box-title { font-size: 16px; padding: 10px; text-transform: uppercase; font-weight: bold;} .badge-primary {color: #fff;background-color: #007bff;} .badge {display: inline-block;padding: 0.25em 0.4em;font-size: 75%;font-weight: 700;line-height: 1;text-align: center;white-space: nowrap;vertical-align: baseline;border-radius: 0.25rem;transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;background: #FD1D55;} .lc__reviews-rating {border-top: 1px solid #F1F3F2;border-bottom: 1px solid #F1F3F2;;padding: 17px 0px;} .lc__reviews-rating .list{display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-right: -15px;margin-left: -15px;} .lc__reviews-rating .list .item{flex: 0 0 33.333333%;max-width: 33.333333%;} .lc__starviews {text-align: center;} .txt-tit {font-size: 18px;padding-bottom: 14px;} .lc__starviews .number {font-size: 42px;color: #407bb8;font-weight: 600;margin-bottom: 14px;} .lc__starviews .number {font-size: 42px;color: #407bb8;font-weight: 600;} .lc__reviews-progressviews {padding: 10px;} .progress-line.progress-sm {height: 8px;border-radius: 6px;} .progress-bar {display: -ms-flexbox;display: flex;-ms-flex-direction: column;flex-direction: column;-ms-flex-pack: center;justify-content: center;overflow: hidden;color: #fff;text-align: center;white-space: nowrap;background-color: #007bff;transition: width .6s ease;} .lc__reviews-sendviews{flex-direction: column;align-items: center;} .lc__reviews-sendviews p {font-size: 17px;} .lc__reviews-sendviews a {font-size: 16px;padding: 4px 30px;background: #FD1D55;outline: none;border: none;color: #fff;border-radius: 5px;} .txt-view {font-size: 14px;color: #9ba0ab;} .lc__cmt-block {padding: 14px;border-bottom: 1px solid #ddd;} .lc__cmt-avatar {margin-right: 10px;} .avatar-rounded .avatar-picture, .avatar-circle .avatar-picture {display: flex;justify-content: center;align-items: center;background: #b6c0ce;padding: 15px 22px;border-radius: 50%;} .lc__cmt-content {position: relative;padding-left: 14px;} .avatar-name {font-weight: 700;font-size: 17px;} .lc__rating-star {display: flex;margin-bottom: 0;justify-content: center;} .lc__rating-star i:before{color: #B2B2B2;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 18px;content: "\f005";cursor: pointer;} .lc__rating-star i.active:before{color: #FDC558;} .comment-month .lc__rating-star{justify-content: start;} .comment-month i:before{color: #B2B2B2;display: block;font-family: FontAwesome;font-size: 16px;font-style: normal;width: 14px;content: "\f005";margin-left: 0;margin-right: 4px;} .progress-block i:before{color: #B2B2B2;display: block;float: left;font-family: FontAwesome;font-size: 15px;font-style: normal;font-weight: 400;text-align: center;width: 18px;content: "\f005";} .lc__cmt-content--full {font-size: 17px;} .modal{position: fixed;top: 0;left: 0;z-index: 1050;width: 100%;height: 100%;overflow: hidden;outline: 0;display: none;} .modal-wrapper{position: absolute;z-index: 9999;top: 6em;left: 50%;width: 32em;margin-left: -16em;background-color: #fff;box-shadow: 0 0 1.5em hsla(0, 0%, 0%, 0.35);} .modal-header{position: relative;background-color: #fff;box-shadow: 0 1px 2px hsla(0, 0%, 0%, 0.06);display: flex;-ms-flex-align: start;align-items: flex-start;-ms-flex-pack: justify;justify-content: space-between;padding: 0.7rem 1rem;border-bottom: 1px solid #dee2e6;border-top-left-radius: calc(0.3rem - 1px);border-top-right-radius: calc(0.3rem - 1px);} .modal-heading {font-size: 1.125em;margin: 0;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} .modal-body {padding: 2rem 2rem 0rem 2rem;} .title-star{text-align: center;font-size: 16px;margin: 0;margin-bottom: 9px;} .modal-content {position: relative;display: -ms-flexbox;display: flex;-ms-flex-direction: column;flex-direction: column;width: 100%;pointer-events: auto;background-color: #fff;background-clip: padding-box;border-radius: 0.3rem;outline: 0;} .modal-footer{display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-ms-flex-align: center;align-items: center;-ms-flex-pack: end;justify-content: center;padding: 0.75rem;border-top: 1px solid #dee2e6;border-bottom-right-radius: calc(0.3rem - 1px);border-bottom-left-radius: calc(0.3rem - 1px);} .modal-overlay{position: fixed;z-index: 10;top: 0;left: 0;width: 100%;height: 100%;background: hsla(0, 0%, 0%, 0.5);opacity: 0;transition: visibility 0s linear 0.3s, opacity 0.3s;visibility: hidden;} .modal.is-visible {visibility: visible;display: block;} .modal.is-visible .modal-overlay{opacity: 1;visibility: visible;transition-delay: 0s;} .close-review i:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;cursor: pointer;} .btn_evaluate{color: #fff;background-color: #6c757d;border-color: #6c757d;border: none;padding: 8px 24px;cursor: pointer;} .row {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap} .col-12 {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;} .col-md-6 {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;} .col-md-12 {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;} .form-group {margin-bottom: 1rem;margin-right: 11px;} .form-input {position: relative;display: block;width: 100%;font-family: inherit;padding: 5.5px 0px 5.5px 7px;color: #334155;background-color: #fff;background-clip: padding-box;border: 1px solid #d8e0e8;font-size: 11px;transition: all 0.3s;} .check-form-review {display: flex;align-items: center;} .goiTongDa span{font-size:20px;font-family:Arial,sans-senif} .goiTongDa .goiTongDah{font-weight:400;color:#444} aside.ckProduct{clear:both;margin-top:10px} aside.ckProduct .deCk{display:table;width:332px;float:left;height:50px} .deCkTlnq .ttCK{line-height:42px} aside.ckProduct .icon:before{color:#666;display:block;float:left;font-family:FontAwesome;font-size:20px;font-style:normal;font-weight:400;margin-left:5px;margin-top:11px;text-align:center;width:38px} .deCkTtct .icon:before{content:"\f1f0"} .deCkTtct .ttCK{display:block;float:left;width:280px} .deCkGhMpTq .icon:before{content:"\f0d1"} .deCkHln .icon:before{content:"\f087"} .deCkHlndt .icon:before{content:"\f1b8"} .deCkTlnq .icon:before{content:"\f06b"} .deCktmhg .icon:before{content:"\f044"} .deCkGhMpTq .ttCK,.deCkHln .ttCK{line-height:40px} .deCkGhMpTq,.deCkHln,.deCktmhg{padding-bottom:0!important;padding-top:0!important} .deCktmhg .ttCK{line-height:38px} aside.productEditQri{float:right;width:300px;display: none;} .detailProduct-relate{width: 1170px;} aside.product{float:left;width:868px} aside.product .de_Product_t{clear:both;height:37px;margin-bottom:-1px;margin-right:10px;position:relative;z-index:99} aside.product .de_Product_t span{background:#e4e4e4 none repeat scroll 0 0;display:inline-block;float:left;font-size:14px;height:38px;line-height:40px;margin-bottom:-1px;padding-left:20px;padding-right:20px;position:relative} .de_Product_in{margin-left:-16px!important;width:857px;border-bottom:1px solid #eee} aside.product .hdSudDetail{clear:both;padding-top:10px} aside.product article{border:1px solid #eee;margin-right:0px;padding:15px;clear:both} aside.product article img{max-width:816px;height:auto!important} .rightDetailHA{clear:both;font-size:14px;line-height:24px;margin-right:0px;background:#fff;padding:0px 15px;} .productEditQriRTAl{clear:both;display:table;margin-bottom:0} .clear10px{clear:both;height:10px} .commemntKdD{clear:both;margin-right:0px;display:table;width:100%;background:#fff;padding-bottom:12px} .commemntKdD #noi_dung_com{ border: 2px solid #A1A1A1;float: left;height: 49px;margin-top: 12px;padding: 10px;margin-left: 12px;width: 450px;border-radius: 11px;} .comMentproductFD{float:left;margin-left:7px;margin-top:12px;width:308px} .comMentproductFD input{border: 2px solid #A1A1A1;clear: both;height: 22px;width: 100%;border-radius: 6px;padding: 4px 7px;} .comMentproductFD #email_com{margin-top:6px} .btBinhLuan{background: #FD1D55;border: 2px solid #FD1D55;color: #fff;cursor: pointer;height: 72px;position: absolute;right: 16px;top: 12px;border-top-right-radius: 10px;border-bottom-right-radius: 10px;padding: 0px 10px;text-transform: uppercase;} .commentDetailTopLeft{clear:both;padding-top:8px} .commentDetailTopLeft .titl{font-weight:700;padding-right:5px;text-transform:capitalize} .commentDetailTopLeft .date{color:#888} .bt_bLuan{float:left;margin-left:6px;margin-top:12px;width:119px} .bt_bLuan #diem{border:1px solid #ddd;clear:both;height:20px;width:122px} .clearTraloiFion{clear:both;color:#c70000;cursor:pointer} .commentTraloi{background:#f1f1f1 none repeat scroll 0 0;clear:both;color:#333;display:block;margin-left:-3px;margin-top:9px;padding-bottom:10px;padding-left:10px;position:relative;padding-top:4px;border-radius:2px} .imagrTraloiE{border-bottom:1px dotted #ddd;clear:both;margin-right:10px} .commentTraloi .imagrTraloiE:last-child{border:none!important} .cmtralTOp{clear:both;font-weight:700;margin-top:6px} .cmtralTOp span{background:#ef4679 none repeat scroll 0 0;border-radius:2px;color:#fff;font-weight:400;padding:1px 8px;position:relative} .cmtralBt{clear:both;padding-bottom:5px;padding-top:5px} .btTopMt{border-bottom:16px solid #f1f1f1;border-left:12px solid transparent;border-right:12px solid transparent;height:0;margin-top:-12px;position:absolute;width:0} .right_product_A{clear:both;height:237px;overflow:hidden} .right_roduct_hd{clear:both} .right_roduct_hd .btDah,.right_roduct_hd .btYctuv{background:#929599 none repeat scroll 0 0;color:#fff;cursor:pointer;clear:both;margin-top:5px;text-align:center;padding:10px;font-family:Arial,sans-senif} .right_roduct_hd .btYctuv{background:#09a!important;height:56px!important} .right_roduct_hd .phone_product{background:#f87062 none repeat scroll 0 0;clear:both;color:#fff;cursor:pointer;font-size:16px;font-weight:700;height:25px;line-height:32px;margin-top:5px;padding:7px 6px 12px;text-align:center} .title_plq{border-bottom:1px solid #ddd;clear:both;height:25px;margin-right:10px;margin-top:18px;margin-bottom:18px} .thuong_hieu{clear:both;padding:5px 5px;border-radius:2px;position:relative} .thuong_hieu_cate{border: 2px solid #D4D5D3;border-radius: 7px;} .thuong_hieu_cate .owl-wrapper-outer {transform: translateY(34%);} .content_cate_product #filter_cate{border: 2px solid #C6C6C6;border-radius: 7px;} header .menu nav .menu_leve_1 .parent{font-family:Arial,Helvetica,sans-serif;text-transform:uppercase;font-size:13px;margin-left:20px;margin-right:24px;color:rgba(0,0,0,.9);line-height:36px;padding-top:3px;position: relative;display: flex;align-items: center;} header .menu nav .menu_leve_1 .parent.about:after{background: none;} header .menu nav .menu_leve_1 .discount:first-child:after{right: -22px!important;} header .menu nav .menu_leve_1 .parent:after{content: "";background: red;height: 17px;width: 1px;position: absolute;top: 50%;transform: translateY(-50%);right: -21px;} header .menu nav .menu_leve_1 .parent:hover{color:#ef4679} .title_plq span{background:#fff none repeat scroll 0 0;border:4px solid #eaeaea;display:table;margin:auto;padding:10px 20px;font-size:15px;border-radius:4px} .row_product_lq{clear:both;margin-top:0px;padding-top:12px;width:860px} .product-private{padding: 18px 10px;font-size: 24px;font-weight: bold;} .list-trans{display: flex;} .list-trans .item{padding: 16px 0px;font-size: 15px;} .list-trans .fa-truck:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .list-trans .fa-cc-visa:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .list-trans .fa-edit:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .list-trans .fa-thumbs-up:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .list-trans .fa-exchange:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .list-trans .fa-gift:before{color: #666;display: block;float: left;font-family: FontAwesome;font-size: 20px;font-style: normal;font-weight: 400;margin-left: 5px;text-align: center;width: 35px;} .detRight_ban_bt{clear:both;display:block;height: 196px;} .right_roduct_hd .btYctuv:hover{background:#02818f!important} .commentDetailTKDelte{color:#ed1c24} aside.filter{float:left;} .filter-hot .title-parent a{font-size: 16px; font-weight: bold;padding-bottom: 10px;display: block;} .filter-hot .list .title a{font-size: 17px;padding-bottom: 10px;display: flex;justify-content: space-between;align-items: center;} .filter-hot .list .list-child{padding-left: 10px;} .filter-hot .list .list-child a{display: block;padding-bottom: 10px;color: rgba(179, 179, 179, 1);} .filter_v{border-right:1px solid #efefef;border-radius:2px;clear:both;padding:10px;background:#fff;margin-top:9px;width:200px!important} aside.product_l{float:right;padding-bottom:20px;width:936px;border-radius:2px} aside.filter .general{clear:both;padding-bottom:10px;position:relative} aside.filter .general .titile{font-family:"Roboto Condensed",Helvetica,Arial,sans-senif;padding-bottom:6px;padding-top:6px;font-weight:700;font-size:14px;text-transform: uppercase;letter-spacing: 2.5px;font-weight: bold;} aside.filter .general .filter .iconE,aside.filter .general .filter .iconV{background:#fff none repeat scroll 0 0;border:1px solid #ccc;border-radius:10px;cursor:pointer;display:block;float:left;height:10px;margin-right:7px;margin-top:4px;width:10px} aside.filter .general .filter .iconEavtive{background:#ef4679!important;border-color:#ef4679!important} aside.filter .general .filter .age{clear: both;cursor: pointer;padding: 4px 0px;font-size: 16px;font-weight: bold;} aside.filter .general .functionkg{clear:both;padding-top:5px;padding-bottom:5px} aside.filter .general .functionkg span{width:30px;display:block;float:left;text-align:right;padding-right:5px} aside.filter .general .functionkg select{border: 1px solid #e2e2e2;width: 198px;color: #777;padding: 9px 8px;border-radius: 10px;} aside.filter #dotuoi{border:none!important} aside.filter .thuong_hieu_ft{position:relative} aside.product_l .product_item{float: left;overflow: hidden;position: relative;width: 291px;margin-bottom: 25px;border-radius: 4px;padding: 0px 9px 20px 0px;margin-right: 20px;} aside.product_l .product_item h2{height:40px;overflow:hidden;text-align:center;font-weight:400;padding-bottom:5px;position:relative;} aside.product_l .product_item h2:after{content: ""; width: 165px; height: 2px; position: absolute; background: #9C9C9C; bottom: 0; left: 20%;} .cps-block-content { background: #fff; border-radius: 10px; box-shadow: 0 1px 2px 0 rgba(60,64,67,.1), 0 2px 6px 2px rgba(60,64,67,.15); display: block; margin-right: auto; max-height: 300px; min-height: 0; overflow: hidden; padding: 15px; position: relative; text-align: justify; width: 97%; margin-top: 16px; } aside.product_l .product_boder{display:table;margin-top:8px;width:960px;padding-left: 20px;} aside.product_l .product_boder .list{display: flex;align-items: center;margin: 20px 0px;position: relative;} aside.product_l .product_boder .list .title{font-size: 16px;font-weight: 600;} aside.product_l .product_boder .list .item{padding: 6px 20px;background: #3C375A;margin: 0px 9px;border-radius: 5px;color: #fff;} .title-category{font-size: 20px;display: flex;align-items: center;font-weight: bold;} .title-category span{font-size: 10px; padding-left: 6px; color: #817878dd; transform: translateY(3px);} #ma_giam_gia{border:1px solid #ddd;margin-top:12px;margin-left:8px;padding-left:8px;height:25px;width:190px} aside.thuongHieuShoe{background:#e8e8e8 none repeat scroll 0 0;clear:both;color:#888;margin-bottom:-20px;padding:6px 20px;position:relative;text-align:center} aside.navigation .brackRum .titileBrum{display:inline;color: #373737;font-weight: bold;} .banRight_Ca{clear:both;display:block;margin-top:10px} aside.product_l .titile_category{clear:both;display:table;margin:-47px auto auto;padding-bottom:8px;padding-top:20px} .header_line{width:1170px;margin:auto;background:#d9d9d9;text-align:center;height:35px;line-height:35px;font-family:Arial,Helvetica,sans-serif;font-size:15px;color:#000;border-radius:0 0 3px 3px} aside.product_l .titile_category span{display:block;padding-left:15px;padding-right:15px;float:left;text-transform:uppercase;font-weight:400;font-family:Arial,Helvetica,sans-serif;font-size:16px} .seeMore{ cursor: pointer; text-align: center; align-items: center; background: #fff; border-radius: 10px; box-shadow: 0 1px 2px 0 rgba(60,64,67,.1), 0 2px 6px 2px rgba(60,64,67,.15); color: #212529; display: flex; font-size: 14px; height: 34px; justify-content: center; margin: 0 auto 15px; max-width: 335px;} .seeMore:hover { border: 1px solid; background-color: rgba(217, 83, 79, .1); color: #d70018; } .seeMore span:before{content:"\f0d7";font-family:FontAwesome;font-size:15px} .searAllmenu{background:#fff none repeat scroll 0 0;border:1px solid #eee;clear:both;overflow:hidden} section.product_d .detailP .desProduct .des{padding-top:5px;padding-bottom:10px;font-size: 16px;color: #525252; font-weight: 600;} .searAllmenu div{float:left;margin-left:8px;margin-top:10px;padding-bottom:10px} .searDelete{cursor:pointer;height:30px;margin-top:10px!important;width:17px;padding-left: 8px;} .searDelete:before{content:"\f057";font-family:FontAwesome} .yeu_cau_tu_van{background:rgba(0,0,0,0) url(../../images/yeu_cau.png) no-repeat scroll center center;height:448px;margin-bottom:-20px;margin-top:93px;position:relative} .yeu_cau_tu_van_in{background:rgba(0,0,0,0) url(../../images/bg.png) repeat scroll 0 0;overflow:hidden;z-index:999;height:448px;color:#fff} .yeu_cau_all{width:1170px;margin:auto} .box_yeu_cau_tu_van{float:left;margin-left:59px;width:454px} .yctvGioiThieu{background:#fff none repeat scroll 0 0;color:#333;float:right;margin-top:25px;padding:15px;width:550px} .titile_yeu_cau_tu_van{font-size:22px;padding-top:20px;text-align:center} .lineDhnh #dhn_Ghichu,.lineDhnh input{height:25px;opacity:1;cursor:text;padding-left:10px} .lineDhnh select{height:40px;width:380px;margin-top:10px;padding-left:5px;border:1px solid #e5e5e5} #dhn_Ghichu{height:60px!important;padding-top:10px} .dhnBottomRight{background: #ef4679 none repeat scroll 0 0;color: #fff;cursor: pointer;display: table;font-weight: 700;padding: 10px 20px;width: 91%;text-align: center;border-radius: 4px;} .complete-order-mobile{display: none;} .dhnBottomRight:hover{background:#f44336} .tai_sao_mhhad{clear:both;position:relative;width:1170px;margin:20px auto auto} .bo_kem_tr_t{background:rgba(255,255,255,.7);clear:both;font-family:arial;font-size:14px;line-height:20px;padding:17px 0;position:absolute;text-align:center;font-weight:700;z-index:9999;bottom:37%;width:100%} .tai_sao_mhhad_in{margin:auto;width:1200px;overflow:hidden;clear:both} .tai_sao_mhhad_video{border:5px solid #eaeaea;float:left;height:313px;overflow:hidden} .sakura_dtnb_in_left{background:#fdfcfa none repeat scroll 0 0;border:6px solid #eaeaea;float:left;margin-top:20px;overflow:hidden;width:877px} .sakura_dtnb_in_right{float:right;width:300px} .showroom_kd img{width:100%;height:auto!important;border-radius:2px} .dacTinhNoiBac{margin:auto;padding:10px} .dacTinhNoiBac h3{font-family:arial;font-size:16px;text-align:center} .dacTinhNoiBac p{margin:0;padding:7px 0 0} .showroom_kd{clear:both} .showroom_kd_all{clear:both;width:1170px;margin:auto;position:relative} .showroom_kd_all_ht .showroom_kd_item{border-bottom:1px solid #e1e1e1!important;border-top:medium none} .bnYecatuvans{align-items:center;background:#09a none repeat scroll 0 0;border-bottom:3px solid #e1e1e1;border-left:3px solid #e1e1e1;border-top:3px solid #e1e1e1;color:#fff;cursor:pointer;font-family:arial;font-size:15px;font-weight:700;height:15px;justify-content:center;padding:10px 18px;position:fixed;right:0;top:51px;z-index:1} .showroom_kd_item{background:#fff none repeat scroll 0 0;clear:both;padding:4px 4px 0} .showroom_kd_all .owl-pagination{display:none} . .showroom_kd_all .owl-buttons{display:none} .bo_kem_tr span{border-left:26px solid transparent;border-right:26px solid transparent;border-top:26px solid #e34d86;clear:both;display:table;height:0;margin:auto;position:relative;width:0;z-index:999} .bo_nam_cc_nam_n{height:400px} .iteam_right_nn{padding-top:10px} .sakura_dtnb{clear:both;height:436px;overflow:hidden} .sakura_dtnb_iteam{float:left;height:145px;margin-left:15px;margin-right:10px;overflow:hidden;padding-bottom:15px;text-align:center;width:192px} .sakura_dtnb_iteam img{border:4px solid #eaeaea;height:auto;width:180px} .qCkMai{clear:both;margin-top:8px;margin-bottom:8px} .qCkMai .qCkMaiFr{padding-right:46px} .sakura_dtnb_in_des{clear:both;font-size:14px;margin:14px auto 0;padding:10px 10px 0;text-align:center} .sakura_dtnb_in_dt{background:#eaeaea none repeat scroll 0 0;clear:both;font-size:14px;margin-top:20px;padding-top:4px;text-align:center} .doc_them,.thu_ngon{color:#f44578;margin-left:6px} .doc_them:after,.thu_ngon:after{content:"\f0d7";font-family:FontAwesome;padding-left:5px} .thu_ngon:after{content:"\f0d8"!important} .cart_oder ul li.sp .Cart_img{width:50px;display:block;float:left;text-align:center} #thongBaoMgg{clear:both;font-size:12px;padding-left:9px;padding-top:4px} #giam_gia{font-weight:700} .pTitile .user_lv2{position:absolute;top:31px;background:#fff;box-shadow:0 5px 5px rgba(0,0,0,.2);padding:5px 15px;z-index:9999;display:none;width: 200px} .pTitile .user_lv2 li a{color:#333} .grid .grid-item{float:left;width:200px} .step-indicator{border-collapse:separate;display:table;margin-left:0;position:relative;table-layout:fixed;text-align:center;vertical-align:middle;padding:20px 0} .step-indicator li{display:table-cell;position:relative;float:none;padding:0;width:1%} .step-indicator li:after{background-color:#e5e5e5;content:"";display:block;height:1px;position:absolute;width:100%;top:28px;left:50%} .step-indicator li:last-child:after{display:none} .step-indicator li.active .step{border-color:#ef4679;color:#ef4679} .step-indicator li .caption{margin-top:5px} .step-indicator li .caption,.step-indicator li .caption a{color:#999} .step-indicator li.active .caption,.step-indicator li.active .step_icon i{color:#ef4679;border-color:#ef4679} .step-indicator li.complete:after{background-color:#ef4679} .step-indicator li.complete .caption{color:#ef4679} .step-indicator li.complete .step_icon i{background:#ef4679;color:#fff;border-color:#ef4679} .step-indicator li .step{background-color:#fff;border-radius:50%;border:1px solid $wizard-color-neutral;color:$wizard-color-neutral;font-size:$wizard-step-font-size;height:$wizard-step-width-height;line-height:$wizard-step-width-height;margin:0 auto;position:relative;width:$wizard-step-width-height;z-index:1} .step-indicator li:hover{cursor:pointer} .step-indicator .step_icon i{padding:20px;background:#fff;border-radius:50px;border:1px solid #999;position:relative;z-index:500;width:15px;color:#999} .des_pay i{border-style:solid;border-width:1px;border-radius:50px;display:inline-block;padding:10px;width:13px} .des_pay i.fa-check{color:#0f0;border-color:#0f0} .des_pay i.fa-times{color:red;border-color:red} .form_tt input{margin-top:0} #form_tt .fa{font-size:15pt;padding:15px} #form_tt .fa.fa-square-o{color:#ccc} #form_tt .fa-check-square-o{color:#FD1D55} .swal-text{background-color:#fefae3;padding:17px;border:1px solid #f0e1a1;display:block;margin:22px;text-align:center;color:#61534e} .swal-footer{background-color:#f5f8fa;margin-top:32px;border-top:1px solid #e9eef1;overflow:hidden} .swal-button{background-color:#ef4679} .swal-button:not([disabled]):hover{background-color:#ef668f} .multiColor{position:relative;margin-bottom:45px} .multiColor ul{position:absolute;left:100px;z-index:100} .listColor li{border:1px solid #e5e5e5;margin:-1px 0;padding:0;width:300px;cursor:pointer;background:#fff;clear:both;overflow:hidden} .listColor li:hover{background:#f0f0f0} .listColor li.item{display:none} .listColor li span{vertical-align:middle;height:28px;display:block;float:left} .listColor li span.colorCode{width:30px;margin-right:5px} .listColor li span.colorName{line-height:28px;text-indent:5px} .listColor li.seleted i{float:right;line-height:28px;margin-right:10px} .multiColor .titleColor{font-weight:700;float:left;line-height:28px} .multiColor_2{margin-bottom:10px} .multiColor_2 span{width:35px;height:35px;display:inline-block;cursor:pointer;margin-right:10px;border-width:2px;border-style:solid;box-shadow:2px 2px 5px 2px #ccc;border-radius:100px} .multiColor_2 span.selected{border-color:#f47d3a!important} .listMultiSize{display:inline-block} .listMultiSize li{display:inline-block;margin:10px 2px;border:1px solid #ccc;color:#333;padding:8px 10px;cursor:pointer} .itemPriceSizeHidden{display:none} .itemPriceSizeShow{display:block} .listMultiSize li.outOfStockSize,.listMultiSize li.outOfStockSize:hover{border-color:rgba(0,0,0,.09);color:#999;cursor:not-allowed} .listMultiSize li.selected,.listMultiSize li:hover{border-color:#f44578;color:#f44578} .suggestCombo{background:#fff} .suggestCombo.suggestComboHidden{display:none} .suggestCombo.suggestComboShow{display:block} .suggestCombo .title{font-size:17px;padding:8px 0 15px;margin:0 10px} .suggestBox{display:flex;justify-content:space-around;margin:0 0 15px;align-items:center} .suggestBox .item{margin:3px 25px;text-align:center;max-width:280px} .suggestCombo .item i.fa-plus{font-size:35px;color:#ccc} .suggestBox .item figure{width:max-content;padding:20px;display:inline-block;margin-bottom:10px} .suggestBox .item h2{text-align:center;font-size:13px;font-weight:400;cursor:pointer} .suggestBox .item h2 .fa{width:18px} .suggestBox .item .price{color:red} .suggestBox .item .price .priceOff{text-decoration:line-through;color:#999} .suggestBox .itemTotal{text-align:left;max-width:inherit;flex-grow:1} .suggestBox .itemTotal .price{font-size:18px;line-height:25px} .suggestBox .itemTotal .btDah{line-height:15px;font-size:16px;padding:12px 0;width:300px} .suggestBox .itemTotal .btDah span{font-size:13px} .listVideo{display:flex} .listVideo li:nth-child(2){margin:0 15px} .listVideo li{position:relative} .listVideo img.icon{position:absolute;left:40%;top:40%} .listVideo img.image{max-width:100%} .images_d_list{max-width:450px} .image_product{width:auto;height:500px} .hotline-phone-ring-wrap{position:fixed;bottom:0;left:0;z-index:999999} .hotline-phone-ring{position:relative;visibility:visible;background-color:transparent;width:110px;height:110px;cursor:pointer;z-index:11;-webkit-backface-visibility:hidden;-webkit-transform:translateZ(0);transition:visibility .5s;left:0;bottom:0;display:block} .hotline-phone-ring-circle{width:85px;height:85px;top:10px;left:10px;position:absolute;background-color:transparent;border-radius:100%;border:2px solid #e60808;-webkit-animation:phonering-alo-circle-anim 1.2s infinite ease-in-out;animation:phonering-alo-circle-anim 1.2s infinite ease-in-out;transition:all .5s;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;opacity:.5} .hotline-phone-ring-circle-fill{width:55px;height:55px;top:25px;left:25px;position:absolute;background-color:#ef4679;border-radius:100%;border:2px solid transparent;-webkit-animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;transition:all .5s;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%} .hotline-phone-ring-img-circle{background-color:#ef4679;width:33px;height:33px;top:37px;left:37px;position:absolute;background-size:20px;border-radius:100%;border:2px solid transparent;-webkit-animation:phonering-alo-circle-img-anim 1s infinite ease-in-out;animation:phonering-alo-circle-img-anim 1s infinite ease-in-out;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;align-items:center;justify-content:center} .hotline-phone-ring-img-circle .pps-btn-img{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex} .hotline-phone-ring-img-circle .pps-btn-img img{width:20px;height:20px} .hotline-bar{position:absolute;background:#ef4679;height:40px;width:150px;line-height:40px;border-radius:3px;padding:0 10px;background-size:100%;cursor:pointer;transition:all .8s;-webkit-transition:all .8s;z-index:9;box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.1);border-radius:50px!important;left:33px;bottom:37px} .hotline-bar>a{color:#fff;text-decoration:none;font-size:13px;font-weight:700;text-indent:40px;display:block;letter-spacing:1px;line-height:40px;font-family:Arial} .hotline-bar>a:active,.hotline-bar>a:hover{color:#fff} @-webkit-keyframes phonering-alo-circle-anim { 0%{-webkit-transform:rotate(0) scale(.5) skew(1deg);-webkit-opacity:.1} 30%{-webkit-transform:rotate(0) scale(.7) skew(1deg);-webkit-opacity:.5} 100%{-webkit-transform:rotate(0) scale(1) skew(1deg);-webkit-opacity:.1} } @-webkit-keyframes phonering-alo-circle-fill-anim { 0%{-webkit-transform:rotate(0) scale(.7) skew(1deg);opacity:.6} 50%{-webkit-transform:rotate(0) scale(1) skew(1deg);opacity:.6} 100%{-webkit-transform:rotate(0) scale(.7) skew(1deg);opacity:.6} } @-webkit-keyframes phonering-alo-circle-img-anim { 0%{-webkit-transform:rotate(0) scale(1) skew(1deg)} 10%{-webkit-transform:rotate(-25deg) scale(1) skew(1deg)} 20%{-webkit-transform:rotate(25deg) scale(1) skew(1deg)} 30%{-webkit-transform:rotate(-25deg) scale(1) skew(1deg)} 40%{-webkit-transform:rotate(25deg) scale(1) skew(1deg)} 50%{-webkit-transform:rotate(0) scale(1) skew(1deg)} 100%{-webkit-transform:rotate(0) scale(1) skew(1deg)} } .header_large{width:100%;left:0;position:absolute;border-radius:5px;} .header_small{width:100%;top:0;left:0;height:294px;border-radius:5px} /* #codeme Css mới cho menu thương hiệu*/ .menuHidenth{width: 800px!important;border: 1px solid #ececec!important;box-shadow: 0 1px 3px rgba(204,204,204,.5)!important;left: 15px;position: absolute;border-radius: 3px;top: 23px;} .brand{display:inline-flex;overflow:hidden;width:100%} .brand p{margin:0;font-size:13pt;margin:5px 0 10px 0} .brand .brand_left{float:left;width:280px;padding:5px 5px 5px 10px} .brand_left input{width:95%;font-size:9pt;border-radius:5px;border:1px solid #e0e0eb;height:25px;padding-left:5px} .brand_left_boxsearch{width:100%;display:inline-flex;position:relative} .icon-search{position:absolute;right:6%;top:25%} .brand_left_boxsearch_result{height:15rem;overflow-y:scroll;overflow-x:hidden;margin:10px 10px 10px 0} ::-webkit-scrollbar{width:10px} ::-webkit-scrollbar-track{background:#f1f1f1} ::-webkit-scrollbar-thumb{background:#888} ::-webkit-scrollbar-thumb:hover{background:#555} .brand .brand_right{float:right;width:485px;padding:5px} .brand .brand_right .brand_right_hot{display:flex;flex-direction:row;flex-wrap:wrap;width:100%} .brand .brand_right .brand_right_item{width:24%;height:70px;margin-bottom:10px;margin-right:4px;padding:0} .brand .brand_right .brand_right_item_child:hover{border:solid 2px #E0E0EB;border-radius:5px;transition:.3s} .brand .brand_right .brand_right_item img{margin:auto;width:95%;padding:0 4px} .brand_right_button{height: 30px;display: flex!important;align-items: center;justify-content: center;border: solid 2px #E0E0EB;border-radius: 5px;width: 100%;} .brand_right_button:hover{background-color:#333078;color:#fff;transition:.3s} /*DONE*/ .listNewRelated li{border-bottom:1px solid #e5e5e5;padding:25px 0} .listNewRelated li h3{margin:0 0 15px} .listNewRelated li h3 a{font-weight:700;font-size:20px;line-height:25px} .listNewRelated li .flexBox{display:flex} .listNewRelated li .flexBox p{flex-grow:1;margin:0;font-weight:300;font-size:12pt;line-height:18pt} .listNewRelated li .flexBox p a{background:#ef4679 none repeat scroll 0 0;color:#fff;padding:8px 20px;font-size:11pt;line-height:60px} .listNewRelated li .flexBox figure{margin:0;max-height:180px;width:300px;overflow:hidden;margin-right:20px} .listNewRelated li figure img{max-width:none} section .groupPrice .priceBig{font-size:16px;position:relative} section .groupPrice .priceFinal{color: #FD1D55;font-size: 25px;font-weight: bold;padding-left: 10px;} section .groupPrice .priceDiscount{position:relative} section .groupPrice .priceOutOfStock{color:#666;font-size:20px;font-weight:300;line-height:35px} .list_image_detail{position:relative} .list_image_detail .downPercent{position: absolute;top: 6px;font-size: 20px;text-align: center;padding: 12px 0;width: 59px;z-index: 2;background: #FD1D55;left: 7%;color: #fff;border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;} .list_image_detail .downPercent:after{content:"";width:0;height:0;left:0;bottom:-8px;position:absolute;} section .groupPrice .linethow{text-decoration:line-through;color:#444} section#promotion .bannerFull{line-height:12px} section#promotion .container{background:#fff;margin:15px 0;padding:15px;width:1140px} section#promotion .listProduct li{display:inline-block;width:250px;vertical-align:top;cursor:pointer;margin:35px 16px} section#promotion .listProduct li figure{text-align:center} section#promotion .listProduct li figure img{height:200px} section#promotion .listProduct li .price{font-weight:700;margin:5px 0} section#promotion .listProduct li h2{margin:5px 0;font-size:11pt;height:60px} section#promotion .listProduct li .price .dl{text-decoration:line-through;color:#999;font-weight:400} section#promotion .listProduct li .btnAddCart{border:1px solid #717476;text-align:center;padding:5px;font-size:10pt;text-transform:uppercase} section#promotion .listProduct li:hover .btnAddCart{border-color:#ef4679;color:#ef4679} section#promotion .ckProduct{width:1000px;margin:auto;text-align:center} section#promotion .ckProduct .deCk{display:inline-flex;float:none;width:375px;text-align:left;vertical-align:top;align-items:center;border-bottom:1px solid #ccc;margin:0 20px} section#promotion .ckProduct .deCk:nth-child(5),section#promotion .ckProduct .deCk:nth-child(6){border-bottom:none} section#promotion .ckProduct .deCk .ttCK{line-height:20px;width:100%} .item{} footer .appInfo{text-align:center;border-bottom:5px solid #f0f0f0;padding-bottom:25px} footer .appInfo ul li{display:inline-block} footer .appInfo ul li img{width:230px} footer .appInfo ul li h3{font-size:15pt} footer .appInfo ul li h3 span{text-decoration:underline;font-weight:700;color:#ef4679} footer .appInfo p{font-size:18pt;line-height:35px;margin:0;font-weight:700} footer .appInfo p span{font-size:15pt;font-weight:400} footer .appInfo p i{font-size:11pt;font-weight:400} .title_brand{color: #1e1b1b;text-align: center;font-size: 15px;font-weight: bold;-webkit-text-stroke: thin;} .row_product_h h3 , .product_item h3 , .row_product_lq h3{text-align: center;} .row_product_h h2{padding: 0;} .fit-category {max-height: 250px;width: 100%;object-fit: cover;overflow: hidden;} footer .action-chat { display: flex; align-items: center; justify-content: space-between; gap: 20px; } } /* ===== hết mục 3 ===== */ /* ===== 4. GHI ĐÈ CO GIÃN ===== */ /* Khung 1170px cố định đổi sang co giãn, chỉ ở khoảng hẹp hơn 1170px. Từ 1170px trở lên giữ nguyên như bản gốc để không đổi một pixel nào. */ @media (min-width: 768px) and (max-width: 1169px) { .container, .list_menu_h, header .menu, header, section, footer, aside.navigation .brackRum, article.content_list, aside.content_list, .detailProduct-relate, .header_line, .yeu_cau_all, .tai_sao_mhhad, .showroom_kd_all { width: 100%; max-width: 1170px; } } /* Trang danh sách bài viết: section.content_ld là display:table nên giãn theo nội dung; owl đo dải banner lúc khởi tạo rồi đặt cứng, khung table lại giãn theo đó và giữ 1170px ở mọi khổ tablet. Dưới 1170px cho section làm khối thường, dải banner tính cả padding. */ /* Bố cục hai cột của trang danh sách và trang bài viết (danh mục, thương hiệu, tìm kiếm, giảm giá, blog, clinic & spa): cột lọc bên trái ~225px, cột nội dung rộng cứng 936px và float:right. Dưới 1170px tổng hai cột vượt màn hình nên cột nội dung trượt đè sang trái (lề trái âm). Cho cột nội dung lấy phần còn lại; mốc 1259px trùng với lưới thẻ. */ @media (min-width: 768px) and (max-width: 1259px) { /* section và khung bên trong là display:table nên nở theo nội dung và không tính padding vào bề rộng; cho chúng làm khối thường để bám đúng bề rộng màn hình. */ section.content_ld { display: block; } /* lề chung --hd-gutter (mục 13) để breadcrumb, nội dung và khối liên quan thẳng hàng */ section.content_ld, aside.navigation .brackRum { padding-left: var(--hd-gutter); padding-right: var(--hd-gutter); box-sizing: border-box; } /* Khung chi tiết sản phẩm rộng cứng 1150px: với lề trên, ở 1170–1197px nó lòi ra khỏi section. Cho co theo khung (dưới 1170px luật co giãn đã làm việc này). */ section.product_d .detailP { width: 100%; box-sizing: border-box; } /* Khung danh sách/dải banner rộng cứng 1170px, nay nằm trong section đã có padding */ aside.content_list, article.content_list { width: 100%; box-sizing: border-box; } /* Khối "sản phẩm liên quan" rộng cứng 1170px nằm trong section đã có padding 10px nên thò ra 20px ở dải 1170–1259px. */ .detailProduct-relate { width: 100%; max-width: 100%; box-sizing: border-box; } /* Trang đặt hàng: khung 1170px + padding 20px (content-box) = 1210px. */ section#dat_hang { width: 100%; max-width: 1170px; box-sizing: border-box; } aside.product_l { width: calc(100% - 235px); box-sizing: border-box; } /* Các view đặt width nội tuyến 908px cho khung này */ aside.product_l .product_boder { display: block; width: 100% !important; padding-left: 0 !important; box-sizing: border-box; } aside.product_l .product_ajax, aside.product_l .cps-block-content, aside.product_l .content-body, aside.product_l .content-body-genki { width: 100%; max-width: 100%; box-sizing: border-box; } /* Thẻ bài viết: width 47% cộng margin-right 25px cố định, ở cột hẹp tổng hai thẻ vượt 100% nên rớt còn một thẻ mỗi hàng và chừa mảng trống lớn. Dùng gap để luôn đủ hai thẻ. */ .content-body { gap: 16px; } .content-body .item { width: calc(50% - 8px); margin-right: 0; } /* Thanh lọc/sắp xếp: desktop dàn hai đầu với ô tìm kiếm rộng cứng 300px, cột hẹp thì tràn. Cho xuống dòng khi thiếu chỗ và ô tìm kiếm co theo phần còn lại. */ .filter-wp { flex-wrap: wrap; gap: 8px 12px; } .filter-wp > div { position: relative; flex: 1 1 220px; min-width: 0; } .filter-wp .input_search { width: 100%; box-sizing: border-box; } } /* Thẻ dịch vụ Clinic & Spa: desktop cố định 3 thẻ mỗi hàng (32%), ở cột hẹp thành quá nhỏ và số cột đổi không đều. Cho thẻ tự chọn số cột theo chỗ trống: 3 rồi 2 thẻ mỗi hàng. */ @media (min-width: 768px) and (max-width: 1259px) { .content-body-genki { gap: 16px; } .content-body-genki .item_genki { flex: 1 1 240px; max-width: none; padding-left: 0; padding-right: 0; } } /* Trang chi tiết bài viết: nội dung rộng cứng 834px + cột phải 300px = 1134px. Dưới 1170px hai khối chồng lên nhau rồi tràn ra ngoài. */ /* Còn đủ chỗ cho hai cột: nội dung lấy phần còn lại, cột phải vẫn 300px. */ @media (min-width: 1024px) and (max-width: 1259px) { article.content_list_de { width: calc(100% - 320px) !important; box-sizing: border-box; } } /* Hẹp hơn: cột phải xuống dưới, căn giữa, các mục dàn đều theo chỗ trống. */ @media (max-width: 1023px) { article.content_list_de { width: 100% !important; float: none; padding-right: 0; box-sizing: border-box; } aside.right_content { float: none; width: 100%; max-width: 780px; margin: 16px auto 0; padding: 0 10px; box-sizing: border-box; } aside.right_content .filter { display: flex; flex-wrap: wrap; gap: 14px 16px; } /* Mỗi mục là một hàng ảnh + tiêu đề như desktop; hai mục một hàng khi đủ rộng */ aside.right_content .filter .content_v { flex: 1 1 320px; display: flex; align-items: center; gap: 12px; height: auto; padding: 0; } aside.right_content .filter .content_v .images { float: none; flex: none; width: 120px; height: 80px; position: relative; } aside.right_content .filter .content_v .images img { width: 100%; height: 100%; object-fit: cover; border-radius: 5px; } aside.right_content .filter .content_v .detail { float: none; width: auto; flex: 1 1 auto; margin: 0; } /* Các nét trang trí của cột phải nằm trong khối min-768; dưới 768px khối này vẫn hiển thị nên lấy lại đúng dáng desktop: tiêu đề nền xám căn giữa, số thứ tự nằm trong ảnh. */ aside.right_content .titile_h { background: #E2E2E2; border-radius: 5px; margin: 10px 0; } aside.right_content .titile_h span { display: inline-block; width: 100%; padding: 5px 0; color: #000; font-size: 18px; font-weight: bold; line-height: 32px; text-align: center; } aside.right_content .filter .content_v .images span { position: absolute; left: 0; bottom: 0; margin: 0; width: 32px; height: 32px; line-height: 32px; border-radius: 0 2px 0 0; background: rgba(0, 0, 0, .2); color: #fff; font-size: 20px; text-align: center; } } /* Mũi tên "next" của dải banner (style trong view) có hộp rộng ~100px đặt right:-60px; ký tự mũi tên nằm trong khung, phần thò ra chỉ là khoảng trắng nhưng gây cuộn ngang khi viewport hẹp hơn ~1302px. Cắt phần thừa đó, hình không đổi. */ @media (max-width: 1301px) { aside.content_list-slider { overflow-x: clip; } } /* .footer-wp có viền 1px hai bên nên lòng trong chỉ còn 1168px, trong khi khung bên trong vẫn rộng cứng 1170px (kèm margin-right âm) — dư 1px khi viewport đúng 1170–1181px. */ @media (max-width: 1181px) { footer .homeEmail > .container { width: 100%; margin-right: 0; box-sizing: border-box; } footer .footer-wp > .container { width: 100%; box-sizing: border-box; } } /* Khối tài khoản/giỏ hàng có right:-15px cố tình thò ra ngoài khung 1170px; khi viewport chưa rộng tới 1200px thì 15px đó thành tràn ngang. Từ 1200px trở lên đã đủ lề, giữ nguyên. */ @media (max-width: 1199px) { header .actions { right: 0; } } /* Header bị ép min-width:1024px nên không co xuống được ở khổ tablet. Gỡ giới hạn đó để header co theo khung, hết tràn ngang 768–1169px. */ @media (max-width: 1169px) { header { min-width: 0; } /* Ô tìm kiếm / logo / khối tài khoản: xem khối "HEADER DESKTOP/TABLET" bên dưới, dùng chung một bộ luật cho cả >=1170px nên không đặt lại ở đây nữa. */ /* Footer: hai cột float rộng cứng chiếm hết chỗ, cột thông tin công ty bị ép còn ~60px. Đổi sang tỉ lệ của khung 1170px (440/1170, 389/1170), lề trái giảm dần từ 91px. */ .ft-desktop .footer-wp .link { width: 33.25%; } .ft-desktop .footer-wp .link.showroom { margin-left: max(16px, calc(100% - 1079px)); width: 37.6%; } /* Footer 3 khối (gọi mua hàng, góp ý, đăng ký email): bản gốc là float với padding 60px và ô đăng ký rộng cứng 290px + lề 50px, tổng ~1108px nên khối thứ 3 rớt hàng. Chuyển sang flex một hàng, các khối chia đều phần còn lại, ô email co theo khối. */ footer .homeEmail .container { display: flex; flex-wrap: nowrap; align-items: flex-start; } footer .homeEmail .ft_goi_mh { float: none; display: block; flex: 1 1 0; min-width: 0; box-sizing: border-box; padding-left: clamp(14px, 4vw - 16px, 60px); padding-right: clamp(14px, 4vw - 16px, 60px); } footer .homeEmail .ft_goi_mh .gmh_phone { font-size: clamp(18px, 1.3vw + 7px, 26px); white-space: nowrap; } footer .homeEmail .regisPhone { flex: 1.25 1 0; width: auto; height: auto; margin-left: 0; } footer .homeEmail .regisPhone #emailKm { width: calc(100% - 40px); box-sizing: border-box; } /* Nút gửi: bản gốc right:0 theo khung có padding, đặt lại ngay sau ô email */ footer .homeEmail .regisPhone .iconsend { right: auto; left: calc(100% - clamp(14px, 4vw - 16px, 60px) - 36px); } /* Thu gọn khoảng cách để bớt số lần phải xuống hàng. */ .menu_leve_1 .parent { margin-left: 10px; margin-right: 12px; } /* Trang sản phẩm khuyến mãi: khung 1140px và banner ảnh gốc 1170px tràn ngang */ section#promotion .container { width: auto; max-width: 1140px; box-sizing: border-box; } section#promotion .bannerFull img { max-width: 100%; height: auto; } section#promotion .ckProduct { width: auto; max-width: 1000px; } } /* ============================================================ HEADER DESKTOP/TABLET — CÂN ĐỐI Ở MỌI BỀ RỘNG (>=768px) Gộp chung một bộ luật cho cả khổ desktop (>=1170px) và khổ co giãn 768–1169px để khi kéo dãn không có điểm "nhảy" ở mốc 1170px. ============================================================ */ @media (min-width: 768px) { /* --- Hàng trên: ô tìm kiếm | logo | tài khoản+giỏ hàng --- Cả ba đều position:absolute trong .container (không đổi được vì .topbar nằm sau trong HTML nhưng phải hiện ở trên). Vì vậy căn bằng cách tính mốc: - ô tìm kiếm: bám mép trái, rộng 397px ở khung 1170px, hẹp hơn thì co theo khung (đúng bằng công thức cũ min(397px, 50% - 110px)). - khối tài khoản: bỏ chiều rộng cứng 495px và phần thò ra 15px, bám mép phải. - logo: đặt giữa khoảng trống còn lại bằng left/right + margin auto, nên luôn cách đều ô tìm kiếm và khối tài khoản. */ header .hd-desktop .formSearch { width: min(397px, calc(50% - 110px)); max-width: none; } header .hd-desktop .actions { width: auto; right: 0; } header .hd-desktop .logo_had { /* mép phải ô tìm kiếm (cộng 2px viền) */ left: calc(min(397px, 50% - 110px) + 2px); /* bề rộng khối tài khoản/giỏ hàng của khách vãng lai */ right: 325px; width: 68px; margin-left: auto; margin-right: auto; } /* Đã đăng nhập thì khối bên phải là "Xin chào, " nên rộng hơn khối khách vãng lai; nới mốc phải để logo không bị dồn sát lời chào. Trình duyệt không hỗ trợ :has() thì giữ mốc của khách vãng lai. */ @supports selector(:has(*)) { header .hd-desktop > .container:has(.user_lv1) .logo_had { right: 360px; } } /* --- Hàng menu --- Menu sống là .item_sub_menu_bar (thẻ