/*
Theme Name: Hello Elementor Child
Template: hello-elementor
Version: 1.0.0
*/

.custom-bullets {
    list-style: none;
    margin: 0;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    gap: 100px;
    align-items: center;
    justify-content: center;
}

li.bullet {
    color: white;
    font-size: 24px;
}

@media (min-width: 768px) and (max-width: 1024px){
    .custom-bullets {
        gap: 30px !important;
    }
}

@media (max-width: 767px) {
    .custom-bullets {
        gap: 22px !important;
    }

    li.bullet {
        font-size: 18px !important;
    }
}







.ck-dark-container {
  height: 100%;
  width: 100%;
  display: grid;
  place-items: center;
}

#ck-dark-checkbox {
  display: none;
}

.ck-dark-toggle {
  height: 28px;
  width: 60px;
  border-radius: 9999px;
  background: linear-gradient(to bottom, #6ec8ff, #1f73a7);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 2px 2px 3px #0000003d;
}

/* Mountains */
.ck-dark-mountains {
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 3;
  background-color: #1d7371;
  transition: all 0.5s ease-in-out;
  clip-path: polygon(
    0% 80%,
    25% 50%,
    40% 70%,
    60% 35%,
    65% 45%,
    80% 20%,
    100% 80%,
    100% 100%,
    0% 100%
  );
}

/* Cloud */
.ck-dark-cloud {
  height: 3px;
  width: 5px;
  border-radius: 9999px;
  background-color: rgb(255, 255, 255);
  position: absolute;
  top: 20%;
  left: 10%;
  filter: opacity(0.5);
}

.ck-dark-cloud::before {
  content: "";
  height: 4px;
  width: 4px;
  border-radius: 50%;
  background-color: rgb(255, 255, 255);
  position: absolute;
  top: -50%;
  right: 50%;
  transform: translateX(50%);
}

/* Sea */
.ck-dark-sea {
  height: 70px;
  width: 300%;
  border-radius: 50%;
  position: absolute;
  right: 50%;
  bottom: -500%;
  transform: translateX(50%);
  transition: all 0.5s ease-in-out;
  background: linear-gradient(
    to bottom,
    #3f75cc,
    #06063b,
    #06063b,
    #06063b,
    #06063b
  );
}

.ck-dark-sea::before {
  content: "";
  height: 9px;
  width: 5px;
  background-color: rgba(254, 254, 254, 0.34);
  filter: blur(2px);
  position: absolute;
  top: 2%;
  left: 43%;
}

/* Stars */
.ck-dark-star {
  height: 1px;
  width: 1px;
  position: absolute;
  top: -50%;
  right: 15%;
  background-color: #fff;
  transition: all 0.5s ease-in-out;
  filter: blur(0.3px);
  border-radius: 50%;
}

.ck-dark-star::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: -50%;
  right: 6px;
  background-color: #fff;
  transition: all 0.5s ease-in-out;
  border-radius: 50%;
}

.ck-dark-star::after {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 3px;
  right: -6px;
  background-color: #fff;
  transition: all 0.5s ease-in-out;
  border-radius: 50%;
}

/* Night background */
#ck-dark-checkbox:checked + .ck-dark-toggle {
  background: linear-gradient(to bottom, #036daf, #003d63);
}

/* Sun */
.ck-dark-toggle::before {
  content: "";
  height: 14px;
  width: 14px;
  position: absolute;
  top: 10%;
  right: 30%;
  border-radius: 50%;
  background-color: #ffd34d;
  transition: all 0.5s ease-in-out;
  box-shadow: 0 0 5px #fef95fc3;
}

/* Moon */
.ck-dark-toggle::after {
  content: "";
  height: 12px;
  width: 12px;
  position: absolute;
  top: 10%;
  left: -60%;
  border-radius: 50%;
  background-color: #ffffff;
  transition: all 0.5s ease-in-out;
  box-shadow: 0 0 3px #ffffff88;
}

/* Toggle animations */
#ck-dark-checkbox:checked + .ck-dark-toggle::before {
  transform: translateX(280%);
}

#ck-dark-checkbox:checked + .ck-dark-toggle::after {
  transform: translateX(480%);
}

#ck-dark-checkbox:checked + .ck-dark-toggle .ck-dark-mountains {
  background-color: #05021a;
  transform: translateY(100%);
}

#ck-dark-checkbox:checked + .ck-dark-toggle .ck-dark-sea {
  background-color: #05021a;
  bottom: -210%;
}

#ck-dark-checkbox:checked + .ck-dark-toggle .ck-dark-star {
  transform: rotate(10deg);
  top: 20%;
}