/* CSS Document */

@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800);

@import url(https://fonts.googleapis.com/css?family=Noto+Sans:400,400italic,700,700italic&subset=latin,vietnamese);

body{

	/*background:#301f0f;*/

	background:url(../images/bg/body-bg.jpg) center fixed;

	color:#222222;

	/*background:url(../images/bg/bg-2.png);*/

}

.bg-div{

	/*background: rgba(254,254,254,0.7);*/

	background:#FFF;

	padding-bottom:30px;

	padding-top:30px;

	transition: all 0.3s ease 0s;

	border-bottom:1px #ebeef2 solid;

	border-top:1px #ebeef2 solid;

}

.bg-div:hover{

	/*background: rgba(254,254,254,0.4);

	transition: all 0.3s ease 0s;*/

}

.xemthem{

	float:right;

	margin-right:5px;

}

#trang{

	margin:10px 10px 10px 0;

	padding:5px;

	width:100%;

	float:right;

	text-align:right;

	color:#000000;

}

#trang a{

	color:#000000;

	text-decoration:none;

}

#trang a:hover{

	text-decoration:underline;

}

#trang b{

	font-weight:bold;

	color:#FF0000;

}

/***** header **********/

.header{

	/*background:url(../images/bg-header3.jpg) top center repeat;*/

	/*background:url(../images/bg-header3.jpg) #f9f8f8 bottom repeat;*/

	padding-top:10px;

	padding-bottom:20px;

	/*margin-top:38px;

	margin-bottom:10px;*/

	margin-bottom:0px;

	margin-top:47px;

	/*border-bottom:1px #fff solid;*/

	/*border-top:4px #0092dd solid;*/

	box-shadow: 0px 0px 10px -4px #333;

	background: url(../images/bg-header3.jpg) #FFF bottom center repeat-x;

}

.header-text{

	font-weight:300;

}

.header-text .text-top{

	font-size:24px;

	color:#0166ff;

	text-align:left;

	font-weight:500;

	padding-top:4px;

}

.header-text .text-bottom{

	font-weight: 350;

    /*font-family: "Roboto Condensed", "Roboto Condensed Light", sans-serif;*/

	font-family: 'Noto Sans', sans-serif;

	font-weight:100;

    padding-top: 26px;

    font-size: 19px;

    color: #09F;

    text-align: left;

	padding-left:15%;

	font-style:italic;

}

.lang a{

	margin-top:5px;

	margin-right:10px;

	font-size:12px;

	color:#f6871f;

	text-decoration:none;

	float:right

}

.lang a:hover{

	text-decoration:underline;

}

.banner{

	/*background:#000;*/

	/*margin-bottom:40px;*/

	/*margin-bottom:1.5%;*/

	border-bottom:2px #fff solid;

	border-top:1px #d5d5d5 solid;

	/*box-shadow:0px 1px 18px #afb0b0;*/

}

.banner2 img{

	border:1px #CCC solid;

	box-sizing:border-box;

}

.hot {

    margin-bottom: 5px;

    font-size: 18px;

    color: #F00;

    text-decoration: none;

    float: right;

    width: 100%;

    text-align: right;

	font-family:Arial, Helvetica, sans-serif;

    font-weight: 300;

}

/*** MENU MAIN ******/

.active-logo{

	display:none;

	width:auto;

	transition: all 1s ease;

	background:none !important;

	display:inline-block;

	/*padding-left:0px !important;

	padding-right:0px !important;*/

	text-align:left

}

.active-logo a{

	padding:0px !important;

}

.deactive-logo{

	display:none !important;

	transition: all 1s ease;

	background:none;

	display:inline-block;

}

/******* tim kiem ***************/

.form-search{

	width:90%;

	height:auto;

	margin-top:15px;

	float:right;

}

.btn-primary {

    color: #fff;

    background-color: #e1261c;

    border-color: #e1261c;

}

.menu-full{

	/*background:#e11313;*/

	background:#029773;

	/*background:url(../images/menu-bg.gif) repeat-x;*/

	margin-bottom:0px;

	box-shadow: 0px 0px 10px -4px #bcbbbb;

    border-bottom: 1px solid #bcbbbb;

	padding-bottom:1px;

}

.menuMobile {

	background:#029773

}

.menuMobile a{

	/*color:#333 !important;*/

}

.menuMobile .mm-menu em.mm-counter{

	/*color:#333 !important;*/

}

.menuMobileSub {

	background:#4244a2;

}

.menuMobileSub a{

	padding-left:40px !important;

}



.menu{

	width:100%;

	height:auto;

	/*margin:0px;

	padding:0px;*/

	/*margin-bottom:1px;*/

	display:inline-block;

	

}

.menu ul{

	width:100%;

	margin:0 auto !important;

	padding:0px;

	height:100%;

	float:left;

	/*background:#69220e;*/

	/*background:#e11313;*/

	text-align:center;

	font-family: 'Lato', sans-serif;

    font-size: 12px;

	font-weight:bold;

	list-style:none;

	/*box-shadow:0px 1px 18px #999;*/

}

.menu ul li{

	color:#fff;

	text-decoration:none;

	list-style:none;

	display:inline-block;

	position: relative;

	transition: all 0.3s ease 0s;

	height:100%;

	/*border-right: 1px solid #569eee;*/

	/*float:right;*//* bo float:right de canh giua*/

	/*border-right:1px #000000 solid*/

}

.menu ul li:last-child {

    border: none;

}

.menu ul .active{

	color:#fff;

	text-decoration:none;

	list-style:none;

	display:inline-block;

	background:#e1261c;

}

.menu ul .active a{

	color:#ffffff;

}

.menu-fixed ul li a{

	padding-top:10px !important;

	padding-bottom:10px !important;

}

.menu ul li a{

	color:#fff;

	padding-top:14px;

	padding-bottom:14px;

	display:inline-block;

	text-decoration:none;

	transition: all 0.3s ease 0s;

	height:100%;

	text-transform:uppercase;

	font-weight:normal;

	font-family:Arial, Helvetica, sans-serif;

}

.menu ul li ul li a i, .menu ul li ul li ul li a i {

    margin: 0px;

    padding: 0px 0px 6px 25px;

    float: left;

    cursor: pointer;

    display: block;

    font-size: 12px;

    width: 100%;

	text-transform:none

}

.menu ul li:hover{

	background:#e1261c;

}

.menu ul li:hover a{

	color:#FFF

}

.menu ul li a:hover{

	color:#FFF;

}

.menu ul li ul{

	width:250px;

	height:auto;

	margin:0px;

	padding:0px;

	float:left;

	cursor:pointer;

	font-weight:bold;

	background:#029773;

	display:none;

	position: absolute;

	top:auto;

	left:0px;

	z-index:999;

	transition: all 0.3s ease 0s;

}

.menu ul li ul li{

	width:100%;

	height:auto;

	margin:0px !important;

	padding:0px !important;

	float:left;

	border-bottom:1px #04dda9 solid;

	background:none;

}

.menu ul li ul li a, .menu ul .active ul li a{

	width:100%;

	height:auto;

	color: #ffffff;

	text-decoration: none;

	text-align: left; 

	font-weight:normal;

	background:none;

	margin:0px !important;

	padding:0px !important;

	float:left

}

.menu ul li ul li a:hover, .menu ul .active ul li a:hover{

	width:100%;

	height:auto;

	display:inline-block;

	background:#e1261c;

	color:#fff;

	margin:0px !important;

	padding:0px !important;

	float:left;

}

.menu ul li ul li a p{

	width:auto;

	margin:0px;

	padding:8px 0px 2px 0px !important;

	float:left;

	cursor:pointer;

	font-size:12px;

}

.menu ul li ul li a span{

	width:auto;

	margin:0px;

	padding:8px 5px 5px 10px !important;

	float:left;

	cursor:pointer;

}

.menu ul li ul li ul{

	width:250px;

	height:auto;

	margin:0px;

	padding:0px;

	float:left;

	cursor:pointer;

	font-weight:bold;

	background:#029773;

	display:none;

	position: absolute;

	top:0;

	left:250px;

	z-index:999;

	transition: all 0.3s ease 0s;

	border-left:1px #CCCCCC solid;

	box-sizing:border-box;

}

.menu ul li:hover ul ul, 

.menu ul li:hover ul ul ul,

.menu ul li:hover ul ul ul ul {

    display: none;

}



.menu ul li:hover ul,

.menu ul li li:hover ul,

.menu ul li li li:hover ul,

.menu ul li li li li:hover ul {

    display: block;

}



/****** ket thuc menu ***************/

/********* about home ***********/

.about-home .div-img{

	width:30%;

	height:auto;

	float:left;

}

.about-home img{

	width:20%;

	height:auto;

	margin-right:12px;

	float:left;

}

.about-home .about-info{

	

	

}

.about-home .about-info p{

	width:auto;

}

.more-detail-fixed{

	bottom:0;

	position:absolute ;

	right:0

}

.more-detail{

	float:right;

	margin-right:12px;

	font-size:30px;

	bottom:0px;

	float:right;

	

}

.more-detail .a{

	color:#0092dd;

	text-decoration:none;

	float:right;

	transition: all 0.3s ease 0s;

}

.more-detail .a:hover{

	color:#f6871f;

	transition: all 0.3s ease 0s;

	text-decoration:underline;

}

/***** content *********/

.xoay{

	transform: rotate(0);

	transition: all 0.7s ease;

	margin-bottom:10%;

	margin-top:10%;

}

.xoay:hover{

	transform: rotate(75deg);

}

.xoayY{

	width:100%;

	height:auto;

	float:left

}

.xoayY img {

 -webkit-transition: all 1s ease;

     -moz-transition: all 1s ease;

       -o-transition: all 1s ease;

      -ms-transition: all 1s ease;

          transition: all 1s ease;

}



.xoayY:hover img {

  -webkit-transform: rotateY(180deg);

     -moz-transform: rotateY(180deg);

       -o-transform: rotateY(180deg);

      -ms-transform: rotateY(180deg);

          transform: rotateY(180deg);

	margin: 0;

	padding: 0;

	margin-bottom:0px;

	overflow:hidden;

}

/**** category ************/

.category a {

    display: block;

    position: relative;

    margin-bottom: 30px;

	padding-bottom:12px;

    color: #333;

    text-align: center;

    font-size: 15px;

    overflow: hidden;

	width:100%;

	background: rgba(254,254,254,0.5);

	transition: all,0.5s,ease-in-out;

	border:1px #ebeef2 solid;

	/*background:#fff;*/

	box-shadow: 0 3px 8px #CCC;

}

.category a:hover{

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

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

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

	/*background: rgba(254,254,254,0.2);*/

	background:#0092de;

	text-decoration:none;

}

.category a img {

    width: 100%;

	-webkit-transition: all,0.5s,ease-in-out;

    -o-transition: all,0.5s,ease-in-out;

    transition: all,0.5s,ease-in-out;

}

.category a:hover img {

    -moz-transform: scale(1.1, 1.1);

    -ms-transform: scale(1.1, 1.1);

    -o-transform: scale(1.1, 1.1);

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

    transform: scale(1.1, 1.1);

}



.category a .wrap-name {

    /*position: absolute;

    left: 0;

    top: 0;

    width: 50%;

	height: 100%;

	*/

	width:100%;

    height:auto;

    padding-top: 15px ;

	float:left;

	

}

.category a .wrap-name2 {

    position: absolute !important;

    right: 0;

    top: 0;

    width: 50%;

    height: 100%;

    padding: 0 10px 0;

}

.category a .wrap-name i, .category a .wrap-name2 i {

    font-size: 47px;

    display: inline-block;

    -webkit-transition: all 0.4s ease;

    -moz-transition: all 0.4s ease;

    -o-transition: all 0.4s ease;

    transition: all 0.4s ease;

}

.category a .wrap-name h2, .category a .wrap-name2 h2 {

	margin-top:0px;

    margin-bottom: 0;

    padding:0px 8px 0px 8px;

	padding-left: 3%;

	padding-right:3%;

    color: #000;

    font-size: 20px;

	line-height:30px;

    font-weight: 100;

	/*font-family: Open Sans;*/

    font-family: 'Noto Sans', sans-serif;

	text-align:left;

	text-decoration:none;

	text-transform:uppercase;

	width:100%;

	text-overflow: ellipsis;

    white-space: nowrap;

    overflow: hidden;

    display: block;

	float:left;

	transition: all 0.2s ease;

}

.category a:hover h2{

	/*-webkit-animation: 700ms linear  0s normal none 1 moveFromTop;

  -moz-animation: 700ms linear  0s normal none 1 moveFromTop;

  -ms-animation: 700ms linear  0s normal none 1 moveFromTop;

  -o-animation: 700ms linear  0s normal none 1 moveFromTop;

  animation: 700ms linear  0s normal none 1 moveFromTop;*/

  color:#fff;

  transition: all 0.2s ease;

}

.wrap-name p{

	text-align:left;

	color:#666;

    display: -webkit-box;

    max-width: 100%;

	padding-top:10px;

    padding-left: 3%;

	padding-right:3%;

    margin: 0 auto;

    line-height: 1.4;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden;

    text-overflow: ellipsis;

}

.category a:hover p{

	/*-webkit-animation: 700ms linear  0s normal none 1 moveFromTop;

  -moz-animation: 700ms linear  0s normal none 1 moveFromTop;

  -ms-animation: 700ms linear  0s normal none 1 moveFromTop;

  -o-animation: 700ms linear  0s normal none 1 moveFromTop;

  animation: 700ms linear  0s normal none 1 moveFromTop;*/

  color:#fff;

  transition: all 0.2s ease;

}

.round{

	width:80px;

	height:80px;

	border-radius:80px;

	background:#FFF;

	display:inline-block;

	text-align:center;

}

.round span{

	font-size:24px;

}

.category a:hover .round{

    -moz-transform: scale(1.1, 1.1);

    -ms-transform: scale(1.1, 1.1);

    -o-transform: scale(1.1, 1.1);

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

    transform: scale(1.1, 1.1);

}

.bg1{

	background-color: #09F;

}

.bg2{

	background-color: #f14d4d;

}

.bg3{

	background-color: #f050b6;

}

.bg4{

	background-color: #4582c4;

}

.bg5{

	background-color: #09F;

}

.bg6{

	background-color: #f0cc50;

}

.bg7{

	background-color: #f0cc50;

}

.bg8{

	background-color: #f0cc50;

}



.cl1{

	color: #09F;

}

.cl2{

	color: #f14d4d;

}

.cl3{

	color: #f050b6;

}

.cl4{

	color: #4582c4;

}

.cl5{

	color: #09F;

}

.cl6{

	color: #f0cc50;

}

.cl7{

	color: #f0cc50;

}

.cl8{

	color: #f0cc50;

}

@keyframes moveFromTop {

  0% {

    opacity: 0;

    transform: translateY(-200%);

  }

  50% {

    opacity: 0.5;

    transform: translateY(-100%);

  }

  100% {

    opacity: 1;

    transform: translateY(0%);

  }

}

@-webkit-keyframes moveFromTop {

  0% {

    opacity: 0;

    -webkit-transform: translateY(-200%);

  }

  50% {

    opacity: 0.5;

    -webkit-transform: translateY(-100%);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0%);

  }

}

/****** ket thuc category ****************/

/******** san pham ******************/

.product{

	width:100%;

	/*height:100%;*/

	height:auto;

   

	/*background:#0092dd;*/

	/*box-shadow: 0px 0px 10px -4px #333;*/

    transition: all 0.3s ease-in-out;

	/*cursor:pointer;*/

	color:#222222;

	float:left;

	border:1px #ebeef2 solid;

	/*background:#fff;*/

	/*box-shadow: 0 3px 8px #CCC;*/

	box-sizing:border-box;

	background:#FFF;

	padding-bottom:30px;

	margin-bottom:30px;

	z-index:1;

	display:inline-block;

	position: relative;

	border-top:1px #f2f2f2 solid;

}

.product:hover{

	transition: all 0.3s ease-in-out;

	color:#FFF;

	box-shadow: 0 3px 8px #CCC;

	z-index:999;

}

.product:hover .name{

	/*color:#09F*/

	color:#FF0;

}

.product:hover .info{

	/*color:#333*/

}

.img-responsive{

	text-align:center;

	height:100%;

	z-index:1

}

.img-responsive img{

	width:100%;

	max-width:210px;

	height:auto;

}

.product .info{

	width:90%;

	height:auto;

	margin:0px 0px 0px 5%;

	padding:0px;

	float:left;

	color:#CCC

}

.product .info .item-info{

	width:100%;

	height:auto;

	margin:0px 0px 0 0;

	padding:0px;

	/*background:url(../images/icon-info.png) left center no-repeat;*/

	font-family:Verdana, Arial, Helvetica, sans-serif;

	font-size:12px;

	text-align:left;

}

.product .info .item-info .item-th{

	font-weight:bold;

	margin:0px;

	margin-left:0px;

	padding:0px;

}

.product .name{

	width:100%;

	height:30px;

	margin:0px;

	float:left;

	text-align:center;

	text-decoration:none;

	color:#333;

	font-size:13px;

	transition: all 0.3s ease 0s;

	text-transform:uppercase;

	line-height:20px;

	

    width: 100%;

    text-overflow: ellipsis;

    white-space: nowrap;

    overflow: hidden;

}

.product .name:hover{

	color:#FF0;

}

.name a{

	color:#dc514e;

	text-decoration:none;

	width: 100%;

    text-overflow: ellipsis;

    white-space: nowrap;

    overflow: hidden;

}

.name a:hover{

	color:#333

}

.btn-xem-chi-tiet {

    width: 90%;

    height: auto;

    margin: 5px 0px 0 5%;

    padding: 7px 0px;

    background: #333;

    font-size: 14px;

    text-align: center;

    color: #000;

    color: #FFF;

    border-radius: 4px;

    float: left;

    text-decoration: none;

	text-transform:uppercase;

	font-family:"Roboto Condensed", "Roboto Condensed Light", sans-serif;

}

.btn-xem-chi-tiet:hover{

	background:#000;    

	transition: all 0.3s ease 0s;

	color:#FFF;

	text-decoration:none;

}

.product:hover .btn-xem-chi-tiet{

	background:#000;

	transition: all 0.9s ease 0s;

}

.product .km, .lc_hinh .lch_top .km{

	width:120px;

	height:41px;

	margin:0px;

	padding:0px;

	float:right;

	background:url(../images/icon-km.png);

	position:absolute;

	right:0;

	top:5px;

	z-index:7;

	color:#FFFFFF;

}

.product .km span, .lc_hinh .lch_top .km span{

	padding:5px 0 0 0;

	margin:0px 0px 0px 60px;

	font-size:18px;

	font-weight:300;

	float:left;

	width:50px;

	text-align:left;

}

.product .new, .lc_hinh .lch_top .new{

	width:65px;

	height:67px;

	margin:0px;

	padding:0px;

	float:right;

	background:url(../images/new-icon.gif);

	position:absolute;

	right:0;

	top:0px;

	z-index:7;

	color:#FFFFFF;

}

.icon-view {

  position: absolute;

  top: 50%;

  left: 50%;

  margin-left: -40px;

  margin-top: -40px;

  opacity: 0;

  -webkit-animation: fadeOut .4s;

  animation: fadeOut .4s;

  z-index:999;

}

.product:hover .icon-view {

  opacity: 1;

  -webkit-animation: bounceIn .4s;

  animation: bounceIn .4s;

}



.icon-view {

  width: 80px;

  height: 80px;

  padding: 5px;

  border: solid 1px rgba(0, 0, 0, 0.6);

  border-radius: 50%;

  display: inline-block;

}

.icon-view strong {

  display: block;

  width: 68px;

  height: 68px;

  border-radius: 50%;

  text-align: center;

  background-color: rgba(0, 0, 0, 0.6);

  color: #ffffff;

}

.size-view{

	font-size:26px;

	padding-top:22px;

	display:inline-block;

}

@keyframes bounceIn{

  0%{

    opacity: 0;

    transform: scale(0.3) translate3d(0,0,0);

  }

  50%{

    opacity: 0.9;

    transform: scale(1.1);

  }

  80%{

    opacity: 1;

    transform: scale(0.89);

  }

  100%{

    opacity: 1;

    transform: scale(1) translate3d(0,0,0);

  }

}

/******* footer *******/

.footer{

	/*border-top:1px #fff solid;*/

	/*box-shadow:0px 1px 18px #999;*/

	/*background:#f2f2f2;*/

	/*background: rgba(254,254,254,0.5) !important;*/

	background:#0e5aa8;

	font-size:11px;

	padding-top:25px;

	padding-bottom:15px;

	margin-top:30px;

}

.footer .wrap-menu{

	display:block;

}

.wrap-menu .wrap-menu-name{

	color:#FFF;

	display:block;

	text-transform:none;

	padding-bottom:10px;

	font-size: 12px;

	font-weight:600;

	/*font-family:"Roboto Condensed", "Roboto Condensed Light", sans-serif*/

}

.wrap-menu .wrap-menu-name2{

	color:#FFF;

	display:block;

	text-transform:none;

	padding-top:20px;

	padding-bottom:6px;

	font-size: 14px;

	font-family:sans-serif;

	font-weight:bold;

}

.wrap-menu a, .wrap-menu .p{

	display:block;

	color:#fff;

	text-decoration:none;

	webkit-transition: all 0.3s ease;

    -moz-transition: all 0.3s ease;

    -o-transition: all 0.3s ease;

    transition: all 0.3s ease;

	padding-top:3px;

	padding-bottom:5px;

	/*font-family:"Roboto Condensed", "Roboto Condensed Light", sans-serif;*/

	font-size:12px;

	padding-left: 3%;

    padding-right: 3%;

    text-align: left;

    width: 100%;

    text-overflow: ellipsis;

    white-space: nowrap;

    overflow: hidden;

    display: block;

}

.wrap-menu a:hover{

	text-decoration:underline;

}

.wrap-menu .phone{

	display:block;

	color:#fff;

	text-decoration:none;

	webkit-transition: all 0.3s ease;

    -moz-transition: all 0.3s ease;

    -o-transition: all 0.3s ease;

    transition: all 0.3s ease;

	padding-top:3px;

	padding-bottom:5px;

	font-family:Arial, Helvetica, sans-serif;

	font-size:12px;

}

.wrap-menu .address{

	display:block;

	color:#fff;

	text-decoration:none;

	webkit-transition: all 0.3s ease;

    -moz-transition: all 0.3s ease;

    -o-transition: all 0.3s ease;

    transition: all 0.3s ease;

	padding-top:3px;

	padding-bottom:5px;

	font-family:Arial, Helvetica, sans-serif;

	font-size:12px;

	line-height:24px;

	text-transform:none;

}

.wrap-menu .plugin{

	display:inline-block;

	text-decoration:none;

	webkit-transition: all 0.6s ease;

    -moz-transition: all 0.6s ease;

    -o-transition: all 0.6s ease;

    transition: all 0.6s ease;

	font-family:Arial, Helvetica, sans-serif;

	font-size:20px;

	line-height:24px;

	text-transform:none;

}

.wrap-menu .plugin:hover{

	transform: rotate(360deg);

}

.wrap-menu .plugin .bgfa{

	color:#3d5a98

}

.wrap-menu .plugin .bggg{

	color:#fc0404

}

.wrap-menu .plugin .bgyo{

	color:#0CF

}

.copy{

	/*box-shadow:0px 1px 18px #999;*/

	background:#e1261c;

	font-size:11px;

	padding:8px 0px 8px 0;

	color:#fff;

}

.copy span{

	width:100%;

	float:left;

	padding-top:2px;



}

.padding-0{

	padding:0px;

}

.marquee-brands{

	width: 100%;

    height: auto;

    margin:0;

    float: left;

    padding: 0px;

    overflow: hidden;

    /*box-shadow: 0 1px 12px #cecece;*/

    border-radius: 0px;

}

.marquee-brands ul{

	width: 3000px;

    overflow: hidden;

    height: 100%;

    margin: 0px;

    padding: 0px;

}

.marquee-brands ul li{

	width:auto;

	height:auto;

	margin:8px 0 8px 8px;

	padding:2px;

	display:inline;

	box-sizing: border-box;

	border:1px #0092dd solid;

	/*border-radius:0 0 2px 2px;*/

	float:left;

}

.marquee-brands ul li img{

	height:60px;

	max-height:80px;

	width:auto;

}

.marquee-brands ul li:hover{

	border:1px #e11313 solid;

	

}

/********* bat dau menu *********/



/******** ket thuc category ***************/

.box_category {

    border-bottom: 1px #e1261c solid;

    width: 100%;

    float: left;

	margin-bottom:12px;

}

.box_category .title_box_category {

    width: auto;

    height: auto;

    margin-bottom: -1px;

    padding-top: 5px;

    border-bottom: 4px #e1261c solid;

    float: left;

    z-index: 999;

    color: #e1261c;

    font-size: 24px;

    line-height: 40px;

    text-transform: uppercase;

    font-weight: 100;

	font-family: Open Sans;

}

.box_category .title_box_category h1{

	font-weight:600;

	font-size:20px;

	padding-top:0px;

	margin-top:0px;

}

.wrap-box{

	width:100%;

	/*height:100%;*/

	height:auto;

   

	/*background:#0092dd;*/

	/*box-shadow: 0px 0px 10px -4px #333;*/

    transition: all 0.3s ease-in-out;

	/*cursor:pointer;*/

	color:#222222;

	float:left;

	/*border:1px #ebeef2 solid;*/

	/*background:#fff;*/

	/*box-shadow: 0 3px 8px #CCC;*/

	box-sizing:border-box;

	background:#FFF;

	padding-bottom:30px;

	margin-bottom:30px;

	z-index:1;

	display:inline-block;

	position: relative;

	border-top:1px #f2f2f2 solid;

}

.wrap-box:hover{

	/*background:#0092dd;

	background: rgba(0,146,221,0.7);*/

    transition: all 0.3s ease-in-out;

	color:#FFF;

	box-shadow: 0 3px 8px #CCC;

	z-index:999;

}

.padding-wrap-box{

	padding:0 8px;

}

.wrap-box h2{

	text-transform:uppercase;

    /*font-weight: 500;

    font-family: Open Sans;*/

	font-weight:normal;

	font-family:Arial, Helvetica, sans-serif;

	font-size:20px;

	color:#dc514e;

	padding-bottom:8px;

	/*border-bottom:1px #f2f2f2 solid;*/

	transition: all 0.3s ease;

	cursor:pointer;

}

.product-info{

	font-size:12px;

	color:#333;

	margin-bottom:10px;

	line-height: 1.5;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden;

    text-overflow: ellipsis;

	width:100%;

	display: -webkit-box;

	height:35px;

}



.wrap-box .p{

	width:100%;

	float:left

}

.wrap-box:hover h2{

	color:#dc514e !important;

	transition: all 0.3s ease;

}

.wrap-box:hover .a, .category :hover .more-detail .a{



	text-decoration:none;

	float:right;

	transition: all 0.3s ease 0s;

}

.sale-box {

    position: absolute;

    top: 0;

	right: 0;

    overflow: hidden;

    height: 100px;

    width: 150px;

    text-align: center;

    z-index: 10;

}



.sale-label {

    font: normal 15px/18px Arial, Helvetica, sans-serif;

    color: #fff;

    padding: 35px 0 10px;

    width: 160px;

    text-align: center;

    text-transform: uppercase;

    display: block;

    position: absolute;

    

    top: -11px;

	left: auto;

 	right: -58px;

    z-index: 1;

    -webkit-transform: rotate(-45deg);

    -ms-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

	-webkit-transform: rotate(45deg);

  	-ms-transform: rotate(45deg);

  	-o-transform: rotate(45deg);

  	transform: rotate(45deg); 

  	background: #dc514e;

  	font-size: 16px;

}

.fa-stack{

	cursor:pointer;

}

.fa-circle-cart{

	font-size:60px;

	color:#dc514e;

	transition: all 0.3s ease 0s;

	cursor:pointer;

}

.wrap-box:hover .fa-circle-cart{

	color:#0092dd;

	transition: all 0.3s ease 0s;

	cursor:pointer;

}

.view-detail{

	color:#000000;

	text-decoration:none;

	text-transform:uppercase;

	font-size:11px;

	transition: all 0.3s ease 0s;

	font-weight:normal;

	padding-left:10px;

}

.view-detail:hover{

	color:#dc514e;

	transition: all 0.3s ease 0s;

}

/******** back to top *********/

#elevator_item {

width: 40px;

height: 40px;

position: fixed;

right: 15px;

bottom: 10px;

-webkit-transition: opacity .4s ease-in-out;

-moz-transition: opacity .4s ease-in-out;

-o-transition: opacity .4s ease-in-out;

opacity: 1;

z-index: 100020;

display: none;

}

#elevator_item.off {

opacity: 0;

visibility: hidden

}

#elevator, #elevator_bottom, #elevator_center {

display: block;

width: 40px;

height: 35px;

background: url(../images/icon_top.png) center center no-repeat;

background-color: #444;

background-color: rgba(0,0,0,.6);

border-radius: 2px;

box-shadow: 0 1px 3px rgba(0,0,0,.2);

cursor: pointer;

margin-bottom: 4px

}

/*** xem chi tiet hinh anh san pham **********/

.lc_hinh{

	width:100%;

	margin:10px 0px 10px 0px;

	padding:0px;

	float:left;

	height:auto;

	position:relative;

}

.lc_hinh .lch_top{

	width:100%;

	height:320px;

	margin:0px;

	padding:0px;

	float:left;

	overflow:hidden;

	background:#fff;

	/*box-shadow:0px 1px 10px #999;*/

	border: 1px solid #ebeef2;

	border-radius:4px;

	position:absolute;

}



.lc_hinh .lch_top img{

	border-radius:4px;

	width:auto;

	max-width:92%;

	height:auto;

	max-height:92%;

}

/*.lc_hinh .lch_bottom{

	width:220px;

	height:50px;

	margin:330px 0 0 0px;

	padding:0px;

	float:left;

	overflow:hidden;

}

.lch_bottom .lchb_lr{

	width:14px;

	height:50px;

	margin:10px 0px 0px 0px;

	padding:0px;

	float:left;

}

.lch_bottom .lchb_lr img{

	border:none;

}

.lch_bottom .lchb_center{

	width:220px;

	height:50px;

	margin:0px 0px 0px 0px;

	padding:0px;

	float:left;

	overflow:hidden;

}

.lchb_center ul{

	width:220px;

	height:50px;

	margin:0px;

	padding:0px;

	float:left;

	list-style-type:none;

}

.lchb_center ul li{

	margin:0px;

	padding:0px;

	float:left;

	width:50px;

	height:50px;

	list-style-type:none;

	overflow:hidden;

}

.lchb_center ul li img{

	width:50px;

	height:50px;

	margin:0px;

	padding:0px;

	float:left;

	border:none;

}*/

.lc_hinh .lch_bottom{

	width:100%;

	height:auto;

	margin:330px 0 0 0px;

	padding:0px;

	float:left;

	overflow:hidden;

	position:relative;

	transition: all 0.3s ease-in-out;

}

.lch_bottom:hover .lchb_lr, .lch_bottom:hover .lchb_lrn{

	display:block;

	transition: all 0.3s ease-in-out;

}

.lch_bottom .lchb_lr{

	width:32px;

	height:32px;

	margin:6% 0px 0px 0px;

	padding:0px;

	float:left;

	position:absolute;

	left:0px;

	top:0;

	z-index:999;

	background:url(../images/icon_left.png) center #1ba4ec no-repeat;

	background-size: auto 80%;

	border-radius:4px;

	cursor:pointer;

	display:none;

	transition: all 0.3s ease-in-out;

	opacity:0.6;

}

.lch_bottom .lchb_lr:hover, .lch_bottom .lchb_lrn:hover{

	opacity:1;

}

.lch_bottom .lchb_lr img{

	border:none;

}

.lch_bottom .lchb_lrn{

	width:32px;

	height:32px;

	margin:10% 0px 0px 0px;

	padding:0px;

	float:right;

	position:absolute;

	right:0px;

	top:0;

	z-index:999;

	background:url(../images/icon_right.png) center #1ba4ec no-repeat;

	background-size: auto 80%;

	border-radius:4px;

	cursor:pointer;

	display:none;

	transition: all 0.3s ease-in-out;

	opacity:0.6;

	

}

.lchb_lrn, lchb_lr{

	color:#115c9b;

	font-size:30px;

}

.lch_bottom .lchb_center{

	width:100%;

	height:auto;

	margin:0px 0px 0px 0px;

	padding:0px;

	float:left;

	overflow:hidden;

}

.lchb_center ul{

	width:100%;

	height:auto;

	margin:0px;

	padding:0px;

	float:left;

	list-style-type:none;

	background:#FFF !important;

}

.lchb_center ul li{

	margin:0px;

	padding:0px;

	float:left;

	width:25%;

	height:auto;

	list-style-type:none;

	overflow:hidden;

}

.lchb_center ul li a{

	background:#FFF !important;

	width:100%;

	height:auto;

	text-align:center;

}

.lchb_center ul li img{

	width:96%;

	height:auto;

	margin:0px;

	padding:0px;

	float:left;

	border:none;

	background:#FFF !important;

	padding:3px;

	border:1px #ebeef2 solid;

	box-sizing:border-box;

}

#body .wrap .content .center .wrap-products .wrap-details .detail_info{

	width:100%;

	float:left;

	height:auto;

	margin:10px 0 0 20px;

	padding:0px;

	font-size:14px;

}

.detail_info .info_name{

	width:100%;

	padding:10px 0px;

	margin-top:8px;

	font-size: 24px;

    text-transform: capitalize;

    font-family: Arial;

    color: #353d41;

	border-bottom: 1px #ebeef2 solid;

}

.detail_info .info_ms{

	width:100%;

	margin-right: 5px;

    margin-left: 0;

	margin-top:10px;

    color: #3E474B;

    font-weight: bold;

	font-size:14px;

}

.product .add-cart, .info_ms .add-cart {

    width: 25%;

    height: 30px;

    margin: 8px 2% 0 0%;

    padding: 6px 0px 3px 0px;

    /* background: url(../images/icon-info.png) left center no-repeat; */

    font-family: Verdana, Arial, Helvetica, sans-serif;

    font-size: 12px;

    text-align: center;

    float: right;

    background: #ff6346;

    border-radius: 4px;

    color: #FFF;

}

.product .view-details:hover, .product .add-cart:hover, .info_ms .add-cart:hover {

    transition: all 0.3s ease 0s;

    background: #09F;

}

.product-details{

	font-size:14px;

}



/******* Gio hang *********/

.form-contact .txt{

	padding: 3px 5px;

	width: 400px;

	border: 1px solid #D8D3D0;

	border-radius: 3px;

	outline: medium none;

	color: #036 !important;

	font-weight: lighter;

	font-size: 13px !important;

	margin-top:5px;

}

/*

input[type="text"]:focus, textarea:focus {

    outline: 0px none;

    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset, 0px 0px 8px rgba(82, 168, 236, 0.6);

    border-color: rgba(82, 168, 236, 0.8);

}*/

input[type="text"], textarea, select {

    box-sizing: border-box;

    font: 100% Arial,Tahoma,Helvetica,sans-serif;

    border-radius: 3px;

    color: #666 !important;

    margin: 0px 3px 0px 0px;

    padding: 6px 3px 5px;

    max-width: 100%;

}

.form-contact .txtare{

	padding: 3px 5px;

	width: 400px;

	height: 200px;

	border: 1px solid #D8D3D0;

	border-radius: 3px;

	outline: medium none;

	color: #036 !important;

	font-weight: lighter;

}

.form-contact .myButton {

	-moz-box-shadow:inset 0px 1px 0px 0px #cf866c;

	-webkit-box-shadow:inset 0px 1px 0px 0px #cf866c;

	box-shadow:inset 0px 1px 0px 0px #cf866c;

	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d0451b), color-stop(1, #bc3315));

	background:-moz-linear-gradient(top, #d0451b 5%, #bc3315 100%);

	background:-webkit-linear-gradient(top, #d0451b 5%, #bc3315 100%);

	background:-o-linear-gradient(top, #d0451b 5%, #bc3315 100%);

	background:-ms-linear-gradient(top, #d0451b 5%, #bc3315 100%);

	background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);

	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d0451b', endColorstr='#bc3315',GradientType=0);

	background-color:#d0451b;

	-moz-border-radius:3px;

	-webkit-border-radius:3px;

	border-radius:3px;

	border:1px solid #942911;

	display:inline-block;

	cursor:pointer;

	color:#ffffff;

	font-family:arial;

	font-size:13px;

	padding:6px 24px;

	text-decoration:none;

	text-shadow:0px 1px 0px #854629;

}

.form-contact .myButton:hover {

	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bc3315), color-stop(1, #d0451b));

	background:-moz-linear-gradient(top, #bc3315 5%, #d0451b 100%);

	background:-webkit-linear-gradient(top, #bc3315 5%, #d0451b 100%);

	background:-o-linear-gradient(top, #bc3315 5%, #d0451b 100%);

	background:-ms-linear-gradient(top, #bc3315 5%, #d0451b 100%);

	background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);

	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bc3315', endColorstr='#d0451b',GradientType=0);

	background-color:#bc3315;

}

.form-contact .myButton:active {

	position:relative;

	top:1px;

}

.title-h1{

	width:100%;

	padding:8px 0px;

	

	text-align:center;

	margin:10px 0px;

	color:#09F

}

.title_giohang{

	background:#f97d2b;

	padding:5px;

	color:#fff;

	font-weight:bold;

	font-size:14px;

	text-align:center;

	font-weight:400;

	border: 1px solid #ebeef2;

}



.bg_giohang1{

	text-align:center;

	color:#000000;

	padding:5px;

	background:#EEEEEE;

	font-size:13px;

	border: 1px solid #fff;

	

}

.bg_giohang1 a{

	color:#0066FF;

	text-decoration:none;

}

.bg_giohang1 a:hover{

	color:#FF0000;

	text-decoration:none;

}

@media screen and (min-width: 1100px) {

	.menu ul li a{

		white-space:nowrap;

	}

	.menu ul li{

		padding-left:2.8%;

		padding-right:2.8%;

		white-space:nowrap;

	}

}

@media (max-width: 1100px) and (min-width: 1024px) {

	.menu ul li{

		padding-left:2.2%;

		padding-right:2.2%;

		white-space:nowrap;

	}

}

@media (max-width: 1023px) and (min-width: 800px) {

	.menu ul li a{

		white-space:nowrap;

	}

	.menu ul li{

		/*padding-left:28px;

		padding-right:28px;*/

		padding-left:1.5%;

		padding-right:1.5%;

		white-space:nowrap;

		font-size:12px;

	}

}

@media (max-width: 850px) and (min-width: 768px) {

	.header-text .text-bottom{

		font-size:28px;

	}

}

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

	.menu ul li a{

		white-space:nowrap;

	}

	.menu ul li{

		padding-left:22px;

		padding-right:22px;

		white-space:nowrap;

		font-size:12px;

	}

	.header{

		background:none;

	}

	.wrap-box{

		margin-top:15px;

	}

	.padding-wrap-box {

		padding: 0 0px;

	}

}

/********* ket thuc menu *********/



/******** bat dau category ***************/

@media (max-width: 1272px) and (min-width: 1025px) {

	.category a .wrap-name h2, .category a .wrap-name2 h2{

		font-size:30px;

	}

}

@media (max-width: 1025px) and (min-width: 900px) {

	.category a .wrap-name h2, .category a .wrap-name2 h2{

		font-size:29px;

	}

	.round{

		width:60px;

		height:60px;

		border-radius:60px;

	}

	.category a .wrap-name i, .category a .wrap-name2 i{

		font-size:40px;

	}

}

@media (max-width: 768px) and (min-width: 300px)  {

	.header{

		padding-top:5px;

		padding-bottom:5px;

		margin-top:0px;

		/*margin-top:5px;*/

	}

	.padding-xs-0{

		padding-left:0px;

		padding-right:0px;

	}

	.title_box_category h1 span{

		padding-left:15px;

	}

	.banner{

		margin-bottom:3%;

	}



	.category a{

		margin-bottom:3%;

	}

	.category a .wrap-name h2, .category a .wrap-name2 h2{

		font-size:20px;

		/*margin:0px;

		padding:0px;*/

	}

	.round{

		width:50px;

		height:50px;

		border-radius:50px;

	}

	.category a .wrap-name i, .category a .wrap-name2 i{

		font-size:35px;

	}

	.wrap-name p, .wrap-name2 p{

		/*text-overflow: ellipsis;

		white-space: nowrap;

		overflow: hidden;

		width:50%;

		display:block;*/

		/*height:24px;

		overflow:hidden;*/

	}

	.product{

		/*width:94%;*/

	}

	.about-home img{

		width:100%;

		height:auto;

		margin-right:12px;

		float:left;

	}

	.box_category .title_box_category h1{

		font-size:24px;

	}

	.add-to-cart{

		display:none;

	}

	.padding-wrap-box{

		border-right:1px #f2f2f2 solid;

	}

	.product .name{

		height:40px !important;

	}

}

@media (max-width: 320px) {

	.wrap-box h2{

		font-size:14px;

	}

	.view-detail{

		width:100%;

		float:left;

		padding-left:0px;

		padding-top:10px;

	}

	.add-to-cart{

		display:none;

	}

}