@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");

a{moz-transition:all .3s;ms-transition:all .3s;o-transition:all .3s;transition:all .3s;webkit-transition:all .3s}

a:hover,a:active,a:focus{text-decoration:none!important}

img{max-width: 100%;}

body{font-size: 15px;margin:0;font-family: 'Roboto Condensed', sans-serif; right: 0px;position: relative;}

body p{font-size:15px;margin:0;font-family: 'Roboto Condensed', sans-serif;}

.clear60{clear:both;height:60px}

.clear40{clear:both;height:40px}

.clear20{clear:both;height:20px}

.clear10{clear:both;height:10px}

.center{text-align:center}

.left{text-align:left}

.right{text-align:right}

.nopadding{padding:0!important}

.nomargin{margin:0}

.fullwidth{width: 100%;}

.clwhite{color: #fff;}

.clblack{color: #000;}

.bold{font-weight: 700;}

.flex{display: flex;align-items: center;}

.flex-n{display: flex;}

.flex-bw{display: flex;align-items: center;justify-content: space-between;}

.flex-wrap{display: flex;flex-wrap: wrap;}

.show1199{display: none;}

.show991{display: none;}

.show767{display: none;}

.show480{display: none;}

.row:before{content: unset;}

.editer img{

    height: auto !important;

}

.editer p{

    margin-bottom: 10px;

}

.header-top{

    background: #3399fe;

    padding: 7px 0;

}

.camket{

    display: flex;

    align-items: center;

}

.camket > span {

    font-weight: 700;

    color: #fff;

    display: inline-flex;

    align-items: center;

    margin-right: 20px;

    font-size: 14px;

}

.camket > span:last-child{

    margin: 0;

}

.camket > span > img{

    margin-right: 7px;

}

.font14{

    font-size: 14px;

}

.clyel{

    color: #ffea02;

}

.logo img{

    width: 250px;

}

.flex-search-top{

    width: calc(100% - 600px);

}

.flex-search-top form {

    display: flex;

    align-items: center;

    border: 2px solid #3399fe;

    justify-content: space-between;

}

.flex-search-top form input{

    padding: 6px 12px;

    box-shadow: unset;

    outline: unset;

    height: 40px;

    border: none;

    width: calc(100% - 80px);

}

.flex-search-top form button{

    height: 40px;

    background: #3399fe;

    color: #fff;

    padding: 5px 10px;

    border: none;

    width: 80px;

}

.headre-center{

    background: #fff;

    padding: 20px 0;

}

.free-ship{

    width: 260px;

}

.hotline-cart{

    display: flex;

    align-items: center;

    margin-bottom: 10px;

}

.hotline-header {

    border-right: 1px solid;

    padding-right: 10px;

    margin-right: 10px;

}

.gio-hang {

    color: #000;

}

.hotline-header i,

.gio-hang i{

    margin-right: 5px;

}

.header-bottom{

    background: url(../img/menu-bg.png) center center;

}

.ul-main-menu{

    display: flex;

    align-items: center;

    list-style-type: none;

    padding: 0;

    margin: 0;

}

.ul-main-menu > li > a{

    display: inline-flex;

    align-items: center;

    height: 40px;

    font-size: 16px;

    color: #fff;

    text-transform: uppercase;

    padding: 0 20px;

}

.ul-main-menu > li > a > i{

    font-size: 14px;

    margin-right: 5px;

    position: relative;

    top: -1px;

}

.ul-main-menu > li.active > a,

.ul-main-menu > li:hover > a{

    background: #3399fe;

}

.ul-main-menu > li{

    background: url(../img/menu-line.png) repeat-y scroll right top;

}

.has-sub{

    position: relative;

}

.ul-sub-menu{

    background: rgba(51, 153, 254, 0.7);

    min-width: 220px;

    opacity: 0;

    padding: 0;

    position: absolute;

    -webkit-transform-origin: top;

    transform-origin: top;

    -webkit-animation-fill-mode: forwards;

    animation-fill-mode: forwards;

    -webkit-transform: scale(1, 0);

    transform: scale(1, 0);

    transition: transform 0.5s ease, opacity 0.2s ease;

    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.2s ease;

    z-index: 9999;

    list-style-type: none;

}

.has-sub:hover .ul-sub-menu{

    display: block;

    visibility: visible;

    z-index: 9999;

    opacity: 1;

    -webkit-transform: scale(1, 1);

    transform: scale(1, 1);

    transition: transform 0.3s ease, opacity 0.2s ease .1s;

    -webkit-transition: -webkit-transform 0.3s ease, opacity 0.2s ease .1s;

}

.ul-sub-menu > li > a{

    padding: 0 15px;

    color: #fff;

    text-transform: none;

    font-weight: 700;

    font-size: 14px;

    display: flex;

    align-items: center;

    height: 40px;

    white-space: nowrap;

}

.ul-sub-menu > li:hover > a{

    background: #3399fe;

}

.ul-cate-aside{

    list-style-type: none;

    padding: 0;

    margin: 0;

    border: 1px solid #ccc;

}

.ul-cate-aside > li > a{

    display: block;

    padding: 8px 15px;

    border-bottom: 1px dashed #ccc;

    color: #000;

    position: relative;

}

.ul-cate-aside > li > a > i {

    position: absolute;

    right: 15px;

    font-size: 14px;

    top: calc(50% - 7px);

}

.ul-cate-aside > li:hover > a{

    color: #1D75BD;

}

.ul-cate-aside > li:last-child > a{

    border-bottom: none;

}

.main-cateside-banner{

    margin: 20px 0;

}

.has-sub-cate{

    position: relative;

}

.ul-sub-cate-aside{

    position: absolute;

    left: 100%;

    top: -1px;

    list-style-type: none;

    padding: 0;

    margin: 0;

    border: 1px solid #ccc;

    z-index: 9999;

    background: #fff;

    min-width: 220px;

    display: none;

}

.ul-sub-cate-aside > li > a{

    display: block;

    padding: 5px 15px;

    white-space: nowrap;

    color: #000;

}

.ul-sub-cate-aside > li:hover > a{

    color: #1D75BD;

}

.has-sub-cate:hover .ul-sub-cate-aside{

    display: block;

}

.main-banner{

    position: relative;

}

.main-banner .owl-theme .owl-nav{

    margin: 0 !important;

}

.main-banner .owl-carousel .owl-nav button.owl-next {

    position: absolute;

    top: calc(50% - 20px);

    width: 40px;

    height: 40px;

    margin: 0;

    background: #fff;

    border-radius: 50%;

    right: 10px;

    font-size: 22px;

    color: #1D75BD;

    z-index: 2;

    outline: unset;

}

.main-banner .owl-carousel .owl-nav button.owl-prev {

    position: absolute;

    top: calc(50% - 20px);

    width: 40px;

    height: 40px;

    margin: 0;

    background: #fff;

    border-radius: 50%;

    left: 10px;

    font-size: 22px;

    color: #1D75BD;

    z-index: 2;

    outline: unset;

}

.form-search-home input,

.form-search-home select{

    width: 100%;

    padding: 0 10px;

    line-height: 40px;

    height: 40px;

    border: 1px solid #A9A9A9;

}

.btn-search{

    background-color: #3399fe;

    color: #fff;

    border-radius: 0;

    border: none;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

}

.main-search{

    margin-bottom: 20px;

}

.main-chinhsach .service {

    border: 4px double #ccc;

    padding: 15px 10px;

    display: flex;

    align-items: center;

    justify-content: space-between;

}

.animation {

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    -ms-transition: all 0.2s ease-in-out;

    -o-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

}

.main-chinhsach .service .icon {

    margin-right: 10px;

    width: 50px;

}

.main-chinhsach .service-content {

    width: calc(100% - 60px);

}

.main-chinhsach .service .icon i {

    font-size: 40px;

    color: #3399fe;

}

.main-chinhsach .service .service-content h5 {

    margin-top: 0;

    margin-bottom: 5px;

    color: #676767;

    font-weight: 700;

}

.main-chinhsach .service .service-content p {

    color: #676767;

}

.main-chinhsach .service:hover {

    background: #f4f4f4;

    border-color: #fff;

}

.main-chinhsach .service:hover i {

    -webkit-animation-name: service-zoom;

    animation-name: service-zoom;

    -webkit-animation-duration: 0.7s;

    animation-duration: 0.7s;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

}

@-webkit-keyframes service-zoom {

    0%{

        -webkit-transform: rotate(0deg) scale(1);

        transform: rotate(0deg) scale(1);

    }

    50% {

        -webkit-transform: rotate(15deg) scale(1.1);

        transform: rotate(15deg) scale(1.1);

    }



    100% {

        -webkit-transform: rotate(0deg) scale(1);

        transform: rotate(0deg) scale(1);

    }

}

@keyframes service-zoom {

    0%{

        -webkit-transform: rotate(0deg) scale(1);

        transform: rotate(0deg) scale(1);

    }

    50% {

        -webkit-transform: rotate(15deg) scale(1.1);

        transform: rotate(15deg) scale(1.1);

    }



    100% {

        -webkit-transform: rotate(0deg) scale(1);

        transform: rotate(0deg) scale(1);

    }

}

.main-chinhsach{

    margin-bottom: 20px;

}

.block-tab-sanpham .nav-tabs>li>a {

    margin: 0;

    border: none !important;

    border-radius: 0;

    color: #000;

    text-transform: uppercase;

}

.block-tab-sanpham .nav-tabs>li>a>i{

    margin-right: 5px;

}

.block-tab-sanpham .nav-tabs {

    border-bottom: none;

}

.block-tab-sanpham .nav-tabs>li.active>a, 

.block-tab-sanpham .nav-tabs>li.active>a:focus, 

.block-tab-sanpham .nav-tabs>li.active>a:hover,

.block-tab-sanpham .nav-tabs>li>a:hover{

    background: #3399fe;

    color: #fff;

}

.block-tab-sanpham .nav-tabs>li.active:after {

    position: absolute;

    content: '';

    border: 5px solid transparent;

    border-top-color: #268ABF;

    bottom: 0;

    margin-bottom: -10px;

    left: 50%;

    margin-left: -5px;

    z-index: 6;

}

.list-product{

    display: flex;

    flex-wrap: wrap;

}

.item-product-pub {

    width: 25%;

    border: 1px solid #ccc;

    padding: 15px;

    overflow: hidden;

    display: flex;

    justify-content: space-between;

    flex-direction: column;

}

.eff-scale{

    display: block;

}

.eff-scale img{

    transition: all 0.3s;

    transform: scale(1);

}

.eff-scale:hover img{

    transition: all 0.3s;

    transform: scale(1.1);

}

.name-product {

    margin: 0;

    padding: 5px 0;

    font-size: 14px;

    font-weight: 700;

    margin-top: 10px;

    line-height: 20px;

}

.name-product a{

    color: #000;

}

.price-product-pub{

    color: #f05423;

    font-size: 16px;

    font-weight: 700;

    padding: 5px 0;

    border-top: 1px solid #f2f3f4;

    border-bottom: 1px solid #f2f3f4;

    margin-bottom: 10px;

}

.addtocart a{

    padding: 5px 12px;

    border-radius: 0;

    font-weight: 300;

    background-color: #3399fe;

    color: #fff;

    display: inline-block;

}

.product-giamgia{

    position: relative;

}

.span-giamgia{

    background: #FF9900;

    padding: 7px 10px;

    color: #fff;

    position: absolute;

    text-align: center;

    top: 5px;

    left: 15px;

    z-index: 9;

    display: inline-block;

    font-size: 13px;

    font-weight: 700;

}

.main-tab-sanpham{

    margin-bottom: 20px;

}

.tit-pub{

    margin: 0;

    margin-bottom: 10px;

    border-bottom: 1px solid #ccc;

    font-size: 15px;

}

.tit-pub a{

    display: inline-block;

    padding: 10px;

    color: #fff;

    text-transform: uppercase;

    font-weight: 700;

    background: #3399fe;

}

.tit-pub a i{

    margin-right: 5px;

}

.main-danhmuc{

    margin-bottom: 20px;

}

.a-thuonghieu{

    display: block;

    margin-bottom: 10px;

}

.a-thuonghieu img{

    width: 100%;

}

.tit-ft{

    margin: 0;

    margin-bottom: 15px;

    color: #fff;

    border-bottom: 1px solid #fff;

    padding-bottom: 10px;

    font-size: 15px;

    font-weight: 700;

}

.tit-ft i{

    margin-right: 5px;

}

footer{

    background: #1D75BD;

    padding-top: 20px;

}

.address-ft p{

    color: #fff;

    margin-bottom: 10px;

}

.address-ft p i{

    margin-right: 7px;

}

.ul-footer{

    list-style-type: none;

    padding: 0;

    margin: 0;

}

.ul-footer > li{

    margin-bottom: 10px;

}

.ul-footer > li > a{

    color: #fff;

}

.ul-footer > li > a > i{

    margin-right: 5px;

}

.socail-ft{

    display: flex;

    align-items: center;

}

.socail-ft > a{

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border: 2px solid #fff;

    width: 30px;

    height: 30px;

    color: #fff;

    margin-left: 10px;

}

.copyright{

    background: #ff0606;

    padding: 5px 15px;

}

.tit-aside{

    background-color: #3399fe;

    color: #fff;

    text-transform: uppercase;

    padding: 10px 15px;

    margin: 0;

    font-size: 15px;

}

.tit-aside i{

    margin-right: 5px;

}

.nav-cate-aside{

    margin-bottom: 20px;

}

.sdt-kd{

    font-size: 12px;

    font-weight: 700;

    color: #0188Cc;

    margin-bottom: 10px;

}

.sdt-kd a{

    color: #35BC7A;

    font-size: 16px;

    margin-left: 5px;

}

.mxh span{

    color: #DB2525;

    display: inline-block;

    font-weight: 700;

    margin-top: 5px;

}

.item-block-suport-aside{

    margin-bottom: 10px;

}

.mxh {

    display: flex;

    flex-direction: column;

    align-items: center;

}

.block-suport-aside {

    border: 1px solid #ccc;

    padding: 15px;

}

.nav-suport-aside{

    margin-bottom: 20px;

}

.list-review-aside{

    border: 1px solid #ccc;

    padding: 10px;

}

.name-img-sp{

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    color: #000;

    font-size: 14px;

    font-weight: 700;

}

.name-img-sp span{

    width: calc(100% - 50px);

    margin-right: 10px;

}

.name-img-sp img{

    width: 40px;

}

.checked {

  color: orange;

}

.items-review{

    border-bottom: 1px dashed #ccc;

    padding: 7px 0;

}

.p-rating{

    font-size: 12px;

}

.list-review-aside .items-review:last-child{

    border: none;

}

.nav-review-aside{

    margin-bottom: 20px;

}

.list-news-post-aside{

    border: 1px solid #ccc;

}

.item-news-post-aside{

    display: flex;

    padding: 15px;

    border-bottom: 1px solid #ccc;

    align-items: flex-start;

    justify-content: space-between;

}

.item-news-post-aside > a{

    display: block;

    width: 80px;

}

.right-news-post-aside{

    width: calc(100% - 90px);

    margin-left: 10px;

}

.list-news-post-aside .item-news-post-aside:last-child{

    border: none;

}

.main-breac{

    margin-bottom: 20px;

}

.tit-ph{

    margin: 0;

    margin-bottom: 20px;

    padding-bottom: 10px;

    border-bottom: 1px solid #ccc;

    font-weight: 700;

}

.form-phanhoi{

    background: #F9F9F9;

    padding: 15px;

}

.pagi a {

    display: inline-flex;

    height: 30px;

    padding: 0 10px;

    align-items: center;

    border: 1px solid #ccc;

    border-right: unset;

    float: left;

    color: #000;

}

.pagi a:last-child{

    border-right: 1px solid #ccc;

}

.pagi {

    display: flex;

    justify-content: flex-end;

    margin-top: 20px;

}

.pagi a.active{

    background: #ebe9eb;

}

.block-filter {

    margin-top: 20px;

    padding: 0 10px;

}

.nav-filter-aside .ui-state-default, 

.nav-filter-aside .ui-widget-content .ui-state-default, 

.nav-filter-aside .ui-widget-header .ui-state-default{

    border-radius: 50%;

}

.nav-filter-aside .ui-widget-content{

    height: 7px;

}

.nav-filter-aside .ui-slider-horizontal .ui-slider-handle{

    top: -7px;

    outline: unset;

}

.nav-filter-aside{

    margin-bottom: 20px;

}

.ketqua-filter {

    margin-top: 10px;

}

.ketqua-filter input{

    border: none !important;

    box-shadow: unset;

    background: none !important;

    width: 122px;

}

.ketqua-filter span{

    font-size: 12px;

    display: inline-block;

}

.block-detail-pro{

    padding: 20px 0;

}

.name-pro-dt{

    font-size: 24px;

    font-weight: 400;

    margin: 0;

    border-bottom: 1px dashed #ccc;

    padding-bottom: 10px;

}

.list-info-spct p{

    padding: 10px 0;

    border-bottom: 1px dashed #ccc;

}

.tab-xxbh{

    margin-top: 10px;

    border-bottom: 1px dashed #ccc;

    padding-bottom: 10px;

}

.tab-xxbh table{

    width: 100%;

}

.tab-xxbh table tr td{

    border: 1px solid #ccc;

    padding: 10px;

    font-weight: 700;

}

.tab-xxbh table tr:nth-child(even){

    background: #f1f1f1;

}

.italic{

    font-style: italic;

}

.price-spct{

    font-size: 23px;

    color: #f05423;

    font-weight: 700;

    border-bottom: 1px dashed #ccc;

    padding: 10px 0;

}

.soluong {

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid #ccc;

    width: 125px;

}

.btn-minus, .btn-plus {

    border: none;

    background: none;

    outline: unset;

    width: 100%;

    font-size: 10px;

    height: 31px;

}

.ip-soluong {

    width: 50px;

    text-align: center;

    border: none;

    padding: 5px 0;

    border-left: 1px solid #ccc;

    border-right: 1px solid #ccc;

}

.quantity-addtocart{

    margin: 10px 0;

}

.quantity-addtocart .soluong{

    margin-right: 20px;

}

.thong-tin-tuvanfree{

    background: #eee;

    font-style: italic;

    padding: 10px;

}

.tuvanfree{

    margin-top: 20px;

}

.sdt-tuvan{

    margin-top: 20px;

}

.sdt-tuvan input{

    margin-right: 10px;

}

.tab-thongtinchitiet{

    margin-bottom: 30px;

}

.tab-thongtinchitiet .nav-tabs>li>a{    

    background: #ebebeb;

    color: #000;

    font-weight: 700;

}

.tab-thongtinchitiet .nav-tabs>li.active>a, 

.tab-thongtinchitiet .nav-tabs>li.active>a:focus, 

.tab-thongtinchitiet .nav-tabs>li.active>a:hover{

    background: #fff;

    color: #1D75BD;

}

.list-danhgia {

    margin-top: 20px;

}

.flex-start {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

}

.img-avatar{

    width: 32px;

}

.block-nddg {

    width: calc(100% - 50px);

    border: 1px solid #ccc;

    padding: 15px;

}

.item-danhgia-hoi{

    margin-bottom: 20px;

}

.item-danhgia-traloi {

    padding-left: 50px;

    margin-bottom: 20px;

}

.themdanhgia{

    font-weight: 700;

    color: #1D75BD;

    margin-bottom: 10px;

    font-size: 15px;

}

.items-danhgia{

    margin-bottom: 30px;

}

.rating { 

    border: none;

    float: left;

}

.rating > input { display: none; } 

.rating > label:before { 

    margin: 0 5px;

    font-size: 1.25em;

    font-family: FontAwesome;

    display: inline-block;

    content: "\f005";

}

.rating > .half:before { 

    content: "\f089";

    position: absolute;

}

.rating > label { 

    color: #ddd; 

    float: right; 

    margin: 0;

}

.rating > input:checked ~ label,

.rating:not(:checked) > label:hover,

.rating:not(:checked) > label:hover ~ label { color: #ffb909;  }

.rating > input:checked + label:hover,

.rating > input:checked ~ label:hover,

.rating > label:hover ~ input:checked ~ label,

.rating > input:checked ~ label:hover ~ label { color: #ffb909;  } 

.rat-star .checked {

    color: orange;

}

.rat-star{

    margin-right: 10px;

}

.block-sprela{

    margin-bottom: 30px;

}

.date-post-model *{

    color: #E62534;

}

.title-news{

    margin-bottom: 5px;

    font-size: 18px;

}

.date-post-model{

    margin-bottom: 5px;

}

.date-post-model a{

    display: inline-block;

    margin-left: 20px;

}

.items-tintuc{

    border-bottom: 1px dashed #ccc;

    padding-bottom: 15px;

    margin-bottom: 15px;

}

.info-giohang table {

    width: 100%;

}

.info-giohang table tr:first-child, .info-giohang table tr:last-child {

    border: none;

}

.info-giohang table tr {

    border-bottom: 1px solid #ccc;

}

.info-giohang tr:first-child th {

    background: #3399fe;

    color: #fff;

}

.info-giohang table tr td {

    padding: 10px;

    border: 1px solid #ccc;

}

.info-giohang table tr th {

    padding: 10px;

}

.remove-sp {

    display: inline-block;

    border: 1px solid #ccc;

    padding: 10px;

    color: #000;

    width: 37px;

}

.img-spgh {

    display: block;

    width: 80px;

}

.info-giohang .soluong{

    margin: 0 auto;

}

.total-gia {

    background: #f1f1f1;

    padding: 12px 15px;

    margin-bottom: 30px;

    margin-top: 15px;

}

.total-span {

    font-size: 20px;

    font-weight: 700;

    color: #ee0c0c;

}

.tongcong{

    margin-right: 10px;

}

.total-gia p:not(.flex){

    margin-bottom: 10px;

}

.httt label{

    position: relative;

    cursor: pointer;

    color: #000;

    margin-bottom: 10px;

}

.httt input[type="radio"]{

    position: absolute;

    right: 9000px;

}

.httt label:hover{

    color: #a93d46;

}

.httt .form-check{

    padding-left: 0;

}

.httt input[type="radio"] + .label-text:before{

    content: "\f096";

    font-family: "FontAwesome";

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;

    -webkit-font-smoothing:antialiased;

    width: 1em;

    display: inline-block;

    margin-right: 5px;

}

.httt input[type="radio"]:checked + .label-text:before{

    content: "\f14a";

    color: #2980b9;

    animation: effect 250ms ease-in;

}

.httt input[type="radio"]:disabled + .label-text{

    color: #aaa;

}

.httt input[type="radio"]:disabled + .label-text:before{

    content: "\f0c8";

    color: #ccc;

}

@keyframes effect{

    0%{transform: scale(0);}

    25%{transform: scale(1.3);}

    75%{transform: scale(1.4);}

    100%{transform: scale(1);}

}

.info-ttck p{

    margin-bottom: 10px;

}

.info-ttck p:last-child{

    margin: 0;

}

.thanhtoan-btn{

    background: #3399fe;

    border: none;

    font-weight: 700;

    color: #FFF;

    text-transform: uppercase;

    display: inline-block;

    border-radius: 3px;

    height: 40px;

    line-height: 40px;

    padding: 0 20px;

    min-width: 180px;

    outline: none;

}

.back-to-top {

    cursor: pointer;

    position: fixed;

    bottom: 300px;

    right: 20px;

    display: none;

    background: #3399fe !important;

    border: none;

    border-radius: 50%;

    height: 50px;

    padding: 0;

    width: 50px;

    z-index: 999;

}

.back-to-top span {

    position: relative;

    top: 15px;

}

.header-bottom.fixed-menu{

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    z-index: 9999;

}

.quangcao-page{

    position: fixed;

    width: 400px;

    z-index: 100;

    bottom: 0;

    right: 0;

}

.content-qcfx{

    background: #fff;

    border: 1px solid #01AEF0;

    padding: 10px;

}

.control-qc {

    position: absolute;

    right: 0;

    bottom: 100%;

    background: #01AEF0;

    color: #fff;

    padding: 10px;

    cursor: pointer;

}

.hotline-mbfx {

    display: none;

    background: #f00;

    font-size: 14px;

    font-weight: 700;

    position: fixed;

    bottom: 0;

    right: 0;

    z-index: 100;

}

.hotline-mbfx a{

    color: #fff;

    display: flex;

    align-items: center;

}

.hotline-mbfx a span{

    display: inline-block;

    padding: 10px;

}

.hotline-mbfx a span:first-child{

    background: #DE0000; 

    -webkit-animation: pulseHotline linear 3s infinite;

    animation: pulseHotline linear 3s infinite;

    display: inline-block;

    height: 40px;

}

@-webkit-keyframes  pulseHotline{

    20% { color:yellow; } 

    50% {  color:green;} 

    80% {  color:pink;}

    100% {  color:yellow;}

}

@keyframes pulseHotline {

    20% { color:yellow; } 

    50% { color:green;} 

    80% {  color:pink;}

    100% {  color:yellow;}

}













@media (max-width: 1199px){

    .show1199{display: block;}

    .hide1199{display: none;}

    .ul-main-menu > li > a {

        display: inline-flex;

        align-items: center;

        height: 40px;

        font-size: 15px;

        color: #fff;

        text-transform: uppercase;

        padding: 0 12px;

    }

}



@media (max-width: 991px){

    .show991{display: block;}

    .hide991{display: none;}

    body{transition: all 0.3s;}

    .sidenav {

        height: 100%;

        width: 0;

        position: fixed;

        top: 0;

        right: 0;

        background-color: #1d75bd;

        overflow-x: hidden;

        transition: 0.3s;

        z-index: 99999;

        padding: 0;

    }

    .sidenav .closebtn {

        font-size: 25px;

        display: block;

        align-items: center;

        width: 40px;

        background: #f5821f;

        color: #fff;

        margin: 0 auto;

        text-align: center;

        padding: 5px 0;

    }

    .menu-mobile {

        padding: 0;

        text-decoration: none;

        color: #818181;

        transition: 0.3s;

        list-style-type: none !important;

    }

    .menu-mobile li {

        margin: 0;

        background: unset;

        border: none;

        border-radius: 0;

        box-shadow: unset;

        border-bottom: 1px solid #ddd;

    }

    .menu-mobile a {

        padding: 15px 0 15px 20px;

        display: inline-block;

        width: calc(100% - 50px);

        color: #fff;

        font-size: 15px;

        font-weight: 700;

    }

    .menu-mobile a >img{

        width: 25px;

        margin-right: 10px;

    }

    .menu-mobile .sub-menu-mb .phelp a:first-child{

        padding: 15px 0 15px 15px;

        width: calc(100% - 50px);

    }

    .menu-mobile .sub-menu-mb a{

        width: 100%;

        padding: 15px;

    }

    .hassub-mb .phelp .a-icon {

        position: absolute;

        right: 15px;

        top: calc(50% - 7.5px);

        z-index: 9999;

        text-align: center;

        width: 20px;

        padding: 0;

    }

    .phelp {

        position: relative;

    }

    .phelp > a:first-child{

        border-right: 1px solid #ddd;

    }

    .sub-menu-mb{

        padding: 0;

        list-style-type: none;

        margin: 0;

    }

    .sub-menu-mb > li{

        border-top: 1px solid #ddd;

        border-bottom: none;

        background: #286090;

    }

    .sub-menu-mb > li:last-child{

        border-bottom: none;

    }

    .push-left {

        position: relative;

        right: 280px;

        transition: all 0.3s;

        left: unset;

    }

    .hotline-cart{

        justify-content: flex-end;

        margin: 0;

    }

    .flex-search-top {

        width: calc(100% - 250px);

    }

    .flex-search-top form{

        display: none;

    }

    .logo img{

        width: 200px;

    }

    .header-mb{

        padding: 5px 0;

    }

    .header-mb .flex-search-top form{

        display: flex;

        border: 1px solid #fff;

    }

    .header-mb .flex-search-top{

        width: calc(100% - 40px);

    }

    .flex-search-top form input,

    .flex-search-top form button{

        height: 32px;

    }

    .header-bottom.fixed-menu{

        position: unset;

    }

    .form-search-home .col-md-2{

        margin-bottom: 10px;

    }

    .address-ft,

    .ul-footer{

        margin-bottom: 30px;

    }

    .info-giohang table tr td {

        display: block;

        text-align: center;

        border: none;

    }

    .img-spgh {

        width: auto;

    }

    .info-giohang table tr {

        border: 1px solid #ccc !important;

    }

    .info-giohang table tr:first-child {

        display: none;

    }

    .quangcao-page{

        display: none !important;

    }

    .hotline-mbfx {

        display: flex;

        align-items: center;

        justify-content: center;

    }

    .back-to-top{

        bottom: 50px;

    }

}



@media (max-width: 767px){

    .show767{display: block;}

    .hide767{display: none;}

    .logo img{

        width: 150px;

    }

    .flex-search-top {

        width: calc(100% - 180px);

    }

    .block-tab-sanpham .nav-tabs>li{

        float: none;

    }

    .block-tab-sanpham .nav-tabs>li.active:after{

        content: unset;

    }

    .item-product-pub{

        width: 50%;

    }

}



@media (max-width: 480px){

    .show480{display: block;}

    .hide480{display: none;}

    .fwmb{width: 100%;}

    .title-news{

        margin-top: 10px;

    }

}

.social-contact{
    position: fixed;
    top: 70%;
    left: 10px;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: translateY(-50%);
}
.alo-phone {
    background-color: transparent;
    cursor: pointer;
    height: 60px;
    position: relative;
    -webkit-transition: visibility 0.5s ease 0s;
    transition: visibility 0.5s ease 0s;
    visibility: hidden;
    width: 60px;
    z-index: 20;
    margin: 4px 0;
}

.alo-phone.alo-show {
    visibility: visible
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

.alo-phone.alo-static {
    opacity: 0.6
}

.alo-phone.alo-hover,
.alo-phone:hover {
    opacity: 1
}

.alo-phone.alo-hover .alo-ph-text,
.alo-phone:hover .alo-ph-text {
    background-color: #141414
}

.alo-ph-circle {
    -webkit-animation: 1.2s ease-in-out 0s normal none infinite running alo-circle-anim;
    animation: 1.2s ease-in-out 0s normal none infinite running alo-circle-anim;
    background-color: transparent;
    border: 1px solid rgba(30, 30, 30, 0.4);
    border-radius: 100%;
    height: 50px;
    left: 5px;
    opacity: 0.1;
    position: absolute;
    top: 5px;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 50px;
}

.alo-phone.alo-active .alo-ph-circle {
    -webkit-animation: 1.1s ease-in-out 0s normal none infinite running alo-circle-anim !important;
    animation: 1.1s ease-in-out 0s normal none infinite running alo-circle-anim !important
}

.alo-phone.alo-static .alo-ph-circle {
    -webkit-animation: 2.2s ease-in-out 0s normal none infinite running alo-circle-anim !important;
    animation: 2.2s ease-in-out 0s normal none infinite running alo-circle-anim !important
}

.alo-phone.alo-hover .alo-ph-circle,
.alo-phone:hover .alo-ph-circle {
    border-color: #cd3121;
    opacity: 0.5
}

.alo-phone.alo-green.alo-hover .alo-ph-circle,
.alo-phone.alo-green:hover .alo-ph-circle {
    border-color: #141414;
    opacity: 0.5
}

.alo-phone.alo-green .alo-ph-circle {
    border-color: #4b803a;
    opacity: 0.5;
}

.alo-phone.alo-gray.alo-hover .alo-ph-circle,
.alo-phone.alo-gray:hover .alo-ph-circle {
    border-color: #ccc;
    opacity: 0.5
}

.alo-phone.alo-gray .alo-ph-circle {
    border-color: #141414;
    opacity: 0.5
}

.alo-ph-circle-fill {
    -webkit-animation: 2.3s ease-in-out 0s normal none infinite running alo-circle-fill-anim;
    animation: 2.3s ease-in-out 0s normal none infinite running alo-circle-fill-anim;
    background-color: #000;
    border: 2px solid transparent;
    border-radius: 100%;
    height: 60px;
    left: 0;
    opacity: 0.1;
    position: absolute;
    top: 0;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 60px;
    animation: unset;
}

.alo-phone.alo-active .alo-ph-circle-fill {
    -webkit-animation: 1.7s ease-in-out 0s normal none infinite running alo-circle-fill-anim !important;
    animation: 1.7s ease-in-out 0s normal none infinite running alo-circle-fill-anim !important
}

.alo-phone.alo-static .alo-ph-circle-fill {
    -webkit-animation: 2.3s ease-in-out 0s normal none infinite running alo-circle-fill-anim !important;
    animation: 2.3s ease-in-out 0s normal none infinite running alo-circle-fill-anim !important;
    opacity: 0 !important
}

.alo-phone.alo-hover .alo-ph-circle-fill,
.alo-phone:hover .alo-ph-circle-fill {
    background-color: rgba(233, 59, 53, 0.5);
    opacity: 0.75 !important
}

.alo-phone.alo-green.alo-hover .alo-ph-circle-fill,
.alo-phone.alo-green:hover .alo-ph-circle-fill {
    background-color: rgba(0, 0, 8, 0.5);
    opacity: 0.75 !important
}

.alo-phone.alo-green .alo-ph-circle-fill {
    background-color: rgb(165 207 28);
    opacity: 0.5 !important;
}

.alo-phone.alo-gray.alo-hover .alo-ph-circle-fill,
.alo-phone.alo-gray:hover .alo-ph-circle-fill {
    background-color: rgba(20, 20, 20, 0.5);
    opacity: 0.75 !important
}

.alo-phone.alo-gray .alo-ph-circle-fill {
    background-color: rgba(0, 0, 8, 0.5);
    opacity: 0.75 !important
}

.alo-ph-img-circle {
    -webkit-animation: 1s ease-in-out 0s normal none infinite running alo-circle-img-anim;
    animation: 1s ease-in-out 0s normal none infinite running alo-circle-img-anim;
    border: 2px solid transparent;
    color: #fff;
    font-size: 25px;
    text-align: center;
    border-radius: 100%;
    height: 40px;
    left: 10px;
    position: absolute;
    top: 10px;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.alo-ph-text {
    background-color: #d2243d;
    color: #fff;
    border-radius: 4px;
    padding: 0px 5px;
    bottom: 30px;
    display: block;
    font-size: .875rem;
    margin-right: -50px;
    position: absolute;
    left: 20%;
    text-align: center;
    text-transform: uppercase;
    width: 100px;
    font-size: 20px
}

.alo-phone.alo-active .alo-ph-img-circle {
    -webkit-animation: 1s ease-in-out 0s normal none infinite running alo-circle-img-anim !important;
    animation: 1s ease-in-out 0s normal none infinite running alo-circle-img-anim !important
}

.alo-phone.alo-static .alo-ph-img-circle {
    -webkit-animation: 0s ease-in-out 0s normal none infinite running alo-circle-img-anim !important;
    animation: 0s ease-in-out 0s normal none infinite running alo-circle-img-anim !important
}

.alo-phone.alo-hover .alo-ph-img-circle,
.alo-phone:hover .alo-ph-img-circle {
    background-color: #cd3121
}

.alo-phone.alo-green.alo-hover .alo-ph-img-circle,
.alo-phone.alo-green:hover .alo-ph-img-circle {
    background-color: #141414
}

.alo-phone.alo-green .alo-ph-img-circle {
    background-color: #a5cf1c
}

.alo-phone.alo-gray.alo-hover .alo-ph-img-circle,
.alo-phone.alo-gray:hover .alo-ph-img-circle {
    background-color: #ccc
}

.alo-phone.alo-gray .alo-ph-img-circle {
    background-color: #141414
}
@-webkit-keyframes "alo-circle-anim" {
    0% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(0.5) skew(1deg);
        transform: rotate(0deg) scale(0.5) skew(1deg);
    }
    30% {
        opacity: 0.5;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    100% {
        opacity: 0.6;
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@keyframes "alo-circle-anim" {
    0% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(0.5) skew(1deg);
        transform: rotate(0deg) scale(0.5) skew(1deg);
    }
    30% {
        opacity: 0.5;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    100% {
        opacity: 0.6;
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@-webkit-keyframes "alo-circle-fill-anim" {
    0% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
}

@keyframes "alo-circle-fill-anim" {
    0% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
}

@-webkit-keyframes "alo-circle-img-anim" {
    0% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    50% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@keyframes "alo-circle-img-anim" {
    0% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    50% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@keyframes "fadeInRight" {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0px, 0px);
        transform: translate3d(100%, 0px, 0px);
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes "fadeInRight" {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0px, 0px);
        transform: translate3d(100%, 0px, 0px);
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes "fadeOutRight" {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0px, 0px);
        transform: translate3d(100%, 0px, 0px);
    }
}

@keyframes "fadeOutRight" {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0px, 0px);
        transform: translate3d(100%, 0px, 0px);
    }
}

@keyframes "alo-circle-anim" {
    0% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(0.5) skew(1deg);
        transform: rotate(0deg) scale(0.5) skew(1deg);
    }
    30% {
        opacity: 0.5;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    100% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@keyframes "alo-circle-anim" {
    0% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(0.5) skew(1deg);
        transform: rotate(0deg) scale(0.5) skew(1deg);
    }
    30% {
        opacity: 0.5;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    100% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@keyframes "alo-circle-fill-anim" {
    0% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    50% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    100% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
}

@keyframes "alo-circle-fill-anim" {
    0% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
    50% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    100% {
        opacity: 0.2;
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        transform: rotate(0deg) scale(0.7) skew(1deg);
    }
}

@keyframes "alo-circle-img-anim" {
    0% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    50% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}

@keyframes "alo-circle-img-anim" {
    0% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
        transform: rotate(-25deg) scale(1) skew(1deg);
    }
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
        transform: rotate(25deg) scale(1) skew(1deg);
    }
    50% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        transform: rotate(0deg) scale(1) skew(1deg);
    }
}