/* ====================== */
/* 01. Tablet Responsive */
/* ====================== */

@media screen and (max-width: 991.98px) {
    h1,
    .heading-xl{
        font-size: 100px;
    }
    h2,
    .heading-lg{
        font-size: 50px;
    }
    h3,
    .heading-md{
        font-size: 35px;
    }
    h4,
    .heading-sm{
        font-size: 21px;
    }
    h5,
    .heading-xs{
        font-size: 18px;
    }
    h6,
    .heading-xxs{
        font-size: 16px;
    }
    p{
        font-size: 15px;
    }
    button,
    a,
    .btn,
    .nav-link,
    .dropdown-item,
    .navbar-popup-menu a{
        font-size: 14px;
    }
    .nav-btn{
        display: block;
    }
    .navbar-logo-container{
        width: 57%;
    }
    .navbar-logo-container img{
        width: 45%;
    }
    .nav-link-container{
        display: none;
    }
    .navbar-cta-container{
        width: 32%;
    }
    .footer-cta__title{
        width: 48%;
    }
    .footer-cta__btn{
        width: 80px;
        height: 80px;
    }
    .footer__content-block{
        flex-wrap: wrap;
    }
    .footer__content-intro{
        width: 100%;
    }
    .footer-logo img{
        width: 24%;
    }
    .footer__quicklink.quicklink__company{
        width: 18%;
    }
    .footer__quicklink.quicklink__service{
        width: 26%;
    }
    .footer__quicklink.footer__contact{
        width: 31%;
    }
    .footer-list li{
        font-size: 16px;
    }
    .btn{
        padding: 15px 30px;
    }
    .form label{
        line-height: 1.8em;
    }
    .form input,
    .form textarea{
        line-height: 1.8em;
    }
    .sub-heading{
        font-size: 16px;
    }
    .page-container{
        max-width: 90%;
    }
    .home__heading-container{
        gap: 0px;
        justify-content: space-between;
    }
    .banner-home__reviewer{
        width: 41%;
    }
    .banner-home__reviewer-image{
        width: 140px;
    }
    .banner-home__reviewer-image img{
        width: 50px;
        height: 50px;
    }
    .banner-home__reviewer-description{
        width: 135px;
    }
    .home__banner-cta{
        width: 270px;
        padding-top: 65px;
    }
    .home-banner__page-layout{
        flex-direction: column;
    }
    .card-banner-home{
        width: 48%;
        padding: 20px;
    }
    .card-banner-home__reservation{
        width: 100%;
        margin-bottom: -380px;
    }
    .home-reviewer__section{
        padding: 500px 0px 0px;
    }
    .home-reviewer__page-layout{
        width: 100%;
    }
    .home-reviewer__avatar-content{
        width: 32%;
    }
    .home-reviewer__rating-count{
        font-size: 35px;
    }
    .banner-home__reviewer-counter{
        font-size: 21px;
    }
    .banner-home__reviewer-counter .suffix{
        font-size: 16px;
    }
    .card-banner-home__description{
        font-size: 14px;
    }
    .banner-inner__list-item{
        font-size: 18px;
    }
    .section-partnership{
        padding: 60px 0px 120px;
    }
    .service__heading-cta{
        width: 38%;
    }
    .service__cta-image{
        width: 36%;
    }
    .service-detail__page-layout{
        flex-direction: column;
    }
    .service-detail__main{
        width: 100%;
    }
    .service-detail__solutions-layout{
        flex-direction: column-reverse;
    }
    .service-detail__solution-image{
        width: 100%;
    }
    .service-detail__solution-image img{
        height: 345px;
    }
    .service-detail__solution-list{
        width: 100%;
    }
    .service-detail__options-layout{
        flex-direction: column;
    }
    .service-detail__options-image{
        width: 100%;
    }
    .service-detail__options-image img{
        height: 345px;
    }
    .service-detail__options-list{
        width: 100%;
    }
    .service-detail__sidebar{
        width: 100%;
    }
    .whychooseus__heading-container{
        width: 68%;
    }
    .whychooseus__content{
        flex-direction: column;
    }
    .whychooseus__feature-col{
        width: 100%;
        flex-direction: row;
        align-items: stretch;
    }
    .whychooseus__feature-col .whychooseus__feature-item{
        flex: 1;
    }
    .whychooseus__feature-col .divider{
        border-bottom: 0;
        border-left: 2px solid var(--accent-color-3);
        width: 2px;
        align-self: stretch;
    }
    .whychooseus__content .whychooseus__feature-col:first-child .whychooseus__feature-item{
        padding-bottom: 30px;
    }
    .whychooseus__content .whychooseus__feature-col:last-child .whychooseus__feature-item{
        padding-top: 30px;
    }
    .whychooseus__content .whychooseus__feature-col:last-child {
        border-top: 2px solid var(--accent-color-3);
    }
    .whychooseus__image-col{
        width: 100%;
    }
    .whychooseus__stat-number{
        font-size: 35px;
    }
    .whychooseus__stat-number .whychooseus__stat-suffix{
        font-size: 21px;
    }
    .whychooseus__stats-bar{
        grid-template-columns: repeat(2, 1fr);
        gap: 50px 0px;
    }
    .process__page-layout{
        flex-direction: column-reverse;
        gap: 60px;
    }
    .process__intro{
        width: 100%;
        grid-template-columns: repeat(2, 1fr);
        position: relative;
        top: 0px;
    }
    .process__content{
        width: 100%;
    }
    .project__heading{
        flex-direction: column;
        gap: 20px;
    }
    .section-project{
        padding: 120px 20px;
    }
    .project__nav-container.project__nav-desktop{
        display: none;
    }
    .project-heading__title{
        width: 100%;
    }
    .project-heading__cta{
        width: 42%;
    }
    .project__nav-container.project__nav-mobile{
        display: flex;
        flex-direction: row;
        gap: 10px;
        align-items: center;
    }
    .project__footer-nav{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding-top: 20px;
    }
    .section-project .project-pagination.swiper-pagination{
        position: static;
        width: auto;
    }
    .project-pagination .swiper-pagination-bullet{
        width: 7px; 
        height: 7px;
    }
    .project-button-next,
    .project-button-prev{
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
    .card-project{
        background-size: 150% auto;
    }
    .card-project:hover{
        background-size: 170% auto;
    }
    .card-project__content{
        min-height: 585px;
        margin-top: -135px;
        transform: translateY(135px);
        padding: 30px 200px 30px 30px;
    }
    .card-project__tags.tag{
        font-size: 15px;
    }
    .testimonial__page-layout{
        flex-direction: column;
        gap: 60px;
    }
    .testimonial__intro{
        width: 100%;
        flex-direction: row;
    }
    .testimonial__intro-title{
        width: 50%;
    }
    .testimonial__intro-reviewer{
        align-self: flex-end;
        width: 44%;
    }
    .testimonial__reviewer-image,
    .testimonial__reviewer-description{
        width: 140px;
    }
    .testimonial__reviewer-image img{
        width: 50px;
        min-height: 50px;
    }
    .testimonial__reviewer-counter{
        font-size: 21px;
    }
    .testimonial__reviewer-counter .suffix{
        font-size: 16px;
    }
    .testimonial-content{
        width: 100%;
    }
    .card-testimonial{
        gap: 30px;
        padding: 40px;
    }
    .testimonial-quote{
        font-size: 24px;
    }
    .card-testimonial__avatar-image{
        width: 50px;
        height: 50px;
    }
    .card-testimonial__quote-icon{
        width: 60px;
        min-height: 60px;
    }
    .testimonial-feature__heading-container{
        width: 80%;   
    }
    .card-testimonial-feature{
        width: 48.5%;
        padding: 30px 20px;
    }
    .testimonial-feature__quote-icon{
        width: 60px;
        height: 60px;
    }
    .testimonial-feature__author-role{
        line-height: 1.8em;
    }
    .testimonial-feature__text{
        font-size: 24px;
        line-height: 1.8em;
    }
    .about__page-layout{
        flex-direction: column;
        gap: 60px;
    }
    .about__image-col{
        width: 100%;
    }
    .about__image img{
        height: 421px;;
    }
    .about__content-col{
        width: 100%;
    }
    .about-value__heading-title{
        width: 60%;
    }
    .trustedclients__top-row{
        flex-wrap: wrap;
    }
    .trustedclients__heading-col{
        width: 58%;
    }
    .trustedclients__rating-col{
        width: 32%;
    }
    .trustedclients__rating-number{
        font-size: 32px;
    }
    .trustedclients__image-col{
        width: 100%;
    }
    .trustedclients__image img{
        width: 30%;
    }
    .customer-exp__page-layout{
        flex-direction: column-reverse;
        gap: 60px;
    }
    .customer-exp__heading{
        width: 100%;
    }
    .customer-exp__feature-content{
        width: 100%;
    }
    .guarantee__page-layout{
        flex-direction: column;
        gap: 60px;
    }
    .guarantee__image-col{
        width: 100%;
    }
    .guarantee__image img{
        height: 421px;
    }
    .guarantee__content-col{
        width: 100%;
    }
    .guarantee__stat-number{
        font-size: 50px;
    }
    .guarantee__stat-suffix{
        font-size: 21px;
    }
    .guarantee__checklist-item{
        font-size: 18px;
    }
    .warranty__pane-layout,
    .warranty__tab-pane#manufacturer .warranty__pane-layout{
        flex-direction: column-reverse;
    }
    .warranty__pane-content{
        width: 100%;
    }
    .warranty__pane-image{
        width: 100%;
        min-height: 400px;
    }
    .warranty__checklist-item{
        font-size: 18px;
    }
    .financing__page-layout{
        flex-direction: column-reverse;
        gap: 60px;
    }
    .financing__content-col{
        width: 100%;
    }
    .financing__image-col{
        width: 100%;
    }
    .team__heading{
        gap: 20px;
        flex-wrap: wrap;
    }
    .team__heading-title{
        width: 100%;
    }
    .team__heading-description{
        width: 40%;
    }
    .contact-cta__page-layout,
    .contact-cta__page-layout.project-page{
        width: 80%;
    }
    .faq-preview__page-layout{
        flex-direction: column;
    }
    .faq-preview__content-col{
        width: 100%;
    }
    .faq-preview__image-col{
        width: 100%;
    }
    .faq-preview__image img{
        height: 416px;
    }
    .faq-accordion .accordion-button{
        font-size: 18px;
    }
    .blog-heading__title{
        width: 58%;
    }
    .blog-heading__cta{
        width: 39%;
    }
    .blog__nav-container.blog__nav-desktop{
        display: none;
    }
    .blog__nav-container.blog__nav-mobile{
        display: flex;
        flex-direction: row;
        gap: 10px;
        align-items: center;
    }
    .blog__footer-nav{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding-top: 20px;
    }
    .blog-pagination.swiper-pagination{
        position: static;
        width: auto;
    }
    .blog-button-next,
    .blog-button-prev{
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
    .blog-pagination .swiper-pagination-bullet{
        width: 7px;
        height: 7px;
    }
    .single-post__page-layout{
        flex-direction: column-reverse;
        gap: 60px;
    }
    .single-post__main{
        width: 100%;
    }
    .single-post__search input{
        font-size: 14px;
    }
    .single-post__tags-container{
        width: 44%;
        gap: 10px;
    }
    .single-post__tag{
        font-size: 14px;
    }
    .single-post__sidebar{
        top: 0px;
        position: relative;
        width: 100%;
    }
    .single-post__recent-list{
        grid-template-columns: repeat(2, 1fr);
    }
    .single-post__recent-title{
        font-size: 16px;
    }
    .contact__page-layout{
        flex-direction: column;
    }
    .contact__content-col{
        width: 100%;
    }
    .contact__form-col{
        width: 100%;
    }
    .notfound-label{
        font-size: 144px;
    }
    .banner-notfound__description{
        width: 75%;
    }
}

/* ====================== */
/* 02. Mobile Responsive */
/* ====================== */

@media screen and (max-width: 767.98px) {
    h1,
    .heading-xl{
        font-size: 50px;
        letter-spacing: -2px;
    }
    h2,
    .heading-lg{
        font-size: 35px;
    }
    h3,
    .heading-md{
        font-size: 25px;
    }
    h4,
    .heading-sm{
        font-size: 18px;
        letter-spacing: -0.5px;
    }
    h5,
    .heading-xs{
        font-size: 16px;
    }
    h6,
    .heading-xxs{
        font-size: 14px;
    }
    p{
        font-size: 14px;
    }
    button,
    a,
    .btn,
    .nav-link,
    .dropdown-item,
    .navbar-popup-menu a{
        font-size: 12px;
    }
    .navbar-logo-container{
        width: 47%;
    }
    .navbar-logo-container img{
        width: 100%;
    }
    .nav-btn{
        font-size: 22px;
    }
    .navbar-cta-container{
        display: none;
    }
    .footer__page-layout{
        align-items: center;
    }
    .footer__content-block{
        gap: 50px;
    }
    .footer-logo img{
        width: 49%;
    }
    .footer-cta__title{
        width: 62%;
    }
    .footer-cta__btn{
        width: 60px;
        height: 60px;
    }
    .footer__content-intro{
        align-items: center;
        text-align: center;
    }
    .footer__quicklink.quicklink__company{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .footer__quicklink.quicklink__service{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .footer__quicklink.footer__contact{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .footer-list{
        align-items: center;
    }
    .footer-list li{
        font-size: 14px;
    }
    .footer-list.no-icon-list li{
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    .footer-contact__icon{
        margin: 0px;
    }
    .footer-contact__detail-text{
        font-size: 12px;
    }
    .footer__copyright-container{
        flex-direction: column;
        gap: 5px;
        align-items: center;
        text-align: center;
    }
    .footer-copyright-text{
        font-size: 12px;
    }
    .footer-copyright-list li{
        font-size: 12px;
    }
    .btn{
        padding: 13px 26px;
    }
    .form label{
        font-size: 12px;
    }
    .form input,
    .form textarea{
        font-size: 12px;
    }
    .sub-heading{
        font-size: 14px;
    }
    .section-home{
        padding: 60px 0px 500px;
    }
    .home__heading-container{
        flex-direction: column;
    }
    .home__heading{
        width: 100%;
    }
    .banner-home__reviewer-image{
        width: 140px;
    }
    .banner-home__reviewer{
        width: 100%;
        flex-direction: column;
        gap: 0px;
        align-items: center;
        text-align: center;
    }
    .home__heading-container{
        flex-direction: column-reverse;
        gap: 30px;
    }
    .home__heading{
        justify-content: flex-start;
        padding-left: 20px;
    }
    .home__heading.home__heading-highlight{
        justify-content: flex-end;
        padding-right: 20px;
    }
    .home__banner-cta{
        width: 100%;
        text-align: center;
        align-items: center;
        padding-top: 0px;
    }
    .home-banner__page-layout{
        align-items: center;
    }
    .card-banner-home{
        width: 68%;
        text-align: center;
    }
    .card-banner-home__header{
        flex-direction: column;
    }
    .card-banner-home__reviwer img{
        width: 50px;
        min-height: 50px;
    }
    .home-reviewer__page-layout{
        flex-direction: column;
    }
    .home-reviwer__heading{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .home-reviewer__avatar-content{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .home-reviewer__avatar-image img{
        width: 50px;
        min-height: 50px;
    }
    .home-reviewer__rating-container{
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .home-reviewer__rating-count{
        font-size: 25px;
    }
    .banner-home__reviewer-counter{
        font-size: 18px;
        letter-spacing: -0.5px;
    }
    .banner-home__reviewer-counter .suffix{
        font-size: 14px;
    }
    .card-banner-home__description{
        font-size: 12px;
    }
    .banner-inner.banner-single-post .banner-inner__title{
        width: 100%;
    }
    .banner-inner__list{
        flex-wrap: wrap;
        justify-content: center;
    }
    .banner-inner__list-item{
        font-size: 16px;
    }
    .service__heading-container{
        flex-direction: column;
        gap: 20px;
    }
    .service__heading{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .service__heading-cta{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .card-service{
        align-items: center;
        text-align: center;
    }
    .card-service-cta{
        padding: 30px 30px 350px;
    }
    .card-service__heading{
        align-items: center;
        text-align: center;
    }
    .service__icon{
        width: 15%;
    }
    .card-service-cta__content{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .service__cta-image{
        width: 100%;
        right: 0px;
    }
    .service__cta-image img{
        width: 75%;
    }
    .whychooseus__content{
        gap: 30px;
    }
    .whychooseus__feature-col{
        flex-direction: column;
    }
    .whychooseus__content .whychooseus__feature-col:first-child .whychooseus__feature-item{
        padding-bottom: 0px;
    }
    .whychooseus__content .whychooseus__feature-col .whychooseus__feature-item:last-child{
        padding-top: 0px;
    }
    .whychooseus__feature-col .divider{
        width: 100%;
        border: none;
        border-bottom: 1px solid var(--accent-color-3);
    }
    .whychooseus__feature-item{
        align-items: center;
        text-align: center;
    }
    .whychooseus__feature-icon{
        width: 15%;
    }
    .whychooseus__stat-icon{
        width: 60px;
        min-height: 60px;
    }
    .whychooseus__stats-bar{
        grid-template-columns: repeat(1, 1fr);
    }
    .whychooseus__stat-number{
        font-size: 18px;
        letter-spacing: -0.5px;
    }
    .whychooseus__stat-item{
        flex-direction: column;
        text-align: center;
    }
    .whychooseus__stat-body{
        align-items: center;
    }
    .process__page-layout{
        flex-direction: column;
    }
    .process-icon{
        width: 30%;
    }
    .process__intro{
        grid-template-columns: repeat(1, 1fr);
        align-items: center;
        text-align: center;
    }
    .project__heading-container{
        flex-direction: column;
        gap: 20px;
    }
    .project__heading{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .project-heading__cta{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .card-project{
        background-size: 200% auto;
    }
    .card-project:hover{
        background-size: 220% auto;
    }
    .project-button-next,
    .project-button-prev{
        width: 35px;
        height: 35px;
        font-size: 16px;
    }
    .card-project__content{
        min-height: 555px;
        margin-top: -155px;
        transform: translateY(125px);
        padding: 20px 20px;
    }
    .card-project__tags.tag{
        font-size: 14px;
    }
    .testimonial__intro{
        flex-direction: column;
    }
    .testimonial__intro-title{
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .testimonial__intro-reviewer{
        width: 100%;
        flex-direction: column;
        gap: 10px;
        align-items: center;
        text-align: center;
    }
    .card-testimonial__avatar-image{
        width: 50px;
        min-height: 50px;
    }
    .testimonial__reviewer-counter{
        font-size: 18px;
        letter-spacing: -0.5px;
    }
    .testimonial__reviewer-counter .suffix{
        font-size: 14px;
    }
    .card-testimonial{
        flex-direction: column-reverse;
    }
    .card-testimonial__reviewer-container{
        flex-direction: column;
    }
    .card-testimonial-reviewer__avatar{
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .testimonial-quote{
        font-size: 20px;
        text-align: center;
    }
    .card-testimonial__quote-icon{
        width: 50px;
        min-height: 50px;
    }
    .testimonial-feature__heading-container{
        width: 100%;
    }
    .card-testimonial-feature{
        width: 100%;
    }
    .testimonial-feature__quote-icon{
        width: 55px;
        height: 55px;
    }
    .testimonial-feature__author-role{
        font-size: 12px;
    }
    .testimonial-feature__text{
        font-size: 20px;
        text-align: center;
    }
    .contact-cta__banner{
        width: 100%;
    }
    .about__image img{
        height: 215px;
    }
    .about__content-col{
        align-items: center;
        text-align: center;
    }
    .about-value__heading-title{
        width: 100%;
    }
    .card-value{
        align-items: center;
        text-align: center;
    }
    .value__icon{
        width: 50px;
        height: 50px;
    }
    .trustedclients__top-row{
        gap: 20px;
    }
    .trustedclients__heading-col{
        width: 100%;
        align-items: center;
        text-align: center;
        padding-bottom: 0px;
    }
    .trustedclients__rating-col{
        width: 100%;
        align-items: center;
        text-align: center;
        padding-bottom: 0px;
    }
    .trustedclients__avatar-group img{
        width: 50px;
        min-height: 50px;
    }
    .trustedclients__rating-score{
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .trustedclients__rating-number{
        font-size: 25px;
    }
    .trustedclients__image img{
        width: 58%;
    }
    .customer-exp__heading{
        align-items: center;
        text-align: center;
    }
    .customer-exp__feature-content{
        justify-content: center;
    }
    .customer-exp__feature-item{
        width: 85%;
        align-items: center;
        text-align: center;
        align-self: center;
    }
    .guarantee__image img{
        height: 215px;
    }
    .guarantee__content-col{
        align-items: center;
        text-align: center;
    }
    .guarantee__content-row{
        width: 100%;
        flex-direction: column;
        gap: 30px;
        align-items: center;
        text-align: center;
    }
    .card-guarantee__badge{
        width: 100%;
    }
    .guarantee__stat-number{
        font-size: 35px;
        letter-spacing: -1.8px;
    }
    .guarantee__stat-suffix{
        font-size: 18px;
        letter-spacing: -0.5px;
    }
    .guarantee__checklist-item{
        font-size: 16px;
    }
    .warranty__pane-content{
        padding: 30px 20px;
    }
    .warranty__duration-icon{
        width: 60px;
        min-height: 60px;
        font-size: 25px;
    }
    .warranty__checklist-item{
        font-size: 16px;
    }
    .financing__content-col{
        align-items: center;
        text-align: center;
    }
    .financing__feature-item{
        text-align: start;
    }
    .financing__feature-icon{
        width: 60px;
        min-height: 60px;
    }
    .financing__feature-body{
        width: 230px;
    }
    .card-simple-financing__icon{
        width: 100%;
    }
    .card-simple-financing .card-header{
        flex-direction: column;
    }
    .card-simple-financing .card-simple-financing__header-body{
        width: 100%;
    }
    .simple-financing__icon-badge{
        width: 100%;
        height: 30px;
        top: 0;
        right: 0;
        font-size: 14px;
    }
    .team__heading{
        align-items: center;
        text-align: center;
    }
    .team__heading-description{
        width: 100%;
    }
    .team__heading-cta{
        width: 100%;
        align-self: center;
        justify-content: center;
    }
    .contact-cta__page-layout,
    .contact-cta__page-layout.project-page{
        width: 100%;
    }
    .card-faq-cta{
        width: 75%;
        padding: 30px 20px;
    }
    .faq-preview__content-col{
        align-items: center;
        text-align: center;
    }
    .faq-accordion .accordion-item{
        text-align: start;
    }
    .faq-accordion .accordion-button{
        font-size: 16px;
    }
    .faq-general__page-layout{
        flex-direction: column;
    }
    .faq-general__heading-col{
        width: 100%;
        align-items: center;
        text-align: center;
        position: relative;
        top: 0px;
    }
    .faq-general__accordion-col{
        width: 100%;
    }
    .faq-general__cta-card{
        flex-direction: column;
        align-items: center;
    }
    .blog__page-heading{
        flex-direction: column;
    }
    .blog-heading__title{
        width: 100%;
    }
    .blog-heading__cta{
        width: 100%;
    }
    .blog-button-next,
    .blog-button-prev{
        width: 35px;
        height: 35px;
        font-size: 16px;
    }
    .single-post__main{
        text-align: center;
    }
    .single-post__footer{
        flex-direction: column;
        gap: 20px;
        align-items: center;
        text-align: center;
    }
    .single-post__tags-container{
        width: 100%;
        flex-direction: column;
        align-items: center;
    }
    .single-post__tags{
        width: 100%;
        justify-content: center;
    }
    .single-post__share{
        flex-wrap: wrap;
    }
    .card-single-post__author{
        padding: 25px 25px;
        flex-direction: column;
        gap: 20px;
    }
    .single-post__author-info{
        width: 100%;
    }
    .single-post__author-avatar{
        margin: 0px;
    }
    .single-post__comment-form{
        padding: 25px;
        align-items: flex-start;
        text-align: start;
    }
    .single-post__comment-checkbox{
        flex-direction: column;
        align-items: flex-start;
    }
    .single-post__search input{
        font-size: 0.8rem;
    }
    .card-single-post__widget--recent{
        padding: 20px;
    }
    .single-post__recent-list{
        grid-template-columns: repeat(1, 1fr);
    }
    .single-post__recent-image{
        width: 30%;
        margin-right: 14px;
    }
    .contact__info-grid{
        grid-template-columns: repeat(1, 1fr);
    }
    .contact__info-card{
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .contact__form-card{
        padding: 30px 20px;
    }
    #contact-form .btn{
        width: 100%;
        text-align: center;
        justify-content: center;
    }
    .notfound-label{
        font-size: 80px;
    }
    .banner-notfound__description{
        width: 100%;
    }
}

/* ====================== */
/* 03. Mobile Spacing Responsive */
/* ====================== */


@media screen and (min-width: 767.98px){

    /* Flex spacing (gap) */

    .flex-gap-md-0 { 
        gap: 0px; 
    }
    .flex-gap-md-1 { 
        gap: 10px; 
    }
    .flex-gap-md-2 { 
        gap: 20px; 
    }
    .flex-gap-md-3 { 
        gap: 30px; 
    }
    .flex-gap-md-4 { 
        gap: 40px; 
    }
    .flex-gap-md-5 { 
        gap: 50px; 
    }
    .flex-gap-md-100 { 
        gap: 100px; 
    }

    /* Grid spacing (column-gap) */

    .flex-gap-x-md-0 { 
        column-gap: 0px; 
    }
    .flex-gap-x-md-0 { 
        column-gap: 0px; 
    }
    .flex-gap-x-md-1 { 
        column-gap: 10px; 
    }
    .flex-gap-x-md-2 { 
        column-gap: 20px; 
    }
    .flex-gap-x-md-3 { 
        column-gap: 30px; 
    }
    .flex-gap-x-md-4 { 
        column-gap: 40px; 
    }
    .flex-gap-x-md-5 { 
        column-gap: 50px; 
    }
    .flex-gap-x-md-100 { 
        column-gap: 100px; 
    }

    /* Grid spacing (row-gap) */

    .flex-gap-y-md-0 { 
        row-gap: 0px; 
    }
    .flex-gap-y-md-1 { 
        row-gap: 10px; 
    }
    .flex-gap-y-md-2 { 
        row-gap: 20px; 
    }
    .flex-gap-y-md-3 { 
        row-gap: 30px; 
    }
    .flex-gap-y-md-4 { 
        row-gap: 40px; 
    }
    .flex-gap-y-md-5 { 
        row-gap: 50px; 
    }
    .flex-gap-y-md-100 { 
        row-gap: 100px; 
    }

    /* Grid spacing (row-gap & column-gap) */

    .grid-gap-md-0 { 
        --bs-gutter-x: 0px; 
        --bs-gutter-y: 0px; 
    }
    .grid-gap-md-1 { 
        --bs-gutter-x: 10px; 
        --bs-gutter-y: 10px; 
    }
    .grid-gap-md-2 { 
        --bs-gutter-x: 20px; 
        --bs-gutter-y: 20px; 
    }
    .grid-gap-md-3 { 
        --bs-gutter-x: 30px; 
        --bs-gutter-y: 30px; 
    }
    .grid-gap-md-4 { 
        --bs-gutter-x: 40px; 
        --bs-gutter-y: 40px; 
    }
    .grid-gap-md-5 { 
        --bs-gutter-x: 50px; 
        --bs-gutter-y: 50px; 
    }
    .grid-gap-md-100 { 
        --bs-gutter-x: 100px; 
        --bs-gutter-y: 100px; 
    }

    /* Grid spacing (column-gap) */

    .grid-gap-x-md-0 { 
        --bs-gutter-x: 0px; 
    }
    .grid-gap-x-md-1 { 
        --bs-gutter-x: 10px; 
    }
    .grid-gap-x-md-2 { 
        --bs-gutter-x: 20px; 
    }
    .grid-gap-x-md-3 { 
        --bs-gutter-x: 30px; 
    }
    .grid-gap-x-md-4 { 
        --bs-gutter-x: 40px; 
    }
    .grid-gap-x-md-5 { 
        --bs-gutter-x: 50px; 
    }
    .grid-gap-x-md-100 { 
        --bs-gutter-x: 100px; 
    }

    /* Grid spacing (row-gap) */

    .grid-gap-y-md-0 { 
        --bs-gutter-y: 0px; 
    }
    .grid-gap-y-md-1 { 
        --bs-gutter-y: 10px; 
    }
    .grid-gap-y-md-2 { 
        --bs-gutter-y: 20px; 
    }
    .grid-gap-y-md-3 { 
        --bs-gutter-y: 30px; 
    }
    .grid-gap-y-md-4 { 
        --bs-gutter-y: 40px; 
    }
    .grid-gap-y-md-5 { 
        --bs-gutter-y: 50px; 
    }
    .grid-gap-y-md-100 { 
        --bs-gutter-y: 100px; 
    }
}

/* ====================== */
/* 04. Tablet Spacing Responsive */
/* ====================== */

@media screen and (min-width: 991.98px){
    /* Flex spacing (gap) */
    .flex-gap-lg-0 { 
        gap: 0px; 
    }
    .flex-gap-lg-1 { 
        gap: 10px; 
    }
    .flex-gap-lg-2 { 
        gap: 20px; 
    }
    .flex-gap-lg-3 { 
        gap: 30px; 
    }
    .flex-gap-lg-4 { 
        gap: 40px; 
    }
    .flex-gap-lg-5 { 
        gap: 50px; 
    }
    .flex-gap-lg-100{
        gap: 100px;
    }

    /* Grid spacing (column-gap) */

    .flex-gap-x-lg-0 { 
        column-gap: 0px;
    }
    .flex-gap-x-lg-1 { 
        column-gap: 10px; 
    }
    .flex-gap-x-lg-2 {
         column-gap: 20px; 
    }
    .flex-gap-x-lg-3 { 
        column-gap: 30px; 
    }
    .flex-gap-x-lg-4 { 
        column-gap: 40px; 
    }
    .flex-gap-x-lg-5 { 
        column-gap: 50px; 
    }
    .flex-gap-x-lg-100{
        column-gap: 100px;
    }

    /* Grid spacing (row-gap) */

    .flex-gap-y-lg-0 { 
        row-gap: 0px; 
    }
    .flex-gap-y-lg-1 { 
        row-gap: 10px; 
    }
    .flex-gap-y-lg-2 { 
        row-gap: 20px; 
    }
    .flex-gap-y-lg-3 { 
        row-gap: 30px; 
    }
    .flex-gap-y-lg-4 { 
        row-gap: 40px; 
    }
    .flex-gap-y-lg-5 { 
        row-gap: 50px; 
    }
    .flex-gap-y-lg-100 {
        row-gap: 100px;
    }

    /* Grid spacing (row-gap & column-gap) */

    .grid-gap-lg-0 { 
        --bs-gutter-x: 0px; 
        --bs-gutter-y: 0px; 
    }
    .grid-gap-lg-1 { 
        --bs-gutter-x: 10px; 
        --bs-gutter-y: 10px; 
    }
    .grid-gap-lg-2 { 
        --bs-gutter-x: 20px; 
        --bs-gutter-y: 20px; 
    }
    .grid-gap-lg-3 { 
        --bs-gutter-x: 30px; 
        --bs-gutter-y: 30px; 
    }
    .grid-gap-lg-4 { 
        --bs-gutter-x: 40px; 
        --bs-gutter-y: 40px; 
    }
    .grid-gap-lg-5 { 
        --bs-gutter-x: 50px; 
        --bs-gutter-y: 50px; 
    }
    .grid-gap-lg-100 { 
        --bs-gutter-x: 100px; 
        --bs-gutter-y: 100px; 
    }

    /* Grid spacing (column-gap) */

    .grid-gap-x-lg-0 { 
        --bs-gutter-x: 0px; 
    }
    .grid-gap-x-lg-1 { 
        --bs-gutter-x: 10px; 
    }
    .grid-gap-x-lg-1 { 
        --bs-gutter-x: 10px; 
    }
    .grid-gap-x-lg-2 { 
        --bs-gutter-x: 20px;
    }
    .grid-gap-x-lg-3 { 
        --bs-gutter-x: 30px; 
    }
    .grid-gap-x-lg-4 { 
        --bs-gutter-x: 40px; 
    }
    .grid-gap-x-lg-5 { 
        --bs-gutter-x: 50px; 
    }
    .grid-gap-x-lg-100 { 
        --bs-gutter-x: 100px; 
    }

    /* Grid spacing (row-gap) */

    .grid-gap-y-lg-0 { 
        --bs-gutter-y: 0px; 
    }
    .grid-gap-y-lg-1 { 
        --bs-gutter-y: 10px; 
    }
    .grid-gap-y-lg-1 { 
        --bs-gutter-y: 10px; 
    }
    .grid-gap-y-lg-2 { 
        --bs-gutter-y: 20px; 
    }
    .grid-gap-y-lg-3 { 
        --bs-gutter-y: 30px; 
    }
    .grid-gap-y-lg-4 { 
        --bs-gutter-y: 40px; 
    }
    .grid-gap-y-lg-5 { 
        --bs-gutter-y: 50px; 
    }
    .grid-gap-y-lg-100 { 
        --bs-gutter-y: 100px; 
    }
}