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

body {
    background-color: #FFFFFF;
    font-size: 14px;
    color: #777777;
    padding: 0;
    margin: 0;
    font-family: "Open Sans", serif;
    font-weight: 400;
    overflow-x: hidden;
    line-height: 1.5;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
}


img {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    user-drag: none;
}

a,
a:hover,
a:active,
a:focus {
    text-decoration: none;
    outline: none;
}

a,
button,
a span {
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.barra-superior {
    padding: 40px 0;
    text-align: center;
    display: block;
}

.barra-topo {
    background-color: #09A33C;
    padding: 50px 0 10px 0;
}

.area-texto-topo {
    color: #ffff;
    width: 40%;
    max-width: 40%;
}

.area-texto-topo h1 {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 28px;
    line-height: 119%;
    color: #FFFFFF;
}

/* Transforme sua ideia em realidade! Na Vital Natus, oferecemos uma solução completa para você lançar sua linha de suplementos com segurança e qualidade. */

.area-texto-topo p {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 136%;
    color: #FFFFFF;
}

/* Group 90 */
.btn-orcamento {
    background-color: #BFE22B;
    border-color: #BFE22B;
    color: #006A23;
    display: block;
    height: 70px;
    border-radius: 20px;
    font-size: 18px;
    font-weight: bold;
    padding-top: 20px;
}

.btn-orcamento-verde {
    background-color: #006A23;
    border-color: #006A23;
    color: #fff;
    display: block;
    height: 70px;
    border-radius: 20px;
    font-size: 16px;
    font-weight: bold;
    padding-top: 20px;
    margin-top: 50px;
}

.txt-menor {
    margin-top: 10px;
    font-size: 14px !important;
}

.porque-terceirizar {
    background-color: #fff;
    padding: 80px 0 100px 0;
}

.titulo-porque {
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 120%;
    leading-trim: both;
    text-edge: cap;
    text-align: center;
    color: #09A33C;
    margin-bottom: 80px;
}

.como-funciona {
    background-color: #09A33C;
    padding: 50px 0 100px 0;
}

.porque-terceirizar .btn-orcamento, .como-funciona .btn-orcamento, .quem-pode-ter .btn-orcamento {
    margin-top: 80px;
    display: inline-block;
}

.titulo-como-funciona {
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 119%;
    text-align: center;
    color: #FFFFFF;
    padding: 40px 0 60px 0;
}

.quem-pode-ter {
    background-color: #fff;
    padding: 50px 0 100px 0;
}

.imagem-quem-pode {
    margin-top: 250px;
}

.area-imagem {
    position: relative;
}

.img-quem-pode {
    position: absolute;
    margin-top: -188px;
    left: 100px;
}

.area-imagem p {
    position: absolute;
    font-style: normal;
    font-weight: 700;
    font-size: 32.3917px;
    line-height: 120%;
    color: #09A33C;
    width: 250px;
    left: 550px;
    
}

.depoimentos {
    text-align: center;
    background-image: url(../img/fundo-depoimentos-desktop.png);
    height: 484px;
    padding: 50px 0;
}

.titulo-depoimentos {
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 120%;
    color: #006A23;
}

.fundo-sobre-vital {
    background-image: url(../img/fundo-sobre-vital-desktop.png);
    height: 751px;
    padding: 100px 0 50px 0;
}

.text-sobre {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 147%;
    display: flex;
    align-items: center;
    color: #383838;
    margin: 20px 0;
}

.formulario {
    padding: 100px 0;
    background-color: #09A33C;
    text-align: center;
}

.sub-titulo-formulario {
    font-style: normal;
    font-weight: 400;
    font-size: 15.456px;
    line-height: 26px;
    align-items: center;
    color: #FFFFFF;
}

.titulo-formulario {
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 120%;
    text-align: center;
    color: #FFFFFF;
}

.footer {
    height: 80px;
    background-color: #fff;
}

.footer .container {
    padding: 40px 0 40px 0;
}

#formulario-contato {
    background-color: #fff;
    padding: 40px 20px;
    border-radius: 10px;
}

.form {
    text-align: left;
}

.form label {
    color: #424141;
    font-weight: 600;
}

.btn-enviar {
    background-color: #BFE22B;
    border-color: #BFE22B;
    color: #006A23;
    padding: 20px 0;
    font-weight: bold;
    border-radius: 32.59px;
    cursor:pointer;
}

.view-mobile {
    display: none;
}

@media (max-width: 769px) {
    
    .btn-orcamento, .btn-orcamento-verde, .btn-enviar {
        font-size: 16px;
    }

    .view-desktop {
        display: none;
    }

    .view-mobile {
        display: initial;
    }

    .barra-superior {
        padding: 40px 0 80px 0;
    }

    .area-texto-topo {
        width: 100%;
        max-width: 100%;
    }

    .barra-topo img {
        margin-top: -105px;
    }

    .como-funciona {
        background-repeat: no-repeat;
        background-image: url(../img/fundo-como-funciona-mobile.png);
    }

    .titulo-como-funciona {
        padding-top: 200px;
    }

    .img-quem-pode {
        position: relative;
        margin-top: auto;
        left: auto;
    }

    .area-imagem p {
        position: relative;
        left: auto;
        width: auto;
        text-align: center;
    }

    .imagem-quem-pode {
        margin-top: 50px;
    }

    .depoimentos {
        background-repeat: no-repeat;
        background-image: url(../img/fundo-depoimentos-mobile.png);
        height: auto;
    }

    .titulo-depoimentos {
        margin-top: 300px;
        color: #fff;
    }

    .fundo-sobre-vital {
        height: auto;
        background-color: #eae9ee;
        background-image: url(../img/fundo-sobre-vital-mobile.png);
        background-repeat: no-repeat;
        background-position: center bottom;
    }

    .fundo-sobre-vital .col-sm-5 {
        text-align: center;
    }

    .fundo-sobre-vital .titulo-depoimentos {
        margin-top: 20px;
        color: #09A33C;
    }

    .fundo-sobre-vital .container {
        margin-bottom: 400px;
    }

    .txt-mobile {
        margin-top: 20px;
    }

    .footer .row {
        margin: 0px !important;
    }
}