/* white you custom css code here. only css code will work */
.preloader-inner{
  z-index: 100;
}
.loading-data{
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.12);
    aspect-ratio: 1;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    text-align: center;
}
.youtube-video .head-title{
  display:none;
}
.fw-bold{
font-weight: bold !important;
}
.fa-phone{
  transform:rotate(90deg);
}
.contribute-single-item .thumb img {
    aspect-ratio: 3 / 2;
    object-fit: contain;
    background: #333;
    border-radius: 12px;
}
.blog-classic-item-01 {
    background: #ffffff;
    border-radius: 10px;
    overflow: hidden;
}
.single-blog-grid-01 img,
.thumbnail img {
    aspect-ratio: 16 / 9;
    object-fit: contain;
    background: rgba(0, 0, 0, 0.9);
    border-radius: 10px;
}
.blog-classic-item-01 .content-wrapper .title a{
    -webkit-line-clamp: 2;
}
.content-wrapper {
    padding: 0 18px;
}
.blog-bottom p {
    padding: 0 10px;
    display: -webkit-box;
    width: 100%;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.single-gallery-image{
  border-radius:10px;
}

.single-gallery-image img{
  aspect-ratio: 3/2;
  object-fit: cover;
}
.certificate_card {
    height:100%;
    background: #fff;
    border-radius: 12px;
    text-align: center;
    cursor: pointer;
    transition: 0.5s ease;
}
.certificate_card:hover{
  transform: scale(0.8);
}
.certificate_card img {
    max-width: 200px;
    width: 100%;
}
.certificate_card h4 {
    padding: 10px;
    font-weight: bold;
}
.footer-logo,
.logo-wrapper img{
  max-width:120px;
}
.fw-bold{
font-weight:bold;
}
.about_btn{
background: #FF6D24;
margin-top: 2rem;
border-radius: 10px;
line-height: normal;
padding: 16px;
font-weight:bold;
}

.navbar-area.nav-style-02 .nav-container .nav-right-content ul li:first-child {
    display: none;
}
.navbar-search .search-open {
    display: none;
}
.breadcrumb-area img{
  width: 100%;
}
.related-post-area .contribute-single-item .thumb img {
    width: 100%;
    height: 12rem;
}
.donation-single-content-area .accordion-wrapper .card .card-header a {
      font-size: 20px;
}
.donation-single-content-area .accordion-wrapper .card .card-body {
    font-size: 1rem;
}
.single-tabs .section-paragraph {
  display: none !important;
}
.single-tabs h1{
  font-size: 1.8rem;
  margin-bottom: 10px;
}
}
.single-tabs .team-single-item{
  border-radius: 0;
}
.single-tabs .thumb{
  height: 12rem;
}
.single-tabs .thumb .content{
  display: none;
}

.single-tabs .thumb img{
  height: 100%;
 border-radius: 0;
}
.section-paragraph {
  margin-top: -11rem !important;  
}
.details-content-area{
  background: #fff;
}
#main-data p,
#main-data p sapn,
#main-data li span,
#main-data span{
  font-size: 1.2rem !important;
}
.breadcrumb-area {
  margin-top: 0;
}
.navbar-area.nav-style-02{
  background: #fff !important;
}
.navbar-area.nav-style-02 .nav-container .logo-wrapper{
 box-shadow: none !important;
}
.breadcrumb-area .breadcrumb-inner {
       padding: 425px 200px 250px 200px;
    text-align: center;
}
.breadcrumb-area:before {
    background: transparent;
}
.achievements{
  padding-bottom: 7rem;
}
.achievements .image{
  height: 370px;
  border-radius: 12px;
  overflow: hidden;
}

.achievements .image img{
  width: 100%;
}
.testimonial-area-02 .google_reviews_content .image {
  width: 150px;
  height: 75px;
}
.better-future-card {
    display: flex;
    gap: 1rem;
    transition: background .3s linear;
    padding: 3px;  
  padding-bottom: 0;
}
.better-future-card:hover{
  color: #fff;
  background: #fff;
}
.better-future-card:hover p{
  color: #000;
}
.btn-wrapper .boxed-btn.reverse-color {
    color: #fff;
    background-color: var(--main-color-one);
    border: none;
    width: 100%;
}
.description:hover::before {
    opacity: 1;
    visibility: visible;
}

.description::before {
    content: attr(data-content);
    position: absolute;
    bottom: 100%;
    right: ;
    white-space: break-spaces;
    width: 250px;
    background: #ffc67d;
    padding: 10px 15px;
    border-radius: 5px;
    font-size: 12px;
    line-height: normal;
    opacity: 0;
    visibility: hidden;
    transition: 0.5s;
    z-index: 99;
  color: #000;
  left: -19px;
}
.volunteer-area .owl-controls{
      bottom: 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.author-data{
  margin-top:0 !important;
}
.table.table-bordered p{
  text-align: left;
} .table.table-bordered ul li{
  list-style: none;
}

.founder-area-about .image img{
     height: 20rem;
    border-radius: 20px;
  width: 100%;
  object-fit: cover;
}
.founder-area-about .content p{
  font-size: 1.2rem;
}
.founder-area-about .content .name{
  font-size: 1.2rem;
}

.founder-area-about .content .founder-name{
  font-size: 1.2rem;
  color: #D55342;
}
.header-area.banner-padiing-02 {
    padding: 460px 200px 390px 200px;
}

.about-content-area .bg-img {
  bottom: 50px;
}
.single-category .category-image {
    padding: 10px;
    width: 7.5rem !important;
    height: 7.5rem !important;
    border-radius: 50%;
    margin:auto;
}
.single-category .category-content h4 a ,
.contribute-single-item .content .title  a{
      display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    overflow: hidden;
}
.contribute-single-item .content .title {
    font-size: 22px;
    font-weight: 700;
    line-height: 29px;
    margin-bottom: 23px;
    margin-top: 12px;
}
.contribute-single-item .progress-item{
  display: none;
}
.contribute-single-item .content .excpert {

    display: none !important;
}
.table.table-bordered{
  width: 100% !important;
}
.gallery_section2 .slick-slider .slick-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    /* margin-top: 30px; */
      position: absolute !important;
    left: 50%;
    transform: translateX(-50%);
    bottom: -20px;

} 
 /* Toast container */
    .donateMesage-container {
      position: fixed;
      bottom: 70px;
      left: 5px;
      z-index: 9999;
    }

    /* Toast message styling */
    .toast {
      background-color: var(--main-color-one);
      color: white;
      padding: 15px 20px;
      border-radius: 5px;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
      margin-top: 10px;
      opacity: 0; /* Initially hidden */
      transform: translateX(-20px); /* Slide-in effect */
      transition: opacity 0.5s ease, transform 0.5s ease;
    }

    /* Show the toast */
    .toast.show {
      opacity: 1;
      transform: translateX(0);
    }


.team-single-item .content{
      background: transparent;
      -webkit-clip-path: none; 
    clip-path: none;
}

.team-single-item .content.style-1 ,
.team-single-item .content.style-2,
.team-single-item .content.style-3 {
    background-color: transparent;
}
.gallery-slider .single-gallery-image img{
      height: 10rem;
    width: 18rem;
    margin: 0 8px;
    border-radius: 10px;
}
.gallery_section2{
  display: none;
}
.slider{
      position: inherit;
       background-color: #fff;
}
.slider .slides {
    display: ;
  transition: none;
  transform: none !important;
}
.slider .buttons,
.slider .dots{
  display: none;
}
.auto-container .events-thumbs-man img {
    max-height: 80vh;
  height: 80vh;
  margin-top: rem;
}
.sidebar-outer-wrap::-webkit-scrollbar{
  display:none;
}
.sidebar-outer-wrap.scrollTop{
    position: fixed;
    top: 0;
    width: 25%;
    height: 90%;
  background: #fff;
    overflow-y: auto;
  overflow-x: hidden;
}
.share-list-icon{
  text-align: end;
}
.inline .description {
    position: relative;
    top: unset;
    right: unset;
}
.inline .description i {
    width: 15px;
    height: 15px;
    border: 1px solid var(--main-clr);
    color: var(--main-clr);
    background-color: #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    border-radius: 15px;
    cursor: pointer;
}
.donation-wrapper .price-item {
  margin: 10px 0;
}
.donation-gift-box-inner1 .donation-gift-box-inner {
  width: 350px;
   margin-left: 2rem;
}
.progress-content {
  margin-top: -2rem;
}
.contribute-single-item .content .excpert {
    word-break: break-word;
    min-height: auto;
}
.donation-gift-box  p{
  display: -webkit-box; 
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  text-overflow: ellipsis; 
  overflow: hidden;
}
.back-to-top {
    position: fixed;
    right: 10px;
  bottom: 40px;
}
.donation-single-content-area .widget-area .slick-slider .slick-dots {
 
    display: none !important;
}
.client-area-two .client-slider img {
  border-radius: 10px;
}
.header-area.header-bg-04::after{
  background: transparent !important;
}
.topbar-area.style-02{
  background: #000;
}
.navbar-area.nav-style-02.charity-nav-05{
  background: #fff !important;
}
.widget-area .donation .heading {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 1.8rem;
    margin-top: 0;
  color: #0D1C34;
}
.head-title {
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: .5px;
    margin-bottom: 0;
    border-left: 4px solid var(--main-color-one);
    color: #0D1C34;
    padding-left: 8px;
    text-transform: none;
  margin-left: 1rem;
}

.navbar-area.nav-style-02.charity-nav-05 .nav-container .nav-right-content ul li a{
  background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) ;
}
.auto-container{
  padding: 0 ;
}
.section-title .title {
  font-size: 24px;
}
.tab_section.scrollTop{
    top: -10px;
    border-radius: 0;
}
.donation-amount_rupee,
.single_amount_first{
  position:relative;
}

.mostily_donated{
  position: absolute;
     top: -25px;
    left: 0;
    width: 100%;
      background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    color: #fff;
    font-size: 12px;
    padding: 3px 0;
    text-align: center;
    white-space: nowrap;
    border-radius: 5px 5px 0 0;
    display:none;
}
.single_amount_first1:nth-child(2) .mostily_donated{
  display: block;
}

.single_amount_first1:nth-child(2) .mostily_donated.active{ 
  display: none;
}

.active2 .mostily_donated{
  display: none !important;
}
.donation-amount_rupee .symbol_r{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 24px;
    font-size: 1rem;

}
.client-area-two .client-slider img{
  background: #fff;
}
.tab_section .tab-pane .amount_wrapper1 input{
    border: none;
    background: transparent !important;
    width: 30%;
    color: #fff;
    font-size: 1.1rem;
}

  .volunteer-section {
    background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    color: white;
    padding: 30px 20px;
    text-align: center;
    overflow: hidden;
  }
  
   .volunteer-section .container {
    max-width: 1200px;
    margin: 0 auto;
  }
  
   .volunteer-section h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    animation: fadeInDown 1s ease-out;
    color: #fff;
  }
  
   .volunteer-section .tagline {
    font-size: 1.2rem;
    margin-bottom: 40px;
    animation: fadeInUp 1s ease-out;
  }
  
    .volunteer-section .cards {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
  }
  
   .volunteer-section .card {
    background: white;
    color: #333;
    border-radius: 10px;
    padding: 20px;
    width: 100%;
    max-width: 350px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: left;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    opacity: 0;
    transform: translateY(50px);
  }

 .volunteer-section .cards .car{
   transform: scale(1.1) !important;
   margin: 10px;
}
  
    .volunteer-section .card[data-aos="fade-up"] {
    opacity: 1;
    transform: translateY(0);
  }
  
    .volunteer-section .card:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
  }
  
   .volunteer-section .card h2 {
    font-size: 1.5rem;
    color: #ff7e5f;
    margin-bottom: 10px;
  }
  
 .volunteer-section .card h2 span{
   background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%);
   -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
    .volunteer-section .card p {
    font-size: 1rem;
    margin-bottom: 20px;
  }
  
    .volunteer-section .card ul,
    .volunteer-section .card ol {
    padding-left: 20px;
  }
  
    .volunteer-section .card ul li,
    .volunteer-section .card ol li {
    margin-bottom: 10px;
    line-height: 1.5;
  }

  .volunteer-section .card ul li::::marker ,
    .volunteer-section .card ol li::::marker {
      background: #ff0 !important;
      color: #f00;
      width: 1rem;
      height: 1rem;
      border-radius: 50%;
}
  
   .volunteer-section .cta-button {
    display: inline-block;
     background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    color: white;
     text-align: center;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 1.1rem;
    text-decoration: none;
    transition: background 0.3s ease, transform 0.3s ease;
  }
  
    .volunteer-section .cta-button:hover {
    transform: scale(1.1);
  }
  
   .volunteer-section a {
    color: #dc2026;
    font-weight: bold;
    text-decoration: none;
  }
  
   .volunteer-section a:hover {
    text-decoration: underline;
  }
  
  @keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translateY(-30px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(30px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  
  }
  


.single-category-items {
  position:relative;
  margin-bottom: 1rem;
  background: ;
  
      display: flex;
    align-items: center;
    justify-content: center;
}
.single-category-items .single-category {
  box-shadow: none;
  padding-bottom: 60px;
}

.category_btn{
  width: 90%;
  color: #fff;
  margin-top: 20px;
  padding: 10px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  position: absolute;
  left: 10px;
  bottom: 21px;
  background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%);
  box-shadow: 0 5px 15px #ffa02699;
}
.charity-nav-05 .navbar-search .search-open{
  color: #000;
}
.charity-nav-05 .navbar-search .menu-search-form button,
.navbar-search .menu-search-form .search-close:hover {
      background: var(--main-color-one) !important;
}
.submit-btn{
      background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    color: #fff;
}
.navbar-area.nav-style-02 .nav-container .nav-right-content02{
     background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
}
.payment_details{
     position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.payment_details .payment_details_donation{
  border: 1px solid var(--main-clr);
    background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    color: #fff;
     margin-top: 1rem;
    padding: 5px 16px;
    border-radius: 5px;
}
.payment_details .close{
    position: absolute !important;
    top: 0rem;
    right: .8rem;
}
.donation-wrapper .price-item {
       background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    color: #fff;
    padding: 0px 0;
    border-radius: 5px;
    font-weight: bold;
    display: ;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: 14px !important;
    cursor: pointer;
  text-align: -webkit-center;
}

.donation-gift-box-inner-main img{
  height: 13rem;
  width: 100%;
  margin-left: 0;
}

.donation-wrapper .price-item .check_btn_price{
  content: "\f00c";
    background: linear-gradient(107deg, rgb(255, 67, 5) 11.1%, rgb(245, 135, 0) 95.3%) !important;
    font-family: "Font Awesome 6 Free";
    position: absolute;
    top: -10px;
    right: -10px;
    color: #fff;
    border-radius: 5px;
    font-size: 12px;
  display: none
}
@media(max-width:600px){
  .certificate_card h4 {
    font-size: 16px;
  }
}