/*Reset*/
a {
    text-decoration: none;
    color: inherit;
}

button {
    background: transparent;
    border: none;
    color: inherit;
    padding: 0px;
    font-size: inherit;

}

/*Variaveis globais*/
:root {
    --azul-escuro: #041833;
    --azul-medio: #154580;
    --azul-degrade: linear-gradient(180deg, var(--azul-medio) 0%, var(--azul-escuro) 100%);
    --verde: #84EEC1;
    --cinza: rgba(196, 196, 196, 0.2);
    --cor-textos: #ffffff;
    --fonte-textos: 'Open Sans', sans-serif;
}

* {
    box-sizing: border-box;
}

body {
    color: var(--cor-textos);
    background: var(--azul-degrade);
    font-family: var(--fonte-textos);
}

.container {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    
}


/*Aside*/
.menu-lateral {
    background-color: var(--azul-escuro);
    padding: 2.5rem .5rem 0;
    font-weight: 600;
    letter-spacing: 2px;
    width: 230px;
}

.menu-lateral__link::before  {
    padding-left: 1rem;
    padding-right: .5rem;
    vertical-align: middle;
}

.menu-lateral__link {
    font-family: var(--fonte-textos);
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: .5rem;
}

.ativo {
    background-color: var(--azul-medio);
    border-radius: 5px;
    padding: .75rem 0;
}

.menu-lateral__link--home::before {
    content: url("../img/icone-home.svg");
}

.menu-lateral__link--busca::before {
    content: url("../img/icone-busca.svg");
}

.menu-lateral__link--biblioteca::before {
    content: url("../img/icone-biblioteca.svg");
}

.menu-lateral__playlist {
    text-transform: uppercase;
    padding-left: 1rem;
}

.menu-lateral__link--playlist::before {
    content: url("../img/icone-add_box.svg");
}

.menu-lateral__link--podcasts::before {
    content: url("../img/icone-stars.svg");
}

/*Header*/
.cabecalho {
    padding-top: 2.5rem;
}

.cabecalho__botao:nth-of-type(1) {
    margin-right: 1rem;
}

/*Main*/

/*Estilos compartilhados pelos elementos presentes na seção horizontal e elementos da seção vertical*/
.secao__titulo {
    font-weight: 700;
    font-size: 1.5rem;
}

.cartao__titulo{
    font-weight: 700;
    line-height: 22px;
}

.cartao__subtitulo {
    font-size: 14px;
}

/*Seção horizontal*/

.secao-horizontal .cartao {
    background: var(--cinza);
    border-radius: 10px;
}

.secao-horizontal .cartao__imagem {
    height: 72px;
}

.secao-horizontal .cartao__player {
    width: 164px;
    height: 4px;
    background: white;
    border-radius: 10px;
}

.secao-horizontal .cartao__botao {
    width: 70px;
}


/*Seção vertical*/
.secao-vertical .cartao {
    background: rgba(196, 196, 196, 0.2);
    border-radius: 10px;
    padding: 1rem;
    padding: 1rem;
}

.secao-vertical .cartao__imagem {
    height: 133px;
    margin-bottom: .5rem;
}
.secao-vertical .cartao__subtitulo {
    margin-top: .75rem;
}

/*Navbar*/
.navbar {
    position: fixed;
    bottom: 0;
    background-color: var(--azul-escuro);
    width: 100vw;
    opacity: 0.9;
}
.navbar__items {
    width: 80%;
    margin: .5rem auto;
}

.navbar__item {
    font-size: .75rem;
    text-align: center;
}

.navbar__item::before {
    display: block;
    margin-bottom: 3px;
}

.navbar__item--home::before {
    content: url("../img/icone-home-mb.svg");
}

.navbar__item--busca::before {
    content: url("../img/icone-busca-mb.svg");

}

.navbar__item--biblioteca::before {
    content: url("../img/icone-biblioteca-mb.svg");
}