@font-face {
    font-family: poppinsbold;
    src: url(Poppins-Bold.ttf);
  }

@font-face {
    font-family: poppinsreg;
    src: url(Poppins-Regular.ttf);
  }

@font-face {
    font-family: poppinsmed;
    src: url(Poppins-Medium.ttf);
  }

@font-face {
    font-family: poppinssemibold;
    src: url(Poppins-SemiBold.ttf);
  }

body {
    background-image: url('bg.png');
    background-size: cover;
    padding-left: 5%;
    padding-right: 5%;
}

header {
    box-shadow: 2px 2px 4px #000000;
    background-color: black;
    color: white;
    border-radius: 10px;
        padding-left: 5%;
    padding-right: 5%;
    width: 492px;
}

h1, h2, h3, h4, h5, h6{
    font-family: poppinsbold;
}

a {
    font-family: poppinsbold;
    color: white;
}

p {
    font-family: poppinsreg;
}

div.intro {
    background-color: #ffffff;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    max-width: 960px;
    border-radius: 10px;
    color:#000000;
    box-shadow: 2px 2px 4px #000000;
  }

  footer {
    font-family: poppinsreg;
    background-color: #000000;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    max-width: 960px;
    border-radius: 10px;
    color:#ffffff;
    box-shadow: 2px 2px 4px #000000;
  }


div.yt {
    background-color: #d41a1a;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    padding-bottom: 10px;
    max-width: 960px;
    border-radius: 10px;
    color:#ffffff;
    box-shadow: 2px 2px 4px #000000;
  }

 div.music {
    background-color: #028157;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    padding-bottom: 10px;
    max-width: 960px;
    border-radius: 10px;
    color:#ffffff;
    box-shadow: 2px 2px 4px #000000;
  } 

div.mail {
    background-color: #1ad4ac;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    max-width: 960px;
    border-radius: 10px;
    box-shadow: 2px 2px 4px #000000;
  }