/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

@media only screen and (max-width: 48em) {
	/*************** ADD MOBILE ONLY CSS HERE  ***************/
}
.title_cam {
	color: #f3715e;
	font-weight: bold;
}
.title_tim {
	color: #622c85;
	font-weight: bold;
}
.nav-tabs > li > a {
	border: none;
	background-color: #fff;
	padding: 0;
	font-weight: normal !important;
	color: #333;
}
.nav-tabs + .tab-panels {
	border: 0;
}
.nav-tabs > li.active > a {
	background-color: #f3715e !important;
	color: #fff;
}
.product-title a {
	font-weight: bold;
	text-align: center;
}
.product_list ul li {
	display: inline-block;
	padding: 11px 15px;
	min-width: 116px;
	border: 1px solid #e8e8e8;
	text-align: center;
}
.product_list .nav > li > span:hover {
	background: #f3715e !important;
}
.nav > li > a:hover {
	background: none !important;
}
.product_list ul li:hover {
	background: #f3715e;
	border: 1px solid transparent;
	transition: all 0.5s;
}
.product_list ul li:hover h4,
.product_list ul li:hover h4 a {
	color: #fff;
}
.product_list ul li.active {
	background: #f3715e;
	border: 1px solid transparent;
}
.product_list ul li.active h4 {
	color: #fff;
}
.product_list ul li:nth-child(4n + 1) {
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
}
.product_list ul li:nth-child(4n + 2) {
	border-top-left-radius: 20px;
	border-bottom-right-radius: 20px;
}
.product_list ul li:nth-child(4n + 3) {
	border-bottom-left-radius: 20px;
	border-top-right-radius: 20px;
}
.product_list ul li:nth-child(4n + 4) {
	border-top-left-radius: 20px;
	border-bottom-right-radius: 20px;
}
.product_list ul li h4 {
	color: #2b2b2b;
	font-size: 15px;
	text-transform: capitalize;
}
.product_list ul li h4 a {
	display: block;
}
/*Css hotline*/
@-moz-keyframes shake-anim {
	0% {
		transform: rotate(0) scale(1) skew(1deg);
	}
	10% {
		-moz-transform: rotate(-25deg) scale(1) skew(1deg);
	}
	20% {
		-moz-transform: rotate(25deg) scale(1) skew(1deg);
	}
	30% {
		-moz-transform: rotate(-25deg) scale(1) skew(1deg);
	}
	40% {
		-moz-transform: rotate(25deg) scale(1) skew(1deg);
	}
	50% {
		-moz-transform: rotate(0) scale(1) skew(1deg);
	}
	100% {
		-moz-transform: rotate(0) scale(1) skew(1deg);
	}
}
@-webkit-keyframes shake-anim {
	0% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
	}
	10% {
		-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
	}
	20% {
		-webkit-transform: rotate(25deg) scale(1) skew(1deg);
	}
	30% {
		-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
	}
	40% {
		-webkit-transform: rotate(25deg) scale(1) skew(1deg);
	}
	50% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
	}
	100% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
	}
}
@-o-keyframes shake-anim {
	0% {
		-o-transform: rotate(0) scale(1) skew(1deg);
	}
	10% {
		-o-transform: rotate(-25deg) scale(1) skew(1deg);
	}
	20% {
		-o-transform: rotate(25deg) scale(1) skew(1deg);
	}
	30% {
		-o-transform: rotate(-25deg) scale(1) skew(1deg);
	}
	40% {
		-o-transform: rotate(25deg) scale(1) skew(1deg);
	}
	50% {
		-o-transform: rotate(0) scale(1) skew(1deg);
	}
	100% {
		-o-transform: rotate(0) scale(1) skew(1deg);
	}
}
.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%;
}
.btn-zalo {
	height: 60px;
	width: 60px;
	position: fixed;
	right: 15px;
	bottom: 160px;
	text-align: center;
	border-radius: 100px;
	z-index: 999;
}
.pinkBg {
	background-color: #ed184f;
	background-image: linear-gradient(90deg, #fd5581, #fd8b55);
}
.btn-zalo img {
	display: block;
	max-width: 100%;
}
.btn-zalo .ripple {
	position: absolute;
	width: 100px;
	height: 100px;
	z-index: -1;
	left: 50%;
	top: 50%;
	opacity: 0;
	margin: -50px 0 0 -50px;
	border-radius: 100px;
	-webkit-animation: ripple 1.8s infinite;
	animation: ripple 1.8s infinite;
}
.btn-zalo .ripple:nth-child(2) {
	animation-delay: 0.3s;
	-webkit-animation-delay: 0.3s;
}
.btn-zalo .ripple:nth-child(3) {
	animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
}

.btn-zalo1 {
	height: 60px;
	width: 60px;
	position: fixed;
	right: 15px;
	bottom: 80px;
	text-align: center;
	border-radius: 100px;
	z-index: 999;
	display: flex;
	align-items: center;
}
.pinkBg1 {
	background-color: #ed184f;
	background-image: linear-gradient(90deg, #fd5581, #fd8b55);
}
.btn-zalo1 img {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	width: 32px;
	height: 32px;
	margin: 0 auto;
}
.btn-zalo1 .ripple {
	position: absolute;
	width: 100px;
	height: 100px;
	z-index: -1;
	left: 50%;
	top: 50%;
	opacity: 0;
	margin: -50px 0 0 -50px;
	border-radius: 100px;
	-webkit-animation: ripple 1.8s infinite;
	animation: ripple 1.8s infinite;
}
.btn-zalo1 .ripple:nth-child(2) {
	animation-delay: 0.3s;
	-webkit-animation-delay: 0.3s;
}
.btn-zalo1 .ripple:nth-child(3) {
	animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
}

.btn-zalo2 {
	height: 60px;
	width: 60px;
	position: fixed;
	right: 15px;
	bottom: 10px;
	text-align: center;
	border-radius: 100px;
	z-index: 999;
	display: flex;
	align-items: center;
}
.pinkBg2 {
	background-color: #4188fd;
	background-image: linear-gradient(90deg, #3f76cf, #1668ec);
}
.btn-zalo2 img {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	width: 32px;
	height: 32px;
	margin: 0 auto;
}
.btn-zalo2 .ripple {
	position: absolute;
	width: 100px;
	height: 100px;
	z-index: -1;
	left: 50%;
	top: 50%;
	opacity: 0;
	margin: -50px 0 0 -50px;
	border-radius: 100px;
	-webkit-animation: ripple 1.8s infinite;
	animation: ripple 1.8s infinite;
}
.btn-zalo2 .ripple:nth-child(2) {
	animation-delay: 0.3s;
	-webkit-animation-delay: 0.3s;
}
.btn-zalo2 .ripple:nth-child(3) {
	animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
}
@-webkit-keyframes ripple {
	0% {
		opacity: 1;
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes ripple {
	0% {
		opacity: 1;
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
		transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}
@keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
		-ms-transform: translateY(-20px);
		transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}
}
.nav > li > a,
.nav-dropdown > li > a,
.nav-column > li > a,
.nav-vertical-fly-out > li > a {
	color: #333;
}
.box-image img {
	width: auto;
}
