.elementor-6464 .elementor-element.elementor-element-2e0c9ba{overflow:hidden;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-6464 .elementor-element.elementor-element-2e0c9ba:not(.elementor-motion-effects-element-type-background), .elementor-6464 .elementor-element.elementor-element-2e0c9ba > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-6464 .elementor-element.elementor-element-2e0c9ba > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6464 .elementor-element.elementor-element-72f20e5{width:100%;max-width:100%;}@media(max-width:767px){.elementor-6464 .elementor-element.elementor-element-72f20e5{width:var( --container-widget-width, 617px );max-width:617px;--container-widget-width:617px;--container-widget-flex-grow:0;}}@media(min-width:768px){.elementor-6464 .elementor-element.elementor-element-764e5b8{width:100%;}}/* Start custom CSS for html, class: .elementor-element-72f20e5 */:root{
    --cor_bg:rgba(255, 217, 0, 0.137);
    --cor_input: #eee;
    --cor_listrado:#eee;
    --cor_btn_avancar:#FF4558;
    --cor_botoes_etapa:rgba(255, 208, 0, 0.5);
    --cor_btn_voltar:white;
}

*{
    padding:0;
    margin:0;
    border:none;
    box-sizing: border-box;
    font-family: 'IBM Plex Sans';
}

main#teste{
    overflow-x: hidden !important;
    max-width: 100vw;
    height: 100dvh;
}

.etapa-oculta{
    position: absolute !important;
}

.etapa-anterior{
    z-index: 9;
}

.etapa-atual{
    z-index: 10;
    transform: translateX(0px);
}

.etapa-posterior{
    transform: translateX(120%) !important;
}

.etapa{
    color: black;
    position: relative;
    top: 0;
    width: 100%;
    min-height: 100dvh;
    height: 100%;
    background-color: white;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow-x: hidden;
    opacity: 100%;
    transition: transform 0.5s;
}

.etapa h2{
    padding: 10px;
    margin-bottom: 5px;
    font-size: 2em;
}

.etapa p{
    padding-left: 10px;
    font-size:1.2em;
}

.etapa button{
    padding: 10px;
    border-radius: 20px;
    background-color: #FF4558;
    color: black;
    font-weight: bold;
    font-size: 1.1em;
    cursor: pointer;
    transition: all 0.2s;
    font-family:'Trebuchet MS', sans-serif;
}

#etapaInfo{
    background-color: #4AE1EB;
    justify-content: flex-start;
    align-items: center;
}

#tituloEtapaInfo{
    align-self: flex-start;
    padding: 20px;
    margin-bottom: 30px;
}

#camposEtapaInfo{
    font-family: 'IBM Plex Mono';
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 50%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 0 1px #FF4558;
    transition: all 1s;
    border: 2px solid black;
    margin-bottom: 20px;
}

.caixaFlutuante{
    transform: translate(10px,-10px);
    box-shadow: -10px 10px 1px #FF4558 !important;
}

.campoFormInfo{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap:5px;
    padding: 10px;
    width: 100%;
}

.campoFormInfo input, .campoFormInfo select{
    padding: 10px 5px;
    border: 2px solid #888;
    border-radius: 10px;
    width: 100%;
    font-size: 1.1em;
}

.campoFormInfo label{
    font-size: 1.1em;
}

#btn_comecar{
    align-self: flex-end;
    color: white;
}

.campoFormRadio{
    width:100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding: 5px 10px 5px 10px;
    flex-basis: 100px;
}

.campoFormRadio:nth-child(odd){
    background-color: #79797913;
}

.campoFormRadio label{
    font-size: 1.1em;
}

.opcoes{
    gap: 10px;
    display: flex;
    flex-direction: column;
    flex: 4 4;
}

.textosAlternativas{
    display: flex;
    align-items: flex-end;
    font-size: 0.85em;
    
}

.inputsRadio{
    display: flex;
    justify-content: space-evenly;
    padding-bottom: 10px;
}

.inputRadio{
    flex: 1 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.radioEstilizado{
    height: 20px;
    width: 20px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;
}

.radioEstilizado::before{
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 3px solid #aaa;
    background-color: white;
    transition: transform 0.2s;
}

.radioEstilizado:hover::before{
    transform: scale(1.2);
}

.radioEstilizado:active::before{
    background-color: #d32335 !important;
}

.radioEstilizado:checked::before{
    background-color: #FF4558;
    transform: scale(1.2);
}

.c0{
    flex: 1 1;
}

.c1,.c2,.c3,.c4,.c5,.c6{
    flex: 1 1;
    text-align: center;
}

.botoesFormRadio{
    align-self: stretch;
    display: flex;
    justify-content: space-between;
}

.botoesFormRadio button{
    border-radius: 0px !important;
    padding: 8px;
    border: none;
    color: white
}

.btn_avancar:hover{
    transform: scale(1);
    padding-left:20px !important;
}

.btn_voltar:hover{
    transform: scale(1);
    padding-right: 20px !important;
}

#btn_comecar{
    border: none !important;
}

#btn_comecar:hover{
    transform: scale(1.1);
}


#resultado{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    color: black;
    height: 100%;
    font-family: 'Red Hat Text';
    align-items: stretch;
    
}

#mensagem{
    flex: 300px 1 1;
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    background-color: #4AE1EB;
    z-index: 1;
    padding: 20px;
    gap: 60px;
    padding: 20px;
}

#mensagem h2{
    background-color: white;
    padding: 10px 15px;
    border-radius: 10px;
    flex: 7 7 100px;
    text-align: center;
    font-size: 2em;
    font-weight: normal;
    color: black;
    box-shadow: 0 0 1px #FF4558;
    transition: all 1s;
    border: 2px solid black;
}

#mensagem img{
    width:50%;
    flex: 2 2 100px;
}

#secaoGrafico{
    padding: 10px;
    flex: 300px 1 1;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap:100px;
    z-index: 2;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
}

#divGrafico{
    flex: 1 1 300px;
    height: 100%;
    width:50%;
}

#chamadaPaginaEpica{
    flex: 1 1 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

#tituloChamadaPaginaEpica{
    text-align: center;
    font-size: 2em;
    font-weight: normal;
    color: black;
    margin-bottom: 20px;
}

#paragrafoChamadaPaginaEpica{
    text-align: center;
    font-size: 1.2em;
    font-weight: normal;
    width: 70%;
    color: black;
    margin-bottom: 20px;;
}

#btn_paginaEpica{
    padding: 15px;
    border-radius: 30px;
    background-color: #FF4558;
    color: black;
    font-weight: bold;
    font-size: 1.1em;
    cursor: pointer;
    transition: all 0.2s;
    font-family:'Trebuchet MS', sans-serif;
    text-decoration: none;
}

#btn_paginaEpica:hover{
    transform: scale(1.1);
}

@media screen and (max-width:768px){
    #tituloEtapaInfo{
        margin-bottom: 30px;
    }

    #camposEtapaInfo{
        width:80%
    }

    .cabecalhoFormRadio{
        gap:5px;
        padding-bottom: 10px;
    }
    
    .campoFormRadio{
        flex-direction: column;
        align-items: flex-start;
        padding-top:10px;
        padding-bottom:15px;
        gap: 20px;
    }

    .cabecalhoFormRadio .c0{
        display: none;
    }

    .etapa{
        gap: 0;
        
    }

    .campoFormRadio{
        align-items: center;
    }

    .opcoes{
        flex-direction: row;
    }

    .textosAlternativas{
        flex: 5 5;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        font-size: 0.85em;
        gap: 5px;
    }

    .textosAlternativas p{
        flex: 1 1 60px;
        display: flex;
        align-items: center;
    }

    .inputsRadio{
        flex: 1 1;
        flex-direction: column;
        justify-content: space-between;
        padding: 0;
    }

    .campoFormRadio input{
        flex-grow: unset;
        flex-shrink: unset;
    }

    .c1,.c2,.c3,.c4{
        text-align: left;
    }

    .botoesFormRadio{
        padding:0;
        justify-content: center;
    }

    .botoesFormRadio button{
        flex: 1 1;
        border-radius: 0px;
    }

    .btn_avancar, #btn_enviar{
        border-left: 2px solid black !important;
        border-top: 2px solid black !important;
    }

    .btn_voltar{
        border-top: 2px solid black !important;
    }

    #mensagem{
        flex-direction: column;
        justify-content: center;
    }

    #mensagem img{
        flex-grow: unset;
        flex-shrink: unset;
        width: 90%;
    }

    #mensagem h2{
        flex-grow: unset;
        flex-shrink: unset;
        width: 90%;
        font-size: 1.5em;
    }

    #mensagem h2 span{
        font-size: 0.9em;
        font-style: italic;
    }

    #secaoGrafico{
        flex-direction: column-reverse;
        justify-content: flex-end;
        gap: 30px;
    }

    #divGrafico{
        flex: 1 1 100px;
        width: 100%
    }
}/* End custom CSS */
/* Start custom CSS for column, class: .elementor-element-764e5b8 */#coluna-teste{
    padding: 0;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-2e0c9ba */.page-header {
    display: none;
}

.site-footer{
	display:none;
}

#secao-teste{
    padding:0;
}/* End custom CSS */