.stiker_wrap {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
}

@media screen and (max-width: 992px) {
  .stiker_wrap {
    bottom: 62px;
  }
}

.stiker {
  display: flex;
  align-items: center;
  background-color: #000;
  padding-left: 22px;
  padding-right: 104px;
  position: relative;
  border-bottom: none;
  animation: 0.3s anim-borderColor infinite;
  cursor: pointer;
  /* overflow-x: hidden; */
  margin-top: 10px;
}

.bg {
  width: 100%;
  position: absolute;
  left: 0;
  z-index: 0;
  top: 0;
  height: 100%;
  overflow: hidden;
}

.bg img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 300px;
  height: 100%;
  animation: moving 12s infinite;
}


.stiker-cross {
  position: absolute;
  border-radius: 50%;
  background-color: #faa003;
  border: 2px solid #fdd501;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -1px;
  cursor: pointer;
  right: 4px;
  font-family: sans-serif;
  color: #fff;
}

.stiker-logo {
  width: 16%;
  z-index: 1;
}

.stiker-text {
  margin-right: 114px;
  font-size: 36px;
  color: #fff;
  font-family: sans-serif;
  white-space: nowrap;
}

.word {
  margin: auto;
  color: white;
  font: 400 normal 2.5em 'tahoma';
  text-shadow: 5px 2px #222324, 2px 4px #222324, 3px 5px #222324;
}

.sticker-film {
  margin-right: 84px;
  margin-right: 4.7%;
  width: 22.88%;
  animation: leftRight 20s linear infinite;
}


.sticker-crown {
  margin-right: 4px;
  width: 5.57%;
}

.sticker-button {
  width: 14.865%;
}

.sticker-button {
  animation: anim-rotate 3s infinite;
}

.flipX {
  animation: 5s anim-flipX ease infinite;
}

@media (max-width: 1650px) {
  .stiker {
    height: auto;
    /* background-position: top 0px left 235px; */
  }

  .bg img {
    left: 235px;
  }

  .word {
    font-size: 2em;
  }
}

@media (max-width: 1500px) {
  .stiker {
    padding-right: 20px;
    /* background-position: top 0px left 235px; */
  }

  .bg img {
    left: 235px;
  }

  .sticker-film {
    width: 25%;
  }

  .word {
    font-size: 1.7em;
  }
}

@media (max-width: 1200px) {
  .stiker {
    background-position: top 0px left 175px;
  }

  .bg img {
    left: 175px;
  }

  .sticker-film {
    width: 22%;
  }

  .word {
    font-size: 1.5em;
  }
}

@media (max-width: 1024px) {
  .stiker {
    height: 70px;
    background-position: top 0px left 235px;
  }

  .bg img {
    left: 235px;
  }

  .sticker-film {
    display: none;
  }

  .word {
    font-size: 1.7em;
  }

  .stiker-logo {
    width: 25%;
  }

  .sticker-button {
    width: 20%;
  }
}

@media (max-width: 820px) {
  .bg img {
    left: 175px;
  }

  .word {
    font-size: 1.3em;
  }
}

@media (max-width: 650px) {
  .stiker {
    padding: 0 5px;
  }

  .bg img {
    left: 125px;
  }

  .word {
    font-size: 1em;
  }
}

@media (max-width: 510px) {
  .stiker {
    flex-wrap: wrap;
    justify-content: center;
  }

  .bg img {
    left: 7%;
  }

  .stiker-logo {
    margin-right: 20px;
    width: 35%;
  }

  .word {
    order: 1;
    width: 100%;
    text-align: center;
    height: 19px;
  }

  .sticker-button {
    width: 30%;
    animation: anim-rotate 3s infinite;
  }

  .sticker-crown {
    display: none;
  }
}

@media (max-width: 390px) {
  .stiker {
    background-position: top 0px left -9%;
  }

  .bg img {
    left: 0;
  }

  .stiker-logo {
    width: 45%;
  }

  .sticker-button {
    width: 40%;
  }
}


.stiker_text span {
  display: inline-block;
  width: 100%;
  text-align: center;
  transform: scale(1);
}

.stiker-text:after {
  animation: 5s spin infinite;
  content: '';
  transform: scale(1);
}

@keyframes spin {
  0% {
    content: "Никакой рекламы";
    transform: translateY(5px);
  }

  25% {
    content: "Доступ к PREMIUM видео";
  }

  50% {
    content: "Смотри 4K порно";
  }

  75% {
    content: "Скачивай без ограничений";
  }

  100% {
    content: "Никакой рекламы";
  }

}

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

  5% {
    transform: rotate(2deg);
  }

  10% {
    transform: rotate(-2deg);
  }

  15% {
    transform: rotate(2deg);
  }

  20% {
    transform: rotate(-2deg);
  }

  25% {
    transform: rotate(2deg);
  }

  30% {
    transform: rotate(-2deg);
  }

  35% {
    transform: rotate(2deg);
  }

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

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

}

@keyframes anim-borderColor {
  0% {
    border-color: #fdda72;
    background-position: top 4px;
  }

  50% {
    border-color: #f71330;
    background-position: top 4px;
  }

  100% {
    border-color: #fdda72;
  }
}

@keyframes anim-flipX {
  0% {
    opacity: 1;
    transform: rotateX(90def);
  }

  20% {
    opacity: 1;
    transform: rotateX(720deg);
  }

  100% {
    /* animate nothing to pause animation at the end */
    opacity: 1;
    transform: rotateX(720deg);
  }
}

@keyframes anim-Scale {

  0%,
  79.92%,
  83.45%,
  86.58%,
  90.11%,
  93.24%,
  96.77%,
  100% {
    transform: scale(1);
  }

  80.12%,
  83.25%,
  86.78%,
  89.91%,
  93.44%,
  96.57% {
    transform: scale(0.9);
  }
}

@keyframes leftRight {

  0%,
  40%,
  80%,
  100% {
    transform: translateX(5px);
  }


  20%,
  60% {
    transform: translateX(-5px);
  }
}

@keyframes upDown {

  0%,
  40%,
  80%,
  100% {
    transform: translateY(2px);
  }


  20%,
  60% {
    transform: translateY(-2px);
  }
}

@keyframes moving {
  0% {
    transform: translateX(0px)
  }

  50% {
    transform: translateX(10px)
  }

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