*{
    padding: 0;
    margin: 0;

}



#hero{
    width: 100vw;
    height: 100vh;
    background: url("../img/hero-desktop.jpg") no-repeat scroll center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


.container {
    perspective: 1000px;
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }
  
  .astronauta{
    width: 200px; /* Ajusta el ancho según tus necesidades */
    height: 200px; /* Ajusta la altura según tus necesidades */
    top:-140px;
    object-fit: cover;
    position: relative;
    animation: floating 5s ease-in-out infinite;
    transform-style: preserve-3d;
  
  }
  

  .ln {
    width: 30px; /* Ajusta el ancho según tus necesidades */
    height: 30px; /* Ajusta la altura según tus necesidades */
    object-fit: cover;
    position: relative;

  }


  
  @keyframes floating {
    0% {
      transform: translate3d(0, 0, 0);
    }
    50% {
      transform: translate3d(0, -20px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }

  @media (max-width: 576px) {
    #hero{

        width: 100vw;
        height: 100vh;
        background: url("../img/hero-movil.jpg") no-repeat scroll center center !important;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
}