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

html {
    scroll-behavior: smooth;
}

body {
    background-color: #ffffff;
    font-family: "Open Sans", sans-serif; font-optical-sizing: auto;
}

a {
    text-decoration: none;
    transition: 0.25s;
}

b {
    font-weight: bold;
}

em {
    font-style: italic;
}

h1 {
    font-weight: bold;
}

h2 {
    font-weight: bold;
}

h3 {
    font-size: 32px;
    line-height: 40px;
    font-weight: bold;
}

h4 {
    font-weight: bold;
}

h5 {
    font-weight: bold;
    font-size: 24px;
    line-height: 32px;
    color: #535353;
}

h6 {
    font-weight: bold;
    font-size: 20px;
    line-height: 26px;
    color: #535353;
}

p {
    font-size: 16px;
    line-height: 22px;
    margin: 20px 0;
    color: #535353;
}


figure.preencher {
    position: relative;
    width: 100%;
    height: 100%;
}
figure.preencher img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

a.preencher {
    position: relative;
    width: 100%;
    height: 100%;
}
a.preencher img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
figure.arredondagem {
    border-radius: 8px;
    overflow: hidden;
}


.wrapper {
    position: relative;
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
}

.container {
    position: relative;
    float: left;
    width: calc(100% - 80px);
    max-width: 1600px;
}

.sessao {
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 30px;
}
.sessao.fundoescuro {
    background-color: #f4f4f4;
}
.sessao.recuosuperior {
    padding-top: 30px;
}
.sessao.recuoinferior {
    padding-bottom: 30px;
}

.topete {
    position: relative;
    float: left;
    width: calc(100% + 16px);
    margin: -20px 0 0 -8px;
    height: 50px;
}
.topete .curva {
    position: relative;
    float: left;
    width: 8px;
    height: 100%;
}
.topete .curva .quadrado {
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 8px;
    background-color: #ffff;
    overflow: hidden;
}
.topete .curva .quadrado .circulo {
    position: absolute;
    top: 0;
    width: 200%;
    height: 200%;
    border-radius: 50%;
    background-color: #010c5b;
}
.topete .curva.antes .quadrado .circulo {
    right: 0;
}
.topete .curva.depois .quadrado .circulo {
    left: 0;
}
.topete .centro {
    position: relative;
    float: left;
    width: calc(100% - 16px);
    height: 100%;
    background-color: #ffffff;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}
.topete .centro a {
    position: relative;
    float: left;
    width: 100%;
    height: calc(100% - 10px);
}
.topete .centro a  figure {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.topete .centro a  figure img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.faixatitulo {
    position: relative;
    float: left;
    width: calc(100% - 20px);
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.faixatitulo .otitulo {
    position: relative;
    float: left;
}
.faixatitulo .otitulo h3 {
    position: relative;
    float: left;
    color: #535353;
}
.faixatitulo .otitulo h3::before  {
    position: absolute;
    top: -10px;
    left: 0;
    width: 50px;
    height: 5px;
    background-color: #00b6a5;
    content: " ";
}

.faixadebotoes {
    position: relative;
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.faixadebotoes.centralizado {
    display: flex;
    justify-content: center;
    align-items: center;
}
.faixadebotoes .osbotoes {
    position: relative;
    float: left;
}

.botao {
    position: relative;
    float: left;
    padding: 10px 20px;
    border-radius: 5px;
    color: #ffffff;
    background-color: #00b6a5;
    transition: 0.25s;
    cursor: pointer;
    line-height: 32px;
    font-size: 18px;
    font-weight: bold;
}
.botao:hover {
    background-color: #136b62;
}
.botao.menor {
    padding: 5px 10px;
    border-radius: 5px;
    line-height: 28px;
    font-size: 16px;
    font-weight: bold;
}
.botao.botaoflutuantenofinal {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 999;
}
.botao.botaoflutuantenofinal.comsubida {
    bottom: 30px;
}

#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(to top, #020e5e 0%, #01082f 100%);
    height: 60px;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
    z-index: 99999;
    padding: 15px 0;
}

#main {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 90px;
    margin-bottom: -30px;
}

#footer {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 30px;
    background: linear-gradient(to bottom, #020e5e 0%, #01082f 100%);
}
#footer h6 {
    color: #ffffff;
    margin-bottom: 10px;
}
#footer a {
    color: #9fa7c1;
}
#footer p {
    font-size: 16px;
    line-height: 22px;
    color: #9fa7c1;
}
#footer .partelinha {
    position: relative;
    float: left;
    width: 100%;
}
#footer .partelinha.principal {
    padding: 20px 0;
}
#footer .partelinha.principal .parte {
    position: relative;
}
#footer .partelinha.principal .parte.menor {
    float: left;
    width: 300px;
}
#footer .partelinha.principal .parte.maior {
    float: right;
    width: calc(100% - 330px);
    margin-top: 10px;
}
#footer .partelinha.principal .parte.maior .fixo {
    position: relative;
    float: left;
    width: 400px;
}
#footer .partelinha.principal .parte.maior .variante {
    position: relative;
    float: right;
    width: calc(100% - 430px);
}
#footer .partelinha.assinatura {
    padding: 0;
    background-color: #01897c;
}
#footer .partelinha.assinatura p {
    font-size: 14px;
    line-height: 20px;
    color: #ffffff;
}
#footer .partelinha.assinatura p.copyright {
    position: relative;
    float: left;
    max-width: calc(100% - 60px);
}
#footer .partelinha.assinatura a.desenvolvedora {
    position: relative;
    float: right;
    max-width: 50px;
    height: 60px;
    line-height: 60px;
}
#footer .partelinha .alinha {
    position: relative;
    float: left;
    width: 100%;
}
#footer .redessociais {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 50px;
}
#footer .redessociais ul {
    position: relative;
    float: left;
    width: 100%;
}
#footer .redessociais ul li {
    position: relative;
    float: left;
    margin-right: 15px;
}
#footer .redessociais ul li a {
    position: relative;
    float: left;
    color: #ffffff;
    font-size: 28px;
    line-height: 32px;
}
#footer .redessociais ul li a:hover {
    color: #f7c21e;
}
#footer .mapadosite {
    position: relative;
    float: left;
    width: 100%;
}
#footer .mapadosite .links {
    position: relative;
    float: left;
    width: 100%;
    clear: both;
}
#footer .mapadosite .links ul {
    position: relative;
    float: left;
    width: calc(100% / 3);
}
#footer .mapadosite .links ul li {
    position: relative;
    float: left;
    width: calc(100% - 20px);
    clear: both;
    padding: 5px 0;
}
#footer .mapadosite .links ul li a {
    font-size: 16px;
    line-height: 20px;
}
#footer .mapadosite .links ul li a:hover {
    color: #f7c21e;
    text-decoration: underline;
}
#footer ul.listacanaisdecontato {
    position: relative;
    float: left;
    width: 100%;
    margin-top: -5px;
}
#footer ul.listacanaisdecontato li {
    position: relative;
    float: left;
    width: 100%;
    margin: 5px 0;
}
#footer ul.listacanaisdecontato li p {
    margin: 0;
}
#footer ul.listacanaisdecontato li a:hover {
    color: #f7c21e;
    text-decoration: underline;
}

#menuprincipal {
    position: relative;
    float: left;
    width: 100%;
}
#menuprincipal .headerlogo {
    position: relative;
    float: left;
    width: 200px;
    height: 60px;
}
#menuprincipal .headerlogo a {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
}
#menuprincipal .headerlogo a figure {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#menuprincipal .headerlogo a figure img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left;
}
#menuprincipal .headeritens {
    position: relative;
    float: right;
    max-width: calc(100% - 210px);
    height: 60px;
}
#menuprincipal ul.menu {
    position: relative;
    float: left;
    height: 60px;
}
#menuprincipal ul.menu li {
    position: relative;
    float: left;
    margin: 10px 0 10px 30px;
}
#menuprincipal ul.menu li.escondido {
    display: none;
}
#menuprincipal ul.menu li a {
    position: relative;
    float: left;
    line-height: 40px;
    color: #bdccff;
    font-weight: bold;
    font-size: 18px;
}
#menuprincipal ul.menu li a.duaslinhas {
    line-height: 20px;
}
#menuprincipal ul.menu li a.duaslinhas span {
    font-size: 14px;
}
#menuprincipal ul.menu li a:hover {
    color: #f7c21e;
}
#menuprincipal ul.itensextras {
    position: relative;
    float: left;
    height: 60px;
}
#menuprincipal ul.itensextras li {
    position: relative;
    float: left;
    height: 40px;
    margin: 10px 0 10px 20px;
}
#menuprincipal ul.itensextras li a.telefone {
    color: #ffffff;
    line-height: 20px;
}
#menuprincipal ul.itensextras li a.telefone span {
    font-size: 14px;
    font-weight: bold;
    color: #ffffff;
}
#menuprincipal ul.itensextras li a.telefone:hover {
    color: #f7c21e;
}
#menuprincipal ul.itensextras li a.telefone:hover span {
    color: #ffffff;
}
#menuprincipal ul.itensextras li a.conectarse {
    position: relative;
    float: left;
    line-height: 40px;
    background-color: #00b6a5;
    color: #ffffff;
    border-radius: 6px;
    padding: 0 10px;
    font-weight: bold;
    box-shadow: 0 2px 10px rgba(0,0,0,0.0);
}
#menuprincipal ul.itensextras li a.conectarse:hover {
    box-shadow: 0 2px 10px rgba(0,0,0,0.25);
}
#menuprincipal .togglemenu {
    position: relative;
    float: left;
    height: 60px;
    margin-left: 30px;
    line-height: 60px;
    font-size: 32px;
    color: #ffffff;
    display: none;
}


#bannerprincipal {
    position: relative;
    float: left;
    width: 100%;
    height: 600px;
    margin-top: -30px;
    overflow: hidden;
    background-color: #ff0000;
}

#cartoes {
    position: relative;
    float: left;
    width: 100%;
}
#cartoes ul.listagemdecartoes {
    position: relative;
    float: left;
    width: calc(100% + 20px);
    margin-left: -10px;
}
#cartoes ul.listagemdecartoes li {
    position: relative;
    float: left;
    width: calc((100% / 4) - 20px);
    margin: 15px 10px;
}
#cartoes ul.listagemdecartoes li:nth-child(4n+5){
    clear: both;
}
#cartoes ul.listagemdecartoes li .oitem {
    position: relative;
    float: left;
    width: 100%;
}
#cartoes ul.listagemdecartoes li .oitem figure {
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 20px;
}
#cartoes ul.listagemdecartoes li .oitem figure img {
    position: relative;
    float: left;
    width: 100%;
}
#cartoes ul.listagemdecartoes li .oitem p {
    width: calc(100% - 10px);
    margin: 10px 0;
}
#cartoes ul.listagemdecartoes li .oitem.amidia {
    position: relative;
    float: left;
    width: 100%;
}

#informativos {
    position: relative;
    float: left;
    width: 100%;
}
#informativos .osinformativos {
    position: relative;
    float: left;
    width: 100%;
}
#informativos .osinformativos .informativo {
    position: relative;
}
#informativos .osinformativos .informativo a {
    position: relative;
    float: left;
    width: 100%;
}
#informativos .osinformativos .informativo figure {
    position: relative;
    float: left;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
}
#informativos .osinformativos .informativo figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#informativos .osinformativos .informativo .conteudo {
    position: relative;
    float: right;
}
#informativos .osinformativos .informativo .conteudo p {
    margin: 10px 0 0 0;
}
#informativos .osinformativos .informativo.primeiro {
    float: left;
    width: calc(50% - 30px);
}
#informativos .osinformativos .informativo.primeiro figure {
    height: 430px;
}
#informativos .osinformativos .informativo.primeiro .conteudo {
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(100% - 40px);
    padding: 50px 20px 20px 20px;
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
    border-radius: 8px;
}
#informativos .osinformativos .informativo.primeiro .conteudo h6 {
    color: #ffffff;
}
#informativos .osinformativos .informativo.primeiro .conteudo p {
    color: #ffffff;
    display: none;
}
#informativos .osinformativos .informativo.posteriores {
    float: right;
    width: 50%;
    margin-bottom: 30px;
}
#informativos .osinformativos .informativo.posteriores figure {
    width: 200px;
    height: 200px;
}
#informativos .osinformativos .informativo.posteriores .conteudo {
    width: calc(100% - 220px);
}

#mobielinhas {
    position: relative;
    float: left;
    width: 100%;
    background-color: #28385e;
}
#mobielinhas .background figure {
    filter: grayscale(1);
    opacity: 0.1;
}
#mobielinhas .painelgradiente {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
}
#mobielinhas .informacoes {
    position: relative;
    float: left;
    width: calc(100% - 850px);
    margin: 30px 0;
}
#mobielinhas .informacoes h5 {
    color: #ffffff;
}
#mobielinhas .informacoes p {
    color: #ffffff;
    font-size: 16px;
    line-height: 28px;
}
#mobielinhas .informacoes p.resumo {
    font-size: 18px;
    line-height: 32px;
}
#mobielinhas .informacoes ul {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 10px;
}
#mobielinhas .informacoes ul li {
    position: relative;
    float: left;
    width: 100%;
}
#mobielinhas .informacoes ul li p {
    margin: 10px 0;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0;
}
#mobielinhas .informacoes ul li p i {
    color: #f7c21e;
}
#mobielinhas .osquadros {
    position: relative;
    float: right;
    width: 820px;
    padding: 15px 0;
}
#mobielinhas .osquadros .caixa {
    position: relative;
    float: left;
    width: 100%;
}
#mobielinhas .osquadros .caixa .quadro {
    position: relative;
    float: left;
    width: calc(50% - 50px);
    min-height: 160px;
    padding: 30px 20px;
    margin: 15px 0;
    background-color: #535353;
    border-radius: 8px;
}
#mobielinhas .osquadros .caixa .quadro h6 {
    color: #ffffff;
    margin-bottom: 10px;
    font-weight: 18px;
    line-height: 22px;
    text-transform: uppercase;
}
#mobielinhas .osquadros .caixa .quadro p {
    color: #ffffff;
    font-size: 14px;
    line-height: 24px;
}
#mobielinhas .osquadros .caixa .quadro a.comprar {
    position: relative;
    float: left;
    clear: both;
    color: #535353;
    width: calc(100% - 20px);
    height: 36px;
    font-weight: bold;
    text-transform: uppercase;
    /* background-color: #ec551e; */
    background-color: #ffffff;
    border-radius: 4px;
    line-height: 36px;
    padding: 0 10px;
    font-size: 14px;
    text-align: center;
}
#mobielinhas .osquadros .caixa .quadro form {
    position: relative;
    float: left;
    width: 100%;
}
#mobielinhas .osquadros .caixa .quadro form ul {
    position: relative;
    float: left;
    width: 100%;
}
#mobielinhas .osquadros .caixa .quadro form ul li {
    position: relative;
    float: left;
    width: calc(100% + 20px);
    margin-left: -10px;
    margin-top: 10px;
}
#mobielinhas .osquadros .caixa .quadro form ul li .campo {
    position: relative;
    float: left;
    margin: 0 10px;
}
#mobielinhas .osquadros .caixa .quadro form ul li .campo.inteiro {
    width: calc(100% - 20px);
}
#mobielinhas .osquadros .caixa .quadro form ul li .campo.metade {
    width: calc(50% - 20px);
}
#mobielinhas .osquadros .caixa .quadro form ul li .campo select {
    position: relative;
    float: left;
    width: 100%;
    height: 36px;
    border: none;
    border-radius: 4px;
    /* background-color: #f5aa8f; */
    background-color: #def5ff;
    color: #196969;
    padding: 0 5px;
}
#mobielinhas .osquadros .caixa .quadro form ul li .campo button {
    position: relative;
    float: left;
    width: 100%;
    background-color: #196969;
    color: #ffffff;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
    height: 36px;
    line-height: 36px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: 0.2s;
}
#mobielinhas .osquadros .caixa .quadro form ul li .campo button:hover {
    background-color: #2d8888;
}
#mobielinhas .osquadros .caixa .quadro.linhasdestino {
    float: left;
    /* background-color: #ec551e; */
    background-color: #1ea1d7;
}
#mobielinhas .osquadros .caixa .quadro.movivaletransportes {
    float: right;
    /* background-color: #196969; */
    background-color: #01c369;
}

#linksdogrupo {
    position: relative;
    float: left;
    width: 100%;
    padding: 30px 0;
    margin-bottom: 10px;
    background-color: #f4f4f4;
}
#linksdogrupo .oslinks {
    position: relative;
    float: left;
    width: 100%;
}
#linksdogrupo .oslinks ul {
    position: relative;
    float: left;
    width: calc(100% + 20px);
    margin-left: -10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#linksdogrupo .oslinks ul li {
    position: relative;
    float: left;
    width: calc(20% - 20px);
    margin: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#linksdogrupo .oslinks ul li a {
    position: relative;
    float: left;
    width: calc(100% - 20px);
    max-width: 200px;
}
#linksdogrupo .oslinks ul li a figure {
    position: relative;
    float: left;
    width: 100%;
    height: 100px;
}
#linksdogrupo .oslinks ul li a figure img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.background figure {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: grayscale(1);
    opacity: 0.1;
    overflow: hidden;
}
.background figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.controlefake {
    position: absolute;
    bottom: 20px;
    left: 0;
}
.controlefake ul {
    position: relative;
    float: right;
}
.controlefake ul li {
    position: relative;
    float: left;
    margin-left: 10px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    padding: 2px;
    border: 1px solid  #00b6a5;
}
.controlefake ul li a {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.controlefake ul li:first-child a {
    background-color: #00b6a5;
}


.quemsomos {
    display: flex;
    padding: 30px 0;
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 80px);
    max-width: 1600px;
    position: relative;
}

.quemsomos::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.05;
    background-image: url('../images/brand-shape.png');
    background-repeat: no-repeat;
    pointer-events: none;
}

.quemsomos .geral-empresa h3 {
    font-size: 46px;
    line-height: 60px;
    color: #010825;
    margin-bottom: 50px;
}

.quemsomos .geral-empresa h2 {
    font-size: 24px;
    line-height: 40px;
    color: #010825;
    margin-top: 16px;
    margin-bottom: 8px;
}

.quemsomos .geral-empresa p {
    font-size: 22px;
    line-height: 36px;
    color: #424242;
}

.quemsomos .geral-empresa .parceiros {
    margin-top: 16px;
    display: flex;
    align-items: center;
}

.chamada-contato {
    padding: 50px 40px;
    background: repeating-linear-gradient(
        135deg,
        #010514,
        #010514 2px,
        #010825 2px,
        #010825 8px
    );
    margin: 0 16px;
    top: 110px;
    position: sticky;
    max-width: 800px;
    width: 320px;
}

.chamada-contato h2 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

.chamada-contato p {
    color: rgba(255, 255, 255, .7);
    margin-bottom: 23px;
    font-size: 16px;
    line-height: 1.4;
}

.chamada-contato a {
    padding: 11px 40px;
    line-height: 24px;
    color: #fff;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    background: #020e5e;
    letter-spacing: 1px;
    text-transform: uppercase;
    border: none;
}

.genericbackground {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.genericbackground figure {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
}
.genericbackground figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.segmentohome {
    position: relative;
    float: left;
    width: 100%;
    background-color: #ffffff;
}

.caminho {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 0;
    min-height: 300px;
}
.caminho .conteudo {
    position: relative;
    float: left;
    width: 100%;
    min-height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.caminho .conteudo .caixa {
    position: relative;
    float: left;
    width: 100%;
}
.caminho .conteudo .caixa h3 {
    position: relative;
    float: left;
    color: #ffffff;
    font-size: 72px;
    width: 100%;
    text-align: center;
}
.caminho .conteudo .caixa .migalhas {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.caminho .conteudo .caixa .migalhas ul {
    position: relative;
    float: left;
}
.caminho .conteudo .caixa .migalhas ul li {
    position: relative;
    float: left;
}
.caminho .conteudo .caixa .migalhas ul li::after {
    position: relative;
    float: left;
    color: #ffffff;
    font-size: 24px;
    line-height: 32px;
    content: "/";
    padding: 0 10px ;
}
.caminho .conteudo .caixa .migalhas ul li:last-child::after {
    display: none;
}
.caminho .conteudo .caixa .migalhas ul li a {
    position: relative;
    float: left;
    font-size: 24px;
    line-height: 32px;
    color: #ffffff;
}
.caminho .conteudo .caixa .migalhas ul li a.ativo {
    color: #020e5e;
}
.caminho .conteudo .caixa .migalhas ul li a:hover {
    text-decoration: underline;
}

.contato-container {
    display: grid;
    grid-template-columns: 1fr 450px;
    padding: 32px 64px;
    column-gap: 32px;
    row-gap: 16px;
    margin: 0 auto;
    max-width: 1200px;
}

.contato-container h2 {
    font-size: 36px;
    margin: 16px 0;
    line-height: 1.2;
}

.contato-txt-destaque {
    color: #020e5e;
    margin: 0;
    font-weight: bold;
}

.contato-item-icon {
    background-color: #020e5e;
    width: 100px;
    height: 100px;
    font-size: 48px;
    display: flex;
    border-radius: 5px;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.contato-btn-cancelar,
.contato-btn-enviar {
    position: relative;
    float: left;
    background-color: #e81f1c;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    border: 0;
    border-radius: 4px;
    padding: 20px;
    cursor: pointer;
    margin-right: 6px;
    transition: .2s;
    transition: .3s;
    -o-transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
}

.contato-btn-enviar {
    background-color: #020e5e;
}

.contato-item-dir {
    display: flex;
    align-items: center;
    column-gap: 24px;
    width: 100%;
    margin: 16px 0;
}

.contato-item-dir h3 {
    font-size: 26px;
    line-height: 1.2;
}

.contato-item-dir p {
    margin: 0;
}

.contato-item-dir a {
    color: #535353;
}

.form-contato {
    margin-top: 42px;
}

.form-contato label {
    font-weight: bold;
    display: block;
    margin-top: 8px;
}

.form-contato .metade {
    width: calc(50% - 4px);
    display: inline-block;
}

.form-contato select,
.form-contato input,
.form-contato textarea {
    width: calc(100% - 20px);
    background-color: #f3f3f3;
    border: 0;
    padding: 15px 10px;
    font-size: 18px;
    line-height: 32px;
    border-radius: 6px;
    margin: 8px 0;
}

.form-contato select {
    width: 100%;
}

.form-contato textarea {
    resize: vertical;
}

.noticias {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 16px;
    row-gap: 16px;
    padding: 32px;
    margin: 0 auto;
    max-width: 1200px;
}

.noticias p {
    margin: 12px 0;
}

.noticias img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.noticias h1 {
    font-size: 32px;
    margin: 32px 0;
    width: 100%;
    text-align: center;
    display: inline-block;
    grid-column-start: 1;
    grid-column-end: 4;
}

.noticia-links {
    color: #fff;
    background-color: #020e5e;
    padding: 5px 10px;
    border-radius: 5px;
    line-height: 28px;
    font-size: 16px;
    font-weight: bold;
}

.noticia-links:hover {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}

.faqs {
    padding: 32px 64px;
}

.faqs ol {
    list-style: decimal;
    padding-left: 24px;
    clear: both;
    padding-top: 16px;
}

.faqs ol li::marker {
    font-weight: 700;
    color: #535353;
}

.inf-container {
    display: grid;
    grid-template-columns: 1fr 350px;
    padding: 32px 64px;
    column-gap: 32px;
}

.inf-img-principal {
    width: 100%;
    height: 450px;
    object-fit: cover;
}

.inf-conteudo {
    padding: 32px;
    border: 1px solid #ddd;
}

.inf-conteudo h1 {
    font-size: 36px;
    font-weight: 600;
    color: #222;
    line-height: 1.2;
}

.inf-conteudo .text p,
.inf-conteudo .text span {
    font-size: 16px;
    color: #222;
    line-height: 1.6;
}

.inf-categorias,
.inf-posts-recentes {
    background: #f4f4f4;
    padding: 32px;
    color: #111;
    margin-bottom: 32px;
}

.inf-categorias h3,
.inf-posts-recentes h3 {
    font-size: 24px;
    margin-bottom: 8px;
}

.inf-categorias a,
.inf-posts-recentes a {
    display: block;
    border-bottom: 1px solid #eee;
    color: #222;
    position: relative;
}

.inf-categorias a {
    padding: 16px;
}

.inf-posts-recentes a {
    padding: 16px 0;
}

.inf-posts-recentes p {
    margin: 0;
}

.inf-categoria-active {
    background: #fff;
}

.inf-categoria-active::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 6px;
    background: #020e5e;
}

.contato-mapa {
    width: 100%;
}

#linhasdestino {
    scroll-margin-top: 90px;
}

.listalinhasehorarios {
    position: relative;
    float: left;
    width: 100%;
    & .acaixa {
        position: relative;
        float: left;
        width: 100%;
        max-width: 960px;
        clear: both;
        & ul {
            position: relative;
            float: left;
            width: calc(100% + 10px);
            margin-left: -5px;
            & li {
                position: relative;
                float: left;
                width: calc(100% / 4);
                & .ohorario {
                    position: relative;
                    float: left;
                    width: calc(100% - 10px);
                    margin: 5px;
                    background-color: #def5ff;
                    border: 1px solid #aae6ff;
                    border-radius: 4px;
                    & p {
                        font-weight: bold;
                        text-align: center;
                    }
                }
            }
        }
        & p.semresultados {
            font-weight: bold;
            color: #ff0000;
            font-size: 18px;
        }
    }
}

#loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100vh !important;
    display: none;
    & .painel {
        position: relative;
        float: left;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.5);
        display: flex;
        justify-content: center;
        align-items: center;
        & .caixacentral {
            position: relative;
            float: left;
            width: 300px;
            & .icone {
                position: relative;
                float: left;
                width: 100%;
                height: 96px;
                display: flex;
                justify-content: center;
                align-items: center;
                & figure {
                    position: relative;
                    float: left;
                    width: 100%;
                    height: 100%;
                    & img {
                        width: 100%;
                        height: 100%;
                        object-fit: contain;
                    }
                }
            }
            & p {
                position: relative;
                float: left;
                width: 100%;
                clear: both;
                margin: 10px 0 0 0;
                text-align: center;
                font-weight: bold;
                color: #ffffff;
            }
        }
    }
}

#floatingwhatsapp {
    position: fixed;
    bottom: 50px;
    right: 30px;
    width: 64px;
    height: 64px;
    background-color: #25d366;
    color: #fff;
    overflow: hidden;
    border-radius: 50%;
    line-height: 64px;
    text-align: center;
    font-size: 42px;
    margin: 0;
    padding: 0;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .25);
    z-index: 99999;
}

#tabeladelinhasehorarios {
    position: relative;
    float: left;
    width: 100%;
    margin-top: -30px;
    & table {
        position: relative;
        float: left;
        width: 100%;
        & thead {
            & tr {
                & th {
                    padding: 10px 5px;
                    background-color: #000000;
                    color: #ffffff;
                    text-align: left;
                    font-weight: bold;
                    line-height: 22px;
                    font-size: 16px;
                }
                & th:first-child {
                    border-top-left-radius: 4px;
                    border-bottom-left-radius: 4px;
                }
                & th:last-child {
                    border-top-right-radius: 4px;
                    border-bottom-right-radius: 4px;
                }
            }
        }
        & tbody {
            & tr {
                & td {
                    padding: 10px 5px;
                    color: #535353;
                    text-align: left;
                    line-height: 20px;
                    font-size: 16px;
                }
                & td:first-child {
                    border-top-left-radius: 4px;
                    border-bottom-left-radius: 4px;
                }
                & td:last-child {
                    border-top-right-radius: 4px;
                    border-bottom-right-radius: 4px;
                }
            }
            & tr:nth-child(even) {
                & td {
                    background-color: #def5ff;
                }
            }
        }
    }
    & p.semresultados {
        font-weight: bold;
        color: #ff0000;
        font-size: 18px;
    }
}

/* medias */

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

    .container {
        width: calc(100% - 60px);
    }

    #floatingwhatsapp {
        right: 30px;
    }
    
}

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

    #cartoes ul.listagemdecartoes li {
        width: calc((100% / 3) - 20px);
    }
    #cartoes ul.listagemdecartoes li:nth-child(4n+5){
        clear: unset;
    }
    #cartoes ul.listagemdecartoes li:nth-child(3n+4){
        clear: both;
    }

    #footer .partelinha.principal .parte.maior .fixo {
        width: 300px;
    }
    #footer .partelinha.principal .parte.maior .variante {
        width: calc(100% - 320px);
    }
    #footer .mapadosite .links ul {
        width: calc(100% / 2);
    }
    #footer .mapadosite .links ul li {
        width: calc(100% - 10px);
    }

    #menuprincipal ul.menu li a {
        font-size: 16px;
    }
    
}


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

    .contato-container {
        grid-template-columns: 100%;
        padding: 16px 32px;
    }

    .quemsomos {
        flex-direction: column;
        padding: 16px;
        width: 100%;
        box-sizing: border-box;
    }

    .chamada-contato {
        width: 100%;
        margin: 0;
        box-sizing: border-box;
        max-width: 100%;
    }
}


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

    #mobielinhas .osquadros {
        width: 100%;
        max-width: 500px;
        float: left;
    }

    #mobielinhas .osquadros .caixa .quadro.movivaletransportes {
        width: 100%;
        box-sizing: border-box;
    }

    #mobielinhas .osquadros .caixa .quadro.linhasdestino {
        width: 100%;
        box-sizing: border-box;
    }

    #mobielinhas .informacoes {
        width: 100%;
        margin-bottom: 0;
    }

    #linksdogrupo .oslinks ul {
        flex-wrap: wrap;
    }

    #linksdogrupo .oslinks ul li {
        max-width: 120px;
        width: 100%;
    }

    #footer .partelinha.principal .parte.maior .fixo {
        position: relative;
        float: left;
        width: 100%;
        margin-bottom: 30px;
    }
    #footer .partelinha.principal .parte.maior .variante {
        position: relative;
        float: left;
        width: 100%;
    }
    #footer .mapadosite .links ul {
        width: calc(100% / 3);
    }
    #footer .mapadosite .links ul li {
        width: calc(100% - 30px);
    }

    #cartoes ul.listagemdecartoes li {
        width: calc((100% / 2) - 20px);
    }
    #cartoes ul.listagemdecartoes li:nth-child(3n+4){
        clear: unset;
    }
    #cartoes ul.listagemdecartoes li:nth-child(2n+3){
        clear: both;
    }

    #menuprincipal ul.menu {
        position: absolute;
        top: 50px;
        right: -300px;
        background-color: #020e5e;
        height: unset;
        padding: 10px 20px;
        border-radius: 8px;
        border: 1px solid #01082f;
        box-shadow: 0 2px 20px rgba(0, 0, 0, 0.35);
        opacity: 0;
        transition: 0.2s;
    }
    #menuprincipal ul.menu li {
        position: relative;
        float: right;
        margin: 0;
        clear: both;
        min-width: 200px;
        text-align: right;
    }
    #menuprincipal ul.menu li a {
        text-align: right;
        float: right;
    }

    #menuprincipal .togglemenu {
        display: inherit;
    }
    #menuprincipal.aberto ul.menu {
        right: 0;
        opacity: 1;
    }

    #informativos .osinformativos .informativo {
        margin-bottom: 30px;
    }
    #informativos .osinformativos .informativo.primeiro,
    #informativos .osinformativos .informativo.posteriores {
        width: 100%;
    }
    #informativos .osinformativos .informativo.primeiro figure,
    #informativos .osinformativos .informativo.posteriores figure {
        width: 300px;
        height: 200px;
    }
    #informativos .osinformativos .informativo.primeiro .conteudo,
    #informativos .osinformativos .informativo.posteriores .conteudo {
        position: relative;
        float: right;
        width: calc(100% - 320px);
        padding: 0;
        background: unset;
    }
    #informativos .osinformativos .informativo.primeiro .conteudo h6,
    #informativos .osinformativos .informativo.posteriores .conteudo h6 {
        color: #535353;
        margin-bottom: 10px;
    }
    #informativos .osinformativos .informativo.primeiro .conteudo p,
    #informativos .osinformativos .informativo.posteriores .conteudo p {
        color: #535353;
        display: initial;
    }
    .noticias {
        grid-template-columns: repeat(2, 1fr);
        padding: 32px 16px;
    }
    .inf-container {
        grid-template-columns: 100%;
        padding: 32px 16px;
        row-gap: 32px;
    }
    .inf-conteudo {
        padding: 32px 16px;
    }
    .inf-conteudo h1 {
        font-size: 28px;
    }
    .inf-posts-recentes {
        margin-bottom: 0;
    }
}


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

    .form-contato .metade {
        width: 100%;
    }

    h6 {
        font-size: 18px;
        line-height: 24px;
    }
    
    p {
        font-size: 16px;
        line-height: 22px;
        margin: 15px 0;
    }

    #footer .mapadosite .links ul {
        width: 100%;
    }
    #footer .mapadosite .links ul li {
        width: 100%;
    }

    .caminho .conteudo .caixa h3 {
        font-size: 50px;
    }

    .quemsomos .geral-empresa h3 {
        font-size: 36px;
        margin-bottom: 16px;
        line-height: 1.2;
    }

    .faqs {
        padding: 32px;
    }

    .listalinhasehorarios {
        & .acaixa {
            & ul {
                & li {
                    width: calc(100% / 3);
                }
            }
        }
    }

}


@media only screen and (max-width: 640px) {
    
    .container {
        width: calc(100% - 40px);
    }

    #main {
        margin-top: 70px;
    }

    #header {
        height: 40px;
    }

    .swiper-banner {
        max-height: 500px;
    }

    #menuprincipal .headerlogo {
        width: 100px;
        height: 40px;
    }
    #menuprincipal .headeritens {
        max-width: calc(100% - 110px);
        height: 40px;
    }
    #menuprincipal ul.itensextras li {
        position: relative;
        float: left;
        height: 40px;
        margin: 0 0 0 15px;
    }
    #menuprincipal .togglemenu {
        height: 40px;
        margin-left: 20px;
        line-height: 40px;
        font-size: 32px;
    }

    #informativos .osinformativos .informativo {
        margin-bottom: 20px;
    }
    #informativos .osinformativos .informativo.primeiro figure,
    #informativos .osinformativos .informativo.posteriores figure {
        width: 200px;
    }
    #informativos .osinformativos .informativo.primeiro .conteudo,
    #informativos .osinformativos .informativo.posteriores .conteudo {
        width: calc(100% - 220px);
    }

    #footer .partelinha.principal .parte.menor {
        width: 100%;
    }
    #footer .partelinha.principal .parte.menor .redessociais {
        margin: 30px 0;
    }
    #footer .partelinha.principal .parte.maior {
        width: 100%;
    }
    #footer .mapadosite .links ul {
        width: calc(100% / 3);
    }
    #footer .mapadosite .links ul li {
        width: calc(100% - 10px);
    }
    .noticias {
        grid-template-columns: 100%;
    }
    .informativo-item {
        border-bottom: 1px solid #eee;
        padding-bottom: 16px;
    }

    #floatingwhatsapp {
        right: 20px;
    }

    #tabeladelinhasehorarios {
        & table {
            & thead {
                & tr {
                    & th {
                        padding: 10px 5px;
                        line-height: 16px;
                        font-size: 14px;
                    }
                }
            }
            & tbody {
                & tr {
                    & td {
                        padding: 10px 5px;
                        line-height: 16px;
                        font-size: 14px;
                    }
                }
            }
        }
        & p.semresultados {
            font-size: 16px;
        }
    }

}


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

    #cartoes ul.listagemdecartoes li {
        width: calc(100% - 20px);
        clear: both;
    }
    #cartoes ul.listagemdecartoes li:nth-child(2n+3){
        clear: unset;
    }

    #informativos .osinformativos .informativo.primeiro figure,
    #informativos .osinformativos .informativo.posteriores figure {
        width: 100%;
        margin-bottom: 10px;
    }
    #informativos .osinformativos .informativo.primeiro .conteudo,
    #informativos .osinformativos .informativo.posteriores .conteudo {
        width: 100%;
    }

    #footer .mapadosite .links ul {
        width: 100%;
    }
    #footer .mapadosite .links ul li {
        width: 100%;
    }

    .contato-container {
        padding: 8px 16px;
    }

    .listalinhasehorarios {
        & .acaixa {
            & ul {
                & li {
                    width: calc(100% / 2);
                }
            }
        }
    }

    #tabeladelinhasehorarios {
        & table {
            & thead {
                & tr {
                    & th {
                        padding: 10px 5px;
                        line-height: 14px;
                        font-size: 12px;
                    }
                }
            }
            & tbody {
                & tr {
                    & td {
                        padding: 10px 5px;
                        line-height: 14px;
                        font-size: 12px;
                    }
                }
            }
        }
        & p.semresultados {
            font-size: 16px;
        }
    }

}

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

    #menuprincipal ul.itensextras {
        display: none;
    }
    #menuprincipal ul.menu li.escondido {
        display: initial;
    }
    
}


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

    #tabeladelinhasehorarios {
        & table {
            & thead {
                & tr {
                    & th {
                        padding: 10px 5px;
                        line-height: 10px;
                        font-size: 8px;
                    }
                }
            }
            & tbody {
                & tr {
                    & td {
                        padding: 10px 5px;
                        line-height: 10px;
                        font-size: 8px;
                    }
                }
            }
        }
        & p.semresultados {
            font-size: 16px;
        }
    }
    
}


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

    .container {
        width: calc(100% - 30px);
    }

    #floatingwhatsapp {
        right: 15px;
    }
    
}