*::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
  background-color: #f5f5f5;
  border-radius: 8px;
}

*::-webkit-scrollbar {
  margin-right: -5;
  width: 5px;
  background-color: #f5f5f5;
}

*::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color: #cbcbcb;
}

body {
  background-color: rgb(255, 255, 255);
}

pre {
  font-size: 1rem;
  white-space: pre-wrap;
  font-family: var(--bs-body-font-family) !important;
}

#PC-block {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 11;
  background-color: white;
  font-size: 39px;
  text-align: center;
  color: red;
  display: none;
}

@media only screen and (min-width: 1210px) {
  #PC-block {
      display: flex;
  }
}

.chedic {
  width: 2rem;
}

.chedlg {
  font-size: 1.8rem;
}

.chedtx {
  font-size: 0.9rem;
}

.clsimg {
  height: 4.9rem;
}

.c085tx {
  font-size: 0.85rem;
}

.c095tx {
  font-size: 0.95rem;
}

.ch-12r {
  height: 12rem;
}

.ch-13r {
  height: 13rem;
}

.ch-15r {
  height: 15rem;
}

.c-02bt {
  margin-bottom: -0.2rem;
}

.clsblk {
  /* min-height: 13.5rem; */
}

.clsico {
  width: 1rem;
  margin-top: -0.15rem;
}

.cimgct {
  display: flex;
  align-items: center;
  justify-content: center;
}

.circle {
  position: relative;
  width: 100%;
  padding-top: 100%;
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover;
}

.circle span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 800;
  font-size: 10vw;
  color: rgb(205, 205, 205);
}

.scpimg {
  width: 75%;
  max-width: 18rem;
  transform: translate(-50%, -50%);
}

.cbganp {
  background: #00000080;
}

.cshwim {
  width: 80%;
  max-width: 20rem;
}

.cmodal {
  animation: smodal 0.3s forwards;
  padding: 0 1em;
  transform: translate(0%, 50%);
}

@keyframes smodal {
  0% {
    top: 0;
    opacity: 0;
  }

  100% {
    top: 1em;
    opacity: 1;
  }
}

#icouls {
  background:
    linear-gradient(180deg, rgba(248, 184, 139, 0) 20%, rgba(248, 184, 139, .1) 20%, rgba(248, 184, 139, .1) 40%, rgba(248, 184, 139, .2) 40%, rgba(248, 184, 139, .2) 60%, rgba(248, 184, 139, .4) 60%, rgba(248, 184, 139, .4) 80%, rgba(248, 184, 139, .5) 80%),
    linear-gradient(45deg, rgba(250, 248, 132, .3) 20%, rgba(250, 248, 132, .4) 20%, rgba(250, 248, 132, .4) 40%, rgba(250, 248, 132, .5) 40%, rgba(250, 248, 132, .5) 60%, rgba(250, 248, 132, .6) 60%, rgba(250, 248, 132, .6) 80%, rgba(250, 248, 132, .7) 80%),
    linear-gradient(-45deg, rgba(186, 237, 145, 0) 20%, rgba(186, 237, 145, .1) 20%, rgba(186, 237, 145, .1) 40%, rgba(186, 237, 145, .2) 40%, rgba(186, 237, 145, .2) 60%, rgba(186, 237, 145, .4) 60%, rgba(186, 237, 145, .4) 80%, rgba(186, 237, 145, .6) 80%),
    linear-gradient(90deg, rgba(178, 206, 254, 0) 20%, rgba(178, 206, 254, .3) 20%, rgba(178, 206, 254, .3) 40%, rgba(178, 206, 254, .5) 40%, rgba(178, 206, 254, .5) 60%, rgba(178, 206, 254, .7) 60%, rgba(178, 206, 254, .7) 80%, rgba(178, 206, 254, .8) 80%),
    linear-gradient(-90deg, rgba(242, 162, 232, 0) 20%, rgba(242, 162, 232, .4) 20%, rgba(242, 162, 232, .4) 40%, rgba(242, 162, 232, .5) 40%, rgba(242, 162, 232, .5) 60%, rgba(242, 162, 232, .6) 60%, rgba(242, 162, 232, .6) 80%, rgba(242, 162, 232, .8) 80%),
    linear-gradient(180deg, rgba(254, 163, 170, 0) 20%, rgba(254, 163, 170, .4) 20%, rgba(254, 163, 170, .4) 40%, rgba(254, 163, 170, .6) 40%, rgba(254, 163, 170, .6) 60%, rgba(254, 163, 170, .8) 60%, rgba(254, 163, 170, .8) 80%, rgba(254, 163, 170, .9) 80%);
  background-color: rgb(254, 163, 170);
  background-size: 100% 100%;
}

#islist {
  background:
    linear-gradient(180deg, rgba(248, 184, 139, 0) 20%, rgba(248, 184, 139, .1) 20%, rgba(248, 184, 139, .1) 40%, rgba(248, 184, 139, .2) 40%, rgba(248, 184, 139, .2) 60%, rgba(248, 184, 139, .4) 60%, rgba(248, 184, 139, .4) 80%, rgba(248, 184, 139, .5) 80%), linear-gradient(45deg, rgba(250, 248, 132, .3) 20%, rgb(202 208 217 / 40%) 20%, rgb(197 219 216 / 40%) 40%, rgb(171 251 101 / 50%) 40%, rgb(170 181 185 / 50%) 60%, rgb(231 255 246 / 60%) 60%, rgb(245 245 224 / 60%) 80%, rgb(132 250 226 / 21%) 80%), linear-gradient(-45deg, rgba(186, 237, 145, 0) 20%, rgba(186, 237, 145, .1) 20%, rgba(186, 237, 145, .1) 40%, rgba(186, 237, 145, .2) 40%, rgba(186, 237, 145, .2) 60%, rgba(186, 237, 145, .4) 60%, rgba(186, 237, 145, .4) 80%, rgba(186, 237, 145, .6) 80%), linear-gradient(90deg, rgba(178, 206, 254, 0) 20%, rgba(178, 206, 254, .3) 20%, rgba(178, 206, 254, .3) 40%, rgba(178, 206, 254, .5) 40%, rgba(178, 206, 254, .5) 60%, rgba(178, 206, 254, .7) 60%, rgba(178, 206, 254, .7) 80%, rgba(178, 206, 254, .8) 80%), linear-gradient(-90deg, rgba(242, 162, 232, 0) 20%, rgba(242, 162, 232, .4) 20%, rgba(242, 162, 232, .4) 40%, rgba(242, 162, 232, .5) 40%, rgba(242, 162, 232, .5) 60%, rgba(242, 162, 232, .6) 60%, rgba(242, 162, 232, .6) 80%, rgba(242, 162, 232, .8) 80%), linear-gradient(180deg, rgba(254, 163, 170, 0) 20%, rgba(254, 163, 170, .4) 20%, rgba(254, 163, 170, .4) 40%, rgba(254, 163, 170, .6) 40%, rgba(254, 163, 170, .6) 60%, rgba(254, 163, 170, .8) 60%, rgba(254, 163, 170, .8) 80%, rgba(254, 163, 170, .9) 80%);
  background-color: rgb(55 229 187);
  background-size: 100% 100%;
}

.cbabtn {
  --bs-btn-color: #0dcaf0;
  --bs-btn-border-color: #0dcaf0;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #0dcaf0;
  --bs-btn-hover-border-color: #0dcaf0;
  --bs-btn-focus-shadow-rgb: 13, 202, 240;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #0dcaf0;
  --bs-btn-active-border-color: #0dcaf0;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #0dcaf0;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #0dcaf0;
  --bs-gradient: none;
}

.readbtn {
  border: solid;
  border-radius: 0.375rem;
  color: rgb(255, 255, 255);
  background-color: #0dcaf0;
  padding: 0.5rem .1rem;
  border-color: #0dcaf0;
}
.readbtn:active {
  color: #0dcaf0 !important;
  background-color: transparent !important;
}

.cbarac {
  background-color: #0dcaf0;
  color: black;
}

.cimgcl {
  width: 28px;
}

.cimage {
  background-image: url(../icons/image.jpg);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
}

.loader {
  width: 10em;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(farthest-side, #ffa516 94%, #0000) top/2em 2em no-repeat,
    conic-gradient(#0000 30%, #ffa516);
  -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 2em), #000 0);
  animation: l13 1s infinite linear;
}

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

.cslidl {
  animation: slidel 0.5s forwards;
}

@keyframes slidel {
  0% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(0);
  }
}

.cslidr {
  animation: slider 0.5s forwards;
}

@keyframes slider {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(100%);
  }
}


.czoout {
  animation: szout 1.5s forwards;
}

@keyframes szout {
  0% {
    transform-origin: center;
    transform: translate(-50%, -50%) scale(1);
  }

  30% {
    transform-origin: center;
    transform: translate(-50%, -50%) scale(1.2);
  }

  /* 60% {
    transform: translate(-50%, -50%) scale(1.2);
  } */
  100% {
    transform: translate(-50%, -50%) scale(0);
  }
}

.czo_in {
  animation: szin 0.2s forwards;
}

@keyframes szin {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

.cz_out {
  animation: sz_out 0.2s forwards;
}

@keyframes sz_out {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}

.cstapm {
  opacity: 0;
  animation: stamp 1s forwards;
}

@keyframes stamp {
  0% {
    opacity: 1;
    transform: scale(0);
  }

  50% {
    opacity: 1;
    transform: scale(1.3);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.cstapm.delay-0 {
  animation-delay: 0.2s;
}

.cstapm.delay-1 {
  animation-delay: 0.4s;
}

.cstapm.delay-2 {
  animation-delay: 0.6s;
}

.cstapm.delay-3 {
  animation-delay: 0.8s;
}

.cstapm.delay-4 {
  animation-delay: 1s;
}

.cstapm.delay-5 {
  animation-delay: 1.2s;
}

.cstapm.delay-6 {
  animation-delay: 1.4s;
}

.cstapm.delay-7 {
  animation-delay: 1.6s;
}

.cstapm.delay-8 {
  animation-delay: 1.8s;
}

.cstapm.delay-9 {
  animation-delay: 2s;
}

.cstapm.delay-10 {
  animation-delay: 2.2s;
}

.cstapm.delay-11 {
  animation-delay: 2.4s;
}

.cstapm.delay-12 {
  animation-delay: 2.6s;
}

.cstapm.delay-13 {
  animation-delay: 2.8s;
}

.cstapm.delay-14 {
  animation-delay: 3s;
}

.cstapm.delay-15 {
  animation-delay: 3.2s;
}

.cstapm.delay-16 {
  animation-delay: 3.4s;
}

.cstapm.delay-17 {
  animation-delay: 3.6s;
}

.cstapm.delay-18 {
  animation-delay: 3.8s;
}

.cstapm.delay-19 {
  animation-delay: 4s;
}

.cstapm.delay-20 {
  animation-delay: 4.2s;
}


.cslotb {
  background-color: #000000b0;
}

.csltit {
  margin-top: -3rem;
}

.slots {
  position: relative;
  width: 310.5px;
  height: 285px;
  display: flex;
  justify-content: space-between;
  padding: 23.7px;
  background: linear-gradient(45deg, grey 0%, lightgray 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.6);
  border-right: 1px solid rgba(255, 255, 255, 0.6);
  border-left: 1px solid rgba(0, 0, 0, 0.4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
  box-shadow: -2px 2px 3px rgba(0, 0, 0, 0.3);
  border-radius: 3px;
}

.slots::before,
.slots::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 10px;
  height: 8px;
  background-color: grey;
}

.slots::before {
  left: 0;
  transform: translate(-200%, -50%);
}

.slots::after {
  right: 0;
  transform: translate(200%, -50%);
}

@-webkit-keyframes cslwin {
  0% {
    background: linear-gradient(45deg, lightblue 0%, lightgreen 100%);
    box-shadow: 0 0 80px lightgreen;
  }

  100% {
    background: linear-gradient(45deg, grey 0%, lightgrey 100%);
    box-shadow: -2px 2px 3px rgba(0, 0, 0, 0.3);
  }
}

@keyframes cslwin {
  0% {
    background: linear-gradient(45deg, lightblue 0%, lightgreen 100%);
    box-shadow: 0 0 80px lightgreen;
  }

  100% {
    background: linear-gradient(45deg, grey 0%, lightgrey 100%);
    box-shadow: -2px 2px 3px rgba(0, 0, 0, 0.3);
  }
}

.slots.cslwin {
  -webkit-animation: cslwin 200ms steps(2, end) infinite;
  animation: cslwin 200ms steps(2, end) infinite;
}

.slots .reel {
  position: relative;
  width: 79px;
  height: 237px;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  overflow: hidden;
  background-image: url(../../media/images/slotreel.webp);
  background-position: 0 0;
  background-repeat: repeat-y;
}

.slots .reel::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(rgba(0, 0, 0, 0.4) 0%, transparent 30%, transparent 70%, rgba(0, 0, 0, 0.4) 100%);
  box-shadow: inset 0 0 6px 2px rgba(0, 0, 0, 0.3);
}

.slots p {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 100%;
  transform: translate(-50%, calc(100% + 30px));
  text-align: center;
  font-size: 0.8rem;
  color: #444;
}

.slots p:last-child {
  transform: translate(-50%, calc(100% + 60px));
}

.slots p a {
  color: red;
  font-weight: 700;
}

.cbakbt {
  top: -5.2rem;
  left: -0.3rem;
  background-color: #00000085;
}

* {
  margin: 0;
  padding: 0;
}

.cspinb {
  /* position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); */
  width: 400px;
}

.cbtn3d {
  display: block;
  margin: 0 auto;
  width: 50%;
  height: 50px;
  font-family: Helvetica;
  border-bottom: 5px solid #173814;
  border-top: none;
  border-left: none;
  border-right: none;
  background: linear-gradient(#f5e966, #cad024);
  color: rgb(79, 79, 79);
  border-radius: 10px;
  box-shadow: 0px 2px 10px grey;
  transition: 150ms ease;
  text-align: center;
  line-height: 50px;
  font-weight: bold;
}

.cbtn3d:active {
  border: none;
  border-bottom: 2px solid steelblue;
  box-shadow: 0px 1px 5px grey;
  background: linear-gradient(#255b20, #469e3f);
  color: #FFF;
}

.cdisab {
  pointer-events: none;
  background: aliceblue !important;
  opacity: 0.8;
}

.pyro>.before,
.pyro>.after {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  box-shadow: -120px -218.66667px blue, 248px -16.66667px #00ff84, 190px 16.33333px #002bff, -113px -308.66667px #ff009d, -109px -287.66667px #ffb300, -50px -313.66667px #ff006e, 226px -31.66667px #ff4000, 180px -351.66667px #ff00d0, -12px -338.66667px #00f6ff, 220px -388.66667px #99ff00, -69px -27.66667px #ff0400, -111px -339.66667px #6200ff, 155px -237.66667px #00ddff, -152px -380.66667px #00ffd0, -50px -37.66667px #00ffdd, -95px -175.66667px #a6ff00, -88px 10.33333px #0d00ff, 112px -309.66667px #005eff, 69px -415.66667px #ff00a6, 168px -100.66667px #ff004c, -244px 24.33333px #ff6600, 97px -325.66667px #ff0066, -211px -182.66667px #00ffa2, 236px -126.66667px #b700ff, 140px -196.66667px #9000ff, 125px -175.66667px #00bbff, 118px -381.66667px #ff002f, 144px -111.66667px #ffae00, 36px -78.66667px #f600ff, -63px -196.66667px #c800ff, -218px -227.66667px #d4ff00, -134px -377.66667px #ea00ff, -36px -412.66667px #ff00d4, 209px -106.66667px #00fff2, 91px -278.66667px #000dff, -22px -191.66667px #9dff00, 139px -392.66667px #a6ff00, 56px -2.66667px #0099ff, -156px -276.66667px #ea00ff, -163px -233.66667px #00fffb, -238px -346.66667px #00ff73, 62px -363.66667px #0088ff, 244px -170.66667px #0062ff, 224px -142.66667px #b300ff, 141px -208.66667px #9000ff, 211px -285.66667px #ff6600, 181px -128.66667px #1e00ff, 90px -123.66667px #c800ff, 189px 70.33333px #00ffc8, -18px -383.66667px #00ff33, 100px -6.66667px #ff008c;
  -moz-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -webkit-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -o-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -ms-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
}

.pyro>.after {
  -moz-animation-delay: 1.25s, 1.25s, 1.25s;
  -webkit-animation-delay: 1.25s, 1.25s, 1.25s;
  -o-animation-delay: 1.25s, 1.25s, 1.25s;
  -ms-animation-delay: 1.25s, 1.25s, 1.25s;
  animation-delay: 1.25s, 1.25s, 1.25s;
  -moz-animation-duration: 1.25s, 1.25s, 6.25s;
  -webkit-animation-duration: 1.25s, 1.25s, 6.25s;
  -o-animation-duration: 1.25s, 1.25s, 6.25s;
  -ms-animation-duration: 1.25s, 1.25s, 6.25s;
  animation-duration: 1.25s, 1.25s, 6.25s;
}

@-webkit-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white;
  }
}

@-moz-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white;
  }
}

@-o-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white;
  }
}

@-ms-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white;
  }
}

@keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white;
  }
}

@-webkit-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}

@-moz-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}

@-o-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}

@-ms-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}

@keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}

@-webkit-keyframes position {

  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }

  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }

  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }

  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }

  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}

@-moz-keyframes position {

  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }

  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }

  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }

  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }

  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}

@-o-keyframes position {

  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }

  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }

  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }

  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }

  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}

@-ms-keyframes position {

  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }

  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }

  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }

  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }

  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}

@keyframes position {

  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }

  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }

  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }

  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }

  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}


.cshwin {
  opacity: 0;
  animation: shwin 0.3s forwards;
}

@keyframes shwin {
  0% {
    opacity: 0.3;
    transform: scale(0);
  }

  70% {
    opacity: 1;
    transform: scale(1.2);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.cshwiout {
  animation: shwout 0.3s forwards;
}

@keyframes shwout {
  0% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(0);
  }
}

.crrorate {
  animation: crrorate 0.3s forwards;
}

@keyframes crrorate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.clrorate {
  animation: clrorate 0.3s forwards;
}

@keyframes clrorate {
  0% {
    transform: rotate(360deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

.cmenuin {
  animation: menuin 0.3s forwards;
}

@keyframes menuin {
  0% {
    transform: translateX(-100%);
  }

  80% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-5%);
  }
}

.cmenuout {
  animation: menuout 0.3s forwards;
}

@keyframes menuout {
  0% {
    transform: translateX(-5%);
  }

  50% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

/* .ciconin {
  animation: iconin 0.3s forwards;
}
@keyframes iconin {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

.ciconout {
  animation: iconout 0.3s forwards;
}
@keyframes iconout {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
} */


@media only screen and (max-width: 376px) {
  .csltit {
    margin-top: -1rem;
    margin-bottom: 1rem !important;
    font-size: 0.9rem;
  }
}