.globe-image {
  width: 220px;
  z-index: 1;
  position: absolute;
  margin-top: 125px;
  margin-left: -35px;
  -webkit-animation: spin 40s linear infinite;
  animation: spin 40s linear infinite;
}

@-webkit-keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
.boy-image {
  width: 320px;
  height: 520px;
  z-index: 5;
  position: absolute;
}

.dotted-circle-ring-image {
  width: 290px;
  position: absolute;
  z-index: 1;
  margin-top: 95px;
  margin-left: -60px;
}

.link-image {
  z-index: 3;
  position: absolute;
  margin-top: 145px;
  margin-left: 105px;
  -webkit-animation: flo-y 3s linear infinite;
  animation: flo-y 3s linear infinite;
}

@-webkit-keyframes flo-y {
  50% {
    transform: translateY(-7px);
  }
}

@keyframes flo-y {
  50% {
    transform: translateY(-7px);
  }
}
.message-image {
  z-index: 3;
  position: absolute;
  margin-top: 129px;
  margin-left: 20px;
  -webkit-animation: flo-x 3s linear infinite;
  animation: flo-x 3s linear infinite;
}

@-webkit-keyframes flo-x {
  50% {
    transform: translateX(-7px);
  }
}

@keyframes flo-x {
  50% {
    transform: translateX(-7px);
  }
}
.fling-plane-image {
  z-index: 1;
  position: absolute;
  margin-left: -198px;
  margin-top: 190px;
}

.list-image {
  width: 35px;
  z-index: 1;
  position: absolute;
  margin-left: -10px;
  margin-top: 335px;
  -webkit-animation: scale 2s linear infinite;
  animation: scale 2s linear infinite;
}

@-webkit-keyframes scale {
  50% {
    transform: scale(1.15);
  }
}

@keyframes scale {
  50% {
    transform: scale(1.15);
  }
}
.girl-image {
  width: 55px;
  z-index: 1;
  position: absolute;
  margin-left: -80px;
  margin-top: 260px;
  -webkit-animation: scale 2s linear infinite;
  animation: scale 2s linear infinite;
}

.chatting-image {
  z-index: 1;
  position: absolute;
  margin-left: -117px;
  margin-top: 320px;
  -webkit-animation: ring 6s 0.7s ease-in-out infinite;
  animation: ring 6s 0.7s ease-in-out infinite;
}

@-webkit-keyframes ring {
  0% {
    transform: rotate(0);
  }
  1% {
    transform: rotate(30deg);
  }
  3% {
    transform: rotate(-28deg);
  }
  5% {
    transform: rotate(34deg);
  }
  7% {
    transform: rotate(-32deg);
  }
  9% {
    transform: rotate(30deg);
  }
  11% {
    transform: rotate(-28deg);
  }
  13% {
    transform: rotate(26deg);
  }
  15% {
    transform: rotate(-24deg);
  }
  17% {
    transform: rotate(22deg);
  }
  19% {
    transform: rotate(-20deg);
  }
  21% {
    transform: rotate(18deg);
  }
  23% {
    transform: rotate(-16deg);
  }
  25% {
    transform: rotate(14deg);
  }
  27% {
    transform: rotate(-12deg);
  }
  29% {
    transform: rotate(10deg);
  }
  31% {
    transform: rotate(-8deg);
  }
  33% {
    transform: rotate(6deg);
  }
  35% {
    transform: rotate(-4deg);
  }
  37% {
    transform: rotate(2deg);
  }
  39% {
    transform: rotate(-1deg);
  }
  41% {
    transform: rotate(1deg);
  }
  43% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(0);
  }
}

@keyframes ring {
  0% {
    transform: rotate(0);
  }
  1% {
    transform: rotate(30deg);
  }
  3% {
    transform: rotate(-28deg);
  }
  5% {
    transform: rotate(34deg);
  }
  7% {
    transform: rotate(-32deg);
  }
  9% {
    transform: rotate(30deg);
  }
  11% {
    transform: rotate(-28deg);
  }
  13% {
    transform: rotate(26deg);
  }
  15% {
    transform: rotate(-24deg);
  }
  17% {
    transform: rotate(22deg);
  }
  19% {
    transform: rotate(-20deg);
  }
  21% {
    transform: rotate(18deg);
  }
  23% {
    transform: rotate(-16deg);
  }
  25% {
    transform: rotate(14deg);
  }
  27% {
    transform: rotate(-12deg);
  }
  29% {
    transform: rotate(10deg);
  }
  31% {
    transform: rotate(-8deg);
  }
  33% {
    transform: rotate(6deg);
  }
  35% {
    transform: rotate(-4deg);
  }
  37% {
    transform: rotate(2deg);
  }
  39% {
    transform: rotate(-1deg);
  }
  41% {
    transform: rotate(1deg);
  }
  43% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(0);
  }
}
.red-chatting-image {
  width: 50px;
  z-index: 1;
  position: absolute;
  margin-top: 120px;
  margin-left: -60px;
  -webkit-animation: scale 2s linear infinite;
  animation: scale 2s linear infinite;
}

.man-in-yellow-image {
  z-index: 1;
  position: absolute;
  margin-top: 58px;
  margin-left: -125px;
  -webkit-animation: scale 2s linear infinite;
  animation: scale 2s linear infinite;
}

.happy-girl-image {
  z-index: 1;
  position: absolute;
  margin-top: 65px;
  margin-left: 65px;
  -webkit-animation: scale 2s linear infinite;
  animation: scale 2s linear infinite;
} /*# sourceMappingURL=style.css.map */