.loaddot-container {
    display:flex;
    gap: 2px;
    scale: 0.7;
    margin-bottom: -6px;
    position: absolute;
    width: 50%;
    .loaddot {
      aspect-ratio: 1/1;
      width: 100%;
      border-radius: 50%; 
      background-color: rgba(255, 255, 255, .85);
      animation: translation 800ms linear infinite;
      border: 1px solid $font_color_secondary;
      box-shadow: 
      8px 8px 16px rgba(0,0,0, .12), 
      4px 4px 4px rgba(0,0,0, .12);

      &:nth-child(2) {
        animation-delay: 200ms;
      }
      &:nth-child(3) {
        animation-delay: 400ms;
      }
    }
    @keyframes translation {
      0%{
        transform: translateY(0);
      }
    
      50% {
        transform: translateY(-15px);
      }
    }
  }