/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/*body { background: red; }*/

/* Font : Lora */
@import url(/wp-content/themes/astra-child/assets/fonts/Lora/stylesheet.css);

:root {
    --font-title: Lora;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-title) !important;
}







/* ========================
    Scroll To Top
========================= */

#ast-scroll-top {
    font-size: 15px;
    border: 1px solid #1450a1 !important;
    background: #1450a1 !important;
    width: 40px;
    height: 40px;
    color: #ffffff;
    border-radius: 12px;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

#ast-scroll-top .ast-icon {
    transform: rotate(-90deg);
    display: flex;
    align-items: center;
    justify-content: center;
}

#ast-scroll-top .ast-icon i {
    font-size: 10px;
}





/* ========================
    Global CSS
========================= */

a:focus {
    outline: none !important;
}


.entry-content a {
    text-decoration: none !important;
    color: #020202 !important;
    transition: all 0.3s linear !important;
}

.entry-content .email_link a {
    text-decoration: underline !important;
}

.entry-content a:hover {
    color: #1450a1 !important;
}

.entry-content ul,
.entry-content ol {
    padding-left: 30px;
    color: #3D3D3D;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 12px 0px;
}

.entry-content ul li {
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    border-radius: 12px;
    padding: 8px 16px;
    transition: all 0.3s linear;
}

.video-banner {
    position: relative !important;
}


.video-banner .video_section {
    height: 90dvh !important;
    position: relative !important;
    width: 100% !important;
}

.video-banner video {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}




.border-section {
    border-top: 1px solid #0000001A !important;
}



/* ========================
    Blog Card
========================= */


/* ---------- Hero banner ---------- */
.unlived-self-hero-card {
    min-height: 350px;
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    margin-bottom: 24px;
    background: #000;
}

.unlived-self-hero-card:hover .unlived-self-hero-excerpt {
    color: #ffffff;
}

.unlived-self-hero-link {
    position: relative;
    display: flex;
    align-items: stretch;
    height: 100%;
    min-height: inherit;
    /* min-height: 256px;
    color: #fff;
    text-decoration: none; */
}

.unlived-self-hero-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.unlived-self-static-blog .unlived-self-hero-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.unlived-self-hero-overlay {
    position: absolute;
    inline-size: -webkit-fill-available;
    background: linear-gradient(270deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.7) 41.95%, rgba(0, 0, 0, 0) 100%);
    max-width: 812px;
    min-height: stretch;
    right: 0;
    /* z-index: 99; */
}

.unlived-self-hero-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-left: auto;
    width: 50%;
    padding: 30px;
    /* min-height: 350px; */
}

.unlived-self-hero-title {
    display: block;
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #FFFFFF;
    margin: 16px 0px 8px;
}

.unlived-self-hero-excerpt {
    display: block;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #B5B7B6;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    transition: all 0.3s linear;
}

/* ---------- Meta row ---------- */
.unlived-self-blog-meta {
    /* font-family: var(--lora); */
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #F3F3F3;
    display: flex;
    align-items: center;
    /* margin-left: 5px; */
}

.unlived-self-blog-meta svg {
    margin-right: 9px;
}

.unlived-self-blog-dot {
    /* padding: 0px 6px; */
}

.us-icon-calendar {
    /* flex: none; */
    /* opacity: .8; */
}

.unlived-self-blog-readtime {
    margin-left: 5px;
}

/* ---------- Read more ---------- */
.unlived-self-blog-read-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
    text-decoration: none;
    margin-top: 20px;
}

.us-icon-arrow {
    transition: all 0.3s linear;
}

.unlived-self-hero-link:hover .us-icon-arrow,
.unlived-self-static-card-link:hover .us-icon-arrow {
    transform: translateX(3px);
}

/* ---------- Grid ---------- */
.unlived-self-static-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.unlived-self-static-grid article {
    padding: 0px !important;
    width: 100%;
}

.unlived-self-static-card {
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .06);
    transition: all 0.3s linear;
}

.unlived-self-static-grid .unlived-self-static-card {
    /* min-height: 517px; */
}

.unlived-self-static-grid .unlived-self-static-card a {
    height: 100%;
    min-height: auto;
}

.unlived-self-static-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
}

.unlived-self-static-card-link {
    display: block;
    color: inherit;
    text-decoration: none;
    position: relative;
}

.unlived-self-static-card-link::after {
    /* position: absolute;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 58.05%, rgba(0, 0, 0, 0.8) 100%);
    width: 100%;
    height: 265px;
    left: 0px;
    bottom: 0px; */
}

.unlived-self-static-card-image {
    display: block;
    /* aspect-ratio: 16 / 10; */
    aspect-ratio: 16 / 13.24;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.unlived-self-static-card-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
    transition: all 0.3s linear;
}

.unlived-self-static-card:hover .unlived-self-static-card-image img {
    transform: scale(1.03);
}


.unlived-self-static-grid .unlived-self-hero-overlay {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 265px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 58.05%, rgba(0, 0, 0, 0.8) 100%);
}

.unlived-self-static-card-content {
    position: absolute;
    bottom: 0;
    display: block;
    padding: 20px 22px 22px;
}

.unlived-self-static-card-title {
    /* display: block; */
    /* font-size: 19px; */
    /* font-weight: 700; */
    /* line-height: 1.3; */
    /* margin: 0 0 8px; */
    /* color: #17181a; */
}

.unlived-self-static-card-excerpt {
    /* display: block; */
    /* font-size: 14px; */
    /* line-height: 1.55; */
    /* color: #666; */
}

.unlived-self-static-card:hover .unlived-self-hero-excerpt {
    color: #ffffff;
}

.unlived-self-static-card .unlived-self-blog-read-more {
    margin-top: 20px;
}

/* ---------- Pagination ---------- */
.unlived-self-blog-pagination {
    margin-top: 32px;
    display: flex;
    justify-content: center;
}

.unlived-self-blog-pagination ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.unlived-self-blog-pagination li a,
.unlived-self-blog-pagination li span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 8px;
    border-radius: 8px;
    text-decoration: none;
    color: #333;
}

.unlived-self-blog-pagination li span.current {
    background: #111;
    color: #fff;
}











/* Single Post */

.left_image_section .e-con-inner {
    min-width: fit-content;
    margin: 0px;
    width: 100%;
    height: 100%;
}

.left_image_section .e-con-inner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.right_content {
    margin: 0px !important;
    padding: 80px 50px !important;
    width: 100% !important;
    min-width: 50% !important;
}

.right_content .e-con-inner {
    margin: 0px !important;
    max-width: 590px !important;
}




.ast-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0px !important;
}

.ast-container .site-main.unlived-self-single {
    margin: 0px !important;
    padding: 0px !important;
}

.ast-container .site-main.unlived-self-single article {
    width: 100%;
    padding: 50px 15px 70px 15px;
}

.unlived-self-single-featured-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
}


.ast-container .site-main.unlived-self-single article .unlived-blog-layout {
    display: flex;
    gap: 50px;
    align-items: flex-start;
    max-width: 1280px;
    margin: 0 auto;
}

.ast-container .site-main.unlived-self-single article .unlived-blog-content {
    width: auto;
}

.blog-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}

.back-link {
    display: flex;
    align-items: center;
    gap: 8px;
}

.back-link a {
    font-size: 14px;
    line-height: 20px;
    color: #020202;
    transition: all 0.3s linear;
}

.back-link a:hover {
    color: #1450a1;
}

.blog-date {
    display: flex;
    align-items: center;
    gap: 8px;
}



.unlived-blog-content h1 {
    font-weight: 500;
    font-size: 28px;
    line-height: 34px;
    color: #020202;
    margin-bottom: 20px;
}

.unlived-blog-content h2 {
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #020202;
    margin-bottom: 20px;
    margin-top: 20px;
}

.unlived-blog-content p {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #3D3D3D;
    margin-bottom: 20px;
}

.ast-article-single figure,
.ast-article-single img:not(figure img) {
    box-shadow: none !important;
}

.ast-article-single img {
    border-radius: 12px;
    margin-bottom: 20px;
}



.ast-container .site-main.unlived-self-single article .unlived-blog-toc {
    width: 64%;
    position: sticky;
    top: 20%;
}

.unlived-blog-toc__inner {
    background: #F3F3F3;
    border: 1px solid #E7E8E8;
    border-radius: 16px;
    overflow: hidden;
}

.side-tab_title {
    border-bottom: 1px solid #E7E8E8;
    padding: 16px;
    background: #FBFBFB;
}

.unlived-blog-toc__title {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    color: #020202;
}



.unlived-blog-toc__list {
    margin: 0px;
    counter-reset: section;
    counter-reset: step;
}

.unlived-blog-toc__point {
    list-style: none;
    padding: 0px;
    position: relative;
    counter-increment: step;
}


.unlived-blog-toc__link {
    position: relative;
    font-weight: 500 !important;
    font-size: 16px;
    line-height: 24px;
    color: #3D3D3D !important;
    display: block;
    width: 100%;
    padding: 12px 16px 12px 40px;
    transition: all 0.3s linear;
}

.unlived-blog-toc__link::before {
    content: counter(step) ".";
    position: absolute;
    top: 26%;
    left: 6%;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
}

.unlived-blog-toc__link:hover,
.unlived-blog-toc__link:focus {
    background: #FFFFFF;
    color: #020202 !important;
    outline: none !important;
}

.unlived-blog-toc__link.is-active {
    background: #ffffff;
    color: #020202 !important;
}



.unlived-self-recent-articles {
    background: #020202;
    padding: 70px 15px;
}

.unlived-container {
    max-width: 1280px;
    margin: 0 auto;
}

.unlived-self-recent-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.unlived-self-recent-title {
    font-weight: 500;
    font-size: 42px;
    line-height: 52px;
    color: #FFFFFF;
}

.unlived-self-recent-btn {
    background: #FFFFFF;
    border: 1px solid #FFFFFF;
    padding: 12px 24px;
    color: #020202;
    border-radius: 12px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s linear;
}

.unlived-self-recent-btn span {
    font-size: 12px;
    padding: 5px;
}

.unlived-self-recent-btn:hover {
    background: transparent;
    color: #FFFFFF !important;
}





/* Contact Form */


.single-post form.wpcf7-form.init {
    max-width: none !important;
}

.row.contact-form__row {
    display: flex;
    flex-direction: row;
    gap: 20px;
}

.row.contact-form__row .col {
    line-height: 0px;
}

.row.contact-form__row p,
.contact-form__row.contact-form__row--single p,
.number-lebal {
    margin-bottom: 0px !important;
}

.contact-form__row p>label {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #1d1d1b;
    margin-bottom: 8px;
    display: inline-block;
}

.wpcf7 input.wpcf7-form-control:not([type=submit]),
.wpcf7-form-control-wrap input.wpcf7-form-control,
.wpcf7 textarea.wpcf7-form-control {
    padding: 12px 16px !important;
    border: 1px solid #E7E8E8 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    height: 48px !important;
    /* font-family: var(--font-Urbanist) !important; */
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    letter-spacing: 0% !important;
    color: #1d1d1b !important;
    margin-top: 0px !important;
}

.wpcf7-form-control-wrap textarea {
    min-height: 110px !important;
    resize: vertical !important;
}

.wpcf7 input.wpcf7-form-control:placeholder,
.wpcf7 textarea.wpcf7-form-control:placeholder {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0%;
    color: #B5B7B6;
}

.wpcf7 input.wpcf7-form-control:focus,
.wpcf7 textarea.wpcf7-form-control:focus {
    border: 1px solid #1d1d1b73 !important;
}


.tus-phone-row .iti {
    flex-wrap: wrap !important;
}

.tus-phone-row button.iti__selected-country {
    min-height: 48px !important;
    height: 100% !important;
    box-shadow: none !important;
    border: 1px solid #E7E8E8 !important;
}


.tus-phone-row .iti__selected-country-primary {
    height: auto !important;
    gap: 6px !important;
}

.tus-phone-row .iti__selected-country-primary:hover {
    background: transparent !important;
}


.tus-phone-row .iti__selected-dial-code {
    margin-left: 0px !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: #020202 !important;
}

.iti__country-container button.iti__selected-country {
    box-shadow: none !important;
    border: 1px solid #E7E8E8 !important;
    border-radius: 12px !important;
}


.iti__search-input-wrapper {
    border-bottom: 1px solid #E7E8E8 !important;
    box-shadow: none !important;
}

.iti__country-container .iti__dropdown-content {
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px !important;
    border: none !important;
    overflow: hidden !important;
    border-radius: 16px !important;
    width: 100% !important;
}

.iti__search-icon {
    position: absolute !important;
    right: 6% !important;
    left: inherit;
    display: flex !important;
    pointer-events: none !important;
}

.iti__search-input-wrapper input#iti-0__search-input {
    border: 0px;
    box-shadow: none;
    padding: 12px 16px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    letter-spacing: 0% !important;
    color: #1d1d1b !important;
}

.iti--inline-dropdown .iti__country-list {
    margin: 0px !important;
    padding: 20px !important;
}

.iti--inline-dropdown .iti__country-list::-webkit-scrollbar {
    display: none !important;
}

.entry-content ul li {
    /* font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    border-radius: 8px !important;
    color: #020202 !important; */
}

.entry-content ul li:hover {
    /* background: #0000000d !important; */
}

.wpcf7-not-valid-tip {
    display: none !important;
}

label.error {
    color: #DC2626;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 8px;
    display: block;
}

.submit-button,
.submit-button p {
    margin-bottom: 0px !important;
}

button.wpcf7-submit {
    padding: 16px 12px;
    width: 100%;
    font-size: 16px;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: auto;
    box-shadow: none;
    background: #020202;
    border: 1px solid #020202;
    transition: all 0.3s linear;
}

button.wpcf7-submit span {
    font-size: 12px;
    padding: 5px;
}

button.wpcf7-submit:hover {
    background: #FFFFFF;
    color: #020202;
}

.wpcf7-spinner {
    display: none !important;
}


.subscribe-form,
.subscribe-form p {
    margin-bottom: 0px !important;
}

.subscribe-form .wpcf7-form-control-wrap {
    position: relative;
}

/* White Input */
.subscribe-form.subscribe-input .wpcf7-form-control-wrap input.wpcf7-form-control {
    min-width: 518px !important;
    border: 1px solid #E8E8E8 !important;
    background: #F7F7F7 !important;
    color: #404643 !important;
}

.subscribe-form.subscribe-input .wpcf7-form-control-wrap input.wpcf7-form-control::placeholder {
    color: #404643 !important;
}

.subscribe-form.subscribe-input .wpcf7-form-control.wpcf7-submit {
    position: absolute;
    top: 3.5px;
    right: 4px;
    background: #020202;
    border: 1px solid #020202;
    padding: 8px 24px;
    color: #FFFFFF;
    font-size: 16px;
    line-height: 24px;
    transition: all 0.3s linear;
}

.subscribe-form.subscribe-input .wpcf7-form-control.wpcf7-submit:hover {
    background: #8d8e8e;
    color: #ffffff;
}


/* Black Input */
.subscribe-form .wpcf7-form-control-wrap input.wpcf7-form-control {
    border: 1px solid #E8E8E81F !important;
    background: #171717 !important;
    height: 50px !important;
    color: #FFFFFF !important;
}

.subscribe-form .wpcf7-form-control-wrap input.wpcf7-form-control::placeholder {
    color: #B5B7B6 !important;
}

.subscribe-form .wpcf7-form-control.wpcf7-submit {
    position: absolute;
    top: 3.5px;
    right: 4px;
    background: #FFFFFF;
    border: 1px solid #ffffff;
    padding: 8px 24px;
    color: #020202;
    font-size: 16px;
    line-height: 24px;
    transition: all 0.3s linear;
}

.subscribe-form .wpcf7-form-control.wpcf7-submit:hover {
    background: #B5B7B6;
    color: #000000;
}

.subscribe-form .wpcf7-spinner {
    display: none !important;
}



/* Error Messages */

.wpcf7 form.invalid .wpcf7-response-output {
    margin: 3% 0% 0%;
    border-color: #d41717;
    color: red;
    text-align: center;
    border-radius: 50px;
    font-size: 15px;
    padding: 15px 10px;
}


.wpcf7 form.sent .wpcf7-response-output {
    margin: 3% 0% 0%;
    border-color: #46b450;
    color: #46b450;
    text-align: center;
    border-radius: 50px;
    font-size: 15px;
    padding: 15px 10px;
}







/* ---------- Responsive ---------- */

@media only screen and (max-width: 1200px) {
    .subscribe-form.subscribe-input .wpcf7-form-control-wrap input.wpcf7-form-control {
        min-width: auto !important;
    }
}

@media only screen and (max-width: 1024px) {
    .ast-container .site-main.unlived-self-single article .unlived-blog-toc {
        width: 100%;
    }

    .unlived-self-recent-title {
        font-size: 32px;
        line-height: 42px;
    }

    .subscribe-form.subscribe-input .wpcf7-form-control-wrap input.wpcf7-form-control {}

    .video-banner .video_section {
        height: 70dvh !important;
    }
}


@media only screen and (max-width: 991px) {
    .unlived-self-hero-card {
        min-height: 300px;
    }

    .unlived-self-hero-title {
        font-size: 20px;
        line-height: 28px;
    }

    .row.contact-form__row {
        flex-direction: column;
    }

    .tus-phone-row .wpcf7-form-control-wrap .wpcf7-form-control {
        width: 100% !important;
    }
}

@media only screen and (max-width: 767px) {
    .unlived-self-static-grid {
        grid-template-columns: 1fr;
    }

    .ast-container .site-main.unlived-self-single article .unlived-blog-layout {
        flex-direction: column;
        gap: 30px;
    }

    .unlived-blog-toc__link::before {
        left: 4%;
    }

    .unlived-self-hero-card .unlived-self-hero-link {
        aspect-ratio: 16 / 13.24;
    }

    .unlived-self-hero-content {
        position: absolute;
        bottom: 0;
        display: block;
        padding: 20px 22px 22px;
        width: 100%;
    }

    .unlived-self-hero-overlay {
        height: 265px;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 58.05%, rgba(0, 0, 0, 0.8) 100%);
        width: 100%;
        max-width: 100%;
    }
}

@media only screen and (max-width: 600px) {
    .unlived-self-static-blog {
        /* padding: 24px 16px; */
    }

    .unlived-self-hero-link {
        flex-direction: column;
        min-height: 0;
    }

    .unlived-self-hero-overlay {
        /* background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, .85) 40%, rgba(0, 0, 0, .35) 70%, rgba(0, 0, 0, 0) 100%); */
    }

    .unlived-self-hero-image {
        position: relative;
        height: 180px;
    }

    .unlived-self-hero-content {
        width: 100%;
        margin-left: 0;
        padding: 20px;
    }

    .unlived-self-static-grid {
        gap: 18px;
    }
}

@media only screen and (max-width: 550px) {
    .subscribe-form.subscribe-input .wpcf7-form-control-wrap input.wpcf7-form-control {
        min-width: unset !important;
    }

    .subscribe-form.subscribe-input .wpcf7-form-control.wpcf7-submit {
        position: relative;
        width: 100%;
        right: 0;
        top: 12px;
    }
}