/******************************************
    Version: 1.0
/****************************************** */

/* =========================
   MEDIA QUERY
========================= */
@media(max-width:991px){

    .navbar{
        padding:0 25px;
    }
    .logo-section img{
        position: relative;
        left: -150px;
    }

    .menu-toggle{
        display:block;
        position: relative;
        right: -120px;
    }

    .offer-btn{
        display:none;
    }

    .nav-links{
        position:absolute;
        top:95px;
        left:-100%;
        width:100%;
        background:#fff;
        flex-direction:column;
        align-items:flex-start;
        padding:30px;
        gap:25px;
        transition:0.4s;
    }

    .nav-links.active{
        left:0;
    }

    .dropdown-menu{
        position:relative;
        top:10px;
        width:100%;
        box-shadow:none;
        background:#f8f8f8;
    }

    .hero{
        height:63vh;
    }

    .hero-content h1{
        font-size:65px;
    }

    .hero-description{
        font-size:18px;
    }

    .btn{
        font-size:18px;
        padding:18px 30px;
    }
}

@media(max-width:600px){

    .hero{
        top: 100px;
        height:87vh;
    }

    .logo-section img{
        position: relative;
        left: -65px;
        top: 5px;
    }

    .menu-toggle{
        display:block;
        position: relative;
        right: -30px;
        color: rgb(8, 8, 94);
    }

    .hero-content h1{
        font-size:30px;
    }

    .welcome-text{
        font-size:16px;
    }

    .hero-description{
        font-size:16px;
        line-height:1.6;
    }

    .hero-buttons{
        flex-direction:column;
        align-items:center;
        gap:15px;
    }

    .btn{
        width:100%;
        max-width:200px;
    }
}


/* ========================= */
/* MEDIA QUERY  for about*/
/* ========================= */

@media(max-width:1200px){

    .about-content h1{
        font-size:55px;
    }

    .about-text{
        font-size:20px;
    }

    .feature-box h3{
        font-size:28px;
    }

    .feature-box p{
        font-size:18px;
    }
}

@media(max-width:991px){

    .about-container{
        flex-direction:column;
    }

    .about-image,
    .about-content{
        width:100%;
    }

    .about-content h1{
        font-size:48px;
    }

    .years-box{
        right:20px;
        bottom:-25px;
    }
}

@media(max-width:768px){

    .about-section{
        padding:80px 5%;
    }

    .about-content h1{
        font-size:38px;
    }

    .about-text{
        font-size:17px;
        line-height:1.8;
    }

    .feature-box{
        gap:15px;
    }

    .icon-box{
        min-width:60px;
        height:60px;
    }

    .icon-box i{
        font-size:22px;
    }

    .feature-box h3{
        font-size:22px;
    }

    .feature-box p{
        font-size:15px;
    }

    .years-box{
        width:170px;
        padding: 0px 20px;
    }

    .years-box h2{
        font-size:40px;
    }

    .years-box p{
        font-size:16px;
    }
}

@media(max-width:480px){

    .about-content h1{
        font-size:32px;
    }

    .about-tag{
        font-size:13px;
    }

    .about-text{
        font-size:15px;
    }

    .feature-box{
        align-items:flex-start;
    }

    .years-box{
        position:relative;
        right: auto;
        bottom: 60px;
        padding: 1px 20px;
    }
}

/* =========================================
  pop-up TABLET
========================================= */

@media (max-width:991px){

    .container3{
        flex-direction:column;
        gap:40px;
    }

    .left-content3,
    .right-images{
        width:100%;
    }

    .left-content3{
        text-align:center;
    }

    .left-content3 h2{
        font-size:38px;
    }

    .left-content3 p{
        max-width:100%;
        margin:0 auto 25px;
    }

    .top-img img{
        height:220px;
    }

    .bottom-imgs{
        gap:15px;
    }

    .bottom-imgs img{
        height:180px;
    }

    .popup-content{
        width:85%;
        padding:25px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:768px){

    .accommodation{
        padding:50px 0;
    }

    .container3{
        width:92%;
        gap:30px;
    }

    .left-content3 h2{
        font-size:30px;
        line-height:1.2;
    }

    .left-content3 p{
        font-size:15px;
        line-height:1.7;
    }

    .btn-dark{
        padding:12px 30px;
        font-size:14px;
    }

    .top-img img{
        height:180px;
        margin-bottom:15px;
    }

    .bottom-imgs{
        flex-direction:column;
        gap:15px;
    }

    .bottom-imgs img{
        width:100%;
        height:170px;
    }

    /* POPUP */

    .popup-content{
        width:95%;
        max-height:90vh;
        padding:18px;
    }

    .popup-content .h2{
        left:0;
        font-size:24px;
        text-align:center;
    }

    .section1 h3{
        font-size:17px;
        height:auto;
        padding:12px;
    }

    .section1 p,
    .popup-content .section1 div{
        font-size:14px;
        line-height:1.6;
        padding:10px;
    }

    .close-btn{
        font-size:28px;
        top:8px;
        right:12px;
    }

    .container2{
        padding:15px;
    }

    /* BUTTON */

    .custom-btn{
        width:100%;
        justify-content:center;
    }

    .btn-text{
        flex:1;
        text-align:center;
        padding:12px;
        font-size:15px;
    }

    .btn-arrow{
        padding:12px 18px;
        font-size:18px;
    }

}

/* =========================================
  about-section
========================================= */
/* =========================================
   TABLET
========================================= */

@media (max-width:991px){

    .about-container1{
        flex-direction:column;
        gap:50px;
    }

    .about-images1,
    .about-content1{
        width:100%;
    }

    .about-images{
        min-height:420px;
    }

    .circle1.large{
        width:350px;
        height:350px;
        right:50%;
        transform:translateX(50%);
    }

    .circle1.small{
        width:220px;
        height:220px;
        left:80px;
        bottom:0;
    }

    .about-content1{
        text-align:center;
    }

    .line{
        margin:0 auto 25px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:768px){

    .about-section1{
        padding:50px 0;
    }

    .about-container1{
        width:92%;
        gap:35px;
    }

    .about-images1{
        min-height:340px;
    }

    .circle1{
        border-width:10px;
    }

    .circle1.large{
        width:260px;
        height:260px;
        position:relative;
        right:auto;
        top:auto;
        transform:none;
        margin:0 auto;
    }

    .circle1.small{
        width:170px;
        height:170px;
        left:15px;
        bottom:0;
    }

    .about-content1 h2{
        font-size:28px;
        line-height:1.3;
    }

    .about-content1 p{
        font-size:15px;
        line-height:1.8;
        margin-bottom:25px;
    }

    .read-btn{
        padding:12px 28px;
        font-size:14px;
    }

}
/* =========================================
  about-section end
========================================= */

/* =========================================
  HISTORY SECTION
========================================= */
/* =========================================
   TABLET
========================================= */

@media (max-width:991px){

    .history-container{
        flex-direction:column;
        gap:35px;
    }

    .history-content,
    .history-image{
        width:100%;
    }

    .history-title{
        padding:14px 18px;
    }

    .history-title h2{
        font-size:24px;
    }

    .history-content p{
        font-size:16px;
        line-height:1.7;
    }

    .history-image img{
        width:100%;
        border-radius:6px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:768px){

    .history-section{
        padding:50px 0;
    }

    .history-container{
        width:92%;
        gap:25px;
    }

    .history-title{
        padding:12px 15px;
        margin-bottom:20px;
    }

    .title-bar{
        width:5px;
        height:28px;
        margin-right:12px;
    }

    .history-title h2{
        font-size:20px;
        line-height:1.3;
    }

    .history-content p{
        font-size:15px;
        line-height:1.8;
        margin-bottom:15px;
        text-align:justify;
    }

    .history-image img{
        width:100%;
        height:auto;
        border-radius:5px;
    }

}
/* =========================================
  HISTORY SECTION end
========================================= */

/* =========================================
    Church  brief HISTORY SECTION TABLET
========================================= */

@media (max-width:991px){

    .hero-section12{
        padding:60px 0;
    }

    .container12{
        flex-direction:column;
        gap:50px;
        text-align:center;
    }

    .hero-content12,
    .hero-image12{
        width:100%;
    }

    .hero-content12 p{
        max-width:100%;
        margin:0 auto 30px;
    }

    .bg-number12{
        font-size:140px;
        left:50%;
        transform:translateX(-50%);
        top:-35px;
    }

    .underline12{
        margin:0 auto 20px;
    }

    .circle12{
        width:320px;
        height:320px;
    }

    .ring12{
        width:355px;
        height:355px;
        border-width:20px;
        top:-18px;
    }

    .shape-orange-top12{
        width:100px;
        height:28px;
        right:40px;
        top:40px;
    }

    .shape-orange-bottom12{
        width:105px;
        height:24px;
        right:40px;
        bottom:30px;
    }

    .shape-black12{
        width:95px;
        height:30px;
        left:50px;
        bottom:20px;
    }

    .shape-blue12{
        width:55px;
        height:55px;
        border-width:9px;
        right:40px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:768px){

    .hero-section12{
        padding:45px 0;
    }

    .container12{
        width:92%;
        gap:35px;
    }

    .hero-content12 h1{
        font-size:30px;
        line-height:1.3;
    }

    .hero-content12 p{
        font-size:15px;
        line-height:1.8;
    }

    .bg-number12{
        font-size:90px;
        top:-15px;
        left:50%;
        transform:translateX(-50%);
    }

    .underline12{
        width:55px;
        height:4px;
        margin:0 auto 18px;
    }

    .circle12{
        width:240px;
        height:240px;
    }

    .ring12{
        width:270px;
        height:270px;
        border-width:14px;
        top:-15px;
    }

    /* Decorative Shapes */

    .shape-orange-top12{
        width:70px;
        height:18px;
        border-width:3px;
        top:15px;
        right:15px;
    }

    .shape-orange-bottom12{
        width:75px;
        height:18px;
        bottom:20px;
        right:15px;
    }

    .shape-black12{
        width:70px;
        height:22px;
        border-width:3px;
        left:15px;
        bottom:10px;
    }

    .shape-blue12{
        width:40px;
        height:40px;
        border-width:7px;
        right:20px;
        bottom:-5px;
    }

}
/* =========================================
    Church  brief HISTORY SECTION TABLET end
========================================= */