/*
Theme Name: VinaWebsite.VN
Description: Templates develop by vinahost.vn
Author: VINAHOST.VN
Template: flatsome
Support: website@vinahost.vn
Version: 1.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
/* font-face */
@font-face {
  font-family: iCielVAGRoundedNext;
  src: url(assets/fonts/iCielVAGRoundedNext_Bold.otf);
  font-weight: 700;
}
@font-face {
  font-family: iCielVAGRoundedNext;
  src: url(assets/fonts/iCielVAGRoundedNext_Light.otf);
  font-weight: 400;
}
@font-face {
  font-family: iCielVAGRoundedNext;
  src: url(assets/fonts/iCielVAGRoundedNext_Medium.otf);
  font-weight: 600;
}
@font-face {
  font-family: iCielVAGRoundedNext;
  src: url(assets/fonts/iCielVAGRoundedNext_Regular.otf);
  font-weight: 500;
}
@font-face {
  font-family: UTM_Aircona;
  src: url(assets/fonts/UTM_Aircona.ttf);
}
@font-face {
  font-family: UTM_Silk_Script;
  src: url(assets/fonts/UTM_Silk_Script.ttf);
}
@font-face {
  font-family: UTM_Avo;
  src: url(assets/fonts/UTM_Avo.ttf);
  font-weight: 400;
}
@font-face {
  font-family: UTM_Avo;
  src: url(assets/fonts/UTM_AvoBold.ttf);
  font-weight: 700;
}
@font-face {
  font-family: UTM_Avo;
  src: url(assets/fonts/UTM_AvoBold_Italic.ttf);
  font-weight: 700;
  font-style: italic;
}
@font-face {
  font-family: UTM_Avo;
  src: url(assets/fonts/UTM_AvoItalic.ttf);
  font-style: italic;
}
/* end font-face */

/* social fixed right */
.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
{
	bottom:110px;
	right:15px
}
.js-facebook-messenger-box
{
	background:var(--primary_color)
}
.js-facebook-messenger-box,.js-facebook-messenger-button,.js-facebook-messenger-tooltip
{
	z-index:999
}
.js-facebook-messenger-box
{
	width:60px;
	height:60px;
	display:block;
	position:fixed;
	cursor:pointer;
	text-align:center;
	line-height:60px;
	background:var(--primary_color);
	border-radius:100%;
	overflow:hidden;
	-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:30px;
	height:30px;
	position:absolute;
	top:15px;
	left:15px;
	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:20px;
	height:20px;
	position:absolute;
	top:20px;
	left:20px;
	-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
{
	transform:translateY(50px);
	bottom:110px;
	right:35px;
	display:none;
}
.js-facebook-messenger-container,.js-facebook-messenger-container-button
{
	z-index:99999
}
.js-facebook-messenger-container
{
	display: none;
	position:fixed;
	opacity:0;
	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:100%
}
.js-facebook-messenger-top-header
{
	color:#fff;
	background:var(--primary_color)
}
.js-facebook-messenger-top-header
{
	display:block;
	position:relative;
	width:300px;
	background:var(--primary_color);
	color:#fff;
	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:999999999
}
.js-facebook-messenger-top-header
{
	color:#fff;
	background:var(--primary_color)
}
.js-facebook-messenger-box
{
	background:var(--primary_color)
}
.js-facebook-messenger-top-header
{
	width:100%
}
.js-facebook-messenger-tooltip
{
	color:#404040;
	background:#fff
}
.js-facebook-messenger-box
{
	bottom:120px;
	right:15px
}
.js-facebook-messenger-container
{
	transform:translateY(50px);
	bottom:185px;
	right:35px
}
.js-facebook-messenger-container.open
{
	display: block;
	transform:translateY(0px);
	opacity:1;
	pointer-events:all;
	display:block;
}
.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
}
@-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:200px; 
	text-align:center; 
	border-radius:100px; 
	z-index:999; 
}
.pinkBg { 
	background-color: var(--primary_color); 
	background-image: var(--primary_color); 
}
.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:.3s; 
	-webkit-animation-delay:.3s 
}
.btn-zalo .ripple:nth-child(3){ 
	animation-delay:.6s; 
	-webkit-animation-delay:.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); 
	} 
}
/* end social fixed right */

/* #shop-sidebar */
@media (min-width: 850px) {
	#shop-sidebar aside .product-categories > li > ul {
		display: none !important;
	}
	#shop-sidebar aside .product-categories > li:hover > ul {
		display: block !important;
	}
}