* {
  margin: 0;
  padding: 0;
}

/* .back-graund {
  background-image: url(./image/Artboard.png);
  background-size: cover;
} */

.body {
  height: 100%;
  overflow-x: hidden;
  /* background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed; */
}

.wrapper {
  position: relative;
  min-height: 100%;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 640px) {
  .wrapper {
    max-width: 640px;
  }
}
@media (min-width: 768px) {
  .wrapper {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {
  .wrapper {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {
  .wrapper {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {
  .wrapper {
    max-width: 1536px;
  }
}

.div-fly-logo {
  padding-top: 30px;
}

.content {
  padding-bottom: 90px;
}

.img-fly-logo {
  width: 160px;
  margin-top: 120px;
}
@media (min-width: 270px) {
  .img-fly-logo {
    padding-left: 5px;
  }
}

.div-boing {
  padding-top: 40px;
  padding-bottom: 40px;
}

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

.img-boing {
  z-index: 20;
  position: relative;
  cursor: pointer;
  transform-origin: top right;
  animation: movePlane 5s infinite ease-in-out;
}

@keyframes movePlane {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}


@media (min-width: 768px) {
  .img-boing {
    width: 40%;
  }
}

@media (min-width: 640px) {
  .img-boing {
    width: 40%;
  }
}

@media (min-width: 768px) {
  .img-cloud-boing {
    width: 60%;
  }
}

@media (min-width: 640px) {
  .img-cloud-boing {
    width: 60%;
  }
}

.stylecss {
  z-index: 10;
  position: absolute;
  top: 56%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 20s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss1 {
  z-index: 10;
  position: absolute;
  top: 56%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 40s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5); //увеличение размера на 1,5 раз
}
.stylecss2 {
  z-index: 10;
  position: absolute;
  top: 56%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 60s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss3 {
  z-index: 10;
  position: absolute;
  top: 56%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 80s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss4 {
  z-index: 10;
  position: absolute;
  top: 56%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 100s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss5 {
  z-index: 10;
  position: absolute;
  top: 57%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 120s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss6 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 140s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss7 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 170s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss8 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 190s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss9 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 210s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss10 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 250s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss11 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 350s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss12 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 400s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss13 {
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 450s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss14 {
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 470s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss15 {
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 480s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss16 {
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 510s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.5);
}
.stylecss17 {
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-origin: center center;
  animation-name: stylecsscloudMovement;
  animation-duration: 550s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  opacity: 0; /* Начально облако будет скрытым */
  transform: scale(3.0);
}


@keyframes stylecsscloudMovement {
  0% {
    transform: translate(-50%, -50%) scale(0);
    opacity: 0;
  }
  5% {
    opacity: 1; /* Появление облака */
  }
  90% {
    transform: translate(-50%, -50%) scale(1);
  }
  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0; /* Исчезновение облака */
  }
}
.stylecss {
  animation-delay: 0s;
}

.stylecss1 {
  animation-delay: 2s;
}
.stylecss2 {
  animation-delay: 5s;
}
.stylecss3 {
  animation-delay: 8s;
}
.stylecss4 {
  animation-delay: 10s;
}
.stylecss5 {
  animation-delay: 13s;
}
.stylecss6 {
  animation-delay: 16s;
}
.stylecss7 {
  animation-delay: 20s;
}
.stylecss8 {
  animation-delay: 23s;
}
.stylecss9 {
  animation-delay: 26s;
}
.stylecss10 {
  animation-delay: 30s;
}
.stylecss11 {
  animation-delay: 35s;
}
.stylecss12 {
  animation-delay: 40s;
}
.stylecss13 {
  animation-delay: 45s;
  
}

/* @supports ((text-stroke: 1px black) or (-webkit-text-stroke: 0.5px black)) {
  .text {
    color: transparent;
    -webkit-text-stroke: 1px white;
    text-stroke: 0.5px white;
    text-shadow: none;
  }
} */