@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

:root {
    --yellow: #fbc94c !important;
    --red: #800000 !important;
    --font-ttl: "Inter", sans-serif;
    --font-body: "Roboto", sans-serif !important;
    --light2: #f0f0f0;
    --bg-gray1: #ededf9;
    --rgba-light2: 240, 240, 240;
}

body {
    font-family: var(--font-ttl);
    font-style: normal;
}

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

.text-yellow {
    color: var(--yellow) !important;
}

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

.text-red {
    color: var(--red) !important;
}

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

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

.mud-input-label::after {
    content: " *";
    color: red;
    display: none;
}

.mud-input-required .mud-input-label::after {
    display: inline;
}

.mud-input-label {
    font-size: 0.9rem !important;
}

.text-ttl-intro {
    color: darkgray;
    font-family: var(--font-body);
}

.text-ttl {
    color: var(--red);
    font-weight: bold;
    margin-bottom: .5rem;
    font-family: var(--font-ttl);
}

@media(min-width: 1025px) {
    .text-ttl-intro {
        font-size: 1.2rem;
    }

    .text-ttl {
        font-size: 2.5rem;
    }
}

@media(min-width: 600px) and (max-width: 1024px) {
    .text-ttl-intro {
        font-size: 1.1rem;
    }

    .text-ttl {
        font-size: 2rem;
    }
}

@media(min-width: 0) and (max-width: 599px) {
    .text-ttl-intro {
        font-size: 1rem;
    }

    .text-ttl {
        font-size: 1.7rem;
    }
}

.text-cap {
    color: black;
    font-family: var(--font-body);
    margin-bottom: .5rem;
}


.text-justify {
    text-align: justify;
}

.cursor-pointer {
    cursor: pointer;
}

@media(min-width: 376px) and (max-width: 425px) {
    .comment-dtl-name {
        max-width: 240px
    }
}

@media(max-width: 375px) {
    .comment-dtl-name {
        max-width: 175px
    }
}

/*- Footer ---------------------------------------------------------------------------------------------------------------*/

.footer {
    color: white;
    padding: 3.5rem 0 2rem 0;
    background-image: url('/Assets/Assets/footer-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.footer-desc {
    color: white;
    font-family: var(--font-body) !important;
}

.footer-ttl {
    color: white;
    font-weight: bold;
    margin-bottom: 1rem;
    font-family: var(--font-body) !important;
}

.footer-link2 {
    color: white !important;
    font-size: .9rem;
    text-decoration: none;
    cursor: pointer;
    font-family: var(--font-body) !important;
}

@media(min-width: 1001px) {
    .footer-desc-wdth {
        width: 35%;
        padding-right: 1rem !important;
    }

    .footer-other-link {
        width: 20%;
    }

    .footer-about {
        width: 20%;
    }

    .footer-policy {
        width: 25%;
    }
}

@media(min-width: 856px) and (max-width: 1000px) {
    .footer-desc-wdth {
        width: 30%;
    }

    .footer-other-link {
        width: 20%;
    }

    .footer-about {
        width: 25%;
    }

    .footer-policy {
        width: 25%;
    }
}

@media(min-width: 675px) and (max-width: 855px) {
    .footer-desc-wdth {
        width: 100%;
        padding-right: 5rem !important;
        margin-bottom: 1rem;
    }

    .footer-other-link {
        width: 30%;
    }

    .footer-about {
        width: 35%;
    }

    .footer-policy {
        width: 35%;
    }
}

@media(min-width: 600px) and (max-width: 674px) {
    .footer-desc-wdth {
        width: 100%;
        margin-bottom: 1rem;
    }

    .footer-other-link {
        width: 30%;
    }

    .footer-about {
        width: 35%;
    }

    .footer-policy {
        width: 35%;
    }
}

@media(min-width: 440px) and (max-width: 599px) {
    .footer-desc-wdth {
        width: 50%;
        margin-bottom: 1rem;
    }

    .footer-other-link {
        width: 50%;
        padding-left: 4rem !important;
        margin-bottom: 1rem;
    }

    .footer-about {
        width: 50%;
    }

    .footer-policy {
        width: 50%;
    }
}

@media(min-width: 0px) and (max-width: 439px) {
    .footer-desc-wdth {
        width: 100%;
    }

    .footer-other-link {
        width: 100%;
    }

    .footer-about {
        width: 100%;
    }

    .footer-policy {
        width: 100%;
    }
}

/*- Layout Social Icon ---------------------------------------------------------------------------------------------------------------*/

@keyframes upDown {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
    /* Moves up */
    100% {
        transform: translateY(0);
    }
    /* Back to original position */
}



/*@media(min-width: 769px) {
    .home-lay-social {
        position: fixed;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%)
    }

    .home-lay-social2 {
        color: var(--red) !important;
        background-color: white !important;
        border: 2px solid var(--red);
        padding: 6px;
        margin-bottom: 5px;
        transition: .5s ease;*/
/* Animation */
/*animation: upDown 1.5s infinite ease-in-out;
    }

        .home-lay-social2:hover {
            color: white !important;
            background-color: var(--red) !important;
            border: 3px solid white;
            box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
            transition: .5s ease;
        }
}

@media(max-width: 768px) {
    .home-lay-social{
        display: none !important;
    }
}*/

/*- Pages Head ---------------------------------------------------------------------------------------------------------------*/

.head {
    background-image: url('/Assets/Assets//supreme-council-head.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    overflow: hidden;
}

    .head .bead {
        position: absolute;
        bottom: 0;
        left: 0;
        height: auto;
    }

.head-wdth {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: white;
    text-align: center;
    width: 90%;
}

    .head-wdth .head-ttl {
        font-weight: bold;
        text-shadow: 1px 3px black;
    }

    .head-wdth .cap {
        color: white;
        font-weight: 500;
        text-shadow: 1px 2px black;
    }

@media(min-width: 768px) {
    .head-wdth .head-ttl {
        font-size: 2.5rem;
    }
}

@media(max-width: 767px) {
    .head-wdth .head-ttl {
        font-size: 2rem;
    }
}

@media(min-height:900px) {
    .head {
        min-height: 23rem;
    }
}

@media(max-height:899px) {
    .head {
        min-height: 23rem;
    }
}
/*- Layout ---------------------------------------------------------------------------------------------------------------*/

@media(min-width: 1041px) {
    .nav-small-intro {
        display: block;
    }

    /*.srch-page-2 {
        display: none;
    }*/

    .nav-logo-section .nav-logo-section-LogoImg {
        width: 5rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: 1.5rem;
        color: black;
        width: 27rem;
    }

    .nav-logo-section .logo-section {
        width: 60%;
    }

    .nav-logo-section .other-section {
        width: 40%;
    }

    .btn-open-nav-drawer {
        display: none;
    }
}

@media(min-width: 831px) and (max-width: 1040px) {
    .nav-small-intro {
        display: block;
    }

    .nav-small-pages {
        display: none;
    }

    /*.srch-page-2 {
        display: none;
    }*/

    .nav-logo-section .nav-logo-section-LogoImg {
        width: 3.5rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: 1.1rem;
        color: black;
        width: 20rem;
    }

    .nav-logo-section .logo-section {
        width: 50%;
    }

    .nav-logo-section .other-section {
        width: 50%;
    }
}

@media(min-width: 701px) and (max-width: 831px) {
    .nav-small-intro {
        display: none;
    }

    .nav-small-pages {
        display: none;
    }

    /*.srch-page-2 {
        display: block;
    }*/

    .nav-logo-section .nav-logo-section-LogoImg {
        width: 3.8rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: .9rem;
        color: black;
        width: 17rem;
    }

    .nav-logo-section .logo-section {
        width: 55%;
    }

    .nav-logo-section .other-section {
        width: 45%;
    }
}

@media(min-width: 0px) and (max-width: 700px) {
    .nav-small-intro {
        display: none;
    }

    .nav-small-pages {
        display: none;
    }

    /*.srch-page-2{
        display: block;
    }*/

    .nav-logo-section .nav-logo-section-LogoImg {
        min-width: 4rem !important;
    }

    .nav-logo-section .nav-logo-section-Title {
        display: none;
    }

    .nav-logo-section .logo-section {
        width: 25% !important;
    }

    .nav-logo-section .other-section {
        width: 75% !important;
    }
}

@media(max-width:375px) {
    .srch-page {
        display: none;
    }
}



/*@media(min-width: 0px) and (max-width: 780px) {
    .nav-small-intro{
        display: none;
    }

    .nav-small-pages {
        display: none;
    }

    .nav-logo-section .nav-logo-section-LogoImg {
        width: 4rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: 1.2rem;
        color: black;
        width: 22rem;
    }

    .btn-open-nav-drawer {
        display: block;
    }
}*/
/*@media(max-width: 734px) {
    .nav-small-intro {
        display: none;
    }
}*/

/*@media(min-width: 769px) {
    .nav-logo-section .nav-logo-section-LogoImg {
        width: 5rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: 1.5rem;
        color: black;
        width: 27rem;
    }
}

@media(min-width: 600px) and (max-width: 768px) {
    .nav-logo-section .nav-logo-section-LogoImg {
        width: 4rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: 1.1rem;
        color: black;
        width: 22rem;
    }
}

@media(min-width: 466px) and (max-width: 599px) {
    .nav-logo-section .nav-logo-section-LogoImg {
        min-width: 100%;
        max-width: 3.3rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        font-weight: bold;
        font-size: 1rem;
        color: black;
        width: 18rem;
    }
}

@media(max-width: 465px) {
    .nav-logo-section .nav-logo-section-LogoImg {
        min-width: 100%;
        max-width: 4rem;
    }

    .nav-logo-section .nav-logo-section-Title {
        display: none;
    }
}*/
/*
#home-nav2 {
    top: 0;
    z-index: 5;
}*/

/*.home-nav2-noScroll {
    position: absolute;
    left: 0;
    width: 100%;
    background-color: rgba(var(--rgba-light2), 0.9) !important;
    transition: ease 1s;
}*/

.home-nav2-noScroll {
    /*position: absolute;*/
    /*left: 0;*/
    /*width: 100%;*/
    /*background-color: rgba(255, 255, 255, 0.95) !important;*/
    /*transition: ease 1s;*/
    /*border-top: 1px solid #e8e9e9;*/
    /*border-bottom: 1px solid #e8e9e9;*/
    /*box-shadow: 0 .2rem 0.5rem rgba(0, 0, 0, 0.15);*/
}

/*.home-nav2-Scroll {
    background-color: var(--light2);
    position: -webkit-sticky;
    position: sticky;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    transition: ease 1s;
}*/

.nav-ttl-lg {
    color: black !important;
    text-transform: uppercase !important;
    font-size: .9rem !important;
    /*padding: 5rem 0 !important;*/
}

/*@media(min-width: 1278px) {
    .home-nav2-itm-lg {
        display: block
    }

    .home-nav2-itm-sm {
        display: none
    }

    .home-nav1-itm-sm {
        display: none
    }
}

@media(min-width:466px) and (max-width: 1279px) {
    .home-nav2-itm-lg {
        display: none
    }

    .home-nav2-itm-sm {
        display: block
    }

    .home-nav1-itm-sm {
        display: none
    }
}*/

@media(min-width:0px) and (max-width: 991px) {
    /*#home-nav2 {
        display: none
    }*/

    .nav-logo-section {
        top: 0;
        right: 0;
        /*left: 0;*/
        /*z-index: 1030;*/
        /*position: -webkit-sticky;*/
        position: sticky;
        /*top: 0;*/
        z-index: 1020
    }

    /*.home-nav1-itm-sm {
        display: block
    }*/
}

/*- Home Hero ---------------------------------------------------------------------------------------------------------------*/

/*.home-head {
    background-image: url('/Assets/Assets/head-1.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    min-height: 37rem;
    position: relative;
}*/

.home-head1 {
    background-image: url('/Assets/Assets/head-1.gif');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    min-height: 40rem;
    position: relative;
}

.home-head2 {
    background-image: url('/Assets/Assets/head-2.gif');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    min-height: 40rem;
    position: relative;
}

.home-head3 {
    background-image: url('/Assets/Assets/head-3.gif');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    min-height: 40rem;
    position: relative;
}

.home-head-itm {
    position: absolute;
    /*transform: translate(-50%,-50%);*/
    transform: translateX(-50%) !important;
    bottom: 10% !important;
    left: 50% !important;
    text-align: center;
}

.home-head-ttl {
    font-family: var(--font-ttl);
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.home-head-cap {
    font-family: var(--font-ttl);
    font-weight: 500;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

@media(min-width: 880px) {
    .home-head1 .home-head-itm {
        /*top: 50% !important;
        left: 50% !important;*/
        width: 40rem !important;
    }

    .home-head2 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 40rem !important;
    }

    .home-head3 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 50rem !important;
    }

    .home-head-ttl {
        font-size: 3.5rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: 1.3rem;
        line-height: 1.15;
    }
}

@media(min-width: 660px) and (max-width: 879px) {
    .home-head1 .home-head-itm {
        /*top: 50% !important;
        left: 50% !important;*/
        width: 30rem !important;
    }

    .home-head2 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 30rem !important;
    }

    .home-head3 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 40rem !important;
    }

    .home-head-ttl {
        font-size: 2.8rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: 1.2rem;
        line-height: 1.15;
    }
}

@media(min-width: 470px) and (max-width: 659px) {
    .home-head1 .home-head-itm {
        /*top: 50% !important;
        left: 50% !important;*/
        width: 28rem !important;
    }

    .home-head2 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 28rem !important;
    }

    .home-head3 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 28rem !important;
    }

    .home-head-ttl {
        font-size: 2.5rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: 1.2rem;
        line-height: 1.15;
    }
}

@media(min-width: 340px) and (max-width: 469px) {
    .home-head1 .home-head-itm {
        /*top: 50% !important;
        left: 50% !important;*/
        width: 20rem !important;
    }

    .home-head2 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 20rem !important;
    }

    .home-head3 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 20rem !important;
    }

    .home-head-ttl {
        font-size: 2.3rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: 1.1rem;
        line-height: 1.15;
    }
}

@media(min-width: 0px) and (max-width: 339px) {
    .home-head1 .home-head-itm {
        /*top: 50% !important;
        left: 50% !important;*/
        width: 90% !important;
    }

    .home-head2 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 90% !important;
    }

    .home-head3 .home-head-itm {
        /*top: 40% !important;*/
        /*left: 30% !important;*/
        width: 90% !important;
    }

    .home-head-ttl {
        font-size: 2rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: 1rem;
        line-height: 1.15;
    }
}

/*@media(min-width: 500px) and (max-width: 1023px) {
    .home-head1 .home-head-itm {
        top: 40% !important;
        left: 40% !important;
        width: 23rem !important;
    }

    .home-head2 .home-head-itm {
        top: 40% !important;
        left:43% !important;
        width: 25rem !important;
    }

    .home-head3 .home-head-itm {
        top: 40% !important;
        left: 43% !important;
        width: 25rem !important;
    }

    .home-head-ttl {
        font-size: 2.7rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: 1rem;
        line-height: 1.15;
    }
}

@media(min-width: 466px) and (max-width: 499px) {
    .home-head1 .home-head-itm {
        top: 40% !important;
        left: 48% !important;
        width: 21rem !important;
    }

    .home-head2 .home-head-itm {
        top: 40% !important;
        left: 45% !important;
        width: 19rem !important;
    }

    .home-head3 .home-head-itm {
        top: 40% !important;
        left: 45% !important;
        width: 19rem !important;
    }

    .home-head-ttl {
        font-size: 2.3rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: .9rem;
        line-height: 1.15;
    }
}

@media(min-width: 360px) and (max-width: 465px) {
    .home-head1 .home-head-itm {
        top: 60% !important;
        left: 48% !important;
        width: 21rem !important;
    }

    .home-head2 .home-head-itm {
        top: 60% !important;
        left: 45% !important;
        width: 19rem !important;
    }

    .home-head3 .home-head-itm {
        top: 60% !important;
        left: 45% !important;
        width: 19rem !important;
    }

    .home-head-ttl {
        font-size: 2.3rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: .9rem;
        line-height: 1.15;
    }
}

@media(min-width: 0px) and (max-width: 359px) {
    .home-head1 .home-head-itm {
        top: 55% !important;
        left: 50% !important;
        width: 90% !important;
        text-align: center;
        transform: translate(-50%,-50%) !important
    }
        .home-head1 .home-head-itm .d-btn-flex {
            display: flex;
            justify-content: center;
            flex-wrap: wrap !important;
            gap: 1rem !important
        }

    .home-head2 .home-head-itm {
        top: 55% !important;
        left: 50% !important;
        width: 90% !important;
        text-align: center;
        transform: translate(-50%,-50%) !important
    }

    .home-head3 .home-head-itm {
        top: 55% !important;
        left: 50% !important;
        width: 90% !important;
        text-align: center;
        transform: translate(-50%,-50%) !important
    }

    .home-head-ttl {
        font-size: 1.8rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .home-head-cap {
        font-size: .9rem;
        line-height: 1.15;
    }
}*/

/*.home-head2 .home-head-itm .home-head-ttl {
}

.home-head2 .home-head-itm .home-head-cap {
}

.home-head3 .home-head-itm .home-head-ttl {
}

.home-head3 .home-head-itm .home-head-cap {
}*/




/*@media(min-width: 1470px) {
    .home-head-itm {
        top: 50%;
        left: 50%;
        width: 40rem;
    }

    .home-head-ttl {
        font-size: 3rem;
    }

    .home-head-cap {
        font-size: 1.3rem;
    }
}

@media(min-width: 1180px) and (max-width: 1469px) {
    .home-head-itm {
        top: 50%;
        left: 50%;
        width: 29rem;
    }

    .home-head-ttl {
        font-size: 3rem;
    }

    .home-head-cap {
        font-size: 1.2rem;
    }
}

@media(min-width: 765px) and (max-width: 1179px) {
    .home-head-itm {
        top: 50%;
        left: 50%;
        width: 24rem;
    }

    .home-head-ttl {
        font-size: 3rem;
    }

    .home-head-cap {
        font-size: 1.2rem;
    }
}

@media(min-width: 530px) and (max-width: 764px) {
    .home-head-itm {
        top: 50%;
        left: 50%;
        width: 23rem;
    }

    .home-head-ttl {
        font-size: 2.3rem;
    }

    .home-head-cap {
        font-size: 1.1rem;
    }
}

@media(min-width: 360px) and (max-width: 529px) {
    .home-head-itm {
        top: 53%;
        left: 50%;
        width: 20rem;
    }

    .home-head-ttl {
        font-size: 2rem;
    }

    .home-head-cap {
        font-size: 1rem;
    }
}

@media(min-width: 0px) and (max-width: 359px) {
    .home-head-itm {
        top: 53%;
        left: 50%;
        width: 18rem;
    }

    .home-head-ttl {
        font-size: 2rem;
    }

    .home-head-cap {
        font-size: 1rem;
    }
}

.home-head2 {
    background-image: url('/Assets/Assets/head-2.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    min-height: 37rem;
    position: relative;
}

.home-head2-itm {
    position: absolute;
    transform: translate(-50%,-50%);
}

.home-head2-ttl {
    font-family: var(--font-ttl);
    font-weight: bold;
    color: var(--red);
}

.home-head2-cap {
    font-family: var(--font-ttl);
    font-weight: bold;
    color: black;
}

@media(min-width: 1180px) {
    .home-head2-itm {
        top: 50%;
        left: 30%;
        width: 40rem;
    }

    .home-head2-ttl {
        font-size: 3rem;
    }

    .home-head2-cap {
        font-size: 1.3rem;
    }
}

@media(min-width: 765px) and (max-width: 1179px) {
    .home-head2-itm {
        top: 50%;
        left: 35%;
        width: 30rem;
    }

    .home-head2-ttl {
        font-size: 3rem;
    }

    .home-head2-cap {
        font-size: 1.2rem;
    }
}

@media(min-width: 530px) and (max-width: 764px) {
    .home-head2-itm {
        top: 53%;
        left: 40%;
        width: 25rem;
    }

    .home-head2-ttl {
        font-size: 2.3rem;
    }

    .home-head2-cap {
        font-size: 1.1rem;
    }
}

@media(min-width: 360px) and (max-width: 529px) {
    .home-head2-itm {
        top: 53%;
        left: 47%;
        width: 20rem;
    }

    .home-head2-ttl {
        font-size: 2rem;
    }

    .home-head2-cap {
        font-size: 1rem;
    }
}

@media(min-width: 0px) and (max-width: 359px) {
    .home-head2-itm {
        top: 53%;
        left: 48%;
        width: 18rem;
    }

    .home-head2-ttl {
        font-size: 2rem;
    }

    .home-head2-cap {
        font-size: 1rem;
    }
}*/
/*- Home ---------------------------------------------------------------------------------------------------------------*/
.home-vd-credit {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    background-color: white;
    border-radius: 1rem;
    border: 2px solid white;
    background-color: rgba(var(--rgba-light2), 0.7) !important;
}

    .home-vd-credit .home-vd-icon {
        font-size: 3rem;
        color: var(--red);
    }

.home-about-img1 {
    position: absolute;
    border: .3rem solid white;
    transition: ease 1s;
}

.home-about-img2 {
    position: absolute;
    border: .3rem solid white;
    transition: ease 1s;
}

.home-about-img3 {
    position: absolute;
    border: .3rem solid white;
    transition: ease 1s;
}

.home-about-img1 .img-1:hover {
    transform: scale(1.1); /* Zoom effect */
    transition: ease 1s;
}

.home-about-img2 .img-2:hover {
    transform: scale(1.1); /* Zoom effect */
    transition: ease 1s;
}

.home-about-img3 .img-3:hover {
    transform: scale(1.1); /* Zoom effect */
    transition: ease 1s;
}

@media(min-width: 1200px) {
    .home-intro-desc {
        width: 35rem
    }

    .home-about-img {
        min-height: 35rem;
        width: 35rem;
    }

    .home-about-img1 {
        left: 0rem;
        top: 0;
        width: 23rem;
    }

    .home-about-img2 {
        right: 0rem;
        top: 10rem;
        width: 23rem;
    }

    .home-about-img3 {
        left: 0rem;
        bottom: 0rem;
        width: 23rem;
    }
}

@media(min-width: 960px) and (max-width: 1199px) {
    .home-intro-desc {
        width: 100%
    }

    .home-about-img {
        min-height: 30rem;
        width: 28rem;
    }

    .home-about-img1 {
        left: 0rem;
        top: 0;
        width: 20rem;
    }

    .home-about-img2 {
        right: 0rem;
        top: 8.7rem;
        width: 20rem;
    }

    .home-about-img3 {
        left: 0rem;
        bottom: 0rem;
        width: 20rem;
    }
}

@media(min-width: 670px) and (max-width: 959px) {
    .home-intro-desc {
        width: 40rem;
    }

    .home-about-img {
        min-height: 26rem;
        width: 28rem;
    }

    .home-about-img1 {
        left: 0rem;
        top: 0;
        width: 18rem;
    }

    .home-about-img2 {
        right: 0rem;
        top: 7.5rem;
        width: 18rem;
    }

    .home-about-img3 {
        left: 0rem;
        bottom: 0rem;
        width: 18rem;
    }
}

@media(min-width: 470px) and (max-width: 669px) {

    .home-about-img {
        min-height: 26rem;
        width: 28rem;
    }

    .home-about-img1 {
        left: 0rem;
        top: 0;
        width: 18rem;
    }

    .home-about-img2 {
        right: 0rem;
        top: 7.5rem;
        width: 18rem;
    }

    .home-about-img3 {
        left: 0rem;
        bottom: 0rem;
        width: 18rem;
    }
}

@media(min-width: 0px) and (max-width: 469px) {
    .home-about-img {
        min-height: 23rem;
        width: 20rem;
    }

    .home-about-img1 {
        left: 0rem;
        top: 0;
        width: 15rem;
    }

    .home-about-img2 {
        right: 0rem;
        top: 7rem;
        width: 15rem;
    }

    .home-about-img3 {
        left: 0rem;
        bottom: 0rem;
        width: 15rem;
    }
}


/*- Supreme Council ---------------------------------------------------------------------------------------------------------------*/


.sc-naming-1 {
    text-align: center;
}

@media(min-width: 800px) {
    .sc-naming-1 {
        position: absolute;
        background-color: rgba(255, 255, 255, .9);
        transform: translateX(-50%) !important;
        border-radius: 10px;
        bottom: 8%;
        left: 50%;
        width: 85%;
        height: 8.5rem;
        padding: .8rem .8rem;
    }
}

@media(min-width: 721px) and (max-width: 799px) {
    .sc-naming-1 {
        position: absolute;
        background-color: rgba(255, 255, 255, .9);
        transform: translateX(-50%) !important;
        border-radius: 10px;
        bottom: 3%;
        left: 50%;
        width: 95%;
        height: 8rem;
        padding: .5rem .5rem;
    }
}

@media(min-width: 721px) and (max-width: 799px) {
    .sc-naming-1 {
        position: absolute;
        background-color: rgba(255, 255, 255, .9);
        transform: translateX(-50%) !important;
        border-radius: 10px;
        bottom: 3%;
        left: 50%;
        width: 95%;
        height: 8rem;
        padding: .5rem .5rem;
    }
}

@media(min-width: 0px) and (max-width:720px) {
    .sc-naming-1 {
        margin-top: 1rem;
        /*position: absolute;
        background-color: rgba(255, 255, 255, .9);
        transform: translateX(-50%) !important;
        border-radius: 10px;
        bottom: 3%;
        left: 50%;
        width: 95%;
        height: 8rem;
        padding: .5rem .5rem;*/
    }
}

/*.image-hover-box:hover {*/
/*width: 100%;*/ /* Makes it fluid */
/*padding-top: 100%;*/ /* 1:1 Aspect Ratio (square) — adjust to 56.25% for 16:9 etc */
/*background-size: cover;*/
/*background-position: center;*/
/*background-repeat: no-repeat;*/
/*border-radius: 8px;*/
/*transition: 1s ease;*/
/*position: relative;*/
/*}*/

.image-hover-box {
    transition: opacity 0.4s ease;
    opacity: 1;
}

.image-hover-box-changing {
    transition: opacity 0.4s ease;
    opacity: 0.3; /* momentary fade-out when changing */
}


/* Optional: make it behave like a block */
/*.image-hover-box::before {
        content: "";
        display: block;
        padding-top: 100%;
    }*/


/*.sc-naming {
}*/

.supreme-council-vice {
    margin-bottom: 3rem;
}

    .supreme-council-vice .supreme-council-vice-ttl {
        color: var(--red);
        font-weight: bold;
        font-family: var(--font-ttl);
        margin-bottom: .5rem;
    }

@media(min-width: 1026px) {
    .supreme-council-vice {
        width: 40rem;
    }

        .supreme-council-vice .supreme-council-vice-ttl {
            font-size: 3rem;
        }
}

@media(min-width: 690px) and (max-width: 1023px) {
    .supreme-council-vice {
        width: 38rem;
    }

        .supreme-council-vice .supreme-council-vice-ttl {
            font-size: 2rem;
        }
}

@media(min-width: 435px) and (max-width: 689px) {
    .supreme-council-vice {
        width: 25rem;
    }

        .supreme-council-vice .supreme-council-vice-ttl {
            font-size: 1.7rem;
        }
}

@media(min-width: 370px) and (max-width: 434px) {
    .supreme-council-vice {
        width: 21rem;
    }

        .supreme-council-vice .supreme-council-vice-ttl {
            font-size: 1.7rem;
        }
}

@media(min-width: 0px) and (max-width: 369px) {
    .supreme-council-vice {
        width: 17rem;
    }

        .supreme-council-vice .supreme-council-vice-ttl {
            font-size: 1.7rem;
        }
}

@media(min-width: 1000px) {
    .supreme-council-itm {
        width: 20%;
    }
}

@media(min-width: 600px) and (max-width: 999px) {
    .supreme-council-itm {
        width: 50%;
        margin-bottom: 1rem;
    }
}

@media(min-width: 0px) and (max-width: 599px) {
    .supreme-council-itm {
        width: 100%;
        margin-bottom: 1rem;
    }
}

/*@media(min-width: 0px) and (max-width: 374px) {
    .supreme-council-itm {
        width: 100%;
        margin-bottom: 1rem;
    }
}*/

/*- Our Background ---------------------------------------------------------------------------------------------------------------*/

@media(min-width: 1280px) {
    .bg-carousel {
        min-height: 400px;
    }
}

@media(min-width: 960px) and (max-width: 1279px) {
    .bg-carousel {
        min-height: 280px;
    }
}

@media(min-width: 800px) and (max-width: 959px) {
    .bg-carousel {
        min-height: 500px;
    }
}

@media(min-width: 650px) and (max-width: 799px) {
    .bg-carousel {
        min-height: 400px;
    }
}

@media(min-width: 480px) and (max-width: 649px) {
    .bg-carousel {
        min-height: 300px;
    }
}

@media(min-width: 0px) and (max-width: 479px) {
    .bg-carousel {
        min-height: 230px;
    }
}

.bg-about-us-program-icn {
    font-size: 3.5rem !important;
    margin-bottom: 1rem;
    background-color: var(--yellow);
    border-radius: 50rem;
    padding: .4rem .4rem;
    color: var(--red);
}

/*- Member Benefit ---------------------------------------------------------------------------------------------------------------*/

@media(min-width:960px) {
    .home-benefit-itm1 {
        order: 0;
        margin-bottom: 1rem;
    }

        .home-benefit-itm1 .home-benefit-img {
            width: 450px;
        }

    .home-benefit-itm2 {
        order: 4;
    }

        .home-benefit-itm2 .home-benefit-img {
            width: 450px;
        }

    .home-benefit-itm3 {
        order: 2;
        margin-bottom: 1rem;
    }

        .home-benefit-itm3 .home-benefit-desc {
            border-left: 5px solid var(--red);
        }

    .home-benefit-itm4 {
        order: 3;
    }

        .home-benefit-itm4 .home-benefit-desc {
            border-right: 5px solid var(--red);
            text-align: right;
        }
}

@media(min-width: 0px) and (max-width:959px) {
    .home-benefit-itm1 {
        margin-bottom: 1rem;
    }

        .home-benefit-itm1 .home-benefit-img {
            width: 300px;
        }

    .home-benefit-itm2 .home-benefit-img {
        width: 300px;
    }

    .home-benefit-itm3 .home-benefit-desc {
        border-left: 5px solid var(--red);
    }

    .home-benefit-itm4 {
        padding-top: 0 !important;
    }

        .home-benefit-itm4 .home-benefit-desc {
            border-left: 5px solid var(--red);
        }
}

/*- Background Vision Mission ---------------------------------------------------------------------------------------------------------------*/

.bg-vm {
    background-image: url('/Assets/Assets/bg-vision-mission.jpg');
    background-repeat: repeat;
    background-position: center top;
    background-size: cover;
    background-attachment: fixed;
}

@media(min-width: 960px) {
    .bg-vm-grid {
        align-items: center;
    }

    .bg-vm-img-itm {
        order: 1;
    }

    .bg-vision-itm {
        order: 0;
    }

    .bg-mission-itm {
        order: 2
    }
}

@media(min-width: 0px) and (max-width: 959px) {

    .bg-vm-img-itm {
        order: 0;
    }

    .bg-vision-itm {
        order: 1;
    }

    .bg-mission-itm {
        order: 2
    }
}

/*- Tickerwrapper ---------------------------------------------------------------------------------------------------------------*/
/*@media(min-width: 656px) {
    .tickerwrapper {
        position: relative;
        left: 0%;
        width: 99.9%;
        height: 5rem;
        overflow: hidden;
        cursor: pointer;
    }

    ul.list {
        position: relative;
        display: inline-block;
        list-style: none;
        padding: 0;
        margin: 0;
        padding-top: 1rem;
    }

        ul.list.cloned {
            position: absolute;
            top: 0px;
            left: 0px;
        }

        ul.list li {
            float: left;
            padding-left: 20px;
            font-size: 2rem;
            font-family: --font-ttl;
        }
}

@media(max-width: 655px) {
    .tickerwrapper {
        position: relative;
        left: 0%;
        width: 99.9%;
        height: 4rem;
        overflow: hidden;
        cursor: pointer;
    }

    ul.list {
        position: relative;
        display: inline-block;
        list-style: none;
        padding: 0;
        margin: 0;
        padding-top: 1rem;
    }

        ul.list.cloned {
            position: absolute;
            top: 0px;
            left: 0px;
        }

        ul.list li {
            float: left;
            padding-left: 20px;
            font-size: 1.7rem;
            font-family: --font-ttl;
        }
}*/

/*- History The Story ---------------------------------------------------------------------------------------------------------------*/

/*- Contact ---------------------------------------------------------------------------------------------------------------*/

.contact-icon {
    font-size: 3.5rem;
    color: var(--red);
    background-color: var(--yellow);
    border-radius: 50rem;
    padding: .5rem;
}

/*- Event ---------------------------------------------------------------------------------------------------------------*/

.event-last-img {
    transition: transform 0.3s ease-in-out;
}

    .event-last-img:hover {
        transform: scale(1.1);
    }
/*- Img Swiper Event Details ---------------------------------------------------------------------------------------------------------------*/


.mySwiper {
    /* height: 80%;
    width: 100%;*/
    max-width: 100%;
    height: auto;
}

.mySwiper1 {
    /*height: 20%;*/
    box-sizing: border-box;
    padding: 10px 0;
}

    .mySwiper1 swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
    }

    .mySwiper1 .swiper-slide-thumb-active {
        opacity: 1;
    }

swiper-slide img {
    /*display: block;*/
    /*width: 100%;
    height: 100%;*/
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

swiper-container::part(button-prev),
swiper-container::part(button-next) {
    background-color: rgba(255,255,255,.8);
    color: black;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    swiper-container::part(button-prev)::after,
    swiper-container::part(button-next)::after {
        font-size: 16px;
    }

/*- Event Previous Month ---------------------------------------------------------------------------------------------------------------*/

@media(min-width: 600px) {
    .vnt-prev-fltr-radio {
        display: block;
    }

    .vnt-prev-fltr-drpdwn {
        display: none;
    }
}

@media(max-width: 599px) {
    .vnt-prev-fltr-radio {
        display: none;
    }

    .vnt-prev-fltr-drpdwn {
        display: block;
    }
}

/*- Login ---------------------------------------------------------------------------------------------------------------*/

.login-img {
    background-image: url('/Assets/Assets/login-bg.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

@media(min-width: 959px) {
    .login-img {
        display: block;
    }

    .login-signup {
        display: none !important;
    }
}

@media(max-width: 959px) {
    .login-img {
        display: none !important;
    }

    .login-signup {
        display: block;
    }
}
/*- Register ---------------------------------------------------------------------------------------------------------------*/


.register-img {
    background-image: url('/Assets/Assets/register-bg.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
}

@media(min-width: 959px) {
    .register-img {
        display: block;
    }

    .register-signin {
        display: none !important;
    }
}

@media(max-width: 959px) {
    .register-img {
        display: none !important;
    }

    .register-signin {
        display: block;
    }
}


/*- Our Background President Message ---------------------------------------------------------------------------------------------------------------*/

@media(min-width: 960px) {
    .president-message-imgshort {
        display: none;
    }

    .president-message-imglong {
        display: block;
    }
}

@media(max-width: 959px) {
    .president-message-imgshort {
        display: block;
    }

    .president-message-imglong {
        display: none;
    }
}


/*- Directory Details ---------------------------------------------------------------------------------------------------------------*/


@media(min-width: 960px) {
    /*.directory-dtl-logo {
        width: 130px !important;
    }*/

    .directory-dtl-compname {
        font-size: 1.7rem;
    }
}

/*@media(min-width: 0px) and (max-width: 959px) {
    .directory-dtl-logo {
        width: 130px !important;
    }
}*/

@media(min-width: 466px) and (max-width: 959px) {
    .directory-dtl-compname {
        font-size: 1.5rem !important;
    }
}

@media(min-width: 0px) and (max-width: 465px) {
    .directory-dtl-compname {
        font-size: 1.3rem !important;
    }
}

/*.directory-ttl {
    font-size: 1.5rem;
    font-weight: bold;
    color: black;
}*/

/*@media(max-width: 465px){
    .directory-head{
        display: none;
    }

    .filter-head {
        margin-top: 5rem;
    }
}*/

/*@media(min-width: 961px) {
    .filter-btn {
        display: none;
    }
}

@media(min-width:0px) and (max-width: 960px) {
    .directory-head .TtlText {
        display: none;
    }

    .filter-head {
        display: none;
    }

    .filter-btn {
        display: block;
        padding-top: 7rem !important;
        margin-right: 2rem;
    }
}*/

/*@media(min-width:0px) and (max-width: 465px) {
    .directory-head {
        padding-top: 7rem !important;
    }

    .filter-btn {
        padding-top: 7rem !important;
        margin-right: 2rem;
    }
}*/
/*@media(min-width: 0px) and (max-width: 465px) {
    .directory-dtl-logo {
        width: 60px;
    }
}*/
.directory-ttl {
    font-size: 1.5rem;
    font-weight: bold;
    color: black;
}

@media(min-width: 992px) {
    .directory-srch-top {
        position: -webkit-sticky;
        position: sticky;
        top: 3.8rem;
        z-index: 1019
    }

    .filter-btn {
        display: none;
    }
}

@media(min-width: 961px) and (max-width: 991px) {
    .directory-srch-top {
        position: -webkit-sticky;
        position: sticky;
        top: 4.8rem;
        z-index: 1019
    }

    .filter-btn {
        display: none;
    }
}

@media(min-width: 701px) and (max-width: 960px) {
    .directory-srch-top {
        position: -webkit-sticky;
        position: sticky;
        top: 5rem;
        z-index: 1019
    }

    .filter-head {
        display: none;
    }
}

@media(min-width: 466px) and (max-width: 700px) {
    .directory-srch-top {
        position: -webkit-sticky;
        position: sticky;
        top: 5.2rem;
        z-index: 1019
    }

    .filter-head {
        display: none;
    }
}

@media(min-width: 0px) and (max-width: 465px) {
    .directory-srch-top {
        position: -webkit-sticky;
        position: sticky;
        top: 5.5rem;
        z-index: 1019
    }

    .filter-head {
        display: none;
    }

    .TtlText {
        display: none
    }
}

/*- Verification Dialog ---------------------------------------------------------------------------------------------------------------*/
.verification-input {
    width: 50px;
    height: 3rem;
    text-align: center;
    font-size: 2rem;
    border-radius: 8px;
    padding-top: 5px;
    border: 1px solid #ccc;
}

    .verification-input input {
        text-align: center !important;
        font-size: 2rem;
    }
/*- Home ---------------------------------------------------------------------------------------------------------------*/
/*- Home ---------------------------------------------------------------------------------------------------------------*/
/*- Home ---------------------------------------------------------------------------------------------------------------*/
/*- Home ---------------------------------------------------------------------------------------------------------------*/
/*- Home ---------------------------------------------------------------------------------------------------------------*/
/*- Hodme ---------------------------------------------------------------------------------------------------------------*/
/*- Home ---------------------------------------------------------------------------------------------------------------*/
/*- Other ---------------------------------------------------------------------------------------------------------------*/
.directory-truncated {
    display: block;
    overflow: hidden;
    position: relative;
    height: 2.7rem;
    /*/ Ensure it matches your container height / text-overflow: ellipsis;*/
    white-space: normal;
    word-break: break-word;
}

.vertical-line {
    color: var(--red);
    font-weight: bold;
}

    .vertical-line::before {
        content: "";
        display: inline-block;
        width: 4px; /* Thickness of the line */
        height: 1.5rem; /* Match text height */
        background-color: var(--yellow); /* Color of the line */
        margin-right: .8rem; /* Space between line and text */
        vertical-align: middle;
    }


@media(min-width: 466px) {
    .directory-filter {
        position: -webkit-sticky;
        position: sticky;
        top: 3.5rem;
        z-index: 100;
        /*margin-top: 30rem;*/
    }
}

@media(max-width: 465px) {
    .directory-filter {
        position: -webkit-sticky;
        position: sticky;
        top: 3.5rem;
        z-index: 100;
        padding-top: 3rem;
        /*margin-top: 30rem;*/
    }
}

.mud-input-label {
    font-size: 1.1rem !important;
    color: black !important;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.img-frame {
    border: 2px dashed black;
    width: 150px;
    height: 150px;
}

.scroll-to-top {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 999;
}