@media(max-width: 1627px){
  [class*="spider"], .stat-web-right, .stat-web-left {
    display: none;
  }
}

.stat-web-right {
  background-image: url("/image/event/web-right.png");
  position: absolute;
  background-repeat: inherit;
  background-size: cover;
  width: 15%;
  height: 17.5%;
  right: 0;
  z-index: 100;
}
.stat-web-left {
  background-image: url("/image/event/web-left.png");
  position: absolute;
  background-repeat: inherit;
  background-size: cover;
  width: 15%;
  height: 17.5%;
  left: 0;
  z-index: 100;
}

[class*="spider"] {
    position: absolute;
    height: 40px;
    width: 50px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin: 40px 0 0 0;
    background: #110d04;
  }
  [class*="spider"] *, [class*="spider"]:before, [class*="spider"]:after,
  [class*="spider"] :after,
  [class*="spider"] :before {
    position: absolute;
    content: "";
  }
  [class*="spider"]:before {
    width: 1px;
    background: #aaaaaa;
    left: 50%;
    top: -320px;
    height: 320px;
  }
  [class*="spider"] .eye {
    top: 16px;
    height: 14px;
    width: 12px;
    background: #ffffff;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
  }
  [class*="spider"] .eye:after {
    top: 6px;
    height: 5px;
    width: 5px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: black;
  }
  [class*="spider"] .eye.left {
    left: 14px;
  }
  [class*="spider"] .eye.left:after {
    right: 3px;
  }
  [class*="spider"] .eye.right {
    right: 14px;
  }
  [class*="spider"] .eye.right:after {
    left: 3px;
  }
  [class*="spider"] .leg {
    top: 6px;
    height: 12px;
    width: 14px;
    border-top: 2px solid #110d04;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    z-index: -1;
  }
  [class*="spider"] .leg.left {
    left: -8px;
    -moz-transform-origin: top right;
    -ms-transform-origin: top right;
    -webkit-transform-origin: top right;
    transform-origin: top right;
    -moz-transform: rotate(36deg) skewX(-20deg);
    -ms-transform: rotate(36deg) skewX(-20deg);
    -webkit-transform: rotate(36deg) skewX(-20deg);
    transform: rotate(36deg) skewX(-20deg);
    border-left: 2px solid #110d04;
    -moz-border-radius: 60% 0 0 0;
    -webkit-border-radius: 60%;
    border-radius: 60% 0 0 0;
    -moz-animation: legs-wriggle-left 1s 0s infinite;
    -webkit-animation: legs-wriggle-left 1s 0s infinite;
    animation: legs-wriggle-left 1s 0s infinite;
  }
  [class*="spider"] .leg.right {
    right: -8px;
    -moz-transform-origin: top left;
    -ms-transform-origin: top left;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -moz-transform: rotate(-36deg) skewX(20deg);
    -ms-transform: rotate(-36deg) skewX(20deg);
    -webkit-transform: rotate(-36deg) skewX(20deg);
    transform: rotate(-36deg) skewX(20deg);
    border-right: 2px solid #110d04;
    -moz-border-radius: 0 60% 0 0;
    -webkit-border-radius: 0;
    border-radius: 0 60% 0 0;
    -moz-animation: legs-wriggle-right 1s 0.2s infinite;
    -webkit-animation: legs-wriggle-right 1s 0.2s infinite;
    animation: legs-wriggle-right 1s 0.2s infinite;
  }
  [class*="spider"] .leg:nth-of-type(2) {
    top: 14px;
    left: -11px;
    -moz-animation: legs-wriggle-left 1s 0.8s infinite;
    -webkit-animation: legs-wriggle-left 1s 0.8s infinite;
    animation: legs-wriggle-left 1s 0.8s infinite;
  }
  [class*="spider"] .leg:nth-of-type(3) {
    top: 22px;
    left: -12px;
    -moz-animation: legs-wriggle-left 1s 0.2s infinite;
    -webkit-animation: legs-wriggle-left 1s 0.2s infinite;
    animation: legs-wriggle-left 1s 0.2s infinite;
  }
  [class*="spider"] .leg:nth-of-type(4) {
    top: 31px;
    left: -10px;
    -moz-animation: legs-wriggle-left 1s 0.4s infinite;
    -webkit-animation: legs-wriggle-left 1s 0.4s infinite;
    animation: legs-wriggle-left 1s 0.4s infinite;
  }
  [class*="spider"] .leg:nth-of-type(6) {
    top: 14px;
    right: -11px;
    -moz-animation: legs-wriggle-right 1s 0.4s infinite;
    -webkit-animation: legs-wriggle-right 1s 0.4s infinite;
    animation: legs-wriggle-right 1s 0.4s infinite;
  }
  [class*="spider"] .leg:nth-of-type(7) {
    top: 22px;
    right: -12px;
    -moz-animation: legs-wriggle-right 1s 0.7s infinite;
    -webkit-animation: legs-wriggle-right 1s 0.7s infinite;
    animation: legs-wriggle-right 1s 0.7s infinite;
  }
  [class*="spider"] .leg:nth-of-type(8) {
    top: 31px;
    right: -10px;
    -moz-animation: legs-wriggle-right 1s 0.3s infinite;
    -webkit-animation: legs-wriggle-right 1s 0.3s infinite;
    animation: legs-wriggle-right 1s 0.3s infinite;
  }
  
  .spider_0 {
    left: 5%;
    -moz-animation: spider-move-0 5s infinite;
    -webkit-animation: spider-move-0 5s infinite;
    animation: spider-move-0 5s infinite;
  }
  
  .spider_1 {
    left: 20%;
    -moz-animation: spider-move-1 5s infinite;
    -webkit-animation: spider-move-1 5s infinite;
    animation: spider-move-1 5s infinite;
  }
  
  .spider_2 {
    left: 35%;
    -moz-animation: spider-move-2 5s infinite;
    -webkit-animation: spider-move-2 5s infinite;
    animation: spider-move-2 5s infinite;
  }
  
  .spider_3 {
    right: 35%;
    margin-top: 160px;
    -moz-animation: spider-move-3 5s infinite;
    -webkit-animation: spider-move-3 5s infinite;
    animation: spider-move-3 5s infinite;
  }
  
  .spider_4 {
    right: 20%;
    margin-top: 50px;
    -moz-animation: spider-move-4 5s infinite;
    -webkit-animation: spider-move-4 5s infinite;
    animation: spider-move-4 5s infinite;
  }
  
  .spider_5 {
    right: 5%;
    margin-top: 210px;
    -moz-animation: spider-move-5 5s infinite;
    -webkit-animation: spider-move-5 5s infinite;
    animation: spider-move-5 5s infinite;
  }
  
  .web-right {
    position: absolute;
    height: 200px;
    width: auto;
    right: -10px;
    top: -10px;
    z-index: -1;
    opacity: 0.2;
  }
  
  .web-left {
    position: absolute;
    left: -10px;
    top: -10px;
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    z-index: -1;
    opacity: 0.2;
  }
  
  @-moz-keyframes flicker {
    0%,
      6%,
      12% {
      text-shadow: none;
      color: #111111;
    }
    3%,
      9% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6);
      color: #fa6701;
    }
    60% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6), 0 0 16px rgba(250, 103, 1, 0.4), 0 0 20px rgba(255, 0, 84, 0.2), 0 0 22px rgba(255, 0, 84, 0.1);
      color: #fa6701;
    }
    100% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6), 0 0 16px rgba(250, 103, 1, 0.4), 0 0 20px rgba(255, 0, 84, 0.2), 0 0 22px rgba(255, 0, 84, 0.1);
      color: #fa6701;
    }
  }
  @-webkit-keyframes flicker {
    0%,
      6%,
      12% {
      text-shadow: none;
      color: #111111;
    }
    3%,
      9% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6);
      color: #fa6701;
    }
    60% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6), 0 0 16px rgba(250, 103, 1, 0.4), 0 0 20px rgba(255, 0, 84, 0.2), 0 0 22px rgba(255, 0, 84, 0.1);
      color: #fa6701;
    }
    100% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6), 0 0 16px rgba(250, 103, 1, 0.4), 0 0 20px rgba(255, 0, 84, 0.2), 0 0 22px rgba(255, 0, 84, 0.1);
      color: #fa6701;
    }
  }
  @keyframes flicker {
    0%,
      6%,
      12% {
      text-shadow: none;
      color: #111111;
    }
    3%,
      9% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6);
      color: #fa6701;
    }
    60% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6), 0 0 16px rgba(250, 103, 1, 0.4), 0 0 20px rgba(255, 0, 84, 0.2), 0 0 22px rgba(255, 0, 84, 0.1);
      color: #fa6701;
    }
    100% {
      text-shadow: 0 0 8px rgba(250, 103, 1, 0.6), 0 0 16px rgba(250, 103, 1, 0.4), 0 0 20px rgba(255, 0, 84, 0.2), 0 0 22px rgba(255, 0, 84, 0.1);
      color: #fa6701;
    }
  }
  @-moz-keyframes legs-wriggle-left {
    0%,
      100% {
      -moz-transform: rotate(36deg) skewX(-20deg);
      transform: rotate(36deg) skewX(-20deg);
    }
    25%,
      75% {
      -moz-transform: rotate(15deg) skewX(-20deg);
      transform: rotate(15deg) skewX(-20deg);
    }
    50% {
      -moz-transform: rotate(45deg) skewX(-20deg);
      transform: rotate(45deg) skewX(-20deg);
    }
  }
  @-webkit-keyframes legs-wriggle-left {
    0%,
      100% {
      -webkit-transform: rotate(36deg) skewX(-20deg);
      transform: rotate(36deg) skewX(-20deg);
    }
    25%,
      75% {
      -webkit-transform: rotate(15deg) skewX(-20deg);
      transform: rotate(15deg) skewX(-20deg);
    }
    50% {
      -webkit-transform: rotate(45deg) skewX(-20deg);
      transform: rotate(45deg) skewX(-20deg);
    }
  }
  @keyframes legs-wriggle-left {
    0%,
      100% {
      -moz-transform: rotate(36deg) skewX(-20deg);
      -ms-transform: rotate(36deg) skewX(-20deg);
      -webkit-transform: rotate(36deg) skewX(-20deg);
      transform: rotate(36deg) skewX(-20deg);
    }
    25%,
      75% {
      -moz-transform: rotate(15deg) skewX(-20deg);
      -ms-transform: rotate(15deg) skewX(-20deg);
      -webkit-transform: rotate(15deg) skewX(-20deg);
      transform: rotate(15deg) skewX(-20deg);
    }
    50% {
      -moz-transform: rotate(45deg) skewX(-20deg);
      -ms-transform: rotate(45deg) skewX(-20deg);
      -webkit-transform: rotate(45deg) skewX(-20deg);
      transform: rotate(45deg) skewX(-20deg);
    }
  }
  @-moz-keyframes legs-wriggle-right {
    0%,
      100% {
      -moz-transform: rotate(-36deg) skewX(20deg);
      transform: rotate(-36deg) skewX(20deg);
    }
    25%,
      75% {
      -moz-transform: rotate(-15deg) skewX(20deg);
      transform: rotate(-15deg) skewX(20deg);
    }
    50% {
      -moz-transform: rotate(-45deg) skewX(20deg);
      transform: rotate(-45deg) skewX(20deg);
    }
  }
  @-webkit-keyframes legs-wriggle-right {
    0%,
      100% {
      -webkit-transform: rotate(-36deg) skewX(20deg);
      transform: rotate(-36deg) skewX(20deg);
    }
    25%,
      75% {
      -webkit-transform: rotate(-15deg) skewX(20deg);
      transform: rotate(-15deg) skewX(20deg);
    }
    50% {
      -webkit-transform: rotate(-45deg) skewX(20deg);
      transform: rotate(-45deg) skewX(20deg);
    }
  }
  @keyframes legs-wriggle-right {
    0%,
      100% {
      -moz-transform: rotate(-36deg) skewX(20deg);
      -ms-transform: rotate(-36deg) skewX(20deg);
      -webkit-transform: rotate(-36deg) skewX(20deg);
      transform: rotate(-36deg) skewX(20deg);
    }
    25%,
      75% {
      -moz-transform: rotate(-15deg) skewX(20deg);
      -ms-transform: rotate(-15deg) skewX(20deg);
      -webkit-transform: rotate(-15deg) skewX(20deg);
      transform: rotate(-15deg) skewX(20deg);
    }
    50% {
      -moz-transform: rotate(-45deg) skewX(20deg);
      -ms-transform: rotate(-45deg) skewX(20deg);
      -webkit-transform: rotate(-45deg) skewX(20deg);
      transform: rotate(-45deg) skewX(20deg);
    }
  }
  @-moz-keyframes spider-move-0 {
    0%,
          100% {
      margin-top: 207px;
    }
    39% {
      margin-top: calc(207px + 97px);
    }
  }
  @-webkit-keyframes spider-move-0 {
    0%,
          100% {
      margin-top: 207px;
    }
    39% {
      margin-top: calc(207px + 97px);
    }
  }
  @keyframes spider-move-0 {
    0%,
          100% {
      margin-top: 207px;
    }
    39% {
      margin-top: calc(207px + 97px);
    }
  }
  @-moz-keyframes spider-move-1 {
    0%,
          100% {
      margin-top: 83px;
    }
    43% {
      margin-top: calc(83px + 73px);
    }
  }
  @-webkit-keyframes spider-move-1 {
    0%,
          100% {
      margin-top: 83px;
    }
    43% {
      margin-top: calc(83px + 73px);
    }
  }
  @keyframes spider-move-1 {
    0%,
          100% {
      margin-top: 83px;
    }
    43% {
      margin-top: calc(83px + 73px);
    }
  }
  @-moz-keyframes spider-move-2 {
    0%,
          100% {
      margin-top: 49px;
    }
    59% {
      margin-top: calc(49px + 38px);
    }
  }
  @-webkit-keyframes spider-move-2 {
    0%,
          100% {
      margin-top: 49px;
    }
    59% {
      margin-top: calc(49px + 38px);
    }
  }
  @keyframes spider-move-2 {
    0%,
          100% {
      margin-top: 49px;
    }
    59% {
      margin-top: calc(49px + 38px);
    }
  }
  @-moz-keyframes spider-move-3 {
    0%,
          100% {
      margin-top: 47px;
    }
    33% {
      margin-top: calc(47px + 61px);
    }
  }
  @-webkit-keyframes spider-move-3 {
    0%,
          100% {
      margin-top: 47px;
    }
    33% {
      margin-top: calc(47px + 61px);
    }
  }
  @keyframes spider-move-3 {
    0%,
          100% {
      margin-top: 47px;
    }
    33% {
      margin-top: calc(47px + 61px);
    }
  }
  @-moz-keyframes spider-move-4 {
    0%,
          100% {
      margin-top: 170px;
    }
    68% {
      margin-top: calc(170px + 73px);
    }
  }
  @-webkit-keyframes spider-move-4 {
    0%,
          100% {
      margin-top: 170px;
    }
    68% {
      margin-top: calc(170px + 73px);
    }
  }
  @keyframes spider-move-4 {
    0%,
          100% {
      margin-top: 170px;
    }
    68% {
      margin-top: calc(170px + 73px);
    }
  }
  @-moz-keyframes spider-move-5 {
    0%,
          100% {
      margin-top: 141px;
    }
    50% {
      margin-top: calc(141px + 52px);
    }
  }
  @-webkit-keyframes spider-move-5 {
    0%,
          100% {
      margin-top: 141px;
    }
    50% {
      margin-top: calc(141px + 52px);
    }
  }
  @keyframes spider-move-5 {
    0%,
          100% {
      margin-top: 141px;
    }
    50% {
      margin-top: calc(141px + 52px);
    }
  }


  .promo-line{
    background-position: center center;
    width: 100%;
    height: 25px!important;
}

@media(min-width: 996px){
    .promo-line{
        height: 40px!important;
    }
}

.special-promo{
    position: absolute;
    top:  2%;
    left: 2%;
    z-index: 4;
}
.special-promo span{
    color: white;
    background: #b98a09;
    padding-left: 6%;
    padding-right: 6%;
    border-radius: 8px;
    padding-top: 2px;
    padding-bottom: 2px;
    width: 100%;
    text-wrap: nowrap;
    font-family: RozetkaWeb-Regular;
    font-size: 12px;
    font-weight: 400;

}
