/*
Theme Name: hafasco
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 6.0.19
*/
#wp-admin-bar-wp-logo {display:none}
/*************** ADD CUSTOM CSS HERE.   ***************/

@font-face {
 font-family: VNF-Futura Regular;
 src: url(/wp-content/themes/flatsome-child/fonts/SVN-Gilroy-Light.otf);
 font-weight: normal;
 }

.fa-comment-alt:before, .fa-message:before {content: "\f4ad";}
.text-capitalize {text-transform:capitalize}
.fa-telegram-plane:before, .fa-telegram:before {content: "\e07b";}

.aio-contact-trigger-front .fa-comment-alt{animation:tada 2s linear infinite}
.aio-contact-trigger-front::before{content:'';display:block;width:150%;height:150%;border-radius:50%;border:1px solid #00b4df;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-animation:phone-circle-animate 1s ease-in-out infinite;animation:phone-circle-animate 1s ease-in-out infinite}
.aio-contact-trigger-front::after{content:'';display:block;width:120%;height:120%;border-radius:50%;position:absolute;left:50%;top:50%;z-index:-1;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:rgb(0 180 223 / 30%);-webkit-animation:phone-circle-fill-animate 2s ease-in-out infinite;animation:phone-circle-fill-animate 2s ease-in-out infinite}
@keyframes phone-circle-animate {
0%{transform:translate(-50%,-50%) rotate(0) scale(0.5);opacity:.1}
30%{transform:translate(-50%,-50%) rotate(0) scale(0.7);opacity:.5}
100%{transform:translate(-50%,-50%) rotate(0) scale(1);opacity:.1}
}
@keyframes phone-circle-fill-animate {
0%,100%{transform:translate(-50%,-50%) rotate(0) scale(0.7)}
50%{transform:translate(-50%,-50%) rotate(0) scale(1)}
}
@keyframes phone-icon-animate {
0%,100%{transform:rotate(0) scale(1) skew(1deg)}
10%{transform:rotate(-25deg) scale(1) skew(1deg)}
20%,40%{transform:rotate(25deg) scale(1) skew(1deg)}
30%{transform:rotate(-25deg) scale(1) skew(1deg)}
50%{transform:rotate(0) scale(1) skew(1deg)}
}
@keyframes tada {
0%{transform:scale(1)}
10%,20%{transform:scale(.9) rotate(-8deg)}
30%,50%,70%{transform:scale(1.1) rotate(8deg)}
40%,60%{transform:scale(1.1) rotate(-8deg)}
100%,80%{transform:scale(1) rotate(0)}
}

.section-title-main, h1, h2, h3, h4, h5, h6, strong, .icon-box-text, .icon-box-text h2, .icon-box-text h3, .icon-box-text h4, .icon-box-text h5, .sidebar-menu .nav-sidebar li a, .col-inner, .text-center, .text-center h2, .text-center h3, .text-center h4, .text-center h5, .col-inner strong, .col-inner h3, .col-inner h4, .header-nav>li.menu-item, .header-nav>li.menu-item a, .header-nav li.menu-item, .header-nav li a, h1.entry-title, .widget-title, .col-inner h2, .col-inner h3, .col-inner h4, .col-inner h5, .col-inner h6, .top-bar-nav li.menu-item a, .account-item span, #header-contact li a span, h3.product-section-title, .woocommerce-breadcrumb.breadcrumbs, ul.product-tabs>li>a, .widget, .product-short-description, button.button, .product_meta span, h3.comment-reply-title, .html.custom, span.header-cart-title, .footer-secondary.pull-right, .utm-avo, .tab a span, .button, .searchform .search-field, .searchform .search-field::placeholder, .header-top li a>span, table tr th, table tr td, label, .form-row input, .form-row select, .form-row textarea, .mini_cart_item a, .mini_cart_item span, .woocommerce-mini-cart__total span, .tab-panels .panel.entry-content, .tab-panels .panel.entry-content p, .woocommerce-MyAccount-navigation-link a, .woocommerce-additional-fields h3, .woocommerce-billing-fields h3, .breadcrumbs a, #mega-menu-title, .woocommerce-info, .futura {
   font-family: "VNF-Futura Regular", Arial, sans-serif; 
}
/*icon giỏ hàng header*/
#top-bar .hide-for-medium.flex-right ul>li.cart-item i.icon-shopping-bag::before {
    content: "\f290";

    font-weight: 100;
    position: relative;
    bottom: 1px;
}
#top-bar .hide-for-medium.flex-right ul>li.account-item>a::after, #top-bar .hide-for-medium.flex-right ul>li.cart-item i.icon-shopping-bag::before {
 
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    
 	font-family: "FontAwesome";
   
}
/*icon đăng nhập*/
#top-bar .hide-for-medium.flex-right ul>li.account-item>a::after {
    content: "\f2bd";
}
#top-bar .hide-for-medium.flex-right ul>li.account-item>a::after, #top-bar .hide-for-medium.flex-right ul>li.cart-item i.icon-shopping-bag::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
   font-family: "FontAwesome";
    margin-left: 5px;
    font-size: 14px;
}
/*header main*/

@media only screen and (max-width: 860px) and (min-width: 320px)
{
	#masthead, .mh-breadcrumbs .page-title-inner {
    padding: 0 !important;
}
}
.header-main .nav > li > a{
	font-weight:600;
	
}
#masthead .nav-dropdown li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border: 1px solid;
    border-radius: 100%;
    display: inline-block;
    left: 0;
    vertical-align: middle;
    margin-right: 7px;

}
.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a {
  
    font-weight: bold;
}
#masthead .nav-dropdown li a:hover {
    color: #252525;
}
/*TIÊU ĐỀ*/
.mh-title-simple .section-title, .mh-title-simple .section-title-main {
    border: 0;
    padding: 0;
    margin: 0;
}
.section-title-container {
    margin-bottom: 0.5em;
}
.mh-title-simple.center .section-title {
    justify-content: center;
}
.box-text p a{
	font-weight:bold;
}
/*blog*/
.box-blog-post .is-divider{
	max-width:100%;
	height:1px;
}
/*padding col*/
.mh-no-padding-bottom {
    padding-bottom: 0 !important;
}
/*chi tiết sp - giá*/
p.price.product-page-price {
    margin-bottom: 0.2em;
}
/*chi tiết sp - add to cart*/
.mh-col-product-summary .quantity {
    min-width: 163px;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -o-border-radius: 25px;
}
.mh-col-product-summary .quantity .input-text {
    min-width: 80px;
}
.mh-col-product-summary .quantity .input-text, .mh-col-product-summary .quantity .minus, .mh-col-product-summary .quantity .plus {
    background-color: #fff;
}
.mh-col-product-summary .quantity .minus, .mh-col-product-summary .quantity .plus {
    min-width: 40px;
}
/*MÔ TẢ NGẮN*/
.mh-col-product-summary .mh-item-info {
    border: 0;
}
.mh-col-product-summary .mh-item-info>a {
    border-bottom: 1px solid #222;
    color: #212121;
    padding: 15px 15px 15px 0;
}
.mh-col-product-summary .mh-item-info>a {
    text-transform: uppercase;
    border-top: 0;
    font-size: 90%;
    position: relative;
	font-weight:bold;
}
.mh-col-product-summary .mh-item-info>a button {
    display: none;
}
.accordion .toggle {
    width: 2.3em;
    height: 1.5em;
    margin-right: 5px;
    top: .3em;
    border-radius: 999px;
    position: absolute;
    left: 0;
}
.mh-col-product-summary .mh-item-info>a.active {
    background-color: transparent;
}

.accordion-title.active{
	font-weight:normal;
}
.mh-col-product-summary .mh-item-info a::after {
    content: "\f067";
	font-size:60%
}
.mh-col-product-summary .mh-item-info>a::after, .mh-col-product-summary .mh-item-info>a.active::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "FontAwesome";
    position: absolute;
    right: 15px;
    top: 22px;
}
.mh-col-product-summary .mh-item-info .accordion-inner {
    padding: 15px 0 0;
    font-size: 90%;
	font-weight:900;
}
/*meta*/
.mh-col-product-summary .product_meta span {
    border: 0;
    color: #999;
    font-size: 115%;
    padding: 0;
}
.mh-col-product-summary .product_meta span span, .mh-col-product-summary .product_meta span a {
    color: #000;
    font-size: 120%;
    font-weight: 500;
}
/*SP LIÊN QUAN*/
h3.product-section-title.container-width.product-section-title-related.pt-half.pb-half.uppercase {
    DISPLAY: NONE;
}
.related-products-wrapper.product-section {
    border-top: none;
}
/*biến thể sp*/
.woo-variation-swatches-stylesheet-enabled.woo-variation-swatches-style-squared .variable-items-wrapper .variable-item.button-variable-item {
    width: auto;
    border-radius: 99px;
}
/*footer*/
.footer-sago li{
	list-style:none;
	margin-left:0px !important;
	font-size:85%;
}
.footer-sago li a{
	/*color:#878787;*/
}
.footer-sago li a:hover{
	/*color:#fff;*/
}
.footer-sago .links>li>a:before, i[class^="icon-"], i[class*=" icon-"]{
	margin-right:10px;
}
.footer-sago a:hover{
	color:#fff;
}
.footer-sago .wpcf7-form {
    border: 1px solid #fff;
    max-width: 280px;
}

footer .wpcf7 ::placeholder {color: #fff;}
footer .mh-submit-icon .wpcf7-spinner {position:absolute}

.footer-sago input.mh-input, .footer-sago input.mh-submit {
   background-color: transparent !important;
    font-size: 13px;
    font-style: italic;
    border: 0;
    min-height: 35px;
    margin: 0;
    color: #fff;
}
/*chi tiết post*/
.blog-wrapper .entry-image .badge, .blog-archive .badge, .blog-wrapper .is-divider {
    display: none;
}
.blog-single .entry-header .entry-meta::before {
    content: "\f073";
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "FontAwesome";
    font-weight: 300;
    margin-right: 2px;
	font-size:140%;
    color: #333;
}
span.widget-title {
    display: block;
    font-weight: normal;
    margin: 0 0 25px;
    font-size: 140%;
	font-weight:bold;
    text-transform: initial;
    text-align: center;
}
.page-title.category-page-title {
    position: relative;
    background-color: rgb(250, 250, 250);
}
.category-page-title .page-title-inner{
	padding-top:0px;
	min-height:auto;
}

#billing_address_1_field{
	width:100% !important;
}

@media screen and (min-width: 850px)
{
	.row-divided>.col+.col:not(.large-12) {
    border-left: none;
}
}

#top-bar{overflow:hidden}
#top-bar:after{position:absolute;content:"";width:35%;height:300px;top:0;left:0;background:#0178b3;z-index:-1;transform:skewX(20deg);border-right:5px solid #fff}

.header-nav-main > li ul {background:#fff;border:none !important;border-radius:10px}
.header-nav-main > li ul a:hover , .nav-dropdown li.active>a {color:#008bd0 !important;}

.name.product-title a {color:#222;}
.price-wrapper, .price-wrapper * {color:#008bd0}
.price-wrapper del, .price-wrapper del * {color:#555}

.section-title-main {color:#008bd0 !important;}

@media (min-width: 1024px) {
	div#masthead ,#top-bar{padding: 0 65px;}
	.footer-secondary {padding-top:0;font-size:12px}
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	#top-bar:after{display:none}

}

/*end*/