/* ======== FONT FAMILY ( FUNNEL DISPLAY ) ======================= */
@import url('https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
/* ======== NUNITO FAMILY ( NUNITO) */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
/* =========== ANIMATION CDN ============= */
@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css');
/* ====================== ANIMATION CDN ========================= */
@import url("https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css");
@import url('https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');
/* =============== FONT AWESOME CDN =========================== */
@import url('https://cdn.hugeicons.com/font/hgi-stroke-rounded.css');
/* =============== SWIPER CND =============== */
@import url("https://cdn.jsdelivr.net/npm/swiper/swiper-bundle.min.css");
:root {
    --bg1: #f0eeee;
    --bg2: #fcfcfc;
    --bg-blue:#0c62ad;
    --bg-green:#3bc42f;

    --default-color: #6ea84c;
}


body {
    margin: 0% !important;
    padding: 0% !important;
    font-family: "Urbanist", sans-serif !important;
    background-color: var(--bg1) !important;
    scroll-behavior: smooth !important;
    /* overflow: hidden !important; */
    transition: scroll-behavior 2.6s ease-in-out !important;
}
.col-org{
    color: var(--default-color) !important;
}

body.white {
    font-family: "Urbanist", sans-serif;
    --bg1: #f5f5f5;
    --bg2: #fcfcfc;

    --color1: #1a1a1a;
    --color2: #000000;

    background-color: #f0eeee !important;
}

body.black {


    --bg1: #1b1b1b;
    --bg2: #121212;
    --color1: #f5f5f5;
    --color2: #fcfcfc;

    background-color: #1b1b1b !important;

}

.bg_white {
    background-color: var(--bg2) !important;
}

.bg_dark1 {
    background-color: var(--bg1) !important;
}

.bg_dark2 {
    background-color: var(--bg2) !important;
}

.bg {
    background-color: var(--default-color) !important;
}

.text_dark1 {
    color: var(--color1) !important;
}

.text_dark2 {
    color: var(--color2) !important;
}

.bg-blue{
    background-color: var(--bg-blue) !important;
}
.bg-green{
    background-color: var(--bg-green) !important;
}
/* =================== NAVBAR CODE START =========== */
.navbar_lg{
    background-color: var(--bg2);
}
.navfix{
    left: 0% !important;
    width: 100% !important;
    z-index: 2321 !important;
    position: fixed !important;
    top: -2% !important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px !important;
}
.nav_tabs_gallery .nav-link{
    color: var(--color1) !important;
    margin: 0px 10px !important;
    font-size: 22px !important;
}
.reg_donor  input , textarea{
     color: var(--color2) !important;
    background-color: var(--bg1)!important;
}
.modal{
    z-index: 22221 !important;
}
thead{
    z-index:  11221 !important;
}

.img_of_gallery{
    height: 250px !important;
}
.nav_tabs_gallery .nav-link.active{
    color: white !important;
   background-color: var(--bg-blue) !important;
}
.offcanvas_right{
    width: 75% !important;
    transition: 0.9s ease-in-out !important;
}
.offcanvas_right .nav-item .nav-link{
    color: var(--color1) !important;
}
.navbar_lg .nav-item.active  {
color:var(--bg-green) !important;
}
.navbar_lg .nav-item .nav-link  {
    padding: 0px 15px !important;
font-size: 18px !important;
    color: var(--color1) !important;
}
.donate_btn{
    z-index: 1111 !important;
    position: fixed;
    bottom: 23px;
    padding: 7px 25px !important;
    color: white !important;
    border-radius: 30px !important;
    right: 20px;
background-color:var(--bg-green) !important;
}
.border_radius{
    border-radius: 35px !important;
}
.div_75{
    height: 100% !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important;

}
 #editor {
      height: 200px !important;
    }
.program_desc2{

    overflow-y: scroll !important;
}
.nav_pills .dropdown-menu{
    position: relative !important;
    width: 100% !important;
    top: 0% !important;
}
.lib_div{
    position: relative;
    border-radius: 20px !important;
}
.round-4{
    border-radius: 15px !important;
}
.img_of_place{
    padding: 5px !important;
    background-color: var(--bg1) !important;
    border-radius: 20px;
    object-fit: cover !important;
    width: 100% !important;
    height: 180px !important;
}
.lib_img{
    border-radius: 20px !important;
width: 100% !important;
padding: 1px !important;
background-color: #a5a5a5 !important;
    object-fit: cover !important;
    height: 250px !important;
}
.accordion-button.collapsed {
    /* collapsed state - not active */
    background-color: #f8f9fa;
    color: #212529;
}

.accordion-button:not(.collapsed) {
    /* expanded / active state */
    background-color: var(--default-color) !important; /* e.g., coral color */
    color: #fff !important;               /* white text */
    font-weight: 600;
}

.program_desc{
    height: 200px !important;
}
.program_desc2::-webkit-scrollbar-track-piece{
    display: none !important;
    opacity: 0 !important;
}
.border_radius1{
    border-radius: 20px !important;

}
.nav_pills{
    width:95% !important;

    position: relative !important;
}
/* @media (min-width:992px) {
.navbar_pills{
    width: 20%;
    min-width: 250px;
    position: fixed;
    top: 0;
    margin: 4% 0;
    height: 90%;
}

} */
.about_member_img{
    height: 250px !important;
}
.swiper_about_pagination{
    background-color: red !important;
}
.img_about_page{
    object-fit: cover !important;
    background-size: cover !important;
    height: 500px !important;
}
.nav_pills_of_about .nav-link.active{
    background-color: transparent !important;
   font-weight: bolder !important;
    font-size: 42px !important;
}
.nav_pills_of_about .nav-link{
    transition: 0.9s ease-in-out !important;
    margin-bottom: 20px !important;
    color: var(--color2) !important;
    text-align: start !important;
font-size: 24px !important;
}
.program_dashboard_img{
    object-fit: cover !important;
    height: 200px !important;
}
.home_banner_img{
   max-height: 80vh !important;
}
.blur_div{
    border: 1px solid rgba(255, 255, 255, 0.452) !important;
    background-color: rgba(124, 124, 124, 0.103) !important;
    backdrop-filter: blur(50px) !important;
}
.card-img-top-program{
    height: 300px !important;
}
/* =================== NAVBAR CODE END =========== */

main{
    max-width: 1600px !important;
    
    margin: 0% auto !important;
}
/* ============ MAIN BANNER CODE START =========== */

/* ============ MAIN BANNER CODE END ============= */

.h_97vh{
    margin: 0% auto !important;
    width: 100% !important;
    max-width: 1400px !important;
  
    /* overflow-y: scroll !important; */
    height: 97vh !important;
}
.navbar_pills .nav-item .nav-link{
    color: var(--color1) !important;
}
.swiper-pagination{
    position: relative;
    margin-top: 1.5% !important;}
 /* Pagination bullets */
  .swiper-pagination-bullet {
 
    transition: 0.6s ease-in-out !important;
    padding: 10px;
    border-radius: 40px !important;
    background-color: #a5a5a5 !important;
    opacity: 1;
  }

  .swiper-pagination-bullet-active {
    transition: 0.6s ease-in-out !important;

    padding: 10px 20px;
    border-radius: 40px !important;
    background-color:var(--bg-green) !important;
  }
  .over_flow_program{
    overflow-y: scroll !important;
    height: 57vh !important;
  }
/* SWIPER CSS END  */