@import url('https://fonts.googleapis.com/css2?family=Bellefair&family=Tajawal:wght@200;300;400;500;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    margin: 0;
    padding: 0;
}

:root {
    --preto: #1E1E1E;
    --vermelho: #BA0403;
    --vinho: #940000;
    --vinhoEscuro: #710012;
    --azulMarinho: #1D1A55;
    --cinza: #797979;
    --branco: #EBEBEB;
    --rosaClaro: #ffd0d0;
    --cinzaClaro: #e1e1e1;
    --titulo: "Open Sans", sans-serif;
    --texto: "Open Sans", sans-serif;
}


/*Estutura do site*/
/*cor da página*/
body {
    background-color: var(--branco);
}

p {
    font-family: var(--texto);
    text-align: justify;
    font-size: 1.1rem;
    line-height: 1.5;

}

/*Padding entre as seções*/
.sections {
    padding-top: 5%;
    padding-bottom: 5%;
}

/*titulos do site*/
.sections__titulo {
    font-family: var(--titulo);
    color: var(--azulMarinho);
    font-size: 2.0em;
    margin-bottom: 2.5%;
}

.sections__titulo__escuro {
    font-family: var(--titulo);
    color: var(--azulMarinho);
    font-size: 2.0em;
    margin-bottom: 1.5%;
}

.underline {
    color: var(--vinhoEscuro)
}


/* Fim estutura do site*/


/*Início navbar*/

.navbarvermelho {
    background-color: var(--vinhoEscuro);
}

/*Navbar para mudar a cor ao passar o mouse*/
.dropdown-menu a.dropdown-item:hover {
    background-color: var(--rosaClaro);
}

.logoNavBar {
    width: 170px;
}

.colornav {
    color: var(--branco);
    background-color: var(--vinhoEscuro);
}

.colornav a {
    font-size: 1.2rem;
    font-family: var(--texto);
}

.btn_precisaAjuda {
    position: fixed;
    width: 200px;
    padding: 10px;
    top: 20px;
    right: 40px;
    background-color: var(--azulMarinho);
    color: var(--branco);
    border-radius: 30px;
    text-align: center;
    font-size: 14px;
    z-index: 1000;
    text-decoration: none;
    line-height: 1.5;
}

.header__icones a {
    text-decoration: none;
    color: var(--azulMarinho);
    font-size: medium;
    margin: 7px;
}

.icone1 {
    padding-left: 5px;
}

.header__icones {
    position: absolute;
    padding: 7px;
    top: 0px;
    right: 0px;
    text-align: center;
    z-index: 1000;
    background-color: var(--branco);
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
}


.container__brand {
    margin-right: 50px;
    margin-left: 80px;
}

/*Fim navbar*/



/*Início do quem somos*/

.sections__titulo_advogada {
    font-family: var(--titulo);
    color: var(--vinhoEscuro);
    font-size: 2.5em;
    margin-bottom: 1.5%;
}

.sections__quemSomos__img {
    width: 500px;
    margin-left: 100px;
}

/*Fim do quem somos*/


/*Início áreas de atuação*/
/*cores dos ícones da área de atuação*/
.areaAtuacao__icones {
    color: var(--azulMarinho);
    margin: 10%;
}

.sections__areaAtuacao__icones a {
    text-decoration: none;
    font-family: var(--texto);
    font-weight: 500;
    color: var(--vinhoEscuro);
    font-size: x-large;
}

.sections_areaAtuacao {
    text-align: center;
    margin-bottom: 5%;
    margin-top: 5%;
}

#area {
    background-color: var(--cinzaClaro);
}

/*Fim áreas de atuação*/

/* Inicio da área Consulta Virtual */

.virtual__titulo {
    font-family: var(--texto);
    font-size: 1.2rem;
    color: var(--azulMarinho);
    font-weight: 800;
}

.virtual__texto {
    font-family: var(--texto);
    font-size: 1.1rem;
    line-height: 1.3;
}

.virtual__icone {
    margin-right: 7%;
    margin-bottom: 4%;
}

.virtual__icone__check {
    display: flex;
    align-items: center;
}

.presencial_icones {
    color: var(--azulMarinho);
}

.sections__presencial {
    background-color: var(--cinzaClaro);
}

#presencial .col-md-6 {
    padding-right: 50px;
    padding-left: 50px;
    padding-top: 40px;
    padding-bottom: 40px;
}

b {
    color: var(--azulMarinho);
}

#virtual {
    background-image: url("fundo/balanca.png");
    max-height: 100%;

}

#virtual .col-md-6 {
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 40px;
    padding-bottom: 40px;
}

.sections__virtual {
    background-color: #e1e1e1;
}

.sections__virtual__paragrafo {
    color: var(--branco);
    background-color: var(--azulMarinho);
    padding-left: 40px;
    padding-right: 40px;
}

/*Início do rodapé*/
/*Para deixar fixado em baixo o rodapé*/
.rodape {
    bottom: 0;
    padding-top: 3%;
    padding-bottom: 4%;
    line-height: 250%;
    background-color: var(--vinhoEscuro);

}

/*Estilo do rodapé*/
.rodape__titulo {
    font-size: 2.0em;
    color: var(--rosaClaro);
    font-family: var(--texto);
}


.rodape__dados {
    color: var(--branco);
    text-decoration: none;
    font-size: 1.5em;
}

.rodape__dados:hover {
    color: var(--rosaClaro);
    text-decoration: none;
    font-size: 1.7em;
}

.rodape__redes {
    text-decoration: none;
    color: var(--branco);
}

.logos1,
.logos2,
.logos3,
.logos4 {
    font-size: 1.5em;
}

.logos1:hover,
.logos2:hover,
.logos3:hover,
.logos4:hover {
    font-size: 1.3em;
    color: var(--rosaClaro);
}

.rodape__whats__flutuante {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: var(--branco);
    border-radius: 50px;
    text-align: center;
    font-size: 38px;
    z-index: 1000;
}

.rodape__copyright {
    margin-top: 3%;
    text-align: center;
    color: var(--branco);
}

.rodape__copyright a {
    text-decoration: none;
    color: var(--branco);
}

.atendimentos {
    margin-left: 35%;
}

/*FIM do rodapé*/

@media screen and (max-width: 768px) {

    #quemSomos,
    #advogadaTitular,
    #area,
    #virtual,
    #presencial {
        padding-left: 35px;
        padding-right: 35px;
    }

    .sections__imagens {
        max-width: 600px;
    }

    .container__brand {
        margin-right: 0px;
        margin-left: 25px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        display: none;
    }

    .colornav {
        background-color: var(--vinhoEscuro);
    }

    .header__icones {
        display: none;
    }

    p {
        font-family: var(--texto);
        text-align: justify;
        font-size: 1.0rem;
        line-height: 1.5;

    }

    .sections__titulo,
    .sections__titulo__escuro {
        font-size: 1.5em;
    }

    .sections__titulo_advogada {
        font-size: 1.5em;
    }

    .sections__quemSomos__img {
        margin-left: 0;
    }


    .sections__areaAtuacao__icones a {
        font-size: medium;
    }

    /*Estilo do rodapé*/
    .rodape__titulo {
        font-size: 1.5em;
        color: var(--rosaClaro);
        font-family: var(--texto);
        margin-top: 20px;
    }


    .rodape__dados {
        color: var(--branco);
        text-decoration: none;
        font-size: 1.0em;
    }

    .rodape__dados:hover {
        color: var(--rosaClaro);
        text-decoration: none;
        font-size: 1.1em;
    }

    .rodape__redes {
        text-decoration: none;
        color: var(--branco);
    }

    .logos1,
    .logos2,
    .logos3,
    .logos4 {
        font-size: 1.1em;
    }

    .logos1:hover,
    .logos2:hover,
    .logos3:hover,
    .logos4:hover {
        font-size: 1.3em;
        color: var(--rosaClaro);
    }

    .rodape__whats__flutuante {
        position: fixed;
        width: 60px;
        height: 60px;
        bottom: 40px;
        right: 40px;
        background-color: #25d366;
        color: var(--branco);
        border-radius: 50px;
        text-align: center;
        font-size: 38px;
        z-index: 1000;
    }



    .atendimentos {
        margin-left: 35%;
    }

}

@media (max-width: 1400px) {
    .btn_precisaAjuda {
        display: none;
    }

    .header__icones {
        display: none;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        display: none;
    }

}

@media (min-width: 767px) and (max-width: 1200px) {
    .mail {
        margin-top: 15%;
        font-size: 1.0rem;
    }
}