@import url(_variaveis.css);
@import url(_reset.css);

body {
    font-family: var(--familia-corpo);
    font-size: var(--tamanho-corpo);
    color: var(cinza);

    background: url(../../img/fundo-textura.png), url(../../img/fundo-linhas.png);
    background-position: center;
}

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

.titulo {
    font-size: var(--tamanho-titulo);
}

.titulo--destaque {
    font-family: var(--familia-titulo-destaque);
    color: var(--preto);
    font-size: var(--tamanho-titulo-destaque);
    font-weight: var(--peso-titulo-destaque);

    display: block;

    margin: .75rem 0;
}

.alinhamento--esquerda {
    text-align: left;
}

.alinhamento--meio {
    text-align: center;
}

.texto {
    line-height: 26px;
    color: var(--cinza);
}

.fundo-escuro {
    position: absolute;
    top: 0;
    left: 0;

    z-index: -100;

    width: 100vw;
    height: 100vh;

    background-color: var(--preto);
    opacity: 0;
}

.snackbar__fundo-escuro {
    position: absolute;
    top: 0;
    left: 0;

    z-index: -100;

    width: 100vw;
    height: 100vh;

    background-color: var(--preto);
    opacity: 0;
}

.fundo-escuro--ativo {
    z-index: 50;

    opacity: 0.7;

    position: fixed;
}

.snackbar__fundo-escuro--ativo{
    z-index: 50;

    opacity: 0.7;

    position: fixed;
}