body, html {
    padding: 0;
    margin: 0;
}
.main-container{
    background-image:url('../images/bg.jpg');
    background-repeat:no-repeat;
    background-size:cover; 
    background-position:center;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.logo{
    max-width: 776px;
    width: 100%;
    padding: 0 12px;
    animation: moveUpDown 2s infinite ease-in-out; /* Тривалість та нескінченність */


}
.text{
    max-width: 248px;
    width: 100%;
    padding: 0 12px;
    animation: opacity 2s infinite ease-in-out; /* Тривалість та нескінченність */


}

@keyframes moveUpDown {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-50px) scale(.95); /* Відстань вгору */
    }
    100% {
      transform: translateY(0); /* Повернення до початкової позиції */
    }
  }
  @keyframes opacity {
    0% {
      opacity: .7;
    }
    50% {
      opacity: 1; /* Відстань вгору */
      transform: scale(1.2);
    }
    100% {
        opacity: .7;
    }
  }

  #player{
    transform: scale(.8);
    position: absolute;
    bottom: 16px;
    right: 16px;
  }