* {
  padding: 0;
  margin: 0;
}

:root {
  --main-gradient: linear-gradient(
    90deg,
    rgb(90, 212, 218) 0%,
    rgb(100, 201, 224) 43%,
    rgb(14, 162, 200) 100%
  );
  --moz-box-shadow: 0px 0px 0px 5px rgba(18, 99, 211, 0.18);
  --font-family-monospace: "Talon TSi", 1993;
  --opacity-background: linear-gradient(
    0deg,
    rgba(85, 168, 57, 0.197) 20%,
    rgba(198, 230, 92, 0.23) 100%
  );
  --info-color: #0f99a3;
  --info-color2: #4adde71e;
  --dark-blue: #072b62;
  --mine-secondary: #454545;
  --opacity-background2: linear-gradient(
    0deg,
    rgba(214, 225, 215, 0.67) 20%,
    rgba(168, 216, 186, 0.67) 100%
  );
  --linergredient: linear-gradient(
    90deg,
    rgba(179, 188, 53, 0.147) 0%,
    #5ec3631b 100%
  );
}

.text-hover {
  transition: all 0.3s ease !important;
}

.text-hover:hover {
  color: var(--info-color) !important;
}

.linear-btn {
  background: var(--main-gradient);
  box-shadow: var(--moz-box-shadow);
  color: #ffffff;

  transition: all 1.5s ease-in-out;
  cursor: pointer;
}

.top-bar {
  font-family: var(--font-family-monospace);
}

.linear-btn:hover {
  background: linear-gradient(
    60deg,
    rgb(14, 162, 200) 0%,
    rgb(100, 201, 224) 57%,
    rgb(90, 212, 218) 100%
  );
  box-shadow: var(--moz-box-shadow);
}

/* ///////nav-bar///// */
.navbar-toggler {
  border: none !important;
  box-shadow: none !important;
}

.navbar-toggler:focus {
  outline: none !important;
  box-shadow: none !important;
}

.navbtn {
  background-color: var(--info-color);
  height: 40px;
  padding: 0px 6px 5px 6px;
}

.navbtn .navbar-toggler-icon {
  background-image: none;
  position: relative;
  display: inline-block;
  width: 25px;
  height: 4px;
  background-color: #ffffff;
}

.navbtn .navbar-toggler-icon::before,
.navbtn .navbar-toggler-icon::after {
  content: "";
  position: absolute;
  width: 25px;
  height: 4px;
  background-color: #ffffff;
  left: 0;
}

.navbtn .navbar-toggler-icon::before {
  top: -9px;
}

.navbtn .navbar-toggler-icon::after {
  top: 9px;
}

/* /////////// */
.nav-item.dropdown {
  position: relative;
}

.custom-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  padding: 10px 0;
  min-width: 180px;
  list-style: none !important;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.3s ease;
  z-index: 99;
}

.nav-item.dropdown:hover .custom-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.custom-dropdown .dropdown-item {
  padding: 10px 20px;
  color: #333;
  text-decoration: none !important;
  font-weight: 500;
  background: #fff;
  transition: background 0.3s ease;
}

.custom-dropdown .dropdown-item:hover {
  background-color: #f8f9fa;
}

.nav-link:hover {
  color: #0f99a3 !important;
}

/* ////////////////// */

.right-border:before {
  border: 1px dashed #4897aa;
  border-radius: 50%;
  position: absolute;
  content: "";
  animation: circle 60s linear infinite;
  width: 500px;
  height: 500px;
}

circle {
  transform: rotate(146.833deg);
}

@keyframes circle {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}

/* ///////////// */
.image-banner-animation {
  animation: image-banner-animation 2.5s ease-in-out infinite alternate;
}

@keyframes image-banner-animation {
  0% {
    transform: translate(0, 0);
  }

  50% {
    transform: translate(-10px, -10px);
  }

  100% {
    transform: translate(0, 0);
  }
}

/* /////////player////// */

.modal-backdrop.show {
  opacity: 0 !important;
}

/* //////////// */
/* //////prayer////// */

.prayer-section {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 3rem;
}

.prayer-times {
  flex: 1 1 350px;
}

.prayer-box {
  border-radius: 12px;
  padding: 0.8rem 1.5rem;
  color: #0f2234;
  font-weight: 500;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 65%;
  margin-bottom: 1rem;
  transition: all 0.3s ease;
}

.fajr {
  background: linear-gradient(to right, #b4f3ff, #a8ecff);
  margin-left: 12%;
}

.sunrise {
  background: linear-gradient(to right, #fde3c8, #fcd5b4);
  margin-right: 8%;
  color: #d85f4f;
}

.dhuhr {
  background: linear-gradient(to right, #e1d8ff, #d1ccff);
  margin-left: 10%;
  color: #3b2b88;
}

.asr {
  background: linear-gradient(to right, #cbf7d3, #b5f1c2);
  margin-right: 12%;
  color: #2d6a42;
}

.maghrib {
  background: linear-gradient(to right, #ffd2d8, #fcbcc6);
  margin-left: 14%;
  color: #b33a54;
}

.isha {
  background: linear-gradient(to right, #bdefff, #a8e4ff);
  margin-right: 10%;
  color: #175d74;
}

@media (max-width: 768px) {
  .prayer-box {
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

.img-col {
  position: relative;
  overflow: hidden;
}

.col-images {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  z-index: 0;
  pointer-events: none;
}

.col-images img {
  position: relative;
  height: auto;
  opacity: 0.9;
  transition: all 0.3s ease-in-out;
}

.col-images .img1 {
  width: 220px;
  margin-left: -720px;
  margin-bottom: -20px;
}

.col-images .img2 {
  width: 160px;
  margin: -50px 45px;
}

.prayer-section {
  position: relative;
  z-index: 1;
}

@media (max-width: 768px) {
  .col-images .img1 {
    width: 140px;
    margin-left: -70px;
  }

  .col-images .img2 {
    width: 110px;
  }

  .col-images .img3 {
    width: 140px;
    margin-right: -70px;
  }
}

/* ///////////// */

.img-wrapper {
  width: 170px;
  height: 170px;
  border-radius: 50%;
  overflow: hidden;
  transition: all 0.3s ease;
}

.img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.img-wrapper:hover img {
  transform: scale(0.9);
}

/* ////////ferther information card ////////// */
.input-group {
  position: relative;
}

.input-group .btn {
  top: 50%;
  transform: translateY(-50%);
  height: 35px;
  line-height: 1;
  font-size: 15px;
  background: var(--main-gradient);
  border: none;
}

.input-group .form-control {
  padding-right: 100px;
  height: 45px;
}

/*  blogserviceBTN */
.blogserviceBTN {
  width: 100%;
  border: 0.4px solid #e9e8e8;
  height: 60px;
}

.blogserviceBTN:hover {
  color: #0f99a3 !important;
  background: #e4f9f9 !important;
}

.help-img {
  background: linear-gradient(
      rgba(28, 225, 192, 0.811),
      rgba(21, 175, 227, 0.811)
    ),
    url("./images/contact.695d9c29.jpg") center/cover no-repeat;
  width: 100%;
  height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
}



/* contact */

textarea::placeholder{
  color: #828282 !important ;

}



/* login */

.custom-checkbox:checked {
  background-color: red;
  border-color: red;
}