:root {
    --color-message-success-bg: #e3fcec;
    --color-message-success-text: #1f9d55;
    --color-message-success-border: #51d88a;

    --color-message-warning-bg: #fffabc;
    --color-message-warning-text: #8d7b00;
    --color-message-warning-border: #d3b800;

    --color-message-error-bg: #fcebea;
    --color-message-error-text: #cc1f1a;
    --color-message-error-border: #ef5753;

    --color-message-info-bg: #eff8ff;
    --color-message-info-text: #2779bd;
    --color-message-info-border: #6cb2eb;

    --acordion-icon-color: #f7bd27;
}

@font-face {
    font-family: 'FSJoey';
    src: url('../font/FS-Joey-Heavy.otf') format('opentype');
    font-weight: bold;
}

@font-face {
    font-family: 'FSJoey';
    src: url('../font/FS-Joey-Medium.otf') format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: 'FSJoey';
    src: url('../font/FS-Joey-Bold.otf') format('opentype');
    font-weight: bolder;
}

@font-face {
    font-family: 'FSJoey';
    src: url('../font/FS-Joey-HeavyItalic.otf') format('opentype');
    font-style: italic;
    font-weight: 900;
}

body {
    font-family: 'FSJoey', sans-serif;
    scroll-behavior: smooth;
}

.carousel .carousel-control-prev-icon,
.carousel .carousel-control-next-icon {
    background-color: #00365e;
    border-radius: 50%;
}

.carousel-control-prev-icon {
    background-size: 50%;
    color: #fff;
    font-size: 24px;
}

.carousel-control-next-icon {
    background-size: 50%;
    color: #fff;
}

.carousel-indicators .active {
    background-color: #00365e;
}


.border-dashed {
    border: 1px dashed #00365e;
}

.navbar-toggler {
    border: none;
    outline: none;
    box-shadow: none;
}

.navbar-toggler:focus {
    outline: none;
    box-shadow: none;
    border: none;
}

.nav-link {
    border-bottom: 1px solid transparent;
    padding-bottom: 5px;
    transition: 0.3s;
}

.nav-link:hover {
    border-bottom: 1px solid #00365e;
    transition: 0.3s;
}

.azul {
    color: #00365e;
}

.bg-translucido {
    background-color: rgba(0, 51, 101, 0.3);
}

.bg-azul {
    background-color: #00365e;
}

.amarelo {
    color: #f7bd27;
}

.bg-amarelo {
    background-color: #f7bd27;
}

.bg-navbar {
    background-color: #b2e6f8;
}

.btn-amarelo {
    background-color: #f7bd27;
    color: #00365e !important;
    border: none;
    outline: none;
    transition: 0.3s;
}

.btn-amarelo:hover {
    background-color: #ffcf3f !important;
    color: #00365e !important;
    transition: 0.3s;
}

.btn-amarelo:focus {
    background-color: #ffcf3f !important;
    color: #00365e !important;
    transition: 0.3s;
}

.btn-amarelo:active {
    background-color: #ffcf3f !important;
    color: #00365e !important;
    transition: 0.3s;
}

.btn-azul {
    background-color: #00365e;
    color: #fff !important;
    border: none;
    outline: none;
    transition: 0.3s;
}

.btn-azul:hover {
    background-color: #002549 !important;
    color: #fff !important;
    transition: 0.3s;
}

.btn-azul:focus {
    background-color: #002549 !important;
    color: #fff !important;
    transition: 0.3s;
}

.btn-azul:active {
    background-color: #002549 !important;
    color: #fff !important;
    transition: 0.3s;
}

.btn-azul-amarelo {
    background-color: #00365e !important;
    color: #fff !important;
    border: none;
    outline: none;
    transition: 0.3s;
}

.btn-azul-amarelo:hover {
    background-color: #f7bd27 !important;
    color: #00365e !important;
    transition: 0.3s;
}

.btn-azul-amarelo:focus {
    background-color: #f7bd27 !important;
    color: #00365e !important;
    transition: 0.3s;
}

.btn-azul-amarelo:active {
    background-color: #f7bd27 !important;
    color: #00365e !important;
    transition: 0.3s;
}

.btn {
    transition: 0.3s;
}

.btn:hover {
    transform: translateY(-5px);
    transition: 0.3s;
    box-shadow: 0 6px 6px 3px #818181a1 !important;
}

.menu-suspenso {
    position: absolute;
    top: 90px;
    left: 0;
}

.btn-menu {
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
    margin: auto;
    background-color: transparent;
    border: none;
    outline: none;
    color: #333;
    transition: 0.3s;
}

.btn-menu:hover {
    background-color: #00365e !important;
    color: white !important;
    transition: 0.3s;
}

.btn-menu:focus {
    background-color: #00365e !important;
    color: white !important;
    transition: 0.3s;
}

.btn-menu:active {
    background-color: #00365e !important;
    color: white !important;
    transition: 0.3s;
}

.vh-100-menu {
    height: calc(100vh - 90px);
}

.banner-home {
    background-image: url('../img/banner-home.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-gradient-grey {
    background-image: linear-gradient(to right, #f2f2f2, #e4e3e3);
}

.bg2 {
    background-image: url('../img/bg2.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg2-espelhado {
    /* a imagem fica espelhada */
    background-image: url('../img/bg2.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
    transform: scaleX(-1);
}

.bg2-espelhado>* {
    transform: scaleX(-1);
}

.bg3 {
    background-image: url('../img/bg-empresa.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg4 {
    background-image: url('../img/bg4.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-para-voce {
    background-image: url('../img/pravoce.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-onde-comprar {
    background-image: url('../img/ondecomprar.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-mulher-sacola {
    background-image: url('../img/bg-mulher-sacola.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-contadora {
    background-image: url('../img/bg-contadora.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-desbloqueie-cartao {
    background-image: url('../img/bg-desbloqueie-cartao.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-desbloqueie-cartao-2 {
    background-image: url('../img/bg-desbloqueie-cartao.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}


.bg-empresa {
    background-image: url('../img/bg-empresa.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-tenho-interesse {
    background-image: url('../img/bg-tenho-interesse.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-saque-rapido {
    background-image: url('../img/bg-saque-rapido.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-emprestimo {
    background-image: url('../img/bg-emprestimo.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-faca-seu-cartao {
    background-image: url('../img/bg-faca-seu-cartao.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 50vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-quem-somos {
    background-image: url('../img/bg-quem-somos.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-vagas {
    background-image: url('../img/bg-vagas.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-duvidas {
    background-image: url('../img/bg-duvidas.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-trabalhe {
    background-image: url('../img/bg-trabalhe.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-co {
    background-image: url('../img/bg-co.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 90px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.min-vh-100 {
    min-height: 100vh;
}

.min-vh-100-menu {
    min-height: calc(100vh - 90px);
}

.div-btns-absolute {
    width: 100%;
}

.bg-light-2 {
    background-color: #f2f2f2;
}

.cards-crediario {
    height: 200px;
}

.hover-efeito {
    transition: 0.3s;
}

.hover-efeito:hover {
    transform: translateY(-5px);
    transition: 0.3s;
}

.hover-zoom {
    transition: 0.3s;
}

.hover-zoom:hover {
    transform: scale(1.05);
    transition: 0.3s;
}

.fade-in {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 15%);
    mask-image: linear-gradient(to right, transparent 0%, black 50%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.fade-in-right {
    -webkit-mask-image: linear-gradient(to left, transparent 0%, black 15%);
    mask-image: linear-gradient(to left, transparent 0%, black 50%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}



/* Flash messages */
.message {
    padding: .5rem 1rem;
    background: var(--color-message-info-bg);
    color: var(--color-message-info-text);
    border-color: var(--color-message-info-border);
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    margin-bottom: 1rem;
    cursor: pointer;
    position: absolute;
    top: 90px;
    width: 100%;
    text-align: center;
}

.message.hidden {
    display: none;
}

.message.success {
    background: var(--color-message-success-bg);
    color: var(--color-message-success-text);
    border-color: var(--color-message-success-border);
}

.message.warning {
    background: var(--color-message-warning-bg);
    color: var(--color-message-warning-text);
    border-color: var(--color-message-warning-border);
}

.message.error {
    background: var(--color-message-error-bg);
    color: var(--color-message-error-text);
    border-color: var(--color-message-error-border);
}

.hover-pointer {
    cursor: pointer;
}

/* select2 */
.select2 {
    width: 100% !important;
    margin-bottom: 1rem;
}

.select2-container {
    width: 100% !important;
}

.select2-container--default .select2-selection--single {
    height: 40px !important;
    border: 1px solid #ced4da !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.select2-selection__arrow {
    margin-top: 5px !important;
}

.splide__arrow {
    background-color: transparent !important;
}


/* todos os textos dos inputs e selects é azul */
/* Cor do placeholder */
input::placeholder,
textarea::placeholder {
    color: #00365e !important;
    opacity: 0.5 !important;
}

/* Para compatibilidade com versões mais antigas do Webkit (Safari e Chrome antigos) */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #00365e !important;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #00365e !important;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #00365e !important;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    color: #00365e !important;
}

/* Texto do select */
select {
    color: #00365e !important;
    /* Cor do texto */
}

/* Texto do "placeholder" */
select option[value=""] {
    color: #00365e !important;
    /* Cor do placeholder */
}





/* até lg */
@media (max-width: 992px) {
    .menu-suspenso {
        padding-bottom: 30px;
        position: absolute;
        top: 160px;
        left: 0;
    }

    .banner-home {
        background: linear-gradient(rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0)), url('../img/banner-home.png');
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg2 {
        background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1)), url('../img/bg-linha.webp');
        background-position: 50% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg3 {
        background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.5)), url('../img/bg-empresa.jpg');
        background-position: 68% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg4 {
        background: #e4e3e3;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-para-voce {
        background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5)), url('../img/pravoce.jpg');
        background-position: 67% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    #como-funciona {
        background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.3)), url('../img/comofunciona.png');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg-onde-comprar {
        background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5)), url('../img/ondecomprar.png');
        background-position: 67% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-desbloqueie-cartao {
        background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5)), url('../img/bg-desbloqueie-cartao.png');
        background-position: 65% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-desbloqueie-cartao-2 {
        background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5)), url('../img/bg-desbloqueie-cartao.png');
        background-position: 35% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-empresa {
        background: url('../img/logo-out.webp');
        background-position: 85% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-tenho-interesse {
        background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5)), url('../img/bg-tenho-interesse.png');
        background-position: 75% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-saque-rapido {
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1)), url('../img/bg-saque-rapido.png');
        background-position: 55% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-emprestimo {
        background: linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.5)), url('../img/bg-emprestimo.png');
        background-position: 60% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-faca-seu-cartao {
        background: linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.5)), url('../img/bg-faca-seu-cartao.png');
        background-position: 30% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-quem-somos {
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('../img/bg-quem-somos.png');
        background-position: 65% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-vagas {
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('../img/bg-vagas.png');
        background-position: 65% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-duvidas {
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('../img/bg-duvidas.png');
        background-position: 55% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-trabalhe {
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('../img/bg-trabalhe.png');
        background-position: 65% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bg-co {
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('../img/bg-co.png');
        background-position: 65% center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .cards-crediario {
        height: 300px;
    }

    .div-btns-absolute {
        width: 100vw;
    }
}