@charset "utf-8"; /* CSS Document ///////////////////////////////////////////////// _ _ _ _ ||¯ ¯ ¯\ |¯ \ |¯| /||¯ D 2 ¯||\ || |¯\ || | |\ | | /|| B U N 0 ||\ || |_/ || | | \ | | /|| Y N E 1 ||\ ||_ _ _// | | \ _| /||_ G O 9 _||\ ¯ ¯ ¯ dungneo@gmail.com 20/01/2019 ///////////////////////////////////////////////// */ @font-face { font-family: 'Roboto Condensed'; font-style: normal; font-weight: 300; src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(../fonts/RobotoCondensed-Light.woff) format('woff'); } @font-face { font-family: 'Roboto Condensed'; font-style: normal; font-weight: 400; src: local('Roboto Condensed Regular'), local('RobotoCondensed-Regular'), url(../fonts/RobotoCondensed-Regular.woff) format('woff'); } @font-face { font-family: 'Roboto Condensed'; font-style: normal; font-weight: 700; src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'), url(../fonts/RobotoCondensed-Bold.woff) format('woff'); } @font-face{font-family:BaomoiMenu;src:url(../fonts/font-menu.eot);src:local('☺'),url(../fonts/font-menu.eot?#iefix) format('embedded-opentype'),url(../fonts/font-menu.woff) format('woff'),url(../fonts/font-menu.ttf) format('truetype')} body {margin: 0; padding: 0; top: 0px !important; font-size: 14px; color: #111; font-family: 'Roboto', 'Roboto Condensed', Arial, Georgia, Helvetica, sans-serif; background: #F5F5F5} :root {--txtcolorall: #000; --fontsizeall: 16px; --bgcolor: #FFF; --headerbg: #368c17; --headercolor: #FFF; --menutopcolor: #1B57A0; --menutopcolorhover: #438de8; --maincolor: #12264B; --secondcolor: #c81519; --pricecolor: #F44; --starcolor: #F4AC00;} :before, :after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *:focus{outline: none;} a { color: #444; text-decoration: none } a, a:hover, a:focus { transition: color 0.4s ease 0s; text-decoration: none; } a:hover { color: #000; } button{cursor: pointer;} img{max-width: 100%; display: inline-block;} iframe{border: none;} input[type=button], input[type=submit],input[type=reset]{-webkit-appearance: none; -moz-appearance: none; appearance: none;} .page-wrapper{width: 100%; margin: 0; padding: 0; position: relative; } .neo-out{width: 100%; margin: 0 auto; padding: 0;} .neo{width: 1180px; margin: 0 auto; padding: 10px;} /* * Header */ .header-banner{position: fixed; top: 0; left: 0; width: 100%; z-index: 100; box-shadow: 0 5px 20px rgba(0,0,0,.05); -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;} .header-banner.scrolled{top: -41px;} .header-banner.scrolled .banner .logo{height: 60px;} .header{background: #F0F0F0; color: #222;} .header .neo{padding: 0px 10px} .header a{color: #555;} .header .name{color: #444; float: left; padding: 10px 0px; font-size: 16px; font-weight: normal; } .header .name .name-follow{color: #000;} .header .name .name-follow span{text-transform: lowercase;} .header .name a{margin-left: 20px; color: #444;} .header .name a:hover{color: #000;} .header .hotline-info{float: right;} .header a.hotline{color: #E53737; font-weight: bold;} .header .hotline-info a{height: 100%; font-size: 16px; display: inline-block; padding: 10px 24px; color: #444; padding-right: 0px;} .header .hotline-info a:hover{color: #000} .header .hotline-info .btn-search{} .page-menu{float: left;} .page-menu > ul, .page-menu > ul li{margin: 0px; padding: 0px; list-style: none;} .page-menu > ul{position: fixed; width: 300px; height: calc(100%); left: -100px; top: 0px; opacity: 0; visibility: hidden; border-right: 1px solid var(--bordercolor); background: #FFF; transition: all 0.4s ease;} .page-menu > ul.menu-top-active{position: fixed ; z-index: 999999; left: 0px; opacity: 1; height: auto; visibility: visible;} .page-menu > ul > li{display: block; width: 100%; border-bottom: 1px solid var(--bordercolor); text-align: left;} .page-menu > ul > li a{padding: 10px 0px; display: block; font-weight: 400; padding-left: 15px; font-size: 16px;} .page-menu > ul > li a.mnt-parent{font-size: 18px; font-weight: 600; color: #444;} .page-menu > ul > li a:hover{color: var(--maincolor);} .page-menu > ul > li a i{float: right; padding-right: 15px; transition: all 0.4s ease;} .page-menu > ul > li a:hover i{padding-right: 5px;} .page-menu > ul > li.mnt-loginout{background: var(--maincolor);} .page-menu > ul > li.mnt-loginout a{color: #FFF;} .page-menu > ul > li.mnt-loginout a:after{content: ""; display: table; clear: both;} .page-menu > ul > li.mnt-loginout a span{float: left; padding-left: 10px; line-height: 40px;} .page-menu > ul > li.mnt-loginout a i.fa-user{float: left; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #FFF; text-align: center; line-height: 40px; padding: 0px;} .page-menu > ul > li.mnt-loginout a i.fa-xmark{transform: scale(1); transition: 0.15s all ease; font-size: 32px; padding-top: 5px;} .page-menu > ul > li.mnt-loginout a:hover i.fa-xmark{padding-right: 15px; transform: scale(1.3);} .overlay{overflow: hidden;} .box-overlay.fixoverlay{content: ""; display: block; width: 100%; height: 100%; position: absolute; z-index: 99999; left: 0px; top: 0px; background: rgba(0, 0, 0, 0.4);} .banner.scrolled{position: fixed; top: 0px; left: 0; width: 100%; z-index: 99999; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;} .banner{background: var(--maincolor); color: #FFF; -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.15); box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.15); position: relative;} .banner .neo{padding: 0px 10px} .banner .logo{background: url(../images/logo.png?v=8544) left center no-repeat; background-size: contain; height: 100px; width: 150px; float: left;} .banner .logo a{display: block; width: 100%; height: 100%;} .banner .logo h1, .banner .logo h2{display: none;} .category{float: left; width: 50px; font-size: 16px;} .category a{display: block; width: 100%; overflow: hidden; margin-top: 30px;} .category .fa-bars{color: #FFF; font-size: 30px; float: left; padding-top: 10px;} .category div{float: left; margin-left: 10px;} .category div span{display: block; font-weight: bold; font-size: 18px;} .banner .box-search{width: calc( 100% - 680px); float: left; margin-top: 20px; padding: 0px 20px;} .banner .box-search form{border: 1px solid #eaeaea; background: #f9f9f9; border-radius: 50px; padding: 4px; width: 100%; overflow: hidden; display: inline-block; float: left; position: relative; height: 58px;} .banner .box-search form *{float: left;} .banner .box-search input{background: none; border: none; width: 100%; padding: 8px 10px 8px 10px; margin-top: 10px;} .banner .box-search select{padding: 8px; border: none; background: none; margin-top: 10px; position: absolute; right: 80px;} .banner .box-search button{background: var(--maincolor); border: none; color: #FFF; border-radius: 50%; width: 48px; height: 48px; font-size: 24px; text-align: center; line-height: 48px; position: absolute; right: 2px;} .banner .box-search button i{float: initial;} .banner .box-act-sys{width: 480px; float: right; text-align: right; margin-top: 20px;} .banner .box-act-sysin{display: inline-block; text-align: right;} .banner .box-act-sysin:after{clear: both; display: table; content: "";} .banner .box-act-sys a{padding-left: 16.5px; margin-top: 10px; display: inline-block; font-size: 14px; float: right; color: #FFF;} /*.banner .box-act-sys .btnCartAll{padding-left: 40px; margin-top: 5px; display: inline-block; font-size: 16px; float: right; }*/ .banner .box-act-sys a i{border: 1px solid #FFF; background: #FFF; border-radius: 50%; width: 40px; height: 40px; font-size: 20px; text-align: center; line-height: 40px; color: var(--maincolor); position: relative; display: inline-block; float: left;} .banner .box-act-sys a span{display: inline-block; float: left; text-align: center; padding-left: 5px;} .banner .box-act-sys a b{width: 24px; height: 24px; display: block; position: absolute; right: -10px; top: -5px; font-size: 12px; font-weight: normal; background: var(--maincolor); border-radius: 50%; color: #FFF; text-align: center; line-height: 24px; padding: 0px;} .banner .box-act-sys a span.sgline{line-height: 40px;} .banner .box-act-sys a:last-child{padding-left: 0px;} .banner .box-act-sys .search-suggest{padding-left: 37px; padding-top: 5px;} .banner .box-act-sys .search-suggest a{color: #888; margin-right: 15px; font-style: italic; } .cartQuanTotal{padding-left: 5px;} .menu-top{position: relative; background: var(--maincolor);} .menu-top .neo{padding: 0px 10px;} .menu-top ul, .menu-top li{margin: 0px; padding: 0px; list-style: none;} .menu-top li{position: relative; float: left;} .menu-top li a{font-size: 16px; color: #FFF; display: block; padding: 12px 40px;} .menu-top li a i{} .menu-top li a i.fa-home{font-size: 20px;} .menu-top li.active a, .menu-top li a:hover{ background: var(--menutopcolorhover);} /*background: #1c5199;*/ .menu-top .btn-reg a, .btn-reg a{background: #d12027; color: #FFF;} .menu-top .neo > ul > li:last-child{} .menu-top .neo > ul > li > ul { display: none; position: absolute; top: 44px; left: 0px; z-index: -1000; opacity: 0; width: 250px; background: var(--menutopcolorhover); border: 1px solid var(--menutopcolorhover); border-top: none; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; margin-top: 0px; -webkit-box-shadow: 0px 5px 12px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 5px 12px 0px rgba(0,0,0,0.75); box-shadow: 0px 5px 12px 0px rgba(0,0,0,0.75);} .menu-top .neo > ul > li:hover > ul {display: block; z-index: 99999999; opacity: 1; } .menu-top li li {display: block; width: 100%; margin: 0px; text-align: left;} .menu-top .neo > ul > li > ul > li > a:hover{color: #000;} .menu-top .neo > ul > li > ul > li:hover > ul{display: block; z-index: 99999999; opacity: 1;} .menu-top li li a {border: none; border-bottom: 1px solid #8de6af; color: #F6FAFF; font-size: 14px; font-weight: normal; display: block; padding: 10px 10px;} .menu-top li li a:hover{color: #000} .menu-top li li:last-child a{border-bottom: none;} .menu-top .open-menu{display: none;} /* * Box Slider */ .box-sliderads{padding: 0px 0px;} .box-slider-idx{height: auto; width: 70%; float: left; background: none;} .box-slider-idx .neo{padding: 0px 0px;} .box-slider-idx .owl-carousel .owl-stage-outer{border-radius: 10px;} .box-slider-idx .owl-carousel, .owl-carousel .owl-stage-outer, .owl-carousel .owl-stage, .owl-carousel .owl-item{height: 100%;} /*.box-slider-idx .owl-item{margin: 0px !important;}*/ .box-slider-idx .owl-item .item{position: relative; height: 100%;} /*.box-slider-idx .owl-item .item img{display: block; width: 100%; position: absolute; margin: auto; top: 0; bottom: 0; z-index: -1;}*/ /*.owl-carousel .owl-item{margin-right: 0px !important;}*/ .slider-content{position: relative; height: 100%; padding: 0px;} .slider-left{text-align: right; padding-right: 30px;} .slider-left .titledesc{text-transform: uppercase; font-weight: bold;} .slider-left p{font-size: 22px; color: #222; text-shadow: 1px 1px 0px #000; margin: 0px; padding-top: 10px;} .slider-call-buy{position: absolute; bottom: 50px; width: 100%; text-align: center;} .slider-call-buy .btnBuy{padding: 10px 40px; font-size: 20px; text-transform: uppercase;} .slider-call-buy .btnBuy:hover{color: #000;} .slider-call-buy .title{font-size: 24px; color: #000; text-transform: uppercase;} .owl-carousel .owl-dots {margin-top: 10px; position: absolute; bottom: 20px; left: 50%;} .owl-theme .owl-dots .owl-dot span{width: 15px; height: 15px; border: 2px solid #FFF; background: rgba(0, 0, 0, .25);} .owl-theme .owl-dots .owl-dot.active span{background: #000;} .box-slider-ads{width: 30%; float: left; padding-left: 10px;} .box-slider-ads.box-ads{} .box-slider-ads.box-ads .item{width: 100%; padding: 0px !important; margin-bottom: 10px;} .box-slider-ads.box-ads .item:last-child{margin-bottom: 0px;} .box-slider-ads.box-ads .item a{height: 133px;} .box-slider-ads.box-ads .item a img{object-fit: cover; height: 100%;} .suport-idx{} .suport-idx ul, .suport-idx li{margin: 0; padding: 0; list-style: none;} .suport-idx li{float: left; width: 25%; padding: 0px 10px;} .suport-idx li:nth-child(1){padding-left: 0px;} .suport-idx li:nth-child(2){} .suport-idx li:nth-child(3){} .suport-idx li:nth-child(4){padding-right: 0px;} .suport-idx li div{border: 1px solid var(--menutopcolorhover); padding: 10px 15px; font-size: 16px;} .suport-idx li div span{padding-right: 10px;} .suport-idx li a{font-size: 16px;} .suport-idx li a i{color: var(--menutopcolorhover); padding-right: 5px; font-size: 20px;} .suport-idx li a i.fa-facebook-official{color: #204898; margin-right: 10px;} .suport-idx li a i.fa-youtube-play{color: #df1818} .suport-idx li a i.icon-zalo{width: 18px; height: 18px; display: inline-block;} .neo-bg{background: url(../images/bg-diff.jpg) left center repeat-x;} .box-neopad{padding: 10px 0px} .box-round{border-radius: 8px; background: #FFF; padding: 20px;} .box-idx{font-size: 20px;} .box-idx .title{color: #333; font-size: 20px; margin-bottom: 20px; position: relative; } .box-idx .title:after{position: absolute; width: 76%; height: 1px; bottom: 4px; content: ""; right: 100px;} .box-idx .title .titleright{font-weight: normal; font-size: 16px; float: right;} .box-idx p{line-height: 1.8; padding: 0px; margin: 0px;} .box-idx .box-idx-50{width: 50%; float: left; padding-top: 20px;} .box-idx .box-idx-50.idx-50l{padding-right: 20px;} .box-idx .box-idx-50.idx-50r{padding-left: 20px;} .box-benefit .title{color: #23428C;} .box-benefit .content ul{margin: 0px; padding: 0px 0px 0px 15px;} .box-benefit .content li{margin-bottom: 10px;} .box-pro-hot{background: #FFF; padding-right: 20px; -webkit-box-shadow: 0px 10px 16px 0px rgba(0,0,0,0.35); -moz-box-shadow: 0px 10px 16px 0px rgba(0,0,0,0.35); box-shadow: 0px 10px 16px 0px rgba(0,0,0,0.35);} .box-pro-hot:hover{-webkit-box-shadow: 0px 10px 16px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 10px 16px 0px rgba(0,0,0,0.75); box-shadow: 0px 10px 16px 0px rgba(0,0,0,0.75);} .box-pro-hot .title{color: #b20000;} .box-pro-hot ul.product-idx-list, .product-idx-list li{margin: 0px; padding: 0px; list-style: none;} .product-idx-list li{overflow: hidden; border-bottom: 1px solid #DDD; padding-bottom: 10px;} .product-idx-list li:last-child{border-bottom: none;} .product-idx-list li a.icon{width: 160px; display: inline-block; float: left; padding-right: 10px;} .product-idx-list li a.name, .product-idx-list li span{float: left; display: block; width: calc(100% - 160px);} .product-idx-list li a.name{font-size: 22px; color: #23428C; margin-bottom: 10px;} .product-idx-list li .price{} .product-idx-list li .price i{font-style: normal; margin-right: 10px; text-decoration: line-through; color: #666;} .product-idx-list li .price b{} .box-idx.box-productidx .product-list li{margin-bottom: 20px;} .box-idx.box-productidx .product-list li h3{height: auto; margin-bottom: 5px;} .box-idx.box-prosaleoff .content{width: calc(100% - 300px); float: left; height: 330px; padding: 10px 10px 10px 0px; background: #dd2e00; -webkit-border-top-right-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px;} .prosaleoff-time{background: url(../images/sale-img.png) left center no-repeat; background-size: cover; height: 330px; width: 300px; float: left; text-align: center; -webkit-border-top-left-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-bottomleft: 10px; border-top-left-radius: 10px; border-bottom-left-radius: 10px;} .prosaleoff-time > div{margin-top: 56%;} .prosaleoff-time > div > span{display: block; margin-bottom: 10px; color: #FFF; font-size: 18px;} .prosaleoff-time a.btn{min-width: 200px; padding: 8px 10px; display: inline-block; margin-bottom: 10px;} .box-prosaleoff{} .box-prosaleoff .item div.ctr{display: none;} .countdown{font-size: 30px; color: #FFF; margin-bottom: 10px; display: inline-block;} .countdown > span{box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(165, 34, 0) 0px 4px 10px 0px; padding: 8px 10px; background: #FFF; color: #dd2e00; border-radius: 3px; display: inline-block;} .countdown > b{padding: 0px 15px; font-weight: normal; display: inline-block;} .owl-carousel{position: relative;} .owl-theme .owl-nav{margin-top: 0px;} .owl-theme .owl-nav .owl-prev{left: -10px; top: 45%;; position: absolute;} .owl-theme .owl-nav .owl-next{right: -10px; top: 45%; position: absolute;} .owl-theme .owl-nav [class*="owl-"]{height: 40px; width: 40px; display: inline-block; border-radius: 50%; text-align: center; line-height: 40px; color: #666; font-size: 24px; padding: 0px; cursor: pointer;} .owl-theme .owl-nav [class*="owl-"]:hover{background: rgba(221, 46, 0, .5); color: #FFF;} .owl-theme .owl-nav i{font-size: 24px;} .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{background: #FFF;} .box-slider-idx .owl-carousel .item a{width: 100%; height: 100%; display: block;} /*.box-slider-idx .owl-theme .owl-nav .owl-prev{left: 19%;; top: -230px; position: absolute;}*/ /*.box-slider-idx .owl-theme .owl-nav .owl-next{right: 19%; top: -230px; position: absolute;}*/ .box-idx.box-prosaleoff .owl-carousel .item{margin-right: 10px; background: #FFF; border-radius: 10px; overflow: hidden;} .box-idx.box-prosaleoff .owl-carousel .item h2{font-weight: normal; font-size: 14px; text-align: center; margin: 0; padding: 10px 0px;} .box-idx.box-prosaleoff .owl-carousel .item span.money{padding-top: 10px;} .box-ads{} .box-ads:after{content: ""; display: table; clear: both;} .box-ads .item{width: 33.3%; float: left;} .box-ads .item:nth-child(3n){padding-left: 10px; padding-right: 0px;} .box-ads .item:nth-child(3n+1){padding-left: 0px; padding-right: 10px;} .box-ads .item:nth-child(3n+2){padding-left: 5px; padding-right: 5px;} .box-ads .item a{display: block; width: 100%; border-radius: 10px; overflow: hidden;} .procat-list{margin-left: -5px; margin-right: -5px;} .procat-list:after{content: ""; display: table; clear: both;} .procat-list .item{width: 16.66%; float: left; padding: 5px;} .procat-list .item:hover .icon img{transform: scale(1.1);} .procat-list .item:hover > div{border-color: #FFF;} .procat-list .item > div{border: 1px solid var(--maincolor); border-radius: 5px;} .procat-list .item a{display: block; text-align: center; overflow: hidden;} .procat-list .item .icon{} .procat-list .item .icon img{transition: transform .2s;} .procat-list .item .name{font-size: 14px; font-weight: 400; padding: 5px; background: #E1EFFF;} .box-wherebuy{} .box-wherebuy p{margin-bottom: 15px;} .box-wherebuy .note{font-weight: bold;} .box-buynow{position: relative;} .box-buynow .content{font-size: 28px; text-align: center; color: #FDAE59; padding: 20px 20px; z-index: 1; position: relative; padding: 90px 20px;} .box-buynow .content:after{content: ''; top: 0; left: 0; bottom: 0; position: absolute; right: 0; display: block; width: 100%; height: 100%; opacity: .90; z-index: -1; background: url(../images/testosterone.jpg) center center no-repeat; background-size: cover;} .box-buynow .btnBuy{width: 70%; border-radius: 80px;} .box-productidx{} .box-productidx .product-list li .icon{height: 170px;} .box-productidx .title .titler{ text-transform: uppercase; display: inline-block;} .box-service-idx{background: #f5f5f5;} .box-service-idx .title{text-align: center; padding: 20px 0px;} .box-service-idx .titler{text-align: center; text-transform: uppercase; color: #444; color: #444; font-size: 20px;} .box-service-idx .content{padding: 10px 20px 0px 20px;} .box-service-idx .product-list li{width: 33.3%; min-height: auto;} .box-service-idx .product-list li .icon{height: auto; max-height: 230px;} /* * Box News */ .news-cat-relate{width: 23%; float: left; } .news-cat-relate.news-relater .title-rdur{padding-right: 138px} .news-idx-list, .news-idx-list li{margin: 0px; padding: 0px; list-style: none; overflow: hidden;} .news-idx-list{font-size: 16px; padding-left: 40px;} .news-idx-list li{width: 100%; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #DDD; overflow: hidden;} .news-idx-list li .icon{width: 150px; float: left; padding-right: 10px;} .news-idx-list li:last-child{border-bottom: none;} .news-idx-list li h5{margin: 0px; margin-bottom: 10px; font-size: 18px; font-weight: normal;} .news-idx-list li span{color: #888; font-size: 14px;} .box-newsidx{} .box-newsidx .news-idx-list{width: 50%; float: left; padding-left: 0px;} .hight-light{width: 50%; float: left; padding-right: 30px;} .hight-light .icon{width: 100%; overflow: hidden;} .hight-light .icon img{width: 100%;} .hight-light h4{font-weight: bold; padding: 0px; margin: 10px 0px;} .hight-light span{} .hight-light p{width: 100%;} .bggreen{background: var(--maincolor);} .box-bottom{background: #f2f2f2; padding: 25px 0px; color: #757575;} .box-bottom ul, .box-bottomer ul, .box-bottom li, .box-bottomer li{list-style: none; padding: 0px; margin: 0px;} .box-bottom li{float: left; width: 20%; color: #757575; font-size: 14px;} .box-bottom li i, .box-bottomer li i{font-size: 40px; float: left;} .box-bottom li > span, .box-bottomer li > span{width: calc(100% - 50px); font-size: 14px; padding-left: 10px; word-wrap: break-word; float: left; display: inline-block; padding-top: 0px;} .box-bottom li a, .box-bottomer li a{color: #FFF; font-size: 18px;} .box-bottomer{background: var(--maincolor); color: #FFF;} .box-bottomer li{float: left; width: 33.3%; color: #FFF; font-size: 18px;} .box-bottomer li > span{display: inline-block; width: auto;} .box-bottomer li > span > i{margin-right: 10px;} .box-bottomer li > span > span{font-size: 18px; width: auto;} .box-bottomer li:nth-child(1) > span > span{float: left;} .box-bottomer li:nth-child(2){text-align: center;} .box-bottomer li:nth-child(2) > span{margin: 0 auto; float: initial;} .box-bottomer li:nth-child(3) > span{float: right;} .reg-email{float: left; width: 70%; padding-right: 40px;} .reg-email > span, .follow > span{font-size: 20px; text-transform: uppercase; color: #FFF; float: left; padding-top: 10px;} .reg-email > span{width: 35%;} .reg-email form{position: relative; width: 65%; float: left;} .reg-email input{width: 100%; border-radius: 20px; background: #FFF; padding: 15px 15px; border: none;} .reg-email button{background: #ffd200; color: #FFF; font-size: 18px; text-transform: uppercase; padding: 12px 30px; border: none; position: absolute; right: 0px; top: 0px; -webkit-border-top-right-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px;} .follow{float: left; width: 30%;} .follow > span{padding-left: 20px;} .follow .social{float: right;} .follow .social a{width: 50px; height: 50px; display: inline-block; text-align: center; line-height: 50px; color: #FFF; border-radius: 50%; border: 2px solid #FFF; margin-left: 20px;} .follow .social a i{font-size: 24px;} .box-path{background: #FFF; border-bottom: solid 1px #edeff0; border-top: solid 1px #edeff0;} .box-path .neo{position: relative;} .box-path .path{padding: 5px 0px; font-size: 16px; color: #888;} .box-path .path i.fa-angle-right{padding-left: 10px; padding-right: 10px; font-size: 18px;} /*.box-path .path i:first-child{padding-left: 0px;}*/ .box-path .path-right{float: right;} .box-path .path-right a{margin-left: 20px;} .line-bottom{border-bottom: 1px solid #DDD;} .news-relate{} .news-relate li{width: 100%; height: auto; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #EEE; font-size: 16px;} .news-relate li i{padding-right: 5px;} .news-relate li:last-child{border-bottom: none;} .box-main { padding-top: 20px } .box-main-content { width: 70%; float: left; background: #FFF; border-radius: 10px; padding: 10px 15px;} .box-main-content.bmc-right{float: right; } /*padding-right: 0px; */ .box-main-content.main-full{width: 100%} .box-main-left { width: calc(30% - 20px); float: left; background: #FFF; border-radius: 10px;} .box-main-right { width: 20%; float: right; padding-left: 20px;} .box-main-content > div.title{padding: 8px 10px; font-size: 20px; background: var(--menutopcolorhover); color: #FFF; } .box-product-main .box-main-content{width: 80%;} .box-menuleft{} .box-menuleft, .box-menuleft li{margin: 0px; padding: 0px; list-style: none;} .box-menuleft{padding: 10px 10px 10px 15px;} .box-menuleft li{} .box-menuleft li a{font-size: 18px; font-weight: 600; padding: 8px 0px; display: block;} .box-menuleft li.active a, .box-menuleft li a:hover{color: var(--maincolor);} .menuleftcat{} .menuleftcat .mnt-parent{background: #EFF6FF; padding: 8px; text-align: center;} .menuleftcat .mnt-parent i{display: none;} .menuleftcat li i{float: right;} .box-left {background: #f5f5f5; padding: 0px 10px; } .box-left .box-left-title { padding: 10px; color: #000; font-size: 18px; text-transform: uppercase } .box-left ul, .box-left li { list-style: none; margin: 0px; padding: 0px; overflow: hidden } .box-left ul {} .box-left li { font-size: 16px; padding: 10px 0px 10px 10px; } /*.box-left li:first-child{padding-top: 0px;}*/ /*padding-bottom: 0px;*/ .box-left li:last-child{border-bottom: none;} .box-left li a.icon { width: 90px; padding-right: 10px; display: inline-block; float: left; overflow: hidden } .box-left li span.title, .box-left li span.desc {display: block; width: 100%; float: left; width: calc(100% - 90px);} .box-left li span.desc { font-size: 14px; font-style: italic; padding-top: 10px } .person-list{padding: 0px; /*border: 1px solid #DDD; border-top: none;*/} .person-list li{} .person-list li.active a, .person-list li:hover a{color: var(--maincolor);} .person-list li i{width: 30px; padding-right: 5px;} .box-ml-procat li{} .box-ml-procat li:last-child{border-bottom: none;} .box-ml-procat li span{float: right;} .box-ml-procat a, .box-ml-pro a{color: #444; font-size: 16px; font-weight: bold;} .box-ml-procat a:hover, .box-ml-pro a:hover{color: #000;} .box-ml-procat .mn-pro-name{float: left;} .box-ml-pro .mn-pro-name{width: calc(100% - 90px); float: left;} .box-pro-lbl{float: left; font-size: 20px; text-transform: uppercase; padding-top: 10px;} .box-pro-lbl span{color: #999; text-transform: none;} .line{} .boxSort{float: right;} .boxSort select{padding: 10px 20px; border-radius: 0px; border: 1px solid #DDD; font-size: 16px;} .box-right { } .box-right .box-right-title { padding: 10px 0px; font-size: 16px; text-transform: uppercase } .box-right ul, .box-right li { list-style: none; margin: 0px; padding: 0px; overflow: hidden } .box-right li { font-size: 16px; padding: 10px 0px; position: relative;} .box-right li a.icon { width: 100%; display: block; overflow: hidden } .box-right li span.title, .box-right li span.desc { width: calc(100% - 90px); display: inline-block; float: left } .box-right li span.desc { font-size: 14px; font-style: italic; padding-top: 10px } .box-right .box-right-hotsup{padding-top: 0px;} .box-right li.hotline a, .box-right li.hotline a i{ color: #e41f1f; font-size: 26px;} .box-right .box-right-hotsup.suport-idx li{width: 100%; padding-left: 0px; padding-right: 0px;} .box-right .box-right-hotsup.suport-idx li div{padding-right: 0px;} .box-right .box-right-hotsup.suport-idx li div:after{clear: both; display: table; content: ""} .box-right .box-right-hotsup.suport-idx li div a{font-size: 14px;} .box-right .box-right-hotsup.suport-idx li div a i{float: left; width: 30px;} .box-right .box-right-hotsup.suport-idx li div a span{float: left; width: calc(100% - 30px); padding: 0px;} .box-right li h2, .box-right li h3{font-weight: normal; text-align: center; font-size: 16px;} .box-member-left{width: 20%;} .box-member-right{width: 80%;} .box-member{background: #f5f5f5;} .news-list, .news-list li { list-style: none; margin: 0px; padding: 0px;} .news-list li{width: 100%; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #DDD;} .news-list li:after{clear: both; display: table; content: ""} .news-list li > a.icon {width: 200px; float: left; overflow: hidden; } .news-list li > a.icon img { height: 100% } .news-list li > div{width: calc(100% - 200px); padding-left: 10px; float: left;} .news-list li > div > h2{margin: 0px; padding-bottom: 10px;} .news-list li > div > h2 a{font-size: 18px; font-weight: 500;} .news-list li p { color: #777; font-size: 16px; margin: 0px;} .news-list li:last-child{border-bottom: none;} .news-list li > h2{} .news-list li > h2 a{font-size: 18px; font-weight: 500} .relate-list, .relate-list li { list-style: none; margin: 0px; padding: 0px; overflow: hidden } .relate-title {padding: 5px 15px; font-size: 16px; color: #c82d31; margin-bottom: 20px; border-left: 4px solid #c82d31; font-weight: bold;} .relate-list li { width: 100%; height: auto; padding-bottom: 10px; margin-bottom: 10px; font-size: 16px;} .relate-list li i { padding-right: 5px } .relate-list li:last-child { border-bottom: none } .relate-list li h2, .relate-list li h3{font-size: 16px; font-weight: 500; margin: 0px;} .created{font-size: 14px; color: #666;} .box-news-details .box-main-right{width: 25%; padding-left: 15px;} .box-news-details .box-ml-news li:first-child{margin-bottom: 10px;} .box-news-details .box-left li:first-child a.icon{width: 100%; padding: 0px; margin-bottom: 10px;} .box-news-details .box-left li:first-child span.title{width: 100%;} .box-news-details .box-left li:first-child span.title a{color: #000;} .box-news-desc{background: #f4f4f4; padding: 20px; line-height: 1.8; font-size: 18px;} .box-news-img{text-align: center;} .box-news-content{font-size: 16px; line-height: 1.8;} .product-list, .product-list li{margin: 0px; padding: 0px; list-style: none;} .product-list{margin-left: -5px; margin-right: -5px; display: flex; flex-wrap: wrap;} .product-list li{width: 20%; float: left; margin-bottom: 20px; font-size: 18px; position: relative; min-height: 240px; padding-left: 5px; padding-right: 5px; text-align: center;} /*.product-list li:nth-child(4n){padding-left: 20px; padding-right: 0px;} .product-list li:nth-child(4n+1){padding-left: 0px; padding-right: 20px;} .product-list li:nth-child(4n+2){padding-left: 10px; padding-right: 10px;} .product-list li:nth-child(4n+3){padding-left: 10px; padding-right: 10px;} .product-list li:nth-child(4n+4){padding-left: 10px; padding-right: 10px;}*/ .product-list li span.boxicon, .box-prosaleoff div span.boxicon, .products div span.boxicon{position: relative;} .product-list li .icon, .box-prosaleoff div .icon, .products div .icon{position: relative; overflow: hidden; display: block; cursor: pointer; max-height: 220px; } .product-list li .icon img, .box-prosaleoff div .icon img, .products div .icon img{height: 100%; width: 100%;} .product-list li .icon span{} .product-list li .pcat a{font-size: 16px; text-transform: uppercase; color: #666;} .product-list li h2, .product-list li h3{padding: 10px 0px 0px 0px; margin: 0px; height: auto; overflow: hidden; text-align: center; text-overflow: ellipsis; margin-bottom: 0px; line-height: 1;} .product-list li h2 a, .product-list li h3 a{color: #333; font-weight: normal; font-size: 16px;} .product-list li .icon > div, .box-prosaleoff div.item .icon > div, .products div.item .icon > div{position: absolute; display: none; top: 0px; left: 0px; right: 0px; bottom: 0px; background: rgba(0, 0, 0, .45); text-align: center;} .product-list li .icon > div .btn-cart, .box-prosaleoff div.item .icon > div .btn-cart, .products div.item .icon > div .btn-cart{margin-top: 45%; background: rgba(255, 255, 255, .75); color: var(--maincolor); border-color: #FFF; border-radius: 4px; font-weight: 600;} .product-list li .icon > div a{margin-top: 35%;} .product-list li:hover .icon > div, .box-prosaleoff div.item:hover .icon > div, .products div.item:hover .icon > div{display: block;} .product-list li > div.ctr{display: none;} .product-listin li{width: 25%;} .box-titleinfo{font-size: 16px;} .box-titleinfo h1, .box-titleinfo h2{font-size: 18px; font-weight: 600; margin: 0px; padding-bottom: 10px;} .products{} .products .item{background: #FFF; border-radius: 10px; overflow: hidden; text-align: center; margin-right: 10px; } .products .item h2{font-weight: normal; font-size: 16px; text-align: center; margin: 0; padding: 10px 0px;} .products .item span.money{padding-top: 10px;} .products .item span.cat, .product-list li span.cat{display: block;} .products .item span.cat a, .product-list li span.cat a{font-size: 14px; color: var(--maincolor)} .products .item span.cat a:hover, .product-list li span.cat a:hover{color: #000} .box-product-slider .products .item{margin-right: 0px;} .box-prosaleoff div.item .icon > div a{margin-top: 30%;} .btn-cart, .btnBuy, .btnBorder{display: inline-block; background: var(--maincolor); color: #FFF; padding: 10px 12px; margin: 10px auto; border: 1px solid var(--maincolor); text-align: center;} .btnBorder{background: none; color: var(--maincolor);} .btn-cart:hover, .btnBuy:hover{color: #000;} .product-info .btn-cart, .product-info .btnBuy{width: calc(50% - 10px)} .sale-off {position: absolute; left: 10px; top: 10px; background: var(--menutopcolorhover); color: #FFF; font-size: 16px; border-radius: 50%; width: 50px; height: 50px; text-align: center; line-height: 50px;} /* block none*/ .product-list li span.icon .btnAddCart{display: none;} .product-list li span.icon:hover .btnAddCart{display: block;} .btnAddCart{text-align: center; position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.5); } .btnAddCart .btn-cart{margin-top: 30%;} .money{display: block; font-size: 18px; text-align: center; color: #f92e2f;} .money i{text-decoration: line-through; font-style: normal; margin-right: 10px; color: #666;} .money b{margin-right: 10px; color: #f92e2f;;} .money sup{text-decoration: underline;} #boxCtDt{} #boxCtDt .frmElement{width: 50%; float: left; clear: initial;} #boxCtDt .frmElement:nth-child(1){padding-right: 15px;} #boxCtDt .frmElement:nth-child(2){padding-left: 15px;} #boxCtDt .frmElement .element{width: 100%;} #boxCtDt select{text-indent: 0px !important; width: 100%;} .warehouses{} .warehouses .item{width: 100%; font-size: 16px; padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #ECECEC;} .warehouses .item .name{font-size: 18px; font-weight: 600;} .warehouses .item p{margin: 0px; padding: 5px 0px;} .warehouses .item p span{font-weight: 600;} .warehouses .item:last-child{border-bottom: none;} .btn-red{background-color: #b20000;} .marr20{margin-right: 20px;} #frmPayment .cart-products p > input{color: #222} .product-details{} .product-img-slide{width: 55%; float: left;} .product-img{width: 100%; overflow: hidden; position: relative; border: 1px solid #DDD;} .product-img img{cursor: pointer; display: block; } .product-img .pi-title{position: absolute; bottom: 0px; left: 0px; width: 100%; background: rgba(0, 0, 0, 0.55); text-align: center; padding: 10px 10px; font-size: 16px; color: #FFF;} .img-loading{display: none; position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; text-align: center; padding-top: 20%; background: rgba(0,0,0,.5);} .img-loading.active{display: block;} .img-loading i{font-size: 80px; color: #FFF;} .product-slide{margin-top: 20px;} .product-slide ul, .product-slide li{margin: 0px; padding: 0px; list-style: none; overflow: hidden;} .product-slide ul{overflow: hidden;} .product-slide li{width: 25%; float: left; overflow: hidden; padding: 5px; border: 1px solid #DDD; margin-right: 10px;} .product-slide li a{display: block; height: 80px; /*width: 100%;*/ text-align: center;} .product-slide li img{width: 100%; height: 100%} .product-slide li.over{display: none;} .product-slide li.active{border: 1px solid var(--maincolor);} .product-slide li.active a{} .product-slide li:last-child{margin-left: 0px;} .product-slide .control{position: relative;} .product-slide .control a{position: absolute; z-index: 99999; top: -60px; border-radius: 50%; width: 30px; height: 30px; display: block; border: 1px solid #333; text-align: center; font-size: 20px; background: rgba(255, 255, 255, .75);} .product-slide .control a:hover{border-color: var(--maincolor); color: var(--maincolor);} .product-slide .control a.btn-left{left: -10px;} .product-slide .control a.btn-right{right: -10px;} .product-slide .control a i{margin-top: 4px;} .product-slide-item{width: 100%; overflow: hidden;} .product-slide-item ul{transition: all 0.25s ease 0s;} .product-info{width: 45%; float: left; padding-left: 20px; font-size: 18px;} .product-info h1{font-size: 24px; font-weight: normal; margin: 0; padding-bottom: 10px;} .product-info > div, .product-info .product-info-price > div{margin-bottom: 10px;} .product-info > div > span{width: 100px; display: inline-block;} .product-info > div select, .product-info > div input{padding: 6px 8px; border: 1px solid #DDD; border-radius: 20px; width: 200px;} .product-info .product-info-price{background: #f5f5f5; padding: 10px 15px;} .product-info .money{text-align: left;} .product-info .price{font-size: 22px;} .product-info .btn-buy{/*padding: 10px 0px;*/} .add-favorite{font-size: 16px; color: #999; padding-bottom: 10px;} .add-favorite i{margin-right: 5px;} .free-ship{font-size: 16px; color: #00a456; text-transform: uppercase; } .free-ship i{font-size: 22px; margin-right: 5px;} .product-details-content{font-size: 16px;} .payment-btn{} .payment-btn .btn{width: 45% !important; float: left;} /*.payment-btn .btn:first-child{margin-left: 0px;}*/ .payment-btn input.btn[type=reset]{float: right;} .box-search-main .box-main-content{width: 100%;} .news-list.nl-search li a.icon{display: block;} .news-list.nl-search li a.icon{width: 200px; float: left; padding-right: 15px;} .box-service-idx .item{float: left; text-align: center;} .box-service-idx .item .icon{width: 100%;} .box-service-idx .item a{font-size: 16px; display: block; padding-top: 20px;} .box-service-idx .owl-theme .owl-nav{position: absolute; top: 50%; width: 100%;} .box-service-idx .owl-theme .owl-nav .owl-prev{left: -40px; top: -20px;} .box-service-idx .owl-theme .owl-nav .owl-next{right: 0px; top: -20px;} .info-list{} .info-list i{padding-right: 10px;} .info-share{padding-bottom: 15px;} .is-info span{padding-right: 10px;} .is-info span i{font-style: normal;} #ggMap{width: 100%; height: 500px; border: none;} .box-contact{margin-top: 20px;} .box-contact .contact-title{font-size: 20px; font-weight: bold;} .contact-frm, .contact-content{width: 50%; float: left;} .contact-frm{padding-right: 40px;} .contact-frm .frmElement{padding: 5px 0px;} .contact-content{padding: 30px; background: #f3f3f3; font-size: 18px;} .contact-content .contact-title{text-align: center; font-weight: normal; } .contact-content .contact-title span{border-bottom: 1px solid #999; padding-bottom: 5px;} .relative{padding: 15px 0px; margin-bottom: 15px; font-size: 16px; border-bottom: 1px solid #DDD} .paging{padding: 10px 0px} .paging .page-list{float: left;} .paging .page-select{float: right;} /* * Footer */ .footer{padding: 30px 0px; color: #333; background: #fff; font-size: 16px;} .footer p{margin: 0px 0px 10px 0px; color: #333; font-size: 16px;} .footer p b{} .footer ul, .footer ul li{margin: 0px; padding: 0px; list-style: none; overflow: hidden;} .footer li{font-size: 16px; line-height: 1.85;} .footer a{color: #333; font-size: 16px; } .footer a i{padding-right: 10px;} .footer a:hover{color: #0e74ff} .footer .neo{padding-top: 20px; padding-bottom: 0px;} .footer .info{width: 23.3%; float: left;} .footer .info.infofist{width: 15%;} .footer .info.infolast{width: 38.3%;} .footer .info .title{font-size: 16px; font-weight: bold;} .footer .info li a{font-size: 14px;} .footer .info form{position: relative; margin-bottom: 20px;} .footer .info input[type=text]{background: #fafafa; border: 1px solid #DDD; border-radius: 20px; padding: 10px; width: 100%;} .footer .info input[type=submit]{background: var(--maincolor); padding: 10px; border: none; position: absolute; right: 0px; color: #FFF; border: 1px solid var(--maincolor); -webkit-border-top-right-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px;} .footer .info p i{width: 25px;} i.icon-zalo{background: url(../images/icon-zalo.png) center center no-repeat; background-size: cover; width: 30px; height: 30px; padding: 0px; display: inline-block;} .social-bank{} .social-bank .box-social{width: 50%; float: left;} .social-bank .box-social a {font-size: 40px;} .social-bank .box-bank{width: 50%; float: right; text-align: right;} .social-bank .box-bank a:first-child{width: 100%; display: block;} .social-bank .box-bank a{color: var(--maincolor); font-size: 36px;} .box-dowmobile{width: 50%; float: left;} .box-dowmobile p{font-size: 20px; text-transform: uppercase; color: var(--maincolor); font-weight: 500;} .box-dowmobile .qrcode{width: 100px; float: left;} .box-dowmobile .qrcode img{width: 100%; height: auto;} .box-dowmobile .stores{width: 150px;float: left;} .box-dowmobile .stores a{display: block;} .copyright{padding-top: 20px; margin-top: 30px; text-align: center; color: #444; border-top: 1px solid #DDD;} /* back top top */ .scrollup { background: var(--maincolor); bottom: 82px; display: none; position: fixed; right: 10px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; width: 40px; height: 40px; text-align: center; font-size: 13px; color: #fff; text-transform: uppercase; font-weight: 600; padding: 2px; z-index: 9999; } .scrollup .fa { display: block; } .scrollup:hover { opacity: 0.8; filter: alpha(opacity=80); color: #fff; } .pager{width: 100%; display: block; padding: 10px 0px; text-align: center; font-size: 16px; color: #999} .pager span{color: #FFF; background: var(--maincolor); padding: 4px 12px; border-radius: 4px; text-align: center; display: inline-block; margin-right: 10px;} /*border: 1px solid #DDD; */ .pager a{color: #444; padding: 4px 10px; margin-right: 10px; /*border: 1px solid #DDD; border-radius: 4px; */} .pager a:hover{color: #000} .tabs{width: 100%; border-bottom: 1px solid #EEE;} .tabs .tab{float: left; padding: 10px 40px 10px 0px; text-align: center; color: #333; position: relative;/* width: 33%; background: #F5F5F5;*/} .tabs .tab a{color: #333; width: 100%; height: 100%; display: block; font-size: 20px;} .tabs .tab.active{background: #FFF} .tabs .tab.active a, .tabs .tab a:hover{color: var(--maincolor);} /*.tabs .tab.active:before{content: "\f0d7"; display: inline-block; font-family: FontAwesome; font-size: 40px; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; top: -30px; left: 45%; color: #AE0D0D;}*/ .tabs .tab.active:after{content: " "; display: inline-block; position: absolute; bottom: -2px; left: 0%; height: 3px; background: var(--maincolor); width: 100%;} .tabs-content{padding: 10px;} .tabs-content .content{display: none;} .tabs-content .content.active{display: block;} .product-info-share{} .product-info .product-info-share > span{padding-right: 20px; width: auto; float: left; padding-top: 10px;} .product-info-share a{margin-right: 15px; float: left;} .product-info-share a i{width: 40px; height: 40px; text-align: center; line-height: 40px; border-radius: 50%; color: #FFF;} .product-info-share a i.fa-facebook{background: #204898;} .product-info-share a i.fa-youtube-play{background: #df1818;} .product-info-share a i.icon-zalo{} .copylink{margin: 15px 0px; position: relative;} .copylink .cpltitle, .copylink > a{font-weight: bold;} .copylink .cplcontent{border: 1px solid #DDD; padding: 8px 10px; margin: 10px 0px; width: 100%; display: inline-block;} .copylink.cpright > a{position: absolute; top: 28px; right: 0px; background: var(--maincolor); padding: 10px; color: #FFF; } .dn-tab-title span{height: 100%; padding-bottom: 10px; width: auto; display: inline-block; border-bottom: 1px solid #555;} .productListRight span.icon{cursor: pointer;} .tbl-list{width:100%; } .tbl-list th{padding: 10px 10px; vertical-align:middle; font-size:14px; font-weight:normal; border-right: 1px solid #2866BB; background: #1C5199; color: #FFF; text-transform: uppercase;} .tbl-list th:last-child, .tbl-report th:last-child{border-right: none;} .tbl-list td{min-height:32px; vertical-align:middle; background:#FFF; font-size:14px; font-weight:normal; border-bottom: 1px solid #EEE; padding: 12px 5px;} .tbl-list tr:nth-child(2n) td, .tbl-list tr:hover td{background: #FBFBFB} .tbl-list tr td:first-child{text-align: center;} .tbl-list tr td:last-child a{margin-left: 10px;} .tbl-list tr td.left{text-align: left;} .tbl-list tr td.center{text-align: center;} .tbl-list tr td.right{text-align: right;} .tbl-list td img{width: 100px; max-height: 100px; cursor: pointer;} .tbl-list td img.normal{width: auto; max-height: initial; margin-right: 5px;} .tbl-list .price{text-align: right; font-weight: bold;} .tbl-list .price span{width: 100%; display: block; font-size: 18px; margin-bottom: 10px;} .tbl-list .price span:last-child{margin-bottom: 0px;} .tbl-list .price i{width: 30px; font-size: 20px; margin-right: 10px; float: left;} .tbl-list .price span.gift{color: var(--menutopcolorhover);} .tbl-list .price i.fa-gift{color: var(--menutopcolorhover);} .tbl-list .price b{} .tbl-person{} .tbl-list.tbl-person th{background: none; border: none; color: #111; font-weight: bold; border-bottom: 1px solid #DDD;} .ordRowMb{display: none;} .neo-search, .neo-cart{width: 100%; height: 100%; position: absolute; z-index: -9999; display: none; top: -9999px; left: 0px; background: #FFF; } .neo-search.active, .neo-cart.active{z-index: 9999; display: block; top: 0px;} .neo-search .neo-search-close, .neo-cart .neo-cart-close{position: absolute; right: 50px; top: 50px; font-size: 30px;} .neo-search .neo-search-close i, .neo-cart .neo-cart-close i{font-size: 30px;} .neo-search-in{margin: 20% auto 0px; text-align: center;} .neo-search-in form{font-size: 0px;} .neo-search-in input[type=text]{padding: 10px 15px; background: #FBFBFB; border: 1px solid #DDD; min-width: 250px; height: 40px;} .neo-search-in button{height: 40px; background: #333; border: 1px solid #000; padding: 10px 20px; color: #FFF; cursor: pointer;} .neo-cart .neo-cart-close{top: 10px; right: 10px; font-weight: normal; } .neo-cart .neo-cart-close i{color: #FFF; font-size: 18px;} .neo-cart .neo-cart-close a{display: block; padding: padding: 0px 10px;;} .neo-cart.active{background: rgba(0, 0, 0, .5); position: fixed; z-index: 99999999;} .neo-cart-in{right: 0px; min-width: 320px; width: 400px; background: #333; float: right; color: #FFF; position: relative; padding: 20px 20px; -webkit-box-shadow: 5px 5px 10px 10px rgba(0,0,0,0.75); -moz-box-shadow: 5px 5px 10px 10px rgba(0,0,0,0.75); box-shadow: 5px 5px 10px 10px rgba(0,0,0,0.75);} .neo-cart-in .title{border-bottom: 1px solid #999; padding-bottom: 10px;} .neo-cart-in .title span{font-size: 18px;} .neo-cart-in .content{min-height: 300px; height: 300px; border-bottom: 1px solid #999; margin-bottom: 15px; overflow-y: auto;} .neo-cart-in .action{} .neo-cart-in .action .act-btn{} .neo-cart-in .action .btnCartAct{width: 45%; display: block; padding: 10px 10px; text-align: center; font-size: 16px; background: #FFF; border: none;} /*.neo-cart-in .action .btn-payment{width: 100%; display: block; padding: 10px 15px; text-align: center; font-size: 18px; background: #FFF; border: none;}*/ .neo-cart-in .action .btn-payment{float: left; } .neo-cart-in .action .btn-payment:hover{background: #DDD} /*.neo-cart-in .action .btn-payment i{padding-left: 10px;}*/ .neo-cart-in .action a i{padding-left: 10px;} .neo-cart-in .action .btn-continue{float: right;} .cart-products, .cart-products li{margin: 0px; padding: 0px; list-style: none; overflow: hidden;} .cart-products li{border-bottom: 1px solid #e6e6e6; padding: 15px 10px 15px 0px; } .cart-products li:last-child{border-bottom: none;} .cart-products .cp-icon{width: 100px; display: inline-block; overflow: hidden; float: left; padding-right: 10px;} .cart-products .cp-icon img{width: 100%;} .cart-products .cp-name{color: #FFF; font-size: 16px;} .cart-products p{margin: 0px; padding-top: 10px; width: 100%; float: left;} .cart-products p > input{float: left; width: 40px; height: 30px; background: none; border: 1px solid #999; color: #FFF; padding: 5px; text-align: right;} .cart-products .cp-plus, .cart-products .cp-minus{float: left; height: 30px; width: 25px; display: inline-block; color: #FFF; text-align: center; border-top: 1px solid #999; border-bottom: 1px solid #999; line-height: 30px;} .cart-products .cp-plus{border-right: 1px solid #999;} .cart-products .cp-minus{border-left: 1px solid #999;} .cart-products .cp-plus:hover, .cart-products .cp-minus:hover{color: #000; background: #EEE} .cart-products .cp-price{float: right; font-size: 18px; color: #FF3E3E;} .cart-products .cp-price i, .neo-cart-in .action .price i, .neo-cart-in .action .ship i{text-decoration: line-through; font-style: normal; } .neo-cart-in .action .ship{font-size: 16px; margin-bottom: 0px; color: #FF3E3E;} .neo-cart-in .action .ship span{float: right; font-size: 18px;} .neo-cart-in .action .ship i{padding-left: 10px;} .neo-cart-in .action .price{font-size: 18px; margin-bottom: 0px;} .neo-cart-in .action .price span{float: right; font-size: 20px;} .neo-cart-in .action .msg{text-align: center; } .neo-cart-in .loading{position: absolute; top: -9999; left: -9999px; z-index: -999999; display: none; background: rgba(256, 256,256, .75); width: 100%; height: 100%; text-align: center; padding-top: 60%;} .neo-cart-in .loading.active{top: 0px; left: 0px; z-index: 999999; display: block;} .neo-cart-in .loading i{color: #000; font-size: 70px;} .box-msg{position: absolute; z-index: -9999999; top: -999px; left: -999px; display: none; width: 100%; height: 100%; background: rgba(0, 0, 0, .55);} .box-msg.active{z-index: 9999999; top: 0px; left: 0px; display: block;} .box-msg .box-msg-in{min-width: 320px; width: 500px; background: rgba(255, 255, 255, .85); margin: 0 auto; margin-top: 20%; border: 1px solid #DDD; -webkit-box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.95); box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.55);} .box-msg .box-msg-in .title{border-bottom: 1px solid #999; padding: 10px; text-align: center; position: relative; font-size: 16px;} .box-msg .box-msg-in .msg-close{position: absolute; top: 5px; right: 5px; font-size: 20px;} .box-msg .box-msg-in .content{padding: 10px; min-height: 100px; font-size: 14px;} .box-cus-order{} .box-customer .order-lbl{padding-left: 10px; font-size: 16px; width: 100%; float: left; margin-top: 20px; display: block;} .box-customer .order-lbl a{border-bottom: 1px solid #999; padding-bottom: 10px; display: inline-block; padding-right: 50px;} .box-customer{width: 50%; float: left; padding-left: 10px; border-left: 1px solid #e6e6e6;} /* padding-left: 10px;*/ .box-customer .frmElement:nth-child(2n), .box-customer .frmElement:nth-child(2n+1){width: 50%; float: left; clear: initial;} .box-customer .frmElement .element, #frmContact .frmElement .element, #frmRegister .frmElement .element, #frmAcc .frmElement .element{width: 100%} .box-customer .frmElement .element input[type="text"], .box-customer .frmElement .element textarea, #frmContact .frmElement .element input[type="text"], #frmContact .frmElement .element textarea, #frmRegister .frmElement .element input[type="text"], #frmRegister .frmElement .element input[type="password"], #frmRegister .frmElement .element textarea, #frmLogin .frmElement .element input[type="text"], #frmLogin .frmElement .element input[type="password"], #frmAcc .frmElement .element input[type="text"], #frmAcc .frmElement .element input[type="password"], #frmAcc .frmElement .element textarea{width: 100%; padding: 10px 10px 10px 20px; height: auto; font-size: 16px;} .box-customer .frmElement .element select{width: 100%; padding: 10px 10px; height: auto;} .box-customer .frmElement.addr, .box-customer .frmElement.request{width: 100%;} .box-customer .frmElement .btn{width: 100%} .box-customer .frmElement .btn input[type="submit"]{float: left;} .box-customer .frmElement .btn input[type="reset"]{float: right; margin-right: 0px;} .box-customer .frmElement .error {font-weight: bold; font-size: 16px;} .box-order{width: 50%; float: left; padding-right: 20px;} .box-order .cart-products li a{color: #555} .box-order .cart-products li a:hover{color: #000} .box-order .cart-products p{/*width: initial; float: initial;*/} .box-order .cart-products p .cp-quan{font-size: 20px;} .box-order .cart-products li:last-child .ship{font-size: 18px; overflow: hidden; margin-bottom: 10px;} .box-order .cart-products li:last-child .ship span{float: right;} .box-order .cart-products li:last-child{font-size: 22px; overflow: hidden;} .box-order .cart-products li:last-child label{width: 100px; float: left;} .box-order .cart-products li:last-child .total-quan{float: left;} .box-order .cart-products li:last-child .total-price{float: right;} .box-order .cart-products li:last-child .total-price i, .box-order .cart-products li:last-child .ship i{font-style: normal; text-decoration: line-through;} .box-mborder{background: url(../images/bg-member.jpg) center top no-repeat #F5F5F5;} .box-mborder .box-path{background: none; border: none; padding: 15px 0px; color: #FFF;} .box-mborder .box-path .path{color: #FFF;} .box-mborder .box-path a{color: #FFF;} .box-mborder .box-main-content{width: 100%; padding: 20px; background: #FFF;} .box-mborder #slFromTo{border: none; text-align: right;} .box-mborder .box-ord-sbtn .element{position: relative;} .box-mborder .box-ord-sbtn button{position: absolute; background: none; border: none; right: 5px; top: 5px; font-size: 18px; color: #555; font-weight: normal;} .box-news-main .box-main-left{width: 26%; padding: 0px;} .box-news-main .box-main-right{width: 22%; padding: 0px;} .box-news-main .box-main-content{width: 52%; padding: 0px 20px;} .box-news-main .box-right .box-right-title{padding-top: 0px;} .box-ml-news{padding: 0px 15px} .box-ml-news ul{padding-top: 20px;} .box-ml-news li{padding: 0px 0px 15px 0px;} .box-cart-main{background: #FFF;} .box-about-main{} .box-about-main .box-main-content{font-size: 16px; padding: 0px 15px} .box-about-main .box-main-content, .box-about-main .box-main-content .box-details{width: 100%;} .news-list.srv-list .icon{display: block; width: 250px; float: left; padding-right: 20px;} .news-list.srv-list h3, .news-list.srv-list p{width: calc(100% - 270px); float: left;} .frmElement.rdo-voca label{width: 25%; cursor: pointer;} #frmRegister{font-size: 16px;} #frmLogin .frmElement .btn, #frmAcc .frmElement .btn{} #frmPayment{font-size: 16px;} #bankAcc{font-size: 16px; padding-left: 10px;} .overhd{overflow: hidden;} .aet{position: absolute; z-index: 999; color: #FFF; left: 0px; top: 0px; font-size: 26px; display: block;} .aet i{background: #000; width: 24px; height: 26px;} .aet:hover{color: #DDD} .frmTitle { text-align: center; font-size: 16px; } .frmElement { width: 100%; padding: 5px 10px; clear: both; display: table;} .frmElement .lbl { width: 40%; float: left; padding: 10px 20px 10px 0px; margin: 10px 0px; text-align: right; font-size: 14px;} .frmElement .element{ width: 60%; float: left; padding: 10px 0px 10px 0px; position: relative;} .frmElement .element input[type=text], .frmElement .element input[type=password], .frmElement .element select, .frmElement .element span{border: 1px solid #ccc; border-radius: 3px; text-indent: 5px; padding: 8px 10px; font-size: 16px;} .frmElement .element input[type=text], .frmElement .element input[type=password], .frmElement .element select, .frmElement .element textarea, .frmElement .element span{width: 100%; min-width: 250px;} .frmElement .element span{display: block; background: #F7F7F7; cursor: pointer;} .frmElement .element b.check{position: absolute; width: auto; top: 16px; background: none; border: none; min-width: initial; color: #FF3E3E; font-size: 24px; font-weight: bold; left: 5px;} .frmElement .element textarea{border: 1px solid #ccc; text-indent: 5px; padding: 4px 0px; min-height: 80px;} .frmElement .element label{margin-right: 10px; cursor: pointer;} .frmElement .error{width: 70%; float: left; color: #FD0100} .frmElement .txtCapt input{float: left; width: 70px !important; min-width: 70px !important; height: 30px !important; border-radius: 0 !important; border: 1px solid #DDD;} .frmElement .btn, .frmElement .msg{} /*margin-left: 30%; */ .frmElement .btn input[type=submit], .frmElement .btn input[type=reset], #frmDrafBtn input[type=submit]{font-size: 18px; text-align: center; cursor: pointer; padding: 10px 40px; color: #fff; border: none; border-radius: 1px; margin: 0px auto; margin-right: 10px;} .frmElement .btn input[type=submit]{background: var(--maincolor);} .frmElement .btn input[type=reset]{background: #666;} .frmElement .btn input[type=submit].btn-green{background: var(--menutopcolorhover);} .contact-lbl{width: 40%; text-align: right; padding-right: 20px; font-size: 20px;} .frmElement.elm-btn{width: 100% !important;} input[type=radio]{cursor: pointer;} .box-login{padding-top: 90px; padding-bottom: 90px; } /*background: url(../images/bg-login.jpg) center top no-repeat #006d2a; */ .box-register{background: url(../images/bg-reg.jpg) center top no-repeat #EFEFEF;} /*-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.15);*/ .box-register .box-login-in{} .box-login .box-main-content{width: 100%; padding-right: 0px;} .box-login-in{background: #FFF; border-radius: 10px; width: 80%; margin: 0 auto; min-height: 470px; overflow: hidden; padding-top: 50px; padding-bottom: 40px;} .box-login-in .box-login-frm{width: 45%; float: left; padding: 30px 40px;} .box-login-in .box-login-frm .lblAppr{font-size: 14px; color: #999; padding: 15px 0px 0px 0px;} .box-login-in .box-login-frm .lblAppr a{text-decoration: underline; color: #999;} .box-login-in .login-img{width: 55%; height: 470px; float: left; background: url(../images/img-login.jpg) center top no-repeat #f3f3f3; display: block;} .box-login-in .login-img .lbl{padding: 100px 0px 0px 60px;} .box-login-in .box-reg-frm{width: calc(100% - 440px);} .box-login-in .reg-img{background: url(../images/img-reg.jpg) right top no-repeat #f3f3f3; width: 440px; height: 550px;} .box-login-in .frmElement{padding: 5px 0px;} .box-login-in .frmElement .element{width: 100%; } .box-login-in .frmElement .element input[type="text"], .box-login-in .frmElement .element input[type="password"], .box-login-in .frmElement .element select{border: none; border-bottom: 1px solid #DDD;} .box-login-in .frmElement .btn input[type="submit"]{width: 100%; border-radius: 30px; padding: 15px 10px; font-size: 16px; text-transform: uppercase;} .box-login-in .frmElement .error{width: 100%; margin: 0px; font-size: 16px;} .frmElement i{position: absolute; left: 0px; top: 20px; font-size: 20px; color: var(--maincolor);} .box-mborder .box-ord-sbtn button i{position: relative; left: initial; top: initial;} .cbRmb{padding: 10px 0px 20px 0px !important;} .cbRmb .lbl{width: auto; float: initial; padding: 0px; margin: 0px;} .cbRmb .element{padding: 0px 10px 0px 0px; float: left; width: auto !important;} .cbRmb > a{float: right; font-size: 14px;} #frmDrafBtn input[type=submit]{background: var(--maincolor); margin: 0px; padding: 10px 10px;} #frmPerson{background: #FFF; padding: 15px 0px;} #frmPerson .frmElement .lbl {width: 250px;} #frmPerson .frmElement .btn, #frmUpdate > .err{margin-left: 250px;} .person-phone{margin-top: 10px; display: block; font-size: 18px;} .person-phone i{} .frm-title {padding: 10px; background: #578c6d; font-size: 16px; font-weight: bold; margin-bottom: 15px; color: #FFF;} .abtn{background: var(--menutopcolorhover); color: #FFF; padding: 10px 30px; font-size: 18px; display: inline-block; border: none; cursor: pointer;} .abtn:hover, .abtn.btn-red:hover{color: #000;} .abtn.btn-red, .btn-red{background: #F00 !important; color: #FFF !important;} .abtn.btn-red:hover{color: #000;} #frmOSearch .frmElement{padding-left: 0px; padding-top: 0px; width: 50%; float: left; clear: initial; float: left;} #frmOSearch .frmElement .element{padding-top: 0px; width: 90%;} #frmOSearch .frmElement.right{padding-right: 0px; padding-left: 10px;} #frmOSearch .frmElement.right .element{float: right;} #boxStatistic{color: #FFF;} #boxStatistic > div{width: 25%; float: left; text-align: center; margin-bottom: 30px; padding: 10px;} #boxStatistic .sttinner{background: var(--menutopcolorhover); border-radius: 20px;} #boxStatistic > div span{display: block;} #boxStatistic > div .icon{} #boxStatistic > div .icon i{color: #A9F0C5; text-align: center; font-size: 30px; padding: 30px;} #boxStatistic > div .lbl{font-size: 20px; padding: 10px 0px 20px 0px; color: #F5F5F5;} #boxStatistic > div b{font-size: 24px;} #mbMenuBott{display: none; background: #FFF; border-top: 1px solid #BBB; width: 100%; padding: 10px 0px;} #mbMenuBott ul, #mbMenuBott li{margin: 0px; padding: 0px; list-style: none;} #mbMenuBott li{width: 25%; float: left; text-align: center;} #mbMenuBott li a{color: #666;} #mbMenuBott li a.active, #mbMenuBott li a:hover{color: var(--maincolor);} #mbMenuBott li a i{ display: block; font-size: 30px; margin-bottom: 5px;} #mbMenuBott li a i.fa-shopping-cart{position: relative;} #mbMenuBott li a span{font-size: 16px; } #mbMenuBott .cartQuanTotal{width: 24px;height: 24px;display: block;position: absolute;right: 20px;top: 0px;font-size: 12px;font-weight: normal;background: #004a1d;border-radius: 50%;color: #FFF;text-align: center;line-height: 24px; padding: 0px;} .box-btn{} .box-btn.mb{display: none;} .tbl-resp{overflow-x:auto;} .catpcha{} .catpcha img{width: 190px; float: left;} .catpcha span{display: inline-block; line-height: 50px; padding: 0px 10px; float: left; width: 40px; text-align: center;} .catpcha span i{cursor: pointer;} .catpcha .txtCaptcha{float: left; width: calc(100% - 230px) !important; } .catpcha input, .catpcha label{width: 100% !important} .btn-act{background: var(--maincolor); margin-top: 5px; padding: 6px 10px; color: #FFF; display: inline-block;} .box-content-details{font-size: 16px;} div.skiptranslate{display: none; visibility: hidden; position: absolute; z-index: -99999;} .txt-right{text-align: right !important; } .txt-left{text-align: left !important; } .center, .ctr { text-align: center; font-size: 14px; } .mrleft10{margin-left: 10px;} .mrright10{margin-right: 10px;} .pad { padding: 10px 20px; font-size: 14px; } .pad10 {padding: 10px;} .pad20 {padding: 20px;} .marrl10{margin: 0px 10px;} .font14{font-size: 14px;} .font16{font-size: 16px;} .font18{font-size: 18px;} .font20{font-size: 20px;} .btn-nobor{border: none;} .continues { text-align: center; font-size: 16px; } .relativetitle { line-height: 30px; font-size: 16px; font-style: italic } .lblMsg { display: none; height: auto; color: #F00; padding-top: 10px; font-size: 14px; } .reg-success { color: #3D6AE4; padding: 20px 10px; font-size: 16px; } .success { color: #3D6AE4; } .divAdd { color: #06F; font-size: 16px; padding: 20px; } .numpages { padding: 2px 0 15px 0; font-size: 16px; } .padlr { padding: 4px 20px; } .notfound, .not-found { padding: 30px; text-align: center; font-size: 16px; color: #880000; clear: both; } .found { padding: 10px; text-align: center; font-size: 16px; color: #0066FF } .orange { background: #EB7336; } .red, .err { color: #F00 }/*#880000*/ .green{color: var(--maincolor)} .dnhd { display: none !important; } .clear { clear: both; height: 0; line-height: 0; width: 0; overflow: hidden; display: block;} .clear1 { clear: both; height: 1px; background: none } .clear2 { clear: both; height: 2px; background: none } .clear3 { clear: both; height: 3px; background: none } .clear5 { clear: both; height: 5px; background: none } .clear10 { clear: both; height: 10px; background: none } .clear20 { clear: both; height: 20px; background: none } .clear30 { clear: both; height: 30px; background: none } .clear40 { clear: both; height: 40px; background: none } /* For desktop */ @media only screen and (max-width: 1200px) { } /* For desktop */ @media only screen and (max-width: 1024px) { .neo{width: 100%} .banner .box-search { width: calc(100% - 200px);} .banner .box-act-sys{width: 100%; float: initial; padding-bottom: 10px; display: block; text-align: center; margin-top: 0px;} .banner .box-act-sysin a{} .box-4mb{clear: both; display: block;} .menu-top li a {padding: 5px 30px;} .box-main-content.bmc-right{overflow: hidden;} .box-main-content.bmc-right img{max-width: 100%;} .frmElement .btn input[type="submit"], .frmElement .btn input[type="reset"]{margin: 0;} .frmElement.elm-btn{width: 100% !important;} } /* For table */ @media screen and (max-width: 800px) { .header .name, .header .hotline-info{display: none;} /*.header .neo{padding: 0px;}*/ /*.header .name{padding-left: 10px;}*/ .category{padding-left: 10px;} .banner .box-act-sys{display: none;} .box-4mb {padding-bottom: 20px;} .banner .neo{padding: 0px;} .banner .logo{width: 100px;} .banner .box-search .btnCartAll{display: none;} .banner .box-search select{display: none;} .banner{background: var(--maincolor);} .banner .box-search { width: calc(100% - 150px); padding-right: 10px; margin-top: 25px;} .banner .box-search form{background: none; width: 100%; height: 50px; border: none; border: 1px solid #DDD;} .banner .box-search input{width: 100%; border: none; color: #FFF; margin-top: 5px;} .banner .box-search input::placeholder {color: #FFF; opacity: 1} .banner .box-search input:-ms-input-placeholder {color: #FFF; opacity: 1} .banner .box-search input::-ms-input-placeholder {color: #FFF; opacity: 1} .banner .box-search button{line-height: 38px; height: 40px;} .banner .box-search .search-suggest{display: none;} /*width: 100%; height: 100px; background-size: auto 70%; background-position: center;*/ .menu-top{height: auto; float: left; width: 100%; text-align: center;} .menu-top button.open-menu{display: block; background: none; border: none; width: 43px; height: 39px; text-indent: -900em; overflow: hidden; position: absolute; top: -60px; right: 10px; cursor: pointer; outline: none; z-index: 9999999} .menu-top button.open-menu:after{display: block; content: ''; position: absolute; width: 68%; height: 4px; background: #FFF; top: 8px; left: 17%; box-shadow: 0 10px 0 #FFF, 0 20px 0 #FFF;} .menu-top ul{position: absolute; top: -1600px; z-index: -99999; display: none; background: var(--maincolor); width: 100%; -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75); box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75);} .menu-top ul.menu-top-active{top: 0px; z-index: 99999; left: 0px; display: block; height: auto; } .menu-top li{width: 100%; padding: 0px 0px; border-bottom: 1px solid #047730; } .menu-top li a{color: #FFF; font-size: 14px; border-right: none; display: block; padding: 10px 32px;} .menu-top li a:hover{color: #000;} .menu-top > ul > li > ul{display: block; position: relative; top: initial; left: initial; z-index: initial; opacity: 1; width: 100%; padding: 0px; border: none; margin-top: 0px; box-shadow: none;} .menu-top > ul > li > ul > li{text-align: center;} .menu-top > ul > li > ul > li:first-child{border-top: 1px solid #4E78B0;} .menu-top > ul > li:last-child{padding: 10px 0px;} .menu-top > ul > li:last-child a{display: inline-block;} .menu-top > ul > li > ul > li a{border-bottom: none;} .menu-top .neo > ul > li > ul{display: block; position: relative; width: 100%; top: initial; left: initial; z-index: 9999; opacity: 1;} .menu-top li li{text-align: center;} .menu-top li li a{border-bottom: none; color: #FFF;} .box-slider-ads{display: none;} .box-slider-idx {height: auto; width: 100%;} .box-slider-idx .neo{padding: 0px;} .box-slider-idx .owl-carousel .owl-stage-outer{border-radius: 0px;} .suport-idx li{width: 50%; margin-bottom: 20px;} .suport-idx li:nth-child(1){padding-left: 0px; padding-right: 10px;} .suport-idx li:nth-child(2){padding-left: 10px; padding-right: 0px;} .suport-idx li:nth-child(3){padding-left: 0px; padding-right: 10px;} .suport-idx li:nth-child(4){padding-left: 10px; padding-right: 0px;} .procat-list .item{width: 25%} .box-cats.ctr a{margin-bottom: 15px;} .box-main-left{display: none;} .box-main-left.box-member-left{display: block; width: 100%;} .owl-theme .owl-nav .owl-prev {left: 10px;} .owl-theme .owl-nav .owl-next {right: 10px;} .box-productidx .product-list li .icon{height: auto;} .box-productidx.box-prosaleoff .title .titler{border-bottom: none;} .box-productidx .title .titler{border-bottom: 2px solid #999; padding-bottom: 10px;} .box-prosaleoff div.item .icon > div{opacity: 0;} .box-prosaleoff .item div.ctr {display: block; } .product-list li > div.ctr{display: block;} .neo.box-idx.box-productidx{padding: 10px 20px;} .box-main-right{width: 100%; padding: 0px;} .product-list li .icon, .box-prosaleoff div .icon{max-height: initial;} .product-list li:hover .icon > div, .box-prosaleoff div.item:hover .icon > div{display: none;} .box-idx .title{text-align: center; margin-bottom: 30px;} .box-idx .title::after{border: none;} /*.box-idx .title .titleright{display: none;}*/ .box-idx .box-idx-50{width: 100%;} .box-idx .box-idx-50.idx-50l, .box-idx .box-idx-50.idx-50r{padding-left: 0px; padding-right: 0px;} .box-pro-hot{margin-top: 20px;} .box-pro-hot .product-idx-list{overflow: hidden;} .box-pro-hot .product-idx-list li{width: 50%; float: left; margin-bottom: 0px;} .box-pro-hot .product-idx-list li:nth-child(2n){padding-right: 0px; padding-left: 15px;} .box-pro-hot .product-idx-list li:nth-child(2n+1){padding-right: 15px; padding-left: 0px;} .box-pro-hot .product-idx-list li:nth-child(3),.box-pro-hot .product-idx-list li:nth-child(4){border-bottom: none;} .box-pro-hot .product-idx-list li a.icon{height: 100px; overflow: hidden;} .box-pro-hot .content{padding: 10px 15px;} .box-idx.box-productidx .product-list li{margin-bottom: 0px; padding-top: 20px; padding-bottom: 10px;} .box-idx.box-productidx .product-list li:nth-child(1), .box-idx.box-productidx .product-list li:nth-child(2){padding-top: 0px;} .product-list li{width: 50%;} .product-list li:nth-child(3n),.product-list li:nth-child(3n+1),.product-list li:nth-child(3n+2){padding-left: 0px; padding-right: 0px;} .product-list li:nth-child(2n){padding-right: 0px; padding-left: 15px; border-bottom: 1px solid #DDD;} .product-list li:nth-child(2n+1){padding-right: 15px; padding-left: 0px; border-right: 1px solid #DDD; border-bottom: 1px solid #DDD;} .box-buynow p:last-child{margin-top: 20px;} .news-list li a.icon img{height: auto;} .box-main-content{width: 100%;} /* .box-main-left, .box-main-right*/ .neo-cart .neo-cart-close a{padding: 0px;} .box-customer .frmElement:nth-child(2n), .box-customer .frmElement:nth-child(2n+1){width: 100%;} .box-product-main .box-main-content{width: 100%;} .box-idx.box-prosaleoff .content { padding: 40px 10px 20px 10px; } .btn-cart, .owl-carousel .item a.btn-cart{width: 90%;} .box-productidx.box-idx .title .titleright.idx{display: none;} .box-idx.box-productidx .product-list li:nth-child(3) .ctr a, .box-idx.box-productidx .product-list li:nth-child(4) .ctr a{margin-bottom: 0px;} .box-idx.box-productidx .product-list li:nth-child(3), .box-idx.box-productidx .product-list li:nth-child(4){border-bottom: none; padding-bottom: 0px;} .box-btn.mb{display: block; border: 1px solid #DDD; margin-top: 30px; padding: 10px;} .neo.box-service-idx{padding-bottom: 40px;} .box-service-idx .product-list li{border: none !important;} .clear.mbsuggest{height: 40px;} .clear40.mbsrv{height: 0px;} .product-info .btn-cart, .product-info .btnBuy{width: 100%;} .product-info .btnBuy{margin-bottom: 10px;} .product-info a.mrleft10, .product-info a.mrright10{margin-left: 0px; margin-right: 0px;} .tabs-content .copylink:last-child{display: none;} .btn-cart, .btnBuy, .btnBorder{padding: 10px;} .box-right li a.icon{text-align: center;} /*display: none;*/ .box-main-left{} .box-news-main .box-main-content, .box-news-main .box-main-right{width: 100%; padding: 0px;} .box-mborder .box-main-content{padding: 10px 0px;} #boxStatistic > div{width: 50%; padding: 10px; margin-bottom: 10px;} #boxStatistic > div .lbl{font-size: 16px;} #boxStatistic .sttinner{} .owl-theme .owl-nav{margin-top: 0px;} .clear30-mb{height: 0px;} .frmElement .btn{width: 60%;} .frmElement .btn input[type="reset"]{float: right;} .box-customer{border: none;} .box-customer .frmElement .btn input[type="submit"]{width: 100%; margin-bottom: 15px;} .box-mborder .formSearch{padding: 0px 10px;} .box-mborder .box-ord-sbtn button i{position: relative; left: initial; top: initial;} .ordMbTotal{float: left;} .ordMbTotalPrice{float: right;} .tbl-ps-ord td .ordRowMb{display: block; text-align: left;} .tbl-ps-ord td > span{display: none;} .tbl-ps-ord th:nth-child(n+2), .tbl-ps-ord td:nth-child(n+2){display: none;} .tbl-ps-ord tr:nth-child(1), .tbl-ps-ord tr:nth-child(2){display: none;} .ordRowMb{display: block;} .ordRowMb > div{display: block; overflow: hidden; margin-bottom: 10px;} .ordRowMb > div i{font-size: 20px; text-align: center; width: 30px;} .ordRowMb .ormName{overflow: hidden;} .ordRowMb .ormNameOrd{width: 30px; height: 30px; float: left; background: var(--maincolor); color: #FFF; border-radius: 50%; text-align: center; line-height: 30px; display: none;} .ordRowMb .ormNameName{float: left; font-size: 16px; font-weight: bold; padding: 5px 0px 0px 10px;} .ordRowMb .ormNameDate{padding-top: 5px; font-size: 16px; float: right; /*float: left; display: block; width: 100%;*/} .ordRowMb .ormNameDate i{display: none;} .ordRowMb .ormPhone{} .ordRowMb .ormItems .np-elm{display: block; margin-bottom: 5px; margin-left: 30px;} .ordRowMb .ormPhone a{font-weight: bold; margin: 0px;} .ordRowMb .ormPhone i{font-size: 30px; text-align: center; width: 30px;} .ordRowMb .ormAddr{} .ordRowMb .ormTotal{font-size: 18px;} .ordRowMb .ormLeft{float: left;} .ordRowMb .ormRight{float: right;} .ordRowMb .ormStt{} .ordRowMb .ormStt b{float: left; font-size: 20px;} .ordRowMb .ormStt .btnOrdDetails{float: right;} .ordRowMb .ormStt input{margin-top: 15px; margin-left: 5px;} .ordRowMb .ormStt .btnUpStt{float: right;} .box-login-in{width: 100%;} .box-login-in .box-login-frm{width: 100%;} .box-login-in .login-img{width: 100%;} .productListRight li{width: 50%; float: left;} .productListRight li:nth-child(2n){padding-left: 10px; padding-right: 0px;} .productListRight li:nth-child(2n+1){padding-left: 0px; padding-right: 10px;} .productListRight li .icon{overflow: hidden; position: relative; display: block;} .productListRight li .icon .ctr{width: 100%;} .productListRight li .icon .ctr .btn-cart{width: 100%;} .productListRight li .icon img{width: 100%;} .product-details-content img{width: 100%; height: auto;} .box-left.box-ml-news{display: none;} .box-service-idx{overflow: hidden;} .box-msg .box-msg-in{width: 100%;} .box-bottom{background: #FFF;} .box-bottom li{width: 33.3%;} .box-bottom li:nth-child(4), .box-bottom li:nth-child(5), .box-bottomer li:nth-child(1){display: none;} .box-bottom li{text-align: center;} .box-bottom li span { width: 100%; padding: 0px; margin-top: 10px;} .box-bottom li i{float: initial; color: var(--maincolor);} .box-bottomer {background: var(--maincolor);} .box-bottomer .neo{padding: 0px 20px;} .box-bottomer li{width: 50%;} .box-bottomer li:last-child{display: none;} .box-bottomer li:nth-child(2){width: 100%;} .box-bottomer li:nth-child(2) i{display: none; } .box-bottomer li:nth-child(2) span{margin-top: 0px;} .box-bottomer .btm-call{width: 100%; display: block; border: 1px solid #54c881; padding: 10px;} .footer{padding-bottom: 80px;} .footer .info{width: 50%; margin-bottom: 40px;} .footer .info.infolast { width: 50%;} .footer .neo .clear40{height: 0px;} .footer .neo{padding: 0px 10px;} .footer .info{} .footer .info:first-child{width: 100%; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #DDD;} .footer .info:first-child li{width: 50%; float: left;} .footer .info:first-child li:nth-child(odd){border-right: 1px solid #DDD;} .footer .info:nth-child(2){border-right: 1px solid #DDD; margin-bottom: 0px;} .footer .info:nth-child(3){margin-bottom: 0px;} .footer .info.infolast{width: 100%; border-top: 1px solid #DDD; margin-top: 20px; padding-top: 20px;} .footer .info.infolast p{text-align: left;} .footer .info.infolast p.title{text-align: center;} .footer .info{text-align: center;} .social-bank .box-social, .social-bank .box-bank, .box-dowmobile{width: 100%; margin-bottom: 20px; text-align: center;} .box-dowmobile .qrcode, .box-dowmobile .stores{width: 50%; display: block; margin: 0 auto;} .box-dowmobile .stores{padding-top: 50px;} #mbMenuBott{display: block; position: fixed; bottom: 0px; z-index: 9999999;} } /* For table */ @media screen and (max-width: 768px) { .procat-list {display: flex; flex-wrap: wrap;} .box-customer, .box-order{width: 100%; padding: 0px;} .box-order{padding: 0px 10px;} .product-img-slide, .product-info{width: 100%; padding: 0px;} .product-info{margin-top: 20px;} .product-img img {width: 100%; height: auto;} } /* For mobile */ @media screen and (max-width: 667px) { .product-img-slide,.product-info{width: 100%; padding-left: 0px; padding-right: 0px;} .box-slider-idx {} .frmElement .btn{width: 100%; margin-left: 0px;} #frmPerson .frmElement .lbl, .frmElement .element{width: 100%;} #frmPerson .frmElement .lbl{margin-bottom: 0px; padding-bottom: 0px; text-align: left; margin-top: 0px; padding-top: 0px;} #frmPerson .frmElement .btn{margin-left: 0px;} .box-ord-cust-info{} .box-ord-cust-info .frmElement .lbl{width: 70px !important; padding-right: 10px !important; padding-left: 10px !important } .box-ord-cust-info .frmElement .element{width: calc(100% - 80px) !important;} /*.box-productidx.box-prosaleoff .title .titler {left: calc(100% / 2 - 110px);} .box-pro-hot .product-idx-list li{width: 100%; } .box-pro-hot .product-idx-list li:nth-child(2n), .box-pro-hot .product-idx-list li:nth-child(2n+1){padding-right: 0px; padding-left: 0px;} .box-pro-hot .product-idx-list li:nth-child(3), .box-pro-hot .product-idx-list li:nth-child(4){border-bottom: 1px solid #DDD;} .box-pro-hot .product-idx-list li:last-child{border: none;}*/ } /* For mobile */ @media screen and (max-width: 640px) { .header .hotline-info, .header .hotline-info a{background: #1C5099} .header .hotline-info a{color: #FFF} .header .hotline-info .hotline{color: #ff9fa1;} /*.box-productidx .product-list li .icon{height: 200px;}*/ .prosaleoff-time{width: 100%; background-size: contain; background-color: #dd2e00; border-radius: 0px;} .prosaleoff-time > div{margin-top: 10%; float: right; padding-right: 50px;} .box-idx.box-prosaleoff .content{width: 100%; border-radius: 0px;} .box-ads .item{width: 100%; padding: 10px !important;} .box-ads .item img{width: 100%} } /* For mobile */ @media screen and (max-width: 580px) { .box-main-content{width: 100%; padding-right: 0px;} .box-main-right{width: 100%;} .box-pro-lbl {display: block; width: 100%; text-align: center; margin-bottom: 20px;} .boxSort{float: initial; width: 100%;} .boxSort select {width: 100%;} .contact-frm, .contact-content{width: 100%; padding: 0px;} .contact-content{padding: 10px 20px;} .box-news-content *{max-width: 100%;} .box-news-details img{width: 100% !important;} .box-idx.box-prosaleoff .content{height: auto;} .box-idx.box-prosaleoff .titleright{padding-right: 0px;} .procat-list .item{width: 33.33%} .prosaleoff-time{height: auto; background-size: auto; background-position: left top;} .prosaleoff-time > div{margin-top: 20px; padding-right: 20px;} .frmElement{padding:5px 0px;} .frmElement, #frmOSearch .frmElement{margin-bottom: 15px;} .frmElement .element, #frmOSearch .frmElement, #frmOSearch .frmElement .element{width: 100%; padding: 0px;} .frmElement .element b.check{top: 8px;} .frmElement .btn input[type="submit"], .frmElement .btn input[type="reset"]{width: 45%; padding: 10px 0px; text-align: center;} .frmElement .btn input[type="submit"]{float: left;} .frmElement .btn input[type="reset"]{float: right;} #frmOSearch .frmElement .element, #frmOSearch .frmElement.right{padding: 0px;} .box-login-in .box-login-frm{padding: 30px 15px;} .box-login-in .frmElement .element{padding: 10px 0px;} .cbRmb .element{padding: 0px !important;} } @media screen and (max-width: 520px) { .box-main-content{width: 100%; padding: 10px;} .box-productidx .product-list li .icon{height: 150px;} /*.box-productidx .product-list li .icon{height: 160px;}*/ /*.product-list li .icon{height: auto;}*/ .box-path .path-right {width: 100%; padding: 15px 0px; float: left; text-align: left;} .box-path .path-right a{margin-left: 0px;} .box-path .path-right a:last-child{float: right;} #boxCtDt .frmElement{width: 100%; padding: 0px !important;} } /* For mobile */ @media screen and (max-width: 480px) { .slider-call-buy .title{font-size: 20px;} .slider-left p{font-size: 18px;} .procat-list .item { width: 50%; } /*.box-slider-idx {height: 300px;}*/ /*.product-list li{width: 100%;} .product-list li:nth-child(2n),.product-list li:nth-child(2n+1){padding-left: 0px; padding-right: 0px;} .box-productidx .product-list li .icon{height: auto;} .product-list li h3{height: auto;} .product-list li .icon img {width: 100%;}*/ /*.box-service-idx .product-list li{width: 100%;} .box-service-idx .product-list li .icon{height: auto; max-height: initial;}*/ .catpcha img{width: 40%;} .catpcha .txtCaptcha{width: calc(100% - 40% - 40px) !important;} .suport-idx li{width: 100%;} .suport-idx li:nth-child(1){padding: 0px;} .suport-idx li:nth-child(2){padding: 0px;} .suport-idx li:nth-child(3){padding: 0px;} .suport-idx li:nth-child(4){padding: 0px;} .box-login-in .login-img .lbl{padding-top: 30px;} .news-list.srv-list .icon{width: 100%; padding-right: 0px;} .news-list.srv-list h3, .news-list.srv-list p{width: 100%; float: left;} } /* For mobile */ @media screen and (max-width: 420px) { .header .hotline-info .hotline{padding: 10px 10px 10px 0px} .header .hotline-info a{padding-left: 20px; padding-right: 20px;} .box-right li a.icon img{width: 100%;} .neo.box-idx.box-productidx {padding: 10px 10px;} .box-productidx .product-list li .icon{height: 120px;} .prosaleoff-time {background-size: contain;} } /* For mobile */ @media screen and (max-width: 380px) { .header .hotline-info a{padding: 10px 10px;} .box-idx.box-prosaleoff .titleright{display: none;} .product-info .btn-cart, .product-info .btnBuy{padding: 10px 5px; font-size: 14px;} .box-bottomer li{width: 100%; margin-bottom: 20px;} .box-bottom li i, .box-bottomer li i{width: 50px;} .box-bottom li span{font-size: 14px;} } @media screen and (max-width: 360px) { } /* For mobile */ @media screen and (max-width: 320px) { #boxStatistic > div .lbl{font-size: 14px;} } @media print { .header, .banner, .menu-top, .body-content .box-title, .body-right, .td-post-sharing, .news-list-other, .footer-wrapper, .relativetitle, #btnPrint{display: none;} .body-content{width: 100%;} }