@keyframes cyanAnimation {
    0%   {bottom: -120px; left: -150px;}
    25%  {bottom: -200px; left: 80px;}
    50%  {bottom: -150px; left: 200px;}
    100% {bottom: 200px; left: 140px;}
  }

  @keyframes amberBottomAnimation {
    0%   {bottom: -120px; right: 60px;}
    25%  {bottom: -200px; right: 180px;}
    50%  {bottom: -350px; right: 100px;}
    100% {bottom: -300px; right: 240px;}
  }

  @keyframes orangeTopAnimation {
    0%   {top: -120px; right: 60px;}
    25%  {top: -200px; right: 180px;}
    50%  {top: -350px; right: 100px;}
    100% {top: -300px; right: 240px;}
  }

.anima {
  animation-timing-function: ease-in-out;
  animation-direction: alternate-reverse;
  animation-iteration-count: infinite;
  animation-duration: 9s;
}

.bottomContact {
  bottom: 8%;
}

.cyanCircle {
    animation-name: cyanAnimation;
    
}

.amberBottomCircle {
  animation-name: amberBottomAnimation;
}

.orangeTopCircle {
  animation-name: orangeTopAnimation;
}

.font-inter {
  font-family: 'Inter', sans-serif;
}

.font-inconsolata{
  font-family: 'Inconsolata', monospace;
}

#buttonMail::selection {
  color: white;
  background: rgb(253, 165, 41);
  padding: 3px;
}