* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --color-one: #000000;
    --color-two: #ffffff;
}


/*================================ Common Styles ================================*/
body {
    font-family: "Cormorant Garamond", serif;
}

ul {
    list-style-type: none;
}

a {
    text-decoration: none;
}

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

html {
    scroll-behavior: smooth;
}

section {
    padding-top: 100px;
    padding-bottom: 100px;
}

.section-title h2 {
    font-size: 3rem;
    font-weight: 500;
    line-height: 1;
}

.bg-one {
    background-color: #f4f1ed;
    color: var(--color-one);
}

.bg-two {
    background-color: var(--color-one);
    color: var(--color-two);
}

.gradiant-bg {
    background: linear-gradient(90deg, #000000, #3533cd);
    color: var(--color-two);
}

.leadership-section.gradiant-bg {
    background: linear-gradient(180deg, #000000, #3533cd);
    color: var(--color-two);
}

.section-hr {
    width: 4px;
    height: 80px;
    background: linear-gradient(0deg, #000000, #3533cd);
    margin-right: 10px;
}

.bg-two .section-hr,
.gradiant-bg .section-hr {
    background: var(--color-two);
    width: 2px;
}

.section-title-wrap {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 50px;
}

.section-button {
    margin-top: 30px;
    text-align: right;
}

.section-button a {
    color: var(--color-two);
    border: 2px solid var(--color-two);
    padding: 8px 20px;
    background: linear-gradient(90deg, #000000, #3533cd);
    font-size: 20px;
    font-weight: 600;
}

.section-button a:hover {
    background: linear-gradient(90deg, #3533cd, #000000);
}



/*================================ Navigation  ================================*/
nav {
    background: var(--color-one);
    z-index: 10;
    height: 80px;
}

.nav {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 9px 0;
    gap: 100px;
}


#logo a img {
    width: 130px;
}

/* #logo {
    max-width: 100px;
} */

#menu {
    display: flex;
    gap: 100px;
}

#menu a {
    color: var(--color-two);
    text-decoration: none;
    /* border-bottom: 1px solid transparent; */
    font-size: 25px;
    /* padding: 0 3px; */
}

#menu a:hover {
    border-bottom: 1px solid var(--color-two);
}

#menuToggle {
    display: none;
    cursor: pointer;
    font-size: 1.5em;
    color: var(--color-two);
}

@media only screen and (min-width: 991px) {
    #menu {
        display: flex !important;
    }
}

@media only screen and (max-width: 991px) {

    /* nav {
        padding-top: 5px;
    } */
    #logo a img {
        width: 115px;
    }

    #menu {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 78px;
        left: 0;
        width: 100%;
        background-color: var(--color-one);
        z-index: 1;
        height: 100vh;
        /* padding-top: 10px; */
        gap: 30px !important;
        padding-top: 30px;
    }

    #logo {
        max-width: 180px;
    }

    #menu a {
        padding-left: 40px;
    }

    #menuToggle {
        display: block;
    }

    #menuToggle.open {
        display: none;
    }

    #menuToggle.closed {
        display: block;
    }

    /* #menu a.active {
        border-bottom: none;
    } */

    .nav {
        justify-content: space-between;
    }
}


/*tab-portrait*/
@media (min-width: 992px) and (max-width: 1200px) {}

#menu,
.nav {
    gap: 100px;
}


/*================================ Hero Section ================================*/
.hero-wrapper {
    height: 100vh;
    display: flex;
    flex-direction: column;
    position: relative;
}

#navbar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.hero-bottom-bar {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: var(--color-one);
    color: var(--color-two);
    padding-top: 15px;
    padding-bottom: 15px;
}

.hero-video-wrap,
.hero-bottom-bar {
    width: 100%;
}

.hero-video-wrap {
    top: 80px;
    height: calc(100vh - 200px);
    position: relative;
}

.hero-bottom-right a {
    color: #fff;
}

/* .hero-video-wrap video {
    object-fit: cover;
} */

.hero-video-wrap iframe {
    object-fit: cover;
}

.hero-bottom-left .img-wrap {
    width: 100px;
    height: auto;
}

.hero-bottom-left .img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.hero-bottom-left .text-wrap h2 {
    font-size: 40px;
}

.hero-bottom-inner-bar {
    display: flex;
}

.hero-bottom-left {
    display: flex;
    width: 50%;
    gap: 40px;
}

.hero-bottom-right span svg {
    fill: var(--color-two);
    width: 35px;
    height: 35px;
}

.hero-bottom-right {
    display: flex;
    width: 50%;
    justify-content: space-evenly;
}

.hero-bottom-right div {
    display: flex;
    flex-direction: column;
    font-size: 25px;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.hero-bottom-right a:hover {
    color: #e86c1f;
}

.hero-bottom-right a:hover svg {
    fill:  #e86c1f;
}

.hero-bottom-left-hr {
    background-color: var(--color-two);
    width: 2px;
}

.video-top-img-wrap {
    position: absolute;
    bottom: 0;
    left: 50px;
    width: 20%;
}

.video-top-img-wrap img {
    width: 100%;
    display: block;
}


/*================================ About Section ================================*/
.about-wrapper {
    display: flex;
}


.about-image,
.about-text {
    width: 50%;
}

.about-wrapper .about-text p {
    font-size: 35px;
    margin-bottom: 20px;
}

.about-image .img-wrap.image-one {
    width: 280px;
}

.about-image .img-wrap.image-one img {
    width: 100%;
}

/*================================ Services Section ================================*/
.services-wrapper {
    display: flex;
    gap: 80px;
}

.services-text h3 {
    font-size: 40px;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
}

.services-text p {
    font-size: 25px;
}

.services-card {
    width: 50%;
}

.services-image .img-wrap img {
    width: 100%;
    height: auto;
    border-radius: 20px;
}

/*================================ Contact Section ================================*/
.contact-section {
    padding-top: 0;
    padding-bottom: 0;
}

.contact-section .contact-map img {
    width: 100%;
}

.contact-section .contact-map iframe {
    display: block;
}

.contact-section span svg {
    fill: var(--color-two);
    width: 35px;
    height: 35px;
}

.location {
    display: flex;
    gap: 30px;
}

.location span p {
    font-size: 25px;
}

/* .contact-section .section-title h2 {
    font-size: 50px;
} */

.contact-section .section-title-wrap {
    align-items: center;
}

.contact-section .section-hr {
    height: 50px;
}

.social-icons {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.contact-text-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
}

.location-text,
.social-icons,
.contact-details {
    flex: 1;
}

.contact-section .gradiant-bg {
    padding-top: 50px;
    padding-bottom: 50px;
}

.contact-details p {
    font-size: 28px;
    text-align: center;
    margin-bottom: 20px;
}

.contact-details div {
    display: flex;
    gap: 25px;
}

.contact-details .email-me {
    margin-bottom: 15px;
}

.contact-details div span {
    font-size: 25px;
}

.contact-details .email-me a {
    color: var(--color-two);
}

.contact-details .email-me a {
    display: flex;
    align-items: center;
    gap: 15px;
}

.contact-details .email-me a:hover span, .contact-details .email-me a:hover span svg {
    opacity: .8;
}

.contact-details .email-me a span {
    line-height: 1;
    display: block;
}

.contact-details .email-me a span svg {
    display: block;
}

/*================================ Our Ministry ================================*/
.our-ministry-wrapper {
    display: flex;
    gap: 80px;
}

.our-ministry-text p {
    font-size: 30px;
}

.our-ministry-text P:first-child {
    margin-bottom: 30px;
}

/*================================ Our Commitment ================================*/
.commitment-section {
    padding-top: 0;
    padding-bottom: 0;
    color: var(--color-two);
}

.commitment-section-wrap {
    background-image: url("../img/commitment-bg.png");
    padding-top: 100px;
    padding-bottom: 100px;
}

.commitment-single-card-wrap {
    border: 1px solid var(--color-two);
    border-radius: 20px;
    min-height: 200px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
}

.commitment-grid-iteam h3 {
    text-align: center;
    font-size: 40px;
    margin-bottom: 30px;
}

.commitment-card-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 50px;
}

.commitment-section-inner-wrap h2 {
    font-size: 60px;
    text-align: center;
}

.commitment-section-inner-wrap p {
    text-align: center;
    font-size: 30px;
    width: 50%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 30px;
}

.commitment-single-card-wrap p {
    width: 100%;
    font-size: 25px;
    margin: 0;
}

.commitment-single-card-wrap span svg {
    fill: var(--color-two);
    width: 40px;
    height: 40px;
    position: absolute;
    top: -12%;
}

.commitment-card-wrap {
    margin-top: 80px;
}

/*================================ Ministry Section ================================*/
.ministry-section {
    padding-top: 0;
    padding-bottom: 0;
}

.ministry-section .section-title-wrap {
    justify-content: center;
}

.ministry-sec-one,
.ministry-sec-two,
.ministry-sec-three {
    padding-top: 50px;
    padding-bottom: 50px;
}

.ministry-grid-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 50px;
}


.ministry-grid-wrapper .ministry-grid-iteam .grid-image .img-wrap img {
    width: 100%;
    height: 100%;
    border-radius: 20px;
}

.ministry-grid-wrapper .ministry-grid-iteam .grid-text {
    border: 1px solid var(--color-two);
    border-radius: 20px;
    text-align: center;
    padding: 20px;
    min-height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-top: 20px;
}

.ministry-grid-wrapper .ministry-grid-iteam .grid-text h3 {
    font-size: 30px;
    margin-bottom: 20px;
}

.ministry-grid-wrapper .ministry-grid-iteam .grid-text p {
    font-size: 20px;
}

.ministry-sec-two .ministry-grid-wrapper .ministry-grid-iteam .grid-text {
    border: 1px solid var(--color-one);
}


/*================================ Leadership Section ================================*/
.leadership-wrapper {
    display: flex;
    gap: 100px;
}

.leadership-text p {
    font-size: 35px;
    margin-top: 100px;
}

.leadership-text,
.leadership-image {
    width: 50%;
}

.leadership-image .img-wrap img {
    width: 100%;
    height: 100%;
}


/*================================ Teachings Section ================================*/
.teachings-section {
    padding-top: 0;
    padding-bottom: 0;
}

.teachings-video-grid-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 50px;
}

.teachings-wrapper {
    display: flex;
    gap: 50px;
}

.teachings-video {
    width: 60%;
    padding-bottom: 50px;
}

.teachings-image {
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.teachings-image .img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.teachings-top-wrap {
    padding-top: 50px;
}

.teachings-bottom-wrap {
    padding-top: 80px;
    padding-bottom: 100px;
}

.teachings-bottom-wrap-video-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 100px 50px;
}

.teachings-video-grid-iteam {
    padding-bottom: 90px;
}

.teachings-video-grid-iteam p {
    font-size: 27px;
    margin-top: 20px;
}

.teachings-bottom-wrap-video-wrap .video-wrap-iteam p {
    color: var(--color-one);
    font-size: 30px;
    margin-top: 10px;
    font-weight: 600;
}

.teachings-image .section-title-wrap {
    margin-left: 50px;
}

/*================================ Program Section ================================*/
.program-grid-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 30px;
}

.program-card-social-icon {
    background-color: var(--color-one);
    width: max-content;
    border-radius: 100%;
    padding: 10px;
}

.program-card-social-icon span svg {
    width: 30px;
    height: 30px;
    fill: var(--color-two);
    display: flex;
    align-items: center;
    justify-content: center;
}

.program-card-social-icon.facebook {
    background-color: #0000ff;
}

.program-card-social-icon.youtube {
    background-color: #ff0000;
}

.program-card-social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.program-grid-iteam.flex-card {
    display: flex;
    gap: 30px;
    flex-direction: column;
}

.program-card .program-card-text {
    font-family: "Lobster", serif;
    font-size: 30px;
    text-align: center;
}

.program-card-four.program-card .program-card-text {
    color: #caaacd;
}

.program-card-social-icon a:hover svg, .social-icons a:hover svg {
    opacity: 0.8;
}

.program-card-one {
    background-color: #393be7;
}

.program-card-two {
    background-color: #50a2e8;
}

.program-card-three {
    background-color: #ef601e;
}

.program-card-four {
    background-color: #d6e8f7;
}

.program-card-five {
    background: linear-gradient(90deg, #000000, #3533cd);
}

.program-card {
    border-radius: 20px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.program-card .plus-icon span svg {
    fill: var(--color-one);
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.program-card .plus-icon {
    background-color: var(--color-two);
    width: max-content;
    border-radius: 100%;
    padding: 5px;
    margin-left: auto;
}

.program-card .img-wrap img {
    width: 100%;
    height: 100%;
}

/*================================ Music Section ================================*/
.music-section {
    background-image: url("../img/music-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    padding-top: 150px;
    padding-bottom: 150px;
    position: relative;
}

.music-section .container {
    position: relative;
}

.bg-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.music-wrapper {
    display: flex;
    gap: 60px;
}

.music-wrapper .section-title h2 {
    color: var(--color-two);
}

.music-wrapper .section-hr {
    background: var(--color-two);
}

.music-left {
    width: 40%;
}

.music-right {
    width: 60%;
}

.music-right-grid-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.music-wrapper .img-wrap img {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    margin-bottom: 10px;
}

.music-title {
    font-size: 30px;
    font-weight: 600;
    margin-left: 20px;
    color: var(--color-two);
}

/*================================ Partner Section ================================*/
.partner-section {
    background-image: url("../img/partner-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}

.partner-wrapper {
    width: 50%;
    margin-left: auto;
}

.partner-wrapper p {
    font-size: 30px;
}

.partner-wrapper-para {
    margin-bottom: 50px;
}

.partner-section .section-title h2 {
    color: #004aad;
}

.partner-wrapper p {
    color: #3852c3;
}

/*================================ Upcoming Events ================================*/
.events-grid-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}

.events-grid-wrapper .events-grid-iteam .events-image .img-wrap img {
    width: 100%;
    height: 100%;
}

.events-grid-wrapper .events-grid-iteam .events-text {
    border: 1px solid var(--color-two);
    height: 250px;
    padding: 50px;
    margin-top: 20px;
}

.events-grid-wrapper .events-grid-iteam .events-text span {
    font-size: 20px;
}

.events-grid-wrapper .events-grid-iteam .events-text p {
    font-size: 30px;
    margin-top: 20px;
}

.upcoming-events .section-button a {
    font-size: 13px;
}




/*mobile-view*/
@media screen and (max-width: 767px) {

    /*================================ Common Styles ================================*/
    section {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .section-title h2 {
        font-size: 2.2rem;
        line-height: 1.2;
    }
    

    .section-hr {
        height: 55px;
        margin-right: 0;
    }

    .section-button {
        text-align: center;
    }

    /*================================ Navigation  ================================*/

    /*================================ Hero Section ================================*/
    .hero-bottom-inner-bar {
        flex-direction: column;
        gap: 50px;
        height: 100%;
    }

    .hero-bottom-left {
        flex-direction: column;
    }

    .hero-bottom-left,
    .hero-bottom-right {
        width: 100%;
        align-items: center;
    }

    .hero-bottom-left .text-wrap {
        text-align: center;
    }

    .hero-video-wrap {
        height: 500px;
        top: 0;
    }

    .video-top-img-wrap {
        width: 30%;
        left: 0;
    }

    #navbar,
    .hero-bottom-bar {
        position: relative;
    }

    .hero-bottom-bar {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .hero-bottom-left {
        gap: 15px;
    }

    .hero-wrapper {
        height: 100%;
    }

    .hero-bottom-right {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }

    /*================================ About Section ================================*/
    .about-wrapper {
        flex-direction: column;
        gap: 50px;
    }

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

    .about-image .img-wrap img {
        width: 100%;
        height: 100%;
    }

    .about-wrapper .about-text p {
        font-size: 25px;
    }

    /*================================ Services Section ================================*/
    .services-text h3 {
        font-size: 2rem;
    }
    .section-title-wrap {
        align-items: flex-start;
    }
    .services-wrapper {
        flex-direction: column;
        gap: 50px;
    }

    .services-card {
        width: 100%;
    }

    .services-text p {
        font-size: 1.5rem;
        text-align: center;
    }

    .services .section-button {
        margin-top: 50px;
        margin-bottom: 30px;
    }

    /*================================ Contact Section ================================*/
    .contact-text-wrap {
        flex-direction: column;
    }

    .contact-details div {
        justify-content: center;
        gap: 15px;
    }

    .location {
        gap: 15px;
    }

    .contact-details .email-me {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .contact-section .contact-map .img-wrap {
        height: 500px;
    }

    .contact-section .contact-map .img-wrap img {
        height: 100%;
        object-fit: cover;
    }

    /*================================ Our Ministry ================================*/
    .our-ministry-wrapper {
        flex-direction: column;
        gap: 50px;
    }

    .our-ministry-image img {
        width: 100%;
        height: 100%;
    }

    .our-ministry-text p {
        font-size: 25px;
    }

    /*================================ Our Commitment ================================*/
    .commitment-card-wrap {
        grid-template-columns: 1fr;
        margin-top: 50px;
    }

    .commitment-section-wrap {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .commitment-section-inner-wrap h2 {
        font-size: 2.2rem;
    }

    /*================================ Ministry Section ================================*/
    .ministry-grid-wrapper {
        grid-template-columns: 1fr;
    }

    .commitment-section-inner-wrap p {
        width: 100%;
        font-size: 1.8rem;
    }

    

    /*================================ Leadership Section ================================*/
    .leadership-wrapper {
        flex-direction: column;
        gap: 50px;
    }
    

    .leadership-text,
    .leadership-image {
        width: 100%;
    }

    .leadership-text p {
        margin-top: 50px;
        font-size: 1.8rem;
    }

    /*================================ Teachings Section ================================*/
    .teachings-wrapper {
        flex-direction: column-reverse;
        gap: 50px;
    }

    .teachings-video {
        padding-bottom: 100px;
    }

    .teachings-video,
    .teachings-image {
        width: 100%;
    }

    .teachings-video-grid-wrapper {
        grid-template-columns: 1fr;
        gap: 100px;
    }

    .teachings-bottom-wrap-video-wrap {
        grid-template-columns: 1fr;
    }

    .teachings-top-wrap {
        padding-top: 30px;
    }

    .teachings-bottom-wrap {
        padding-top: 50px;
    }

    .teachings-image .img-wrap img {
        width: 100%;
        height: 100%;
    }

    .teachings-image .section-title-wrap {
        margin-left: 0;
        margin-bottom: 50px;
    }

    .teachings-video-grid-iteam {
        padding-bottom: 0;
    }

    /*================================ Program Section ================================*/
    .program-grid-wrapper {
        grid-template-columns: 1fr;
    }

    .program-card-five {
        background: linear-gradient(280deg, #000000, #3533cd);
    }

    /*================================ Music Section ================================*/
    .music-wrapper {
        flex-direction: column;
        gap: 50px;
    }

    .music-right-grid-wrap {
        grid-template-columns: 1fr;
        gap: 50px;
    }

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

    .music-section {
        padding-top: 50px;
        padding-bottom: 50px;
        background-position: inherit;
    }

    /*================================ Partner Section ================================*/
    .partner-wrapper {
        width: 100%;
    }

    .partner-section {
        background-position: right;
        height: 100%;
    }

    .partner-wrapper p {
        font-size: 25px;
    }

    .partner-wrapper-para {
        margin-bottom: 20px;
    }

    /*================================ Upcoming Events ================================*/
    .events-grid-wrapper {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .events-grid-wrapper .events-grid-iteam .events-text {
        height: 200px;
        padding: 30px;
        margin-top: 10px;
    }
}




/*tab-portrait*/
@media screen and (min-width: 768px) and (max-width: 991px) {

    /*================================ Common Styles ================================*/
    section {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .section-title h2 {
        font-size: 3rem;
    }

    .section-hr {
        height: 55px;
        margin-right: 0;
    }

    /*================================ Navigation  ================================*/

    /*================================ Hero Section ================================*/
    .hero-video-wrap {
        top: 0;
    }


    .video-top-img-wrap {
        width: 25%;
    }

    .hero-bottom-left .text-wrap h2 {
        font-size: 30px;
    }

    .hero-bottom-left {
        gap: 20px;
    }

    .hero-bottom-right {
        gap: 20px;
    }

    .hero-bottom-right div {
        font-size: 20px;
    }


    #menu {
        top: 74px;
        padding-top: 30px;
    }

    #navbar,
    .hero-bottom-bar {
        position: relative;
    }


    /*================================ About Section ================================*/
    .about-wrapper .about-text p {
        font-size: 1.8rem;
    }
    .about-wrapper {
        gap: 50px;
    }

    .about-image .img-wrap img {
        width: 100%;
        height: 100%;
    }

    /*================================ Services Section ================================*/
    .services-wrapper {
        gap: 50px;
    }

    /*================================ Contact Section ================================*/
    .contact-text-wrap {
        flex-direction: column;
        align-items: flex-start;
    }

    .contact-details div {
        justify-content: flex-start;
    }

    .contact-details p {
        padding-bottom: 30px;
        text-align: left;
    }

    .location,
    .contact-details div {
        gap: 20px;
    }

    .contact-section .contact-map .img-wrap {
        height: 500px;
    }

    .contact-section .contact-map .img-wrap img {
        height: 100%;
        object-fit: cover;
    }

    /*================================ Our Ministry ================================*/
    .our-ministry-wrapper {
        flex-direction: column;
    }

    .our-ministry-image img {
        width: 100%;
        height: 100%;
    }

    /*================================ Our Commitment ================================*/
    .commitment-grid-iteam h3 {
        font-size: 30px;
    }

    /*================================ Ministry Section ================================*/
    .ministry-grid-wrapper .ministry-grid-iteam .grid-text {
        min-height: 310px;
    }

    .leadership-text p {
        margin-top: 0;
    }


    /*================================ Leadership Section ================================*/
    .leadership-wrapper {
        gap: 25px;
    }

    /*================================ Teachings Section ================================*/
    .teachings-wrapper {
        flex-direction: column;
        gap: 100px;
    }

    .teachings-video,
    .teachings-image {
        width: 100%;
    }

    .teachings-video-grid-iteam {
        padding-bottom: 50px;
    }

    .teachings-video-grid-wrapper {
        gap: 50px;
    }

    .teachings-bottom-wrap-video-wrap {
        grid-template-columns: 1fr 1fr;
    }

    /*================================ Program Section ================================*/
    .program-grid-wrapper {
        grid-template-columns: 1fr 1fr;
    }

    .program-card-five {
        background: linear-gradient(280deg, #000000, #3533cd);
    }

    /*================================ Music Section ================================*/
    .music-wrapper {
        gap: 50px;
    }

    .music-section {
        background-position: inherit;
        padding-top: 100px;
        padding-bottom: 100px;
    }

    /*================================ Partner Section ================================*/

    /*================================ Upcoming Events ================================*/
    .events-grid-wrapper .events-grid-iteam .events-text {
        height: 200px;
        padding: 20px;
    }

    .events-grid-wrapper .events-grid-iteam .events-text p {
        font-size: 25px;
    }

    .upcoming-events .section-button a {
        font-size: 11px;
        display: block;
        width: max-content;
        margin-left: auto;
        margin-right: auto;
    }

    .commitment-card-wrap {
        gap: 30px;
    }

    .teachings-image img {
        max-width: 60%;
        margin-left: auto;
        margin-right: auto;
    }
}



@media (min-width: 992px) and (max-width: 1200px) {

    /*================================ Navigation ================================*/
    #menu,
    .nav {
        gap: 60px;
    }

    /*================================ Ministry Section ================================*/
    .ministry-grid-wrapper .ministry-grid-iteam .grid-text {
        min-height: 230px;
    }

    /*================================ Program Section ================================*/
    .program-grid-wrapper {
        grid-template-columns: 1fr 1fr;
    }

    .program-card-five {
        background: linear-gradient(280deg, #000000, #3533cd);
    }

    /*================================ Contact Section ================================*/
    .contact-text-wrap {
        gap: 40px;
    }

    .social-icons {
        gap: 30px;
    }

    .contact-details div,
    .location {
        gap: 10px;
    }

}