body {
    background-color: rgb(7, 3, 3);
    text-align: center;  
    display: table;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    font-family: 'Courier New', Courier, monospace, white;
    width: 100%;
    max-width: 800px;
  }
  .backgrounds {
    width: 100%;
    height: auto;
  }
div {
    color: white;
  }

  .name {
    position: sticky;
    top: 0;
    background-color: rgb(7, 3, 3);
    text-align: left;
    font-size: clamp(10px, 3.5vw, 25px);
    font-weight: bold;
    z-index: 1;
  }

.container-header {
    position: relative;
    text-align: center;
    color: rgb(255, 255, 255);
  }
  .centered {
    position: absolute;
    opacity: 80%;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: clamp(10px, 7vw, 70px);
    font-weight: bold;
    text-shadow: -2px 2px 0 #000,
    2px 2px 0 #000,
    2px -2px 0 #000,
    -2px -2px 0 #000;
  }

  .container-music {
    position: relative;
    display: flex;
    flex-direction: column;
    text-align: center;
  }
  .musicicons {
    margin-top: 3vw;
    margin-bottom: 1vw;
    width:auto;
    height:10vw;
  }
  .musiciconstext {
    font-weight: bolder;
    font-size: clamp(10px, 3vw, 30px);
  }

  .container-bio {
    position: relative;
    text-align: center;
    color: white;
    background-image: url(backgrounds/background2.jpg);
    background-size: cover;
    background-position-x: center;
  }

  .titles {   
  position: relative;
  text-align: center;
  font-size: clamp(10px, 5vw, 50px);
  font-weight: bold;
  margin-top: 2vw;
  text-shadow: -1.5px 1.5px #000,
  1.5px 1.5px #000,
  1.5px -1.5px #000,
  -1.5px -1.5px #000;
}
.subtitles {   
    position: relative;
    text-align: center;
    font-size: 3vw;
    text-shadow: -1px 1px 0 #000,
    1px 1px 0 #000,
    1px -1px 0 #000,
    -1px -1px 0 #000;
  }
  .text {
    font-size: clamp(10px, 3vw, 22px);
    background-color: hsla(0, 0%, 0%, 0.7);
    margin: 0vw 5vw;
    font-weight: bold;
  }

  .container-bands {
    position: relative;
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-bottom: 3vw;
    background-image: url(backgrounds/background3.jpg);
    background-size: cover;
    background-position-x: center;
  }
  .bands {
    display:flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    font-size: clamp(10px, 5vw, 50px);
    font-weight: bold;
    text-shadow: -2px 2px 0 #000,
    2px 2px 0 #000,
    2px -2px 0 #000,
    -2px -2px 0 #000;
  }

  .contacts {
    font-size: clamp(10px, 3vw, 30px);
    color: black;
    font-weight: bolder;
    background-color: hsla(0, 0%, 100%, 0.7);
  }
  .container-contacts {
    display:flex;
    justify-content: center;
    background-color: hsla(0, 0%, 100%, 0.7);
  }

  .cv {
    font-size: clamp(10px, 3vw, 22px);
    color: black;
    text-align: left;
    background-color: hsla(0, 0%, 100%, 0.918);
    padding: 0vw 5vw;
  } 
