/*
Theme Name: Flatsome Child
Author: Xăm hình
Template: flatsome
*/

/* Add custom CSS here. */
.wp-site-blocks{overflow: hidden}

header.is-absolute .fs-block-nav a{
    color: #ffffff;
}
header.is-absolute .fs-block-nav .fs-nav-link:is(a:hover,.is-active,.current-menu-item,[aria-current=page],[aria-selected=true]),.fs-nav-link:is(a:hover,.is-active,.current-menu-item,[aria-current=page],[aria-selected=true]){
    color: var(--fs-blocks-color-secondary);
}
.fs-block-nav-overlay__content{
    background-color: var(--wp--preset--color--primary)
}
.fs-nav-back{
    background-color: var(--wp--preset--color--primary)!important;color: #fff;
}
a:where(:not(.wp-element-button)) {
    color: var(--fs-blocks-color-secondary);
}
:root :where(a:where(:not(.wp-element-button)):hover){
    color: var(--fs-blocks-color-secondary);
}
.w-100{width: 100% !important}
.color-w{
    color: #ffffff;     box-shadow: 0 12px 34px rgba(42, 30, 12, .05);
}
.h-100,.h-100>div{--fs-height:100%;height:var(--fs-height);}
.overflow-hidden{overflow: hidden;}
.justify-center{justify-content:center;}
h1, h2, h3, h4, h5, h6{line-height: 1.1}
.mt-0,.wp-block-term-template-is-layout-flow li.taxonomy-category{margin-top: 0}
.single-post .entry-content p:first-of-type::first-letter {
    float: left;
    font-size: 75px;
    line-height: 62px;
    margin-right: 8px;
    margin-top: 6px;
}

.box-offer{
    border-radius: 25px;
    & h3 {
        min-height: 57px;
    }
    & p {
        min-height: 67px;
    }
}
a.fs-button{
    font-weight: 400;
}
.trendy-bnt-video {
    max-width: 90px;
    max-height: 90px;
    background-color: #fff!important;
    color: var(--wp--preset--color--primary) !important;
}
.trendy-button {
    overflow: hidden;
    padding: 8px 8px 8px 20px;
    border-radius: 999px;
    font-weight: 600;
    transition: all 0.3s ease-in-out;
    & .fs-icon {
        transition: all 0.3s ease-in-out;
        background-color: #fff;
        color: var(--background-color);
        font-size: 25px;
        border-radius: 99px;
        padding: 5px;
        transform: rotate(-45deg);
        --fs-size: 1em;
        position: relative;
        display: inline-block;
        flex-shrink: 0;
        width: var(--fs-size);
        height: var(--fs-size);
        box-sizing: content-box;
        overflow: visible;
    }
}
.trendy-button:hover,.trendy-button:focus{
    border-color: var(--wp--preset--color--secondary) !important;
    & span{
        color: #fff;
    }
    & .fs-icon {
        transform: rotate(0deg)
    }
}
.trendy-button:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    content: "";
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    transition: -webkit-transform 500ms cubic-bezier(.86, 0, .07, 1);
    -webkit-transition: -webkit-transform 500ms cubic-bezier(.86, 0, .07, 1);
    transition: transform 500ms cubic-bezier(.86, 0, .07, 1);
    transition: transform 500ms cubic-bezier(.86, 0, .07, 1), -webkit-transform 500ms cubic-bezier(.86, 0, .07, 1);
    -webkit-transition-timing-function: cubic-bezier(.86, 0, .07, 1);
    transition-timing-function: cubic-bezier(.86, 0, .07, 1);
    background-color: var(--wp--preset--color--secondary);
    border: 1px solid var(--wp--preset--color--secondary);
}
.trendy-button:hover:before,.trendy-button:focus:before{
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
}
.box-list-solar{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 15px;max-width: 500px;
}
.box-list-solar li.fs-block-list-item{
    padding: 0;
}
.box-img-border-radius{
    overflow: hidden;
    & .fs-block-image__media {
        border-radius: 0;
    }
}
.fs-block-post-terms a {
    background-color: color-mix(in srgb, var(--wp--preset--color--secondary) 55%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 99px;
    padding: 8px 15px;
    color: #fff;
}
.fs-block-post-terms span.fs-block-post-terms__separator {
    display: none;
}
@media (max-width: 849px) {
    .box-list-solar {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}
.box-blur{
    backdrop-filter: blur(100px);
    -webkit-backdrop-filter: blur(100px);
    --border-color:#FFFFFF1A;
    --border-left-width:1px;
    --border-right-width:1px;
    --border-top-width:1px;
    --border-bottom-width:1px;
    --overlay-opacity:0.4;
    --overlay-mix-blend-mode: initial;
    --overlay-transition: 0.3s;
}
.box-blur:before{
    border-block-end-width:1px;
    border-block-start-width:1px;border-color:var(--border-color);
    border-inline-end-width: 1px;
    border-inline-start-width: 1px;
    border-radius: var(--wp--preset--border-radius--3-xl);
    content:"";
    display: block;
    height: max(100% + var(--border-top-width) + var(--border-bottom-width), 100%);
    left: calc(0px - var(--border-left-width));
    mix-blend-mode: var(--overlay-mix-blend-mode);
    opacity: var(--overlay-opacity);
    position: absolute;
    top: calc(0px - var(--border-top-width));
    transition: var(--overlay-transition, .3s);
    width: max(100% + var(--border-left-width) + var(--border-right-width), 100%);
}




@media (max-width: 849px) {

}
@media (max-width: 529px) {

}
@media (max-width: 48em) {
    /* Add mobile only CSS here. */
    .hide-mobile{display: none!important;}

}

/* Solar Living page template. */
.solar-living-steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 42px;
}
.solar-living-steps:before {
    content: "";
    position: absolute;
    top: 71px;
    left: 15%;
    right: 15%;
    border-top: 2px dashed var(--wp--preset--color--primary);
}
.solar-living-step {
    position: relative;
    min-height: 170px;
    padding: 28px 24px 20px;
    border: 1px solid var(--wp--preset--color--primary);
    border-radius: 8px;
    background: #fffdf8;
    text-align: center;
    z-index: 1;
}
.solar-living-step__num {
    position: absolute;
    top: 15px;
    left: 18px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: var(--wp--preset--color--primary);
    color: #fff;
    font-weight: 800;
}
.solar-living-step__num p {
    margin: 0;
    color: inherit;
    font-size: inherit;
    line-height: 1;
}

.solar-living-step h3 {
    margin-top: 10px;
    color: var(--solar-olive-dark);
    font-size: 17px;
    font-weight: 800;
}
.solar-living-step p {
    font-size: 13px;
    line-height: 1.34;
}
.solar-living-gallery {
    padding: 0 0 18px;
}
.solar-living-gallery__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.solar-living-gallery img {
    width: 100%;
    height: 176px;
    display: block;
    object-fit: cover;
    border-radius: 6px;
}

@media (max-width: 1024px) {
    .solar-living-steps:before {
        display: none;
    }
}

@media (max-width: 640px) {
    .solar-living-steps {
        grid-template-columns: repeat(1, 1fr);
    }
    .solar-living-steps,
    .solar-living-gallery__grid {
        border-right: 0;
        border-bottom: 1px solid var(--solar-line);
    }
}
