.awesome-banner-eshop {
  background: #04cc7d url("../images/awesome-banner-eshop/bg.png") right bottom
    no-repeat;
  background-size: auto 100%;
  color: #fff !important;
}

.awesome-banner-eshop__dec-01 {
  left: 9.5%;
  bottom: 24.4%;
  width: 18em;
  height: 20.1em;
  background-image: url("../images/awesome-banner-eshop/dec-01.png");
}

.awesome-banner-eshop__dec-02 {
  left: 30.7%;
  bottom: 4%;
  width: 16em;
  height: 20.1em;
  background-image: url("../images/awesome-banner-eshop/dec-02.png");
}

.awesome-banner-eshop__dec-03 {
  right: 6.3%;
  top: 6.1%;
  width: 21.5em;
  height: 17.9em;
  background-image: url("../images/awesome-banner-eshop/dec-03.png");
}

.awesome-banner-eshop__dec-04 {
  right: 7%;
  bottom: 13.7%;
  width: 12.6em;
  height: 9.1em;
  background-image: url("../images/awesome-banner-eshop/dec-04.png");
}

.awesome-banner-eshop__animation {
  width: 31em;
  height: 36.7em;
  left: 50%;
  top: 50%;
  margin: -17.2em 0 0 -11.7em;
}

.awesome-banner-eshop__animation-el-01,
.awesome-banner-eshop__animation-el-04,
.awesome-banner-eshop__animation-el-05,
.awesome-banner-eshop__animation-el-06,
.awesome-banner-eshop__animation-el-07,
.awesome-banner-eshop__animation-el-08 {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.awesome-banner-eshop__animation-el-01 {
  background-image: url("../images/awesome-banner-eshop/01.png");
  opacity: 0;
}

.awesome-banner-eshop__animation-el-02 {
  left: 20.3%;
  top: 12.2%;
  width: 19.1em;
  height: 25.5em;
  background-image: url("../images/awesome-banner-eshop/02.png");
  transform: scale(0);
}

.awesome-banner-eshop__animation-el-03 {
  right: 0;
  top: 42.8%;
  width: 15.3em;
  height: 8.2em;
}

.awesome-banner-eshop__animation-el-03-01,
.awesome-banner-eshop__animation-el-03-02,
.awesome-banner-eshop__animation-el-03-03 {
  transform: translateY(4em);
  opacity: 0;
}

.awesome-banner-eshop__animation-el-03-01 {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url("../images/awesome-banner-eshop/03-01.png");
}

.awesome-banner-eshop__animation-el-03-02 {
  left: 34.4%;
  top: 31.2%;
  width: 4em;
  height: 3.3em;
  background-image: url("../images/awesome-banner-eshop/03-02.png");
}

.awesome-banner-eshop__animation-el-03-03 {
  left: 55.5%;
  top: 26.2%;
  width: 1.7em;
  height: 1.4em;
  background-image: url("../images/awesome-banner-eshop/03-03.png");
}

.awesome-banner-eshop__animation-el-03-04 {
  right: 9%;
  bottom: -20%;
  width: 3.2em;
  height: 4.9em;
  background-image: url("../images/awesome-banner-eshop/03-04.png");
  transform: scale(0);
}

.awesome-banner-eshop__animation-el-04 {
  z-index: -1;
  background-image: url("../images/awesome-banner-eshop/04.png");
  opacity: 0;
  transform: translateY(8em);
}

.awesome-banner-eshop__animation-el-05 {
  background-image: url("../images/awesome-banner-eshop/05.png");
  transform: scale(0);
}

.awesome-banner-eshop__animation-el-06 {
  background-image: url("../images/awesome-banner-eshop/06.png");
  transform: scale(0);
}

.awesome-banner-eshop__animation-el-07 {
  background-image: url("../images/awesome-banner-eshop/07.png");
  transform: scale(0);
}

.awesome-banner-eshop__animation-el-08 {
  background-image: url("../images/awesome-banner-eshop/08.png");
  transform: scale(0);
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-01 {
  transition: 0.5s linear;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-02 {
  transition: 0.35s linear;
  transition-delay: 0.6s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-03-01 {
  transition: 0.25s linear;
  transition-delay: 1.2s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-03-02 {
  transition: 0.25s linear;
  transition-delay: 1.4s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-03-03 {
  transition: 0.25s linear;
  transition-delay: 1.6s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-03-04 {
  transition: 0.15s linear;
  transition-delay: 2s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-05 {
  transition: 0.5s linear;
  transition-delay: 2.9s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-06 {
  transition: 0.5s linear;
  transition-delay: 3.2s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-07 {
  transition: 0.5s linear;
  transition-delay: 3.5s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-08 {
  transition: 0.5s linear;
  transition-delay: 3.8s;
}

.awesome-banner-eshop.is-animate .awesome-banner-eshop__animation-el-04 {
  transition: 0.5s linear;
  transition-delay: 4.2s;
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-01 {
  opacity: 1;
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-02 {
  transform: scale(1);
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-03-01,
.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-03-02,
.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-03-03 {
  transform: translateY(0);
  opacity: 1;
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-03-04 {
  transform: scale(1);
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-04 {
  transform: translateY(0);
  opacity: 1;
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-05,
.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-06,
.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-07,
.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-08 {
  transform: scale(1);
}

.awesome-banner-eshop.is-animated .awesome-banner-eshop__animation-el-03 {
  animation: 0.3s awesome-banner-eshop-press 2.5s linear;
}

@keyframes awesome-banner-eshop-press {
  50% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}

@media (max-width: 1023px) {
  .awesome-banner-eshop__dec-01 {
    left: 4%;
  }

  .awesome-banner-eshop__dec-02 {
    left: 20%;
  }

  .awesome-banner-eshop__animation {
    margin-left: -14.7em;
  }
}

@media (max-width: 480px) {
  .awesome-banner-eshop__animation {
    font-size: 6px;
    margin-top: -19em;
  }
}
