body {
  background: #fff;
}
:root {
  --s-loader-wrapper-bg-color: rgb(21, 22, 43);
  --s-loader-width: 250px;
  --s-loader-height: var(--s-loader-width);
  --s-loader-border-color-trans: rgb(49, 48, 85);
  --s-loader-border-color-full: rgb(29, 161, 242);
}

#ch-preloader {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 999999;
  display: block;
  background: #fff;
  background-size: cover;
}

#logotail {
  border-radius: 14px;
  transform-origin: bottom;
  transition: 300ms;
  animation: wag 0.3s ease-in-out infinite alternate;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  perspective: 1000px;
}

@keyframes wag {
  0% {
    transform: rotateY(20deg);
  }
  50% {
    transform: rotate(-1deg); /*rotate(-2deg) translate(1%, 1%);*/
  }
  100% {
    transform: rotateY(-10deg);
  }
}

.preloader-wrapper-js {
  background: #fff;
  /* width: 200px; */
  max-width: 200px;
  /*min-width: 250px;
  max-width: 500px;*/
  margin: 25px auto;
  /* height: 0; */
  /*padding-top: 10%;*/
  position: fixed;
  left: 0;
  right: 0;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  transition: 300ms;
  /*animation: fade-in 4s ease;*/
}

.preloader-wrapper {
  background: #fff;
  /* width: 200px; */
  max-width: 200px;
  /*min-width: 250px;
  max-width: 500px;*/
  margin: 25px auto;
  /* height: 0; */
  /*padding-top: 10%;*/
  position: fixed;
  left: 0;
  right: 0;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  transition: 300ms;
  animation: fade-in 2s ease;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

#corkhoundsLogo {
  width: 100px;
  transform: scale(0.7) translate(20%, 20%);
}

#corkhoundsText {
  width: 200px;
}

.text-4 {
  fill: #313056;
  font-size: 150px;
  font-family: Sans-Serif;
  transform-origin: center bottom;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  animation: loading-wave 5s ease infinite;
}

@keyframes loading-wave {
  0%,
  100% {
    -webkit-transform: scale(0, 0);
    transform: scale(0.7, 0.7) translate(17%, 100%);
    opacity: 1;
    font-weight: bold;
    filter: alpha(opacity=50);
  }
  75% {
    -webkit-transform: scale(1, 1);
    transform: scale(0.9, 0.9) translate(17%, 100%);
    opacity: 1;
    font-weight: bold;
    filter: alpha(opacity=0);
  }
}

.spinning-loader {
  width: var(--s-loader-width);
  height: var(--s-loader-height);
  border-width: 5px;
  border-style: solid;
  border-right-color: var(--s-loader-border-color-trans);
  border-left-color: var(--s-loader-border-color-full);
  border-radius: 50%;
  border-bottom-color: #fff;
  border-top-color: #fff;
  background: transparent;
  animation-name: rotate-s-loader;
  animation-iteration-count: infinite;
  animation-duration: 5s;
  animation-timing-function: linear;
  z-index: 2000;
  position: fixed;
  left: 0;
  right: 0;
  top: 240px;
  margin-left: auto;
  margin-right: auto;
}

@keyframes rotate-s-loader {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}