p,
label,
input,
h3,
h4,
a {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-size: 13px;
}
h1 {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    color: #e72168;
}
h2 {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    color: #fff;
}
.top {
    width: 100%;
    background-image: url("../img/background_topo.jpg");
    background-repeat: repeat-x;
}
.mkt_img1 {
    height: 40px;
}
.mkt_img2 {
    width: 250px;
    height: 250px;
    display: inline-block;
    padding: 20px;
}
.mkt_img3 {
    width: 40px;
    display: inline-block;
}
.mkt_divbox {
    display: inline-block;
    text-align: left;
    max-width: 370px;
}
.mkt_divpt2 {
    min-width: 250px;
    max-width: 1080px;
    text-align: center;
}
.mkt_divimg1 {
    width: 25%;
    min-width: 180px;
    display: inline-block;
    margin-top: 20px;
    vertical-align: text-top;
    float: left;
    clear: none;
    text-align: center;
}
.mkt_divimg2 {
    width: 100%;
    min-width: 250px;
    display: inline-block;
    margin-top: 20px;
}
.mkt_top-div {
    vertical-align: text-bottom;
    display: inline-block;
    text-align: center;
}
.logo-center {
    text-align: center;
    margin-top: 5%;
}
.logo-novo {
    min-width: 250px;
    width: 35%;
    margin-bottom: 50px;
}
.logo-title {
    font-size: 2em;
}
.logo-subtitle {
    font-size: 1.5em;
    color: #e72168;
    margin-top: 1%;
}
.vantagens-message {
    padding: 20px;
    padding-right: 35px;
    width: 20%;
    min-width: 250px;
    display: inline-block;
    text-align: top;
    vertical-align: top;
    margin-top: 30px;
}
.in-blck {
    display: inline-block;
}
.blck {
    display: block;
}
.mt-5 {
    margin-top: 5%;
}
.mt-8 {
    margin-top: 8%;
}
.mt-15 {
    margin-top: 15px;
}
.ml-20 {
    margin-left: 20px;
}
.mr-20 {
    margin-right: 20px;
}
.mb-8 {
    margin-bottom: 8%;
}
.solucoes {
    margin-top: 50px;
    padding-top: 30px;
}
.div-solucoes {
    background-color: #3b73b9;
    text-align: center;
}
.buonny-check,
.buonny-sat {
    margin-top: 5% !important;
    -webkit-box-shadow: 0px 4px 15px -3px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 4px 15px -3px rgba(0, 0, 0, 0.5);
    max-width: 1100px;
    margin: auto;
    padding-top: 10px;
    padding-bottom: 30px;
    text-align: center;
}
.title-buonny-check {
    font-size: 1.5em;
    color: #124577;
    margin-bottom: 5%;
}
.title-buonny-sat {
    font-size: 1.5em;
    color: #e72168;
    margin-bottom: 5%;
}
.title-buonny-log {
    font-size: 1.5em;
    color: #40b0e5;
    margin-bottom: 5%;
}
.title-buonny-tech {
    font-size: 1.5em;
    color: #0080ff;
    margin-bottom: 5%;
}
.img-buonny-check,
.img-buonny-sat {
    width: 50px;
    margin-top: 8%;
}
.icon-buonny-check {
    width: 250px;
    margin-left: 40px;
}
.block-buonny-check,
.block-buonny-sat {
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 5%;
}
.txt-buonny-check {
    width: 250px;
    margin-left: 40px;
}
.txt-buonny-tech {
    width: 300px;
    margin-left: 40px;
}
.spam-buonny-check {
    font-weight: bolder;
    color: #124577;
}
.spam-buonny-sat {
    font-weight: bolder;
    color: #e72168;
}
.spam-buonny-log {
    font-weight: bolder;
    color: #40b0e5;
}
.spam-buonny-tech {
    font-weight: bolder;
    color: #0080ff;
}
.div-buonny-check,
.div-buonny-sat {
    margin: auto;
    max-width: 1080px;
    min-width: 350px;
}
.rodape-buonny {
    margin: auto;
    margin-top: 100px;
    margin-bottom: 80px;
    line-height: 2.1em;
    text-align: center;
}
.rodape-title {
    font-size: 22px;
    font-weight: bolder;
    color: #3b73b9;
}
.rodape-subtitle {
    font-size: 18px;
}
#logobuonny {
    float: left;
}
.meio {
    margin: 40px auto !important;
    max-width: 960px;
    width: 80%;
    display: table;
    position: relative;
    min-width: 960px;
}
.meio_top {
    margin: 0 auto !important;
    max-width: 960px;
    width: 80%;
    display: table;
    position: relative;
    text-align: center;
    min-width: 960px;
}
.fotos {
    text-align: center;
    width: 24%;
    float: left;
    display: table;
    position: relative;
    height: 100px;
    margin: 5px;
}
.fotos h3 {
    text-align: left;
    color: #bfbfbf;
    margin-top: 10px;
    margin-left: 5px;
    text-transform: uppercase;
}
.fotos p {
    text-align: left;
    color: #1b1c20;
    width: 95%;
    margin-left: 5px;
}
.metade {
    width: 49%;
    float: left;
    display: table;
    position: relative;
    margin: 35px 5px 25px 5px;
}
.metade h3 {
    color: #bfbfbf;
    font-size: 24px;
}
.quarto {
    width: 45%;
    display: block;
    position: relative;
    float: left;
    margin-top: 20px;
}
.quarto img {
    margin: 10px 10px 0px 0px;
}
.espaco {
    height: 135px;
    display: table;
}
.meio2 {
    margin: 0px auto !important;
    max-width: 960px;
    width: 86%;
    min-width: 960px;
}
.pagina {
    margin: 0 auto !important;
    width: 100%;
}
.titulo {
    margin: -15px auto !important;
    text-align: center;
    display: block;
    margin-bottom: 30px;
}
.rodape {
    background-color: #3e3e3e;
    display: table;
    width: 100%;
    padding: 20px 0 0 0;
    position: fixed;
    bottom: 0;
}
.direita span {
    color: #009bdb;
}
.direita {
    float: right;
    width: auto;
    display: inline;
    margin: 17px 10px 10px 10px;
}
.direita p {
    display: inline;
    color: #fff;
    float: left;
}
.direita img {
    float: left;
}
.icones {
    float: left;
    display: table;
    position: relative;
    width: 32%;
    height: 100px;
    margin: 5px;
    text-align: center;
    margin-top: 20px;
}
.icones p {
    margin: 0 auto !important;
    width: 82%;
    color: #3b3b3b;
}

a {
    text-decoration: none;
    color: #bfbfbf;
    font-size: 13px;
}

/* LOGIN  */

.login {
    background-color: #dcdcdc;
    top: 5%;
    position: absolute;
    right: 5%;
    border-radius: 10px 10px 5px 5px;
    width: 400px;
    box-shadow: 0px 0px 20px 5px #0000008f;
    max-height: 340px;
}

.login-header {
    background: linear-gradient(147deg, #e0165e, #3868a6);
    padding: 10px;
    border-radius: 5px 5px 0px 0px;
}

.login-header h2 {
    font-weight: bolder;
    text-transform: uppercase;
    text-align: center;
}

.login-content {
    font-size: 17px;
    line-height: 25px;
    padding: 15px;
}

.login-content input {
    width: calc(100% - 30px);
    border: none;
    outline: none;
    padding: 15px;
    border-radius: 4px;
}

#senha {
    margin-top: 5px;
}

#div-recaptcha iframe {
    width: 100%!important;
    margin-top: 10px;
}

.entrar {
    color: #fff;
    cursor: pointer;
    width: calc(100% - 20px);
    background: #3b73b9;
    border-radius: 5px;
    text-align: center;
    padding: 10px;
    margin-top: 10px;
}

.entrar:hover {
    background: #124577;
}

.login-footer {
    display: flex;
    padding: 15px;
    padding-top: 0;
    justify-content: space-between;
    align-items: center;
    font-variant: all-small-caps;
}

.boleto a {
    display: flex;
}

.boleto a img {
    margin-right: 5px;
}

.boleto h3 {
    color: #fff;
    font-size: 0.8em;
    font-weight: lighter;
}

.boleto a p {
    color: #333;
}

.esqueci-senha {
    text-decoration: none;
    color: #00539e;
    font-size: 13px;
}

.parcela {
    color: #999!important;
}

/* FIM LOGIN */

.titulo h1 {
    border-radius: 4px;
    padding: 5px;
    border: 1px solid #3b3b3b;
    color: #3b3b3b;
    font-size: 30px;
}
.numeros img {
    float: left;
    position: relative;
    margin-top: -7px;
}
.numeros h2 {
    float: left;
    position: relative;
    color: #bfbfbf;
    margin-bottom: 0;
    width: 200px;
    font-size: 20px;
}
.numeros p {
    float: left;
    position: relative;
    width: 215px;
    min-width: 197px;
    margin-top: 0;
}
#chamada {
    font-size: 36px;
    color: #bfbfbf;
    position: absolute;
    top: 150px;
    margin-left: 35px;
    line-height: 1;
}
.propaganda {
    width: 295px;
    float: left;
    position: relative;
    padding: 0 10px 20px 25px;
}
.propaganda img {
    margin: 0 25px 0 10px;
}
.solicite {
    background: url("../img/solicite.png");
    background-image: url("../img/solicite.png"), none;
    width: 167px;
    height: 28px;
    background-position: 0 0;
    float: left;
    position: relative;
    cursor: pointer;
    margin-left: 10px;
    margin-top: -3px;
}
.solicite:hover {
    background-position: 0 -28px;
}

.buscar {
    background: url("../img/botao2.png");
    background-image: url("../img/botao2.png"), none;
    width: 90px;
    height: 29px;
    background-position: 0 0;
    float: left;
    position: relative;
    margin-bottom: 10px;
    margin-right: 2px;
    color: #fff;
    cursor: pointer;
    margin-left: 2px;
}
.buscar:hover {
    background-position: 0 -30px;
}
.pneu {
    background: url("../img/pneu.png");
    background-image: url("../img/pneu.png"), none;
}
.pecas {
    background: url("../img/pecas.png");
    background-image: url("../img/pecas.png"), none;
}
.acessorios {
    background: url("../img/acessorios.png");
    background-image: url("../img/acessorios.png"), none;
}
.servicos {
    background: url("../img/servicos.png");
    background-image: url("../img/servicos.png"), none;
}
.pneu,
.pecas,
.acessorios,
.servicos {
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
    width: 51px;
    height: 44px;
    background-position: 0 0;
    float: left;
    position: relative;
    margin-bottom: 10px;
    margin-right: 20px;
}
.pneu:hover,
.pecas:hover,
.acessorios:hover,
.servicos:hover {
    background-position: 0 -44px;
}
.lightbox {
    display: none;
    width: 350px;
    text-align: center;
}
.lightbox input {
    margin: 10px auto !important;
}
.lightbox h1 {
    color: #267fc2;
    font-size: 32px;
}
#buscar:hover {
    margin-top: 1px;
}

.guia {
    float: left;
    position: relative;
}
.banner {
    float: left;
    position: relative;
}
.tele {
    vertical-align: top;
    margin-top: 15px;
}
#variados {
    width: 100%;
    height: auto;
}
div.message {
    top: 10px;
    width: 100%;
    position: relative;
}
.alert,
.alert h4 {
    color: #c09853;
}

.alert h4 {
    margin: 0;
}

.alert .close {
    position: relative;
    top: -2px;
    right: -21px;
    line-height: 20px;
}

.alert-success {
    color: #468847;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-success h4 {
    color: #468847;
}

.alert-danger,
.alert-error {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #eed3d7;
    padding: 15px;
    border-radius: 5px;
}

.alert-danger h4,
.alert-error h4 {
    color: #b94a48;
}

.alert-info {
    color: #3a87ad;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.alert-info h4 {
    color: #3a87ad;
}

.alert-block {
    position: relative;
    color: #b94a48;
    background-color: #f2dede;
    border: 1px solid #eed3d7;
    z-index: 9999999999;
    padding: 15px;
    border-radius: 5px;
}

.alert-block > p,
.alert-block > ul {
    margin-bottom: 0;
}

.alert-block p + p {
    margin-top: 5px;
}

@media screen and (max-width: 996px) {
    .top {
        height: 100px;
        background-size: auto 100px;
    }
    .meio {
        text-align: center;
    }
    .meio2 {
        width: 100%;
        background-position-x: 0px;
        background-size: auto 370px;
    }
    .direita {
        margin: 0 auto !important;
        display: table;
        float: none;
        min-width: 500px;
    }
    .rodape {
        position: relative;
    }
    #cara {
        display: none;
    }
    .login {
        width: 90%;
    }
    .tabs {
        width: 467px;
        margin: 0 auto !important;
        height: 210px;
    }
    li {
        float: none;
    }
    #usuario {
        width: 90%;
    }
    #senha {
        width: 90%;
        margin-top: 10px;
        margin-left: 0px;
        margin-bottom: 10px;
    }
    .esqueci {
        display: block;
        float: left;
        margin: 12px 10px 8px 10px;
    }
    .entrar {
        margin-top: 9px;
        margin-left: -2px;
    }
    #chamada {
        position: relative;
        display: table;
        margin: 10px auto !important;
        top: 0;
        text-align: center;
        font-size: 30px;
        width: 420px;
    }
    .meio {
        background-position-x: 0px;
        background-size: 100% auto;
        width: 90%;
        min-width: 500px;
    }
    .titulo {
        margin: 10px auto !important;
    }
    .numeros {
        padding-bottom: 0px;
    }
    .numeros h2 {
        width: 60%;
        margin-left: 40px;
    }
    .numeros p {
        margin-left: 40px;
    }
    .numeros img {
        margin-left: 10%;
    }
    .numero1 {
        float: none;
        position: relative;
        width: 100%;
        height: 110px;
        display: block;
        min-width: 319px;
        margin: 0 auto !important;
        background-color: #f4f4f4;
        padding: 27px 10px 0px 10px;
    }
    .numero2 {
        float: none;
        position: relative;
        width: 100%;
        height: 110px;
        display: block;
        min-width: 319px;
        margin: 10px auto !important;
        background-color: #f4f4f4;
        padding: 27px 10px 0px 10px;
    }
    .numero3 {
        float: none;
        position: relative;
        width: 100%;
        height: 110px;
        display: block;
        min-width: 319px;
        margin: 10px auto !important;
        background-color: #f4f4f4;
        padding: 27px 10px 0px 10px;
    }
    .guia {
        display: none;
    }
    .propaganda {
        display: none;
    }
    .banner {
        margin: 0 auto !important;
        text-align: center;
        float: none;
        padding-bottom: 20px;
        display: table;
    }
    .tele {
        margin-left: 30px;
    }
    .titulo h1 {
        margin: 10px 10px 10px 10px;
    }
    .fotos {
        width: 47%;
    }
    .fotos img {
        width: 100%;
    }
    .metade {
        width: 100%;
        text-align: center;
    }
    .quarto {
        width: 45%;
        display: table;
        padding-top: 20px;
        margin: 0 auto !important;
        float: none;
        text-align: center;
        position: relative;
    }
    #texto2 {
        width: 50%;
        margin: 0 auto !important;
        display: table;
        position: relative;
    }
    #variados {
        width: 70%;
        height: auto;
    }
    .meio2 {
        background-image: url("../img/bg_mobile.jpg");
    }
    .espaco {
        height: 0px;
    }
    .icones {
        width: 30%;
    }
    #logobuonny {
        float: none;
    }
}