body {
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    animation: chromaBackground 20s infinite alternate;
}

.musiccontainer {
    margin-top: 30px;
    width: 600px;
    text-align: center;
    background-color: red;
    padding: 20px;
    color: white;
    margin-bottom: 20px;
}

.musictxt h1 {
    font-size: 36px;
    margin: 0;
}

.descrip {
    margin-top: 10px;
    font-size: 19px;
}

.separator {
    color: red;
    padding: 0 10px;
}

.music {
    display: flex;
    justify-content: space-around;
    margin-top: 20px;
}

.videocontainer {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    background-color: black;
    align-items: center;
    justify-content: center;
}

@keyframes chromaBackground {
    0% { background-color: #00FF00; } 
    25% { background-color: #FF0000; }
    50% { background-color: #0000FF; }
    75% { background-color: #FFFF00; } 
    100% { background-color: #00FF00; }
  }
 
.musictxt:hover {
    animation: spin 1s ease forwards; 
  }
  
  
  @keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
  }

  .animated-text-container {
    text-align: center;
    margin-top: 20px;
}

.animated-text {
    font-size: 32px;
    animation: zoom 10s infinite;
}

@keyframes zoom {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.5);
    }
}

.crazytxt {
    display: inline-block;
    animation: spin 1s infinite linear;
}

@keyframes spin {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}