/* Estilos para modo de vista de computadora */
@media (min-width: 768px) {
    #letra {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -600%);
      color: #000;
    }
  }
  
  /* Estilos para modo de vista de celular */
  @media (max-width: 767px) {
    #letra {
      position: absolute;
      top: 38%;
      left: 44%;
      transform: translate(-50%, -400%);
      font-size: 14px;
      color: #000;
    }
  }
  
#letra span{
    position: relative;
    display: inline-block;
    font-size: 40px;
    font-family: Quantico;
    animation: anim 3.8s alternate infinite;
    animation-delay: calc(var(--i)*0.5s);
}

@keyframes anim {
    0%{transform: translateY(0) rotate(0)}
    40%{transform: translateY(0) rotate(0deg)}
    50%{transform: translateY(-100px) rotate(18deg)}
    60%{transform: translateY(0) rotate(360deg)}
    100%{transform: translateY(0) rotate(360deg)}
    
}