.whatsapbuton {
  position: fixed;
  bottom: 10rem;
  right: 4rem;
  z-index: 1000;
  transition: bottom 0.3s ease;
}

.show-whatsapbuton-scrolled {
  bottom: 2rem !important;
  right: 2rem !important;
}

.show-whatsapbuton {
  display: block;
}

.whatsapbuton {
  z-index: 999;
  position: fixed;
  bottom: 10rem;
  right: 4rem;
}

.whatsapbuton a i {
  font-size: 1.8rem;
  color: #fff;
}

.is-wp-ac {
  display: flex !important;
}

div.loading.hidden {
  display: none !important;
}

.wave {
  background: linear-gradient(45deg, var(--yesil), var(--mavi));
  border-radius: 1000% 1000% 0 0;
  position: fixed;
  width: 200%;
  height: 12em;
  animation: wave 10s -3s linear infinite;
  transform: translate3d(0, 0, 0);
  opacity: 0.8;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.uil-ring-css {
  width: auto;
  height: auto;
}

div.loading {
  margin: auto;
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  overflow: auto;
  background: linear-gradient(
    92deg,
    rgba(40, 84, 35, 1) 0%,
    rgba(52, 130, 48, 1) 50%,
    rgba(42, 74, 36, 1) 100%
  );
  animation: gradient 15s ease infinite;
  background-size: 400% 400%;
  background-attachment: fixed;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh !important;
  z-index: 9999999;
  margin: 0 !important;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  display: flex;
}

.wave:nth-of-type(2) {
  bottom: -1.25em;
  animation: wave 18s linear reverse infinite;
  opacity: 0.8;
}

.wave:nth-of-type(3) {
  bottom: -2.5em;
  animation: wave 20s -1s reverse infinite;
  opacity: 0.9;
  background: linear-gradient(45deg, #72c0c7, #ad9e84);
}

.uil-ring-css > div {
  position: relative;
  display: block;
  width: 70px;
  height: 70px;
  left: 0;
  border-radius: 50%;
  box-shadow: 0 6px 0 0 var(--maincolor);
  -ms-animation: uil-ring-anim 5s linear infinite;
  -moz-animation: uil-ring-anim 5s linear infinite;
  -webkit-animation: uil-ring-anim 5s linear infinite;
  -o-animation: uil-ring-anim 5s linear infinite;
  animation: uil-ring-anim 2s linear infinite;
  bottom: 0%;
}

.custom-loader {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff;
  -webkit-mask: radial-gradient(
    circle closest-side at 50% 40%,
    #0000 94%,
    #000
  );
  transform-origin: 50% 40%;
  animation: s5 1s infinite linear;
}

@keyframes s5 {
  100% {
    transform: rotate(1turn);
  }
}