.nav-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  background: #fff;
  border-bottom: 1px solid #ccc;
  position: relative;
}

.nav-brand {
  display:grid;
  flex-direction: column;
  margin-left: 50px;
  margin-bottom: 40px;
}

.nav-links {
  list-style-type:none;
  display:flex;
  gap: 20px;
}

.nav-links li a {
  text-decoration: none;
  color: #024624;
  font-weight: bold;
  font-size: 18px;
}

.nav-links li a:hover {
  color: #00aa88;
}

.donation-btn {
  background: linear-gradient(to bottom, #33a56c, #133f29);
  color: white;
  padding: 6px 12px;
  border-radius: 6px;
}
.nav-toggle {
  display: none;
}

.nav-toggle-label {
  display: none;
  font-size: 2rem;
  cursor: pointer;
}

@media (max-width: 768px) {
  .nav-toggle {
    display: block;
  }

  .nav-toggle-label {
    display: block;
    position:fixed;
    right: 20px;
    top: 20px;
  }

  .nav-links {
    display: none;
    flex-direction: column;
    background: #fff;
    position: absolute;
    top: 60px;
    right: 0;
    width: 100%;
    padding: 1rem;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  }

  .nav-toggle:checked + .nav-toggle-label + .nav-links {
    display: flex;
  }
}
.about-us,
.about-us * {
  box-sizing: border-box;
}
.about-us {
  background: linear-gradient(
    180deg,
    rgba(0, 255, 128, 1) 0%,
    rgba(13, 15, 13, 1) 100%
  );
  height: 2994px;
  position: relative;
  overflow-y: auto;
}
.bg-2 {
  opacity: 0.25;
  width: 1435px;
  height: 477px;
  position: absolute;
  left: 0px;
  top: 2087px;
  object-fit: cover;
}
.r-21-b {
  background: #ffffff;
  width:100vw;
  max-width: 100%;
  height: 782px;
  position: absolute;
  left: 0px;
  top: 902px;
}
.servlead-2 {
  width: 122px;
  height: 136px;
  position: absolute;
  left: 1032px;
  top: 1072px;
  object-fit: cover;
}
.img-22 {
  width: 116px;
  height: 113px;
  position: absolute;
  left: 366px;
  top: 1083px;
  object-fit: cover;
}
.r-26-b {
  background: #1a5429;
  border-radius: 46px;
  width: 258px;
  height: 66px;
  position: absolute;
  left: 282px;
  top: 1377px;
  color: white;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 66px; /* Vertically center the text */
  text-decoration: none;
  border: none;
  cursor: pointer;
}

.r-26-b:hover {
  background: #144420;
}
.r-27-b {
  background: #1a5429;
  border-radius: 46px;
  width: 258px;
  height: 66px;
  position: absolute;
  left: 968px;
  top: 1376px;
  color: white;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 66px; /* Center text vertically */
  text-decoration: none;
  border: none;
  cursor: pointer;
}

.r-27-b:hover {
  background: #144420;
}
.sob-2 {
  color: #024624;
  text-align: left;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 25px;
  line-height: 25px;
  font-weight: 700;
  position: absolute;
  left:250px;
  top: 1220px;
  width: 357px;
  height: 50px;

}
.np-2 {
  color: #ffffff;
  text-align: left;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 75px;
  line-height: 25px;
  font-weight: 700;
  position: absolute;
  left: 50%;
  translate: -50%;
  top: 1734px;
  width: 521px;
  height: 20px;
}
.fom-21 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Bold", sans-serif;
  font-size: 25px;
  line-height: 25px;
  font-weight: 700;
  position: absolute;
  left: 334px;
  top: 1398px;
  width: 194px;
  height: 23px;
}

.fom-button {
  display: inline-block;
  background-color: #007BFF; /* Customize to fit your theme */
  color: white;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 600;
  padding: 10px 20px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.fom-button:hover {
  background-color: #0056b3; /* Darker shade on hover */
}

.compo-1-b {
  width: 255px;
  height: 57px;
  position: absolute;
  left: 625px;
  top: 1974px;
}

.ask-for-prayer-btn {
  background: linear-gradient(
    180deg,
    rgba(64, 192, 52, 1) 0%,
    rgba(15, 173, 79, 1) 83.49999785423279%,
    rgba(14, 194, 92, 1) 100%
  );
  color: white;
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 600;
  padding: 12px 24px;
  border: none;
  border-radius: 25px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.ask-for-prayer-btn:hover {
  background-color: #21bc8d; /* Darker shade for hover effect */
}

.fom-2 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Bold", sans-serif;
  font-size: 25px;
  line-height: 25px;
  font-weight: 700;
  position: absolute;
  left: 1020px;
  top: 1396px;
  width: 194px;
  height: 23px;
}
.ol-2 {
  color: #024624;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 30px;
  line-height: 25px;
  font-weight: 700;
  position: absolute;
  left: 965px;
  top: 1220px;
  width: 269px;
  height: 25px;
}
.see-2 {
  color: #000000;
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 25px;
  line-height: 30px;
  letter-spacing: 0.05em;
  font-weight: 400;
  position: absolute;
  left: 199px;
  top: 1251px;
  width: 452px;
  height: 64px;
}
.find-2 {
  color: #000000;
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 25px;
  line-height: 30px;
  letter-spacing: 0.05em;
  font-weight: 400;
  position: absolute;
  left: 948px;
  top: 1261px;
  width: 360px;
  height: 34px;
}
.img-21 {
  width: 100vw;
  max-width: 100%;
  height: 319px;
  position: absolute;
  left: 0px;
  top: 0px;
  object-fit: cover;
}
.au-21 {
  color: #ffffff;
  text-align: center;
  font-family: "Antonio-Bold", sans-serif;
  font-size: 75px;
  line-height: 0px;
  font-weight: 350;
  position: absolute;
  left: 586px;
  top: 150px;
  width: 268px;
  height: 35px;
  white-space: nowrap;
}
.weare-2 {
  color: #000000;
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 30px;
  line-height: 50px;
  font-weight: 400;
  position: absolute;
  left: 119px;
  top: 422px;
  width: 1247px;
  height: 184px;
}
.there-2 {
  color: #ffffff;
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 25px;
  line-height: 40px;
  font-weight: 400;
  position: absolute;
  left: 245px;
  top: 1799px;
  width: 968px;
  height: 138px;
}
.achurch-2 {
  color: #ffffff;
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 25px;
  line-height: 40px;
  font-weight: 400;
  position: absolute;
  left: 246px;
  top: 2245px;
  width: 978px;
}
.nac-2 {
  color: #ffffff;
  text-align: left;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 75px;
  line-height: 25px;
  font-weight: 700;
  position: absolute;
  left: 50%;
  translate: -50%;
  top: 2169px;
  width: 708px;
  height: 34px;
}
.mowcag-22 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 126px;
  top: 2855px;
  width: 354px;
  height: 23px;
}
.mowcag-21 {
  color: #ffffff;
  text-align: left;
  font-family: "Antonio-Bold", sans-serif;
  font-size: 45px;
  line-height: 20px;
  font-weight: 700;
  position: absolute;
  left: 124px;
  top: 2803px;
  width: 179px;
  height: 33px;
}
.phi-2 {
  width: 16px;
  height: 16px;
  position: absolute;
  left: 588px;
  top: 2928px;
  object-fit: cover;
}
.loc-2 {
  width: 32px;
  height: 35px;
  position: absolute;
  left: 572px;
  top: 2795px;
  object-fit: cover;
}
.cn-2 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 608px;
  top: 2925px;
}
.soc-2 {
  color: #ffffff;
  text-align: center;
  font-size: 35px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 1134px;
  top: 2816px;
  width: 157px;
  height: 35px;
}
.cu-2 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Regular", sans-serif;
  font-size: 35px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 588px;
  top: 2884px;
  width: 192px;
  height: 35px;
}
.add-2 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Regular", sans-serif;
  font-size: 35px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 578px;
  top: 2754px;
  width: 157px;
  height: 35px;
}
.blk-2 {
  color: #ffffff;
  text-align: left;
  font-family: "ArOneSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 613px;
  top: 2798px;
  width: 315px;
}
.fblg-2 {
  width: 119px;
  height: 76px;
  position: absolute;
  left: 1101px;
  top: 2859px;
  overflow: visible;
}
.img-20 {
  width: 55px;
  height: 45px;
  position: absolute;
  left: 1310px;
  top: 2874px;
  overflow: visible;
}
.ig-2 {
  width: 138px;
  height: 105px;
  position: absolute;
  left: 1178px;
  top: 2850px;
  overflow: visible;
}
.lg-21 {
  border-radius: 50%;
  width: 51px;
  height: 49px;
  position: absolute;
  left: 56px;
  top: 2795px;
  object-fit: cover;
}
.r-18-d {
  background: #ffffff;
  width: 1440px;
  height: 60px;
  position: fixed;
  left: 0px;
  top: 0px;
}
.compo-1-d {
  width: 100px;
  height: 42px;
  position: fixed;
  left: 1296px;
  top: 9px;
}
.r-20-a {
  background: linear-gradient(
    180deg,
    rgba(51, 165, 108, 1) 0%,
    rgba(19, 63, 41, 1) 100%
  );
  border-radius: 16px;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
}
.gvng-1 {
  color: #ffffff;
  text-align: center;
  font-family: "FranklinGothicHeavy-Regular", sans-serif;
  font-size: 15px;
  font-weight: 400;
  position: absolute;
  right: 11.84%;
  left: 21.05%;
  width: 67.11%;
  bottom: 26.83%;
  top: 26.83%;
  height: 46.34%;
}
.lg-4 {
  border-radius: 50%;
  width: 39px;
  height: 38px;
  position: fixed;
  left: 6px;
  top: 11px;
  object-fit: cover;
}
.h-4 {
  color: #000000;
  text-align: center;
  font-family: "Arial-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 773px;
  top: 18px;
  width: 69px;
  height: 17px;
}
.au-4 {
  color: #000000;
  text-align: center;
  font-family: "Arial-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 844px;
  top: 17px;
  width: 139px;
  height: 14px;
}
.ot-4 {
  color: #000000;
  text-align: center;
  font-family: "Arial-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 979px;
  top: 17px;
  width: 113px;
  height: 20px;
}
.vu-4 {
  color: #000000;
  text-align: center;
  font-family: "Arial-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 1092px;
  top: 17px;
  width: 101px;
  height: 21px;
}
.li-4 {
  color: #000000;
  text-align: center;
  font-family: "Arial-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  text-decoration: underline;
  position: fixed;
  left: 1163px;
  top: 16px;
  width: 139px;
  height: 14px;
}
.mowc-4 {
  color: radial-gradient(
    closest-side,
    rgba(8, 85, 47, 1) 0%,
    rgba(2, 70, 36, 1) 100%
  );
  text-align: left;
  font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 400;
  position: absolute;
  left: 60px;
  top: 13px;
  width: 370px;
  height: 30px;
}
.aog-4 {
  color: radial-gradient(
    closest-side,
    rgba(8, 85, 47, 1) 0%,
    rgba(2, 70, 36, 1) 100%
  );
  text-align: left;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 700;
  position: absolute;
  left: 60px;
  top: 31px;
  width: 332px;
  height: 13px;
}
.compo-1-d2 {
  width: 106px;
  height: 42px;
  position: fixed;
  left: 1293px;
  top: 9px;
}
.r-20-a2 {
  background: linear-gradient(
    180deg,
    rgba(51, 165, 108, 1) 0%,
    rgba(19, 63, 41, 1) 100%
  );
  border-radius: 9px;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
}
.h-42 {
  color: #000000;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 773px;
  top: 18px;
  width: 69px;
  height: 17px;
}
.au-42 {
  color: #000000;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 844px;
  top: 17px;
  width: 139px;
  height: 14px;
}
.ot-42 {
  color: #000000;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 979px;
  top: 17px;
  width: 113px;
  height: 20px;
}
.vu-42 {
  color: #000000;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 1092px;
  top: 17px;
  width: 101px;
  height: 21px;
}
.li-42 {
  color: #000000;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: fixed;
  left: 1163px;
  top: 16px;
  width: 139px;
  height: 14px;
}
.mowc-42 {
  color: radial-gradient(
    closest-side,
    rgba(8, 85, 47, 1) 0%,
    rgba(2, 70, 36, 1) 100%
  );
  text-align: left;
  font-family: "AntonSc-Regular", sans-serif;
  font-size: 20px;
  line-height: 20px;
  font-weight: 400;
  position: fixed;
  left: 60px;
  top: 13px;
  width: 370px;
  height: 30px;
}