@charset "utf-8";
/* CSS Document */

body{
	/*background-color: #fff;*/
	
}
.price-sale{
	color:red;
}
.uppercase {
text-transform: uppercase;
}
.mt20{
	margin-top: 20px !important;
}
.red{
	color: red !important;
}
.count_all{
	font-weight: normal !important;
	font-size: 12px;
	text-transform: lowercase !important;
	line-height: 33px;
	margin-left: 3px;}
.hidden{display: none !important}
/*++++++++++LAYOUT+++++++++++*/
div#wrapper {position: relative;width: 100%;margin: 0px auto;}
section#top-bar{width: 100%; height: auto; background-color: #fdfdfd;}
section#top-bar ul.navbar-icon{float: left; list-style: none; margin:0; padding:0; background-color: #f5f5f5; border-radius: 4px; width: 100%}
section#top-bar ul.navbar-icon li{float: left;}
section#top-bar ul.navbar-icon li a{display: block; height: 35px; line-height: 35px; color: #000; text-align: center; margin-left: 15px;}
section#top-bar ul.navbar-icon li a:hover{color: #000;}

header#header {width: 100%; background-color: #ffffff; z-index: 10;}
header#header .container-fluid{position: relative;}


div#banner{position: relative; text-align: left; z-index: 1;}
div#banner img, div#banner object{max-width: 100%; max-height: 110px;}
div#banner h1{height: 0px; margin:0;text-indent: -9999px;}

header#header .position{position: absolute; top: 30%; right: 0px; z-index: 3; width: 385px; padding: 0px 15px; margin: 0px;}

div#search{position: relative; width: 100%; margin-top: 39px; z-index: 3;}
div#search p{margin:0;}

div#hotline{float: left; width: 49%; margin-top: 35px;}
div#hotline span {color: #f00;}
div#shopping-cart{float: right; width: 49%;  margin-top: 40px;}
div#hotline p, div#shopping-cart p{margin: 0; text-align: center;}
div#hotline p a, div#shopping-cart p a{position: relative; display: inline-block; color: #666; text-transform: uppercase;}
div#hotline p a:hover, div#shopping-cart p a:hover, div#shopping-cart p a:hover i{color: #f00;border-color: #f00;}

div#hotline i{font-size: 2.5em;vertical-align: top;}
div#hotline span{display: inline-block; margin-left: 5px;}

div#shopping-cart i{display: inline-block; width: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #666; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%;}
div#shopping-cart span{position: absolute; display: inline-block; width: 17px; height: 17px; line-height: 17px; color: #fff; font-size: 13px; text-align: center; top: -7px; right: -5px; background-color: #f00; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%;}

section#slideshow{position: relative; width: 100%; z-index: 1; overflow: hidden;}

section#slide-product{margin: 30px 0px;}
section#slide-product .col-xs-12 span{display: block; margin-top: 5px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

section#page-wrapper{position: relative; z-index: 1;}

div.i-title, div.i-orderby, div.i-content{float: left; width: 100%;}
div.i-title{}

div.index-product-title {position:relative;}
div.index-product-title span.view-all {
    position: absolute;
    top: 5px;
    padding-left: 10px;
}

div.i-title h2{float: left; font-size: 16px; text-transform: uppercase; margin-bottom: 5px; margin-top: 0px; font-weight: 500; line-height: 30px; background: green; color: #ffffff; padding: 3px 10px 0px 10px;}
div.i-title h2 a{color: #ffffff;}
div.i-title ul{float: left; width: 100%; margin: 0; padding: 0 0 12px; list-style: none;}
div.i-title ul li{float: left; border-left: 1px solid #999;}
div.i-title ul li:first-child{border-left: 0px;}
div.i-title ul li:first-child a{padding-left: 0px;}
div.i-title ul li a{display: block; padding: 0px 10px; font-size: 17px; text-transform: uppercase; line-height: 1em;}
div.i-title ul li.active a{color: #f00;}
div.i-title ul li.active a, div.i-title ul li.active a:hover{border-color: transparent; background-color: transparent;}

body#index div.i-content, body#product div.i-content, body#search div.i-content, #news-wrapper #product div.i-content {padding: 0px 15px; box-shadow: 0px 0px 2px #cecece;}
div.i-content{margin-bottom: 15px; padding-bottom:40px;}

div.i-orderby{margin-bottom: 15px;}
div.i-orderby p.lbl{margin: 0px; line-height: 34px; text-transform: uppercase; text-align: right;}

body#index div.slick-slider button{top: -35px !important; margin: 0px !important; left: auto !important; border-radius: 0px; width: 26px; height: 26px; line-height: 26px;}
body#index div.slick-slider button:before{font-size: 25px !important;}
body#index div.slick-slider button:after{border-radius: 0px;}
body#index div.slick-slider .slick-prev{right: 37px !important;}
body#index div.slick-slider .slick-next{right: 5px !important;}

body#product div.slick-index button{top: -40px !important; margin: 0px !important; left: auto !important; border-radius: 0px; width: 26px; height: 26px; line-height: 26px;}
body#product div.slick-index button:before{font-size: 25px !important;}
body#product div.slick-index button:after{border-radius: 0px;}
body#product div.slick-index .slick-prev{right: 37px !important;}
body#product div.slick-index .slick-next{right: 5px !important;}
body#product div.slick-slider .box-product .name{ margin-top: 15px;}
body#product div.slick-slider .box-product .image a.add-to-cart{left: 15px;}





body#product div.slick-news-prod-index button{top: -40px !important; margin: 0px !important; left: auto !important; border-radius: 0px; width: 26px; height: 26px; line-height: 26px;}
body#product div.slick-news-prod-index button:before{font-size: 25px !important;}
body#product div.slick-news-prod-index button:after{border-radius: 0px;}
body#product div.slick-news-prod-index .slick-prev{right: 37px !important;}
body#product div.slick-news-prod-index .slick-next{right: 5px !important;}
body#product div.slick-news-prod-index .box-product .name{ margin-top: 15px;}
body#product div.slick-news-prod-index .box-product .image a.add-to-cart{left: 15px;}


body#account div.i-content{margin-top: 20px;}
body#account div.box-title{padding: 10px 15px; background-color: #ccc;}
body#account div.box-title h2{margin: 0px; font-size: 17px; text-transform: uppercase;}
body#account div.box-content{padding: 15px 15px 0px 15px; margin-bottom: 30px; border: 1px solid #ccc;}

div.more-promotion{ border-top: 1px solid #ccc;}
div.more-promotion a{display: block; padding: 17px 10px; text-align: center; font-size: 15px; text-transform: uppercase;}

div.tab-content .tab-pane {display: block;height: 0;overflow: hidden;}
div.tab-content .active {height: auto;overflow: visible;}

body#index  div.slick-slider .box-product{margin: 0px; padding: 15px; border: 0px;}
body#index  div.slick-slider .box-product .icon{position: absolute; width: 50px; text-align: center; top: 15px; right: 15px; z-index: 10; margin: 0px;}
body#index  div.slick-slider .box-product .name{ margin-top: 15px; font-size: 14px; text-align: left;}
body#index  div.slick-slider .box-product .image img{width: 95%;}
body#index  div.slick-slider .box-product .image a.add-to-cart{left: 15px;}
body#index  div.slick-slider .box-product .price{text-align: left; color: red}
body#index  div.slick-slider .box-product .price .price-sale{display: block; font-size: 14px; color: red}


div.row.list .box-product .name{text-align: left;}
body#index div.slick-index .slick-slide {border-left: 1px solid #e8e7e7}
div.box-product{position: relative; padding: 15px;     border-bottom: 1px solid rgb(239, 239, 239);
    height: 300px;
    border-right: 1px solid rgb(239, 239, 239);}
div.box-product-km, .box-product-slider {position: relative; padding: 15px; border: none !important; height: auto !important}
.box-product-cat {
	max-height: 275px !important;
	min-height: 260px !important;
}
.box-product-cat .name, .box-product-news .name {
	font-size:16px !important;
}

.box-product-news {
    height: 230px !important;
	max-height: 275px !important;
	min-height: 230px !important;
}


@media (max-width: 400px)
{
	.box-list-product {
		min-height: 300px !important;
		height: auto  !important;
	}
}
div.box-product .icon{position: absolute; width: 50px; text-align: center; bottom: 15px; right: 15px; z-index: 10; margin: 0px;}
div.box-product .icon span{display: block; width: 50px; height: 50px; line-height: 50px; color: #fff; font-weight: 400;}
div.box-product .icon span.hot{background: url('../images/icon_sp_hot.png') no-repeat center center;}
div.box-product .icon span.new{background: url('../images/icon_sp_new.png') no-repeat center center;}
div.box-product .icon span.sale{background: url('../images/icon_sp_sale.png') no-repeat center center;}

div.box-product .icon_sale{position: absolute; width: 50px; text-align: center; font-size: 11px; top: 1px; left: 1px; color:#ffffff; z-index: 10; margin: 0px; background-color:red;}

div.box-product .image{position: relative; z-index: 5; margin: 0px; padding-left: 0px; background-color: #fff; text-align: center;}
div.box-product .image img{width: 100%; height: auto; margin: 0px auto; opacity: 1;
	transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    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; -webkit-transition:all 0.3s ease-in-out;
}
div.box-product .image a.add-to-cart{position: absolute; bottom: 0%; left: 0px; right: 15px; opacity: 0; font-size: 17px; min-width: 130px; max-width:50%; display:block; align:center}
div.box-product.col-md-3 .image a.add-to-cart{ left: 25px;}
div.box-product .image a.add-to-cart i{margin-right: 10px;}
div.box-product .image a.add-to-favorite{position: absolute; bottom: 0; left: 0px; right: 0px; opacity: 0; text-transform: uppercase;}

div.box-product .name{position:relative; z-index: 10; margin: 5px 0px 5px; font-size: 14px; line-height: 1.42857; font-weight: 400; text-align: left; }
div.box-product.col-md-3 .name{ margin-top: 15px;}
div.box-product .desc{margin: 0px;}
div.box-product .desc a{display: block; color: #999; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
div.box-product .desc a:hover{color: #f00;}
div.box-product .more{margin: 0px;text-align: right;}

div.box-product .price {width: 100%; height: 49px; margin: 0px; text-align: left;}
div.box-product .price .percent{color: #769e2d;font-size: 20px;}
div.box-product .price .price-old{color: #999; text-decoration: line-through;}
div.box-product .price .price-sale{display: block; font-size: 14px; color: red}

div.box-product:hover .image img{opacity: 0.3; transform: scale(1.1);-moz-transform: scale(1.1);-webkit-transform: scale(1.1);}
div.box-product:hover .image a.add-to-cart, div.box-product:hover .image a.add-to-favorite{opacity: 1;}
div.box-product:hover .image a.add-to-cart{background-color: #769e2d;}
div.box-product:hover .image a.add-to-favorite{color: #d0202e;}

div.box-product .description {
	height: 35px;
    overflow: hidden;
    margin-bottom: 5px;
    font-size: 13px;
}

div.box-news{margin-bottom: 30px;}
div.box-news .image{position: relative; text-align: center;}
div.box-news .image.col-xs-5{padding-left: 0px; margin: 0px;}
div.box-news .image img{width: 100%;height: auto; margin: 0px auto;}
div.box-news .image a {display: block;
    position: absolute;top: 50%;left: 50%;border: 2px solid #fff;color: #fff;height: 36px;width: 36px;
    font-size: 20px;text-align: center;line-height: 32px;font-weight: 100;margin-top: -18px;margin-left: -18px;opacity: 0;border-radius: 50%;
    -moz-border-radius: 50%;-webkit-border-radius: 50%;-o-border-radius: 50%;-ms-border-radius: 50%;
    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;-webkit-transition: all 0.3s ease-in-out;
    transform: scale(0.2, 0.2);-webkit-transform: scale(0.2, 0.2);-moz-transform: scale(0.2, 0.2);-o-transform: scale(0.2, 0.2);-ms-transform: scale(0.2, 0.2);
}

div.box-news .name{margin-top: 0px;font-weight: 400; font-size: 16px; text-transform: uppercase;}
div.box-news .date{color: #999; margin: 0px; font-size: 14px;}
div.box-news .date span{margin-right: 10px;}
div.box-news .date i{color: #EB5858; margin-right: 5px; font-size: 13px;}
div.box-news .desc{text-align: justify;color: #666}
div.box-news .more{text-align: right;margin: 0px; font-style: italic;}
div.box-news .more a{}
div.box-news:after{content: ''; display: block; clear: both;}
div.box-news .image:before {content: '';position: absolute;top: 10px; right: 10px;bottom: 10px;left: 10px;border: 1px solid #ccc;cursor: pointer;
    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;-webkit-transition: all 0.3s ease-in-out;
}
div.box-news:hover .image:before{top: 0px; right: 0px; bottom: 0px; left: 0px; background-color: rgba(0,0,0,0.5);}

div.box-news:hover .image a{opacity: 1; transform: scale(1.5, 1.5);-webkit-transform: scale(1.5, 1.5);-moz-transform: scale(1.5, 1.5);-o-transform: scale(1.5, 1.5);-ms-transform: scale(1.5, 1.5);}
div.box-news:hover .name a, div.box-news:hover .more a{color: #f00;}

p#date-post{color: #999; margin: 0px; font-size: 14px;}
p#date-post span{margin-right: 10px;}
p#date-post i{color: #EB5858; margin-right: 5px; font-size: 13px;}

section#newsletter{margin-bottom: 60px;}
section#newsletter .col-md-4 h2{margin: 0px; padding: 8px 10px; text-align: center; color: #fff; font-size: 17px; text-transform: uppercase; background-color: #333;}
section#newsletter .col-md-4 div{border: 1px solid #ccc;border-top:0px;padding: 10px 15px 5px;}
section#newsletter .col-md-4 p{text-align: center; text-transform: uppercase;}

div#left-fixed{display: block; border: 1px solid #ccc;padding: 0px 10px;margin-top: 20px;}
ul#accordion ,ul#accordion ul{width:100%;list-style: none; margin: 0px; padding: 0px;}
ul#accordion li{position: relative;border-top:1px dotted #ccc;margin: 0px; padding: 0px;}
ul#accordion > li:first-child{border-top-color: transparent;}

ul#accordion a{position: relative; display: block; padding: 9px 10px; font-weight: 400; z-index: 1;}
ul#accordion li.active > a, ul#accordion li:hover > a{color: #f00;}
ul#accordion ul li.active > a, ul#accordion ul li:hover > a{color: #f00;}
ul#accordion ul ul li.active > a, ul#accordion ul ul li:hover > a{color: #f00;}

ul#accordion > li > i, ul#accordion > li > ul > li > i{position: absolute; width: 30px; height: 33px; right: 0px;top: 0px; line-height: 37px; z-index: 10; text-align: center; cursor: pointer;}
ul#accordion ul a{line-height: 1.3em; text-transform: none;}
ul#accordion ul a i{position: absolute; right: auto; left: 10px; top: 9px;}
ul#accordion ul ul a i{right: auto; left: 20px; top: 9px;}
ul#accordion ul a{padding-left: 20px;}
ul#accordion ul ul a{padding-left: 30px;}

ul.pagination li.active a, ul.pagination li a:hover{color: #fff; border-color: #E96496 !important; background-color: #E96496 !important;}
ul.pagination a{color: #222;padding: 6px 14px;}

ul.other-nav{list-style: none; margin: 0px; padding: 0px;}
ul.other-nav a{display: block; padding: 3px 0px;}
ul.other-nav i{margin-right: 10px;}

div.grid{margin-bottom: 30px; overflow: hidden;}
div.grid .grid-item{float: left; padding: 0px 15px; margin-bottom: 30px;}
div.grid .grid-item img{max-width: 100%; height: auto;}
div.grid .grid-item a{position: absolute; display: block; width: 100%;font-size: 2.3em;text-transform: uppercase;color: #fff;font-weight: 600;text-shadow: 1px 0 1px #000;text-align: center; top: 45%;z-index: 20;}
div.grid .grid-item:hover a{top: 50%;}

section#social{text-align: center;}
section#social .btn-social-icon{width: 60px; height: 60px; border-radius: 50%; margin: 10px;
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    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; -webkit-transition:all 0.3s ease-in-out;
}
section#social .btn-social-icon i{font-size: 33px; line-height: 60px;}
section#social .btn-social-icon:hover{
    transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

footer#footer{position: relative; width:100%; margin: 10px auto; z-index:1;
	border-top: 1px solid #c8c6c6;
	padding-top: 10px;
	margin-bottom: 30px !important;
	
    /*background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #cccccc 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #cccccc 100%);
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #cccccc 100%);
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(100, #cccccc));
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #cccccc 100%);
    background-image: linear-gradient(to top, #FFFFFF 0%, #cccccc 100%);*/
}
footer#footer h2.title {font-size: 17px; font-weight: 600; text-transform: uppercase; color: #333;}

footer#footer .col-xs-6 ul{list-style: none; width: 100%; margin: 0px -15px; padding: 0px;}
footer#footer .col-xs-6 ul li{width: 100%; margin-bottom: 5px; text-align: left;}
footer#footer .col-xs-6 ul i{margin-right: 5px;}
footer#footer p.icon span{display: inline-block; vertical-align: middle;}
footer#footer p.icon span:nth-child(2){margin-left: 5px; border-left: 1px solid #d0112b; padding-left: 5px;}
footer#footer p.icon i{width: 40px; height: 40px; color: #fff; border: 1px solid #d0112b; background-color: #d0112b; line-height: 40px; text-align: center; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;}

footer#footer img{max-width: 100%; height: auto;}

div#product-img{position: relative; height: 0px; padding: 15px 0px; overflow: hidden;}
div#product-img img{max-width: 100%; height: auto;}
/*div.product-img-large{margin-bottom: 100px;}*/
div.product-img-thumb{position: absolute; width: 100%; bottom: 0px; left: 0px;}
div.product-img-thumb p{margin-bottom: 5px; cursor: pointer; opacity: 0.7; transition: opacity 0.2s;}
div.product-img-thumb .slick-slide p:hover{opacity: 1 !important;}

div#product-content{padding: 15px 0px;}
div#product-content ul{list-style: none; padding: 0px; margin: 0px;}
div#product-content ul li{margin-bottom: 20px;}
div#product-content ul h2{font-size: 22px; margin-top: 0px; text-transform: uppercase;}
div#product-content ul .price span{display: block; font-size: 18px;}
div#product-content ul .price-old{text-decoration: line-through;}

div#product-content ul .price-sale{color: #f00;}
div#product-content ul input{display: inline-block; width: 100px; margin-left: 20px;}
div#product-content ul a.img-color{display: inline-block; width: 70px; margin-right: 5px; padding: 3px; border: 1px solid #f2f2f2;}
div#product-content ul a.img-color:hover, div#product-content ul a.img-color.active{border-color: #333;}
div#product-content ul a.img-color img{max-width: 100%; height: auto;}

div#product-order{box-shadow: 0px 0px 2px #333; padding: 15px 15px 10px; margin-bottom: 15px;}
div#product-order .share.icon-social{display: inline-block; text-align: center; width: 35px; height: 35px; line-height: 35px; background-color: red; border-radius: 50%;}
div#product-order .share.icon-social i {
	color: #ffffff;
}

div#product-ship{box-shadow: 0px 0px 2px #333; padding: 15px 15px 10px; background-color: #f7f7f7;}

div#contact-content h1, div#contact-content h2, div#contact-content h3, div#contact-content h4, div#contact-content h5, div#contact-content h6{margin-top: 0px;}

div#map-canvas{width: 100%; height: 350px; margin-bottom: 15px;}
div.pagination{clear: both; display: block; text-align: center; padding: 0px; margin: 0px;}
div.pagination ul{margin: 0px;}

.tooltip{white-space: nowrap;}
.modal {text-align: center;}
.modal:before {content: '';display: inline-block; height: 100%; vertical-align: middle;}
.modal-dialog{display: inline-block; width: 90%; vertical-align: middle; text-align: left;}
.modal-content{overflow: hidden;}
.modal-content input.form-control{}
.modal-header{background-color: #333;padding: 7px 10px;}
.modal-header h4{color: #fff; font-size: 15px; font-weight: 500; text-transform: uppercase;}
.modal-header .close{margin: 0px; color: #fff;}
.modal-footer{padding: 7px 15px;}

#notifyModal .modal-body{color: #f00; font-style: italic;}


@media (min-width:992px){
	

    div#news-index{ margin-top: 15px; }
    div#news-index .box-news{margin-bottom: 20px;}

	
	div.box-news.col-md-3:nth-child(4n+1){clear: both;}
	div.box-news.col-md-2:nth-child(6n+1){clear: both;}
}

@media (min-width:1200px){

    nav#navbar{position: relative;width: 100%; height: 46px; margin: 0px auto; z-index: 5; background-color: #fdfdfd;border: 1px solid #c8c6c6;}
    nav#navbar button#btn-menu{display: none;}

    nav#navbar ul.navbar-icon{float: left; list-style: none; margin:0; padding:0;}
    nav#navbar ul.navbar-icon li{float: left;}
    nav#navbar ul.navbar-icon li a{display: block; width: 35px; height: 35px; line-height: 32px; color: #fff; text-align: center; font-size: 21px; margin: 5px; border: 1px solid #fff; border-radius: 50%; background-color: #8c8c8c;}
    nav#navbar ul.navbar-icon li a:hover{color: #000;}

    nav#navbar ul.navbar-main{width: 100%; height: 46px; list-style: none; margin:0; padding:0; text-align: center;}
    nav#navbar ul.navbar-main > li{position: relative; display: inline-block; padding-bottom: 10px; background: url('../images/line_nav.png') no-repeat left 2px;}
    nav#navbar ul.navbar-main > li:first-child{background: none;}
    nav#navbar ul.navbar-main a{position: relative; z-index: 15; display: block; text-transform: uppercase; font-size: 16px; font-weight: 400;color: #000; padding: 12px 10px 11px;}
    nav#navbar ul.navbar-main li a img{top: -1px;position: relative;}
    nav#navbar ul.navbar-main li a i{display: none;}
    nav#navbar ul.navbar-main > li.active > a, nav#navbar ul.navbar-main > li:hover > a{ color: red;}
    nav#navbar ul.navbar-main ul:before{content: ''; display: inline-block; position: absolute; border-left: 7px solid transparent ; border-right:7px solid transparent ; border-bottom: 7px solid rgba(0,0,0,0.2); top: -6px; left: 30px;}
    nav#navbar ul.navbar-main ul:after{content: ''; display: inline-block; position: absolute; border-left: 6px solid transparent ; border-right:6px solid transparent ; border-bottom: 6px solid #fff; top: -5px; left: 31px;}
    nav#navbar ul.navbar-main ul ul:before{content: ''; display: inline-block; position: absolute; border-top: 7px solid transparent ; border-bottom:7px solid transparent ; border-right: 7px solid rgba(0,0,0,0.2); left: -13px; top: 12px;}
    nav#navbar ul.navbar-main ul ul:after{content: ''; display: inline-block; position: absolute; border-top: 6px solid transparent ; border-bottom:6px solid transparent ; border-right: 6px solid #fff; left: -12px; top: 13px;}

    nav#navbar ul.navbar-main ul, nav#navbar ul.navbar-main ul ul{position: absolute; display: none; list-style: none; text-align: left;  top: 45px;left: 0px;width: 265px;height: auto; margin:0;padding: 7px;background-color: #fff; border: 1px solid #bababa; box-shadow: -1px 2px 3px 1px #ccc; z-index: 30;}
    nav#navbar ul.navbar-main ul ul{top: -8px; left: 250px; z-index: 40;}
    nav#navbar ul.navbar-main ul li{width: 100%; padding: 0px; border-top: 1px dotted #ccc; box-shadow: none !important; background-color: #fff; background: none;}
    nav#navbar ul.navbar-main ul li:first-child{border-top: none;}
    nav#navbar ul.navbar-main ul li a{font-size: 14px;color: #333; font-weight: 400;padding: 4px 10px 4px 10px;background: none; text-transform: none; text-shadow: none;}

    nav#navbar ul.navbar-main ul li:hover > a{color: #fff; background-color: #009900; text-shadow: none;}
    nav#navbar ul.navbar-main li:hover > ul{display: block;-webkit-animation-name: fadeInUpSmall;animation-name: fadeInUpSmall;}
    nav#navbar ul.navbar-main ul li:hover > ul{display: block; -webkit-animation-name: fadeInRightSmall;animation-name: fadeInRightSmall;}



    div.box-product.col-lg-2:nth-child(6n+1){clear: both;}
    div.box-product.col-lg-2:nth-child(6n){border-right: 0px;}

    div.box-product.col-lg-4:nth-child(3n+1){clear: both;}
    div.box-product.col-lg-4:nth-child(3n){border-right: 0px;}

    div.box-product.col-lg-3:nth-child(4n+1){clear: both;}
    div.box-product.col-lg-3:nth-child(4n){border-right: 0px;}

    body#product #product-detail .col-lg-5{padding-right: 0px;}
    body#product #product-detail .col-lg-4{padding-right: 0px;}
    body#product #product-detail .col-lg-3{padding-left: 0px;}
}


@media (min-width: 1400px){
    .modal-dialog{width: 70%;}
}

@media (max-width: 1199px){
    nav#navbar{position:relative; width: 100%; z-index: 5;background-color: #fdfdfd;border: 1px solid #c8c6c6;}
    nav#navbar button#btn-menu{margin: 7px 0px; padding: 6px 12px; border: 1px solid #fff; color: #fff; background-color: green; border-radius: 0px;}

    nav#navbar ul.navbar-icon{float: right; list-style: none; margin:0; padding:0;}
    nav#navbar ul.navbar-icon li{float: left;}
    nav#navbar ul.navbar-icon li a{display: block; width: 35px; height: 35px; line-height: 32px; color: #fff; text-align: center; font-size: 21px; margin: 5px; border: 1px solid #fff; border-radius: 50%; background-color: #8c8c8c;}
    nav#navbar ul.navbar-icon li a:hover{color: #000;}

    nav#navbar ul.navbar-main ,nav#navbar ul.navbar-main ul{position: relative; width:100%;list-style: none; margin: 0px; padding: 0px; z-index: 100; background-color: #fff;}
    nav#navbar ul.navbar-main{display: none; margin-bottom: 15px;}
    nav#navbar ul.navbar-main li{position: relative;border-top: 1px dotted #ccc;margin: 0px; padding: 0px;}
    nav#navbar ul.navbar-main li:first-child{border-top: transparent;}
    
    nav#navbar ul.navbar-main a{position: relative; display: block; padding: 8px 10px; font-size: 18px; font-weight: 400;color: #000; z-index: 1;}
    nav#navbar ul.navbar-main li.active > a, nav#navbar ul.navbar-main li:hover > a{color: #fff; background-color: #333;}
    nav#navbar ul.navbar-main ul li.active > a, nav#navbar ul.navbar-main ul li:hover > a{color: #333; background-color: #666;}
    nav#navbar ul.navbar-main ul ul li.active > a, nav#navbar ul.navbar-main ul ul li:hover > a{color: #333; background-color: #999;}

    nav#navbar ul.navbar-main > li > i{position: absolute; width: 34px; height: 34px; right: 2px;top: 3px; color: #009900; line-height: 33px; z-index: 10; text-align: center; cursor: pointer;}
    nav#navbar ul.navbar-main ul a{line-height: 1.3em; text-transform: none;}
    nav#navbar ul.navbar-main ul a i{position: absolute; right: auto; left: 5px; top: 11px;}
    nav#navbar ul.navbar-main ul ul a i{right: auto; left: 20px; top: 11px;}
    nav#navbar ul.navbar-main ul a{padding-left: 25px;}
    nav#navbar ul.navbar-main ul ul a{padding-left: 40px;}
}


@media (max-width: 991px){

    div#banner{text-align: center;}

    div#search,  div#hotline{margin: 0px 0px 10px 0px;}
    div#shopping-cart{margin: 5px 0px 10px 0px;}
   
    

    nav#navbar-product{display: none;}

    div#news-index{margin-top: 15px;}
    
}

@media (min-width:992px) and (max-width: 1199px){
    div.box-product.col-md-4:nth-child(3n+1){clear: both;}
    div.box-product.col-md-4:nth-child(3n){border-right: 0px;}

    div.box-product.col-md-3:nth-child(4n){border-right: 0px;}
    div.box-product.col-md-3:nth-child(4n+1){clear: both;}

    div.box-product.col-md-6:nth-child(2n){border-right: 0px;}
    div.box-product.col-md-6:nth-child(2n+1){clear: both;}
}
@media (min-width:768px) and (max-width: 991px){
	div.box-product.col-sm-4:nth-child(3n+1){clear: both;}
    div.box-product.col-sm-4:nth-child(3n){border-right: 0px;}

    div.box-product.col-sm-6:nth-child(2n+1){clear: both;}
    div.box-product.col-sm-6:nth-child(2n){border-right: 0px;}

	div.box-news.col-md-3:nth-child(3n+1){clear: both;}
	div.box-news.col-md-2:nth-child(6n+1){clear: both;}
}

@media (min-width:481px) and (max-width: 767px){
	div.box-product.col-xs-4:nth-child(2n+1){clear: both;}
    div.box-product.col-xs-4:nth-child(2n){border-right: 0px;}

    div.box-product.col-xs-6:nth-child(2n){border-right: 0px;}
    div.box-product.col-xs-6:nth-child(2n+1){clear: both;}

	div.box-news.col-md-3:nth-child(2n+1){clear: both;}
		div.box-news.col-md-2:nth-child(6n+1){clear: both;}
}

@media (min-width: 768px){

}

@media (max-width: 767px){
	section#top-bar span{display: none;}
    
	div.i-title ul li:last-child{border-left: 0px;}

    div.box-product{border-top: 1px solid #ccc;}
    div.box-product.col-xs-6:nth-child(2n+1){clear: both;}
    div.box-product.col-xs-6:nth-child(2n){ border-left: 1px solid #ccc;}
    
}

@media (max-width: 620px){
	
}

@media (max-width: 600px){

}

@media (max-width: 580px){
   
	footer#footer h2#slogan{text-align: center;}
	footer#footer p#social{position: relative; top: auto; right: auto; float: left; width: 100%; text-align: center; margin: 10px 0px 0px;}
}

@media (max-width: 520px){
    /*div.box-product.col-md-3{width:100%; border-right: 0px;}
    div.box-product.col-md-3 .icon{ bottom: 15px;}
    div.box-product .name{margin-top: 20px;}
    div.box-product .image{float: none; width: 100%; padding: 0px;}
    div.box-product .icon{ bottom: 5px;}
    div.box-product .image a.add-to-cart{left: 15px;}*/



    div#news-index .box-news{width: 100%;}

    div.product-img-large{padding: 0px;}
    div.product-img-thumb{position: relative; width: 100%; top: auto; left: auto; margin: 15px 0px;}

	footer#footer div#navbar-bottom ul li{width: 25%;}
	footer#footer div#navbar-bottom ul a{white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
}

@media (max-width: 480px){

    div.i-title ul li{border: 0px;}
    div.i-title ul a{min-width: auto;}
    
    	div.box-news.col-xs-6:nth-child(2n+1){clear: both;}
div.box-news.col-sm-6:nth-child(2n+1){clear: both;}
    

}

@media (max-width: 420px){
	footer#footer .col-xs-6{width: 100%;}
	
}

@media (min-width: 401px){
	div.box-news .image.col-xs-5 a {margin-left: -25.5px;}
	div.box-news .image.col-xs-5:before{right: 25px;}
	div.box-news:hover .image.col-xs-5:before{right: 15px;}
	
	
	
}
@media (max-width: 400px){
    div.box-product{width: 100%; border-left: 0px;}
	div.box-news{width: 100%;}
	div.box-news .image.col-xs-5{width: 100%; margin-bottom: 15px;padding: 0px;}
	div.grid .grid-item{width: 100%;text-align: center;}
	div.box-product.col-md-3 .image a.add-to-cart{ left: 55px;}
	
}


/*======================CSS3================*/

.tranSlateTop {
	animation:tranSlateTop 1s infinite;
	-webkit-animation: tranSlateTop 1s infinite;
	-moz-animation: tranSlateTop 1s infinite;
	-o-animation: tranSlateTop 1s infinite;

}
@-webkit-keyframes tranSlateTop {
	from{ -webkit-transform: rotate(270deg) translateX(0px);}
	50%{-webkit-transform: rotate(270deg) translateX(5px);}
	to{-webkit-transform: rotate(270deg) translateX(0px);}
}
@-moz-keyframes tranSlateTop {
	from{ -moz-transform: rotate(270deg) translateX(0px);}
	50%{-moz-transform: rotate(270deg) translateX(5px);}
	to{-moz-transform: rotate(270deg) translateX(0px);}
}
@-o-keyframes tranSlateTop {
	from{ -o-transform: rotate(270deg) translateX(0px);}
	50%{-o-transform: rotate(270deg) translateX(5px);}
	to{-o-transform: rotate(270deg) translateX(0px);}
}

::-webkit-input-placeholder {font-size: 15px; color:#666;}
:-moz-placeholder {font-size: 15px; font-size: 14px; color:#666;}
::-moz-placeholder {font-size: 15px; color:#666;}
:-ms-input-placeholder {font-size: 15px; color:#666;}
.transitionAll{transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out;}
.transitionAll_1s{transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -ms-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; -webkit-transition:all 1s ease-in-out;}