@charset "UTF-8";

Trinh



/* Main */

:root {

	--color-red: #ec2d3f;

	--color-medium-red: #cc2c32;

	--color-dark-red: #c31829;

	--color-green: #28a745;

	--color-dark-green: #207d36;

	--color-black: #212529;

	--color-gray: #6c757d;

}



body {

	font-size: 14px;

	font-family: 'OpenSansRegular';

}



img {

	max-width: 100%;

	height: auto;

	vertical-align: top;

}



a,

input,

textarea {

	outline: none;

	padding: 0px;

}



a {

	color: inherit;

}



a:hover {

	text-decoration: none;

}



input[type=number]::-webkit-outer-spin-button,

input[type=number]::-webkit-inner-spin-button {

	-webkit-appearance: none;

	margin: 0;

}



.w-clear:after {

	display: block;

	content: "";

	clear: both;

}



.container_full {

	position: relative;

	overflow: hidden;

	margin: auto;

}



.hidden {

	display: none;

}



.clear {

	clear: both;

}



.none {

	display: none;

}



.hidden-seoh {

	visibility: hidden;

	height: 0px;

	margin: 0px;

	overflow: hidden;

}



.wrap-content {

	max-width: 1300px;

	margin: auto;

}



.wrap-content1 {

	max-width: 1366px;

	margin: auto;

}



.wrap-home {

	max-width: 100%;

	padding: 0px;

}



.wrap-content {

	margin: auto;

}



.padding50 {

	padding: 50px 0px;

}



.marginb50 {

	margin-bottom: 50px;

}



/* General */

.title-main {

	margin-bottom: 1.5rem;

	text-align: center;

}



.textshadow span {

	text-shadow: 2px 2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, -2px -2px 0 #fff, 2px 0px 0 #fff, 0px 2px 0 #fff, -2px 0px 0 #fff, 0px -2px 0 #fff;

}



.color-w span {

	color: #fff;

}



.slogan {

	color: #000;

	font-family: 'RobotoBold';

	font-size: 18px;

	text-transform: uppercase;

	margin-bottom: 0.5rem;

}



.title-main .line {

	width: 380px;

	height: 2px;

	background-color: #fec110;

	margin: auto;

}



.time-main {

	margin-bottom: 0.75rem;

	color: #999999;

}



.time-main i {

	vertical-align: top;

	margin: 3px 7px 0px 0px;

}



.time-main span {

	vertical-align: top;

	display: inline-block;

}



.share {

	padding: 17px 15px 10px 15px;

	line-height: normal;

	background: rgba(128, 128, 128, 0.15);

	margin-top: 15px;

	border-radius: 5px;

}



.share b {

	display: block;

	margin-bottom: 5px;

}



.control-owl {

	position: absolute;

	width: 100%;

	z-index: 2;

	left: 0px;

	top: calc(50% - 45px/2);

}



.control-owl button {

	opacity: 0.5;

	top: 0px;

	position: absolute;

	outline: none;

	border: 0px;

	padding: 0px;

	margin: 0px;

	display: block;

	cursor: pointer;

	color: #ffffff;

	width: 45px;

	height: 45px;

	text-align: center;

	display: flex;

	align-items: center;

	justify-content: center;

	font-size: 25px;

	margin: 0px;

	background-color: #000000;

	border-radius: 3px;

	-webkit-transition: 0.3s ease-out;

	-moz-transition: 0.3s ease-out;

	-o-transition: 0.3s ease-out;

	transition: 0.3s ease-out;

}



.control-owl button:hover {

	opacity: 1;

}



.control-owl button.owl-prev {

	left: 20px;

}



.control-owl button.owl-next {

	right: 20px;

}



.form-control,

.form-control-plaintext:not(textarea),

.custom-select {

	height: calc(1em + 1.25rem + 8px);

}







/* Lazyload */

img.lazy {

	opacity: 0;

}



img:not(.initial) {

	transition: opacity 1s;

}



img.initial,

img.loaded,

img.error {

	opacity: 1;

}



img:not([src]) {

	visibility: hidden;

}



/* Menu */

.menu-list {

	background-color: #fec110;

	position: relative;

	z-index: 10;

}



.menu ul {

	width: 100%;

	padding: 0px;

	margin: auto;

	list-style: none;

	background-color: #fdfefe;





}



.menu ul li {

	position: relative;

	z-index: 1;

}



.menu ul li.line {

	width: 2px;

	height: 17px;

	background: url(../images/image/line1.png)no-repeat;

}



.menu ul li a {

	display: block;

	position: relative;

	font-size: 15px;

	color: #ffffff;

	padding: 10.5px 17px;

	text-transform: uppercase;

	text-decoration: none !important;

}



.menu ul li a.has-child {

	padding-right: 16px;

	margin-right: 8px;

}



.menu ul li a.has-child:after {

	content: '';

	position: absolute;

	bottom: calc(50% - 4px/2);

	right: 5px;

	width: 5px;

	height: 5px;

	border: 1px solid #fafafa;

	border-top: 0px;

	border-left: 0px;

	-moz-transform: rotate(45deg);

	-webkit-transform: rotate(45deg);

	-o-transform: rotate(45deg);

	-ms-transform: rotate(45deg);

	transform: rotate(45deg);

	-webkit-transition: all 0.4s ease-out;

	-moz-transition: all 0.4s ease-out;

	-o-transition: all 0.4s ease-out;

	-ms-transition: all 0.3s ease-out;

	transition: all 0.3s ease-out;

}



/* .menu ul li a.active,

.menu>ul>li:hover>a {

	background-color: #d50008;

} */



.menu ul li:hover>a.has-child:after,

.menu ul li a.active.has-child:after {

	border: 1px solid #333;

}



.menu ul li ul {

	position: absolute;

	min-width: 250px;

	margin-top: -5px;

	padding-top: 0.75rem;

	padding-bottom: 0.75rem;

	background-color: #00b3f0;

	border-radius: 0.25rem;

	-webkit-box-shadow: 1px 1px 15px rgb(0 0 0 / 15%);

	box-shadow: 1px 1px 15px rgb(0 0 0 / 15%);

	-webkit-transform: perspective(600px) rotateX(-90deg);

	transform: perspective(600px) rotateX(-90deg);

	-webkit-transform-origin: 0 0 0;

	transform-origin: 0 0 0;

	opacity: 0;

	visibility: hidden;

	transition: all .5s;

}



.menu ul li:hover>ul {

	-webkit-transform: perspective(600px) rotateX(0);

	transform: perspective(600px) rotateX(0);

	-webkit-transform-origin: 0 0 0;

	opacity: 1;

	visibility: visible;

	transition: all .7s;

}



.menu ul li ul li {

	padding-left: 0.75rem;

	padding-right: 0.75rem;

}



.menu ul li ul li a {

	font-size: 14px;

	text-align: left;

	color: #fff;

	border-bottom: 1px solid #ececec;

}



.menu ul li ul li:last-child>a {

	border-bottom: 0px;

}



.menu ul li ul li a.has-child {

	margin-right: 0px;

}



.menu ul li ul li a.has-child:after {

	border-color: #fff;

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

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

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

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

	transform: rotate(-45deg);

}



.menu ul li ul li a.active,

.menu ul li ul li:hover>a {

	color: red;

}



.menu ul li ul li:hover>a.has-child:after,

.menu ul li ul li a.active.has-child:after {

	border-color: #333;

}



.menu ul li ul li a {

	padding: 10px 0px 9px 0px;

	text-transform: capitalize;

}



.menu ul li ul li ul {

	top: -0.75rem;

	left: 100%;

	margin-top: 0px;

}



.menu-list.fixed .logo-header {

	width: 80px;

	margin-bottom: unset;

}



/* Search */

.search {

	width: 220px;

	background: #fff;

	border-radius: 30px;

	border: 1px solid #00b3f0;

}



.search p {

	float: left;

	width: 37px;

	height: 37px;

	line-height: 37px;

	cursor: pointer;

	text-align: center;

	margin: 0px;

	color: #000;

	font-size: 16px;

}



.search input {

	width: calc(100% - 37px);

	height: 37px;

	float: left;

	outline: none;

	padding: 0px;

	border: 0px;

	background: transparent;

	text-indent: 10px;

	font-size: 12px;

	color: #333;

}



.search input::-webkit-input-placeholder {

	color: #ccc;

}



.search input:-moz-placeholder {

	color: #ccc;

}



.search input::-moz-placeholder {

	color: #ccc;

}



.search input:-ms-input-placeholder {

	color: #ccc;

}



/* Mmenu */

.menu-res {

	display: none;

	height: 40px;

	z-index: 10;

	background: #00b3f0;

	position: relative;

	line-height: normal;

}



.menu-bar-res {

	height: 40px;

	padding: 0px 15px;

	display: -webkit-flex;

	display: -moz-flex;

	display: -ms-flex;

	display: -o-flex;

	display: flex;

	align-items: center;

	justify-content: space-between;

}



#menu {

	display: none;

}



#hamburger {

	display: block;

	width: 45px;

	height: 23px;

	position: relative;

}



#hamburger:before,

#hamburger:after,

#hamburger span {

	background: #ffffff;

	content: '';

	display: block;

	width: 100%;

	height: 3px;

	position: absolute;

	left: 0px;

}



#hamburger:before {

	top: 0px;

}



#hamburger span {

	top: 10px;

}



#hamburger:after {

	top: 20px;

}



#hamburger:before,

#hamburger:after,

#hamburger span {

	-webkit-transition: none 0.5s ease 0.5s;

	transition: none 0.5s ease 0.5s;

	-webkit-transition-property: transform, top, bottom, left, opacity;

	transition-property: transform, top, bottom, left, opacity;

}



.mm-wrapper_opening #hamburger:before,

.mm-wrapper_opening #hamburger:after {

	top: 10px;

}



.mm-wrapper_opening #hamburger span {

	left: -50px;

	opacity: 0;

}



.mm-wrapper_opening #hamburger:before {

	transform: rotate(45deg);

}



.mm-wrapper_opening #hamburger:after {

	transform: rotate(-45deg);

}



.mm-menu_opened {

	display: block !important;

}



/* Search Responsive */

.search-res {

	position: relative;

}



.search-res .icon-search {

	width: 40px;

	height: 40px;

	cursor: pointer;

	text-align: center;

	line-height: 42px;

	color: #ffffff;

	font-size: 17px;

	margin: 0px;

}



.search-res .icon-search.active {

	color: var(--color-red);

	background: #ffffff;

	border-radius: 100%;

}



.search-res .search-grid {

	position: absolute;

	top: 50px;

	right: 0px;

	width: 0px;

	height: 40px;

	overflow: hidden;

	background: #ffffff;

	border: 1px solid var(--color-red);

	z-index: 2;

	opacity: 0;

	border-radius: 25px;

	line-height: normal;

}



.search-res .search-grid p {

	float: left;

	width: 35px;

	height: 38px;

	cursor: pointer;

	outline: none;

	border: none;

	margin: 0px;

	font-size: 17px;

	display: block;

	color: var(--color-red);

	line-height: 40px;

	text-align: center;

}



.search-res .search-grid input {

	width: calc(100% - 35px);

	float: right;

	line-height: 38px;

	outline: none;

	border: none;

	color: var(--color-red);

}



.search-res .search-grid input::-webkit-input-placeholder {

	color: #ccc;

}



.search-res .search-grid input:-moz-placeholder {

	color: #ccc;

}



.search-res .search-grid input::-moz-placeholder {

	color: #ccc;

}



.search-res .search-grid input:-ms-input-placeholder {

	color: #ccc;

}



/* Slideshow */

.slideshow {

	position: relative;

}



.slideshow-item {

	display: block;

	cursor: pointer;

}



.slideshow:hover .control-slideshow {

	opacity: 1;

}



.control-slideshow {

	opacity: 0;

}



/* Partner */

.wrap-partner {

	padding: 0px 15px;

}



.wrap-partner .wrap-content {

	position: relative;

}



.partner {

	display: block;

	border: 1px solid #eee;

	max-width: 175px;

	margin: 0px auto;

}



/* Breadcrumb */

.breadCrumbs {

	background-color: #eee;

}



.breadCrumbs .wrap-content {

	padding: 0.75rem 15px;

}



.breadCrumbs .wrap-content .breadcrumb {

	padding: 0;

	margin-bottom: 0;

	background-color: transparent;

	border-radius: 0;

}



.breadCrumbs .wrap-content .breadcrumb-item a {

	color: var(--color-black);

}



.breadCrumbs .wrap-content .breadcrumb-item.active a {

	color: var(--color-gray);

}



/* Intro */

/* .wrap-intro{padding: 50px 0px;} */

.intro-news:nth-child(1) {

	width: 33%;

}



.intro-news:nth-child(2) {

	width: 65%;

}



.title-intro {

	margin-bottom: 1.5rem;

	overflow: hidden;

}



.title-intro span {

	display: inline-block;

	font-family: 'OpenSansBold';

	font-size: 23px;

	color: #151515;

	text-transform: uppercase;

	line-height: 1.4;

	position: relative;

}



.title-intro span::after {

	position: absolute;

	content: '';

	background: url('../images/aftit.png') no-repeat;

	width: 548px;

	height: 19px;

	right: -558px;

	top: 50%;

	transform: translate(0%, -50%);

}



.news-shadow-one {

	width: 48%;

}



.news-intro {

	width: 49%;

}



.news-shadow-image-one {

	margin-bottom: 1rem;

}



.news-shadow-image-one img {

	width: 100%;

}



.news-shadow-image {

	margin-bottom: 0rem;

	width: 40%;

}



.news-shadow-image img {

	width: 100%;

}



.news-shadow-info {

	width: calc(100% - 43%);

}



.news-shadow {

	padding-bottom: 20px;

}



.news-shadow-name {

	font-size: 14px;

	font-family: 'OpenSansBold';

	text-transform: uppercase;

}



.news-shadow-name a {

	color: #2f2f2f;

	line-height: 1.6;

}



.news-shadow-name a:hover {

	color: #ec2d3f;

}



.news-shadow-desc {

	font-size: 14px;

	color: #2f2f2f;

	line-height: 1.8;

}



.news-shadow-name a.text-split {

	-webkit-line-clamp: 2;

}



.news-shadow-desc.text-split {

	-webkit-line-clamp: 2;

}



.btn-news-shadow {

	margin-top: 1rem;

}



.btn-news-shadow a {

	display: inline-block;

	background-color: #fec110;

	color: #000;

	text-transform: uppercase;

	padding: 10px 20px;

	font-family: 'OpenSansBold';

}



.btn-news-shadow a:hover {

	color: #ffff;

	background-color: #ae850c;

	transition: all ease 0.3s;

}





/* Video */

.video {

	cursor: pointer;

	margin-bottom: 1rem;

}



.video-image {

	position: relative;

	margin-bottom: 0.75rem;

}



.video-image:before {

	content: "";

	position: absolute;

	width: 50px;

	height: 35px;

	top: calc(50% - 50px/2);

	left: calc(50% - 35px/2);

	z-index: 1;

	background-repeat: no-repeat;

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

}



.video-name {

	text-align: center;

	font-size: 16px;

	color: var(--color-black);

	margin-bottom: 0px;

}



/* Album */

.album {

	cursor: pointer;

	margin-bottom: 26px;

}



.box-album {

	position: relative;

}



.album-image {

	margin-bottom: 0rem;

}



.album-info {

	position: absolute;

	left: 0px;

	right: 0px;

	top: 0px;

	padding: 20px 10px;

	background-color: #0006;

	text-align: center;

}



.album-info:hover {

	background-color: #fec110;

	color: #000;

	transition: ease all 0.3s;

}



.album-info:hover .album-name>div {

	color: #000;

}



.album-name {

	margin-bottom: 0px;

}



.album-name>div {

	font-family: 'OpenSansBold';

	font-size: 18px;

	color: #fff;

	text-transform: uppercase;

}



.wrap-utilities .form-row>.col,

.wrap-utilities .form-row>[class*=col-] {

	padding-right: 13px;

	padding-left: 13px;

}



/* Brand */

.wrap-brand {

	padding: 50px 0px;

	background-color: #f2f2f2;

	margin-bottom: 50px;

}



.wrap-brand .wrap-content {

	position: relative;

}



.brand {

	display: block;

	max-width: 160px;

	margin: 0px auto;

}



/* Product */

/* .wrap-product{padding:50px 0px;} */

/* .product{float:left;width:23.5%;margin:0 2% 2% 0;} */

.product:nth-child(4n+1) {

	clear: both;



}







.product:nth-child(4n) {

	margin-right: 0px;

}



.box-product {

	position: relative;

	display: block;

	margin-bottom: 0rem;

	text-align: center;

	overflow: hidden;

}



.pic-product {

	margin-bottom: 0px;

	overflow: hidden;

}



.pic-product img {

	width: 100%;

}



/* .name-product{font-size:26px;color:#fff;text-transform: uppercase;line-height: 1.6;margin-bottom: 0.25rem;font-family: 'SVNAgudaBlack';} */

.name-product.text-split {

	-webkit-line-clamp: 1;

}



.price-product {

	margin-bottom: 20px;

}



.box-product:hover .scale-img>img {

	-webkit-transition: 0.3s ease-out;

	-moz-transition: 0.3s ease-out;

	-o-transition: 0.3s ease-out;

	transition: 0.3s ease-out;

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

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

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

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

	transform: scale(1.1, 1.1);

}



/* .price-product span{font-weight:700;} */

.price-new {

	font-size: 15px;

	color: #e82e2e;

	font-family: 'Mulish_bold';

}



.price-old {

	padding-left: 10px;

	font-size: 14px;

	color: var(--color-gray);

	text-decoration: line-through;

}



.price-per {

	position: absolute;

	top: 15px;

	right: 15px;

	color: #ffffff;

	background: var(--color-red);

	font-size: 11px;

	border-radius: 2px;

	width: 45px;

	height: 25px;

	text-align: center;

	line-height: 25px;

}



.guarantee {

	font-size: 14px;

	color: #666;

}



.cart-product {

	margin-bottom: 0px;

}



.cart-product span {

	cursor: pointer;

	width: 49%;

	float: left;

	color: #ffffff;

	text-transform: capitalize;

	text-align: center;

	padding: 7px 5px;

	border-radius: 3px;

}



.cart-add {

	margin-right: 2%;

	background-color: var(--color-red);

}



.cart-add:hover {

	background-color: var(--color-dark-red);

}



.cart-buy {

	background-color: var(--color-green);

}



.cart-buy:hover {

	background-color: var(--color-dark-green);

}



.btn-product {

	text-align: center;

}



.btn-product a {

	display: inline-block;

	background-color: #28ac34;

	padding: 12px 30px;

	font-size: 14px;

	color: #fff;

	position: relative;

}



.btn-product a::after {

	position: absolute;

	content: '';

	border: dashed 1px #fff;

	top: 5px;

	bottom: 5px;

	left: 5px;

	right: 5px;

}



.btn-product a:hover {

	background-color: #207d36;

	transition: all ease 0.3s;

}



/* Product Detail */

.grid-pro-detail {

	margin-bottom: 3rem;

}



.left-pro-detail {

	position: relative;

	text-align: center;

}



.left-pro-detail .MagicZoom {

	border: 1px solid #eee;

	padding: 7px;

	border-radius: 5px;

	background-color: #ffffff;

}



.gallery-thumb-pro {

	position: relative;

	margin-top: 10px;

}



.owl-pro-detail {

	padding: 0px 30px;

}



.control-pro-detail button {

	background-color: transparent;

	color: #222222;

	opacity: 1;

	width: 25px;

	font-size: 23px;

}



.control-pro-detail button:hover {

	opacity: 0.7;

}



.control-pro-detail button.owl-prev {

	left: 0px;

}



.control-pro-detail button.owl-next {

	right: 0px;

}



.thumb-pro-detail {

	display: block !important;

	border: 1px solid #eee;

	padding: 5px;

	border-radius: 3px;

	cursor: pointer;

	background-color: #ffffff;

}



.thumb-pro-detail.mz-thumb.mz-thumb-selected {

	border-color: #cecfd2;

}



.thumb-pro-detail img {

	box-shadow: none !important;

	filter: brightness(100%) !important;

	border-bottom: 0px !important;

	padding-bottom: 0px !important;

}



.title-pro-detail {

	text-transform: capitalize;

	font-size: 20px;

	display: block;

	font-weight: 700;

}



.comment-pro-detail {

	display: flex;

	align-items: center;

	justify-content: flex-start;

}



.social-plugin-pro-detail {

	margin-bottom: 1rem;

	margin-top: 0px !important;

}



.desc-pro-detail {

	margin-bottom: 1rem;

}



.attr-pro-detail {

	list-style: none;

	padding: 0px;

}



.attr-pro-detail li {

	margin-bottom: 0.5rem;

}



.attr-label-pro-detail {

	margin: 0px 5px 0px 0px;

}



.attr-label-pro-detail.d-block {

	display: block;

	margin: 0px 0px 5px 0px;

}



.attr-content-pro-detail {

	display: inline-block;

	margin-bottom: 0px;

}



.price-new-pro-detail {

	font-weight: 700;

	font-size: 20px;

	color: var(--color-red);

}



.price-old-pro-detail {

	font-weight: 500;

	color: var(--color-gray);

	text-decoration: line-through;

	padding-left: 10px;

}



.color-pro-detail {

	cursor: pointer;

	display: inline-block;

	vertical-align: top;

	position: relative;

	width: 35px;

	height: 30px;

	margin: 0px 0px 3px 0px;

	border: 1px solid transparent;

	background-repeat: no-repeat;

	background-size: contain;

	background-position: center center;

}



.size-pro-detail {

	cursor: pointer;

	border: 1px solid #ccc;

	padding: 3px 10px 4px 10px;

	display: inline-block;

	position: relative;

}



.size-pro-detail.active,

.color-pro-detail.active {

	border-color: #e5101d;

	color: #e5101d;

}



.size-pro-detail.active:after,

.color-pro-detail.active:after {

	content: '';

	position: absolute;

	bottom: 0px;

	right: 0px;

	width: 13px;

	height: 13px;

	background-repeat: no-repeat;

	background-image: url(../images/check-cart.png);

}



.color-pro-detail input[type=radio],

.size-pro-detail input[type=radio] {

	display: none;

}



.quantity-pro-detail {

	width: 100%;

	max-width: 110px;

	line-height: normal;

	display: flex;

	align-items: center;

	justify-content: space-between;

	text-align: center;

}



.quantity-pro-detail span {

	line-height: 25px;

	padding: 0px;

	width: 30px;

	height: 30px;

	color: #5f5f5f;

	cursor: pointer;

	font-size: 22px;

	border: 1px solid #cccccc;

}



.quantity-pro-detail span.quantity-plus-pro-detail {

	border-left: 0px;

}



.quantity-pro-detail span.quantity-minus-pro-detail {

	border-right: 0px;

}



.quantity-pro-detail input {

	height: 30px;

	border: 1px solid #cccccc;

	width: calc(100% - 60px);

	text-align: center;

	font-size: 14px;

	padding: 5px;

}



.cart-pro-detail {

	margin-bottom: 1rem;

}



.cart-pro-detail a {

	font-size: 14px;

	color: #ffffff !important;

	text-transform: uppercase;

}



.tags-pro-detail a {

	float: left;

	font-size: 13px;

	padding-bottom: 0.375rem;

	margin: 0px 5px 5px 0px;

}



.tags-pro-detail a i {

	font-size: 11px;

	margin: 5px 5px 0px 0px;

}



.tabs-pro-detail {

	margin-top: 2rem;

}



.tabs-pro-detail .nav-tabs .nav-link {

	border-top-width: 3px;

	font-size: 13px;

}



.tabs-pro-detail .nav-tabs .nav-link.active,

.tabs-pro-detail .nav-tabs .nav-item.show .nav-link {

	border-top-color: #555555;

}



/* News */

.news {

	margin-bottom: 2rem;

}



.news-name {

	margin-bottom: 0.5rem;

}



.news-name a.text-split {

	-webkit-line-clamp: 2;

}



.news-name a:hover {

	color: var(--color-red);

}



.news-time {

	color: #84878a;

	margin-bottom: 0.25rem;

}



.news-desc {

	color: #333333;

	margin-top: 5px;

	line-height: 22px;

}



.othernews b {

	margin-bottom: 10px;

}



.list-news-other {

	padding-left: 17px;

	list-style: square;

}



.list-news-other li {

	margin-bottom: 2px;

}



.list-news-other li a {

	text-transform: none;

	color: #333333;

}



.list-news-other li a:hover {

	color: var(--color-red);

}



/* Contact */

.contact-article {

	margin-bottom: 3rem;

}



.contact-input {

	position: relative;

	margin-bottom: 15px;

}



.contact-input textarea {

	resize: none;

	height: 150px;

}



.contact-input .custom-file-label::after {

	content: attr(title);

}



.contact-map {

	position: relative;

	height: 500px;

}



.contact-map iframe {

	position: absolute;

	top: 0px;

	left: 0px;

	width: 100% !important;

	height: 100% !important;

}



/*Dự án*/

.wrap-project .owl-carousel .owl-item {

	padding: 10px;

}



.project {

	border-radius: 10px;

	overflow: hidden;

	box-shadow: 0px 0px 5px #ccc;

}



.project-name {

	background-color: #fec110;

	text-align: center;

	padding: 15px 10px;

	margin-bottom: 0px;

}



.project-name a {

	font-family: 'RobotoBold';

	font-size: 20px;

	text-transform: uppercase;

	color: #000;

}



.project-info {

	padding: 25px;

}



.btn-project {

	margin-top: 1rem;

}



.btn-project a {

	display: inline-block;

	font-size: 15px;

	color: #0b6bae;

	text-decoration: underline;

}



.btn-project a:hover {

	color: #fec110;

}



/*Vị trí*/

.location-image {

	margin-bottom: 2rem;

	display: block;

}



.btn-signup {

	margin-top: 1.5rem;

}



.btn-signup a {

	display: inline-block;

	background-color: #fec110;

	color: #000;

	text-transform: uppercase;

	padding: 10px 20px;

	font-family: 'OpenSansBold';

}



.btn-signup a:hover {

	color: #ffff;

	background-color: #ae850c;

	transition: all ease 0.3s;

}



/*Tiện ích*/

.wrap-utilities {

	background-color: #f1f1f1;

}



/*Thiết kế căn hộ*/

.album-design {

	margin-bottom: 2rem;

}



.box-design {

	text-align: center;

}



.design-image {

	margin-bottom: 1rem;

}



.design-name>div {

	font-family: 'OpenSansBold';

	font-size: 17px;

	color: #000;

	text-transform: uppercase;

	-webkit-line-clamp: 1;

}



/*Căn hộ mẫu*/

.wrap-House-template {

	background-color: #f1f1f1;

}



.wrap-House-template .form-row>.col,

.wrap-House-template .form-row>[class*=col-] {

	padding-right: 13px;

	padding-left: 13px;

}



.House-template {

	margin-bottom: 26px;

}



.box-House-template {

	position: relative;

}



.House-template-info {

	position: absolute;

	left: 0px;

	right: 0px;

	top: 0px;

	bottom: 0px;

	background-color: #000000b3;

	display: flex;

	justify-content: center;

	align-items: center;

	text-align: center;

	opacity: 0;

}



.House-template:hover .House-template-info {

	opacity: 1;

	transition: all ease 0.5s;

}



.plus-house {

	border: solid 1px #fff;

	border-radius: 50%;

	padding: 5px;

	display: inline-block;

	margin-bottom: 1rem;

}



.plus-house i {

	font-size: 15px;

	color: #fff;

	background-color: #fff6;

	border-radius: 50%;

	display: inline-flex;

	justify-content: center;

	align-items: center;

	width: 40px;

	height: 40px;

}



.House-template-name>div {

	font-family: 'OpenSansSemiBold';

	font-size: 17px;

	color: #fff;

	text-transform: uppercase;

	-webkit-line-clamp: 1;

}



.effect-2:before {

	border-top: 1px solid #fff;

	border-bottom: 1px solid #fff;

	transform: scale3d(0, 1, 1)

}



.effect-2:before,

.effect-2:after {

	box-sizing: inherit;

	content: '';

	position: absolute;

	z-index: 9;

	width: calc(100% - 20px);

	height: calc(100% - 20px);

	left: 10px;

	top: 10px;

	transform-origin: center

}



.effect-2:after {

	border-left: 1px solid #fff;

	border-right: 1px solid #fff;

	transform: scale3d(1, 0, 1)

}



.effect-2:before,

.effect-2:after {

	box-sizing: inherit;

	content: '';

	position: absolute;

	z-index: 9;

	width: calc(100% - 20px);

	height: calc(100% - 20px);

	left: 10px;

	top: 10px;

	transform-origin: center

}



.effect-2:hover:before,

.effect-2:hover:after {

	transform: scale3d(1, 1, 1);

	transition: transform .5s;

	transform: scale3d(1, 1, 1);

	transition: transform .5s

}



.House-template:hover .scale-img>img {

	-webkit-transition: 0.3s ease-out;

	-moz-transition: 0.3s ease-out;

	-o-transition: 0.3s ease-out;

	transition: 0.3s ease-out;

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

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

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

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

	transform: scale(1.1, 1.1);

}



/*Quảng cáo*/

.wrap-bannerad img {

	width: 100%;

}



/* Footer */



.footer-title {

	text-transform: uppercase;

	font-size: 30px;

	color: #fff;

	margin-bottom: 1rem;

}



.footer-name {

	text-align: center;

	margin-bottom: -20px;

}



.footer-name span {

	display: inline-block;

	font-family: 'SVNHelveticaNeue';

	color: #000;

	font-size: 33px;

	text-transform: uppercase;

	margin-bottom: 0rem;

	line-height: 1.4;

}



.footer-name .footer-p {

	color: #000;

	font-family: 'OpenSansBold';

	font-size: 17px;

	text-transform: uppercase;

	margin-bottom: 0rem;

	line-height: 1;

}



.footer-info {

	color: #fff;

}



.hotline-footer {

	text-align: center;

	margin-bottom: 1.5rem;

}



.hotline-footer a {

	display: block;

	font-family: 'OpenSansBold';

	font-size: 38px;

	color: #ff9f00;

	line-height: 1;

}



.chudautu {

	text-align: center;

	margin-bottom: 1.5rem;

}



.social-footer {

	text-align: center;

}



.title-newsletter {

	margin-bottom: 0rem;

}



.title-newsletter span {

	color: #ff9f00;

	font-family: 'SVNHelveticaNeue';

	font-size: 30px;

	text-transform: uppercase;

	display: inline-block;

}



.newsletter-slogan {

	margin-bottom: 0rem;

	color: #000;

	font-size: 17px;

}



/* .color-w span{color: #fff;} */

.d-center {

	text-align: center;

	margin-bottom: 1.5rem;

}



.d-between {

	justify-content: space-between;

}







.newsletter-input input {

	border-radius: 0px;

	font-size: 14px;

	color: #333;

	height: 45px;

	background: none;

}



.newsletter-input input::placeholder {

	font-size: 16px;

	color: #333;

	font-style: italic;

}



.newsletter-textarea {

	margin-bottom: 4%;

	clear: both;

}



.newsletter-textarea textarea {

	border-radius: 0px;

	font-size: 14px;

	color: #333;

	background: none;

}



.newsletter-textarea textarea::placeholder {

	font-size: 16px;

	color: #333;

	font-style: italic;

}



.newsletter-button {

	clear: both;

	text-align: center;

}







.footer-article .newsletter-textarea textarea,

.footer-article .newsletter-input input {

	color: #ff9f00;

	border: none;

	border-bottom: solid 1px #fff;

}



.color-w {

	color: #fff;

}



.color-w::placeholder {

	color: #e1e1e1 !important;

}



.footer-ul {

	list-style: inside;

	padding: 0px;

	margin: 0px;

}



.footer-ul li {

	margin-bottom: 10px;

	color: #fff;

	list-style: none;

}



.footer-ul li:last-child {

	margin-bottom: 0px;

}



.footer-ul li a {

	color: #fff;

}



.footer-ul li a:hover {

	text-decoration: none;

	color: #28a745;

}



.footer-tags {

	background: #eee;

}



.footer-tags .wrap-content {

	padding: 30px 15px;

}



.footer-tags-lists {

	list-style: none;

	padding: 0px;

	margin: 0px;

}



.footer-tags-lists li {

	float: left;

}



.footer-tags-lists li a {

	padding-bottom: 0.375rem;

}



.footer-powered {

	color: #ffffff;

	background-color: #000;

}



.footer-powered .wrap-content {

	padding-top: 15px;

	padding-bottom: 15px;

}



.footer-statistic {

	text-align: right;

	font-size: 13px;

}



.footer-statistic span {

	padding-right: 10px;

}



.footer-statistic span:last-child {

	padding-right: 0px;

}



.footer-copyright {

	font-size: 14px;

	color: #838383;

}



.footer-copyright span {

	color: #fffc00;

}



.footer-copyright span:nth-child(1) {

	text-transform: uppercase;

}



#footer-map {

	position: relative;

	height: 380px;

}



#footer-map iframe {

	position: absolute !important;

	width: 100% !important;

	height: 100% !important;

	top: 0px !important;

	left: 0px !important;

}



.footer-fanpage-map {

	background-color: #fec110;

}



.box-info-footer {

	margin-bottom: 1.5rem;

}



.info-footer {

	border: solid 3px #efb50f;

	padding: 40px 20px;

	border-top: none;

	position: relative;

}



.info-footer::after {

	position: absolute;

	content: '';

	width: 400px;

	height: 3px;

	background-color: #efb50f;

	left: 0px;

	top: 0px;

}



.info-footer::before {

	position: absolute;

	content: '';

	width: 400px;

	height: 3px;

	background-color: #efb50f;

	right: 0px;

	top: 0px;

}



.footer-news1 {

	background: url('../images/foo1.png') no-repeat left center;

	padding-left: 88px;

	min-height: 78px;

}



.footer-news2 {

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

	padding-left: 88px;

	min-height: 78px; */

	padding-top: 45px;

}



.footer-news3 {

	background: url('../images/foo3.png') no-repeat left center;

	padding-left: 88px;

	min-height: 78px;

}



.footer-news4 {

	background: url('../images/foo4.png') no-repeat left center;

	padding-left: 88px;

	min-height: 78px;

}



.footer-news {

	color: #000;

	font-size: 15px;

}



.footer-news span {

	line-height: 1.6;

}



/* Like Share */

.social-plugin {

	display: flex;

	justify-content: flex-start;

	margin-top: 10px;

}



.social-plugin .at-share-btn {

	margin-bottom: 0px !important;

}



.social-plugin .zalo-share-button {

	margin-left: 3px;

}



/* Paging */

.pagination-home .pagination .page-item .page-link {

	color: #555555;

	font-size: .875rem;

}



.pagination-home .pagination .page-item.active .page-link {

	color: #ffffff;

	background-color: #555555;

	border-color: #555555;

}



/* Paging Ajax */

.pagination-ajax {

	text-align: center;

}



.pagination-ajax a {

	display: inline-block;

	vertical-align: top;

	margin: 0px 3px 3px 3px;

	width: 35px;

	height: 35px;

	line-height: 33px;

	color: #666 !important;

	border: 1px solid #e6e6e6;

	font-size: 13px;

	cursor: pointer;

	text-decoration: none !important;

	background-color: #ffffff;

}



.pagination-ajax a.current,

.pagination-ajax a:hover {

	color: #ffffff !important;

	border-color: var(--color-red);

	background-color: var(--color-red);

}



.pagination-ajax a.first,

.pagination-ajax a.last,

.pagination-ajax a.prev,

.pagination-ajax a.next {

	text-indent: -9999px;

	position: relative;

	background-color: #ffffff !important;

}



.pagination-ajax a.first:before,

.pagination-ajax a.last:before,

.pagination-ajax a.prev:before,

.pagination-ajax a.next:before {

	content: '';

	position: absolute;

	top: 0px;

	left: 0px;

	width: 100%;

	height: 100%;

	z-index: 2;

	background-color: transparent;

	background-repeat: no-repeat;

	background-position: center;

}



.pagination-ajax a.first:before {

	background-image: url(../images/page-first.png);

}



.pagination-ajax a.last:before {

	background-image: url(../images/page-last.png);

}



.pagination-ajax a.prev:before {

	background-image: url(../images/page-prev.png);

}



.pagination-ajax a.next:before {

	background-image: url(../images/page-next.png);

}



/* Popup */

#popup .modal-body {

	padding: 0px;

}



/* Hidden Google Captcha */

.grecaptcha-badge {

	display: none !important;

	width: 0px !important;

	height: 0px !important;

	visibility: hidden !important;

	overflow: hidden;

}



/* Hidden Check Grammar Coccoc */

coccocgrammar {

	display: none;

}



/* Scroll Top */

.scrollToTop {

	width: 41px;

	height: 41px;

	text-align: center;

	font-weight: bold;

	color: #444;

	text-decoration: none;

	position: fixed;

	bottom: 65px;

	right: 25px;

	display: none;

	z-index: 10;

	cursor: pointer;

}



/* Text Hide */

.text-split {

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: normal;

	-webkit-box-orient: vertical;

	display: -webkit-box;

}



.dong1 {

	-webkit-line-clamp: 1;

}



.dong2 {

	-webkit-line-clamp: 2;

}



.dong3 {

	-webkit-line-clamp: 3;

}



.dong4 {

	-webkit-line-clamp: 4;

}



.dong10 {

	-webkit-line-clamp: 10;

}



.dong9 {

	-webkit-line-clamp: 9;

}









/* Transition All */

.transition {

	-webkit-transition: 0.3s ease-out;

	-moz-transition: 0.3s ease-out;

	-o-transition: 0.3s ease-out;

	transition: 0.3s ease-out;

}



/* Scale IMG */

.scale-img {

	overflow: hidden;

	display: block;

}



.scale-img img {

	-webkit-transition: 0.3s ease-out;

	-moz-transition: 0.3s ease-out;

	-o-transition: 0.3s ease-out;

	transition: 0.3s ease-out;

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

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

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

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

	transform: scale(1, 1);

}



.scale-img:hover>img {

	-webkit-transition: 0.3s ease-out;

	-moz-transition: 0.3s ease-out;

	-o-transition: 0.3s ease-out;

	transition: 0.3s ease-out;

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

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

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

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

	transform: scale(1.1, 1.1);

}



/* Blink */

.blink {

	-webkit-animation-name: blink;

	-webkit-animation-duration: 1s;

	-webkit-animation-timing-function: linear;

	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: blink;

	-moz-animation-duration: 1s;

	-moz-animation-timing-function: linear;

	-moz-animation-iteration-count: infinite;

	animation-name: blink;

	animation-duration: 1s;

	animation-timing-function: linear;

	animation-iteration-count: infinite;

}



@-moz-keyframes blink {

	0% {

		opacity: 1.0;

	}



	50% {

		opacity: 0.0;

	}



	100% {

		opacity: 1.0;

	}

}



@-webkit-keyframes blink {

	0% {

		opacity: 1.0;

	}



	50% {

		opacity: 0.0;

	}



	100% {

		opacity: 1.0;

	}

}



@keyframes blink {

	0% {

		opacity: 1.0;

	}



	50% {

		opacity: 0.0;

	}



	100% {

		opacity: 1.0;

	}

}



/* Button Frame */

.btn-frame {

	display: block;

	width: 50px;

	height: 50px;

	position: fixed;

	right: 20px;

	z-index: 10;

	cursor: pointer;

}



.btn-frame i {

	display: flex;

	display: -ms-flex;

	justify-content: center;

	align-items: center;

	-ms-flex-align: center;

	width: 50px;

	height: 50px;

	border-radius: 50%;

	background: #0189e1;

	position: relative;

	z-index: 1;

}



.btn-frame i img {

	vertical-align: middle;

	width: 70%;

}



.btn-frame .animated.infinite {

	animation-iteration-count: infinite;

}



.btn-frame .kenit-alo-circle {

	width: 60px;

	height: 60px;

	top: -5px;

	right: -5px;

	position: absolute;

	background-color: transparent;

	-webkit-border-radius: 100%;

	-moz-border-radius: 100%;

	border-radius: 100%;

	border: 2px solid rgba(7, 41, 103, 0.8);

	opacity: .1;

	border-color: #0189e1;

	opacity: .5;

}



.btn-frame .zoomIn {

	animation-name: zoomIn;

}



.btn-frame .animated {

	animation-duration: 1s;

	animation-fill-mode: both;

}



.btn-frame .kenit-alo-circle-fill {

	width: 70px;

	height: 70px;

	top: -10px;

	right: -10px;

	position: absolute;

	-webkit-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;

	transition: all 0.2s ease-in-out;

	-webkit-border-radius: 100%;

	-moz-border-radius: 100%;

	border-radius: 100%;

	border: 2px solid transparent;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-o-transition: all .5s;

	transition: all .5s;

	background-color: rgba(7, 41, 103, 0.35);

	opacity: .4;

}



.btn-frame .pulse {

	animation-name: pulse;

}



/* Zalo */

.btn-zalo {

	bottom: 315px;

}



/* Phone */

.btn-phone {

	bottom: 230px;

}



/* Messenger */

.js-facebook-messenger-container.closed,

.js-facebook-messenger-tooltip.closed {

	display: none !important

}



.js-facebook-messenger-tooltip {

	bottom: 97px;

	right: 97px

}



.js-facebook-messenger-tooltip {

	color: #404040;

	background: #fff

}



.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

	z-index: 999

}



.js-facebook-messenger-tooltip {

	display: none;

	position: fixed;

	text-align: center;

	border-radius: 10px;

	overflow: hidden;

	font-size: 12px;

	line-height: 1;

	padding: 10px;

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

	box-shadow: rgba(0, 0, 0, 0.15) 0 2pt 10pt;

	z-index: 1.0E+30

}



.js-facebook-messenger-close-tooltip {

	width: 10px;

	height: 10px;

	display: inline-block;

	cursor: pointer;

	margin-left: 10px

}



.js-facebook-messenger-box.rubberBand {

	-webkit-animation-name: rubberBand;

	animation-name: rubberBand

}



.js-facebook-messenger-box.animated {

	-webkit-animation-duration: 1s;

	animation-duration: 1s;

	-webkit-animation-fill-mode: both;

	animation-fill-mode: both

}



.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

	z-index: 999

}



.js-facebook-messenger-box {

	display: block;

	position: fixed;

	cursor: pointer;

	bottom: 150px;

	right: 17px;

	width: 56px;

	height: 56px;

	text-align: center;

	background: #0189e1;

	border-radius: 100%;

	overflow: hidden;

	z-index: 99;

	-webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

	-moz-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

	box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3)

}



.js-facebook-messenger-box.rotate svg#fb-msng-icon {

	transform: rotate(0deg)

}



.js-facebook-messenger-box svg#fb-msng-icon {

	width: 32px;

	height: 33px;

	position: absolute;

	top: 13px;

	left: 12px;

	opacity: 1;

	overflow: hidden;

	-webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

}



.js-facebook-messenger-box.rotate svg#close-icon {

	transform: rotate(-45deg)

}



.js-facebook-messenger-box svg#close-icon {

	opacity: 0;

	width: 19px;

	height: 20px;

	position: absolute;

	top: 19px;

	left: 19px;

	-webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

}



.js-facebook-messenger-container,

.js-facebook-messenger-container-button {

	z-index: 1000

}



.js-facebook-messenger-container {

	position: fixed;

	opacity: 0;

	transform: translateY(50px);

	bottom: 110px;

	right: 90px;

	border-radius: 10px;

	pointer-events: none;

	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16);

	-webkit-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

	-moz-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

	-o-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

	transition: transform 160ms ease-in-out, opacity 160ms ease-in-out

}



.js-facebook-messenger-top-header {

	width: 220px

}



.js-facebook-messenger-top-header {

	color: #ffffff;

	background: #1182FC

}



.js-facebook-messenger-top-header {

	display: block;

	position: relative;

	width: 220px;

	background: #1182FC;

	color: #ffffff;

	text-align: center;

	line-height: 1;

	padding: 10px;

	font-size: 14px;

	border-top-left-radius: 10px;

	border-top-right-radius: 10px

}



.js-facebook-messenger-container iframe,

.js-facebook-messenger-container-button iframe {

	border-bottom-left-radius: 10px;

	border-bottom-right-radius: 10px

}



.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

	z-index: 999

}



.js-facebook-messenger-container,

.js-facebook-messenger-container-button {

	z-index: 1000

}



.js-facebook-messenger-top-header {

	color: #ffffff;

	background: #1182FC

}



.js-facebook-messenger-top-header {

	width: 220px

}



.js-facebook-messenger-tooltip {

	color: #404040;

	background: #fff

}



.js-facebook-messenger-container.open {

	transform: translateY(0px);

	opacity: 1;

	pointer-events: all

}



.js-facebook-messenger-tooltip {

	bottom: 97px;

	right: 97px

}



.js-facebook-messenger-box.open svg#fb-msng-icon {

	opacity: 0

}



.js-facebook-messenger-box.rotate.open svg#close-icon {

	transform: rotate(0deg)

}



.js-facebook-messenger-box.open svg#close-icon {

	opacity: 1

}



/* Cart Fix */

.cart-fixed {

	position: fixed;

	right: 20px;

	bottom: 390px;

	z-index: 10;

	background: #4b4f56;

	width: 50px;

	height: 50px;

	text-align: center;

	color: #fff !important;

	border-radius: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

}



.cart-fixed i {

	font-size: 20px;

}



.cart-fixed span {

	position: absolute;

	top: 0px;

	right: -5px;

	color: #ffffff;

	width: 25px;

	height: 25px;

	background: var(--color-red);

	text-align: center;

	line-height: 25px;

	font-size: 11px;

	border-radius: 100%;

}



/* Toolbar */

.toolbar {

	background: #00b3f0;

	width: 100%;

	padding: 3vw;

	bottom: 0px;

	position: fixed;

	z-index: 500;

	height: auto;

	left: 0px;

}



.toolbar ul {

	list-style: none;

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 0px;

	margin: 0px;

}



.toolbar ul li {

	text-align: center;

	width: 20%;

}



.toolbar ul li a {

	display: block;

	width: 100%;

	cursor: pointer;

}



.toolbar ul li a img {

	height: 6vw;

	width: auto;

}



.toolbar ul li a span {


	color: #ffffff;

	font-size: 20px


}



/* Fixbar */

.fixbar {

	bottom: 0;

	display: block;

	background: #f0eff4;

	border-top: 1px solid #ddd;

	width: 100%;

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	box-sizing: border-box;

	position: fixed;

	margin: 0;

	z-index: 500;

	-webkit-backface-visibility: hidden;

	backface-visibility: hidden;

	height: 50px;

}



.fixbar ul {

	margin: 0px;

	padding: 0px;

	list-style: none;

}



.fixbar ul li {

	display: inline-block;

	margin: 0 auto 10px;

	text-align: center;

	width: 25%;

	float: left;

}



.fixbar .icon-cart-mobile,

.fixbar .icon-cart-new,

.fixbar .icon-home-new,

.fixbar .icon-hotdeal-new {

	width: 20px;

	height: 20px;

	display: block;

	margin: 8px auto 0;

}



.fixbar .icon-cart-mobile {

	background: url(../images/cart-mobile.png) no-repeat;

}



.cart-total-header-mobile {

	font-size: 10px;

	position: absolute;

	background: red;

	color: #fff !important;

	border-radius: 50%;

	height: 15px;

	width: 15px;

	line-height: 15px;

	top: 5px;

	margin-left: 5px;

}



.fixbar ul li a {

	font-size: 11px;

	text-decoration: none;

	color: #333;

}



.fixbar ul li a i {

	font-size: 20px;

}



/* Plugbar */

.plugbar {

	position: fixed;

	bottom: 0;

	left: 0;

	border-top: 1px solid #eae6e6;

	width: 100%;

	right: 0;

	max-width: 767px;

	margin: 0 auto;

	background: #ffffff;

	padding: 9px 10px 10px 7px;

	z-index: 10;

}



.plugbar ul {

	list-style: none;

	padding: 0;

	margin: 0px;

	display: -webkit-flex;

	display: -moz-flex;

	display: flex;

	justify-content: space-between;

	align-items: center;

}



.plugbar ul li {

	width: 20%;

	float: left;

}



.plugbar ul li a {

	display: block;

	color: #696969;

	font-size: 12px;

	text-align: center;

	position: relative;

}



.plugbar ul li a i {

	font-size: 20px;

	color: #696969;

}



.plugbar ul li a span {

	position: absolute;

	width: 50px;

	height: 50px;

	top: -40px;

	left: calc(50% - 50px/2);

	font-size: 14px;

	display: block;

	border: 1px solid rgba(234, 230, 230, 0.5);

	border-radius: 100%;

}



/* Combo Phone */

.support-online {

	position: fixed;

	z-index: 999;

	left: 10px;

	bottom: 0px;

}



.support-online a {

	position: relative;

	margin: 20px 10px;

	text-align: left;

	width: 40px;

	height: 40px;

}



.support-online i {

	width: 40px;

	height: 40px;

	background: #43a1f3;

	color: #ffffff;

	border-radius: 100%;

	font-size: 20px;

	text-align: center;

	line-height: 1.9;

	position: relative;

	z-index: 999;

}



.support-online a span {

	border-radius: 2px;

	text-align: center;

	background: rgb(103, 182, 52);

	padding: 9px;

	display: none;

	width: 180px;

	margin-left: 10px;

	position: absolute;

	color: #ffffff;

	z-index: 999;

	top: 0px;

	left: 40px;

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

	-moz-animation: headerAnimation 0.7s 1;

	-webkit-animation: headerAnimation 0.7s 1;

	-o-animation: headerAnimation 0.7s 1;

	animation: headerAnimation 0.7s 1;

}



.support-online a:hover span {

	display: block;

}



.support-online a {

	display: block;

}



.support-online a span:before {

	content: "";

	width: 0;

	height: 0;

	border-style: solid;

	border-width: 10px 10px 10px 0;

	border-color: transparent rgb(103, 182, 52) transparent transparent;

	position: absolute;

	left: -10px;

	top: 10px;

}



.support-online .kenit-alo-circle-fill {

	width: 60px;

	height: 60px;

	top: -10px;

	position: absolute;

	-webkit-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;

	transition: all 0.2s ease-in-out;

	-webkit-border-radius: 100%;

	-moz-border-radius: 100%;

	border-radius: 100%;

	border: 2px solid transparent;

	-webkit-transition: all .5s;

	-moz-transition: all .5s;

	-o-transition: all .5s;

	transition: all .5s;

	background-color: rgba(0, 175, 242, 0.5);

	opacity: .75;

	right: -10px;

}



.support-online .kenit-alo-circle {

	width: 50px;

	height: 50px;

	top: -5px;

	right: -5px;

	position: absolute;

	background-color: transparent;

	-webkit-border-radius: 100%;

	-moz-border-radius: 100%;

	border-radius: 100%;

	border: 2px solid rgba(30, 30, 30, 0.4);

	opacity: .1;

	border-color: #0089B9;

	opacity: .5;

}



.support-online .support-online .btn-support {

	cursor: pointer;

}



.support-online .mes i {

	background: orange;

}



.support-online .sms i {

	background: red;

}



.support-online .call-now i {

	background: green;

}



/* Phone Switch */

.widget-mobile {

	position: fixed;

	left: 50%;

	transform: translateX(-50%);

	bottom: 10px;

	z-index: 9999999;

}



#my-phone-circle {

	position: relative;

	width: 50px !important;

	height: 50px !important;

}



.wcircle-open .wcircle-icon i:before {

	content: '\f00d';

}



.wcircle-icon {

	background: #1282fc;

	border-radius: 50%;

	display: flex !important;

	display: -ms-flex !important;

	align-items: center;

	-ms-flex-align: center;

	-webkit-box-pack: center;

	-ms-flex-pack: center;

	justify-content: center;

	position: relative !important;

}



.wcircle-icon:before {

	position: absolute;

	content: '';

	width: 60px;

	height: 60px;

	background: rgba(18, 130, 252, .5);

	border: 1px solid #ffffff;

	border-radius: 50%;

	left: -5px;

	top: -5px;

	-webkit-animation: pulse 1s infinite ease-in-out;

	-moz-animation: pulse 1s infinite ease-in-out;

	-ms-animation: pulse 1s infinite ease-in-out;

	-o-animation: pulse 1s infinite ease-in-out;

	animation: pulse 1s infinite ease-in-out;

}



.wcircle-icon:after {

	position: absolute;

	content: '';

	width: 80px;

	height: 80px;

	background: rgba(18, 130, 252, .5);

	border-radius: 50%;

	left: -15px;

	top: -15px;

	-webkit-animation: zoomIn 2s infinite ease-in-out;

	-moz-animation: zoomIn 2s infinite ease-in-out;

	-ms-animation: zoomIn 2s infinite ease-in-out;

	-o-animation: zoomIn 2s infinite ease-in-out;

	animation: zoomIn 2s infinite ease-in-out;

}



.wcircle-menu {

	position: absolute !important;

	left: 0;

	top: 0;

	display: none;

}



.wcircle-menu-item {

	width: 50px;

	height: 50px;

	background: #1282fc;

	border-radius: 50%;

	display: flex;

	display: -ms-flex;

	align-items: center;

	-ms-flex-align: center;

	-webkit-box-pack: center;

	-ms-flex-pack: center;

	justify-content: center;

}



.wcircle-menu-item img {

	width: 50px;

	height: 50px;

	display: block;

	border-radius: 50%;

}



.wcircle-menu-item i,

.wcircle-icon i {

	font-size: 25px;

	color: #ffffff;

	position: relative;

	z-index: 9999;

}



.shake-anim {

	-webkit-animation: shake-anim 1s infinite ease-in-out;

	-moz-animation: shake-anim 1s infinite ease-in-out;

	-ms-animation: shake-anim 1s infinite ease-in-out;

	-o-animation: shake-anim 1s infinite ease-in-out;

	animation: shake-anim 1s infinite ease-in-out;

	-webkit-transform-origin: 50% 50%;

	-moz-transform-origin: 50% 50%;

	-ms-transform-origin: 50% 50%;

	-o-transform-origin: 50% 50%;

	transform-origin: 50% 50%

}



@-moz-keyframes shake-anim {

	0% {

		transform: rotate(0) scale(1) skew(1deg)

	}



	10%,

	30% {

		-moz-transform: rotate(-25deg) scale(1) skew(1deg)

	}



	20%,

	40% {

		-moz-transform: rotate(25deg) scale(1) skew(1deg)

	}



	100%,

	50% {

		-moz-transform: rotate(0) scale(1) skew(1deg)

	}

}



@-webkit-keyframes shake-anim {



	0%,

	100%,

	50% {

		-webkit-transform: rotate(0) scale(1) skew(1deg)

	}



	10%,

	30% {

		-webkit-transform: rotate(-25deg) scale(1) skew(1deg)

	}



	20%,

	40% {

		-webkit-transform: rotate(25deg) scale(1) skew(1deg)

	}

}



@-o-keyframes shake-anim {



	0%,

	100%,

	50% {

		-o-transform: rotate(0) scale(1) skew(1deg)

	}



	10%,

	30% {

		-o-transform: rotate(-25deg) scale(1) skew(1deg)

	}



	20%,

	40% {

		-o-transform: rotate(25deg) scale(1) skew(1deg)

	}

}