.gradient-background {
  background: linear-gradient(300deg, #F1EFEF, #CCC8AA, #7D7C7C);
  background-size: 180% 180%;
  animation: gradient-animation 18s ease infinite;
}

@keyframes gradient-animation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}



.icon-square {
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
}

.profile-img {
  height: 100px;
  border-radius: 50%;
}

.logobody {
  position: fixed;
  top:5%;
  left: 90%;
  width: 500px;
  height: 500px;
  margin-top: -25px;
  margin-left: -25px;
}

.levitate-body:after {
  content: '__________';
  margin: 10px 0 0 0;
  color: #a0c2ce;
  -webkit-filter: blur(2px);
}

.logo {
  border-radius: 50%;
  height: 150px;
  width: 100px;
  text-align: center;
  margin-bottom: 20px;
  overflow: hidden;
  display: inline-block;
}

.levitate i {
  color: #fff;
  font: 700 50px Tahoma;
  
}

.levitate {
  -webkit-animation-name: levitate;
  -webkit-animation-duration: 2.5s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out ease-in-out;
}

@-webkit-keyframes levitate {
  from {
    -webkit-transform: translate(0, 0px);
  }
  45% {
    -webkit-transform: translate(0, 20px);
  }
  to {
    -webkit-transform: translate(0, -0px);
  }
}