*:focus {
    outline: 2px solid #f0f!important
}

body,html {
    height: 100%;
    overflow-x: hidden;
}

body {
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    line-height: 137%;
    color: #575757;
    background: #f3f3f4;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ebfffb",endColorstr="#ffffff",GradientType=1);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e2f9f5",endColorstr="#ffffff",GradientType=1);
}

.ida-embarque {
    background-color: #ff0;
    padding: 4px 8px;
    font-weight: 700;
    border: 1px solid #ccc;
    border-radius: 3px;
    line-height: 240%;
    margin-right: 4px
}

.ida-desembarque {
    background-color: #73af25;
    color: #fff!important;
    padding: 4px 8px;
    font-weight: 700;
    border: 1px solid #ccc;
    border-radius: 3px;
    line-height: 240%;
    margin-right: 4px
}

.volta {
    background-color: red;
    color: #fff!important;
    padding: 4px 8px;
    font-weight: 700;
    border: 1px solid #ccc;
    border-radius: 3px;
    line-height: 240%;
    margin-right: 4px
}

section {
    padding: 30px 0
}

img {
    max-width: 100%
}

a:focus,a:hover {
    opacity: .9
}

.topo-prefeitura {
    padding: 0;
    background: none repeat scroll 0 0 #555;
    width: 100%;
    padding-top: 5px;
    font-size: 14px
}

.links-topo-prefeitura,.links-topo-prefeitura a {
    text-align: left;
    display: inline;
    color: #ccc;
    font-size: 14px;
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    font-weight: 700;
    text-decoration: none!important
}

.topo-secretaria {
    padding: 0;
    background: none repeat scroll 0 0 #ccc;
    width: 100%;
    padding: 5px 0
}

.topo-secretaria a {
    text-align: left;
    display: inline;
    color: #666;
    font-size: 12px;
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    font-weight: 400;
    text-decoration: none!important
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.link-acesso-informacao {
    margin-top: -3px
}

.conteudo-info-1,.conteudo-info-2 {
    float: left;
    width: 100%
}

@media all and (max-width: 991px) {
    .links-topo-prefeitura {
        font-size:11px;
        line-height: 140%
    }

    .links-topo-prefeitura a {
        font-size: 12px!important
    }

    .link-acesso-informacao {
        margin-top: -3px
    }

    .ico-acesso-informacao {
        width: 15px;
        height: auto
    }

    .links-topo-prefeitura {
        padding: 3px 0
    }

    .base-logos {
        margin-bottom: 30px!important
    }

    .base-logos {
        position: relative;
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
        float: left;
        margin-top: 0
    }

    .conteudo-info-1 {
        width: 100%;
        float: left
    }

    .mapa1 {
        margin-left: -15px!important;
        margin-top: 13px!important
    }

    .conteudo-info-2 {
        width: 100%;
        float: left
    }

    .mapa2 {
        margin-left: -15px!important;
        margin-top: 13px!important
    }
}

@media all and (max-width: 612px) {
    .links-topo-prefeitura {
        text-align:center
    }

    .links-topo-prefeitura a {
        font-size: 10px!important
    }

    .link-acesso-informacao {
        margin-top: -1px
    }

    .topo-secretaria {
        text-align: center;
        padding: 2px 0;
        margin: 0!important
    }

    .topo-secretaria a {
        font-size: 10px
    }

    .link-topo-secretaria {
        margin: 0!important;
        padding: 0!important
    }

    .link-topo-secretaria a {
        margin: 0!important;
        padding: 0!important
    }

    .ico-acesso-informacao {
        width: 10px;
        height: auto
    }

    .base-titulo-internas {
        background-position: top left!important;
        height: 200px!important;
        background-size: cover!important
    }
}

@media all and (max-width: 500px) {
    .links-topo-prefeitura a {
        font-size:9px!important;
        display: block;
        line-height: 11px;
        text-align: center;
        padding: 0 10px
    }
}

.header {
    position: relative;
    padding-top: 30px;
    background-image: url(https://www.sptrans.com.br/media/16741/bg-header.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

.grid-header {
    background-color: #e2001a;
    background-repeat: no-repeat;
    background-size: auto;
    background-position: bottom center;
    height: 2px;
}

@media all and (min-width: 1921px) {
    .header {
        background-size:100vw
    }
}

.base-mainmenu {
    background-color: #cecece;
    height: 40px;
    text-align: center;
    position: relative
}

.mainmenu {
    background-image: url(/media/3476/bg-mainmenu.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 53px;
    width: 397px;
    text-align: center;
    position: absolute;
    z-index: 3000;
    left: 50%;
    margin-left: -198px;
    top: -13px;
    padding-top: 13px
}

.mainmenu a:link,.mainmenu a:visited {
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 18px;
    padding-top: 10px;
    display: inline;
    margin-top: 10px;
    color: #000;
    margin: 0 8px;
    text-decoration: none
}

.mainmenu a:hover,.mainmenu a:active,.mainmenu a:focus {
    color: #ec1f26
}

.mainmenu a.active {
    border-bottom: 2px solid #ec1f26
}

@media all and (min-width: 751px) {
}

.base-logos {
    position: relative;
    width: 100%;
    text-align: center;
    margin-bottom: 30px;
    float: left;
    margin-top: 0
}

.logos {
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

.logo-evento {
    padding-right: 30px;
    margin-right: 30px;
    text-align: left;
    border-right: 1px solid #575757;
    float: left;
    max-width: 258px;
}

.logo-sptrans {
    float: left;
    max-width: 89px;
    width: 100%;
}1

.logo-sptrans img{
    margin-top: 26px!important;
}

.logo-sptrans img {position: absolute;top: 32px;left: 0;}

.logo-smt {
    float: left;
    margin-left: 26px;
    width: 100%;
    max-width: 100px;
}

@media all and (min-width: 992px) and (max-width:1199px) {
    .logo-evento {
    }
}

@media all and (max-width: 991px) {
    .header {
        height:auto
    }

    .logos {
    }

    .imagem-local {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px
    }
}

@media all and (max-width: 766px) {
    .box-destaque {
        font-size:16px
    }

    .texto-legal {
        font-size: 12px;
        line-height: 142%
    }

    .titulo-internas {
        font-size: 30px;
        line-height: 130%
    }

    .conteudo-internas p {
        margin-bottom: 15px;
        line-height: 142%;
        font-size: 15px
    }
}

.conteudo-internas img {
    max-width: 100%!important;
}

@media all and (max-width: 650px) {
    .img-banner-home-mobile {
        display:block
    }

    .img-banner-home {
        display: none
    }
}

.box-padrao {
    max-width: 500px;
    width: 90%;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 5px
}

.interna .box-padrao {
    max-width: 100%;
    width: 100%;
    margin: -19px auto 30px;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 5px;
    float: left
}

.box-padrao .base-header {
    font-size: 18px;
    padding: 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    text-transform: uppercase;
    background-color: #c00;
    color: #fff;
    text-align: left;
    position: relative
}

.box-padrao .base-header h1 {
    font-size: 18px;
    padding: 0;
    margin: 0
}

.box-padrao h3 {
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 20px;
    line-height: 139%
}

.subtitulo-exemplos {
    font-size: 14px;
    color: #e2001a;
    margin-bottom: 20px
}

.box-padrao .coluna-dir {
    border-left: 1px solid #ccc
}

@media all and (max-width: 767px) {
    .box-padrao .coluna-dir {
        border-left:0
    }
}

.box-padrao .coluna-dir-esp {
    border-left: 0
}

@media all and (max-width: 767px) {
    .box-padrao .coluna-dir-esp {
        border-left:0
    }
}

.box-padrao .coluna-esq-esp {
    border-right: 1px solid #ccc
}

@media all and (max-width: 767px) {
    .box-padrao .coluna-esq-esp {
        border-right:0
    }
}

.com-limite {
    color: #000
}

.sem-limite {
    color: #000
}

.box-padrao .modelo-cartao {
    margin-bottom: 30px
}

.conteudo-box p a {
    color: #dc222a;
    text-decoration: underline
}

.box-padrao .ico-header-box {
    border-radius: 100px;
    background-color: #fff;
    width: 60px;
    height: 60px;
    position: absolute;
    top: -11px;
    border: 3px solid #c00
}

.box-padrao .ico-bu {
    background-image: url(../images/ico-box-header-bilhete.png);
    background-repeat: no-repeat;
    background-position: center center
}

.botao-voltar {
    display: block;
    text-align: center;
    margin-top: 30px
}

.botao-voltar a {
    padding: 10px;
    background-color: #c00;
    color: #fff
}

.texto-header-box {
    margin-left: 76px
}

.box-padrao .conteudo-box {
    padding: 20px
}

.interna .box-padrao .conteudo-box {
    padding: 0
}

.botao-consultar {
    border: 1px solid #ddd;
    border-radius: 2px;
    text-align: center;
    color: #c00;
    background-color: #f5f5f5;
    padding: 7px;
    margin-top: 15px
}

.botao-consultar:focus {
    border: 1px solid #aaa
}

.textField {
    border: 1px solid #ccc;
    padding: 3px
}

input:focus {
    border: 1px solid #aaa
}

.grupo-usuario:first-child {
    border-bottom: 1px solid #d0d0d0;
    padding: 10px 0 20px;
    float: left
}

.grupo-usuario {
    border-bottom: 1px solid #d0d0d0;
    padding: 0 0 20px;
    float: left
}

.grupo-usuario:last-child {
    border-bottom: 0;
    padding: 10px 0 20px;
    float: left
}

.grupo-usuario h2 {
    text-align: left;
    font-size: 16px;
    text-align: left;
    color: #c00;
    margin-left: 10px;
    line-height: 140%
}

.box-cartao {
    background-color: #fff;
    box-sizing: border-box;
    padding: 10px
}

.conteudo-cartao {
    background-color: #f5f5f5;
    padding: 10px;
    text-align: left;
    min-height: 190px
}

.conteudo-cartao p {
    margin: 0
}

.conteudo-cartao a {
    color: #c00;
    text-decoration: underline
}

.box-cartao h3 {
    background-color: #fff;
    padding: 10px;
    font-size: 18px;
    color: #c00;
    font-weight: 700;
    text-align: center;
    margin-top: 0
}

footer{
    border-top: 2px solid #e2001a;
    padding-top: 0;
}

.bg-footer {
    background-color: #333;
    padding: 50px 0!important;
    margin: 0!important
}

.bg-footer-claro {
    background-color: #ccc;
    padding: 20px 0 40px 0;
    margin-top: 0;
    color: #fff;
    position: relative;
    padding-top: 30px;
    background-image: url(https://www.sptrans.com.br/media/16741/bg-header.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

.social-things-footer .social-icon {
    margin-right: 5px
}

.endereco-prefeitura-rodape {
    font-size: 12px!important;
    padding: 5px 0;
    background-color: #eee;
    color: #666
}

.endereco-prefeitura-rodape a {
    color: #666
}

.endereco-sptrans-footer {
    margin-top: 30px;
    font-size: 13px;
    line-height: 120%;
    color: #575757;
}

@media(max-width: 991px) {
    .bg-footer-claro {
        text-align:center!important
    }

    .social-things-footer {
        margin: 10px 0
    }

    .endereco-sptrans-footer {
        margin-top: 20px;
        font-size: 13px;
        line-height: 120%
    }

    .social-things-footer .social-icon {
        margin: 0 5px
    }

    .endereco-prefeitura-rodape,.endereco-prefeitura-rodape .text-right {
        text-align: center!important;
        line-height: 130%
    }

    .link-footer {
        margin-top: 6px;
        text-align: center;
    }

    .link-footer p{
        text-align: center;
    }
}

.footer .logo-smt {
    float: none;
    display: inline;
    margin-left: 40px;
    max-width: 95px;
    position: relative;
}

.footer .logo-sptrans {
    float: none;
    display: inline-block;
    position: relative;
}

@media all and (max-width: 991px) {
    .footer .logos-footer {
        text-align:center;
        width: 100%;
        display: flex;
        justify-content: center;
    }
}

body+object,body+object+object {
    display: none
}

.row {
    margin-right: -15px;
    margin-left: -15px
}

@media all and (max-width: 370px) {
    body {
        overflow-x:hidden
    }
}

.box-home h3 {
    color: #fff
}

.box-home {
    background-color: #dc222a;
    min-height: 160px;
    border: 5px solid #fff;
    margin-bottom: 20px;
    color: #fff;
    border-radius: 15px
}

iframe .i4ewOd-pzNkMb-haAclf {
    background-color: #dc222a!important
}

.conteudo-duvida p {
    text-align: left
}

.grupo-duvida:first-child {
    border-bottom: 1px solid #d0d0d0;
    padding: 10px 0 20px;
    float: left;
    margin-top: 20px
}

.grupo-duvida {
    border-bottom: 1px solid #d0d0d0;
    padding: 0 0 20px;
    float: left;
    width: 100%
}

.grupo-duvida:last-child {
    border-bottom: 0;
    padding: 10px 0;
    float: left
}

.grupo-duvida h2 {
    text-align: left;
    font-size: 16px;
    text-align: left;
    color: #c00;
    margin-left: 10px;
    line-height: 140%
}

.grupo-duvida .panel-body {
    text-align: left
}

.grupo-duvida .panel-group {
    margin-bottom: 7px
}

.grupo-duvida .panel-group .panel+.panel {
    margin-top: 10px
}

.intro-pagina {
    font-size: 17px;
    margin-bottom: 20px;
    line-height: 138%
}

#termo {
    text-align: left
}

#termo p {
    font-size: 12px
}

.base-box-home .panel-default>.panel-heading {
    background-color: #fff!important;
    border-color: #fff!important
}

.base-box-home .panel {
    border: 0!important;
    box-shadow: none!important
}

.base-box-home {
    padding-bottom: 10px!important
}

.botao-termo {
    font-size: 13px!important
}

#termo .panel-body {
    border: 1px solid #ddd!important;
    background-color: #f9f9f9;
    border-radius: 5px
}

.box-orientacoes .panel p a {
    color: #dc222a;
    text-decoration: underline
}

.imagens-bu {
    text-align: center!important
}

@media all and (max-width: 455px) {
    .imagens-bu img {
        width:70px;
        height: auto
    }
}

@media all and (max-width: 360px) {
    .imagens-bu img {
        width:50px;
        height: auto
    }
}

.interna .data {
    color: #21a5e0;
    font-weight: 700;
    padding-top: 20px;
    font-size: 12pt;
    display: inline-block;
    border-bottom: 1px solid #21a5e0;
    width: 100%;
    padding-bottom: 14px
}

.interna ul a {
    width: 100%;
    display: inline-block;
    text-decoration: none
}

.interna ul {
    padding: 0
}

.interna ul a:nth-child(even) li {
    background: #fafafa!important
}

.interna ul a li:hover {
    background: rgba(235,231,34,.5)!important
}

.interna ul a li.item-noticias-carnaval {
    font-size: 12pt;
    border-bottom: 2px solid #eee;
    padding: 30px 20px;
    list-style-position: inside
}

.noticiah1 {
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    font-weight: 700;
    text-align: center;
    display: inline-block;
    padding: 0 15px 20px;
    color: #ec1f26;
    margin-bottom: 25px;
    width: 100%;
    font-size: 18pt!important;
    line-height: 124%;
    display: none
}

.dataNoticia {
    text-align: center;
    display: inline-block;
    margin-bottom: 40px;
    color: #333;
    font-weight: 700;
    display: inline-block;
    padding: 5px 8px
}

.voltarNoticias {
    text-align: center;
    display: inline-block;
    margin-bottom: 40px;
    font-weight: 700;
    display: inline-block;
    padding: 5px 8px;
    margin-top: 50px;
    color: #fff!important;
    background: #ec1f26!important;
    text-decoration: none
}

body .noticia p,body .noticia span,body .noticia div {
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    font-size: 11pt!important;
    line-height: 1.5
}

.NoticiasCarnaval {
    text-align: center;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 40px;
    font-weight: 700;
    display: inline-block;
    padding: 5px 8px;
    z-index: 1;
    position: relative;
    margin: 0!important;
    text-transform: initial;
    background-color: #e22f4e!important;
    color: #fff!important
}

#tabelalinhas {
    margin-bottom: 40px!important
}

td {
    text-align: center;
    font-size: 12pt;
    padding: 0!important
}

td a {
    text-align: center;
    font-size: 10.5pt;
    padding: 10px 15px;
    width: 100%;
    display: inline-block;
    color: #ef4d37
}

td a:hover {
    color: #fff!important;
    background: #ec1f26!important;
    text-decoration: none;
    font-weight: 700;
    opacity: 1!important
}

td a:active {
    color: #fff!important;
    background: #ef4d37!important;
    text-decoration: none;
    font-weight: 700;
    opacity: 1!important
}

tr:nth-child(even) td a {
    background: #f8f8f8
}

#tabelalinhas_filter {
    margin: 0 auto!important
}

.dataTables_filter {
    display: none
}

#projects_table_filter {
    display: block;
    margin: 0 auto
}

.dataTables_empty {
    font-size: 10pt;
    padding: 8px 0!important
}

table.dataTable.no-footer {
    border-bottom: 0!important
}

@media all and (max-width: 500px) {
    .input-group {
        width:100%!important
    }
}

.logo-evento img {
}

.base-logos .logo-sptrans,.base-logos .logo-smt {
    top: 0;
    position: relative
}

#corpo {
    top: -40px;
    position: relative
}

.noticia img {
    width: 500px;
    max-width: 500px;
    height: auto
}

.logos-footer {
    margin-bottom: 50px;
    position: relative;
    width: auto;
    display: flex;
    height: auto;
}

.logos-footer .logo-sptrans img {
}

.footer .copyright p {
    margin-top: -14px
}

.sidebar-alteracoesOP {
    display: none
}

#conteudo .col-md-9 {
    width: 100%
}

#conteudo h2,h3,p {
    text-align: left
}

#conteudo h2 {
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    text-transform: uppercase;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 5px;
    font-weight: 700;
    font-size: 24px
}

#conteudo h2 em {
    font-size: .8em
}

#conteudo p {
    font-size: 15px;
    line-height: 143%
}

#conteudo p em {
    font-size: .9em
}

#conteudo h3 {
    font-size: 18px;
    text-align: left;
    margin-bottom: 13px;
    line-height: 140%
}

.breadcrumb-sptrans {
    display: none
}

.header-interna-informativos {
    background-color: transparent!important;
    padding: 0!important;
    margin-bottom: 20px
}

.container_header-interna small {
    display: none
}

#conteudo h1 {
    font-size: 18pt;
    font-weight: 800;
    text-align: center;
    margin: 20px 0;
    letter-spacing: -.025em;
    hyphens: none;
    width: 100%;
    line-height: 1.1;
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    color: #ec1f26!important
}

.botao-linha-especial {
    background-color: #fcc300;
    padding: 5px;
    text-align: center;
    margin: 0 auto 10px;
    transform: rotate(-1deg)!important;
    border-radius: 2px;
    width: 570px;
    max-width: 100%
}

.botao-linha-especial a {
    text-decoration: none;
    color: #105e06;
    font-weight: 700;
    font-family: Outfit,Roboto,Arial,helvetica neue,Helvetica,sans-serif;
    display: block;
    line-height: 123%
}

.mapa1 {
    margin-top: 30px;
    margin-left: 20px
}

.mapa2 {
    margin-top: 30px;
    margin-left: 20px
}



#footer a{
	color: #575757!important;
}

#footer .copyright{
	margin-top: 29px;
}





@media all and (max-width: 580px){
.logo-sptrans{
    max-width:70px
}

    .logo-sptrans img{
}

    .logo-evento{
        max-width: 200px;
    }


    .logo-smt{
    max-width: 80px!important;
        margin-left: 20px
    }
    
}

@media all and (max-width: 430px){
.logo-sptrans{
    max-width:60px
}

    .logo-sptrans img{
}

    .logo-evento{
        max-width: 180px;
    }


    .logo-smt{
    max-width: 70px!important;
        margin-left: 20px
    }
    
}

.logo-smt img{position: absolute;width: 100%;left: 0;top: 0;}
}