﻿/*@media screen and (max-width:425px) {
    .grupos .grupo .cols {
        margin-top: 30px;
    }
}*/

@media screen and (max-width:1024px) {


    .grupos .grupo .cols {
        /*margin-top: 30px;*/
        /*margin-top: 8%;*/
    }

    .painel {
        padding-top: 60px;
    }

    .intro .logos {
        width: 100px;
        float: none;
        margin: auto;
    }

    .intro .txt2 {
        display: table;
        width: 90%;
        float: none;
        font-size: 20px;
        line-height: 25px;
        text-align: center;
        padding-top: 15px;
        margin: auto;
    }

        .intro .txt2 div {
            display: table;
            width: 100%;
            margin: auto;
            font-size: 44px;
            padding-bottom: 6px;
        }

            .intro .txt2 div span {
                font-size: 47px;
            }

    .numberstop {
        width: 90%;
        margin-top: 20px;
        padding-bottom: 40px;
    }

        .numberstop .topico {
            display: table;
            width: 50%;
            float: left;
            padding-left: 10px;
            padding-right: 10px;
            padding-bottom: 10px;
        }

        .numberstop .txt2 {
            font-size: 18px;
            line-height: 23px;
            font-weight: 400;
            padding-top: 2px;
            color: #fff;
            opacity: 0.6;
        }

        .numberstop .txt1 {
            font-size: 90px;
            line-height: 80px;
        }

            .numberstop .txt1 span {
                padding-top: 3px;
            }

    .grupos .grupo .txts {
        display: table;
        width: 100%;
        margin: auto;
        position: absolute;
        top: 2%;
        left: 0px;
        z-index: 2;
    }

    .painel3 .right .txt1 {
        font-size: 44px;
        line-height: 38px;
        text-align: center;
    }

    .painel3 .right .txt2 {
        font-size: 20px;
        letter-spacing: 0px;
        line-height: 28px;
        text-align: center;
        color: #283341;
        padding-bottom: 5px;
    }

        .painel3 .right .txt2 span {
            text-align: center;
            width: 100%;
        }

    .painel3 .right .borderresp {
        text-align: center;
        width: 80%;
    }

    .grupos .txt1 {
        padding-bottom: 20px;
    }
    .txtdatas {
        display: table;
        margin: auto;
        width: 100%;
        max-width: initial;
        font-family: "Oswald", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        text-align: center;
        font-size: 18px;
        letter-spacing: 0px;
        line-height: 26px;
        padding-bottom: 13px;
        padding-left: 0px;
    }

    .aba .ctaba .txt3aba {
        display: table;
        position: relative;
        color: #ea6667;
        font-family: "Karantina", system-ui;
        font-weight: 700;
        font-style: normal;
        font-size: 26px;
        letter-spacing: 0px;
        line-height: 30px;
        text-align: left;
        color: #283341;
        text-transform: uppercase;
        border-radius: 3px;
        margin-bottom: 0px;
        text-align: left;
    }

    .aba .ctaba {
        display: table;
        padding: 20px;
        padding-top: 25px;
        padding-bottom: 20px;
    }

        .aba .ctaba .txt2aba {
            display: table;
            width: 100%;
            font-family: "Oswald", sans-serif;
            color: #283341;
            font-size: 18px;
            line-height: 26px;
            letter-spacing: 0px;
            font-weight: 300;
            padding-bottom: 10px;
            text-align: left;
        }

        .aba .ctaba .txt5aba {
            display: table;
            width: 100%;
            font-family: "Oswald", sans-serif;
            color: #283341;
            font-size: 18px;
            line-height: 26px;
            letter-spacing: 0px;
            font-weight: 300;
            padding-bottom: 0px;
            text-align: left;
        }

    .painel3 {
        display: table;
        width: 100%;
        margin: auto;
        margin-bottom: 20px;
    }

    .painel4 .txt1 {
        display: table;
        width: 100%;
        margin: auto;
        font-family: "Karantina", system-ui;
        font-weight: 700;
        font-style: normal;
        font-size: 44px;
        letter-spacing: 0px;
        line-height: 38px;
        text-align: center;
        color: #283341;
        text-transform: uppercase;
    }

    .painel4 .fasesImg img {
        padding-left: 10px;
        padding-right: 10px;
    }

    .painel5 .left {
        display: table;
        width: 40%;
        float: left;
        padding-top: 0px;
        padding-bottom: 30px;
        padding-right: 60px;
        position: sticky;
        top: 30px;
    }

        .painel5 .left .txt1 {
            display: table;
            width: 100%;
            font-family: "Karantina", system-ui;
            font-weight: 700;
            font-style: normal;
            font-size: 44px;
            letter-spacing: 0px;
            line-height: 38px;
            text-align: center;
            color: #283341;
            text-transform: uppercase;
        }

    .painel4 .txt2 {
        font-size: 22px;
        line-height: 32px;
    }

    .painel5 .line .taca {
        display: table;
        float: none;
        margin: auto;
        width: 80%;
        margin-top: 5px;
        display: flex;
        justify-content: center; /* Alinha horizontalmente */
        align-items: center; /* Alinha verticalmente (requer altura no container) */
        flex-wrap: wrap; /* Permite que as divs quebrem linha se necessário */
        gap: 10px;
    }

    .painel5 .line .txt2 {
        display: table;
        float: none;
        width: 100%;
        font-weight: 500;
        font-size: 20px;
        line-height: 22px;
        text-align: center;
        padding-top: 5px;
        padding-bottom: 20px;
    }

    .painel5 .right .txt1 {
        display: table;
        width: 100%;
        font-family: "Karantina", system-ui;
        font-weight: 700;
        font-style: normal;
        font-size: 44px;
        letter-spacing: 0px;
        line-height: 38px;
        text-align: center;
        color: #283341;
        text-transform: uppercase;
    }

    .painel5 .right {
        padding-top: 20px;
    }

        .painel5 .right .txt2 {
            display: table;
            width: 100%;
            max-width: 455px;
            font-family: "Oswald", sans-serif;
            font-weight: 300;
            font-style: normal;
            font-size: 22px;
            letter-spacing: 0px;
            line-height: 32px;
            text-align: center;
            color: #2c7179;
            margin: auto;
            margin-top: 15px;
            padding-bottom: 35px;
        }
}

@media screen and (max-width:415px) {

    .grupos .grupo .cols {
        /*margin-top: 6%;*/
    }
}

@media screen and (max-width:375px) {

    .grupos .grupo .cols {
        /*margin-top: 4%;*/
    }
}

@media screen and (max-width:355px) {

    .grupos .grupo .cols {
        /*margin-top: 3%;*/
    }
}

@media screen and (max-width:340px) {

    .grupos .grupo .cols {
        /*margin-top: 2%;*/
    }
}

@media screen and (max-width:330px) {

    .grupos .grupo .cols {
        /*margin-top: 1%;*/
    }
}

@media screen and (max-width:1024px) {

    .painel4 .fasesImg img {
        display: table;
        width: 1074px;
        max-width: 1074px;
    }

    .painel4 .fasesImg {
        margin: auto;
        width: 95%;
        overflow:hidden;
        overflow-x:scroll;
        max-width: 1074px;
    }

    .intro {
        width: 85%;
    }

        .intro .txt1 {
            font-size: 70px;
            line-height: 52px;
            padding-bottom: 20px;
        }
    
    .tableLinesHover {
        display: none;
    }

    .tabela .colresp {
        border-right: none !important;
    }

    .tabela .col1 {
        border-left: none !important;
    }

    .tabela .scroll {
        overflow-x: scroll;
    }

    .painel5 .left {
        width: 100%;
        position: initial;
        top: initial;
        padding-right: 0px;
    }

    .painel5 .right {
        width: 100%;
        border-left: none;
        padding-left: 0px;
        padding-bottom: 0px;
    }

    .painel3 .right {
        width:90%;
        padding-top: 60px;
        max-width: 90%;
        float:none;
        margin:auto;
        padding-bottom:0px;
    }
    .painel4 .fasesImg {
        margin-top:10px;
    }

    .painel5 .vencedor .txt5 {
        width: 14%;
        text-align: center;
    }

    .painel5 .vencedor .txt4 {
        width: 32%;
    }

    .painel5 .vencedor .txt6 {
        width: 34%;
    }

        .painel3 .right .borderresp {
            /*border-bottom: 1px solid #095c66*/
            padding-bottom:30px;
        }

    .painel4 .ct {
       padding-top:40px;
    }

    /*.grupos .grupo .col .col1 {
        font-size: 22px;
        line-height: 30px;
        padding-left: 10px;
    }*/
    .grupos .grupo .cols {
        width: 60%;
    }

    .painel3 .left {
        width: 100%;
        float: none;
        margin: auto;
        border-top: 1px solid #283341;
        margin-top:10px;
    }

    .painel3 .ct {
        width: 100%;
    }

    .painel4 .txt1 {
        width: 90%;
    }

    .painel4 .txt2{
        width: 90%;
    }

    .painel5 .ct {
        width: 90%;
    }

    .painel5 .left .txt1 {
        /*text-align: left;*/
    }

    .painel5 .line {
        float: none;
        max-width:450px;
        margin:auto;
    }

    .painel5 .line .taca img {
        display: table;
        width: 40px;
        float: left;
    }


   

    .grupos .grupo .img {
        max-width:215px;
    }

    .painel3 .left {
        display: block;
        overflow-y:hidden;
        overflow-x:scroll;
    }

    .painel3 .left .scrollmap{
        display: table;
        width: 600px;
        position:relative;
        margin:auto;
    }
}




