@charset "utf-8";

/* CSS Document */
/*@import url(http://fonts.googleapis.com/css?family=Open+Sans);*/
body {
    font-family: 'Roboto Condensed', sans-serif;
    /*SVN-Gilro, sans-serif; /*'Google Sans Text', Roboto, 'Helvetica Neue', Helvetica, sans-serif, 'Noto Color Emoji';*/
    color: #333;
    font-size: 14px;
    margin: 0;
    line-height: 1.5;
    background: #f4f4f4;
}

.clear {
    clear: both
}

a {
    text-decoration: none;
    color: #1a0dab;
}

a:hover {
    color: green;
}

.upper {
    text-transform: none
}

img {
    border: none
}

/* STRUCTURE */
#pagewrap {
    width: 1280px;
    max-width: 100%;
    margin: auto;
}

#pagewrap:after {
    content: "";
    display: table;
    clear: both;
}

#middle {
    background: white;
}

#middle:after {
    content: "";
    display: table;
    clear: both;
}

#header {
    padding: 0 0px;
}

#logo {
    float: left;
    width: 160px;
    /*height: 90px;*/

    /* margin-top: 1%; 
    max-height: 100px;
    overflow: hidden;*/
    margin: auto;
}

#logo-right {
    float: right;
    width: 14%;
    margin-top: 1%
}

#logo-right-static {
    display: none
}

/*#left { width: 248px; float: left; padding: 5px 5px; margin: 0 0 0 -100%;clear: none;}
#middle { width: 680px; float: left; padding: 5px 5px; margin: 0px 0px 5px 5px; overflow: hidden; font-size:14px; line-height:22px;margin-left: 25%;}*/

#cart-item {
    width: 100px;
    float: left;
    height: 26px;
    line-height: 1.5rem;
}

/* user menu settings */
/* user menu settings */
#dropdown {
    display: block;
    padding: 0px;
    width: 100%;
    margin: 2%;
    position: relative;
    cursor: pointer;
    font-size: 13px;
    color: #477604;
    font-weight: bold;
    text-indent: 25px
}

#dropdown:after {
    position: absolute;
    left: 5px;
    top: 7px;
    content: '';
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 12px 8px 0 8px;
    border-color: #8BB33C transparent transparent transparent;
}

#dropdown:hover {
    color: #477604;
}

#dropdown.open {
    color: #477604;
    border-left-color: #6c6d70;
}

#dropdown.open:after {
    border-width: 0 8px 12px 8px;
    border-color: transparent transparent #8BB33C transparent;
}

#dropdown ul {
    position: absolute;
    top: 115%;
    /* move content -4px because of container left border */
    width: 190px;
    padding: 5px 0px;
    display: none;
    background: #eee;
    z-index: 999;
    border: 1px solid #CCC;
    border-radius: 3px;
}

#dropdown ul li {
    font-size: 15px;
    text-indent: 10px
}

#dropdown ul li a {
    text-decoration: none;
    display: block;
    color: #666;
    padding: 0;
    text-align: left
}

#dropdown ul li a:hover {}

#footer {
    width: 100%;
    max-width: 100%;
    margin: auto;

    clear: both;
    padding: 10px 0;
    background: black;
    color: #fff;
    border-bottom: 1px solid #999;
}

#footer a {
    color: #fff
}

a:hover {
    color: green;
}

.outer-general {
    width: 95%;

    margin: auto;
}

.outer-general:after {
    content: "";
    display: table;
    clear: both;
}

.footer-add {
    width: 48%;
    float: left;
    padding-right: 1%;
}

.footer-content {
    width: 24%;
    float: left;
    margin-left: 1%;
    padding-top: 0;
}

.footer-content ul {
    margin: 1%;
    padding: 0
}

.footer-content ul li {
    list-style-image: url(../images/bullet_sub2.gif);
    list-style-position: inside;
    color: #fff;
    padding: 5px 0;
}

.footer-content ul li a {
    color: #fff;
    text-decoration: none;
}

.clear {
    clear: both;
}

.r-head {
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    color: #0B4CA3;
    border-bottom: thin #4CB747 solid;
}

select {
    outline: 0;
    width: 98.5%;
    padding: 2px 0px 2px 5px;
    border-radius: 1px;
    border: 1px solid #CDCDCD
        /*#9AA5AA*/
    ;

    -webkit-box-shadow: inset 3px 3px 5px 0 #ececec;
    -moz-box-shadow: inset 3px 3px 5px 0 #ececec;
    box-shadow: inset 3px 0px 5px 0 #ececec;
    -webkit-transition: box-shadow 0.3s;
    -moz-transition: box-shadow 0.3s;
    -o-transition: box-shadow 0.3s;
    transition: box-shadow 0.3s;
}

.datmua2 {
    background: #FC9300;
    border: none;
    color: white;
    padding: 3px 15px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    display: block;
    /* margin: 1px; */
    margin: 0.5rem 0 0.5rem 0;
    width: 60px;
    text-align: center;
}

.datmua2:hover {
    background: #000;
}

#footer-bottom {
    width: 100%;
    background: #f46f20;
    color: #FFF;
    overflow: hidden;
    padding-bottom: 5px
}

#icon-box {
    width: 100px;
    float: right;
    margin-top: 3px
}

.icon {
    width: 22px;
    height: 21px;
    float: left;
    margin: 0.4rem 0 0.6rem 0
}

#ft-copyright {
    width: 70%;
    float: left;
    margin-top: 10px;
    color: #fff;
}

#ft-copyright a {
    text-decoration: none;
    color: #fff
}
#ft-copyright a:hover {
    background: #000;
}

table {
    max-width: 100%;
}

.responsive-image {
    position: relative;
    list-style: none;
    overflow: hidden;
    text-align: center;
    max-width: 100%;
    padding: 0;
    margin: 1rem;
    max-height: 90px;
}

.responsive-image img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border: 0;
}

.responsive-image-news {
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 30%;
}

.responsive-image-news img {
    display: block;
    height: auto;
    float: none;
    width: 30%;
    border: 0;
}

#gioithieutrangchu {
    width: 48%;
    float: left;

    margin: 0.5rem 0 0.5rem 0;
}

#doitac {
    width: 48%;
    float: left;
    min-height: 100px;
    margin: 0.5rem 0 0.5rem 0;
}

/*new css*/
.leftmenu,
.advertise,
.nav-content,
#news-box,
#article-box,
#promotion-box,
#customer-box {
    width: 100%;
}

.nav-title {
    height: auto;
    padding: 10px 0 10px 0px;
    font-weight: 600;
    /* border-bottom: 1px solid #56270c; */
    /* border-top: 1px solid #56270c; */
    clear: both;
    /* text-indent: 5px; */
    margin: 0.5rem 0 0.5rem 0;
    /* border-bottom: none; */
    font-size: 18px;
    color: #fff;
    text-align: center;
    background: Purple;
}

.nav-title a {
    color: #ea1f24;
}

.nav-title-hiden {
    width: 246px;
    height: auto;
    padding: 10px 0 10px 3px;
    font-weight: bold;
    font-size: 15px;
    color: #515151;
    background: url(../images/title.jpg) no-repeat;
    text-transform: uppercase;
    clear: both;
    text-align: center;
    margin: 0.5rem 0 0.5rem 0;
}

.leftmenu-static {
    width: 256px;
    background: #F8F8F8;
    border: 1px solid #F6F6F6;
    border-bottom: none;
}

.static-title {
    width: 99%;
    padding: 5px 0 5px 3px;
    font-weight: bold;
    background: #1AA2E9;
    color: #FFF;
    text-transform: uppercase;
    clear: both
}

#customer-title {
    width: 99%;
    padding: 5px 0 5px 3px;
    font-weight: bold;
    background: #1AA2E9;
    color: #FFF;
    text-transform: uppercase;
    clear: both
}

.leftmenu ul {
    margin: 0.5rem 0 0.5rem 0;
    padding: 0
}

.leftmenu ul li {
    list-style: none;
    background: url(../images/nav.png) no-repeat;
    margin: 0.5rem 0 0.5rem 0;
}

.leftmenu ul li a {
    text-decoration: none;
    font-weight: bold;
    padding: 9px 0 9px 23px;
    color: #666666;
    display: block;
    font-size: 13px
}

.leftmenu ul li a:hover {
    color: #262626;
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

#banner {
    height: 222px;
    width: 99.8%;
    padding: 0;
    float: left;
    position: relative;
    border: 1px solid #F00
}

#slider {
    position: relative;
    overflow: hidden;
}

#sliderContent {
    position: absolute;
    top: 0;
    margin-left: 0;
}

.sliderImage {
    float: left;
    position: relative;
    display: none;
}

.sliderImage span {
    position: absolute;
    font: 10px/15px Arial, Helvetica, sans-serif;
    padding: 10px 13px;
    width: 632px;
    background-color: #000;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    color: #fff;
    display: none;
}

.clear {
    clear: both;
}

.sliderImage span strong {
    font-size: 14px;
}

.top {
    top: 0;
    left: 0;
}

.bottom {
    bottom: 0;
    left: 0;
}

/*ul { list-style-type: none; margin: 0; padding: 0 }*/

/*img { width: 100% }*/
.news-title {
    width: 90%;
    margin-top: 5px;
    _margin-top: 5px;
    overflow: hidden;
    padding-left: 15px;
    padding-right: 3px;
    color: #FFFFFF;
    margin: 0.5rem 0 0.5rem 0;
    background: url(../images/bullet_sub.png) no-repeat 1% 4px;
}

.news-title a {
    text-decoration: none;
    color: #666;
}

.news-title a:hover {
    text-decoration: none;
    color: #0267AF
}

.link {
    width: 100%;
    margin: 0.5rem 0 0.5rem 0;
    overflow: hidden;
    text-align: center
}

.article-box {
    width: 200px;
    overflow: hidden;
    margin: 0.5rem 0 0.5rem 0;
}

.article-image {
    width: 50px;
    height: 50px;
    border: 1px solid #999;
    float: left;
    padding: 2px 0 0 2px
}

.article-title {
    width: 140px;
    float: left;
    margin-left: 3px
}

.article-title a {
    text-decoration: none;
    color: #000
}

.article-title a:hover {
    color: #1886CC
}

.customer {
    width: 200px;
    margin: 0.5rem 0 0.5rem 0;
    margin-bottom: 10px;
    padding-bottom: 5px
}

.customer-name {
    text-align: center;
    border-bottom: 1px dashed #666;
}

.customer-name a {
    text-decoration: none;
    color: #064485;
    font-weight: bold
}

.customer-name a:hover {
    color: #FF6600
}

/*menu*/
#topmenu {
    background: #1a0dab;
    padding: 2px 0px 2px 0px;
}

.tieude {
    float: left;
    background: #76ac00;
    color: white;
    padding: 10px 0px 10px 0px;
    width: 254px;
    margin: 0.5rem 0 0.5rem 0;
    /* text-align: center;*/
    text-transform: uppercase;
    font-weight: 600;
}

.toggleMenu {
    display: none;
    padding: 0px;
    background: url(../images/menu.png) no-repeat 2% center;
    height: 40px;
    text-align: right;
    color: #878787;
    width: 100%;
    font-weight: bold;
    font-size: 18px;
}

.nav-menu {
    list-style: none;
    *zoom: 1;
    width: 1920px;
    max-width: 90%;
    margin: 5px 0 5px 0;
}

.nav-menu:before,
.nav-menu:after {
    content: " ";
    display: table;
}

.nav-menu:after {
    clear: both;
}

.nav-menu ul {
    list-style: none;
    width: 19em;
    margin: 5px 0 5px 0;
    ;
}

.nav-menu a {
    padding: 1rem;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1rem;
}

.txttimkiem {
    padding: 9px 10px 9px 10px;
    float: left;
    border: none;
    width: 380px;
    color: #56270c;
    max-width: 70%;
    border: #f46f20 thin solid;
}

.txtnuttim {
    padding: 10px 8px;
    float: left;
    background: #f46f20;
    border: 0px;
    color: white;
    text-transform: uppercase;
}

.nav-menu li {
    position: relative;
    /* background:url(../images/menu-line.png) no-repeat left center;*/
}

.nav-menu>li {
    float: left;
}

.nav-menu>li>.parent {
    /*background: url(../images/downArrow.png) no-repeat 100%; */
}

.nav-menu>li>a {
    display: block;
}

.nav-menu li ul {
    position: absolute;
    /* left: -9999px; */
    margin: 0rem 0 0.6rem 0;
    padding: 0px;
    display: none;
}

.nav-menu li ul ul {
    display: none;
}

.nav-menu>li:hover {
    background: #ff9900;
}

.nav-menu>li.hover>ul {
    left: 0;
    display: block;
}

.nav-menu li li.hover ul {
    left: 100%;
    top: 0;
    display: block
}

.nav-menu li li a {
    display: block;
    background: #f46f20;
    position: relative;
    z-index: 100;
    border-top: 1px solid #fff;
    padding: 10px 0 10px 8px;
    text-transform: initial;
    font-weight: normal;
}

.nav-menu li li li a {
    background: #f46f20;
    z-index: 200;
    border-top: 1px solid #fff;
}

.nav-menu li li a:hover {
    background: #4DB748;
    /**/
}

#topReg span {
    color: #fff;
}

#search {
    width: 48%;
    overflow: hidden;
    float: left;
    border: 1px solid #CDCDCD;
    border-radius: 3px;
    height: 26px;
    padding: 0;
    margin: 0.5rem 0 0.5rem 0;
    -webkit-box-shadow: inset 3px 3px 5px 0 #ececec;
    -moz-box-shadow: inset 3px 3px 5px 0 #ececec;
    box-shadow: inset 3px 3px 5px 0 #ececec;
    -webkit-transition: box-shadow 0.3s;
    -moz-transition: box-shadow 0.3s;
    -o-transition: box-shadow 0.3s;
    transition: box-shadow 0.3s;
    background: #FFF;
}

#search-box {
    width: 85%;
    float: left;
}

#search-button {
    width: 26px;
    height: 26px;
    float: right;
    margin-top: 0px
}

.xuhuong {
    width: 100%;
    background: #fff;
    overflow: hidden
}

.xuhuong ul {
    margin: 0.5rem 0 0.5rem 0;
    padding: 0
}

.xuhuong ul li {
    list-style: none;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
}

.xuhuong ul li a {
    text-decoration: none;
    color: #666;
}

.hotline-right {
    overflow: hidden;
    float: right;
    padding-top: 1.5rem;

}

.hotline-right ul {
    margin: 0.5rem 0 0.5rem 0;
    padding: 0
}

.hotline-right ul li {
    list-style: none;
    margin: 0.5rem 0 0.5rem 0;
    float: left;
    font-size: 25px;
    color: #ea1f24;
}

.hotline-right ul li a {
    text-decoration: none;
    color: #666;
    padding-left: 10px
}

#newsletter {
    width: 18%;
    overflow: hidden;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    border: 1px solid #CDCDCD;
    border-radius: 3px;
    height: 26px;
    padding: 0;
    -webkit-box-shadow: inset 3px 3px 5px 0 #ececec;
    -moz-box-shadow: inset 3px 3px 5px 0 #ececec;
    box-shadow: inset 3px 3px 5px 0 #ececec;
    -webkit-transition: box-shadow 0.3s;
    -moz-transition: box-shadow 0.3s;
    -o-transition: box-shadow 0.3s;
    transition: box-shadow 0.3s;
    background: #FFF;
}

#newsletter-box {
    width: 64%;
    float: left;
}

#newsletter-button {
    width: 60px;
    height: 26px;
    float: right;
    margin-top: 0px
}

input[type=password] {
    outline: 0;
    width: 98.5%;
    padding: 2px 0px 2px 5px;
    border-radius: 1px;
    border: 1px solid #CDCDCD
        /*#9AA5AA*/
    ;
    /*height:20px;*/
    -webkit-box-shadow: inset 3px 3px 5px 0 #ececec;
    -moz-box-shadow: inset 3px 3px 5px 0 #ececec;
    box-shadow: inset 3px 0px 5px 0 #ececec;
    -webkit-transition: box-shadow 0.3s;
    -moz-transition: box-shadow 0.3s;
    -o-transition: box-shadow 0.3s;
    transition: box-shadow 0.3s;
}

/*input[type=submit] { width: 100%; padding: 3px; border-radius: 4px; border-top: 2px solid #9AA5AA;  border-bottom: 2px solid #143241; border-left:none;border-right:none; background-color: #446373; color:#FFF; font-weight:bold; cursor:pointer }
*/
.support {
    width: 230px;
}

.button {
    width: 130px;
    height: 27px;
    line-height: 1.5rem;
    background: #02b5ed;
    border-radius: 5px;
    text-align: center;
    margin: 0.5rem 0 0.5rem 0;
    margin-bottom: 10px
}

.button a {
    text-decoration: none;
    display: block;
    color: #FFF;
    text-transform: uppercase;
    font-weight: bold
}

.title-center {
    border-radius: 5px;
    background: #9f9f9f;
    padding: 2px
}

fieldset {
    border: 1px solid #f3f3f3;
    border-radius: 5px
}

#contenn {
    width: 1280px;
    max-width: 99%;
    margin: auto;
}

.product_box {
    display: inline-block;
    position: relative;
    z-index: 1;
    width: 32%;
    /* height: 285px; */
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    padding-bottom: 5px;
    margin: 0.5rem 0 0.5rem 0;
    border-radius: 10px;
    border: thin #f1f1ff solid;

}

.box22 {
    width: 19%;
}

.product_box:hover {}

.product_box a {
    /* display: block; */
    /* width: 100%; */
    /* padding: 0px; */
    /* background-color: white; */
    cursor: pointer;
    /* text-decoration: none; */
    color: #5e5e5e;
    font-weight: bold;
}

.product_box:hover a {
    /*  box-shadow:0px 0px 5px rgba(0,0,0,0.5);-moz-box-shadow:0px 0px 5px rgba(0,0,0,0.5); -webkit-box-shadow:0px 0px 5px rgba(0,0,0,0.5); -o-box-shadow:0px 0px 5px rgba(0,0,0,0.5); -ms-box-shadow:0px 0px 5px rgba(0,0,0,0.5);*/
}

.product_box a .image {
    display: block;
    position: relative;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: black;
}

.product_box a .informations {
    display: none;
}

.product_box a .informations p,
.product_box a .informations label {
    display: block;
    margin: 0.5rem 0 0.5rem 0;
    font-family: 'Google Sans Text', Roboto, 'Helvetica Neue', Helvetica, sans-serif, 'Noto Color Emoji';
    font-size: 12px;
    color: #333;
    font-weight: normal;
    background: #F2F2F2;
    padding: 2%;
    z-index: 98;
    position: absolute;
    top: 0;
    opacity: 0.9;
    filter: alpha(opacity=90);
    line-height: 1.5rem;
    height: 97%;
    /*width:100%; height:100%; */
    ;
}

.product_box a .informations p {
    width: 96%;
}

.product_box:hover a .informations {
    display: block;
}

.product_img {
    text-align: center;
    margin-top: 20px;
}

.product_img img {
    /*width: 88%;*/
    width: 70%;
    height: 165px;
    margin: 0.5rem 0 0.5rem 0;
}

.product_img span img {
    width: 50px;
    height: 50px
}

.product_title {
    text-align: center;
    padding: 10px 0px;
    /* height: 35px; */
    margin: 0.5rem 0 0.5rem 0;
    /* font-size: 13px; */
    background: rgba(255, 255, 0, 0.25);
    color: #0775d6;
}

.product-desc {
    padding: 0px 5px;
    text-align: justify;
    height: 70px;
    overflow: hidden;
    font-weight: normal;
}

.product_title a {
    text-decoration: none;
    color: #5e5e5e;
    font-size: 12px;
    font-weight: bold;
    padding: 0 3px;
}

.product_title a:hover {
    text-decoration: none;
    color: #5A9505
}

.product_price {
    padding: 0;
    overflow: hidden;
}

.product_old-price {
    /* float: left; */
    text-decoration: line-through;
    color: #333333;
    /* padding-left: 5px; */
    font-size: 13px;
}

.product_phantram {
    color: white;
    background: #41b9ff;
    font-weight: normal;
    font-size: 10px;
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding: 3px 8px;
    border-radius: 4px;
}

.product_new-price {
    position: relative;
    color: #f00;
    padding-right: 5px;
    font-weight: bold;
    font-size: 20px;
}

.product_buy {
    width: 91px;
    height: 24px;
    margin: 0.4rem 0 0.6rem 0
}

.product_news {
    text-align: center;
}

.product_news img {
    width: 29px
}

.label-name {
    font-size: 14px;
    font-weight: bold;
}

.label-price {
    font-size: 13px;
    font-weight: bold;
    color: #F00
}

#middle #khungnoidung table {
    max-width: 100%;
    height: auto !important;
}

#middle #khungnoidung embed {
    max-width: 100%;
    height: auto !important;
}

#middle img {
    max-width: 100%;
    height: auto !important;
}

.small-product {
    border: 1px solid #e6e6e6;
    width: 98.6%;
    /* background:#333;*/
}

.small-prd-box {
    overflow: hidden;
    padding-bottom: 10px;
    position: relative;
    margin: 0.5rem 0 0.5rem 0;
}

.small-prd-img {
    width: 95%;
    text-align: center;
    margin: 0.5rem 0 0.5rem 0;
    float: left;
    border: 1px solid #e6e6e6;
}

.small-prd-img img {
    width: 99%
}

.small-prd-des {
    float: left;
    width: 99%;
    margin-top: 10px;
}

.small-prd-title {
    padding: 5px 0 5px 5px;
}

.small-prd-title a {
    text-decoration: none;
    color: #666;
    font-size: 16px;
    font-weight: bold;
}

.small-prd-title a:hover {
    text-decoration: none;
    color: #f00
}

.small-prd-price {
    text-align: left;
    color: #ff591b;
    padding: 0px 0 0 5px;
    margin-top: 0px;
    font-size: 16px;
    font-weight: bold;
}

.small-prd-price-old {
    text-align: left;
    color: #f00;
    padding: 0px 0 0 5px;
    margin-top: 0px;
    text-decoration: line-through
}

#top {
    background: black;
    color: white;
    font-weight: 600;
    font-size: 16px;
    padding: 10px;
}

#top li {
    float: left;
    list-style: none;
    //margin: 4px;
}

#top li a {
    color: #fff;
}

.hotline {
    margin: 0 1rem 0 1rem;
    display: inline-block;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    background: url(../../img/z-call.png) left center no-repeat;
    padding: 0px 0px 0px 30px;
}

.top {
    float: right;
}

.album_box {
    width: 210px;
    position: relative;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    border-radius: 5px
}

.album_img {
    text-align: center;
    margin-top: 5px;
}

.album_img img {
    width: 207px;
    height: 120px;
}

.album_title {
    text-align: left;
    padding: 5px 0 5px 11px;
}

.album_title a {
    text-decoration: none;
    color: #5e5e5e;
}

.album_title a:hover {
    text-decoration: none;
    color: #0267AF
}

.tintuc-box {
    width: 100%;
    overflow: hidden;
    margin-top: 10px
}

.tintuc-title {
    margin-left: 30%
}

.tintuc-title a {
    text-decoration: none;
    color: #999;
    text-transform: uppercase;
    font-weight: bold
}

/*=========My Pham=========*/
#topbg {
    width: 100%;
    background: #ea1f24;
    height: auto;
    padding-bottom: 4px;
}

#topleft-bg {
    width: 29px;
    height: 34px;
    float: left;
}

#topcenter-bg {
    width: 75%;
    height: 34px;
    float: left;
}

#topGuide {
    width: 65%;
    float: left;
}

#topGuide ul {
    margin: 0.5rem 0 0.5rem 0;
    padding: 0
}

#topGuide ul li {
    list-style: none;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    height: 25px;
    line-height: 1.5rem
}

#topGuide ul li a {
    text-decoration: none;
    color: #fff;
    font-weight: bold
}

#topReg {
    margin-top: 3px;
    text-align: center;
    float: right
}

#topReg img {
    padding-right: 3px
}

#topReg ul {
    margin: 0.5rem 0 0.5rem 0;
    padding: 0
}

#topReg ul li {
    list-style: none;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    height: 25px;
    line-height: 1.5rem
}

#topReg ul li a {
    text-decoration: none;
    color: #333;
    font-weight: bold;
}

#topLang {
    float: left;
    margin-top: 3px;
}

#topCart {
    background: #E55123;
    height: 19px;
    line-height: 1.5rem;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    text-align: center;
    cursor: pointer;
    width: 30px
}

#topCart a {
    color: #FFF
}

#topright-bg {
    width: 21.7%;
    height: 33px;
    float: left;
}

#topright-bg-left {
    width: 50px;
    height: 33px;
    float: left;
}

#topright-bg-center {
    width: 65%;
    height: 33px;
    float: left;
    line-height: 1.5rem;
    color: #FFF;
    font-weight: bold;
    font-size: 13px;
    text-align: center
}

#topright-bg-right {
    width: 22px;
    height: 33px;
    float: right
}

#head-bg {
    margin: auto;
    /* max-width: 99%; */
    background: white;
}

.title-cate {
    background: url(../images/title-cate.png) right no-repeat #5A9505;
    width: 100%;
    height: 30px;
    line-height: 1.5rem;
    color: #FFF;
    font-weight: bold;
    text-indent: 10px
}

.hotro {
    display: none;
    position: fixed;
    bottom: 0px;
    left: 0px;
    background: #00000099;
    width: 100%;
    text-align: center;
    border-top: 1px white solid;
}
.hotro:hover {
    background-image: linear-gradient(to top right, #00ffbb, #00ddbb);
}

.hotro a {
    color: white;
}

.hotro img {
    max-height: 60px;
}

.hotro .hotro-phone {
    float: left;
    width: 34%;
    background: #00000099;
    padding: 5px 0px;
    font-size: 13px;
}
.hotro .hotro-phone:hover {
    background-image: linear-gradient(to top right, #00ffbb, #00ddbb);
}

.hotro .hotro-facebook {
    float: left;
    width: 25%;
    background: #00000099;
    padding: 5px 0px;
    font-size: 13px;
}
.hotro .hotro-facebook:hover {
    background-image: linear-gradient(to top right, #00ffbb, #00ddbb);
}

.hotro .hotro-zalo {
    float: left;
    width: 33%;
    background: #00000099;
    padding: 5px 0px;
    font-size: 13px;
}
.hotro .hotro-zalo:hover {
    background-image: linear-gradient(to top right, #00ffbb, #00ddbb);
}

.hotro .hotro-dangky {
    float: left;
    width: 33%;
    background: #00000099;
    padding: 5px 0px;
    font-size: 13px;
}
.hotro .hotro-dangky:hover {
    background-image: linear-gradient(to top right, #00ffbb, #00ddbb);
}

< !-- stylebanner -->.jssorb05 {
    position: absolute;
    border: 10px solid #F00;
}

.jssorb05 div,
.jssorb05 div:hover,
.jssorb05 .av {
    position: absolute;
    /* size of bullet elment */
    width: 16px;
    height: 16px;
    background: url(../img/b05.png) no-repeat;
    overflow: hidden;
    cursor: pointer;
}

.jssorb05 div {
    background-position: -7px -7px;
}

.jssorb05 div:hover,
.jssorb05 .av:hover {
    background-position: -37px -7px;
}

.jssorb05 .av {
    background-position: -67px -7px;
}

.jssorb05 .dn,
.jssorb05 .dn:hover {
    background-position: -97px -7px;
}




.jssora12l,
.jssora12r {
    display: block;
    position: absolute;
    /* size of arrow element */
    width: 30px;
    height: 46px;
    cursor: pointer;
    background: url(../img/a12.png) no-repeat;
    overflow: hidden;
}

.jssora12l {
    background-position: -16px -37px;
}

.jssora12r {
    background-position: -75px -37px;
}

.jssora12l:hover {
    background-position: -136px -37px;
}

.jssora12r:hover {
    background-position: -195px -37px;
}

.jssora12l.jssora12ldn {
    background-position: -256px -37px;
}

.jssora12r.jssora12rdn {
    background-position: -315px -37px;
}



.line {
    width: 0px;
    min-height: 130px;
    border-left: 1px solid #4f8304;
    border-right: 1px solid #78c10e;
    float: left;
}

.line2 {
    width: 99%;
    margin: 0.5rem 0 0.5rem 0;
    border-top: 1px solid #4f8304;
    border-bottom: 1px solid #78c10e;
    display: none;
    clear: both
}

.titlePro-box {
    width: 100%;
    overflow: hidden;
    margin-bottom: 5PX;
    border-bottom: 1px #f46f20 double;
}

.titlePro-name {
    background: darkorange;
    font-size: 16px;
    padding: 8px 20px 8px 8px;
    float: left;
    border-radius: 0px 0px 0 0;
    color: #fff;
    font-weight: bold;

}

.titlePro-detail {
    float: left;
    font-size: 16px;
    background: #ff7800;
    /* background: url(../images/bullet_sub2.gif) center right no-repeat #E55123; */
    text-align: right;
    padding: 8px 10px;
    margin-right: 3px;
    /* border-radius: 0px 15px 15px 0; */
}



.titlePro-detail a {
    text-decoration: none;
    color: #fff;
    display: block
}

.quangcao {
    margin: 0.5rem 0 0.5rem 0;
    clear: both
}

/*--Tooltip Styles--*/
.tip {
    color: #fff;
    background: #68AB08;
    display: none;
    padding: 5px;
    position: absolute;
    z-index: 1000;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: left;
    line-height: 1.5rem;
    border: 3px solid #9AC570
}

#status-menu {
    width: 100%;
    overflow: hidden;
    background: #efefef;
    color: #444;
}

#status-menu ul {
    margin: 0.5rem 0 0.5rem 0;
    padding: 0
}

#status-menu ul li {
    list-style: none;
    float: left;
    padding: 1% 5px 1% 0;
    background: url(../images/bullet_sub.gif) no-repeat center right;
    margin-right: 10px
}

#status-menu ul li a {
    text-decoration: none;
    font-size: 12px;
    color: #444;
    padding-right: 10px;
    font-weight: bold
}

#status-menu ul li a:hover {
    color: #333
}

table.thongso {
    border-spacing: 0px;
    border: thin #eaeaea solid;
    width: 100%;
}

table.thongso tr {
    border: thin #eaeaea solid;
}

table.thongso th {
    padding: 10px;
}

table.thongso td {
    padding: 10px;
}

#dt-img-box {
    width: 48%;
    float: left
}

#dt-desc-box {
    width: 50%;
    float: left;
    margin-left: 2%;
}

.dt-title {
    font-weight: bold;
    margin-bottom: 2%;
    font-size: 16px
}

.dt-ID {
    color: #000;
    margin-top: 3px;
    font-size: 12px
}

.hethang {
    margin-left: 20px;
    color: #627604
}

.hethang a {
    color: #E55123
}

.hethang a:hover {
    text-decoration: underline
}

.dt-price {
    color: #f00;
    font-size: 28px;
    font-weight: bold;
    margin-top: 2%
}

.dt-cart {
    margin-top: 5%;
    overflow: hidden;
    font-size: 12px;
}

.dt-cart-bt {
    margin-left: 15px;
    background: #FC9300;
    float: left;
}

.dt-cart-bt a {
    color: #FFF;
    font-weight: bold;
    padding: 3px 15px;
    display: block;
    font-size: 12px;
    text-transform: uppercase
}

.dt-title-box {
    width: 100%;
    border-bottom: 1px solid #E6E6E6;
    overflow: hidden;
    margin-top: 8px;
    position: relative;
}

.cmt-sel {

    bottom: 5px;
    right: 5px;
}

.c2-head {
    color: silver;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
    cursor: pointer;
}

.c2-head:hover {
    color: red;
}

.dt-title-name {
    border: 1px solid #E6E6E6;
    border-radius: 3px 3px 0 0;
    float: left;
    border-bottom: none;
    padding: 5px;
    background: #F0F0F0;
    font-weight: bold;
    color: #515151;
    text-align: center
}

.dt-content {
    line-height: 1.5rem;
    padding: 10px 10px;
}

.dt-content img {
    max-width: 99%;
    height: auto !important;
}

.dt-img {
    text-align: center;
}

.dt-img img {
    border: 0 none;
    font-size: 0;
    line-height: 0;
    max-width: 100%;
    height: auto;
    margin: 0.5rem 0 0.5rem 0;
}

#command {
    width: 100%;
    height: 25px;
    line-height: 1.5rem;
    border: 1px solid #e6e6e6;
    text-indent: 8px;
    margin-top: 5px;
}

.quantity-box {
    width: 100%;
    max-height: 300px;
    overflow: scroll;
    overflow-x: hidden;
}

.quantity-img img {
    width: 60px;
    height: 60px;
    padding: 5px
}

.quantity-name a {
    text-decoration: none;
    color: #666
}

.quantity-price {
    width: 90px
}

.quantity-choice {
    width: 50px;
    text-align: right;
    padding-right: 10px
}

.quantity-box td {
    border-bottom: 1px solid #dedede
}

.quantity-box tr {
    background: #F0F0F0;
}

.quantity-box tr:hover {
    background: #D1D1D1
}

/*td{border-bottom:1px solid #dedede}
tr{background:#F0F0F0;}
tr:hover{background:#D1D1D1}
*/
.anhienmenu {
    display: none;
}

.dmdienthoai {
    display: none;
    position: absolute;
    width: 275px;
    z-index: 9999;
    top: 117px;
}

.tieude:hover .dmdienthoai {
    display: block;
}

.sp-left {
    /*width: 920px;
    float: left;*/
    margin-right: 10px;
}

.tinttucqt {
    padding: 0px 10px;
    margin-bottom: 10px;
    position: relative;
}

.tinttucqt img {
    width: 100%;
}

.tinttucqt h3 {
    color: white;
    font-size: 16px;
    text-transform: none;
    margin: 1%;
    /* line-height: 1.5rem; */
    font-weight: 600;
    position: absolute;
    bottom: 0px;
    left: auto;
    background: #0000007a;
    margin: 1%;
    padding: 10px;
}

.tinttucqt2 {
    margin: 10px;
    position: relative;
    border-bottom: thin dotted gray;
}

.tinttucqt2 .ttr-ico {
    margin: 0px 10px 0px 0px;
    float: left;
    /*height: 35px; */
}

.tinttucqt2 .ttr-ico img {
    width: auto;
    margin-top: 0px;
}

.tinttucqt2 h3 {
    text-transform: inherit;
    /*line-height: ; */
    color: #1a0dab;
    font-weight: normal;
}

.tinttucqt2 h3:hover {
    color: green;
}

.tinttuc {
    /* border: thin silver dotted; */
    padding: 5px;
    /* margin: 0.25rem 0 0.75rem; */
    margin-top: 0px;
    margin-bottom: 10px;
    /* float: left; */
    /* width: 47%; */
    /* border-radius: 10px; */
    color: #424141;
    /* line-height: 19px; */
    /* height: 115px; */
    background: #f7f7f78f;
}

.tinttuc img {
    width: 100px;
    height: auto;
    float: left;
    margin: 10px 10px 10px 0;
}

.tinttuc h3 {
    font-weight: 600;
    /*color: #9400D3*/
    ;
    font-size: 16px;
    text-transform: initial;
    /*margin: 0.4rem 0 0.6rem 0*/
    ;
    line-height: 18px;
}

.sgiaodich {
    border: thin #d8d3d35e solid;
    padding: 5px;
    margin: 0.5rem 0 0.5rem 0;
    margin-top: 0px;
    margin-bottom: 10px;
    float: left;
    width: 47%;
    /* border-radius: 10px; */
    color: #424141;
    line-height: 1.5rem;
    height: 100px;
}

.sgiaodich img {
    width: 120px;
    height: 100px;
    float: left;
    margin-right: 10px;
}

.giatien {
    color: #f17878;
}

.luotxem {}

.sgiaodich h3 {
    font-weight: 600;
    color: #56270c;
    font-size: 16px;
    text-transform: initial;
    margin: 0.5rem 0 0.5rem 0;
    line-height: 1.5rem;
}

.sp-right {

    min-height: 200px;
    border: thin #e6e6e6 solid;
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 10px;
}

span .sp-chiase {
    background: #92d108;
    color: white;
    border-radius: 5px;
    padding: 5px 5px;
    font-size: 11px;
    margin: 0.5rem 0 0.5rem 0;
    display: inline-block;
}

.sp-right hr {
    margin: 0.5rem 0 0.5rem 0;
}

.sp-title {
    font-size: 17px;
    text-transform: uppercase;
    display: block;
    color: orange;
    font-weight: bold;
    margin: 0.5rem 0 0.5rem 0;
    text-align: center;
}

.pbox2 {
    margin-bottom: 10px;
}

.pbox2 .pbox2-title {
    float: left;
    width: 77%;
    color: black;
    line-height: 1.5rem;
}

.pbox2 .pbox2-title b {

    color: red;
}

.pbox2 .pbox2-img {
    float: right;
    width: 20%;
    border: thin #e2e2e2 solid;
    padding: 1%;
    border-radius: 5px;
}

.pbox2 .pbox2-img img {
    width: 98%;
    height: 98%;
}

.l-head {
    text-transform: uppercase;
    padding: 10px 0px 10px 10px;
    color: #56270c;
    font-weight: bold;
    /* font-size: 19px; */
    border-bottom: 3px #0027b5 double;
    background: #f46f20;
}

ul.menuh {
    padding: 0px;
    margin: 0.5rem 0 0.5rem 0;
}

ul.menuh li {
    position: relative;
    list-style: none;
    background: #efefef;
    padding: 10px 10px 10px 15px;
    margin: 0.5rem 0 0.5rem 0;
    transition: width 0.3s;
    /* width: 220px; */
    cursor: pointer;
    border-bottom: 1px solid #f7f6f6;

}

ul.menuh>li:hover {
    background: yellow;
    color: white;
}

ul.menuh>li:hover>a {
    color: white;
}

ul.menuh>li>a {
    color: #444;
    /* font-weight: bold; */
    font-size: 15px;
}

ul.menuh>li>ul>li>a {
    color: #444;
}

ul.menuh li.danghien>a {
    color: #fff;
}

ul.menuh li ul {
    display: none;
}

ul.menuh li:hover ul {
    display: block;
    position: absolute;
    top: 0px;
    left: 272px;
    width: 197px;
    z-index: 9999;
    background: #efefef;
    border: #ffffff double 3px;
    padding: 0;

}

ul.menuh li ul li {
    background: #efefef;
    /* margin-left: 0px; */
}

ul.menuh li ul li:hover {
    background: #f46f20;
    color: white;
}

ul.menuh li ul li:hover a {
    color: white;
}

/*================================*/
.index-headkey {
    text-align: center;
    font-size: 18px;
    border-bottom: thin green solid;
    padding: 1%;
    margin: 0.5rem 0 0.5rem 0;
    width: 98%;
    font-weight: 600;
    color: navy;
}

.index-keyinfo {
    margin: 0.5rem 0 0.5rem 0;
    font-size: 16px;
    color: #4d4d4d;
    text-align: center;
}

.index-tinhbox {
    float: left;
    width: 32%;
    margin: 0.5%;
}

.index-tinhbox .index-tinhbox-head {
    background: darkorange;
    color: white;
    text-align: center;
    font-size: 20px;
    padding: 10px 0px;
}

.index-tinhbox .index-tinhbox-content {
    border: thin #e9e6e6 solid;
    padding: 10px;
    min-height: 380px;
}

a.intex-tinhbox-a {
    display: block;
    width: 50%;
    float: left;
    margin: 0px 0px 10px 0px;
}

.mienbac {
    margin-left: 1%;
}

a.intex-tinhboxc-a {
    display: block;
    width: 33%;
    float: left;
    margin: 0.5rem 0 0.5rem 0;
}

.txtdangky {
    padding: 1%;
    border-radius: 5px;
    border: thin solid #d7d7d7;
    width: 200px;
    margin: 0.5rem 0 0.5rem 0;
}

.txtnoidung {
    padding: 1%;
    border-radius: 5px;
    border: thin solid #d7d7d7;
    /* width: 200px; */
    margin: 0.5rem 0 0.5rem 0;
    height: 80px;
    width: 95%;
}

.btndat {
    margin: 0.5rem 0 0.5rem 0;
    color: white;
    padding: 1%;
    border: none;
    background: Purple;
    border-radius: 5px;
    transition: 0.2s;
}

.btnlamlai {
    margin: 0.5rem 0 0.5rem 0;
    color: white;
    padding: 1%;
    border: none;
    background: gray;
    border-radius: 5px;
    transition: 0.2s;
}

.btndat:hover {
    background: orange;
}


h1,
.h1 {
    font-size: 20px;
}

h2,
.h2 {
    font-size: 18px;
}

h3,
.h3 {
    font-size: 16px;
}

h4,
.h4 {
    font-size: 14px;
}

h5,
.h5 {
    font-size: 12px;
}

h6,
.h6 {
    font-size: 10px;
}

< !-- mục lục -->

/* Table of content */
html {
    scroll-behavior: smooth;
}

.widget-toc {
    display: block;
    overflow: hidden;
    border: 1px solid #1F2125;
    background-color: #ffffff;
    width: 100%;
    margin: 30px 0 20px 0;
    font-size: 95%;
    border-radius: 3px;
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
}

.widget-toc>ol {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 40px;
    background-color: papayawhip;
    position: relative;
    display: none;
    border-radius: 3px;
    max-height: 300px;
    overflow: auto;
}

.widget-toc>ol>li:not(:last-child) {
    margin-bottom: 20px;
}

.widget-toc>ol>li>a {
    color: #1F2125;
    font-weight: 700;
    font-size: 16px;
}

.widget-toc>ol>li>ol,
.widget-toc>ol>li>ol ol {
    padding-left: 15px;
}

.widget-toc>ol>li>ol>li>a,
.widget-toc a {
    /* color: #1F2125; */
    transition: 0.3s;
}

.widget-toc>ol>li>ol>li>ol a {
    font-size: 12px;
}

.widget-toc a:hover {
    /* color: #F39F2D; */
}

.widget-toc.open {
    height: auto;
}

.widget-toc ol li {
    display: block;
    position: relative;
}

.toc-title {
    text-align: center;
    font-weight: 700;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.toc-title .toc_title_inside {
    text-align: left;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 20px 0 50px;
    font-size: 13px;
    position: relative;
    background-color: #eee;
    color: #1F2125;
}

.toc-title .toc_title_inside.toc_close,
.widget-toc.sticky.open .toc-title .toc_title_inside,
.widget-toc.sticky .toc-title .toc_title_inside.toc_close {
    display: none;
}

.widget-toc.sticky.open .toc-title .toc_title_inside.toc_close {
    display: flex;
}

.toc-title .toc_title_inside::before {
    content: "";
    position: absolute;
    background-image: url(table_of_content_icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin-bottom: 5px;
    width: 20px;
    height: 20px;
    left: 20px;
}

.toc-title .toc_title_inside.toc_close::before {
    background-image: url(x.svg);
}

.toc-title .toc_title_inside::after {
    content: "";
    position: absolute;
    background-image: url(arrow_down.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 14px;
    height: 7px;
    right: 20px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.widget-toc.open .toc-title .toc_title_inside::after {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.widget-toc.sticky {
    position: fixed;
    top: 25px;
    left: 100px;
    width: 560px;
    max-height: 546px;
    background-color: transparent;
    padding: 0;
    border: 0;
    overflow: unset;
    margin: 0;
    z-index: 1;
    -webkit-transition: unset;
    -moz-transition: unset;
    -ms-transition: unset;
    -o-transition: unset;
    transition: unset;
}

.widget-toc.sticky.force_none {
    height: 0 !important;
}

.widget-toc.sticky.open {
    background-color: #ffffff;
}

.widget-toc.sticky.open::before {
    content: "";
    background-color: rgb(0 0 0 / 50%);
    position: fixed;
    height: 100vh;
    width: 100vw;
    top: 0;
    left: 0;
}

.widget-toc.sticky .toc-title {
    position: absolute;
    height: 70px;
    width: 70px;
    left: -80px;
    box-shadow: 1px 1px 1px #b2b1b1;
}

.widget-toc.sticky .toc-title .toc_title_inside {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    height: 70px;
    width: 70px;
    background-color: #80008099;
    border-radius: 3px;
}

.widget-toc.sticky .toc-title .toc_title_inside::after {
    display: none;
}

.widget-toc.sticky .toc-title .toc_title_inside::before {
    position: relative;
    left: unset;
}

@media only screen and (max-width: 1300px) {
    .widget-toc.sticky {
        left: 20%;
    }
}

@media only screen and (max-width: 1024px) {
    .widget-toc.sticky {
        left: 100px;
    }
}

@media only screen and (max-width: 480px) {
    .widget-toc.sticky {
        left: 15px;
        width: calc(100% - 30px);
        top: 100px;
    }

    .widget-toc.sticky .toc-title {
        left: 0px;
        top: -80px;
    }
}

< !-- hết mục lục -->

/*================================*/
.phonering-alo-phone.phonering-alo-static {
    opacity: .6
}

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

.phonering-alo-ph-circle {
    width: 160px;
    height: 160px;
    top: 20px;
    left: 20px;
    position: absolute;
    background-color: transparent;
    border-radius: 100% !important;
    border: 2px solid rgba(30, 30, 30, 0.4);
    border: 2px solid #bfebfc 9;
    opacity: .1;
    -webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
    animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

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

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

.phonering-alo-phone.phonering-alo-hover .phonering-alo-ph-circle,
.phonering-alo-phone:hover .phonering-alo-ph-circle {
    border-color: #00aff2;
    opacity: .5
}

.phonering-alo-phone.phonering-alo-green.phonering-alo-hover .phonering-alo-ph-circle,
.phonering-alo-phone.phonering-alo-green:hover .phonering-alo-ph-circle {
    border-color: #75eb50;
    border-color: #baf5a7;
    opacity: .5
}

.phonering-alo-phone.phonering-alo-green .phonering-alo-ph-circle {
    border-color: #00aff2;
    border-color: #bfebfc;
    opacity: .5
}

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

.phonering-alo-phone.phonering-alo-gray .phonering-alo-ph-circle {
    border-color: #75eb50;
    opacity: .5
}

.phonering-alo-ph-circle-fill {
    width: 100px;
    height: 100px;
    top: 50px;
    left: 50px;
    position: absolute;
    background-color: #000;
    border-radius: 100% !important;
    border: 2px solid transparent;
    -webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
    animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

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

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

.phonering-alo-phone.phonering-alo-hover .phonering-alo-ph-circle-fill,
.phonering-alo-phone:hover .phonering-alo-ph-circle-fill {
    background-color: rgba(0, 175, 242, 0.5);
    background-color: #00aff2 9;
    opacity: .75 !important
}

.phonering-alo-phone.phonering-alo-green.phonering-alo-hover .phonering-alo-ph-circle-fill,
.phonering-alo-phone.phonering-alo-green:hover .phonering-alo-ph-circle-fill {
    background-color: rgba(117, 235, 80, 0.5);
    background-color: #baf5a7 9;
    opacity: .75 !important
}

.phonering-alo-phone.phonering-alo-green .phonering-alo-ph-circle-fill {
    background-color: rgba(0, 175, 242, 0.5);
    background-color: #a6e3fa 9
}

.phonering-alo-phone.phonering-alo-gray.phonering-alo-hover .phonering-alo-ph-circle-fill,
.phonering-alo-phone.phonering-alo-gray:hover .phonering-alo-ph-circle-fill {
    background-color: rgba(204, 204, 204, 0.5);
    background-color: #ccc 9;
    opacity: .75 !important
}

.phonering-alo-phone.phonering-alo-gray .phonering-alo-ph-circle-fill {
    background-color: rgba(117, 235, 80, 0.5);
    opacity: .75 !important
}

.phonering-alo-ph-img-circle {
    width: 60px;
    height: 60px;
    top: 70px;
    left: 70px;
    position: absolute;
    background: rgba(30, 30, 30, 0.1) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABNmlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjarY6xSsNQFEDPi6LiUCsEcXB4kygotupgxqQtRRCs1SHJ1qShSmkSXl7VfoSjWwcXd7/AyVFwUPwC/0Bx6uAQIYODCJ7p3MPlcsGo2HWnYZRhEGvVbjrS9Xw5+8QMUwDQCbPUbrUOAOIkjvjB5ysC4HnTrjsN/sZ8mCoNTIDtbpSFICpA/0KnGsQYMIN+qkHcAaY6addAPAClXu4vQCnI/Q0oKdfzQXwAZs/1fDDmADPIfQUwdXSpAWpJOlJnvVMtq5ZlSbubBJE8HmU6GmRyPw4TlSaqo6MukP8HwGK+2G46cq1qWXvr/DOu58vc3o8QgFh6LFpBOFTn3yqMnd/n4sZ4GQ5vYXpStN0ruNmAheuirVahvAX34y/Axk/96FpPYgAAACBjSFJNAAB6JQAAgIMAAPn/AACA6AAAUggAARVYAAA6lwAAF2/XWh+QAAAB/ElEQVR42uya7W3CMBCG31QM4A1aNggTlG6QbpBMkHYC1AloJ4BOABuEDcgGtBOETnD9c1ERCH/lwxeaV8oPFGP86Hy+DxMREW5Bd7gRjSDSNGn4/RiAOvm8C0ZCRD5PSkQVXSr1nK/xE3mcWimA1ZV3JYBZCIO4giQANoYxMwYS6+xKY4lT5dJPreWZY+uspqSCKPYN27GJVBDXheVSQe494ksiEWTuMXcu1dld9SARxDX1OAJ4lgjy4zDnFsC076A4adEiRwAZg4hOUSpNoCsBPDGM+HqkNGynYBCuILuWj+dgWysGsNe8nwL4GsrW0m2fxZBq9rW0rNcX5MOQ9eZD8JFahcG5g/iKT671alGAYQggpYWvpEPYWrU/HDTOfeRIX0q2SL3QN4tGhZJukVobQyXYWw7WtLDKDIuM+ZSzscyCE9PCy5IttCvnZNaeiGLNHKuz8ZVh/MXTVu/1xQKmIqLEAuJ0fNo3iG5B51oSkeKnsBi/4bG9gYB/lCytU5G9DryFW+3Gm+JLwU7ehbJrwTjq4DJU8bHcVbEV9dXXqqP6uqO5e2/QZRYJpqu2IUAA4B3tXvx8hgKp05QZW6dJqrLTNkB6vrRURLRwPHqtYgkC3cLWQAcDQGGKH13FER/NATzi786+BPDNjm1dMkfjn2pGkBHkf4D8DgBJDuDHx9BN+gAAAABJRU5ErkJggg==) no-repeat center center;
    border-radius: 100% !important;
    border: 2px solid transparent;
    -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
    animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

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

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

.phonering-alo-phone.phonering-alo-hover .phonering-alo-ph-img-circle,
.phonering-alo-phone:hover .phonering-alo-ph-img-circle {
    background-color: #00aff2
}

.phonering-alo-phone.phonering-alo-green.phonering-alo-hover .phonering-alo-ph-img-circle,
.phonering-alo-phone.phonering-alo-green:hover .phonering-alo-ph-img-circle {
    background-color: #75eb50;
    background-color: #75eb50 9
}

.phonering-alo-phone.phonering-alo-green .phonering-alo-ph-img-circle {
    background-color: #00aff2;
    background-color: #00aff2 9
}

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

.phonering-alo-phone.phonering-alo-gray .phonering-alo-ph-img-circle {
    background-color: #75eb50
}

@-webkit-keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform: rotate(0) scale(.5) skew(1deg);
        -webkit-opacity: .1
    }

    30% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        -webkit-opacity: .5
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        -webkit-opacity: .1
    }
}

@-webkit-keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }

    100% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-webkit-keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@-webkit-keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform: rotate(0) scale(.5) skew(1deg);
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }

    30% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform: rotate(0) scale(.5) skew(1deg);
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }

    30% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-webkit-keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }

    100% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }

    100% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-webkit-keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) 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(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg)
    }
}

@keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) 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(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        transform: rotate(0) scale(1) skew(1deg)
    }
}

@media screen and (min-width : 990px) {
    #middle {
        float: left;
        margin-right: 0%;
        width: 77%;
        overflow: hidden;
    }

    #left {
        float: right;
        width: 22%;
    }

    .sp-left {
        width: 73%;
        float: left;

    }

    .hidden-maytinh {
        display: none;
    }

    .sp1-right {
        width: 24%;
        float: right;
        margin-left: 1%;
    }

    .sp2-right {
        width: 24%;
        float: left;
        margin: 0.5rem 0 0.5rem 0;
        margin-right: 1%;

    }

    .box22 {
        width: 23%;
    }
}

@media screen and (max-width: 960px) {
    body {}

    #logo {
        margin-top: 0.3%
    }

    #logo {
        float: left;
        width: 200px;
        margin-left: 0px
    }

    #logo-right {
        margin-top: 0.3%
    }

    #search {
        width: 60%;
        float: right;
        margin: 0.5rem 0 0.5rem 0
    }

    #newsletter {
        width: 60%;
        float: right;
        margin: 0.5rem 0 0.5rem 0
    }

    .hotline-right {
        width: 100%;
        float: none;
    }

    #head-bg {
        /*background:url(../images/head-bg-rp.png);*/
        padding: 5px 0
    }

    #header {
        height: auto;
        overflow: hidden;
        text-align: center;
        padding: 5px;
    }

    #pagewrap {
        width: 100%;
    }

    .tieude {
        display: none;
    }

    #right {
        clear: both;
        padding: 1% 1%;
        width: auto;
        float: none;
    }




    /*menu*/
    #topmenu {
        width: 100%;
        margin-top: 0px;
    }

    .toggleMenu {
        height: 35px;
    }

    .active {
        display: block;
    }

    .nav-menu {}

    .nav-menu>li {
        float: none;
        border-bottom: 1px solid #FFF
    }

    .nav-menu>li>.parent {
        background-position: 95% 50%;
    }

    .nav-menu li li .parent {
        background-image: url(../images/downArrow.png);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }

    .nav-menu ul {
        display: block;
        width: 100%;
    }

    .nav-menu>li.hover>ul,
    .nav-menu li li.hover ul {
        position: static;
    }

    .nav-menu li li a {
        padding: 1%;
    }

    .nav-menu li li li a {
        padding: 1%;
    }

    .nav-content {
        width: 32%;
        float: left;
        margin: 0.5rem 0 0.5rem 0;
    }

    .article-box {
        width: 90%
    }

    .article-title {
        width: 80%;
        margin-top: 15px
    }

    .customer-name {
        width: 900%;
        text-align: left
    }

    .news-title {
        width: 90%;
        background: url(../images/bullet_sub.png) no-repeat 0.5% 6px;
    }

    .link {
        width: 100%;
        text-align: center
    }

    input[type=submit] {
        width: 100%;
        padding: 6px;
        font-size: 17px
    }

    .support {
        width: 97%
    }

    .button {
        width: 95%;
    }

    .product_box {
        /*min-height:330px;*/
    }

    .product_img {
        margin-top: 13px;
    }

    .product_img img {
        width: 90%;
    }

    .album_box {
        height: auto;
        width: 32.2%;
    }

    .album_img {
        margin-top: 13px;
    }

    .album_img img {
        width: 90%;
        height: auto;
    }

    .nav-title-hiden {
        display: none
    }

    .leftmenu-static {
        width: 100%;
        border: none;
        margin: 0.5rem 0 0.5rem 0;
    }

    .title-cate {
        display: none
    }

    #topbg {
        border-top: 1px solid #d8d7d7
    }

    #topcenter-bg {
        height: 25px;
    }

    #topGuide {
        visibility: hidden;
        width: 0%
    }

    #topleft-bg {
        display: none
    }

    #topcenter-bg {
        background: #F3F3F3;
    }

    #topCart {
        border: none
    }

    #topReg {
        width: 100%;
        text-align: center
    }

    #topReg ul li {
        float: left;
    }

    #topReg ul li a {
        font-size: 12px;
    }

    #topright-bg {
        background: none
    }

    #topright-bg-center {
        background: none;
        color: #5A9505;
        text-indent: 1%;
        width: 100%;
        font-size: 12px;
        text-align: right
    }

    #topright-bg-left {
        display: none
    }

    #topright-bg-right {
        display: none
    }

    .small-product {
        width: 100%
    }

    .small-prd-box {
        width: 100%
    }

    .small-prd-des {
        width: 96%;
    }

    .outer-general {
        width: 95%;
    }

    .footer-add {
        width: 99%;
        padding: 10px 0
    }

    .footer-content {
        width: auto;
        margin-bottom: 10px;
        float: none;
        clear: both;
        border-top: 1px solid #CCC;
        margin-left: 0
    }

    .nav-title {
        width: 100%;
    }
}

@media screen and (max-width: 960px) {
    .nav-content {
        width: 48%;
        float: left;
        margin: 0.5rem 0 0.5rem 0;
    }

    .article-title {
        width: 80%;
    }

    .advertise {
        width: 48%;
        float: left;
        margin: 0.5rem 0 0.5rem 0;
    }

    .hotro {
        display: block;
    }

    #footer-bottom {
        padding-bottom: 56px;
    }

    .anhienmenu {
        display: block;
    }

    #middle {
        overflow: hidden;
    }

    #left {
        overflow: hidden;
    }

    .product-desc {
        height: auto;
    }

    #gioithieutrangchu {
        width: 100%;
        float: inherit;
    }

    #doitac {
        width: 100%;
        float: inherit;
        min-height: 100px;
        background: lime;
        margin: 0.5rem 0 0.5rem 0;
    }

    .txtdangky {
        padding: 1%;
        border-radius: 5px;
        border: thin solid #d7d7d7;
        width: 96%;
        margin: 0.5rem 0 0.5rem 0;
    }

    .txtnoidung {
        padding: 1%;
        border-radius: 5px;
        border: thin solid #d7d7d7;
        /* width: 200px; */
        margin: 0.5rem 0 0.5rem 0;
        height: 80px;
        width: 96%;
    }

    .tinttuc {
        float: inherit;
        margin: 0.5rem 0 0.5rem 0;
        margin-top: 0px;
        margin-bottom: 10px;
        border-radius: 10px;
        color: #424141;
        line-height: 1.5rem;
        height: auto;
        width: 96%;
    }

    .tinttuc img {
        width: 25%;
    }

    .sgiaodich {
        float: inherit;
        margin: 0.5rem 0 0.5rem 0;
        margin-top: 0px;
        margin-bottom: 10px;
        border-radius: 10px;
        color: #424141;
        line-height: 1.5rem;
        height: auto;
        width: 96%;
    }

    .footer-add {
        width: auto;
        margin-bottom: 10px;
    }

    .line {
        display: none
    }

    .line2 {
        display: block
    }

    #icon-box {
        float: left
    }

    #topright-bg span {
        display: none;
        width: 0px
    }

    #topright-bg {
        width: 22%;
        float: right
    }

    .product_box,
    .album_box {
        width: 48%;
        /*min-height:375px;*/
    }

    #logo {
        width: 100%;
        /* margin: 0.25rem 0 0.75rem; */
        text-align: center;
    }

    #logo-right {
        display: none
    }

    #logo-right-static {
        width: 30%;
        display: block;
        float: right;
        margin-top: 3px;
        margin-right: 0;
        margin-bottom: 2%;
        text-align: center;
    }

    #search,
    #newsletter,
    .hotline-right {
        width: auto;
        float: none;
        clear: both;
        margin: 0.5rem 0 0.5rem 0;
        padding: 0;
    }

    .hotline-right .form-control {
        width: 100% !important;
    }

    .xuhuong {
        display: none
    }

    #search-box {
        width: 86%;
        float: left;
    }

    #newsletter-box {
        width: 69%;
        float: left;
    }


    .small-prd-des {
        width: 75%;
    }

    #ft-copyright {
        width: 220px;
        font-size: 11px;
    }

    #icon-box {
        width: 80px;
        float: right
    }

    #head-bg {}

    #top li {
        display: ; /*tên công ty*/
    }

    #dt-img-box {
        width: auto;
        float: none
    }

    #dt-desc-box {
        width: auto;
        float: none;
        margin-top: 8px;
        margin-left: 0;
        padding-bottom: 5px
    }

    /*================================*/
    .index-headkey {
        width: 96%;
        font-size: 18px;
        margin: 0.5rem 0 0.5rem 0;
    }

    .index-keyinfo {}

    .index-tinhbox {
        width: 100%;
        float: none;
        margin: 0.5rem 0 0.5rem 0;
    }

    .mienbac {
        margin-left: 0;
    }

    .index-tinhbox .index-tinhbox-head {}

    .index-tinhbox .index-tinhbox-content {}

    .index-tinhbox .index-tinhbox-content a.intex-tinhbox-a {}

    a.intex-tinhboxc-a {
        display: block;
        width: 50%;
        float: left;
        margin: 0.5rem 0 0.5rem 0;
    }

    /*=========================*/
}


/* for 480px or less - one column */
@media screen and (max-width: 480px) {
    .small-prd-des {
        width: 56%;
    }

    h1 {
        font-size: 20px;
    }

    .nav-content {
        width: 96%;
    }

    .article-title {
        width: 73%;
        margin-top: 4px;
    }

    .static-title,
    .advertise,
    #article-box,
    #promotion-box {
        display: none
    }

    #footer span {
        font-size: 14px
    }

    #footer {
        text-align: left
    }

    .product_box,
    .album_box {
        width: 46.5%;
        /* min-height:303px; */
    }

    .product_old-price,
    .product_new-price {
        width: auto;
        float: none
    }

    #topcenter-bg {
        width: 66%;
    }

    /*#topReg span{display:none}*/
    #topCart {
        padding: 0px 5px 0 0;
        margin-top: 4px
    }

    #topLang {
        margin-top: 4px
    }

    #topright-bg {
        width: 32%;
        float: right;
        line-height: 1.5rem;
    }

    #ft-copyright {
        float: none;
        text-align: center;
        width: 100%
    }

    #icon-box {
        width: auto;
        float: none;
        overflow: hidden;
        padding-left: 40%
    }

}

@media screen and (max-width: 400px) {}

/* for 350px or less (320 x 480(iPhone <= 4S)) */
@media screen and (max-width: 350px) {

    .article-title {
        width: 70%;
        margin-top: 2px;
    }

    .link {
        float: none;
        width: 100%;
    }

    .advertise {
        width: 98%;
    }

    .toggleMenu {
        background: url(../images/menu-s.png) no-repeat 2% center;
    }

    .static-title,
    .advertise,
    #article-box,
    #promotion-box,
    #customer-box,
    #customer-title {
        display: none
    }

    .product_box,
    .album_box {
        width: 99%;
        /* min-height:370px;*/
    }

    .product_box a .informations p,
    .product_box a .informations label {
        width: 95.9%;
    }

    .album_box {
        width: 100%;
    }

    .album_detail,
    .album_title {
        font-size: 16px
    }

    .responsive-image-news {
        position: relative;
        list-style: none;
        overflow: hidden;
        width: 50%;
    }

    .responsive-image-news img {
        display: block;
        height: auto;
        float: none;
        width: 50%;
        border: 0;
    }

    .tintuc-title {
        margin-left: 50%
    }

    .product_old-price {
        float: left;
    }

    .product_new-price {
        float: right
    }

    #newslt-button a {
        padding: 6px;
    }
}

/* for 300px or less (240 x 320(small phone))*/
@media screen and (max-width: 300px) {
    .toggleMenu {
        height: 25px;
    }
}

#phantrang {
    text-align: center;
    margin-top: 15px;
}

#phantrang a {
    padding: 5px 10px 5px 10px;
    border: thin silver solid;
    margin: 0.5rem 0 0.5rem 0;
    display: inline-block;
}

#phantrang a:hover {
    padding: 1%;
    border: thin silver solid;
    margin: 0.5rem 0 0.5rem 0;
    background: #f46f20;
    color: green;
}

#dangxem {
    background: #f46f20;
    color: white;
}

.datmua {
    background: #FC9300;
    border: none;
    color: white;
    padding: 3px 15px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-block;
    margin: 0.5rem 0 0.5rem 0;
}

.datmua:hover {
    background: #000;
}

.timkiem-textbox {
    border: 1px solid #DAD8D8;
    height: 18px;
    line-height: 1.5rem;
    margin-top: 1px;
}

.timkiem-text {
    float: left;
    width: 600px;
    max-width: 100%;
}

.timkiem-button {
    float: left;
    overflow: hidden;
    margin: 0.5rem 0 0.5rem 0;
    cursor: pointer;
}

#timkiem {
    border: thin solid silver;
    padding: 20px;
    margin: 0.5rem 0 0.5rem 0;
}

.giohanghead {
    background: #67B63E;
    color: #fff;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    height: 35px;
}

#left,
#middle,
#right,
#banner,
#domain-check,
#hotline,
.nav-content,
.advertise {
    margin-bottom: 5px;
}

#right {
    border: solid 1px #f6f6f6;
}

#toTop {
    display: none;
    text-decoration: none;
    position: fixed;
    bottom: 70px;
    right: 15px;
    overflow: hidden;
    width: 51px;
    height: 51px;
    border: none;
    text-indent: 100%;
    background: url(../images/ui.totop.png) no-repeat left top;
    z-index: 100
}

#toTopHover {
    background: url(../images/ui.totop.png) no-repeat left -51px;
    width: 51px;
    height: 51px;
    display: block;
    overflow: hidden;
    float: left;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
}

#toTop:active,
#toTop:focus {
    outline: none;
}

.khuyenmai {
    width: 36px;
    height: 36px;
    line-height: 1.5rem;
    text-align: center;
    z-index: 99;
    position: absolute;
    top: 86px;
    font-size: 15px;
    left: 0;
    background: url(../images/icon-pro.png) no-repeat top right;
    color: #FFF;
    letter-spacing: 0px;
}

.timdonhang {
    display: inline-block;
}

#os-search-box-test {
    border-radius: 5px;
    padding: 10px;
    box-shadow: 3px 3px 3px #ccc;
    background: #E55123;
    color: white;
}

#os-search-box-test h5 {
    text-align: center;
    color: #fff;
    margin-bottom: 12px;
}

#os-search-box-test label {
    color: #fff;
    font-weight: normal;
}

#os-search-box-test p {
    margin: 0.5rem 0 0.5rem 0;
    color: #fff;
}

#ketquadonhang {
    margin: 0.5rem 0 0.5rem 0;
}


table.bangtin th {
    background-color: #3399FF;
    color: white;
    font-weight: bold;
    text-align: center;
    padding: 5px;
}

.baoloi {
    padding: 20px;
    margin: 0.5rem 0 0.5rem 0;
    border: thin orange dotted;
    color: #0080FF;
}

.baoloi h2 {
    color: #000;
    font-size: 18px;
    margin: 0.5rem 0 0.5rem 0;
}

span1 {
    color: red;
}

.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget span iframe[style] {
    width: 100% !important;
}

.spmoi {
    width: 44px;
    height: 44px;
    line-height: 1.5rem;
    z-index: 1;
    position: absolute;
    top: -3px;
    left: 1px;
    background: url(../images/icon-new.png) no-repeat top right;
}




ul[data-liffect="zoomOut"] li {
    opacity: 0;
    position: relative;
    -webkit-animation: zoomOut 400ms ease both;
    -webkit-animation-play-state: paused;
    -moz-animation: zoomOut 400ms ease both;
    -moz-animation-play-state: paused;
    -o-animation: zoomOut 400ms ease both;
    -o-animation-play-state: paused;
    animation: zoomOut 400ms ease both;
    animation-play-state: paused;
}

ul[data-liffect="zoomOut"].play li {
    -webkit-animation-play-state: running;
    -moz-animation-play-state: running;
    -o-animation-play-state: running;
    animation-play-state: running;
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 0;
        -webkit-transform: scale(.6);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes zoomOut {
    0% {
        opacity: 0;
        -moz-transform: scale(.6);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
    }
}

@-o-keyframes zoomOut {
    0% {
        opacity: 0;
        -o-transform: scale(.6);
    }

    100% {
        opacity: 1;
        -o-transform: scale(1);
    }
}

@keyframes zoomOut {
    0% {
        opacity: 0;
        transform: scale(.6);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}