/* CSS Document */



*{

	margin: 0;

	padding: 0;

}

body{

	margin: 0;

	padding: 0;

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

	font-size: 14px; 

	text-align: center;

	background-color: #efefef;

}

div{

	margin: 0;

	padding: 0;

}

img {

	border: none;

}

ul ,li{

	list-style: none;

}

a {

	text-decoration: none;

	color: black

}

.row.container {

	width: 1200px;

	margin: auto;

}

.textover {

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

}

.title-side,

.title-inclined {

	background-color: #2284ff;

	text-transform: uppercase;

	font-size: 15px;

	font-weight: bold;

	color: #fff;

	line-height: 35px;

	padding: 0px 20px;

}

.title-side i,

.title-inclined i {

	margin-right: 10px;

}

.title-inclined {

	display: inline-block;

	position: relative;

	float: left;

}

.title-inclined:after {

	left: 100%;

	border: solid transparent;

	content: " ";

	height: 0; width: 0px;

	position: absolute;

	pointer-events: none;

	border-color: rgba(136, 183, 213, 0);

	border-left-color: #2284ff;

	border-width: 35px;

	border-bottom: none;

}







/************** HEADER **************/

#header {


}

#header > .row.container > .col-xs-12 > .col-xs-12 {

	background-image: url(../images/bg-top.png);

	background-repeat: no-repeat;

	background-position: right top;

	/*padding: 14px 30px 20px;*/

	 padding-top: 14px;
	
	padding-bottom: 20px; 
}

#header > .container:first-child {

	position: relative;

	/*padding-top: 14px;

	padding-bottom: 20px;*/

}

#header .container a#logo {

	float: left;

}

#header .container > div {

	float: left;

}

#header .container p {

	color: #0089d0;

	font-weight: bold;

	font-size: 24px;

	font-family: "Times New Roman", Georgia, Serif;

}

#header .container p#comp-name {

	font-size: 25px;

	text-transform: uppercase;

	color: #e5342e;

	font-family: 'Arial';

	margin-bottom: 0px;

	margin-left: 30px;

	margin-top: 16px;

}

#header .container > img {

	position: absolute;

	top: 0px; right: 0px;

}

#header .menu-top {

	background-color: #039dec;

	position: relative;

}

#header .menu-top.fixed {

	position: fixed;

	top: 0px; left: 0px;

	width: 100%;

	z-index: 9999;

}

#header .menu-top #btn-search-handler,

#header .menu-top #btn-menu-handler {

	display: none;

	position: absolute;

}

#header form {

	text-align: right;

}

#header #txt-keyword {

	background-image: url(../images/txt-search.png);

	background-repeat: no-repeat;

	background-position: right 3px center;

	padding: 3px 25px 3px 6px;

	margin-top: 3px;

}





/************** MENU TOP **************/

ul#menu-top {}

ul#menu-top > li {

	float: left;

	background-color: #039dec;

	position: relative;

}

ul#menu-top > li.active {

	background-color: #333;

}

ul#menu-top > li.active a {

	border-top: 2px solid #eee;

	padding: 7px 14px;

}

ul#menu-top > li a {

	padding: 8px 14px;

	display: block;

	color: #fff;

	text-transform: uppercase;

}

ul#menu-top > li:hover {

	background-color: #558;

}

ul#menu-top > li:hover a {

	text-decoration: none;

	border-top: 2px solid #eee;

	padding: 7px 14px;

}

ul#menu-top > li > ul {

	position: absolute;

    background-color: #fff;

    visibility: hidden;

	left: 0px; top: 220%;

	opacity: 0;

	text-align: left;

	min-width: 80px;

	z-index: 1000;

	-webkit-transition: all 0.1s ease-in-out;

	-moz-transition: all 0.1s ease-in-out;

	-ms-transition: all 0.1s ease-in-out;

	-o-transition: all 0.1s ease-in-out;

	transition: all 0.1s ease-in-out;

    border-left: 1px solid #039DEC;

    border-right: 1px solid #039DEC;

    /*border-bottom: 2px solid;*/

}

ul#menu-top > li:hover > ul {

	visibility: visible;

	top: 100%;

	opacity: 1;

}

ul#menu-top > li ul > li {

	border-bottom: 1px solid #039DEC;

	position: relative;

	background: linear-gradient(to left, #0179BA 50%, #fff 50%);

    background-size: 200% 100%;

    background-position: left bottom;

	-webkit-transition: all 0.1s ease-in;

	-moz-transition: all 0.1s ease-in;

	-ms-transition: all 0.1s ease-in;

	-o-transition: all 0.1s ease-in;

	transition: all 0.1s ease-in;

}

ul#menu-top > li ul > li:hover {

	/*background-color: #0179BA;*/

	background-position: right bottom;

}

ul#menu-top > li ul > li a {

	white-space: nowrap;

	color: #0179BA;

	text-align: left;

}

ul#menu-top > li ul > li:hover > a {

	color: #fff;

}

ul#menu-top > li ul > li > ul {

	position: absolute;

	left: 100%; top: 0px;

	display: none;

	border: 1px solid #039DEC;

	border-bottom: none;

}

ul#menu-top > li ul > li:hover > ul {

	display: block !important;

}

ul#menu-top > li ul > li > ul > li {}

ul#menu-top > li ul > li > ul > li a {}





/************** BANNER TOP **************/

#slider-home {

	margin-top: 20px;

}

#owl-banner {

	overflow: hidden;

	max-height: 470px;

}

#slider-home:not(.other-page) #owl-banner.owl-carousel .owl-item img {

	width: 100%;

	height: 100% !important;

}

#slider-home.other-page #owl-banner {

	max-height: 380px;

}

#slider-home .link-item {



}

#slider-home .link-item > a {

	display: block;

	padding: 5px;

	text-align: left;

	line-height: 60px;

	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#06a2f2+0,0396df+100 */

	background: #06a2f2; /* Old browsers */

	background: -moz-linear-gradient(top,  #06a2f2 0%, #0396df 100%); /* FF3.6-15 */

	background: -webkit-linear-gradient(top,  #06a2f2 0%,#0396df 100%); /* Chrome10-25,Safari5.1-6 */

	background: linear-gradient(to bottom,  #06a2f2 0%,#0396df 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#06a2f2', endColorstr='#0396df',GradientType=0 ); /* IE6-9 */

	font-size: 16px;

	font-weight: bold;

	color: #fff;

	border: 1px solid #018fd8;

	border-radius: 2px;

}

#slider-home .link-item > a:hover {

	text-decoration: none;

	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#28c4f4+0,25b8ff+100 */

	background: #28c4f4; /* Old browsers */

	background: -moz-linear-gradient(top,  #28c4f4 0%, #25b8ff 100%); /* FF3.6-15 */

	background: -webkit-linear-gradient(top,  #28c4f4 0%,#25b8ff 100%); /* Chrome10-25,Safari5.1-6 */

	background: linear-gradient(to bottom,  #28c4f4 0%,#25b8ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28c4f4', endColorstr='#25b8ff',GradientType=0 ); /* IE6-9 */



}

#slider-home .link-item > a img {

	float: left;

	margin-right: 10px;

	width: 90px; height: 60px;

}

#slider-home {}





/************** FOOTER **************/

#footer {

	background-color: #0599e5;

	border-top: 3px solid #0075b1;

	color: #fff;

	text-align: left;

	padding-top: 16px;

	padding-bottom: 16px;

}

#footer #com-name {

	text-transform: uppercase;

	font-weight: bold;

}

#footer .info-location,

#footer .info-mail,

#footer .info-mobile {

	background-position: left center;

	background-size: 32px 34px;

	background-repeat: no-repeat;

	min-height: 34px;

	margin-bottom: 8px;

	padding-left: 40px;

}

#footer .info-location {

	background-image: url(../images/ft-icon-location.png);

}

#footer .info-mail {

	background-image: url(../images/ft-icon-mail.png);

	line-height: 34px;

}

#footer .info-mobile {

	background-image: url(../images/ft-icon-mobile.png);

	line-height: 34px;

}

#footer .social-wrapper {

	text-align: right;

}

#footer .social-wrapper a {

	margin-left: 12px;

	display: inline-block;

}

#footer .statistics {

	margin-top: 10px;

}

#footer .statistics {}

#footer .statistics p {

	margin-bottom: 3px;

}

#footer .statistics p > a {

	display: block;

	float: right;

	line-height: 25px;

	color: #fff;

	font-size: 13px;

}

#footer .statistics p > a:nth-child(1) {

	width: 60px;

	text-align: right;

}

#footer .statistics p > a:nth-child(2) {

	text-align: left;

	width: 110px;

}

#footer .statistics p > a:nth-child(3) {

	width: 40px;

}





/************** HOME / PROTU WRAPPER **************/

.wrap-protu {

	position: relative;

}

.wrap-protu .protu-item {

	position: absolute;

	border: 1px solid #bbb;

	border-radius: 6px;

	background-color: #fff;

	overflow: hidden;

	-ms-transform: rotate(45deg); /* IE 9 */

	-webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */

	transform: rotate(45deg);

}

.wrap-protu .protu-item:hover .cover {

	background-color: #4790cc;

	opacity: 0.8;

}

.wrap-protu .protu-item:hover .text {

	display: block;

}

.wrap-protu .protu-item .cover {

	position: absolute;

	top: 0px; left: 0px;

	width: 100%; height: 100%;

	z-index: 1000;

}

.wrap-protu .protu-item .text {

	-ms-transform: rotate(-45deg); /* IE 9 */

	-webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */

	transform: rotate(-45deg);

	position: absolute;

	top: 42%; left: 3%;

	width: 100%;

	font-size: 16px;

	color: #fff;

	display: none;

	z-index: 1001;

	text-align: center;

}

.wrap-protu .protu-item .img-wrap {

	white-space: nowrap;

	text-align: center;

	height: 100%;

}

.wrap-protu .protu-item .img-wrap img {

	max-width: 90%;

	max-height: 90%;

	vertical-align: middle;

	-ms-transform: rotate(-45deg); /* IE 9 */

	-webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */

	transform: rotate(-45deg);

}

.wrap-protu .protu-item .img-wrap .helper {

	display: inline-block;

	height: 100%;

	vertical-align: middle;

}





/************** LEFT SIDEBAR **************/

#menu-left {

	

}

#menu-left .category-wrapper,

#menu-left .new-products {

	border: 1px solid #ddd;

	margin-bottom: 20px;

	background-color: #fff;

}

#menu-left .category-wrapper > ul {

	text-align: left;

}

#menu-left .category-wrapper > ul > li {

	font-weight: bold;

	margin-top: 7px;

}

#menu-left .category-wrapper > ul > li a {

	padding: 5px 12px;

	display: block;

	color: #444;

}

#menu-left .category-wrapper > ul > li > ul {}

#menu-left .category-wrapper > ul > li > ul > li {

	padding-left: 20px;

	font-weight: normal;

}

#menu-left .category-wrapper > ul > li > ul > li a {}

#menu-left .new-products .item {

	padding: 15px 10px;

	border-bottom: 1px dashed #555;

}

#menu-left .new-products .item:last-child {

	border-bottom: none;

}

#menu-left .new-products .item img {

	max-width: 80px;

	max-height: 50px;

	float: left;

	margin-right: 12px;

}

#menu-left .new-products {}





/************** RIGHT SIDEBAR **************/

#menu-right .support-wrapper {

	text-align: center;

}

#menu-right .support-wrapper .hotline,

#menu-right .support-wrapper .technical,

#menu-right .support-wrapper .zalo {

	background-repeat: no-repeat;

	background-position: left center;

	font-weight: bold;

	padding-left: 60px;

	margin-bottom: 10px;

	text-align: left;

}

#menu-right .support-wrapper .hotline {

	color: #d32843;

	font-size: 30px;

	font-family: "Times New Roman", Georgia, Serif;

	background-image: url(../images/support-phone.png);

}

#menu-right .support-wrapper .technical {

	color: #d32843;

	background-image: url(../images/support-staff.png);

}

#menu-right .support-wrapper .zalo {

	color: #d32843;

	background-image: url(../images/support-zalo.png);

	background-position: 12px;

}

#menu-right .support-wrapper .technical b,

#menu-right .support-wrapper .zalo b {

	color: #222;

}

#menu-right .support-wrapper,

#menu-right .fanpage-wrapper,

#menu-right .top-project {

	margin-bottom: 20px;

	border: 1px solid #ddd;

}

#menu-right .top-project {

	text-align: center;

}

#menu-right .top-project .item {

	padding: 10px;

}

#menu-right .top-project .item img {

	max-width: 100%;

	width: 100%;

}

#menu-right .top-project .item p {

	text-align: left;

	margin-top: 8px;

	margin-bottom: 0px;

}

#menu-right .bx-wrapper .bx-viewport {

	left: 0px !important;

}

.fb-page,

.fb-page span,

.fb-page span iframe[style] {

    width: 100% !important;

}



/************** PAGINATION **************/

ul.pagination {

	float: right;

}

ul.pagination .current,

ul.pagination .num ,

ul.pagination li > a {

	color: #444;

	font-weight: bold;

	margin-left: 10px;

}

ul.pagination .current {

	position: relative;

	float: left;

	margin-left: 10px;

	padding: 6px 12px;

	line-height: 1.42857143;

	color: #fff;

	text-decoration: none;

	background-color: #0599E5;

	border: 1px solid #ddd;

}

ul.pagination {}

ul.pagination {}







/************** MAIN CONTENT **************/

#content {

	margin-top: 20px;

	text-align: left;

}







/************** PRODUCT CATEGORY **************/

#product-category form {

	margin-top: 20px;

	margin-bottom: 20px;

}

#product-category form select {

	width: 115px;

	margin-left: 10px;

	height: 30px;

}

#product-category form label {

	margin-top: 5px;

}

#product-category #sort-product select,

#product-category #sort-product label {

	float: left;

}

#product-category #sort-price select,

#product-category #sort-price label {

	float: right;

}

#product-category .product-item {

	position: relative;

	margin-bottom: 15px;

	min-height: 200px;

}

#product-category .product-item .pr-img {

	position: absolute;

	width: 230px; height: 200px;

	top: 0px; left: 0px;

	border: 1px solid #ddd;

	background-color: #fff;

	text-align: center;

	white-space: nowrap;

	padding: 4px;

}

#product-category .product-item .pr-img span.helper {

	display: inline-block;
	height: 100%;
	vertical-align: middle;

}

#product-category .product-item .pr-img img {

	max-height: 100%;

	max-width: 100%;

	margin-left: -4px;

}

#product-category .product-item .pr-description {

	padding-left: 250px;

}

#product-category .product-item .pr-price {

	color: #f00;

	font-weight: bold;

	font-size: 15px;

	margin-bottom: 5px;

}

#product-category .product-item .buy-cart {



}

#product-category .notify {

	background-color: #fff;

	border: 1px solid #ddd;

	padding: 12px;

}

#product-category {}







/************** PRODUCT DETAIL **************/

#product-detail {}

#product-detail .img-detail {

	position: relative;

	margin-top: 20px;

}

#product-detail .wrap-cover {

	width: 290px; height: 235px;

	border: 1px solid #ddd;

	background-color: #fff;

	position: absolute;

	top: 0px; left: 0px;

	text-align: center;

}

#product-detail .wrap-cover span.helper {

	display: inline-block;

	height: 100%;

	vertical-align: middle;

}

#product-detail .wrap-cover #product-img-preview {

	max-width: 95%;

	max-height: 95%;

}

#product-detail .pr-detail {

	padding-left: 305px;

	min-height: 235px;

}

#product-detail .pr-detail .pr-name {

	font-size: 16px;

    text-transform: uppercase;

    margin-bottom: 16px;

}

#product-detail .pr-detail .pr-price {

	margin-bottom: 16px;

}

#product-detail .pr-detail .pr-price span {

	color: red;

    font-size: 30px;

    font-weight: bold;

}

#product-detail .pr-detail .pr-statistics {

	margin-bottom: 10px;

}

#product-detail .pr-detail .pr-quantity {}

#product-detail .pr-detail .pr-quantity > span {

	line-height: 30px;

    float: left;

}

#product-detail .pr-detail .pr-quantity .input-group {

	width: 130px;

	float: left;

	margin-left: 6px;

}

#product-detail .pr-detail .pr-quantity .input-group input {

	text-align: center;

	font-weight: bold;

}

#product-detail .detail-product {

	margin-top: 20px;

}

#product-detail .detail-product .tabs_text {

	border: 1px solid #ccc;

	z-index: 1;

	padding: 20px;

	background-color: #fff;

}

#product-detail .detail-product .tabs_text .tabs {

	position: relative;

	overflow: hidden;

}

#product-detail .detail-product .tabs_text .tabs * {

	max-width: 100%;

}

#product-detail .detail-product #tabs {

    margin-bottom: 0px;

    z-index: 2;

    padding-left: 15px;

}

#product-detail .detail-product #tabs > li {

	float: left;

	border: 1px solid #ccc;

	border-bottom: none;

	margin-right: 8px;

}

#product-detail .detail-product #tabs > li a {

	background-color: #dadada;

    padding: 8px 14px;

    display: block;

}

#product-detail .detail-product #tabs > li.active {



}

#product-detail .detail-product #tabs > li.active a {

	background-color: #fff;

	font-weight: bold;

}

#product-detail .detail-product {}

#product-detail .detail-product {}





/************** LIST NEWS **************/

#list-news .news-item {

	margin: 10px 0px;

	background-color: #fff;

	padding: 0px 14px;

	border-right: 1px solid #ddd;

}

#list-news .news-item:not(:last-child) {

	border-bottom: 1px solid #ddd;

}

#list-news .news-item .img_wrapper {

	height: 125px;

	white-space: nowrap;

	text-align: center;

	position: relative;

}

#list-news .news-item .img_wrapper .helper {

	display: inline-block;

	height: 100%;

	vertical-align: middle;

}

#list-news .news-item .img_wrapper img {

	vertical-align: middle;

	width: 100%;

}





/************** DETAIL NEWS **************/

.otherNews {

	padding: 20px 14px 14px;

	background-color: #fff;

	border: 1px solid #ddd;

}





/************** CONTACT **************/

#contact {}

#contact #frmContact {

	border: 1px solid #0DA2D4;

	padding: 12px;

	background-color: #fff;

}

#contact input[type="text"]:not([name="security"]),

#contact textarea {

	width: 100%;

}

#contact p.btn {

	padding-left: 0px;

}

#contact .btn input {



}





/************** STATIC PAGE **************/

#static-page {}

#static-page .detail {

	overflow: hidden;

	line-height: 25px;

	text-align: justify;

	padding: 14px;

	background-color: #fff;

	border: 1px solid #ddd;

}
@media screen and (min-width: 992px) {
	#owl-banner.owl-carousel .owl-item img {
		width: 100%; height: 400px;
	}
}