/* ---------- montserrat font  start -------------- */

@font-face {
  font-family: "Montserrat";
  src: url("../fonts/Montserrat/static/Montserrat-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

/* Mont Heavy */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/Montserrat/static/Montserrat-ExtraBold.ttf")
    format("truetype");
  font-weight: 800;
  /* Extra-bold */
  font-style: normal;
}

/* Mont Bold */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-SemiBold.ttf")
    format("truetype");
  font-weight: 600;
  /* Semi-bold weight */
  font-style: normal;
}

/* Mont Book */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-Medium.ttf")
    format("truetype");
  font-weight: 500;
  font-style: normal;
}

/* Mont Regular */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-Regular.ttf")
    format("truetype");
  font-weight: 400;
  /* Regular weight */
  font-style: normal;
}

/* Mont Light */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-Light.ttf") format("truetype");
  font-weight: 300;
  /* Light weight */
  font-style: normal;
}

/* Mont ExtraLight */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-ExtraLight.ttf")
    format("truetype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat/static/Montserrat-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

/* ---------- montserrat font  end -------------- */

/* ---------- jost font start -------------- */

@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

/* Mont Heavy */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  /* Extra-bold */
  font-style: normal;
}

/* Mont Bold */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-SemiBold.ttf") format("truetype");
  font-weight: 600;
  /* Semi-bold weight */
  font-style: normal;
}

/* Mont Book */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

/* Mont Regular */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-Regular.ttf") format("truetype");
  font-weight: 400;
  /* Regular weight */
  font-style: normal;
}

/* Mont Light */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-Light.ttf") format("truetype");
  font-weight: 300;
  /* Light weight */
  font-style: normal;
}

/* Mont ExtraLight */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/static/Jost-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

/* ---------- jost font end -------------- */
:root {
  --primary-font: Montserrat;
  --secondary-font: jost;
  --primary-color: #4e6085;
  --secondary-color: #daecff;
  --white-color: #ffffff;
  --black-color: #000000;
}

/* -------------------- header nav start ------------------ */

.nav-bar-custom {
  /* border: 1px solid black; */
  display: flex;
  justify-content: space-between;
  width: 96%;
  margin-left: 2%;
  margin-right: 2%;
  align-items: center;
  padding: 1rem 2rem 1rem 3rem;
  border-radius: 3rem;
  position: fixed;
  z-index: 999;
  background-color: var(--white-color);
  color: var(--black-color);
  margin-top: 1rem;
}
.nav-bar-custom .navbar-brand {
  font: 400 1.5rem var(--secondary-font);
}
.nav-bar-custom .nav-link {
  margin: 0 1rem;
  color: var(--black-color);
  text-decoration: none;
  font: 400 1.2rem var(--secondary-font);
}
.nav-bar-custom .donate-now-btn {
  padding: 0.5rem 1rem;
  font: 400 1.2rem var(--secondary-font);
  border-radius: 2rem;
  background-color: var(--secondary-font);
  margin-left: 1rem;
}

.gaushala-text-custom-box-1 {
  position: relative;
  height: 90vh;
  background-image: url("../images/index-bg-gaushala-slider-img1.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  padding-left: 7rem;
}

/* Left to Right Shadow Effect */
.gaushala-text-custom-box-1::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 95%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.8),
    rgba(0, 0, 0, 0.3),
    transparent
  );
  z-index: 1;
}

/* Ensure Content Appears Above the Shadow */
.gaushala-text-custom-box-1 * {
  position: relative;
  z-index: 2;
}

.gaushala-text-box h1 {
  color: var(--white-color);
  font: 700 2.8rem var(--secondary-font);
  line-height: 3.25rem;
}
.gaushala-text-box p {
  color: var(--white-color);
  font: 400 1rem var(--primary-font);
}
.gaushala-slider-box .owl-theme .owl-nav.disabled + .owl-dots {
  margin-top: 0px;
  position: absolute;
  bottom: 4rem;
  left: 5rem;

  /* z-index: 3; */
}

.gaushala-slider-box .owl-dot button {
  /* padding: 1rem; */
  font: 300 0.8rem var(--primary-font);
  /* padding-bottom: .3rem; */
  background-color: transparent;
  color: var(--white-color);
  border: none;
  border-bottom: 1px solid var(--white-color);
  margin: 0.3rem;
}
.gaushala-slider-box .owl-theme .owl-dots .owl-dot span {
  background-color: transparent;
}
.gaushala-slider-box .owl-dot button p {
  margin-bottom: 0.5rem;
  font: 400 0.9rem var(--primary-font);
  font-size: 0.9rem;
}

/* Hide the button and span inside inactive dots */
.gaushala-main-slider .owl-dot button {
  background: transparent;
  border: none;
  font-size: 0; /* Hide number */
  overflow: hidden; /* Prevents number from appearing */
  border-bottom: 1px solid var(--white-color);
  margin-bottom: 0;
  padding-bottom: 0;
}
.gaushala-main-slider .owl-dot button span {
  visibility: hidden;
}

/* Active dot styling */
.gaushala-main-slider .owl-dot.active {
  /* width: auto;
  height: auto; */
  background: none; /* Removes dot styling */
  text-align: center;
}

/* Show the number inside active dot */
.gaushala-main-slider .owl-dot.active button span {
  font-size: 0.775rem; /* Show number */
  color: var(--white-color);
  /* background-color: green; */
  visibility: visible;
  padding-bottom: 1.4rem;
}
.gaushala-main-slider.owl-theme .owl-dots .owl-dot span {
  margin: 0;
}

.donate-now {
  position: fixed;
  bottom: 8rem;
  right: 3rem;
  z-index: 9;
}

.form-slider-btn button {
  border: 1px solid var(--white-color);
  background-color: var(--white-color);
  border-radius: 50%;
  color: var(--black-color);
  font: 700 0.925rem var(--primary-font);
  line-height: 1rem;
  height: 5rem;
  width: 5rem;
}

/* -------------------- header nav end ------------------ */

/* ---------------------- in nature scrool bar start ----------------------- */
.in-nature-custom {
  position: relative;
}
.scroll-box {
  position: absolute;
  bottom: 2rem;
  left: 46%;
  z-index: 1002;
}
.scroll-link-box {
  width: fit-content;
  margin: auto;
  cursor: pointer;
}
.scroll-icon {
  height: 50px;
  width: 26px;
  border: 1px solid white;
  margin: auto;
  border-radius: 1rem;
  margin-bottom: 0.5rem;
  text-align: center;
}

.scroll-icon i {
  color: white;
}
.scroll-box a {
  font: 400 1rem var(--primary-font);
  color: white;
  text-decoration: none;
}

/* ---------------------- in nature scrool bar end ----------------------- */

/* ---------- about us start ------------ */

.about-us-custom {
  background-color: #daecff;
}
.about-us-custom .container-fluid {
  display: flex;
  justify-content: center;
  width: 80%;
  text-align: center;
  padding: 7rem 2rem;
}
.about-us-box h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  padding-bottom: 1rem;
}
.about-us-box p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}
.about-us-box button {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  background-color: transparent;
  font: 600 1rem var(--secondary-font);
  padding: 0.8rem 1.5rem;
  border-radius: 2rem;
}

/* ---------- about us end ------------ */

/* ---------- what we do start ----------- */

.what-we-do-custom .what-box {
  display: flex;
  justify-content: center;
  text-align: center;
  padding: 5rem 2rem 2rem 2rem;
}
.what-we-do-box h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  padding-bottom: 1rem;
}
.what-we-do-box p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}
.what-we-slider-box {
  padding: 1rem 5rem 6rem 5rem;
}
.what-we-slider-box img {
  border-radius: 2rem;
}
.what-we-slider-box p {
  font: 450 1.3rem var(--secondary-font);
  text-align: center;
  margin-top: 1rem;
}
.what-we-slider-box .owl-nav {
  position: absolute;
  top: 35%;
  left: 0;
  display: flex;
  justify-content: space-between !important;
  width: 92.5%;
  margin-left: 3.7%;
}
.what-we-slider-box .owl-nav .owl-prev:hover,
.what-we-slider-box .owl-nav .owl-next:hover {
  background: transparent;
}

/* ---------- what we do end ----------- */

/* ---------------- adopt cow start ----------------- */
.adopt-cow-support h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  /* padding-bottom: 1rem; */
}
.adopt-cow-support p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}
.adopt-cow-support button {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  background-color: transparent;
  font: 600 1rem var(--secondary-font);
  padding: 0.5rem 1rem;
  border-radius: 2rem;
}
.cow-name-content h1 {
  font: 500 1.3rem var(--secondary-font);
  color: var(--white-color);
  /* padding-bottom: 1rem; */
}
.cow-name-content p {
  font: 300 1rem var(--primary-font);
  letter-spacing: 0.03rem;
  color: var(--white-color);
}
.cow-name-slider .cow-name-content-box img {
  width: 80%;
  border-radius: 2rem;
}
.cow-name-content-box {
  display: flex;
  justify-content: center;
  position: relative;
}
.cow-name-content-box::before {
  content: "";
  background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  width: 80%;
  height: 55%;
  bottom: 0;
  position: absolute;
  border-radius: 1.5rem;
}
.cow-name-content {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0 2rem;
  width: 80%;
  position: absolute;
  bottom: 5%;
}

.adopt-cow-custom .col-md-6 {
  display: flex;
  align-items: center;
}
.adopt-cow-custom {
  background-color: #daecff;
  padding: 5rem 0;
}
.adopt-cow-support {
  padding: 0 0rem 0 5rem;
}
.cow-name-slider-box {
  position: relative;
}
.cow-name-slider .owl-nav {
  position: absolute;
  top: 45%;
  left: 11%;
  display: flex !important;
  justify-content: space-between !important;
  width: 78%;
}
.cow-name-slider .owl-nav .owl-prev:hover,
.cow-name-slider .owl-nav .owl-next:hover {
  background: transparent;
}

/* ---------------- adopt cow end ----------------- */

/* ------------------------ years-of-serving start ---------------- */

/* .cow-years-box h1 {
  font: 800 6rem var(--secondary-font);
  color: var(--white-color);
  margin-bottom: 0;
}

.cow-years-box p {
  font: 600 3rem var(--secondary-font);
  color: var(--white-color);
  text-align: center;
  margin-left: 3rem;

} */

/* Section Styling */
.years-of-serving-custom {
  position: relative;
  background-image: url("../images/index-bg-img-years-of-serving.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  padding: 8rem 5rem;
  overflow: hidden;
}

/* Shadow overlay */
.years-of-serving-custom::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6); /* Dark overlay */
  z-index: 1;
}

/* Ensure content is above the shadow */
.years-main-box {
  display: flex;
  justify-content: space-around;
  position: relative;
  z-index: 2;
  padding: 0 17%;
}

/* Number Styling */
.cow-years-box h1 {
  font: 800 6rem var(--secondary-font);
  color: var(--white-color);
  text-align: center;
  position: relative;
}

/* Underline Effect (Under Numbers) */
.counter-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.underline {
  width: 35%;
  height: 6px;
  border-radius: 1rem;
  background-color: var(--white-color);
  margin-top: -1.5rem; /* Adjust for better positioning */
}

/* Text Styling */
.cow-years-box p {
  font: 600 2.5rem var(--secondary-font);
  color: var(--white-color);
  text-align: center;
}
.cows-first {
  margin-left: 4rem;
}
.years-of {
  margin-left: 10rem;
}
.cows-underline {
  margin-left: 10rem;
}

/* ------------------------ years-of-serving end ---------------- */

/* -----------------------  donate us start ------------------ */

.donate-us-custom .col-md-6 {
  display: flex;
  align-items: center;
  justify-content: end;
}
.donate-us-custom {
  padding: 5rem 2rem 5rem 0rem;
}

.donate-us-yours h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  /* padding-bottom: 1rem; */
}
.donate-us-yours p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}
.donate-us-yours button {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  background-color: transparent;
  font: 600 1rem var(--secondary-font);
  padding: 0.5rem 1.5rem;
  border-radius: 2rem;
}
.donate-side-img img {
  width: 90%;
  border-radius: 2rem;
}
.donate-side-img {
  display: flex;
  justify-content: center;
  position: relative;
}

/* -----------------------  donate us end ------------------ */

/* ------------------------ our team start ---------------------- */
.our-team-head h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  text-align: center;
  /* padding-bottom: 1rem; */
}
.our-team-head p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
  text-align: center;
}
.our-team-custom {
  background-color: #daecff;
  padding: 5rem 5rem 6rem 5rem;
}
.our-team-slider-img img {
  border-radius: 2rem;
}
.our-team-slider {
  padding: 2rem 0;
}
.our-team-slider-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem 0 0 0;
}

.our-team-slider-content h5 {
  font: 400 1.5rem var(--secondary-font);
  color: var(--black-color);
  text-align: center;
  margin-bottom: 0;
  /* padding-bottom: 1rem; */
}
.our-team-slider-content p {
  font: 300 1rem var(--primary-font);
  color: var(--black-color);
  line-height: 1.7rem;
  /* letter-spacing: 0.03rem; */
  text-align: center;
}

.our-team-slider-box .owl-nav {
  position: absolute;
  top: 30%;
  left: -2%;
  display: flex;
  justify-content: space-between;
  width: 104%;
}

.our-team-slider-box .owl-dot button {
  border: none;
  background-color: transparent;
  font: 400 1.2rem var(--secondary-font);
  color: var(--primary-color);
  margin-right: 1.5rem;
}

.our-team-slider-box .owl-nav .owl-prev:hover,
.our-team-slider-box .owl-nav .owl-next:hover {
  background: transparent;
}

.our-team-slider-box .owl-dot button {
  border: none;
  background-color: transparent;
  font: 400 1.2rem var(--secondary-font);
  /* color: var(--primary-color); */
  margin-right: 1.5rem;
}

/* Hide the button and span inside inactive dots */
.our-team-slider-box .owl-dot button {
  background: transparent;
  border: none;
  font-size: 0; /* Hide number */
  overflow: hidden; /* Prevents number from appearing */
  /* border-bottom: 1px solid var(--white-color); */
  margin-bottom: 0;
  padding-bottom: 0;
  width: 2rem;
}
.our-team-slider-box .owl-dot button span {
  /* visibility: hidden; */
  background-color: var(--primary-color) !important;
}

/* Active dot styling */
.our-team-slider-box .owl-dot.active {
  width: auto;
  height: auto;
  background: none; /* Removes dot styling */
  text-align: center;
}

/* Show the number inside active dot */
.our-team-slider-box .owl-dot.active button span {
  /* background-color: transparent; */
  font: 400 1.2rem var(--secondary-font); /* Show number */
  color: var(--primary-color);
  /* background-color: green; */
  visibility: visible;
  /* padding-bottom: 2rem; */
  background-color: transparent !important;
  height: auto;
}
.our-team-slider-box.owl-theme .owl-dots .owl-dot span {
  margin: 0;
  background-color: transparent;
}

.our-team-slider-box.owl-theme .owl-dots .owl-dot {
  display: flex !important;
  zoom: 1;
}
.our-team-slider-box.owl-theme .owl-dots {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* ------------------------ our team end ---------------------- */

/* ---------------------------- gallery start -------------------- */

.gallery-custom {
  padding: 5rem 5rem;
}

.gallery-head h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  text-align: center;
  /* padding-bottom: 1rem; */
}
.gallery-head p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
  text-align: center;
  margin-bottom: 3rem;
}
/* Gallery container */
.gallery-images-box {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 2rem;
  position: relative;
}

/* Individual image container */
.gallery-images-box .all-images {
  position: relative;
  border-radius: 2rem;
  overflow: hidden;
}

/* Styling for images */
.gallery-images-box .all-images img.img-fluid {
  border-radius: 2rem;
  width: 100%;
  display: block;
  transition: transform 0.3s ease-in-out;
}

/* Shadow overlay */
.all-images::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  border-radius: 2rem;
  background: rgba(0, 0, 0, 0.5); /* Dark shadow */
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: 1; /* Ensure shadow is above the image */
}

/* Keep shadow and icon always visible on the first div */
/* .all-images:first-child::before {
  opacity: 1;
} */

/* Show shadow on hover */
.all-images:hover::before {
  opacity: 1;
}

/* Zoom effect on hover */
.all-images:hover img.img-fluid {
  transform: scale(1.1);
}

/* Click icon styling */
.click-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px; /* Adjust size */
  height: 50px;
  opacity: 0; /* Hidden by default */
  transition: opacity 0.3s ease-in-out;
  cursor: pointer;
  z-index: 2; /* Ensure icon is above the shadow */
}

/* Always show the icon on the first div */
/* .all-images:first-child .click-icon {
  opacity: 1;
} */

/* Show icon on hover */
.all-images:hover .click-icon {
  opacity: 1;
}

/* ---------------------------- gallery end -------------------- */

/* --------------------- our customers start ------------------ */

.our-customers-head h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  text-align: center;
  /* padding-bottom: 1rem; */
}
.our-customers-head p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
  text-align: center;
  margin-bottom: 2rem;
}
.our-customers-custom {
  background-color: #daecff;
  padding: 5rem 5rem 6rem 5rem;
}

.our-first-box {
  border-radius: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* border: 1px solid green; */
  padding: 3rem 2.5rem;
  background-color: var(--white-color);
}
.our-first-box .our-img img {
  width: 5rem;
  border-radius: 50%;
}
.our-first-box .our-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.our-first-box .our-content span {
  display: flex;
}
.our-first-box .our-content p span img {
  width: 1rem;
}
.our-first-box .our-content h2 {
  font: 600 1.6rem var(--secondary-font);
  color: var(--primary-color);
  margin-bottom: 0;
}
.our-first-box .our-content p {
  font: 300 1rem var(--primary-font);
  margin-bottom: 0.5rem;
  text-align: center;
}
.our-first-box .our-content p span {
  margin-bottom: 1rem;
}
.our-first-box {
  /* min-height: 2rem; */
}
.our-third-box {
  position: relative;
}
.our-third-box img {
  border-radius: 2rem;
}
.our-third-box .our-content {
  position: absolute;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  padding: 0.5rem 1rem;
}
.our-content-head h4 {
  color: var(--white-color);
  text-align: center;
  font: 400 1.3rem var(--secondary-font);
  margin-bottom: 0;
}
.our-content-head p {
  color: var(--white-color);
  font: 200 0.9rem var(--secondary-font);
}
.our-content-video-icon button img {
  width: 2.5rem;
}
.our-customers-sub-img-box {
  margin-bottom: 3rem;
}
.our-customers-box .owl-nav {
  position: absolute;
  top: 30%;
  left: -2%;
  display: flex;
  justify-content: space-between;
  width: 104%;
}
.our-customers-box .owl-nav .owl-prev:hover,
.our-customers-box .owl-nav .owl-next:hover {
  background: transparent;
}

.our-customers-box .owl-dot button {
  border: none;
  background-color: transparent;
  font: 400 1.2rem var(--secondary-font);
  /* color: var(--primary-color); */
  margin-right: 1.5rem;
}

/* Hide the button and span inside inactive dots */
.our-customers-box .owl-dot button {
  background: transparent;
  border: none;
  font-size: 0; /* Hide number */
  overflow: hidden; /* Prevents number from appearing */
  /* border-bottom: 1px solid var(--white-color); */
  margin-bottom: 0;
  padding-bottom: 0;
  width: 2rem;
}
.our-customers-box .owl-dot button span {
  /* visibility: hidden; */
  background-color: var(--primary-color) !important;
}

/* Active dot styling */
.our-customers-box .owl-dot.active {
  width: auto;
  height: auto;
  background: none; /* Removes dot styling */
  text-align: center;
}

/* Show the number inside active dot */
.our-customers-box .owl-dot.active button span {
  /* background-color: transparent; */
  font: 400 1.2rem var(--secondary-font); /* Show number */
  color: var(--primary-color);
  /* background-color: green; */
  visibility: visible;
  /* padding-bottom: 2rem; */
  background-color: transparent !important;
  height: auto;
}
.our-customers-box.owl-theme .owl-dots .owl-dot span {
  margin: 0;
  background-color: transparent;
}
.our-customers-box.owl-theme .owl-dots .owl-dot {
  display: flex !important;
  zoom: 1;
}
.our-customers-box.owl-theme .owl-dots {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* --------------------- our customers end ------------------ */

/* --------------------- footer start ---------------------- */

.footer-custom {
  padding: 5rem 2rem 0 2rem;
}

.footer-goushala h4 {
  font: 400 1.6rem var(--secondary-font);
  text-align: center;
  margin-bottom: 4rem;
}
.footer-nav ul li {
  font: 400 1.6rem var(--secondary-font);
  list-style-type: none;
  margin-bottom: 3rem;
  color: var(--black-color);
}
.footer-nav {
  display: flex;
  justify-content: center;
}
.footer-nav ul {
  display: flex;
  width: 70%;
  justify-content: space-between;
}
.footer-nav ul a {
  text-decoration: none;
}

.footer-copy-right p {
  font: 400 0.6rem var(--primary-font);
  text-align: center;
}

/* --------------------- footer end ---------------------- */

/* ------------- this is for vidoes start ------------------ */
.our-customers-custom .modal-content {
  background-color: transparent;
}
.our-customers-custom .modal-body {
  position: relative;
  /* flex: 1 1 auto; */
  display: flex;
  padding: var(--bs-modal-padding);
  align-items: center;
  height: -webkit-fill-available;
  justify-content: center;
}
.our-customers-custom .model-body-main {
  position: relative;
  width: 60%;
}
.our-customers-custom .model-body-main button {
  position: absolute;
  /* font-weight: 600; */
  top: -3rem;
  right: 0;
  color: var(--white-color);
}
.our-customers-custom .model-body-main video {
  width: 100%;
}

/* ------------- this is for vidoes end ------------------ */
section {
  overflow: hidden;
}

/* -------------------- contact page start -------------------- */

.contact-us-custom {
  /* background-image: url("../images/home-page-img/index-image-bg-mian.jpg"); */
  background-image: url("../images/contact-us-bg-img.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 75vh;
}
.contact-us-content {
  padding-bottom: 5rem;
  padding-left: 4rem;
}
.contact-us-content h1 {
  font: 600 2.25rem var(--secondary-font);
  line-height: 2.87rem;
  color: #ffffff;
}
.contact-us-content p {
  font: 200 0.75rem var(--primary-font);
  line-height: 1.25rem;
  letter-spacing: 1px;
  color: #ffffff;
}
.drop-us-custom {
  padding: 5rem 4rem;
  background-color: #daecff;
}

.drop-us-mian-box .form-control {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #8f8f8fee;
  border-radius: 0;
  padding: 0;
  margin: 0;
}
.drop-us-mian-box .form-label {
  margin-bottom: 0;
}

.drop-us-mian-box h1 {
  font: 600 3rem var(--secondary-font);
  line-height: 2.87rem;
  color: #4e6085;
  padding-bottom: 2rem;
}
.drop-us-mian-box p {
  font: 400 1rem var(--primary-font);
  line-height: 1.25rem;
  letter-spacing: 1px;
  color: var(--black-color);
  padding-bottom: 3rem;
  width: 70%;
}
.drop-us-mian-box label {
  font: 400 1rem var(--primary-font);
  line-height: 1.25rem;
  letter-spacing: 1px;
  color: var(--black-color);
  padding-left: 1.5rem;
}
.contact-us-msg {
  padding-bottom: 3rem;
}
.submit-btn {
  border: 1px solid #4e6085;
  border-radius: 2rem;
  padding: 0.6rem 1.5rem;
  font: 600 0.9rem var(--primary-font);
  color: var(--primary-color);
  background-color: transparent;
  transition: all 0.6s ease-in-out;
  margin: 1rem 0;
}
.drop-us-mian-box input:focus {
  border: none;
  outline: none;
}

/* ---------------------- contact page end -------------------------- */

/* ------------------------ about page start ---------------- */

.about-custom .about-us-main-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 7rem 7rem;
}
.about-us-main-box h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  padding-bottom: 1rem;
  color: var(--primary-color);
}
.about-us-main-box p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}

.our-mission-container .our-mission-box {
  width: 50%;
  background-color: #daecff;
}
.our-mission-container .our-mission-box img {
  width: 100%;
}
.our-mission-container {
  flex-wrap: wrap;
}
.our-mission-text-box {
  color: var(--white-shade-color);
  padding: 0 4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  justify-content: center;
  height: 100%;
}
.heading-content h1 {
  font: 800 3rem var(--secondary-font);
  color: var(--primary-color);
  padding-bottom: 1rem;
  color: var(--primary-color);
}
.heading-content p {
  font: 300 1.03rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}

.about-mission-custom {
  background-image: url("../images/index-bg-gaushala-slider-img1.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 75vh;
}
/* ------------------------ about page end ---------------- */

/* ---------------- what we do start ------------------ */

/* .what-we-do-main-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  align-items: center;
}
.what-we-do-main-box .item {
  flex-direction: column;
  width: 60%;
  display: flex;
  justify-content: center;
}
.what-we-do-main-box .item img {
  border-radius: 1rem;
}
.what-we-do-main-box p{
  font:400 2rem var(--primary-font);
  text-align: center;
  padding-bottom: 2rem;
} */
/* .what-we-do-mission::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 95%;
  height: 75%;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.3), transparent);
  z-index: 0;
} */
.what-we-do-custom {
  padding: 4rem 4rem 2rem 4rem;
  background-color: #eae1e155;
}

.what-we-do-main-box p {
  font: 450 1.3rem var(--secondary-font);
  text-align: center;
  margin-top: 1rem;
}
.what-we-do-main-box {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 1rem;
}
.what-we-do-main-box img {
  width: 100%;
  border-radius: 1rem;
}
.what-we-do-footer {
  padding-top: 2rem;
}

/* ---------------- what we do end ------------------ */
/* --------------------------- gallery start --------------- */

.gallery-box {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.gallery-box img {
  width: 100%;
  border-radius: 1rem;
}
.lg-outer .lg-object {
  width: 80% !important;
}

/* --------------------------- gallery end --------------- */
/* ------------------ donate now start ----------------- */
.donate-now-custom {
  padding: 5rem 4rem;
  background-color: #daecff;
}

.support-content-box h1 {
  font: 800 2.6rem var(--secondary-font);
  color: var(--primary-color);
  padding-bottom: 1rem;
}
.support-content-box p {
  font: 300 1rem var(--primary-font);
  line-height: 1.7rem;
  letter-spacing: 0.03rem;
}
.bank-details {
  font: 500 1rem var(--primary-font) !important;
  color: var(--primary-color);
  margin-bottom: 0.5rem;
}
.bank-details span {
  font: 500 1rem var(--primary-font) !important;
  color: var(--black-color);
}
.donate-now-custom .col-md-7 {
  border-right: 1px solid #00000055;
}
.bank-details-container {
  padding: 2rem 0;
}
.support-box {
  padding-top: 2rem;
  padding-right: 7rem;
}
.scanner-box p {
  font: 700 1rem var(--primary-font) !important;
  color: var(--primary-color);
  text-align: center;
  padding-top: 1rem;
}
.scanner-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 2rem;
}

/* ------------------ donate now end ----------------- */