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

/*************** ADD CUSTOM CSS HERE.   ***************/
div#masthead:not(.home div#masthead) {
    box-shadow: 0 1px 6px rgb(175 175 175 / 40%);
}
div#masthead ul li.menu-item a.nav-top-link:not(li.menu-item:first-child a.nav-top-link) {
    padding-left: 25px;
}
.home div#masthead ul li.menu-item a.nav-top-link {
	color: #fff;
}
div#masthead ul li.menu-item a.nav-top-link {
    color: #000;
    font-size: 16px;
    font-weight: 400;
}
div#masthead ul li.menu-item.active a.nav-top-link:after {
    content: "";
    background: #ffd900;
    position: absolute;
    width: 60px;
    height: 1px;
    bottom: 6px;
    right: 0;
}
.stuck .header-bg-color {
    background: rgb(0 0 0 / 76%);
}
#masthead .header-search a i  {
	color: #fff;
	background: #dc515166;
	height: 32px;
	width: 32px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
a.button.wc-forward {
    width: 49.5%;
    padding: 0;
    font-weight: 400;
    text-transform: initial;
    font-size: 14px;
    background: #ff564a;
}
a.button.checkout.wc-forward {
    margin-left: 1%;
    background: #ff564a;
}

.col.col-padding {
	padding-bottom: 0;
}
/* css section về chúng tôi */
.ct-title-gioithieu h3 {
    font-size: 30px;
}
.div-img img {
    border: 3px solid #fff;
    border-radius: 8px;
}
.ct-title-ani h3 {
    font-size: 50px;
    font-weight: 800;
    margin: 0;
    line-height: 1;
    text-transform: uppercase;
    position: absolute;
}
.ct-title-gioithieu h3:nth-child(1) {
	-webkit-text-stroke: 1px #fff;
}
.ct-title-ani h3:nth-child(1) {
    color: transparent;
    -webkit-text-fill-color: transparent;
}
.ct-title-ani h3:nth-child(2) {
    color: #ffdb4a;
    -webkit-animation: animate 3s ease-in-out infinite;
    animation: animate 3s ease-in-out infinite;
}
@keyframes animate{
    0%,100%{clip-path:polygon(0% 45%, 15% 44%, 32% 50%, 54% 60%, 70% 81%, 84% 69%, 100% 72%, 100% 100%, 0% 100%)}
    50%{clip-path:polygon(0% 60%, 16% 65%, 34% 66%, 51% 62%, 67% 50%, 84% 45%, 100% 46%, 100% 100%, 0% 100%)}
}
.ct-gioithieu p {
    font-size: 17px;
    letter-spacing: 1px;
    line-height: 30px;
}
.ct-gioithieu a {
    color: #fcd660;
    text-decoration: underline;
}
.ct-gioithieu p {
    margin-bottom: 0;
}

/* css section danh mục sản phẩm */
.ct-cate h3 {
	text-align: center;
}
.ct-cate h3:nth-child(1) {
	-webkit-text-stroke: 1px #000;
}

/* css section tin tức */
.is-divider {
    display: none;
}
.blog-home .col.post-item .col-inner {
    background: #474545;
    border-radius: 8px;
	overflow: hidden;
}
.blog-home .box-image {
    border-radius: 8px;
}
.blog-home .box-text {
    padding: 10px;
}
.blog-home h5 { 
    font-weight: 600;
    font-size: 15px;
    line-height: 24px;
    text-transform: uppercase;
}
.blog-home h5, .blog-home p.from_the_blog_excerpt {
	overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.blog-home p.from_the_blog_excerpt {
    color: #ccc;
	padding-top: 6px;
}
a.button.btn-xemthem {
    background: #474545;
    text-transform: inherit;
    font-weight: 300;
}

/* css blog và bblog grid */
.blog-home h5:not(.blog-grid h5) {
	height: 48px;
}
.blog-home .blog-home p.from_the_blog_excerpt:not(.blog-grid .blog-home p.from_the_blog_excerpt) {
	height: 52px;
}

/* css icon slider flatsome */
.slider .flickity-prev-next-button {
    opacity: 1;
}
.slider .flickity-prev-next-button svg.flickity-button-icon {
    background: rgb(0 0 0 / 60%);
    border-radius: 50%;
    padding: 12px !important;
    color: #ccc;
	border: 0;
}
.row-slider .flickity-prev-next-button, .flickity-prev-next-button {
	width: 40px !important;
}
.slider-nav-light .flickity-prev-next-button svg, .slider-nav-light .flickity-prev-next-button .arrow {
	fill: #ccc;
}
.slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button {
    margin-top: 0;
    top: 10%;
}
.slider .flickity-prev-next-button:hover svg, .slider .flickity-prev-next-button:hover .arrow {
    fill: #ccc;
}

.row-slider .flickity-page-dots .dot {
    width: 14px;
    height: 14px;
}
.row-slider .flickity-page-dots .dot {
    border-color: #fff;
    background: #fff;
    opacity: 1;
}
.flickity-page-dots .dot.is-selected {
    background: #ffdb4a;
    border-color: #ffdb4a;
    border: 1px solid #fff;
	border-radius: 10px;
}

/* css ảnh bg att */
.st-img-att .section-bg {
    background-image: url(/wp-content/uploads/2022/08/webmau16.com-banner-2.webp);
    background-repeat: no-repeat;
    background-size: cover;
}
.st-img-att .section-bg {
    background-attachment: fixed;
}


/* css section video chúng tôi */
.btn-video a.button.open-video.icon {
    background: #C62127;
    color: #fff;
    border: 2px solid #C62127;
}
.btn-video a.button.open-video.icon:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    border-radius: inherit;
    border: 1px solid #C62127;
    -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
    animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
    border-color: #C62127;
}
@keyframes btnIconRipple {
  0% {
      border-width: 4px;
      transform: scale(1);
  }
  80% {
      border-width: 1px;
      transform: scale(1.85);
  }
  100% {
      opacity: 0;
  }
}
.btn-video a.button.open-video.icon:after {
    content: '';
    display: inline-block;
    position: absolute;
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    border-radius: inherit;
    border: 1px solid #C62127;
    -webkit-animation: btnIconRipples 2s infinite ease-in-out;
    animation: btnIconRipples 2s infinite ease-in-out;
    border-color: #C62127;
}
@keyframes btnIconRipples {
  0% {
      border-width: 4px;
      transform: scale(1);
  }
  80% {
      border-width: 1px;
      transform: scale(1.45);
  }
  100% {
      opacity: 0;
  }
}


/* css footer */
.footer-widgets.footer.footer-1 {
    background-color: rgb(39, 37, 37);
    border-top: 2px solid #fff
}
.ct-foo p {
    margin-bottom: 10px;
}
.ct-foo p strong {
    font-size: 15px;
}
.ct-foo ul li {
    margin-left: 0;
    margin-bottom: 6px;
}
.ct-foo ul li a, .ct-foo p {
    font-size: 14px
}
hr {
    opacity: .6;
    margin-top: -12px;
    margin-bottom: 30px;
}
.ct-lienhe {
    border: 1px solid #e1e1e1;
    border-radius: 5px;
    padding: 0px 10px;
}
.ct-lienhe p:first-child strong {
    background: rgb(39, 37, 37);
    padding: 0 10px;
}
.ct-lienhe p:first-child {
    margin-top: -12px;
    text-align: center;
}
.ct-lienhe p:nth-child(2) {
    text-transform: uppercase;
}
.ct-lienhe p {
    margin-bottom: 8px;
    font-size: 15px;
}
.ct-lienhe p a {
    color: yellow !important;
    font-size: 15px;
}

.footer-widgets div#block_widget-3 {
    margin-bottom: 0;
}
.absolute-footer {
    border-top: 1px solid currentColor;
}
.copyright-footer {
    color: #fff;
}
a#top-link {
    background-color: #323232;
    border: 2px solid #fff;
    color: #fff;
    padding: 2px 0;
}

/* css trang chi tiết sản phẩm */
/* css breadcrumbs */
.page-title-inner {
    min-height: 0;
    padding: 10px 0 10px 0;
}
.page-title.shop-page-title.product-page-title {
    background: #f9f7f7;
}
.page-title-inner .flex-col.medium-text-center {
    padding: 0;
}
nav.woocommerce-breadcrumb.breadcrumbs {
    text-transform: inherit;
}
nav.woocommerce-breadcrumb.breadcrumbs a {
    color: #111;
    font-size: 14px;
}
nav.woocommerce-breadcrumb.breadcrumbs a:last-child {
    color: #ff564a
}

.single-product .product-main {
    padding-bottom: 15px;
}
.single-product .product-info.summary {
    padding-bottom: 0;
}

.product-info span.lienhe {
    font-weight: bold;
    font-size: 24px;
    color: #ff564a;
}
.product-short-description p {
    margin-bottom: 10px;
	font-size: 14px;
}
span.status-stocking {
    color: #25c478;
    background: #e3f9ee;
    border-radius: 20px;
    padding: 0px 8px 2px 8px;
}
.tinh-trang {
    font-size: 14px;
    margin-bottom: 10px;
}

.ux-swatch.tooltip.ux-swatch--label.tooltipstered.selected {
    border: 1px solid #e3e3e3;
    border-radius: 5px;
    box-shadow: 0px 0px 4px #ff564a;
    color: #ff564a;
    font-weight: 600;
}
.ux-swatch.tooltip.ux-swatch--label {
    border-radius: 5px;
    box-shadow: 1px 1px 6px rgb(219 239 205);
}

button.single_add_to_cart_button.button.alt {
    background: #ff564a;
    border-radius: 40px;
}

/* css các dịch vụ */
.stack.dichvu .icon-box {
    border: 1px solid #f2f2f2;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    align-items: center;
}
.stack.dichvu .icon-box:not(:last-child) {
    margin-right: 10px !important;
}
.stack.dichvu .icon-box p {
    font-size: 14px;
    line-height: 1.2;
}

.product-footer .woocommerce-tabs>.nav-line:not(.nav-vertical) {
    background: #f3f3f3;
    border-bottom: 1px solid #ff564a;
}
.product-footer ul.product-tabs>li {
    padding: 0 15px;
    margin: 0;
}
.product-footer ul.product-tabs>li a {
    color: #000;
    font-weight: 400;
}
.product-footer ul.product-tabs>li.active {
    background: #ff564a;
}
.product-footer ul.product-tabs>li.active a {
    color: #fff;
}
.product-footer ul.product-tabs>li.active a:before, ul.product-tabs>li:hover a:before {
    background-color: #ff564a;
}

/* css col sidebar product */
div#product-sidebar {
    padding-left: 0;
	padding-bottom: 0;
}
.product-info.col-divided {
    border-right: 0;
}
div#product-sidebar>.widget {
    background: #f7f7f7;
    border: 1px solid #e3e3e3;
    border-radius: 5px;
    padding: 15px 10px 15px 15px;
    box-shadow: 1px 1px 6px rgb(219 239 205);
}
.box-faq:not(:last-child) {
    margin-bottom: 12px;
    border-bottom: 1px solid #cccccc5c;
    padding-bottom: 10px;
}
.box-faq p {
    font-size: 15px;
}
.box-faq a {
    color: #ff564a;
}

.col-sp-banchay h3 {
    background: #ff564a;
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 18px;
    border-radius: 6px 6px 0 0;
}

/* css trang danh mục sản phẩm */
/* css bộ lọc sản phẩm */
.yith-wcan-filters .yith-wcan-filter {
    margin-bottom: 20px;
}
.yith-wcan-filters .filter-content {
    border: 1px solid #ccc;
}
.yith-wcan-filters .filter-content {
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden;
}
.yith-wcan-filters .yith-wcan-filter h4 {
    background: #ff564a;
    color: #fff !important;
    margin-bottom: 0;
    border-radius: 6px 6px 0 0;
    text-align: center;
    padding: 4px;
    font-weight: 500;
    font-size: 18px;
    text-transform: uppercase;
}
.yith-wcan-filters li.filter-item {
    padding: 4px 8px;
}
.yith-wcan-filters li.filter-item:not(:last-child) {
    border-bottom: 1px solid #ececec;
}
.yith-wcan-filters li.filter-item>label {
    margin-bottom: 0;
}
.yith-wcan-filters li.filter-item>label input {
    margin-bottom: 0;
}
.yith-wcan-filters li.filter-item a {
    font-weight: 400;
}

/* css sản phẩm */
a.woocommerce-LoopProduct-link.woocommerce-loop-product__link {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: 38px;
}
.product-small.box span.lienhe {
    font-size: 16px;
    color: #ff564a;
}

/* css chi tiết bài viết */
.single-post div#masthead {
    background: #000000;
}
.single-post div#masthead ul li.menu-item a.nav-top-link {
    color: #fff;
}
.entry-content.single-page a, .nav-previous a, .logged-in-as a, .nav-next a{
color: #ff564a;
}
.single-post .blog-single {
    background-color: rgb(39, 37, 37);
    color: #dcdcdc;
}
.single-post .entry-content.single-page h1, .single-post .entry-title ,.single-post .entry-content.single-page h2, .single-post .entry-content.single-page h3, .single-post .entry-content.single-page h4, .single-post .entry-content.single-page h5, .single-post .entry-content.single-page , .single-post .comment-form label, .single-post .entry-content.single-page ul li {
    color: #fff;
}
.single-post .blog-single article.post.type-post {
    padding: 20px;
}
.single-post .blog-single article.post.type-post, .single-post .post-sidebar>#secondary, .single-post div#comments {
    background: #000000ad;
    border-radius: 10px;
    box-shadow: 0px 1px 6px rgb(219 239 205);
    border: 1px solid #7e7777;
}
.single-post .post-sidebar>#secondary {
	padding: 20px;
}
.product_list_widget span.lienhe {
    color: #ff564a;
}
.single-post img {
    border-radius: 8px;
}

.single-post h6.entry-category.is-xsmall {
    display: none;
}
.single-post .entry-divider.is-divider.small {
    display: none;
}
.single-post h1.entry-title {
    font-size: 23px;
    margin-bottom: 0;
}
.single-post .entry-header-text.entry-header-text-top {
    padding-bottom: 0;
}
.single-post .entry-content.single-page p {
    margin-bottom: 8px;
}
.comment-form input#submit {
    background: #ff564a;
    border-radius: 30px;
}


/* css trang giỏ hàng */
.woocommerce-cart div#content {
    background: #f8f8f8;
}
.woocommerce-cart form.woocommerce-cart-form, .cart-sidebar.col-inner {
    background: #fff;
    padding: 15px 20px;
    border-radius: 5px;
}
.woocommerce-cart .woocommerce.row.row-large.row-divided>.col {
    padding: 15px;
}
.woocommerce-cart .cart-collaterals {
    border-left: 0 !important;
}
.woocommerce-cart .shop_table th {
    font-weight: 300;
    text-transform: initial;
}
.woocommerce-cart a.checkout-button.button.alt.wc-forward {
    background-color: #ff564a;
    border-radius: 4px;
    font-weight: 200;
    font-size: 18px;
}
.woocommerce-cart input#coupon_code {
    box-shadow: 0 0;
}
.woocommerce-cart input.is-form.expand {
    background-color: #ff564a;
    color: #fff;
    text-shadow: 0 0;
    border-radius: 4px;
    font-size: 18px;
}
.woocommerce-cart a.button-continue-shopping.button.primary.is-outline {
    background-color: #ff564a;
    border: 2px solid #ff564a;
    color: #fff;
}

/* css trang thanh toán - checkout */
.woocommerce-checkout .row.row-main {
	background-color: #fff;
	padding-top: 15px;
}
input#billing_first_name, .woocommerce-checkout input#billing_address_1, .woocommerce-checkout input#billing_phone, .woocommerce-checkout input#billing_email, .woocommerce-checkout textarea#order_comments {
	border-radius: 6px;
	box-shadow: none;
	border-color: #000;
}
.woocommerce-checkout p#billing_address_1_field {
	margin-right: 0px;
}
.woocommerce-checkout table.shop_table.woocommerce-checkout-review-order-table tr th {
	text-transform: initial;
	color: #000;
}
.woocommerce-checkout .has-border {
	border: 1px solid #1e1e1e;
	border-top: 4px solid #00aeefbf;
}
.woocommerce-checkout .woocommerce-billing-fields {
    padding-top: 15px;
    border-top: 4px solid #00aeefbf;
}
.woocommerce-checkout .ts-product-image {
    width: 52px;
    height: 45px;
    padding-right: 7px;
    vertical-align: middle;
    float: left;
}
button#place_order {
	background: #54aa00;
	width: 100%;
	border-radius: 4px;
}
/* end css trang thanh toán - checkout */

@media (max-width: 1100px) and (min-width: 992px) {
	/* 	css header menu */
	div#logo {
		margin-right: 0;
	}
	div#masthead ul li.menu-item a.nav-top-link:not(li.menu-item:first-child a.nav-top-link) {
		padding-left: 14px;
	}
	div#masthead ul li.menu-item a.nav-top-link {
		font-size: 15px;
	}
}

@media (max-width: 992px) and (min-width: 850px) {
	/* 	css header menu */
	div#logo {
		margin-right: 0;
	}
	div#masthead ul li.menu-item a.nav-top-link:not(li.menu-item:first-child a.nav-top-link) {
		padding-left: 8px;
	}
	div#masthead ul li.menu-item a.nav-top-link {
		font-size: 13px;
	}
}

@media (min-width: 850px) {
	/* 	css chi tiết sản phẩm */
	.single-post .post-sidebar {
		padding-left: 0;
	}
}

@media (max-width: 768px) {
	/* 	css menu mobile */
	#masthead .mobile-nav a.is-small i {
		color: #fff;
		background: #dc515166;
		height: 32px;
		width: 32px;
		border-radius: 4px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	.off-canvas-left .mfp-content, .off-canvas-right .mfp-content {
		background: #fff;
		width: 90%;
	}
	.sidebar-menu.no-scrollbar {
		padding-top: 0;
	}
	input#woocommerce-product-search-field-0, input#woocommerce-product-search-field-1 {
		box-shadow: 0 0;
		height: 36px;
	}
	button.ux-search-submit.submit-button {
		height: 36px;
		background: #dc5151;
	}
	.mfp-content li.menu-item a {
		color: #000;
		font-weight: 400;
		font-size: 14px;
	}
}

@media (max-width: 549px) {
	/* css section danh mục sản phẩm */
	.ct-cate h3, .ct-video h3 {
		font-size: 35px;
		margin-top: 10px;
	}
	.cate-pro .box-text {
		padding: 6px 0;
	}
	.cate-pro h5 {
		font-size: 13px;
	}
	/* 	css chi tiết sản phẩm */
	.product-footer ul.product-tabs>li {
		width: 50%;
		text-align: center;
	}
	/* css các dịch vụ */
	.stack.dichvu {
		overflow: auto;
	}
	.stack.dichvu .icon-box {
		flex-basis: 43%;
		flex-shrink: 0;
		padding: 0px 5px;
	}
	.stack.dichvu .icon-box .icon-box-text.last-reset {
		padding-left: 6px;
	}
}

@media (max-width: 375px) {
	/* css section danh mục sản phẩm */
	.ct-cate h3, .ct-video h3 {
		font-size: 30px;
	}
}

.progress-wrap { position: fixed; right: 30px; bottom: 30px; height: 46px; width: 46px; cursor: pointer; display: block; border-radius: 50px; z-index: 10000; opacity: 0; visibility: hidden; transform: translateY(15px); -webkit-transition: all 200ms linear; transition: all 200ms linear; } .progress-wrap.active-progress { opacity: 1; visibility: visible; transform: translateY(0); } .progress-wrap::after { position: absolute; font-family: "fl-icons" !important; content: ""; text-align: center; font-size: 24px; color: #fff; left: 0; right: 0; margin: auto; background-color: var(--primary-color); border-radius: 99px; top: 50%; transform: translateY(-50%); height: 38px; width: 38px; line-height: 35px; cursor: pointer; display: block; z-index: 1; -webkit-transition: all 200ms linear; transition: all 200ms linear; } .progress-wrap:hover::after { background-color: #333; } .progress-wrap::before { position: absolute; font-family: "fl-icons" !important; content: ""; text-align: center; line-height: 46px; font-size: 24px; opacity: 0; background: var(--primary-color); /* --- Pijl hover kleur --- */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; left: 0; top: 0; height: 46px; width: 46px; cursor: pointer; display: block; z-index: 2; -webkit-transition: all 200ms linear; transition: all 200ms linear; } .progress-wrap:hover::before { opacity: 1; } .progress-wrap svg path { fill: none; } .progress-wrap svg.progress-circle path { stroke: var(--primary-color); /* --- Lijn progres kleur --- */ stroke-width: 4; box-sizing:border-box; -webkit-transition: all 200ms linear; transition: all 200ms linear; }
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}