/*
Theme Name: songanh Child
Description: Đây là Child Theme của Flatsome.
Author: Tên bạn hoặc công ty
Template: flatsome
Version: 3.0
Text Domain: flatsome-child
*/
/*************** ADD CUSTOM CSS HERE.   ***************/
@import url('https://fonts.googleapis.com/css2?family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap');
.font__spline h2{
	font-family: 'Spline Sans Mono', sans-serif !important;
}
:root {
	--main-color: #3266F0;
	--sc-color: #3E4095;
    --color-black: #1e1e1e;
	--color-sc-bl: #333333;
    --color-white: #ffffff;
    --color-grey: #6B7280;
	 --promo-height: 2.5rem;
     --menu-height: 6.25rem;
	--w-container: 100vw
}
blockquote, dl, figure, form, ol, p, pre, ul {
    margin-bottom: 1.125rem;
}
* {
    scroll-behavior: smooth !important;
}
body {
	line-height: 1.5;
}
html {
	font-size: 3.5vw
	} 
h1, h2, h3, h4, h5, h6 {
	 
}

.fs-18 {
	font-size: 1.125rem
}
.fs-20 {
	font-size: 1.25rem
}
.fs-24 {
	font-size: 1.5rem
}
.fs-16 {
	font-size: 1rem
}
.fs-14 {
	font-size: 0.875rem
}
.fw-400 {
	font-weight: 400
}
.fw-100 {
	font-weight: 100
}
.m-0 {
	margin: 0;
}
.mb-0 {
	margin-bottom: 0;
}
.p-0 {
	padding: 0 !important
}
.h-full, .h-full-img {
	height: 100%
}
.h-full-img * {
	height: 100%
}
.h-full-img img {
	object-fit: cover;
	objec-position: center;
}
.w-full {
	width: 100%
}
.mb-1 {
	margin-bottom: 1rem
}
.pb-1 {
	padding-bottom: 1rem !important
}
.pt-1 {
	padding-top: 1rem !important
}
.ptb-1 {
	padding: 1rem 0 !important
}
.pb-2 {
	padding-bottom: 2rem !important
}
.pt-2 {
	padding-top: 2rem !important
}
.ptb-2 {
	padding: 2rem 0 !important
}
.pb-3 {
	padding-bottom: 3rem !important
}
.pt-3 {
	padding-top: 3rem !important
}
.ptb-3 {
	padding: 3rem 0 !important
}
.pb-4 {
	padding-bottom: 4rem !important
}
.pt-4 {
	padding-top: 4rem !important
}
.ptb-4 {
	padding: 4rem 0 !important
}
.pb-5 {
	padding-bottom: 5rem !important
}
.pt-5 {
	padding-top: 5rem !important
}
.ptb-5 {
	padding: 5rem 0 !important
}
.ml-0, .mx-0 {
    margin-left: 0 !important;
}
.mr-0, .mx-0 {
    margin-right: 0 !important;
}
.mp-0 p {
	margin: 0 !important;
}
.row {
	max-width: initial !important;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
.flex__row {
	display: -ms-flexbox;
    display: flex;
}
.flex-1 {
	flex: 1;
}
.z--1 {
	z-index: -1
}
.z-1 {
	z-index: 1
}
.z-2 {
	z-index: 2
}
.z-3 {
	z-index: 3
}
.z-4 {
	z-index: 4
}
.z-5 {
	z-index: 5
}
.z-6 {
	z-index: 6
}
.z-7 {
	z-index: 7
}
.z-8 {
	z-index: 8
}
.z-9 {
	z-index: 9
}
.container {
	max-width: var(--w-container) !important
}
.container__fluid {
    width: 90vw;
    margin: 0 auto;
}
.page-wrapper {
    padding-bottom: 0;
    padding-top: 0;
}
.header-main .nav li{
	margin: 0 !important
}
.header-main .nav {

}

.header-nav-main > li >  .sub-menu  {
	
}
.header-nav-main .sub-menu .sub-menu {

}


#header  .nav-dropdown li {
	
}

#header  .nav-dropdown li:hover .sub-menu {
	
}


#header  .nav-dropdown li.left .sub-menu {
	
}


#header .nav-dropdown li  a{
	
}

.header-main .nav > li > a {
    
}
.header-search-lightbox a.icon {
  
}
.header-search-lightbox a.icon i.icon-search {
   
}
.header-main .nav > li.menu-item > a:before {
	
}
.header-main .nav > li.menu-item > a:hover:before, .header-main .nav > li.menu-item.current-menu-item > a:before {
	
}
.nav:hover>li:not(:hover)>a:before {
  
}
.absolute-footer, .shop-page-title {
	display: none !important;
}
.header-main .nav li.header-search {
    
}
.header-shadow .header-wrapper, .header-wrapper.stuck, .layout-shadow #wrapper {
    
}
.single__post .col__content__single #ez-toc-container {
	
}
.nav-line-bottom>li>a:before, .nav-line-grow>li>a:before, .nav-line>li>a:before {
	background: #fff;
	height: 2px;
}
.header-bottom-nav > li > a {
    font-size: 1.045rem;
    padding: 0.875rem 0;
}
.header-bottom-nav>li.menu-item {
    margin: 0;
}
.header-bottom-nav {
    gap: 4.375rem;
}
.header-button-1 a.button span {
    color: #fff;
    text-transform: none;
    font-size: 1.045rem;
    line-height: 1;
    display: flex;
}
.header-button-1 a.button {
    border: 2px solid #fff;
    padding: 0.833rem 1.042rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-search-form input {
    border-radius: 4px !important;
    border: 2px solid #D9D9D9 !important;
    background: #FFF !important;
    height: 45px !important;
    width: 15.417rem !important;
    font-size: 0.9027rem !important;
    color: #2B2B2D !important;
}
.header-search-form .submit-button i.icon-search {
    top: 0;
    font-size: 1.5rem !important;
    padding: 0;
}
.searchform-wrapper.form-flat .flex-col:last-of-type {
    margin-left: -3.2rem;
}
.rd__5 {
    border-radius: 5px;
    overflow: hidden;
}
.slider-style-container .flickity-slider>:not(.is-selected), .slider-style-focus .flickity-slider>:not(.is-selected), .slider-style-shadow .flickity-slider>:not(.is-selected) {
    opacity: 1 !important;
}
.slider-nav-outside.slider-nav-circle .previous {
    margin-right: 0;
}
.slider-nav-light .flickity-prev-next-button .arrow, .slider-nav-light .flickity-prev-next-button svg {
    fill: #000;
    background-color: #D9D9D9;
    border: 0;
    padding: 0.7rem;
}
button.flickity-button.flickity-prev-next-button {
    opacity: 1;
    display: flex;
	width: 2.5rem !important;
	height: 2.5rem !important;
}
@media screen and (min-width: 564px) {
	html {
	font-size: 1.93333vw;
	} 


}
@media screen and (min-width: 850px) {
	html {
	font-size: 1.6vw;
	} 
:root {
        --w-container: 97vw
    }
	.container {
		max-width: var(--w-container) !important
	}
	.col, .columns, .gallery-item {
		padding-bottom: 0;
	}
}
@media screen and (min-width: 998px) {
	html {
	font-size: 1.3333vw;
	} 
:root {
        --w-container: 69rem
    }
	.container {
		max-width: var(--w-container) !important
	}
	.ss__mb {
		display: none
	}
}
@media screen and (min-width: 1024px) {

}
@media screen and (min-width: 1240px) {
	html {
	font-size: 1.11333vw;
	} 
	:root {
        --w-container: 80rem
    }
	.container {
		max-width: var(--w-container) !important
	}

}

@media screen and (min-width: 1440px) {
	html {
	font-size: 1vw;
	} 	
	:root {
        --w-container: 91rem;
    }
	.container {
		max-width: var(--w-container) !important
	}
}
@media screen and (min-width: 1600px) {
	:root {eem 
        --w-container: 90rem
    }
	html {
	font-size: 0.83333vw;
	} 
	.container {
		max-width: var(--w-container) !important
	}
	
}

@media screen and (max-width: 1599px) { 

}
@media screen and (max-width: 1439px) {
	
}

@media screen and (max-width: 1239px) {
	.fs-20 {
        font-size: 1rem;
    }
	.header-bottom-nav {
		gap: 2.5rem;
	}
}
@media screen and (max-width: 1025px) {

}
@media screen and (max-width: 997px) {
	.container__fluid {
        width: 100vw;
        padding: 0 15px;
    }
	.header-bottom-nav {
		gap: 1rem;
	}
}
@media screen and (max-width: 849px) {
	
}

@media screen and (max-width: 563px) {
	.fs-20 {
		font-size: 1.125rem;
	}
	.fs-18 {
		font-size: 1rem;
	}
}