html{
    scroll-behavior: smooth;
}
body{
    font-family: 'Quicksand', sans-serif;
    background-color:#eeeff4;
    margin: 0%;
    padding: 0;
}
span{
  color: #3c4499;
}
footer{
    text-align: center;
    color: #3c4499;
    background-color: #bbe9fc;
}
/*cabeçalho principal*/
.container__cabecalho {
    text-align: center;
    padding: 0;
}
.cabecalho{
    max-width: 100%;
    background-image: url(../img/Design\ sem\ nome\(12\).png);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 100%;
    height: 80vh;
    color: #3c4499;
    display: flex;
    justify-content: center;
    align-items: center;
}
.titulo__site{
    font-size: 3.5rem;
    text-align: center;
}
/*conteúdo pessoal*/
.apresentacao{
    padding-top: 2%;
    padding-left: 10%;
    padding-right: 10%;
    font-size: 20px;    
}
.apresentacao__titulo{
    text-align: center;
    padding-top: 2%;
    padding-left: 10%;
    padding-right: 10%;
}
.apresentacao__texto{
    font-size: 20px;
    text-align: justify;
}
/* área de favoritos */
.favoritos__titulo{
    text-align: center;
}
.display__favoritos{
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.musicas__favoritas{
    text-decoration: none;
}
.lista__coisasFavoritas{
    color: black;
    font-size: 20px;
    text-align: justify;
    display: flex;
    flex-direction: column;
}
/*fotos*/
.fotos__pessoais{
    margin-top: 5%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
.fotos__pessoais img{
    max-width: 20%;
    max-height: 20%;
    align-items: center;

}
/* mídias sociais */
.display__flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;

}
.midias-sociais__container {
    
    text-align: center;
    width: 30%;
    background-color: #f6ea7a;
    padding: 2%;
}
.midias-sociais__container-link{
    font-size: 20px;
    text-align: justify;
    color: #3c4499;
    text-decoration: none;
}
/* responsividade */
@media (max-width: 600px) {
    .cabecalho{
        background-repeat: no-repeat;
    }
    .fotos__pessoais{
        display: flex;
        flex-direction: column;
    }
    .fotos__pessoais img{
        max-width: 70%;
    }
    .display__favoritos{
        display: flex;
        flex-direction: column;
        margin-left: 2%;
        margin-right: 4%;
    }
    }
}