body {
  font: 12px/1.7 tahoma;
}
.container {
    max-width: 1215px;
}
.h2chitiet{
	box-sizing: border-box; outline: none; margin: 30px 0px 15px; padding: 10px 0px 6px 8px; border-width: 0px 0px 3px 5px; border-top-style: initial; border-right-style: initial; border-bottom-style: solid; border-left-style: solid; border-top-color: initial; border-right-color: initial; border-bottom-color: rgb(68, 82, 104); border-left-color: rgb(255, 73, 0); border-image: initial; vertical-align: baseline; font-variant-numeric: normal; font-variant-east-asian: normal; font-weight: 700; font-stretch: normal; font-size: 14px; line-height: 19px; font-family: Arial, Helvetica, sans-serif; zoom: 1; color: rgb(255, 69, 0); text-transform: uppercase; border-top-right-radius: 88px; border-bottom-right-radius: 88px; background-color: rgb(242, 243, 247);
	}
.trungtam{
	font-family:Arial, Helvetica, sans-serif; font-size:14px; text-transform:uppercase; color:#f94e30; font-weight:bold;
}
.trungtamhotline{
	font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#00F; font-weight:bold;
}
.trungtamdiachi{
	font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#000; font-weight:bold;
}

.image_template {
    left: 33px;
    position: absolute;
    top: 0px;
    display:none;
}
.img-old { width:100%;}
#logo{
	margin:0 auto;
	text-align:center;
}
#logo h1{
	margin: 5px 0;
}
.marb_detail { margin-bottom:10px;}
.tags_group { background:#E9E9E9; padding:5px 10px;}
.tags_group a{ padding:3px 10px; margin:5px 0}
.tags_group a:hover{ background:#fff; border-radius:5px;}
.cat_name_box { border-bottom:solid 1px #f27922; margin:10px 5px 20px 5px;}
.cat_name_box h2{ color:#f27922; padding:5px; text-transform:uppercase; margin:0; font-size:18px !important; font-weight:bold;}

.box_hot_1 h2,.box_hot_2 h2 { margin:0; padding:0}
.box_hot_child img{ text-align:center; padding:2px; overflow:hidden; background:#FFFFFF}
.box_hot_1 { margin-bottom:10px;}
.box_hot_1 h2.name a { font-size:22px; color:#0B0F18; font-weight:bold; text-transform:uppercase}
.bg_gia { margin-top:15px; background:url(/images/bg_gia.jpg) repeat-x; color:#fff; font-weight:bold; font-size:22px; display:table; line-height:46px; text-align:center; border-radius:5px}
.bg_gia a{ color:#fff; font-weight:bold; font-size:22px;padding:10px 20px; }

.bg_gia2 { margin-top:5px; }
.bg_gia2 a{ color:#990000; font-weight:bold; font-size:18px;}

.box_hot { padding:10px; background:#F4F4F4; border:solid 1px #E9E9E9}
.box_hot .img_right { float:left; width:30%;}
.box_hot .img_right img { padding:2px; overflow:hidden; background:#FFFFFF;}
.box_hot .right_box { float:right; text-align:left; width:65%;}
.box_hot_2 h2.name a { font-size:14px; margin:0; padding:0; color:#0B0F18; font-weight:bold; text-transform:uppercase}

#page {
    opacity: 06;
}
a:focus{
	outline: none;
}
a:hover{
	text-decoration: none;
}
h1  > *, h2 > *, h3 > *, h4  > *, h5 > *, h6 > *, .h1 *, .h2 > *, .h3 > *, .h4 > *, .h5 > *, .h6 > * {
    font-family: arial,helvetica,clean,sans-serif;
    font-weight: 500;
	font-size: 13px;
}
ul, ol {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}
.red,.label_error {
	color: red;
}

address,caption,cite,code,dfn,em,th,var,optgroup {
	font-style: inherit;
	font-weight: inherit;
}

del,ins {
	text-decoration: none;
}

li {
	list-style: none;
}
q:before,q:after {
	content: '';
}

abbr,acronym {
	border: 0;
	font-variant: normal;
}

sup {
	vertical-align: baseline;
}

sub {
	vertical-align: baseline;
}
figure {
  margin: 0;
}

input,button,textarea,select {
	border:1px solid #A9A9A9;	
}
.hidden,.hide,.hiden {
	display: none;
}
.clear:before, .clear:after {
    content: " ";
    display: table;
}
.clear:after {
    clear: both;
}
.clear {
    clear: both;
}
.block{
	margin-bottom: 10px;
}
.pd0{
	padding: 0;
}
.mt10{
	margin-bottom:10px;
}
.mt20{
	margin-bottom:20px;
}
.mt30{
	margin-bottom:30px;
}
.mt40{
	margin-bottom:40px;
}
.mart10{ margin-top:10px;}
.mart15{ margin-top:15px;}
/*
*
*/
#top-header {
    background: #ffffff;
	margin-bottom:15px;
}
#top-header .th-text {
    padding: 6px 0;
}
#top-header .hotline {
    text-align: center;
}
#top-header #logs {
    text-align: right;
}
#top-header .th-text .th-item {
    display: inline-block;
    line-height: 26px;
}
@media only screen and (min-width:1200px){
	#top-header .col-lg-l{
	    width: 36.5%;
	}
	#top-header .col-lg-c{
	    width: 44%;
	}
	#top-header .col-lg-r{
	    width: 19.5%;
	}
}
#top-header  .address-item {
    background: url("../images/icon-address.png") no-repeat scroll 0 0;
    color: #fff;
    font-family: semibold;
    font-size: 15px;
    padding-left: 30px;
}
#top-header .address-item > span {
    font-family: opensans;
    color: #fff !important;
}
#top-header .telephone-item {
    background: url("../images/icon-telephone.png") no-repeat scroll 0 0;
    color: #fff;
    font-family: semibold;
    font-size: 15px;
    padding-left: 23px;
    text-transform: uppercase;
}
#top-header .telephone-item  strong {
    font-family: opensans;
    color: #fff;
    font-size: 20px;
}
#top-header  .user_item {
    color: #fff;
    font-family: opensans;
    font-size: 12px;
    text-transform: uppercase;
}
#top-header .login.user_item {
    background: url("../images/dangnhap.png") no-repeat scroll 15px 0;
    padding-left:  38px;
}
#top-header .register.user_item{
    background: url("../images/dangky.png") no-repeat;
    padding-left:25px;
}
#top-header .info_user{
    color: #fff;
    font-weight: bold;
}
@media only screen and (min-width:1200px){
	#header-main {
	    height: 140px;
	}
}
#header-main  #logo h1{
	margin: 0;
}
#header-main  #logo a{
	display: inline-block;
    margin-top: 20px;
}
/*----end.top-header----*/
@media only screen and (min-width:1200px){
	#main_container .main-column.main-colum-left{
	    width: 73.8%;
	}
	#main_container #oc-column-right.col-lg-3{
	    width: 26.2%;
	}
	#main_container #oc-column-left {
	    width: 22.2%;
	}
	#main_container .main-colum-right {
	    width: 77%;
	}
}
/*----footer----*/
#footer {
    background:#f8f8f8;
}

#footer #footer-ct{
    margin: 40px 0;
    border-bottom: 1px solid #fff;
}
@media only screen and (min-width:1200px){
	#footer #footer-ct .col-lg-l{
		 width: 95%;
	}
	#footer #footer-ct .col-lg-r{
		 width: 35%;
	}
	#footer-ct .maps {
	    width: 38%;
		text-align:justify;
	}
	#footer-ct .category {
	    width: 26%;
	}
	#footer-ct .sale {
	    width: 36%;
	}
	#footer-ct .extras {
	    width: 27%;
	}
	#footer-ct .weblinks {
	    width: 40%;
	}
	#footer-ct .email {
	    width: 60%;
	}
}
#footer-ct .title_item {
    font-family: opensans;
    font-size: 18px;
}
@media only screen and (max-width:768px){
	#footer-ct .title_item {
	  width: 100%;
	  display: block;
	}
}
#footer-ct .maps > span {
    background: url("../images/icon-maps.png") no-repeat;
    border-bottom: 1px solid #f6861f;
    padding: 6px 33px 6px 52px;
}
#footer-ct .category > span {
    background: url("../images/icon-dm.png") no-repeat;
    border-bottom: 1px solid #23B4CA;
    padding: 6px 0px 6px 52px;
}
#footer-ct .sale > span {
    background: url("../images/icon-tgmh.png") no-repeat;
    border-bottom: 1px solid #40AF64;
    padding: 6px 0px 6px 52px;
}
#footer-ct .extras > span {
    background: url("../images/icon-ti.png") no-repeat;
    border-bottom: 1px solid #6E45A7;
    padding: 6px 0px 6px 52px;
}
#footer-ct .weblinks > span {
    background: url("../images/icon-wl.png") no-repeat;
    border-bottom: 1px solid #F7BE24;
    padding: 6px 0px 6px 52px;
}
#footer-ct .email > span {
    background: url("../images/icon-email.png") no-repeat;
    border-bottom: 1px solid #DE5648;
    padding: 6px 0px 6px 52px;
}
#footer-ct #bottom-nav{
    margin: 15px 0;
}
#footer-ct .discount_title, #footer-ct ul > li > span{
    font-family: opensans;
    font-size: 13px;
    text-align: justify;
}
#footer-ct ul > li {

}
#footer-ct ul  li:hover  {

}
#footer-ct ul  li a,#footer-ct ul li span{
	background: url("../images/icon-item.png") no-repeat scroll 0px 7px;
    color: #333333;
    padding-left:10px;	 
	font-size: 14px;
}
#footer-ct ul  li a:hover {
	background: url("../images/icon-item-active.png") no-repeat scroll 4px 7px;
    color: #3EBCCF;
    padding-left:14px;	 
}

#footer-ct .discount_content {
    margin: 25px 0 0;
}
#footer-ct .block_weblink > a {
    line-height: 30px;
}
#footer-ct .block_weblink > a:hover {
    color: #3EBCCF;
}
#footer-ct .block_weblink {
    margin: 15px 0;
}
#footer-ct .block_weblink img {
    margin-right: 8px;
}
.scrollToTop{
    background: url("../images/top.png") no-repeat;
    height: 38px;
    position: fixed;
    right: 0;
    bottom: 30px;
    width: 38px;
}
.facebook{
    background: url("../images/facebook_scroll.png") no-repeat;
    height: 38px;
    position: fixed;
    right: 0;	
    bottom: 110px;
    width: 38px;
}
.google{
    background: url("../images/google_scroll.png") no-repeat;
    height: 38px;
    position: fixed;
    right: 0;	
    bottom: 70px;
    width: 38px;
}
/*----------------------------------------------------------------------------------*/
.product_cat .vertical{
	border-right: none;
	border-bottom: none;
}
.product_cat #vertical .item{
	width:  19.8888%;
  	float: left;
  	padding:10px 0;
  	max-height: 380px;
}
.product_cat #vertical_2 .item{
	width:  25%;
  	float: left;
  	border-right: 1px solid #EBEEF2;
  	border-bottom: 1px solid #EBEEF2;
  	padding:10px 0;
  	max-height: 216px;
}
.product_cat .vertical .item-last{
  	border-right: 1px solid #EBEEF2;
}
@media only screen and (min-width:1200px){
	.product_cat #vertical .w2{
		width:  33.3333%;
		background:#EFEFEF;
		overflow: hidden;
		position: relative;
	}
}
.product_cat #vertical .w2 .media-body {
}
@media only screen and (max-width:1200px){
	.product_cat #vertical .item{
		width:  20%;
	}
	.product_cat #vertical_2 .item{
		width:  33.33%;
	}
}
@media only screen and (max-width:1100px){
	.product_cat #vertical .item{
		width:  25%;
	}
}
@media only screen and (max-width:820px){
	.product_cat #vertical .item{
		width:  33.33%;
	}
	.product_cat #vertical_2 .item{
		width:  50%;
	}
}
@media only screen and (max-width:680px){
	.product_cat #vertical .item{
		width:  50%;
	}
	.product_cat #vertical_2 .item{
		width:  100%;
	}
}
@media only screen and (max-width:420px){
	.product_cat #vertical .item{
		width:  50%;
	}
}
/*******************************/

.product_cat .vertical .frame_inner {
    position: relative;
}
.product_cat .vertical   .frame_img_cat  img{
    margin: 0 auto;
    height: 185px;
}
.product_cat_type {position: relative;}
.product_cat_type .frame_view_cat {
    height: 150px;
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    color:#fff;
    padding:10px;
    background: rgba(0, 0, 0, 0.6);
     z-index: 1;
}
.product_cat_type:hover  .frame_view_cat {
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    text-decoration: none;
}

@media only screen and (min-width:1200px){
	.product_cat #vertical  .item.w2 img{
	    height: 130px;
	    margin: 0 auto;
	}
}
.product_cat .vertical .frame_title .name{
	display: table;
    margin-bottom: 0;
    margin-top: 12px;
    width: 100%;
    text-align: center;
}
.product_cat .vertical .frame_title .name a{
	 color: #333;
	font-size: 14px;
    display: block;
    overflow: hidden;
	font-family:Arial, Helvetica, sans-serif; 
}
@media only screen and (min-width:1200px){
	.product_cat .vertical .item.w2 .frame_title .name a{
		display: inline-block;
	    height: 20px;
	    margin-top: 10px;
	    overflow: hidden;
	}
}
.product_cat .vertical .warranty {
    font-family: opensans;
    text-align: center;
}
.product_cat .vertical .frame_price {
	text-align: center;
}
.product_cat .vertical .frame_price .price{
	color:#f27922;
	margin-right:10px;
	font-family: helvatica, "Open Sans", sans-serif;
	font-size:18px;
	font-weight:bold;
}
@media only screen and (min-width:1200px){
	.product_cat .vertical  .item.w2 .frame_price .price_old{
		float: left !important;
	    margin-left: 40px;
	}
}
.product_cat .vertical  .frame_price .price_old{
    color: #868686;
    text-decoration: line-through;
	font-family: helvatica, "Open Sans", sans-serif;
	font-size:14px;
	font-weight:500;
}
.product_cat .vertical .frame_view {
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    height: 140px;
    left: 0;
    opacity: 0;
    overflow: hidden;
    padding: 10px;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
@media only screen and (min-width:1200px){
	.product_cat .vertical .item:hover .frame_view {
	    opacity: 1;
		-webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -ms-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;
	}
}
.product_cat .vertical  .product_type {
    position: absolute;
    right: 0;
    top: 4px;
}
.product_cat .vertical .discount_percent {
    background: url(../images/bg_discount.png) no-repeat;
	color: #fff;
    left: 0;
    padding-left: 3px;
    position: absolute;
    top: 4px;
    width: 52px;
}

/*---------------------------------------------*/
@media only screen and (max-width: 1024px) {
 
}
 
@media only screen and (max-width: 980px) {
 
}
 
@media only screen and (max-width: 800px) {
 
}
 
@media only screen and (max-width: 780px) {
 
}
 
@media only screen and (max-width: 768px) {
 
}
 
@media only screen and (max-width: 720px) {
  .box_hot { margin-bottom:12px;}
}
 
@media only screen and (max-width: 640px) {
 
}
 
@media only screen and (max-width: 600px) {
  .box_hot_0 { padding-bottom:10px;}
}
 
@media only screen and (max-width: 568px) {
}
 
@media only screen and (max-width: 563px) {
}
 
@media only screen and (max-width: 549px) {
}
 
@media only screen and (max-width: 534px) {
}
 
@media only screen and (max-width: 480px) {
.block_products_filter .field_item{
	width:48% !important; 
	border:solid 1px #CCCCCC;
	height:30px; line-height:12px;
	margin:3px;
	
}
}
 
@media only screen and (max-width: 360px) {
  .box_hot_0 { width:100%}
 	.img_right { text-align:center;  width:100% !important}
	.right_box { width:100% !important}
	.img_right img {  width:100% !important; margin-bottom:10px;}
#logo img{
	width:200px;
	height:auto;
}

}
 
@media only screen and (max-width: 338px) {
 .facebook,.google { display:none}
}
 
@media only screen and (max-width: 330px) {
 
}
 
@media only screen and (max-width: 320px) {
 
}



@media (min-width: 1025px) {
	.containerx {
    display: grid;
    grid-gap: 5px;
	grid-template-columns: 35% 15% 20% 20%;
    grid-template-rows: 10px 10px;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: repeat(2,auto);
	width:80%;
	margin:auto;
}
.float-contact {
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 99999;
    text-align: left;
}
.chat-face, .hotline, .zalo, .face {
    overflow: hidden;
    border: none !important;
    background: none !important;
}   
.chat-face a, .hotline a, .zalo a, .face a {
    display: block;
    margin-bottom: 6px;
}
.chat-face a:hover, .hotline a:hover, .zalo a:hover, .face a:hover {
    background: #137b00;
    color: #fff;
    text-decoration: none;
}
.chat-face a img, .hotline a img, .zalo a img, .face a img {
    display: block;
    margin: auto;
}
.chat-face a, .hotline a, .zalo a, .face a {
    color: #000;
    text-align: center;
    display: block;
    font-size: 10px;
}   
}

@media (max-width: 1024px) {
	.containerx {
    display: grid;
    grid-gap: 5px;
	grid-template-columns: 35% 15% 20% 30%;
    grid-template-rows: 10px 10px;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: repeat(2,auto);
	width:100%;
}
.float-contact {
   position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 99999;
    text-align: left;
}
.face, .chat-face, .zalo, .hotline {
    width: 25%;
    text-align: center;
    margin: auto;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
}
.face a img, .chat-face a img, .zalo a img, .hotline a img {
    display: block;
    margin: 5px auto 5px;
}
.face a, .chat-face a, .zalo a, .hotline a {
    color: #fff;
    font-size: 13px;
}

}
.trantrang{
font-family: Roboto;
    font-size: 20px !important;
    font-weight: 500;
	color:#333333;
	 }
	 .trantrang1{
font-family: Roboto;
    font-size: 18px !important;
    font-weight:bold;
	color:#333333;
	 }
	 .chutran{
 color:#333333;
font-size:13px;
}
.float-contact {
position: fixed;
bottom: 100px;
right: 20px;
z-index: 99999;
}
.chat-zalo {
display: block;
}
.hotline-phone-ring-wrap {
  position: fixed;
  bottom: 0;
  right:100px;
  z-index: 999999;
}
.hotline-phone-ring {
  position: relative;
  visibility: visible;
  background-color: transparent;
  width: 110px;
  height: 110px;
  cursor: pointer;
  z-index: 11;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transition: visibility .5s;
  left: 0;
  bottom: 0;
  display: block;
}
.hotline-phone-ring-circle {
	width: 85px;
  height: 85px;
  top: 10px;
  left: 10px;
  position: absolute;
  background-color: transparent;
  border-radius: 100%;
  border: 2px solid #e60808;
  -webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
  animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
  transition: all .5s;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  opacity: 0.5;
}
.hotline-phone-ring-circle-fill {
	width: 55px;
  height: 55px;
  top: 25px;
  left: 25px;
  position: absolute;
  background-color: rgba(230, 8, 8, 0.7);
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
  animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
  transition: all .5s;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.hotline-phone-ring-img-circle {
	background-color: #e60808;
	width: 33px;
  height: 33px;
  top: 37px;
  left: 37px;
  position: absolute;
  background-size: 20px;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
  animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hotline-phone-ring-img-circle .pps-btn-img {
	display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.hotline-phone-ring-img-circle .pps-btn-img img {
	width: 20px;
	height: 20px;
}
.hotline-bar {
  position: absolute;
  background: rgba(230, 8, 8, 0.75);
  height: 40px;
  width: 180px;
  line-height: 40px;
  border-radius: 3px;
  padding: 0 10px;
  background-size: 100%;
  cursor: pointer;
  transition: all 0.8s;
  -webkit-transition: all 0.8s;
  z-index: 9;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.1);
  border-radius: 50px !important;
  /* width: 175px !important; */
  left: 33px;
  bottom: 37px;
}

.hotline-bar > a {
  color: #fff;
  text-decoration: none;
  font-size: 15px;
  font-weight: bold;
  text-indent: 50px;
  display: block;
  letter-spacing: 1px;
  line-height: 40px;
  font-family: Arial;
}
.hotline-bar > a:hover,
.hotline-bar > a:active {
  color: #fff;
}
@-webkit-keyframes phonering-alo-circle-anim {
  0% {
    -webkit-transform: rotate(0) scale(0.5) skew(1deg);
    -webkit-opacity: 0.1;
  }
  30% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    -webkit-opacity: 0.5;
  }
  100% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
    -webkit-opacity: 0.1;
  }
}
@-webkit-keyframes phonering-alo-circle-fill-anim {
  0% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    opacity: 0.6;
  }
  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
    opacity: 0.6;
  }
  100% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    opacity: 0.6;
  }
}
@-webkit-keyframes phonering-alo-circle-img-anim {
  0% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
  10% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  20% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg);
  }

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