@font-face {
  font-family: "Genos";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/genos/v2/SlGNmQqPqpUOYTYjacb0Hc91fTwVqkjYqki9CbN8A797.woff)
    format("woff");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}


body {
    background:rgb(20, 16, 245);
    animation: bgColor 20s infinite;
}
@keyframes bgColor {
  0% {
    background: rgb(20, 16, 245);
  }
  50% {
    background: #abdef8;
  }
  100% {
    background: rgb(20, 16, 245);
  }
}
    





div {
    background:rgb(14, 182, 253);

}

 .music1 {
    background: rgb(18, 168, 233);
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
    font-family:'Courier New', Courier, monospace;
    font-size: 20px;
    text-align: center;


}

.row {
    display: inline;
}


h1 {
    text-transform: uppercase;
    font-family: "Genos", monospace;
    font-size: 60px;
    text-align: center;
}

img {
    max-width: 50%;
    margin: 0 auto;
}

video {
    max-width: 80%;
}

audio {
    margin: 0 auto;
}





footer {
    background: rgb(212, 129, 253);
    color: aliceblue;
    margin-top: 3rem;
    text-align: center;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 16px;
}