/*
/*
@File: AndTour - Travel Agency HTML Template

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.

This files table contents are outlined below>>>>>

** Common Style
** Home Page
** About Page
** Causes Page
** Cause Details Page
** Contact Page
** Event Page
** Event Details Page
** Faqs Page
** Gallery Grid Page
** Gallery Slider Page
** Login Page
** Registration Page
** Make Donation Page
** News Page
** News Details Page
** Privacy policy Page
** Terms Service Page
** Testimonials  Page
** volunter Page
** Preloader
** Top TO Bottom


/*================================================
Default CSS
=================================================*/

@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,600&display=swap");

:root {
  --main-color: #e8652d;
  --white-color: #ffffff;
  --black-color: #1a2744;
  --navber-color: #424155;
  --paragraph-color: #6b7a90;
  --bg-color: #f5f7fb;
  --transition: 0.4s all ease-in-out;
  --secondary-color: #2bae66;
  --accent-color: #f5a623;
}

html,
body {
  height: 100%;
}

body {
  padding: 0;
  margin: 0;
  font-size: 16px;
  font-family: "Poppins", sans-serif;
}

img {
  max-width: 100%;
  height: auto;
}

.ptb-100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

.pb-100 {
  padding-bottom: 100px;
}

.pt-100 {
  padding-top: 100px;
}

.mb-30 {
  margin-bottom: 30px;
}

a {
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out 0.1s;
  transition: all 0.3s ease-in-out 0.1s;
  outline: 0 !important;
  color: var(--main-color);
}

a:hover {
  text-decoration: none;
  color: var(--heading-color);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Poppins", sans-serif;
  margin: 0;
}

h1 {
  font-size: 70px;
  font-weight: 400;
  line-height: 80px;
}

h2 {
  font-size: 36px;
  font-weight: 500;
  line-height: 50px;
}

h3 {
  font-size: 24px;
  font-weight: 500;
}

h4 {
  font-size: 20px;
  font-weight: 500;
}

h5 {
  font-size: 18px;
  font-weight: 400;
}

h6 {
  font-size: 14px;
  font-weight: 400;
}

p {
  font-size: 16px;
  line-height: 24px;
  color: var(--paragraph-color);
  font-weight: 400;
  font-family: "Poppins", sans-serif;
  margin-bottom: 0;
}

p:last-child {
  margin-bottom: 0;
}

ul {
  padding: 0;
  margin: 0;
}

ul li {
  list-style: none;
  padding: 0;
}

/* --Common Style-- */
section {
  position: relative;
}

.form-control {
  height: 60px;
  border: none;
  box-shadow: 0px 1px 13px 0px #0000000d;
  padding: 10px 22px;
  font-size: 16px;
  background: #e03c3314;
}

.form-control:focus {
  color: var(--heading-color);
  background-color: #fff;
  border: 1px solid var(--main-color);
  outline: none;
  box-shadow: none;
}

.section_padding {
  padding: 100px 0;
}

.section_padding_top {
  padding: 100px 0 0 0;
}

.section_padding_bottom {
  padding: 0 0 100px 0;
}

.bg-color {
  background: #eef4f8;
}

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

.bg-yellow {
  background: #f6a61d;
}

/* --case-boxed-- */
.case_boxed_wrapper {
  box-shadow: 0 8px 30px rgba(26, 39, 68, 0.08);
  background: var(--white-color);
  border-radius: 20px;
  overflow: hidden;
  transition: var(--transition);
  position: relative;
  z-index: 9;
}
.case_boxed_wrapper:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(26, 39, 68, 0.12);
}

.case_boxed_wrapper:hover .case_boxed_img a img {
  transform: scale(1.2) rotate(3deg);
}

.case_boxed_img {
  position: relative;
  overflow: hidden;
}

.case_boxed_img a img {
  width: 100%;
  transition: var(--transition);
}

.causes_badge {
  position: absolute;
  top: 10px;
  left: 10px;
  color: var(--white-color);
  padding: 8px 15px;
  font-size: 14px;
  border-radius: 5px;
}

.causes_boxed_text {
  padding: 15px 20px;
}

.causes_boxed_text h3 {
  font-weight: 500;
  line-height: 35px;
}

.causes_boxed_text h3 a {
  color: var(--black-color);
  padding-top: 20px;
  display: block;
}

.causes_boxed_text h3 a:hover {
  color: var(--main-color);
}

.causes_boxed_text p {
  padding-top: 10px;
}

.causes_boxed_bottom_wrapper {
  border-top: 1px solid #c4c4c457;
  padding-top: 15px;
  margin-top: 17px;
}

.causes_boxed_bottom_wrapper .row .col-lg-6:last-child .casuses_bottom_boxed {
  border-right: none;
}

.casuses_bottom_boxed {
  display: flex;
  align-items: center;
  border-right: 1px solid #e6e6e6;
}

.casuses_bottom_content {
  padding-left: 8px;
}

.casuses_bottom_content h5 {
  font-size: 16px;
  font-weight: 500;
}

.casuses_bottom_content p {
  padding-top: 0;
  font-size: 14px;
}

.skill-bar-percent {
  position: absolute;
  top: 0;
  right: 0;
  font-weight: 700;
  display: flex;
  align-items: center;
}

.skill-bar {
  width: 100%;
  height: 10px;
  position: relative;
  margin-top: 10px;
}

.skill-bar:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  width: 100%;
  height: 100%;
  border-radius: 5px;
  background-color: rgb(253, 61, 12, 0.2);
}

.skill-bar-inner {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  width: 0;
  height: 100%;
  overflow: visible;
}

.skill-bar-inner:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  width: 100%;
  height: 100%;
  border-radius: 5px;
  background: var(--main-color);
}

.class-full-bar-box {
  position: relative;
}

.class-full-bar-box .h3-title {
  font-size: 15px;
  line-height: 15px;
  color: var(--black-color);
  font-weight: 600;
}

.class-full-bar-box .h3-title span {
  color: var(--paragraph-color);
  font-weight: 400;
}

.class-full-bar-percent {
  position: absolute;
  top: -10px;
  right: 0;
  font-size: 15px;
  line-height: 15px;
  font-weight: 800;
  color: #10161b;
  display: flex;
  align-items: center;
}

.class-full-bar-percent h2 {
  font-size: 17px;
  line-height: 28px;
}

.class-full-bar-percent .h3-title {
  margin-bottom: 0;
  font-size: 15px;
  line-height: 15px;
}

.causes_pro_bar {
  background: #ffffff;
  box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.08);
  padding: 20px 20px;
  border-radius: 10px;
  margin-top: -50px;
  z-index: 999;
  position: relative;
}

/* --Event Boxed Area-- */
.event_left_side_wrapper {
  background: #ffffff;
  box-shadow: 0 8px 30px rgba(26, 39, 68, 0.06);
  border-radius: 20px;
  overflow: hidden;
  transition: var(--transition);
}
.event_left_side_wrapper:hover {
  box-shadow: 0 12px 40px rgba(26, 39, 68, 0.1);
}

.event_big_img {
  position: relative;
  overflow: hidden;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.event_big_img a img {
  width: 100%;
  transition: var(--transition);
}

.event_left_side_wrapper:hover .event_big_img a img {
  transform: scale(1.2) rotate(3deg);
}

.event_content_area {
  position: relative;
}

.big_content_padding {
  padding: 15px 18px;
}

.small_content_padding {
  padding: 15px 18px;
  margin-bottom: 20px;
}

.small_content_padding .event_heading_area {
  padding-top: 7px;
}

.small_content_padding .event_para {
  padding-top: 8px;
  padding-right: 90px;
}

.event_tag_area a {
  font-size: 18px;
  font-weight: 500;
}

.event_heading_area {
  padding-top: 15px;
}

.event_heading {
  padding-right: 90px;
}

.event_heading h3 {
  line-height: 34px;
}

.event_heading h3 a {
  color: var(--black-color);
}

.event_heading h3 a:hover {
  color: var(--main-color);
}

.event_date {
  position: absolute;
  width: 85px;
  height: 83px;
  text-align: center;
  right: 32px;
  top: 31px;
}

.event_date h6 {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 18px;
  color: #fff;
  transform: translate(-50%, -58%);
}

.event_date h6 span {
  display: block;
}

.event_para {
  padding-top: 18px;
  padding-right: 90px;
}

.event_boxed_bottom_wrapper {
  border-top: 1px solid #c4c4c440;
  border-bottom: 1px solid #c4c4c440;
  padding-top: 15px;
  margin-top: 17px;
  padding-bottom: 15px;
}

.event_boxed_bottom_wrapper .row .col-lg-6:last-child .event_bottom_boxed {
  border-right: none;
}

.event_bottom_boxed {
  display: flex;
  align-items: center;
  border-right: 1px solid #e6e6e6;
}

.event_bottom_content {
  padding-left: 8px;
}

.event_bottom_content h5 {
  font-size: 16px;
  font-weight: 500;
}

.event_bottom_content p {
  padding-top: 0;
  font-size: 14px;
}

.event_button {
  margin-top: 30px;
}

.event_button a {
  width: 100%;
}

/* --Heading Area-- */
.section_heading {
  text-align: center;
  margin-bottom: 50px;
}

.section_heading h3 {
  color: var(--paragraph-color);
  font-weight: 400;
  margin-bottom: -30px;
}

.section_heading h2 {
  padding-top: 20px;
  position: relative;
}
.section_heading_two {
  text-align: center;
  margin-bottom: 50px;
}

.section_heading_two h3 {
  color: var(--paragraph-color);
  font-weight: 400;
  margin-bottom: -30px;
}

.section_heading_two h2 {
  padding-top: 40px;
  position: relative;
}

.section_heading h2:before {
  content: url("../img/icon/heading.png");
}

.section_after {
  position: relative;
}

.section_after::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 240px;
  background-color: var(--white-color);
}

.img_animation {
  overflow: hidden;
}

.img_animation img {
  transition: var(--transition);
  position: relative;
}

.img_animation:hover img {
  transform: scale(1.2);
}

/* --Button Area start-- */
.btn-check:focus + .btn,
.btn:focus {
  outline: none;
  box-shadow: none;
}

.btn {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  font-size: 16px;
  border-radius: 5px;
  box-shadow: none;
  overflow: hidden;
  position: relative;
  z-index: 0;
}

.btn:hover {
  color: var(--white-color);
}

.btn_theme {
  color: var(--white-color);
  background-color: var(--main-color);
  transition: var(--transition);
  box-shadow: none;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  z-index: 0;
  border: none;
}

.btn_theme:hover {
  background-color: var(--black-color);
}

.btn_md {
  padding: 12px 35px;
  font-size: 18px;
}

.btn_sm {
  font-size: 14px;
  padding: 5px 18px;
}

.btn_navber {
  color: var(--navber-color);
  border: 2px solid var(--main-color);
  padding: 7px 20px;
  transition: var(--transition);
  box-shadow: none;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  z-index: 0;
  border-radius: 50px;
}

.btn_navber:hover {
  background: var(--main-color);
}

.is-sticky .btn_navber {
  border: 1px solid var(--main-color);
}

/* --- Header CTA Buttons --- */
.btn_join_ngo {
  color: var(--main-color);
  border: 2px solid var(--main-color);
  background: transparent;
  padding: 8px 22px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 14px;
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn_join_ngo:hover {
  background: var(--main-color);
  color: #fff;
}
.btn_join_ngo i { font-size: 13px; }

.btn_donate_now {
  color: #fff;
  background: linear-gradient(135deg, var(--main-color) 0%, #d4551f 100%);
  border: none;
  padding: 10px 24px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 14px;
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 4px 15px rgba(232, 101, 45, 0.3);
}
.btn_donate_now:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(232, 101, 45, 0.4);
  color: #fff;
}
.btn_donate_now i { font-size: 13px; }
.btn_donate_now.btn-sm,
.btn_join_ngo.btn-sm {
  padding: 8px 18px;
  font-size: 13px;
}

.others-options .option-item {
  margin-left: 10px;
}

/* =========================
        About Page Sections
=========================*/

/* --- Genesis Section --- */
.genesis_content p {
  color: var(--paragraph-color);
  font-size: 15px;
  line-height: 26px;
  margin-bottom: 14px;
}
.genesis_stats_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.genesis_stat_item {
  background: #fff;
  border-radius: 16px;
  padding: 24px 20px;
  border: 1px solid rgba(0,0,0,0.06);
  transition: var(--transition);
}
.genesis_stat_item:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(26, 39, 68, 0.08);
}
.genesis_stat_icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--main-color), #d4551f);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin-bottom: 14px;
}
.genesis_stat_item h4 {
  font-size: 16px;
  font-weight: 700;
  color: var(--black-color);
  margin-bottom: 8px;
}
.genesis_stat_item p {
  font-size: 13px;
  color: var(--paragraph-color);
  line-height: 20px;
  margin: 0;
}

/* --- Vision & Mission Cards --- */
.vision_mission_card {
  border-radius: 20px;
  padding: 36px 30px;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.vm_vision {
  background: linear-gradient(135deg, #1a2744 0%, #2c4a7c 100%);
  color: #fff;
}
.vm_mission {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 4px 20px rgba(0,0,0,0.04);
}
.vm_icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-bottom: 20px;
}
.vm_vision .vm_icon {
  background: rgba(245, 166, 35, 0.15);
  color: #f5a623;
}
.vm_mission .vm_icon {
  background: rgba(232, 101, 45, 0.1);
  color: var(--main-color);
}
.vision_mission_card h3 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 16px;
}
.vm_vision h3 { color: #fff; }
.vm_mission h3 { color: var(--black-color); }
.vm_vision p {
  color: rgba(255,255,255,0.75);
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 12px;
}
.vm_mission p {
  color: var(--paragraph-color);
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 12px;
}
.mission_list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.mission_list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  font-size: 14px;
  color: var(--paragraph-color);
}
.mission_list li i {
  color: var(--secondary-color);
  font-size: 14px;
  min-width: 18px;
}

/* --- Approach Cards --- */
.approach_card {
  background: #fff;
  border-radius: 20px;
  padding: 32px 24px;
  text-align: center;
  border: 1px solid rgba(0,0,0,0.06);
  transition: var(--transition);
  height: 100%;
}
.approach_card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 35px rgba(26, 39, 68, 0.1);
}
.approach_icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(232, 101, 45, 0.1), rgba(245, 166, 35, 0.1));
  color: var(--main-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin: 0 auto 20px;
  transition: var(--transition);
}
.approach_card:hover .approach_icon {
  background: linear-gradient(135deg, var(--main-color), #d4551f);
  color: #fff;
}
.approach_card h4 {
  font-size: 17px;
  font-weight: 700;
  color: var(--black-color);
  margin-bottom: 12px;
}
.approach_card p {
  font-size: 14px;
  color: var(--paragraph-color);
  line-height: 22px;
  margin: 0;
}

/* --- Commitment Cards --- */
.commitment_card {
  background: #fff;
  border-radius: 20px;
  padding: 30px 24px;
  border: 1px solid rgba(0,0,0,0.06);
  transition: var(--transition);
  height: 100%;
  position: relative;
  overflow: hidden;
}
.commitment_card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--main-color), var(--accent-color));
  opacity: 0;
  transition: var(--transition);
}
.commitment_card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(26, 39, 68, 0.08);
}
.commitment_card:hover::before {
  opacity: 1;
}
.commitment_icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(232, 101, 45, 0.08);
  color: var(--main-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 18px;
  transition: var(--transition);
}
.commitment_card:hover .commitment_icon {
  background: var(--main-color);
  color: #fff;
}
.commitment_card h4 {
  font-size: 17px;
  font-weight: 700;
  color: var(--black-color);
  margin-bottom: 10px;
}
.commitment_card p {
  font-size: 14px;
  color: var(--paragraph-color);
  line-height: 22px;
  margin: 0;
}

/* =========================
        Home Page
=========================*/
/* --Banner-- */
#home_one_banner {
  background: linear-gradient(135deg, #0a1628 0%, #0f2847 30%, #163d6e 60%, #1a4f8a 100%);
  padding: 80px 0 60px;
  position: relative;
  overflow: hidden;
  min-height: 620px;
}
#home_one_banner::before {
  content: "";
  position: absolute;
  width: 3px; height: 3px;
  top: 15%; left: 10%;
  border-radius: 50%;
  background: rgba(255,255,255,0.3);
  box-shadow:
    80px 60px 0 rgba(255,255,255,0.15),
    200px 120px 0 rgba(255,255,255,0.2),
    350px 30px 0 rgba(255,255,255,0.1),
    500px 180px 0 rgba(255,255,255,0.2),
    650px 80px 0 rgba(255,255,255,0.15),
    800px 200px 0 rgba(255,255,255,0.1),
    950px 50px 0 rgba(255,255,255,0.2),
    1100px 160px 0 rgba(255,255,255,0.15),
    1250px 90px 0 rgba(255,255,255,0.1),
    150px 300px 0 rgba(255,255,255,0.12),
    400px 350px 0 rgba(255,255,255,0.18),
    700px 320px 0 rgba(255,255,255,0.1),
    1000px 280px 0 rgba(255,255,255,0.15),
    1200px 350px 0 rgba(255,255,255,0.12),
    50px 450px 0 rgba(255,255,255,0.1),
    300px 480px 0 rgba(255,255,255,0.15),
    600px 420px 0 rgba(255,255,255,0.2),
    900px 460px 0 rgba(255,255,255,0.1),
    1150px 430px 0 rgba(255,255,255,0.18);
  z-index: 0;
  pointer-events: none;
  animation: particleDrift 20s linear infinite;
}
@keyframes particleDrift {
  0% { transform: translateY(0); opacity: 0.6; }
  50% { transform: translateY(-10px); opacity: 1; }
  100% { transform: translateY(0); opacity: 0.6; }
}

/* --- Animated Floating Orbs --- */
.hero-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}
.hero-orb-1 {
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(30,144,255,0.15) 0%, transparent 70%);
  top: -80px; left: -60px;
  animation: orbFloat1 8s ease-in-out infinite;
}
.hero-orb-2 {
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(0,200,150,0.12) 0%, transparent 70%);
  top: 60%; right: 5%;
  animation: orbFloat2 10s ease-in-out infinite;
}
.hero-orb-3 {
  width: 150px; height: 150px;
  background: radial-gradient(circle, rgba(255,180,50,0.10) 0%, transparent 70%);
  bottom: 10%; left: 30%;
  animation: orbFloat3 12s ease-in-out infinite;
}
.hero-orb-4 {
  width: 100px; height: 100px;
  background: radial-gradient(circle, rgba(100,180,255,0.12) 0%, transparent 70%);
  top: 20%; left: 50%;
  animation: orbFloat1 6s ease-in-out infinite reverse;
}
@keyframes orbFloat1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(30px, -20px) scale(1.08); }
}
@keyframes orbFloat2 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-25px, 15px) scale(1.05); }
}
@keyframes orbFloat3 {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(20px, -25px); }
}

/* --- Light Rays --- */
.hero-light-ray {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}
.hero-ray-1 {
  width: 2px; height: 400px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.06) 0%, transparent 100%);
  top: -50px; left: 20%;
  transform: rotate(25deg);
  animation: rayPulse 4s ease-in-out infinite;
}
.hero-ray-2 {
  width: 2px; height: 300px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.04) 0%, transparent 100%);
  top: 0; right: 30%;
  transform: rotate(-15deg);
  animation: rayPulse 6s ease-in-out infinite 1s;
}
@keyframes rayPulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.8; }
}

/* --- Hero Badge --- */
.hero-badge {
  display: inline-block;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 50px;
  padding: 8px 20px;
  color: #7ec8f0;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.5px;
  margin-bottom: 20px;
  backdrop-filter: blur(4px);
}
.hero-badge i {
  color: #ff6b6b;
  margin-right: 6px;
}

/* --- Banner Text --- */
.banner_one_text {
  position: relative;
  z-index: 2;
}
.banner_one_text h1 {
  color: #ffffff;
  font-size: 46px;
  font-weight: 800;
  line-height: 58px;
  margin-bottom: 0;
}
.banner_one_text h1 span {
  font-weight: 800;
}
.banner_one_text .color_big {
  position: relative;
  z-index: 999;
  color: #5cb8ff;
}
.banner_one_text .color_big::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 8px;
  background: linear-gradient(90deg, #1e90ff, #00c896);
  bottom: 6px;
  left: 0;
  z-index: -1;
  border-radius: 4px;
}
.banner_one_text > p {
  padding-top: 20px;
  font-size: 17px;
  line-height: 28px;
  color: rgba(255,255,255,0.8);
}

/* --- CTA Buttons --- */
.hero-cta-group {
  display: flex;
  gap: 16px;
  margin-top: 28px;
  flex-wrap: wrap;
}
.hero-btn-primary {
  background: linear-gradient(135deg, #1e90ff 0%, #00c896 100%) !important;
  border: none;
  font-weight: 600;
  padding: 14px 32px !important;
  border-radius: 50px;
  font-size: 15px;
  box-shadow: 0 8px 25px rgba(30,144,255,0.3);
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
}
.hero-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 35px rgba(30,144,255,0.4);
  background: linear-gradient(135deg, #00c896 0%, #1e90ff 100%) !important;
  color: #fff !important;
}
.hero-btn-primary i {
  margin-right: 8px;
}
.btn-outline-hero {
  color: #ffffff !important;
  border: 2px solid rgba(255,255,255,0.3);
  background: rgba(255,255,255,0.05);
  font-weight: 600;
  padding: 12px 28px !important;
  border-radius: 50px;
  font-size: 15px;
  transition: var(--transition);
  backdrop-filter: blur(4px);
  display: inline-flex;
  align-items: center;
}
.btn-outline-hero:hover {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.5);
  color: #ffffff !important;
}
.btn-outline-hero i {
  margin-right: 8px;
}

/* --- Impact Strip --- */
.hero-impact-strip {
  display: flex;
  gap: 30px;
  margin-top: 35px;
  padding-top: 25px;
  border-top: 1px solid rgba(255,255,255,0.12);
}
.hero-impact-item h4 {
  font-size: 28px;
  font-weight: 800;
  color: #5cb8ff;
  margin: 0;
}
.hero-impact-item p {
  font-size: 13px;
  color: rgba(255,255,255,0.6);
  margin: 4px 0 0;
  padding: 0;
}

/* --- Hero Image & Floating Cards --- */
.banner_one_img {
  position: relative;
  z-index: 2;
}
.hero-image-wrapper {
  position: relative;
  text-align: center;
  padding: 20px;
}
.hero-image-wrapper > img {
  max-width: 90%;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,0.3));
  border-radius: 20px;
}
.hero-float-card {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,0.95);
  border-radius: 14px;
  padding: 12px 18px;
  box-shadow: 0 8px 30px rgba(0,0,0,0.15);
  z-index: 5;
  backdrop-filter: blur(10px);
}
.hero-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #fff;
  flex-shrink: 0;
}
.hero-float-card h5 {
  font-size: 18px;
  font-weight: 700;
  color: #0a1628;
  margin: 0;
}
.hero-float-card p {
  font-size: 11px;
  color: #666;
  margin: 2px 0 0;
  padding: 0;
}
.hero-card-1 {
  top: 15%;
  left: -10%;
  animation: cardFloat1 4s ease-in-out infinite;
}
.hero-card-1 .hero-card-icon {
  background: linear-gradient(135deg, #1e90ff, #4facfe);
}
.hero-card-2 {
  top: 50%;
  right: -5%;
  animation: cardFloat2 5s ease-in-out infinite;
}
.hero-card-2 .hero-card-icon {
  background: linear-gradient(135deg, #00c896, #00e6a7);
}
.hero-card-3 {
  bottom: 8%;
  left: 5%;
  animation: cardFloat3 6s ease-in-out infinite;
}
.hero-card-3 .hero-card-icon {
  background: linear-gradient(135deg, #ff6b6b, #ffa07a);
}
@keyframes cardFloat1 {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
@keyframes cardFloat2 {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(8px); }
}
@keyframes cardFloat3 {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

/* --- Hero Wave Separator --- */
.hero-wave-separator {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  z-index: 3;
  line-height: 0;
}
.hero-wave-separator svg {
  width: 100%;
  height: 60px;
  display: block;
}

/* --About Top Area-- */
.about_top_boxed {
  position: relative;
  border-radius: 20px;
  padding: 40px 30px 20px 30px;
  transition: var(--transition);
}

.about_top_boxed:hover {
  transform: translateY(10px);
}

.bg_one {
  background: linear-gradient(135deg, #fff3eb 0%, #ffe8d6 100%);
}

.bg_two {
  background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
}

.bg_three {
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
}

.bg_four {
  background: linear-gradient(135deg, #fce4ec 0%, #f8bbd0 100%);
}

.about_top_boxed_icon {
  text-align: center;
  margin: 0px auto 0 auto;
  margin-top: -45px;
  transition: var(--transition);
}

.about_top_boxed:hover .about_top_boxed_icon {
  transform: translateY(20px);
}

.about_top_boxed_icon img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  box-shadow: 0px -4px 16px rgb(0 0 0 / 6%), 4px 8px 16px rgb(0 0 0 / 10%);
  margin-top: -45px;
}

.about_top_boxed_text {
  padding-top: 20px;
}

.about_top_boxed_text h3 {
  font-size: 30px;
  font-weight: 500;
  padding: 7px 0;
}

.about_top_boxed_text a {
  font-size: 16px;
  font-weight: 500;
}

.about_top_boxed_vector {
  position: absolute;
  bottom: 15px;
  right: 20px;
}

.about_area_main_text {
  padding-top: 54px;
}

.about_area_heading {
  position: relative;
  display: flex;
  align-items: center;
  left: -119px;
}

.about_area_heading h3 {
  color: var(--paragraph-color);
  font-weight: 400;
}

.about_area_heading_two h2 {
  line-height: 50px;
  font-weight: 500;
}

.color_big_heading {
  position: relative;
  z-index: 99;
}

.color_big_heading::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 12px;
  background: linear-gradient(90deg, rgba(245,166,35,0.4) 0%, rgba(232,101,45,0.3) 100%);
  bottom: 4px;
  left: 0;
  z-index: -1;
  border-radius: 6px;
}

.about_area_heading_two h3 {
  font-weight: 500;
  color: var(--main-color);
  padding-top: 15px;
}

.about_area_para {
  padding-top: 20px;
}

.about_area_para h5 {
  line-height: 26px;
}

.about_area_para p {
  font-size: 18px;
  padding-top: 20px;
  line-height: 26px;
}

.about_vedio_area {
  padding-top: 45px;
}

.vedio_btn {
  margin-left: 35px;
  font-size: 18px;
  font-weight: 600;
  color: var(--black-color);
}

.vedio_btn i {
  height: 50px;
  width: 50px;
  border: 1px solid;
  text-align: center;
  line-height: 46px;
  border-radius: 50%;
  font-size: 24px;
  margin-right: 14px;
  color: var(--main-color);
}

/* -- Donate Area-- */
#donate_area {
  background: linear-gradient(135deg, #1a2744 0%, #2c4a7c 50%, #1a2744 100%);
  background-size: cover;
  background-position: center;
  padding: 100px 0;
  position: relative;
  overflow: hidden;
}
#donate_area::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url("../img/common/donat_banner.png") center/cover no-repeat;
  opacity: 0.15;
  z-index: 0;
}
#donate_area .container {
  position: relative;
  z-index: 1;
}

.donate_text {
  text-align: center;
}

.donate_text h3 {
  color: var(--accent-color);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.donate_text h2 {
  color: var(--white-color);
  font-size: 36px;
  line-height: 50px;
  padding-top: 15px;
  font-weight: 700;
}

.donate_text a {
  margin-top: 20px;
}

#partner_area {
  padding: 100px 0 200px 0;
}

#partner_area .owl-carousel .owl-item img {
  width: auto !important;
}

/* --Counter Area-- */
#counter_area {
  z-index: 9;
}

.counter_area_wrapper {
  background: linear-gradient(135deg, #1a2744 0%, #2c4a7c 100%);
  box-shadow: 0 20px 60px rgba(26, 39, 68, 0.3);
  border-radius: 20px;
  padding: 50px 30px;
  margin-top: -100px;
}

.counter_item {
  text-align: center;
  border-right: 1px solid rgba(255,255,255,0.15);
}

.row .col-lg-3:last-child .counter_item {
  border-right: none;
}

.counter_item h2 {
  line-height: 50px;
  padding-top: 10px;
  color: var(--accent-color);
  font-weight: 800;
  font-size: 42px;
}

.counter_item p {
  font-size: 16px;
  padding-top: 8px;
  color: rgba(255,255,255,0.8);
  font-weight: 500;
}

.counter_item img {
  filter: brightness(0) invert(1) opacity(0.7);
}

/* --Blog area-- */
#home_blog_area {
  padding: 200px 0 100px 0;
  margin-top: -100px;
}

.blog_card_wrapper {
  background: #ffffff;
  box-shadow: 0 8px 30px rgba(26, 39, 68, 0.08);
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  z-index: 9;
  transition: var(--transition);
}
.blog_card_wrapper:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(26, 39, 68, 0.12);
}

.blog_card_img {
  overflow: hidden;
}

.blog_card_img a img {
  width: 100%;
  transition: var(--transition);
}

.blog_card_wrapper:hover .blog_card_img a img {
  transform: scale(1.2);
}

.blog_card_text {
  padding: 20px 20px;
}

.blog_card_heading {
  padding-top: 10px;
}

.blog_card_heading h3 {
  line-height: 35px;
}

.blog_card_heading h3 a {
  color: var(--black-color);
}

.blog_card_heading h3 a:hover {
  color: var(--main-color);
}

.blog_card_heading p {
  padding-top: 13px;
}

.blog_boxed_bottom_wrapper {
  border-top: 1px solid #c4c4c457;
  padding-top: 15px;
  margin-top: 17px;
}

.blog_boxed_bottom_wrapper .row .col-lg-6:last-child .blog_bottom_boxed {
  border-right: none;
}

.blog_bottom_boxed {
  display: flex;
  align-items: center;
  border-right: 1px solid #e6e6e6;
}

.blog_bottom_content {
  padding-left: 8px;
}

.blog_bottom_content h5 {
  font-size: 16px;
  font-weight: 500;
}

.blog_bottom_content p {
  padding-top: 0;
  font-size: 14px;
}

/* --Subscribe Area-- */
.subscribe_wrapper {
  background: linear-gradient(135deg, #fff8f3 0%, #ffffff 100%);
  box-shadow: 0 8px 30px rgba(26, 39, 68, 0.08);
  border-radius: 20px;
  padding: 40px 85px 40px 85px;
  border: 1px solid rgba(232, 101, 45, 0.1);
}

.subscribe_text h3 {
  font-size: 30px;
  padding-top: 10px;
  line-height: 40px;
}

#subscribe_form .form-control {
  border: 1px solid var(--main-color);
  height: 60px;
  background: var(--white-color);
}

#subscribe_form .btn_md {
  padding: 16px 35px;
  font-size: 18px;
}

/* --Footer Area-- */
#footer_area {
  padding: 80px 0 50px 0;
  background: linear-gradient(180deg, #0f1b33 0%, #1a2744 40%, #16213a 100%);
  position: relative;
  overflow: hidden;
}
#footer_area::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(ellipse at 20% 80%, rgba(232, 101, 45, 0.06) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 20%, rgba(43, 174, 102, 0.04) 0%, transparent 60%);
  pointer-events: none;
}
#footer_area > .container {
  position: relative;
  z-index: 1;
}

/* Footer Top Accent Line */
.footer-top-accent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--main-color) 0%, var(--accent-color) 50%, var(--secondary-color) 100%);
}

/* Footer Logo */
.footer-logo-wrapper {
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
}
.footer-logo-wrapper img {
  max-height: 50px;
}
.footer-reg-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(245, 166, 35, 0.12);
  border: 1px solid rgba(245, 166, 35, 0.25);
  border-radius: 20px;
  padding: 4px 12px;
  font-size: 11px;
  color: #f5a623;
  font-weight: 600;
  letter-spacing: 0.3px;
}
.footer-reg-badge i {
  font-size: 12px;
}

.footer_area_about {
  padding-right: 40px;
}

.footer_area_about p {
  padding-top: 20px;
  padding-bottom: 10px;
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
  line-height: 26px;
}

.footer_area_about h6 {
  padding-top: 5px;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.65);
  line-height: 27px;
}

.footer_area_about h6 strong {
  color: #fff;
}

.footer_area_about h6 a {
  color: rgba(255, 255, 255, 0.65);
}

.footer_area_about h6 a:hover {
  color: var(--main-color);
}

/* Footer Contact Items */
.footer-contact-list {
  margin-top: 20px;
}
.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.65);
}
.footer-icon-circle {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 50%;
  background: rgba(232, 101, 45, 0.12);
  border: 1px solid rgba(232, 101, 45, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--main-color);
  font-size: 14px;
  transition: var(--transition);
}
.footer-contact-item:hover .footer-icon-circle {
  background: var(--main-color);
  color: #fff;
  transform: scale(1.05);
}
.footer-contact-item a {
  color: rgba(255, 255, 255, 0.65);
  transition: var(--transition);
}
.footer-contact-item a:hover {
  color: var(--main-color);
}

/* Footer Social */
.footer-social {
  margin-top: 24px;
  display: flex;
  gap: 10px;
}
.footer-social a {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  transition: var(--transition);
}
.footer-social a:hover {
  background: var(--main-color);
  border-color: var(--main-color);
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(232, 101, 45, 0.3);
}

/* Footer Navigation Columns */
.footer_navitem_ara h3 {
  padding-bottom: 25px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
}
.footer-heading-accent {
  display: inline-block;
  width: 30px;
  height: 3px;
  background: linear-gradient(90deg, var(--main-color), var(--accent-color));
  border-radius: 2px;
}

.nav_item_footer ul li {
  padding-bottom: 14px;
}

.nav_item_footer ul li:last-child {
  padding-bottom: 0px;
}

.nav_item_footer ul li a {
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: var(--transition);
}

.nav_item_footer ul li a:hover {
  color: var(--main-color);
  transform: translateX(4px);
}

.nav_item_footer ul li a i {
  font-size: 10px;
  color: var(--main-color);
  opacity: 0.7;
  transition: var(--transition);
}

.nav_item_footer ul li a:hover i {
  opacity: 1;
}

/* Footer Involve */
.footer_involve_text p {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 24px;
}

.footer_cta_buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

/* Footer Button Overrides for Dark BG */
#footer_area .btn_join_ngo {
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(255, 255, 255, 0.3);
}
#footer_area .btn_join_ngo:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
  color: #fff;
}
#footer_area .btn_donate_now {
  box-shadow: 0 4px 15px rgba(232, 101, 45, 0.3);
}
#footer_area .btn_donate_now:hover {
  box-shadow: 0 6px 25px rgba(232, 101, 45, 0.45);
}

/* Footer 80G Badge */
.footer-80g-badge {
  margin-top: 22px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: rgba(43, 174, 102, 0.08);
  border: 1px solid rgba(43, 174, 102, 0.18);
  border-radius: 10px;
  padding: 12px 14px;
}
.footer-80g-badge i {
  color: var(--secondary-color);
  font-size: 16px;
  margin-top: 2px;
  min-width: 18px;
}
.footer-80g-badge span {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 18px;
}

.footer_twitter_area p {
  padding: 10px 0;
}

.footer_twitter_area h6 {
  font-size: 16px;
  font-weight: 500;
  padding-top: 10px;
}

/* -Copyright Area- */
.copyright_area {
  background-color: #0c1526;
  padding: 18px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.copyright_left p {
  color: rgba(255, 255, 255, 0.5);
  font-size: 13px;
  margin: 0;
}

.copyright_left p a {
  color: var(--main-color);
  font-weight: 600;
  transition: var(--transition);
}

.copyright_left p a:hover {
  color: var(--accent-color);
}

.copyright_right {
  text-align: right;
}

.copyright_right ul li {
  display: inline-flex;
  padding-left: 20px;
}

.copyright_right ul li a {
  color: rgba(255, 255, 255, 0.5);
  font-size: 13px;
  transition: var(--transition);
}

.copyright_right ul li a:hover {
  color: var(--main-color);
}

/* =========================
        Home Page Two
=========================*/
#home_two_banner {
  background-image: url("../img/home-2/common/banner.png");
  padding: 150px 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.banner_two_text {
    text-align: center;
}
.banner_two_text h6 {
    color: var(--white-color);
    font-size: 18px;
    padding-bottom: 10px;
}
.banner_two_text h6 span {
    color: var(--main-color);
}
.banner_two_text h1 {
    color: var(--white-color);
    font-size: 90px;
    font-weight: 500;
    line-height: 100px;
}
.banner_two_text p {
    color: var(--white-color);
    padding: 15px 115px 15px 115px;
    line-height: 30px;
}
.home_two_banner_button {
    padding-top: 30px;
    display: flex;
    justify-content: center;
}
.home_two_banner_button a {
    color: var(--white-color);
}
/* --About area-- */
.about_two_left_wrapper h3{
    color: #818090;
    font-weight: 400;
    padding-bottom: 15px;
}
.about_two_left_wrapper h2{
    padding-bottom: 15px;
}
.about_two_list_wrapper{
    display: flex;
    padding-top: 20px;
}
.about_two_list_wrapper ul:last-child{
    padding-left: 30px;
}
.about_two_list_wrapper ul li{
    color: var(--paragraph-color);
    padding-bottom: 15px;
}
.about_two_list_wrapper ul li i{
    color: var(--main-color);
    padding-right: 10px;
}
.about_two_quote_wrapper{
    position: relative;
    background-color: #EEF4F8;
    margin-top: 40px;
    padding: 30px 110px 30px 45px;
    border-left: 4px solid var(--main-color);
}
.about_two_quote_wrapper h5{
    padding-top: 15px;
    font-weight: 500;
}
.about_two_quote_wrapper h5 span{
    color: var(--paragraph-color);
    font-weight: 400;
    font-size: 14px;
    padding-left: 10px;
}
.about_two_quote_wrapper img{
    position: absolute;
    right: -42px;
    top: 50%;
    transform: translateY(-50%);
}

/* --Service Area-- */
.service_two_left_wrapper h3{
    color: #818090;
    font-weight: 400;
    padding-bottom: 15px;
}
.service_two_left_wrapper p{
    padding-top: 10px;
}
.service_two_left_wrapper a{
    margin-top: 30px;
}
.service_item_right_wrapper .service_two_item:last-child{
    padding-bottom: 0;
}
.service_two_item{
    display: flex;
    padding-bottom: 30px;
}
.service_two_icon{
    width: 34%;
}
.service_two_text p{
    padding-top: 10px;
}
.service_two_text a{
    padding-top: 10px;
    display: block;
    color: var(--black-color);
    font-weight: 500;
}
.service_two_item:hover .service_two_text a{
    color: var(--main-color);
}
/* --Gallery Area-- */
.galley_two_img{
margin-bottom: 30px;
}
.galley_two_img a img{
    width: 100%;
}

/* --Causes Area-- */
.causes_boxed_two .causes_badge {
    position: inherit;
    color: var(--white-color);
    padding: 8px 15px;
    font-size: 14px;
    border-radius: 5px;
}
.causes_boxed_two  .causes_pro_bar {
  margin-top: 20px;
}
.causes_boxed_text_center{
  text-align: center;
}
.causes_boxed_two .causes_boxed_text {
  padding: 30px 13px;
}
.causes_boxed_two .causes_pro_bar {
  background: #EEF4F8;
  box-shadow: 0px 8px 20px rgb(0 0 0 / 8%);
  border-radius: 8px;
}
/* -- -- */
#become_volunteer_area{
background-image: url('../img/home-2/common/become-bg.png');
padding: 205px 0;
background-size: cover;
background-position: center;
}
.become_volunteer_text_wrapper{
  text-align: center;
}
.become_volunteer_text_wrapper h3{
  color: #F5F5F5;
  font-weight: 300;
  padding-bottom: 20px;
}
.become_volunteer_text_wrapper h2{
  color: #fff;
  padding-bottom: 30px;
}
.become_volunteer_text_wrapper a{
  border: 1px solid #fff;
}
/* --Faqs Area-- */
.faqs_area_two_left h3{
  color: var(--paragraph-color);
  font-weight: 400;
}
.faqs_area_two_left h2{
  padding-top: 20px;
}
.faqs_area_two_left p{
  padding-top: 10px;
}
.faqs_area_two_left img{
  padding-top: 30px;
}
#faqs_area_two .accordion-item .accordion-button {
  padding: 5px 15px;
}

#faqs_area_two .accordion-button:not(.collapsed) {
  color: #fff;
  background-color: var(--main-color);
}
#faqs_area_two .accordion-item {
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.125) !important;
  margin-bottom: 30px;
}

/* --Donate Area-- */
#donet_area_two{
  background-image: url('../img/home-2/common/donate-bg.png');
  padding: 120px 0;
}
.donate_two_left_wrapper h3{
  color: #f5f5f5;
  padding-bottom: 15px;
}
.donate_two_left_wrapper h2{
  color: #fff;
}
.donate_two_left_wrapper p{
  padding-top: 14px;
  color: #F5F5f5;
}
.donate_two_right_wrapper{
  background: #FFFFFF;
  padding: 40px 25px;
}
.donate_two_right_wrapper p{
  padding-top: 10px;
}
.donate_form_two form .input-group{
 padding-top: 30px;
}
.donate_form_two form .form-control{
  height: 50px;
}
.donate_form_two form .form-check label {
  display: inline-block;
  margin-right: 20px;
}
.donate_form_two form .input-group-text {
  padding: 10px 19px;
  font-size: 20px;
  color: #fff;
  background-color: var(--main-color);
}
.donate_monthly_wrapper{
  display: flex;
  padding-top: 15px;
}
.donate_amount_btn{
  display: flex;
  justify-content: space-between;
  padding-top: 10px;
}
.donate_amount_btn button{
  background: #FFFFFF;
  border: 1px solid #DDDDDD;
  box-shadow: 4px 6px 16px rgb(0 0 0 / 4%);
  border-radius: 4px;
  width: 85px;
  height: 45px;
  font-size: 18px;
}
.donate_amount_btn button:hover{
  background: var(--main-color);
  color: var(--white-color);
}
.donate_submit_btn{
  padding-top: 30px;
}

/* --Blog Area-- */
.blog_two_calendar_area{
  padding-top: 15px;
}
.blog_two_calendar_area ul li{
  display: inline-flex;
  padding-right: 14px;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
}
.blog_two_calendar_area ul li i{
padding-right: 5px;
}
.blog_two_calendar_area ul li span{
  color: #818090;
  padding-left: 4px;
}
.blog_card_two_text .blog_card_tags {
  background-color: #FFFFFF;
  box-shadow: 4px 6px 16px rgb(0 0 0 / 6%);
  border-radius: 4px;
  display: table-caption;
  margin-top: -45px;
  position: relative;
  padding: 10px 15px;
}

/* =========================
      Home Page Three
=========================*/
/* --banner-- */
#home_three_banner{
  background-image: url('../img/home-3/common/banner-bg.png');
  padding: 175px 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.banner_three_text h4{
  color: #F27234;
  font-size: 18px;
}
.banner_three_text h1{
  font-size: 80px;
  font-weight: 600;
  padding-top: 20px;
  line-height: 90px;
}
.banner_three_text p{
  padding-top: 20px;
  line-height: 30px;
}
.home_three_banner_button{
padding-top: 20px;
display: flex;
}
/* --About area-- */
.about_three_top_boxed{
  position: relative;
  margin-bottom: 30px;

}
.about_three_top_boxed_img img{
  width: 100%;
}
.about_three_top_boxed_text{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 20px;
}
.about_three_top_boxed_text h3{
  font-size: 30px;
  padding-top: 9px;
}
.about_three_top_boxed_text h3 span{
 display: block;
}
.about_three_top_boxed_text h5{
  color: var(--paragraph-color);
  font-weight: 300;
}
.about_three_top_boxed_icon{
  position: absolute;
  box-shadow: 0px 2px 5px 0px #00000047;
  border-radius: 50%;
  right: 20px;
  bottom: -20px;
  transition: var(--transition);
}
.about_three_top_boxed:hover .about_three_top_boxed_icon{
  transform: translateY(-10px);
}
.about_mission_area{
  padding-top: 30px;
  display: flex;
}
.about_tree_mission_icon{
  width: 40%;
}
.about_tree_mission_text{
  padding-left: 10px;
}
.about_tree_mission_text h3{
  color: var(--black-color);
  font-weight: 500;
  padding-bottom: 7px;
}
.about_three_progrebar{
  padding-top: 34px;
}
.about_three_progrebar .class-full-bar-box .h3-title {
  font-size: 15px;
  line-height: 15px;
  color: var(--black-color);
  font-weight: 600;
  padding-bottom: 0px;
}
.about_three_progrebar  .class-full-bar-box {
  position: relative;
  margin-bottom: 35px;
}

/* --Service Area -- */
.service_three_heading{
  padding-bottom: 40px;
}
.service_three_heading h3{
  color: #818090;
  font-weight: 400;
  padding-bottom: 15px;
}
.causes_boxed_text_left{
  text-align: left !important;
}

.causes_boxed_three .case_boxed_img .causes_badge {
  position: absolute;
  color: var(--white-color);
  padding: 8px 15px;
  font-size: 14px;
  border-radius: 5px;
  top: auto;
  bottom: 11px;
}
.causes_boxed_three  .causes_pro_bar {
margin-top: 20px;
}
.causes_boxed_text_center{
text-align: center;
}
.causes_boxed_three .causes_boxed_text {
padding: 30px 13px;
}
.causes_boxed_three .causes_pro_bar {
background: #EEF4F8;
box-shadow: 0px 8px 20px rgb(0 0 0 / 8%);
border-radius: 8px;
}
.causes_boxed_text_left h3 a{
  padding-top: 0;
}

/* --Testimonial Area-- */
.testimonial_three_boxed{
  background: #FFFFFF;
  border: 1px solid #DDDDDD;
  border-radius: 12px;
  padding: 30px 30px;
  position: relative;
}
.test_quate_area{
  position: absolute;
  right: 40px;
}
.testimonial_three_boxed p{
  padding-top: 20px;
}
.test_three_bottom{
  display: flex;
  justify-content: space-between;
  padding-top: 15px;
}
.test_three_bottom_left h6{
  padding-top: 5px;
}
.test_three_bottom_right h6{
  padding-top: 5px;
}
.test_three_icon i{
color: var(--main-color);
}
/* --Middel Area-- */
#middel_area_wrapper{
  background-image: url('../img/home-3/common/middel_banner.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.middel_area_Wrapper_box{
  display: flex;
}
.middel_area_box_icon{
  width: 35%;
  margin-right: 20px;
}
.middel_area_box_text h3{
  color:#F5F5F5;
}
.middel_area_box_text p{
  color: #F5F5F5;
  font-weight: 300;
  padding-top: 15px;
  padding-bottom: 13px;
}
.middel_area_box_text a{
  color:#F5F5F5;
}

.middal_area_center_wrapper{
  background: #FFFFFF;
  box-shadow: 6px 10px 16px rgb(0 0 0 / 8%);
  border-radius: 8px;
  padding: 30px 35px;
  margin-top: 61px;
}
.middal_area_center_left h3{
  padding-top: 12px;
  font-size: 26px;
  line-height: 39px;
}
.middal_area_center_left p{
  padding-top: 14px;
}

.middal_area_center_right .donate_two_right_wrapper{
  padding: 0;
  background: transparent;
}
.middal_area_center_right .donate_submit_btn{
padding-top: 5px;
}
.middal_area_center_right .donate_form_two form .input-group {
  padding-top: 20px;
}
/* --Team Area-- */
.team_area_three{
  background: #FFFFFF;
  box-shadow: 8px 10px 24px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
}
.team_area_three_img{

}
.team_area_three_img img{
  width: 100%;
}
.team_area_three_content{
  padding: 15px 15px;
  text-align: center;
}
.team_area_three_content h3{

}
.team_area_three_content p{
  padding-top: 3px;
}
.team_area_three_img{
  position: relative;
  overflow: hidden;
}
.team_area_three:hover .team_area_three_img ul {
  opacity: 1;
  transform: translate(-50%, -30px);
}
.team_area_three_img ul{
  position: absolute;
  bottom: 25px;
  left: 50%;
  transition: var(--transition);
    opacity: 0;
    transform: translate(-50%, -50%);
}
.team_area_three_img ul li{
  display: inline-flex;
  background: #fff;
  width: 30px;
  text-align: center;
  justify-content: center;
  height: 30px;
  line-height: 30px;
  border-radius: 50%;
  box-shadow: 4px 6px 20px rgb(0 0 0 / 8%);
  transition: var(--transition);
  color: var(--main-color);
  margin-left: 8px;
}
.team_area_three_img ul li:last-child{
  margin-left:0px;
}
.team_area_three_img ul li:hover{
  background-color: var(--main-color);
}
.team_area_three_img ul li:hover a{
  color: var(--white-color);
}

/* --Blog Area-- */
.blog_three_wrapper{
position: relative;
margin-bottom: 30px;
}
.blog_img_three img {
  width: 100%;
}
.blog_text_three{
  position: absolute;
  bottom: 0;
  padding: 20px 20px;
}
.blog_three_date ul li{
  display: inline-block;
  padding-right: 19px;
  color: var(--white-color);
  font-size: 14px;
}
.blog_three_text{
  padding-top: 12px;
}
.blog_three_text h3{
  line-height: 28px;
  font-size: 20px;
}
.blog_three_text h3 a{
  color: var(--white-color);
}
.blog_three_text h3 a:hover{
  color: var(--main-color);
}
.blog_three_text p{ 
  padding-top: 20px;
}
/* --Instagram Area-- */
.instagrma_item{
  position: relative;
}
.instagrma_item a{
  display: block;
  position: relative;
  z-index: 1;
}

.instagrma_item a i {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: scale(1.2) translate(-50%, -50%);
  z-index: 2;
  font-size: 40px;
  color: #262626;
  line-height: 1;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  opacity: 0;
}
.instagrma_item a:hover i {
  opacity: 1;
  transform: scale(1) translate(-50%, -50%);
}
.instagrma_item a:hover::before {
  opacity: .7;
}

.instagrma_item>a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #f3f0ea;
  opacity: 0;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.bg_shadow{
  background-color: #F4F7FC;
}
#trending_causes_two_main .case_boxed_wrapper{
  margin-bottom: 30px;
}
.cause_load_more{
  text-align: center;
  padding-top: 30px;
}
/* =========================
        About Page
=========================*/
/* --Common Banner-- */
#common_banner_area {
  background-image: url("../img/common/common-banner.png");
  background-size: cover;
  background-position: center;
  padding: 145px 0;
}

.commn_banner_page h2 {
  color: #fff;
  font-size: 36px;
}

.breadcrumb_wrapper {
  display: flex;
  padding-top: 10px;
}

.breadcrumb_item {
  padding: 0 10px 0 0;
}

.breadcrumb_item a {
  color: var(--white-color);
}

.breadcrumb_item.active {
  color: #ffffff8c;
}

/* ---volunteer--- */
#volunteer_area_main .volunteer_wrapper {
  margin-bottom: 30px;
}

.volunteer_wrapper {
  z-index: 9;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 8px 30px rgba(26, 39, 68, 0.08);
  transition: var(--transition);
}

.volunteer_wrapper:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(26, 39, 68, 0.12);
}

.volunteer_img img {
  width: 100%;
}

.volunteer_img {
  position: relative;
}

.volunteer_icon {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translate(-50%, 20px);
  transition: var(--transition);
  opacity: 0;
}

.volunteer_wrapper:hover .volunteer_icon {
  opacity: 1;
  transform: translate(-50%, 0px);
}

.volunteer_icon ul {
  display: flex;
  justify-content: center;
}

.volunteer_icon ul li {
  padding-left: 20px;
}

.volunteer_icon ul li:first-child {
  padding-left: 0px;
}

.volunteer_icon ul li a:hover {
  background: var(--main-color);
}

.volunteer_icon ul li a {
  height: 30px;
  width: 30px;
  background: var(--black-color);
  text-align: center;
  line-height: 30px;
  border-radius: 50%;
  color: #fff;
  font-size: 14px;
  display: block;
  transition: var(--transition);
}

.volunteer_text {
  padding: 20px 20px;
  text-align: center;
}

.volunteer_text h3 a {
  color: var(--black-color);
}

.volunteer_text h3 a:hover {
  color: var(--main-color);
}

.volunteer_text p {
  padding-top: 6px;
}

#partner_area-2 .owl-carousel .owl-item img {
  width: auto !important;
}

/* --middel Banner-- */
#newletter_banner {
  background: linear-gradient(135deg, #1a2744 0%, #2c4a7c 60%, #e8652d 100%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: 60px 0;
  position: relative;
  overflow: hidden;
}
#newletter_banner::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url("../img/common/midel_banner.png") center/cover no-repeat;
  opacity: 0.1;
  z-index: 0;
}
#newletter_banner .container {
  position: relative;
  z-index: 1;
}

.newletter_text h4 {
  color: rgba(255,255,255,0.7);
  font-size: 16px;
  position: relative;
  left: 0;
  top: 0;
}

.newletter_text h4 img {
  width: 13%;
}

.newletter_text h2 {
  font-size: 30px;
  line-height: 40px;
  color: #ffffff;
}

.newletter_button {
  text-align: right;
}

.news_btn {
  padding: 13px 60px;
  font-size: 18px;
  border-radius: 50px;
}

/* --Testimonial Area-- */
.testimonial_wrapper_boxed {
  background: #ffffff;
  box-shadow: -5px -6px 24px rgb(0 0 0 / 2%), 8px 0px 24px rgb(0 0 0 / 9%);
  border-radius: 8px;
  padding: 10px 15px 25px 15px;
  position: relative;
  text-align: center;
  margin: 30px 10px;
}

.testimonial_wrapper_boxed img {
  width: 110px !important;
  margin: 0 auto;
}

.testimonial_wrapper_boxed p {
  padding-top: 25px;
  line-height: 28px;
  border-bottom: 1px solid #e4e4e4;
  padding-bottom: 20px;
}

.test_author {
  padding-top: 20px;
}

.test_author img {
  position: absolute;
  top: 77px;
  left: 13px;
  width: auto !important;
}

.test_author h5 {
  padding-top: 5px;
}

.slider_dots.owl-theme .owl-nav.disabled + .owl-dots {
  margin-top: 0px;
}

.slider_dots.owl-theme .owl-dots .owl-dot span {
  width: 15px;
  height: 15px;
  margin: 5px 5px;
  background: #e03c3366;
  display: block;
  backface-visibility: visible;
  transition: opacity 0.2s ease;
  border-radius: 30px;
}

.slider_dots.owl-theme .owl-dots .owl-dot.active span,
.slider_dots.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--main-color);
}

#trending_causes_main .case_boxed_wrapper {
  margin-bottom: 30px;
}

/* =========================
    Causes Details Page
=========================*/
.details_big_img {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.details_big_img img {
  width: 100%;
  transition: var(--transition);
}

.details_big_img img:hover {
  transform: scale(1.3);
}

.causes_pro_bar_flex {
  background: #eef4f8;
  box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.08);
  padding: 40px 20px;
  border-radius: 10px;
  margin-top: 30px;
  z-index: 999;
  position: relative;
  display: flex;
  justify-content: space-between;
}

.causes_pro_bar_flex .class-full-bar-box {
  position: relative;
  width: 70%;
}

.details_text_wrapper {
  padding-top: 30px;
}

.details_text_wrapper p {
  padding-top: 15px;
}

.details_text_wrapper h3 {
  padding-top: 15px;
}

.details_small_img {
  padding-top: 30px;
}

.details_small_img img {
  width: 100%;
}

.details_text_wrapper ul {
  padding-top: 10px;
}

.details_text_wrapper ul li {
  padding-top: 15px;
  color: var(--paragraph-color);
}

.details_text_wrapper ul li i {
  font-size: 9px;
  color: var(--main-color);
  padding-right: 10px;
}

.download_pdf_area {
  background: #eef4f8;
  padding: 25px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 30px;
  border-radius: 8px;
}

.pdf_download_left {
  display: flex;
  align-items: center;
}

.pdf_download_left h4 {
  padding-left: 20px;
}

.comment_area_details {
  padding-top: 80px;
}

.post_comment_item {
  display: flex;
  padding-top: 30px;
  border-bottom: 1px solid #e3e3e3;
  padding-bottom: 30px;
}

.post_comment_item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.post_comment_img {
  width: 15%;
}

.post_comment_text {
  padding-left: 20px;
}

.post_names_replay {
  display: flex;
  justify-content: space-between;
}

.post_names_replay h5 {
  font-weight: 500;
}

.post_comment_text p {
  padding-top: 10px;
}

.post_names_replay a i {
  padding-right: 5px;
}

.comment_form_area {
  padding-top: 60px;
}

#comment_form .form-control {
  margin-bottom: 30px;
}

textarea.form-control {
  height: auto;
}

.comment_form_area h3 {
  padding-bottom: 30px;
}

/* --sidebar-- */
.project_organizer_wrapper {
  display: flex;
}

.sidebar_boxed {
  background: #ffffff;
  box-shadow: -4px -4px 20px rgba(0, 0, 0, 0.08),
    8px 10px 24px rgba(0, 0, 0, 0.08);
  border-radius: 6px;
  padding: 30px 30px;
  margin-bottom: 30px;
}

.project_organizer_text {
  padding-left: 25px;
}

.project_organizer_text h5 {
  line-height: 13px;
  padding-bottom: 15px;
  font-size: 16px;
  font-weight: 500;
}

.project_organizer_text p {
  padding-top: 5px;
}

.project_organizer_text ul li {
  padding-top: 10px;
  color: var(--paragraph-color);
  font-weight: 500;
}

.project_organizer_text ul li img {
  padding-right: 5px;
  width: 36px;
}

.project_organizer_text ul li span {
  color: var(--black-color);
}

.recent_donet_item {
  display: flex;
  padding-top: 25px;
}

.recent_donet_img {
  width: 25%;
}

.recent_donet_text {
  width: 100%;
  padding-left: 15px;
}

.sidebar_inner_heading {
  display: flex;
  justify-content: space-between;
}

.sidebar_inner_heading h4 {
  font-size: 18px;
  font-weight: 600;
}

.sidebar_inner_heading h4 a {
  color: var(--black-color);
}

.sidebar_inner_heading h4 a:hover {
  color: var(--main-color);
}

.sidebar_inner_heading h5 {
  font-size: 18px;
  color: var(--main-color);
  font-weight: 600;
}

.recent_donet_text p {
  padding-top: 5px;
}

.recent_donet_text h6 {
  padding-top: 5px;
  font-weight: 500;
}

.sidebar_heading_main {
  border-bottom: 1px solid #ededed;
  padding-bottom: 7px;
}

.recent_causes_wrapper .sidebar_inner_heading h4 a {
  line-height: 26px;
}

.recent_causes_wrapper .recent_donet_text h6 {
  padding-top: 10px;
  font-weight: 500;
}

.social_icon_sidebar ul li {
  display: inline-flex;
  padding-top: 20px;
  padding-right: 15px;
  transition: var(--transition);
}

.social_icon_sidebar ul li:hover {
  transform: translateY(-5px);
}

.social_icon_sidebar ul li a img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.tags_noted {
  font-size: 18px;
  font-weight: 600;
  padding-bottom: 10px;
  display: block;
}

.event_details_list ul li {
  padding-top: 20px;
}

.event_details_list ul li {
  padding-top: 20px;
  color: var(--paragraph-color);
  font-weight: 500;
}

.event_details_list ul li img {
  padding-right: 5px;
  width: 36px;
}

.event_details_list ul li span {
  color: var(--black-color);
}

.register_now_details {
  padding-top: 40px;
}

/* ----------------------------
        News Page
---------------------------------*/
.blog_two_wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

.mt-30 {
  margin-top: 30px;
}

.mb-30 {
  margin-bottom: 30px;
}

.blog_two_wrapper img {
  width: 100%;
  transition: var(--transition);
}

.blog_two_wrapper:hover img {
  transform: scale(1.2);
}

.news_two_text {
  position: absolute;
  bottom: 0;
  padding: 30px 20px;
}

.news_two_text h3 a {
  color: var(--white-color);
  padding-top: 11px;
  display: block;
}

.news_two_text h3 a:hover {
  color: var(--main-color);
}

.popular_tags ul {
  padding-top: 10px;
}

.popular_tags ul li {
  display: inline-flex;
  background: #dddddd70;
  padding: 6px 10px;
  margin-right: 10px;
  margin-top: 15px;
}

.popular_tags li a {
  color: var(--black-color);
}

.error_area_content a {
  margin-top: 40px;
}

/* ----------------------------
        login Page
---------------------------------*/
.author_form_area {
  background: #ffffff;
  box-shadow: -4px -6px 24px rgba(0, 0, 0, 0.08),
    8px 12px 24px rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  padding: 40px 40px;
}

#author_form .form-control {
  margin-top: 15px;
}

.author_submit_form {
  padding-top: 40px;
  text-align: center;
}

.author_submit_form p {
  padding-top: 20px;
}

/* ----------------------------
        contact Page
---------------------------------*/
.contact_left_item {
  background: #ffffff;
  box-shadow: 8px 10px 24px rgb(0 0 0 / 10%);
  border-radius: 8px;
  display: flex;
  padding: 30px 40px;
  margin-bottom: 30px;
}

.contact_left_text {
  padding-left: 20px;
}

.contact_left_text h3 {
  padding-bottom: 10px;
}

.contact_left_text p {
  font-size: 18px;
  line-height: 28px;
}

.contact_left_text a {
  color: var(--paragraph-color);
  display: block;
  font-size: 18px;
  padding-top: 5px;
}

.contact_left_text a:hover {
  color: var(--main-color);
}

.contact_form_Wrapper {
  background: #ffffff;
  box-shadow: 8px 10px 24px rgb(0 0 0 / 10%);
  border-radius: 8px;
  padding: 20px 40px;
}

.contact_form_Wrapper h3 {
  padding-bottom: 20px;
}

#contact_form .form-group {
  padding-bottom: 15px;
}

.contact_map_area {
  margin-top: -115px;
}

/* ----------------------------
        Faqs Page
---------------------------------*/
#faqs_arae_main .about_top_boxed {
  margin-top: 40px;
}

#faqs_arae_main .accordion-item .accordion-button {
  padding: 5px 15px;
}

#faqs_arae_main .accordion-button:not(.collapsed) {
  color: #fff;
  background-color: var(--main-color);
}

.accordion-button:focus {
  z-index: 3;
  border-color: none;
  outline: 0;
  box-shadow: none;
}

/* ----------------------------
    Make a donetion Page
---------------------------------*/
.sidebar_first .case_boxed_wrapper {
  margin-bottom: 30px;
}

.donet_amount_area {
  background: #ffffff;
  box-shadow: -4px -4px 20px rgb(0 0 0 / 8%), 8px 10px 24px rgb(0 0 0 / 8%);
  border-radius: 6px;
  padding: 55px 25px;
  display: flex;
  justify-content: space-between;
}

.input_donet_amount {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.input_donet_amount span {
  font-size: 30px;
}

.input_donet_amount input {
  border: none;
  border-bottom: 1px solid var(--main-color);
  font-size: 24px;
  width: 55%;
}

.input_donet_amount input:focus {
  border-bottom: 1px solid var(--main-color);
  outline: none;
}

.donet_amount_form_area {
  background: #ffffff;
  box-shadow: -4px -4px 20px rgba(0, 0, 0, 0.08),
    8px 10px 24px rgba(0, 0, 0, 0.08);
  border-radius: 6px;
  padding: 25px 25px;
}

.donet_amount_form_area .form-group {
  margin-top: 30px;
}

.doner_content_pbottom {
  margin-bottom: 30px;
}

.payment_option_area {
  padding-top: 30px;
}

.payment_option_area ul {
  display: flex;
}

.payment_option_area ul li {
  padding-right: 25px;
}

.payment_option_area ul li img {
  cursor: pointer;
}

.payment_amount_submit {
  padding-top: 30px;
}

/* ----------------------------
    Gallery Page
---------------------------------*/
.gallery_item {
  position: relative;
  margin-bottom: 30px;
}

.gallery_item img {
  width: 100%;
}

.gallery_overlay {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: #ff00003b;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}

.gallery_item:hover .gallery_overlay {
  opacity: 1;
  visibility: visible;
}

.gallery_overlay a img {
  width: auto;
}

/* ----------------------------
    Terms of service Page
---------------------------------*/

.terms_item:first-child {
  padding-top: 0px;
}

.terms_item {
  padding-top: 30px;
}

.terms_item h4 {
  font-weight: 700;
}

.terms_item p {
  padding-top: 15px;
}

/* -------------------------------
        Preloader
---------------------------------*/

.preloader {
  position: fixed;
  z-index: 999999;
  background-color: var(--white-color);
  width: 100%;
  height: 100%;
  text-align: center;
  left: 0;
  right: 0;
}

.preloader .lds-spinner {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.preloader .lds-spinner div {
  -webkit-transform-origin: 40px 40px;
  transform-origin: 40px 40px;
  -webkit-animation: lds-spinner 1.2s linear infinite;
  animation: lds-spinner 1.2s linear infinite;
}

.preloader .lds-spinner div::after {
  content: " ";
  display: block;
  position: absolute;
  top: 5px;
  left: 35px;
  width: 5px;
  height: 20px;
  border-radius: 20%;
  background: var(--main-color);
}

.preloader .lds-spinner div:nth-child(1) {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.preloader .lds-spinner div:nth-child(2) {
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}

.preloader .lds-spinner div:nth-child(3) {
  -webkit-transform: rotate(60deg);
  transform: rotate(60deg);
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.preloader .lds-spinner div:nth-child(4) {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

.preloader .lds-spinner div:nth-child(5) {
  -webkit-transform: rotate(120deg);
  transform: rotate(120deg);
  -webkit-animation-delay: -0.7s;
  animation-delay: -0.7s;
}

.preloader .lds-spinner div:nth-child(6) {
  -webkit-transform: rotate(150deg);
  transform: rotate(150deg);
  -webkit-animation-delay: -0.6s;
  animation-delay: -0.6s;
}

.preloader .lds-spinner div:nth-child(7) {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}

.preloader .lds-spinner div:nth-child(8) {
  -webkit-transform: rotate(210deg);
  transform: rotate(210deg);
  -webkit-animation-delay: -0.4s;
  animation-delay: -0.4s;
}

.preloader .lds-spinner div:nth-child(9) {
  -webkit-transform: rotate(240deg);
  transform: rotate(240deg);
  -webkit-animation-delay: -0.3s;
  animation-delay: -0.3s;
}

.preloader .lds-spinner div:nth-child(10) {
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
  -webkit-animation-delay: -0.2s;
  animation-delay: -0.2s;
}

.preloader .lds-spinner div:nth-child(11) {
  -webkit-transform: rotate(300deg);
  transform: rotate(300deg);
  -webkit-animation-delay: -0.1s;
  animation-delay: -0.1s;
}

.preloader .lds-spinner div:nth-child(12) {
  -webkit-transform: rotate(330deg);
  transform: rotate(330deg);
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

@-webkit-keyframes lds-spinner {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes lds-spinner {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.d-table {
  width: 100%;
  height: 100%;
}

.d-table-cell {
  vertical-align: middle;
}

/* ----------------------------
     Top To Bottom 
---------------------------------*/
.go-top {
  position: fixed;
  cursor: pointer;
  top: 0;
  right: 15px;
  color: #fff;
  background-color: var(--main-color);
  z-index: 999;
  width: 42px;
  text-align: center;
  height: 42px;
  line-height: 42px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.9s;
  transition: 0.9s;
  border-radius: 50%;
  box-shadow: 0 4px 15px rgba(232, 101, 45, 0.3);
}

.go-top.active {
  top: 98%;
  -webkit-transform: translateY(-98%);
  transform: translateY(-98%);
  opacity: 1;
  visibility: visible;
}

.go-top i {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}

.go-top i:last-child {
  opacity: 0;
  visibility: hidden;
  top: 60%;
}

.go-top::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background: #1a2744;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.6s;
  transition: 0.6s;
  border-radius: 50%;
}

.go-top:hover,
.go-top:focus {
  color: #fff;
}

.go-top:hover::before,
.go-top:focus::before {
  opacity: 1;
  visibility: visible;
}

.go-top:hover i:first-child,
.go-top:focus i:first-child {
  opacity: 0;
  top: 0;
  visibility: hidden;
}

.go-top:hover i:last-child,
.go-top:focus i:last-child {
  opacity: 1;
  visibility: visible;
  top: 50%;
}

/* =============================================
   PROGRAMS PAGE (causes.html)
   ============================================= */

/* Intro Section */
#programs_intro {
  padding: 60px 0 30px;
}
.programs_intro h3 {
  font-weight: 700;
  margin-bottom: 20px;
  font-size: 32px;
}
.programs_intro p {
  font-size: 16px;
  color: #5a6474;
  line-height: 1.7;
  margin-bottom: 12px;
}

/* Program Detail Rows */
#all_programs_area {
  padding: 20px 0 60px;
}
.program_detail_row {
  padding: 40px 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.program_detail_row:last-child {
  border-bottom: none;
}
.program_detail_img {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 30px rgba(0,0,0,0.08);
}
.program_detail_img img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
}
.program_number {
  position: absolute;
  top: 16px;
  left: 16px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--main-color), #d4551f);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(232, 101, 45, 0.35);
}
.program_detail_content {
  padding: 10px 20px;
}
.program_detail_content h3 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 14px;
  line-height: 1.4;
}
.program_detail_content p {
  font-size: 15px;
  color: #5a6474;
  line-height: 1.7;
  margin-bottom: 12px;
}
.program_tag {
  display: inline-block;
  padding: 4px 14px;
  border-radius: 20px;
  background: rgba(232, 101, 45, 0.08);
  color: var(--main-color);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}
.program_highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
  margin: 16px 0;
}
.program_highlight_item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #3a4555;
}
.program_highlight_item i {
  color: var(--secondary-color);
  font-size: 14px;
  flex-shrink: 0;
}
.program_tagline {
  font-weight: 600;
  color: var(--black-color) !important;
  font-style: italic;
  border-left: 3px solid var(--accent-color);
  padding-left: 14px;
  margin-top: 16px;
}

/* Programs CTA */
#programs_cta {
  padding: 60px 0 80px;
}
.programs_cta_wrapper {
  background: linear-gradient(135deg, #1a2744 0%, #2c4a7c 100%);
  border-radius: 24px;
  padding: 60px 40px;
  position: relative;
  overflow: hidden;
}
.programs_cta_wrapper::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  background: rgba(232, 101, 45, 0.08);
  pointer-events: none;
}
.programs_cta_content h3 {
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 16px;
}
.programs_cta_content p {
  color: rgba(255,255,255,0.8);
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 10px;
}
.programs_cta_buttons {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 28px;
}
.programs_cta_buttons .btn_outline {
  background: transparent;
  border: 2px solid rgba(255,255,255,0.4);
  color: #fff;
  border-radius: 50px;
  padding: 10px 28px;
  font-weight: 600;
  transition: 0.3s;
}
.programs_cta_buttons .btn_outline:hover {
  background: rgba(255,255,255,0.1);
  border-color: #fff;
  color: #fff;
}