/********** Template CSS **********/







.back-to-top {



    position: fixed;



    display: none;



    right: 30px;



    bottom: 30px;



    z-index: 99;



}







.fw-medium {



    font-weight: 500;



}











/*** Spinner ***/



#spinner {



    opacity: 0;



    visibility: hidden;



    transition: opacity .5s ease-out, visibility 0s linear .5s;



    z-index: 99999;



}







#spinner.show {



    transition: opacity .5s ease-out, visibility 0s linear 0s;



    visibility: visible;



    opacity: 1;



}











/*** Button ***/



.btn {



    transition: .5s;



    font-weight: 500;



}







.btn-primary,



.btn-outline-primary:hover {



    color: var(--bs-light);



}







.btn-secondary,



.btn-outline-secondary:hover {



    color: var(--bs-dark);



}







.btn-square {



    width: 38px;



    height: 38px;



}







.btn-sm-square {



    width: 32px;



    height: 32px;



}







.btn-lg-square {



    width: 48px;



    height: 48px;



}







.btn-square,



.btn-sm-square,



.btn-lg-square {



    padding: 0;



    display: flex;



    align-items: center;



    justify-content: center;



    border-radius: 50px;



    font-weight: normal;



}







.icon-box-primary,



.icon-box-light {



    position: relative;



    padding: 0 0 10px 10px;



    z-index: 1;



}







.icon-box-primary i,



.icon-box-light i {



    font-size: 60px;



    line-height: 0;



}







.icon-box-primary::before,



.icon-box-light::before {



    position: absolute;



    content: "";



    width: 35px;



    height: 35px;



    left: 0;



    bottom: 0;



    border-radius: 35px;



    transition: .5s;



    z-index: -1;



}







.icon-box-primary::before {



    background: var(--bs-primary);



}







.icon-box-light::before {



    background: var(--bs-light);



}











/*** Navbar ***/



.sticky-top {



    top: -100px;



    transition: .5s;



}







.navbar .navbar-nav .nav-link {



    margin-right: 35px;



    padding: 10px 0;



    color: var(--bs-dark);



    font-size: 14px;



    font-weight: 500;



    outline: none;



}







.navbar .navbar-nav .nav-link:hover,



.navbar .navbar-nav .nav-link.active {



    color: #198754;



    border-bottom: 2px solid #198754;



}







.navbar .dropdown-toggle::after {



    border: none;



    content: "\f107";



    font-family: "Font Awesome 5 Free";



    font-weight: 900;



    vertical-align: middle;



    margin-left: 8px;



}







@media (max-width: 991.98px) {



    .navbar .navbar-nav .nav-link  {



        margin-right: 0;



        padding: 10px 0;



    }







    .navbar .navbar-nav {



        margin-top: 15px;



        border-top: 1px solid #EEEEEE;



    }



}







@media (max-width: 490px) {
    .president-msg{
         width: 96%;
    }
   

}
@media (min-width: 992px) {



    .sticky-top {



        margin-top: -50px;



    }







    .navbar {



        height: 47px;



    }







    .navbar .nav-item .dropdown-menu {



        display: block;



        border: none;



        margin-top: 0;



        top: 150%;



        opacity: 0;



        visibility: hidden;



        transition: .5s;



    }







    .navbar .nav-item:hover .dropdown-menu {



        top: 100%;



        visibility: visible;



        transition: .5s;



        opacity: 1;



    }



}











/*** Header ***/



@media (min-width: 992px) {



    .header-carousel,



    .page-header {



        margin-top: 0px;



    }



    .page-header1 {



        margin-top: -34px;



    }



}







.carousel-caption {



    top: 0;



    left: 0;



    right: 0;



    bottom: 0;



    display: flex;



    align-items: center;



    z-index: 1;



}







.carousel-control-prev,



.carousel-control-next {



    width: 15%;



}







.carousel-control-prev-icon,



.carousel-control-next-icon {



    width: 3.5rem;



    height: 3.5rem;



    border-radius: 3.5rem;



    background-color: var(--bs-primary);



    border: 15px solid var(--bs-primary);



}







@media (max-width: 767.98px) {



    #header-carousel .carousel-item {



        position: relative;



        min-height: 450px;



    }



    



    #header-carousel .carousel-item img {



        position: absolute;



        width: 100%;



        height: 100%;



        object-fit: cover;



    }



}







.page-header {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../img/testimonial.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}







.page-header1 {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../img/complain.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-about {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/about.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}



.page-secretary {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/secretary.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}



.page-elected_executive_committee {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/elected_executive_committee.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-elected_sub_committee {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/elected_sub_committee.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-memberreg {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/memberreg.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-service {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/service.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-vehiclepass {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/vehiclepass.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-idcardrequest {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/idcardrequest.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-gallery {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/gallery.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-complain {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/complain.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-contact {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/contact.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-circular {



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/circular.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}

.page-noticeview{



   background: linear-gradient(rgba(18, 130, 82, 0.3), rgba(17, 123, 8, 0.2)), url(../admin/uploads/sliders/noticeview.jpg) center center no-repeat;



    background-size: auto, auto;



    background-size: cover;



}





.page-header .breadcrumb-item+.breadcrumb-item::before {



    color: var(--bs-white);



}







.page-header .breadcrumb-item,



.page-header .breadcrumb-item a {



    font-size: 18px;



    color: var(--bs-white);



}



.page-header1 .breadcrumb-item+.breadcrumb-item::before {



    color: var(--bs-white);



}







.page-header1 .breadcrumb-item,



.page-header1 .breadcrumb-item a {



    font-size: 18px;



    color: var(--bs-white);



}











/*** Features ***/



.feature {



    background: linear-gradient(rgba(3, 27, 78, .3), rgba(3, 27, 78, .3)), url(../img/feature.jpg) left center no-repeat;



    background-size: cover;



}







.feature-row {



    box-shadow: 0 0 45px rgba(0, 0, 0, .08);



}







.feature-item {



    border-color: rgba(0, 0, 0, .03) !important;



}







.experience .progress {



    height: 5px;



}







.experience .progress .progress-bar {



    width: 0px;



    transition: 3s;



}







.experience .nav-pills .nav-link {



    color: var(--dark);



}







.experience .nav-pills .nav-link.active {



    color: #FFFFFF;



}







.experience .tab-content hr {



    width: 30px;



}











/*** About ***/



.about-fact {



    width: 220px;



    height: 220px;



    box-shadow: 0 0 30px rgba(0, 0, 0, .1);



}







@media (min-width: 576px) {



    .about-fact.mt-n130 {



        margin-top: -130px;



    }



}







.btn-play {



    position: relative;



    display: block;



    box-sizing: content-box;



    width: 36px;



    height: 46px;



    border-radius: 100%;



    border: none;



    outline: none !important;



    padding: 18px 20px 20px 28px;



    background: var(--bs-primary);



}







.btn-play:before {



    content: "";



    position: absolute;



    z-index: 0;



    left: 50%;



    top: 50%;



    transform: translateX(-50%) translateY(-50%);



    display: block;



    width: 90px;



    height: 90px;



    background: var(--bs-primary);



    border-radius: 100%;



    animation: pulse-border 1500ms ease-out infinite;



}







.btn-play:after {



    content: "";



    position: absolute;



    z-index: 1;



    left: 50%;



    top: 50%;



    transform: translateX(-50%) translateY(-50%);



    display: block;



    width: 90px;



    height: 90px;



    background: var(--bs-primary);



    border-radius: 100%;



    transition: all 200ms;



}







.btn-play span {



    display: block;



    position: relative;



    z-index: 3;



    width: 0;



    height: 0;



    left: 3px;



    border-left: 30px solid #FFFFFF;



    border-top: 18px solid transparent;



    border-bottom: 18px solid transparent;



}







@keyframes pulse-border {



    0% {



        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);



        opacity: 1;



    }







    100% {



        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(2);



        opacity: 0;



    }



}







.modal-video .modal-dialog {



    position: relative;



    max-width: 800px;



    margin: 60px auto 0 auto;



}







.modal-video .modal-body {



    position: relative;



    padding: 0px;



}







.modal-video .close {



    position: absolute;



    width: 30px;



    height: 30px;



    right: 0px;



    top: -30px;



    z-index: 999;



    font-size: 30px;



    font-weight: normal;



    color: #FFFFFF;



    background: #000000;



    opacity: 1;



}











/*** Service ***/



.container-service {



    position: relative;



}







.container-service::before {



    position: absolute;



    content: '';



    background: var(--bs-light);



    width: 100%;



    height: 100%;



    left: 0px;



    top: 0px;



    clip-path: polygon(0 0, 100% 0, 100% 30%, 0 70%);



    z-index: -1;



}







.service-item {



    position: relative;



    height: 100%;



    padding: 45px 30px;



    background: var(--bs-white);



    box-shadow: 0 0 45px rgba(0, 0, 0, .05);



}







.service-item::before {



    position: absolute;



    content: "";



    width: 100%;



    height: 0;



    left: 0;



    bottom: 0;



    transition: .5s;



    background: var(--bs-primary);



}







.service-item:hover::before {



    height: 100%;



    top: 0;



}







.service-item * {



    position: relative;



    transition: .5s;



    z-index: 1;



}







.service-item:hover h5,



.service-item:hover p {



    color: var(--bs-white);



}







.service-item:hover .icon-box-primary::before {



    background: var(--bs-dark);



}







.service-item:hover .icon-box-primary i {



    color: var(--bs-white) !important;



}











/*** Team ***/



.container-team {



    position: relative;



}







.container-team::before {



    position: absolute;



    content: '';



    background: var(--bs-light);



    width: 100%;



    height: 100%;



    left: 0px;



    top: 0px;



    clip-path: polygon(0 70%, 100% 30%, 100% 100%, 0% 100%);



    z-index: -1;



}







.team-item {



    background: var(--bs-white);



    box-shadow: 0 0 45px rgba(0, 0, 0, .05);



}







.team-item .team-social {



    position: absolute;



    width: 0;



    height: 100%;



    top: 0;



    right: 0;



    transition: .5s;



    background: #06A4687D;



    display: flex;



    align-items: center;



    justify-content: center;



}







.team-item:hover .team-social {



    width: 100%;



    left: 0;



}







.team-item .team-social .btn {



    opacity: 0;



    transition: .5s;



}







.team-item:hover .team-social .btn {



    opacity: 1;



}











/*** Testimonial ***/



.testimonial {



    background: linear-gradient(rgba(3, 27, 78, .3), rgba(3, 27, 78, .3)), url(../img/testimonial.jpg) left center no-repeat;



    background-size: cover;



}







.testimonial-item img {



    width: 60px !important;



    height: 60px !important;



    border-radius: 60px;



}







.testimonial-carousel .owl-nav {



    position: absolute;



    top: 0;



    right: 0;



    display: flex;



}







.testimonial-carousel .owl-nav .owl-prev,



.testimonial-carousel .owl-nav .owl-next {



    margin-left: 15px;



    color: var(--bs-primary);



    font-size: 30px;



    line-height: 0;



    transition: .5s;



}







.testimonial-carousel .owl-nav .owl-prev:hover,



.testimonial-carousel .owl-nav .owl-next:hover {



    color: var(--bs-dark);



}











/*** Contact ***/



@media (min-width: 992px) {



    .contact-info::after {



        position: absolute;



        content: "";



        width: 0px;



        height: 100%;



        top: 0;



        left: 50%;



        border-left: 1px dashed rgba(255, 255, 255, .2);



    }



}







@media (max-width: 991.98px) {



    .contact-info::after {



        position: absolute;



        content: "";



        width: 100%;



        height: 0px;



        top: 50%;



        left: 0;



        border-top: 1px dashed rgba(255, 255, 255, .2);



    }



}











/*** Footer ***/



.footer {



    background: linear-gradient(rgba(3, 27, 78, .3), rgba(3, 27, 78, .3)), url(../img/footer.png) center center no-repeat;



    background-size: contain;



}







@media (min-width: 992px) {



    .footer::after {



        position: absolute;



        content: "";



        width: 0px;



        height: 100%;



        top: 0;



        left: 50%;



        border-left: 1px dashed rgba(255, 255, 255, .2);



    }



}







.footer .btn.btn-link {



    display: block;



    margin-bottom: 5px;



    padding: 0;



    text-align: left;



    color: rgba(255, 255, 255, .5);



    font-weight: normal;



    text-transform: capitalize;



    transition: .3s;



}







.footer .btn.btn-link::before {



    position: relative;



    content: "\f105";



    font-family: "Font Awesome 5 Free";



    font-weight: 900;



    color: rgba(255, 255, 255, .5);



    margin-right: 10px;



}







.footer .btn.btn-link:hover {



    color: var(--bs-primary);



    letter-spacing: 1px;



    box-shadow: none;



}







.copyright {



    border-top: 1px dashed rgba(255, 255, 255, .2);



}







.copyright a {



    color: var(--bs-white);



}







.copyright a:hover {



    color: var(--bs-primary);



}















    .google-map {



      padding-bottom: 32%;



      position: relative;



    }







    .google-map iframe {



      height: 100%;



      width: 100%;



      left: 0;



      top: 0;



      position: absolute;



    }



    body{



        color: #000 !important;

        line-height: 1.75;



    }

    .dropdown-item{

        font-size: 14px !important;

    }

	

	

	





.floating-whatsapp-icon {

    position: fixed;

    top: 50%; /* Vertically centered */

    right: 2px; /* Distance from the right edge */

    transform: translateY(-50%); /* Adjust for perfect centering */

    background-color: #25D366; /* WhatsApp brand color */

    color: white;

    border-radius: 50%;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Floating effect */

    text-decoration: none;

    z-index: 1000; /* Ensure it stays above other content */

    transition: background-color 0.3s ease, transform 0.3s ease;

}



.floating-whatsapp-icon:hover {

    background-color: #1DA851; /* Darker shade on hover */

    transform: scale(1.1); /* Slight zoom effect on hover */

}



.floating-whatsapp-icon i {

    font-size: 30px; /* Icon size */

}