html, body{
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: red;
  font-family: 'Playfair Display', serif;
  color:black;
}
ul{
  margin: 0;
  padding: 0;
}
a{
  color: white;
  text-decoration: none;
  font-size: 30px;
-webkit-transition: all 0.5s;
}
a:hover{
  -webkit-transition: all 0.5s;
  text-decoration: none;
  color: grey
  padding:35px;
  font-size: 35px;
}
.nav{
  margin: 0;
  padding: 0;
  background-color: black;
}

.nav-link{
  display: inline-block;
  padding: 25px;
}


.paragraph{
font-size: 35px;
}

.image{
  width: 500px;
  margin-top: 100px;
  border-radius: 20%;
}

.container{
  text-align:center;
  width: 600px;
  margin: 0 auto;

}


.active{
  color: red;
}
.blackicon{
  color: black;
}

.music{
  margin: 25px;

}
.top-left{
  position: absolute;
  top:100px;
  left: 0px;
}

.bio{
  width: 200px;
  border-radius: 20%;
}
.img {
  width: 500px;
  margin-top: 100px;
  border-radius: 20%;
   padding:5px;
   border:20px solid #FFDC30;
}
.ig {
width: 1000px;
margin-top:200px;
border-radius: 40px;
}