@font-face {
    font-family: "Gotham Regular";
    src: url("/assets/fonts/GothamNarrow-Book.otf");
}

@font-face {
    font-family: "Gotham Bold";
    src: url("/assets/fonts/GothamNarrow-Bold.otf");
}

body {
    font-family: "Gotham Regular", Arial, Helvetica, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
b {
    font-family: "Gotham Bold", Arial, Helvetica, sans-serif;
}

small {
    margin: 0px 15px !important;
    display: block;
}

.remove-gutters {
    padding: 0px !important;
}

.destaque {
    background-image: url("/assets/imagens/destaque.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.text-azul {
    color: var(--azul-escuro);
}

a.text-azul {
    color: var(--azul-escuro) !important;
}

.text-azul-claro {
    color: var(--azul-claro);
}

.text-laranja {
    color: var(--laranja);
}

.text-cinza {
    color: var(--cinza-escuro);
}

.bg-azul {
    background-color: var(--azul-escuro);
}

.bg-cinza {
    background: var(--cinza);
}

.quem-somos {
    border-top: 10px solid var(--verde);
    background: var(--azul-escuro);
    color: var(--branco);
    border-bottom: 2px solid var(--verde);
}

.btn-laranja {
    color: var(--branco);
    background-color: var(--laranja);
    border-color: var(--laranja);
}

.btn-laranja:hover {
    color: var(--branco);
    background-color: var(--laranja-escuro);
    border-color: var(--laranja-escuro);
}

.triangulo {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid var(--verde);
    margin: 0 auto 15px auto;
}

ul {
    list-style: none;
}

ul li {
    line-height: 2em;
}

ul li::before {
    content: "\2022";
    color: var(--verde);
    font-weight: bold;
    font-size: 2em;
    display: inline-block;
    width: 1em;
    margin-left: -1.5em;
    margin-right: 0.55em;
    vertical-align: middle;
}

.icone {
    height: 50px;
    margin: 5px 0 5px -25px;
}

.carousel-caption {
    background-color: var(--semitransparente);
}

#quem-somos,
#servicos,
#obras-realizadas {
    margin-top: -50px;
    margin-bottom: 50px;
}

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

    .destaque {
        background-image: url("/assets/imagens/background-hero-mobile.png");
        background-repeat: no-repeat;
        background-size: cover;
    }

    .icone {
        height: 100px;
        margin-bottom: 20px;
    }

    ul li::before {
        margin-left: -1em;
        margin-right: auto;
    }

    .text-destaque {
        background: var(--semitransparente);
        margin: 50px 0 !important;
        color: var(--branco);
    }

    .text-destaque h2 {
        color: var(--branco);
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 320px) {
    h2.text-azul {
        font-size: 1.4em !important;
    }
}

:root {
    --laranja: #f58634;
    --laranja-escuro: #dd792f;
    --azul-escuro: #102e5c;
    --azul-claro: #5791e8;
    --verde: #a8cf45;
    --cinza: #e6e6e6;
    --cinza-escuro: #AAAAAA;
    --preto: #000;
    --branco: #fff;
    --semitransparente: rgba(0, 0, 0, 0.5);
}