@charset "utf-8";
/* CSS Document */
/*@import url(http://fonts.googleapis.com/css?family=Open+Sans);*/
body {font-family: arial, tahome;
    color: #333;
    font-size: 13px;
    margin: 0;
    line-height: 22px;
}
.clear { clear: both }
a { text-decoration: none; color: #216df9; }
.upper { text-transform:none }
img{border:none}
/* STRUCTURE */
#pagewrap { 
    width: 1200px;
    max-width: 99%;
    margin: 10px auto 0px;
    background: rgba(255, 255, 255, 0.82);
   }
   .hotro{
    display: none;
    position: fixed;
    bottom: 0px;
    left: 0px;
    background: black;
    width: 100%;
    text-align: center;
    border-top: 1px white solid;
}
.hotro a{
    color: white;
}
.hotro img{
    max-height: 50px;
}
.hotro .hotro-phone{
    float: left;
    width: 25%;
    background: #cf1515;
    padding: 5px 0px;
}
.hotro .hotro-facebook{
    float: left;
    width: 25%;
    background: #074b91;
    padding: 5px 0px;
}
.hotro .hotro-zalo{
    float: left;
    width: 25%;
    background: #04b2f4;
    padding: 5px 0px;
}
.hotro .hotro-dangky{
    float: left;
    width: 25%;
    background: #ff623f;
    padding: 5px 0px;
}
#pagewrap:after { content: ""; display: table; clear: both; }
#middle:after { content: ""; display: table; clear: both; }
#header {  padding: 0 0px; }
#logo{    float: left;
    width: 22%;
    /* margin-top: 1%; 
    max-height: 100px;
    overflow: hidden;*/
    margin: 5px 0px;
 }
#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:26px; }
/* user menu settings */
/* user menu settings */
#dropdown { display: block; padding: 0px; width: 100%; margin: 0 auto; 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 { clear: both;
    padding: 15px 0;
   background: #216df9;
    color: #fff;
    border-bottom: 1px solid #999;  }
#footer a{color: #fff;}

.outer-general { 
    width: 1200px;
    max-width: 99%;
    margin: 0px auto;}
.outer-general:after { content: ""; display: table; clear: both; }
.footer-add{  width: 40%;float:left; color: #fdfbfa; padding-right:5px; }
.footer-content {  width: 16%; float:left; margin-left:10px; padding-top:10px; color:#ccc }
.footer-content ul{margin:0; padding:0}
.footer-content ul li{ list-style-image:url(../images/bullet_sub2.gif); list-style-position:inside ; color: #fdfbfa;padding:5px 0;}
.footer-content ul li a{color: #fdfbfa; text-decoration:none; }

.facebookft {
    width: 25%;
}
.clear{
    clear: both;
}
.r-head{
    font-size: 15px;
    font-weight: bold;
}
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: #b13d14;
    border: none;
    color: white;
    padding: 3px 25px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    display: block;
    /* margin: 1px; */
    margin: auto;
    width: 60px;
    text-align: center;
}
.datmua2:hover{
    background: #000;
}
#footer-bottom{  width: 100%; 
background:black;
 color:#FFF; overflow:hidden;padding-bottom:5px}
#icon-box{width:100px; float:right; margin-top:3px}
.icon{width:22px; height:21px; float:left; margin:5px}
#ft-copyright{width:70%; float:left;margin-top:10px; color:#fff;}
#ft-copyright a{text-decoration:none; color:#f8d222}


.responsive-image{
        position: relative;
    list-style: none;
    overflow: hidden;
    max-width: 99%;
    padding: 0;
    margin: 11px auto 10px;
    max-height: 100px;
}
.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: 0px 2% 10px 0px;
}
#doitac{
    width: 48%;
    float: left;
    min-height: 100px;
    margin: 0px 2% 10px 0px;
}
/*new css*/
.leftmenu, .advertise, .nav-content, #news-box, #article-box, #promotion-box, #customer-box { width: 100%; }
.nav-title {
    height: auto;
    padding: 5px 0 5px 0px;
    font-weight: bold;
    border-bottom: 1px solid #216df9;
    border-top: 1px solid #216df9;
    clear: both;
    /* text-indent: 5px; */
    margin: 10px 0px;
    /* border-bottom: none; */
    font-size: 20px;
    color: #216df9;
    text-align: center;
    text-transform: uppercase;
 }
.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:4px }
.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; padding: 0 }
.leftmenu ul li { list-style: none; background:url(../images/nav.png) no-repeat; margin:1px 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: 7px auto; 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: 5px 0 5px 5px; overflow: hidden; text-align:center }

.article-box { width: 200px; overflow: hidden; margin: 5px 0 5px 3px }
.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: 0px 0 5px 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: #216df9;
    padding: 2px 0px 2px 0px;
}
.tieude{
    float: left;
    background: #76ac00;
    color: white;
    padding: 10px 0px 10px 0px;
    width: 254px;
    margin: 0px 10px 0px 0px;
   /* 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: 1200px;
    max-width: 99%;
    margin: auto;
}
.nav-menu:before, .nav-menu:after { content: " "; display: table; }
.nav-menu:after { clear: both; }
.nav-menu ul { list-style: none; width: 19em; margin: 0px; }
.nav-menu a {
    padding: 10px 25px;
    color: #ffffff;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 13px;
    /* text-shadow: 1px 1px 1px #0e0d0d; */
}
.txttimkiem{
    padding: 9px 10px 9px 10px;
    float: left;
    border: none;
    width: 380px;
    color: #ff810a;
    max-width: 70%;
    border: #070101 thin solid;
    border-radius: 0px;
}
.tc-danhmuc {
    float: left;
    width: 24%;
    margin: 5px 1% 10px 0px;
}
.tc-danhmuc .tc-img{
    border: thin solid #216df9;
    transition: 0.2s;
}
.tc-danhmuc .tc-img img {
    width: 100%;
    height: 220px
}
.tc-danhmuc .tc-head{
    background: #216df9;
    padding: 10px;
    color: white;
    text-transform: uppercase;
    font-weight: 600;
    transition: 0.2s;
}
.tc-danhmuc:hover .tc-head {
    background: #a3c3ff;
}
.tc-danhmuc:hover .tc-img {
    border: thin solid #A3A4A8;
}
.tc-danhmuc .tc-head img{
    float: right;
}
.txtnuttim{
    padding: 10px 8px;
    float: left;
    background: #070101;
    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;
    border-left: 1px solid #2f76f8;
    border-right: 1px solid #0c5aea;
}
.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: 0px;
    padding: 0px;
    display: none;
     }
    .nav-menu li ul ul { display: none; }
    .nav-menu > li:hover{
        background: #2f76f8;
    }
.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:#A3A4A8;
    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: #A3A4A8; z-index: 200; border-top: 1px solid #fff; }
.nav-menu li li a:hover { background: #216df9;/**/ }
#topReg span{color:#fff;}

#search{width: 48%; overflow: hidden;  float:left; border:1px solid #CDCDCD; border-radius:3px; height:26px;  padding:0;margin: 9px 0 0 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; padding:0}
.xuhuong ul li{list-style:none; float:left; margin:5px 10px 0 0; }
.xuhuong ul li a{text-decoration:none; color:#666; }

.hotline-right{   
    overflow: hidden;
    float: right;
    padding-top: 40px;
   
    }
.hotline-right ul{margin:0; padding:0}
.hotline-right ul li{list-style: none;
    margin: 5px 32px 0 0;
    float: left;
    font-size: 25px;
    color: #ea1f24;
}
.hotline-right ul li a{text-decoration:none; color:#666; padding-left:10px }
a.home {
    color: transparent;
    background: url(home.png) 22px 9px no-repeat;
    width: 67px;
    height: 42px;
    text-align: center;
    padding: 0;
    margin: 0;

}
#newsletter{width: 18%; overflow: hidden;  float:left; margin:4.5% 0 0 2%; 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:27px; background:#02b5ed; border-radius:5px; text-align:center; margin:0 auto; 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: 1200px;
    max-width: 99%;
    margin: auto;
 }
.product_box {
    display: inline-block;
    position: relative;
    z-index: 1;
    width: 32%;
    /* height: 285px; */
    float: left;
    margin: 0px -1px -1px 0px;
    padding-bottom: 70px;
    margin: 4px;
    /* 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;
}
.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:0px 0px;font-family:Tahoma, Geneva, sans-serif;
    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:18px; /*width:100%; height:100%; */ height:97%
 ; }
.product_box a .informations p{
    width: 96%;
}
.product_box:hover a .informations { display:block;}
.product_img { text-align: center;
    /* background: black; */
    /* margin-top: 20px; */
    width: 90%;
    margin: auto;
    height: 230px; position: relative; }
.product_img img {    /*width: 88%;*/
    max-width: 100%;
    height: auto !important;
    max-height: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
.product_img span img { width: 50px ; height:50px}
.product_title {
    text-align: center;
    padding: 10px 0px;
    /* height: 35px; */
    margin: 10px 0px 0px 0px;
    /* font-size: 13px; */
    /* background: #0ac1ff59; */
    color: #216df9;
    position: absolute;
    text-transform: uppercase;
    bottom: 0px;
    width: 100%;
    font-weight: bold;
        }
.product_title h3{
    padding: inherit;
    margin: inherit;
    font-weight: inherit;
    font-size: inherit;
    text-transform: inherit;
    display: inherit;
}
.product_title a { text-decoration: none; color: #5e5e5e; font-size:12px; padding:0 3px; }
.product_title a:hover { text-decoration: none; color: #5A9505 }
.product_price { padding: 0; overflow:hidden;  margin: 10px 0px;}
.product_old-price{         float: left; padding-left: 5px;
    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;
    /* float: right; */
    color: #030202;
    /* padding-right: 5px; */
    font-weight: bold;
    font-size: 15px;
    text-align: center;}
.product_buy{width:91px; height:24px; margin:5px auto 0 auto}
.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 #khungnoidung 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: 0px 0px 0px 0px; }
.small-prd-img {width: 95%;
    text-align: center;
    margin: 10px 0 0 6px;
    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: #000000;
    color: white;
    padding: 5px 10px;
}
#top li{
    float: left;
    list-style: none;
    margin: 4px 0px 0px 0px;
}
#top li a{
    color: #fff;
}
#top li a h1 {
    font-size: inherit;
    font-weight: inherit;
    padding: 0px;
    margin: 0px;
}
.hotline{
    margin: 0px 0px 0px 35px;
    display: inline-block;
    color: #feb600;
    font-weight: 600;
    font-size: 16px;
    background: url(../../img/call.png) left center no-repeat;
    padding: 2px 0px 2px 30px;
}
.top {     float: right; }
.album_box { width: 210px;  position: relative; float: left; margin: 5px 0px 5px 5px; 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; padding:0}
#topGuide ul li{list-style:none; float:left; margin:0px 15px 0 0; height:25px;line-height:25px}
#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; padding:0}
#topReg ul li{list-style:none; float:left; margin:0 10px 0 0; height:25px;line-height:25px}
#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:19px; float:left; margin:3px 1% 0 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:26px; color:#FFF; font-weight:bold; font-size:13px; text-align:center }
#topright-bg-right{ width:22px; height:33px; float:right}
.fixHeader{
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999; 
    -webkit-transition: background 2s; /* For Safari 3.1 to 6.0 */
  transition: background 2s;
}    
#head-bg{
    margin: auto;
    /* max-width: 99%; */
    background: url(topbg.jpg) 100%;
}
    
}
.title-cate{background:url(../images/title-cate.png) right no-repeat #5A9505; width:100%; height:30px; line-height:30px; color:#FFF; font-weight:bold; text-indent:10px}

<!--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:8px 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 #216df9 double;
}
.titlePro-name{
    background: #216df9;
    font-size: 16px;
    padding: 8px 20px 8px 8px;
    float: left;
    border-radius: 0px 0px 0 0;
    color: white;
    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:8px 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:20px; border:3px solid #9AC570
}
.c2-head{
    float: left;
    color: white;
    font-weight: bold;
    margin-bottom: 10px;
    cursor: pointer;
    background: rgb(131, 187, 230);
    padding: 10px 20px;
    border-bottom: 3px solid #216df9;
}
.c2-head h4 {
    margin: 0px;
    padding: 0px;
    font-size: 14px;
    text-transform: inherit;
}
#status-menu{    width: 100%;
    overflow: hidden;
    background: #efefef;
    color: #444;}
#status-menu ul{margin: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;
}

.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:20px;  }
.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:10px 0;  }
#command{width:100%; height:25px; line-height:25px; 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;
}
#vungxam{
    padding: 10px 0px;
    background: #f7f7f7;
}

#box3-l{
    width: 30.5%;
    float: left;
    margin-right: 2%;
    min-height: 100px;
}
h3.tintuctt{
    color: #216df9;
    text-transform: none;
    font-weight: normal;
    list-style: square;
    margin: 0px 0px 15px 0px;
    font-size: 14px;
}
#box3-l h2{
    margin: 10px 0px 15px 0px;
    font-size: 17px;
    padding: 0px 50px 5px 0px;
    color: #bd0d0d;
    border-bottom: 2px solid #e29090;
    display: inline-block;
}
.ttkhuyenmai{
    width: 92%;
    overflow: hidden;
    background: white;
    padding: 4%;

}
.ttkhuyenmai img{
    width: 98%;
}
.tinttucqt{
    padding: 5px;
    background: #f7f7f7;
    margin-bottom: 10px;
}
.tinttucqt img{
    width: 70px;
    height: 55px;
    float: left;
    margin-right: 10px;
}
.tinttucqt h3{  
         color: #006CB5;
    font-size: 14px;
    text-transform: initial;
    margin: 0px;
    line-height: 18px;
    font-weight: normal;
}
.tinttuc{
    border: thin silver dotted;
    padding: 5px;
    margin: 10px 10px 10px 0px;
    margin-top: 0px;
    margin-bottom: 10px;
    float: left;
    width: 47%;
    color: #424141;
    line-height: 19px;
        height: 130px;
}
.tinttuc img{
    width: 120px; height: 80px; float:left; margin-right: 10px;
}
.tinttuc h4{
        font-weight: bold;
    color: #3AA9E0;
    font-size: 14px;
    text-transform: initial;
    margin: 0px;
    line-height: 18px;
}
.sgiaodich{
   border: thin #d8d3d35e solid;
    padding: 5px;
    margin: 10px 10px 10px 0px;
    margin-top: 0px;
    margin-bottom: 10px;
    float: left;
    width: 47%;
    /* border-radius: 10px; */
    color: #424141;
    line-height: 19px;
    height: 100px;
}
.thanhcong-tl{
    width: 45%;
    float: left;
}
.thanhcong-tr{
    width: 55%;
    float: left;
}
.sgiaodich img{
    width: 120px; height: 100px; float:left; margin-right: 10px;
}
.giatien{
    color: #f17878;
}
.luotxem{
}
.sgiaodich h3{  
        font-weight: 600;
    color: #56270c;
    font-size: 14px;
    text-transform: initial;
    margin: 0px;
    line-height: 18px;
}
.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: 5px 0px 0px 0px;
    display: inline-block;
}
.sp-right hr{
        margin: 10px 0px;
}
.sp-title{
        font-size: 17px;
    text-transform: uppercase;
    display: block;
    color: orange;
    font-weight: bold;
    margin: 5px 0px 0px 0px;
    text-align: center;
}
.pbox2{
    margin-bottom: 10px;
}
.pbox2 .pbox2-title{
    float: left;
    width: 77%;
    color: black;
    line-height: 22px;
}
.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: #fff;
    font-weight: bold;
    /* font-size: 19px; */
    border-bottom: 3px #fff double;
    background: #216df9;
    }
    
ul.menuh{
	padding:0px; margin:0px;
}	
ul.menuh li{
    position: relative;
    list-style: none;
    background: #efefef;
    padding: 10px 10px 10px 15px;
    margin: 0px;
    transition: width 0.3s;
    /* width: 220px; */
    cursor: pointer;
    border-bottom: 1px solid #f7f6f6;
	
}
ul.menuh > li:hover{
background: #4d4c4c;
color: white;
}
ul.menuh > li img{
    width: 10px;
    margin: 0px 5px 0px 0px;
}
ul.menuh > li:hover > a{
color: white;
}
ul.menuh > li > a{
    color: #353333;
    /* font-weight: bold; */
    font-size: 14px;
}
ul.menuh > li > a h2{
    padding: inherit;
    margin: inherit;
    font-weight: inherit;
    font-size: inherit;
    text-transform: inherit;
    display: inherit;
}
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: 250px; max-width: 99%;
    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: #ffb057;
    color: white;
}
ul.menuh li ul li:hover a{
    color: white;
}
.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 : 1400px) {
    #contenn {
        width: 1400px;
        max-width: 99%;
        margin: auto;
    }
    .outer-general {
        width: 1400px;
        max-width: 99%;
        margin: 0px auto;
    }
    .nav-menu {
        list-style: none;
        *: ;
        zoom: 1;
        width: 1400px;
        max-width: 99%;
        margin: auto;
    }
    #pagewrap {
        width: 1400px;
        max-width: 99%;
        margin: 10px auto 0px;
        background: rgba(255, 255, 255, 0.82);
    }
}
@media screen and (min-width : 1300px) and (max-width : 1399px) {
    #contenn {
        width: 1300px;
        max-width: 99%;
        margin: auto;
    }
    .outer-general {
        width: 1300px;
        max-width: 99%;
        margin: 0px auto;
    }
    .nav-menu {
        list-style: none;
        *: ;
        zoom: 1;
        width: 1300px;
        max-width: 99%;
        margin: auto;
    }
    #pagewrap {
        width: 1300px;
        max-width: 99%;
        margin: 10px auto 0px;
        background: rgba(255, 255, 255, 0.82);
    }
}
 @media screen and (min-width : 990px) {
#middle { float: right;
    margin-left: 1%;
        width: 77%;
    padding-left: 1%;}
#left { float: left; width: 21%; clear: none;  }
.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: 10px 0px 0px 0px;
    margin-right: 1%;
    
}
.box22{
    width: 23%;
}
}

@media screen and (max-width: 990px) {	
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:10px 0 0 0}
#newsletter{width:60%; float:right;margin:10px 0 0 0}
.hotline-right{width:100%; float:none;}

#head-bg{/*background:url(../images/head-bg-rp.png);*/ padding:15px 0}
#header {    height: auto;
    overflow: hidden;
    
    padding: 0px; }
#pagewrap { width: 99%; }

.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: 8px 0 8px 40px;  }
.nav-menu li li li a { padding: 8px 0 8px 50px }

.nav-content { width: 32%; float: left; margin: 5px 5px 0 0 }
.article-box { width: 98% }
.article-title { width: 80%; margin-top: 15px }
.customer-name { width: 98%; text-align: left }
.news-title { width: 90%; background: url(../images/bullet_sub.png) no-repeat 0.5% 6px; }
.link { width: 100%; text-align:center }


.support{width:97%}
.button{width:95%;}

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

.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}
.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:82%; }

.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: 700px) {
.nav-content { width: 48%; float: left; margin: 5px 0 5px 5px }
.article-title { width: 80%; }
.advertise { width: 48%; float: left; margin: 5px 0 5px 5px }
.nav-menu{ padding-left: 0px;}
.anhienmenu{
    display: block;
}
.diachinonmobile{
	display: none;
}
.tc-danhmuc .tc-img img {
    width: 100%;
    height: 160px;
}
.hotro{
        display: block;
        z-index: 9999;
    }
    #box3-l{
        width: 48%;
        float: left;
    }
    .tc-danhmuc {
        float: left;
        width: 48%;
        margin: 5px 1% 10px 1%;
    }
    .hotline {
        margin: 0px 0px 0px 0px;
    }
    .thanhcong-tl{
        width: 100%;
        float: inherit;
        margin-bottom: 10px;
    }
    .thanhcong-tr{
        width: 100%;
        float: inherit;
    }
#left{
    display: none;
}
.product-desc {
    height: auto;
}
    .product_img {
        height: 160px;
    }
#gioithieutrangchu {
    width: 100%;
    float: inherit;
}
#doitac {
    width: 100%;
    float: inherit;
    min-height: 100px;
    background: lime;
    margin: 0px 2% 10px 0px;
}
.tinttuc {
    float: inherit;
    margin: 10px 0px 10px 0px;
    margin-top: 0px;
    margin-bottom: 10px;
    color: #424141;
    line-height: 19px;
    height: auto;
    width: 97%;
}
.tinttuc img{
    height: auto;
}
    #middle2{
        padding: 10px;
    }
.sgiaodich {
    float: inherit;
    margin: 10px 0px 10px 0px;
    margin-top: 0px;
    margin-bottom: 10px;
    border-radius: 10px;
    color: #424141;
    line-height: 19px;
    height: auto;
    width: 97%;
}
.footer-add{  width:auto; margin-bottom:10px;}
    .facebookft {
        width: 100%;
    }
.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: 90%;
    margin: auto;
    text-align: center;
    float: initial;}
#logo-right{display:none}
#logo-right-static{width:30%; display:block; float:right; margin-top:3px; margin-right:0; margin-bottom:2%;  }
#search, #newsletter,.hotline-right{width: auto;
    float: inherit;
    clear: both;
    margin: 20px 0 0 0;
    padding: 0;
    /* display: none; */}
.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{}

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

}


/* for 480px or less - one column */
@media screen and (max-width: 480px) {
.small-prd-des{width:56%; }
h1 { font-size: 2em; }
.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:30px; }
#ft-copyright{float:none; text-align:center; width:100%}
#icon-box{width:auto;float:none; overflow:hidden;  padding-left:40%}
    #box3-l{
        width: 100%;
        float: inherit;
        margin-right: 0px;
    }
    .box3-ttc{
        padding: 0px 10px;
    }
}
@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: 2px;
        display: inline-block;
}

#phantrang a:hover{
    padding:5px 10px 5px 10px;
    border: thin silver solid;
    margin: 2px;
    background: #216df9;
    color:white;
}
#dangxem{
    background: #216df9;
    color: white;
}
.datmua{
    background: #ED1C24;
    border: none;
    color: white;
    padding: 3px 15px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
        display: inline-block;
        margin: 1px;
    transition: 0.2s;
}
.datmua:hover{
    background: #000;
}

.timkiem-textbox{
    border: 1px solid #DAD8D8;
    height: 18px;
    line-height: 20px;
    margin-top: 1px;
}
.timkiem-text{
    float: left;
    width: 600px;
        max-width: 100%;
}
.timkiem-button{
        float: left;
    overflow: hidden;
        margin: 5px 0px 0px 0px;
        cursor: pointer;
}
#timkiem{
    border: thin solid silver;
    padding: 20px;
    margin: 5px;
}
.giohanghead{
    background: #3AADE3; 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: 30px; 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; }
.txt_datmua{
    padding: 10px;
    border: thin #e8e8e8 solid;
}
.khuyenmai{
width: 36px;
    height: 36px;
    line-height: 36px;
    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:15px;
}
#os-search-box-test label{
    color:#fff;
    font-weight:normal;
}
#os-search-box-test p{
    margin:5px 0 5px 0px;
    color:#fff;
}
#ketquadonhang{
    margin: 20px 0px;
}


table.bangtin th {
    background-color: #3399FF;
    color: white;
    font-weight: bold;
    text-align: center;
    padding: 5px;
    }
.baoloi{
    padding: 20px;
    margin: 20px;
    border: thin orange dotted;
    color: #0080FF;
}
.baoloi h2{
    color: #000;
    font-size: 18px;
    margin: 0px 0px 10px 0px;
}
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:50px;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); }
}