/* ----- MOBILE FIX ---------------------------------------------------------- */
/* Criado por: Rodrigo Quiñones, 06/08/2014 */

@media (max-width: 430px) {

    .modal {
        width: 350px !important;
    }
}

/* Como os container não tem width definido, força-se 100% já que os textos não são tagueados */
#conteudo, #conteudo > table, #contato /*, #rodape*/ {
    /*width: 960px !important;*/
}

/* ----- HACKS IE7/8 --------------------------------------------------------- */
/* Criado por: Rodrigo Quiñones, 08/08/2014 */

/* IE.CSS foi desligada, overload errado das tags.. */
.tituloPagina, #acoes {
    margin: /*\**/ 0\9;
}

/* ----- LOGADO COMO --------------------------------------------------------- */

.loginDisplay {
    margin: 10px 0 30px;
    font-size: 12px;
}

/* ----- CABEÇALHO DA PÁGINA ------------------------------------------------- */

.tituloPagina {
    margin-bottom: 40px;
}

#acoes /* botoes no topo da pagina */ {
    height: 40px;
    margin: 0 0 -40px 0;
    text-align: right;
}

    #acoes input[type="submit"] {
        padding: 6px 10px;
    }

/* ----- CONTEÚDO ------------------------------------------------------------ */

.box /* caixas de conteudo */ {
    background: #FFF;
    border: 1px solid #DDD;
    margin: 0 0 30px 0;
    padding-bottom: 20px;
}

.box-sem-titulo {
    padding-top: 20px;
}

.tituloBox /* H3 */ {
    background: #EEE;
    color: #333;
    border-bottom: 1px solid #DDD;
    margin-bottom: 10px;
    padding: 10px;
    font-size: 16px;
}

/* ----- PARAGRAFO NORMAL ---------------------------------------------------- */

.box p, .box div.paragrafo /* um div que vai se comportar como paragrafo pra alinhar checks e radios */ {
    margin: 10px 20px 0;
}

input[type="text"] {
    width: 100%;
}

select {
    width: 918px;
    border-radius: 5px;
}

/* ----- PARAGRAFO COM METADE DA LARGURA ------------------------------------- */

.paragrafoMetade {
    width: 450px;
    margin-right: 0 !important;
    float: left;
}

    .paragrafoMetade input[type="text"] {
        width: 100%;
    }

    .paragrafoMetade select {
        width: 450px;
    }

/* ----- PARAGRAFO COM UM TERÇO DA LARGURA ----------------------------------- */

.paragrafoTerco {
    width: 293px;
    margin-right: 0 !important;
    float: left;
}

.paragrafoDoisTercos {
    background: red;
}

.paragrafoTerco input[type="text"] {
    width: 281px;
}

.paragrafoTerco select {
    width: 293px;
}

/* ----- PARAGRAFO COM UM QUARTO DA LARGURA ---------------------------------- */

.paragrafoQuarto {
    width: 215px;
    margin-right: 0 !important;
    float: left;
}

    .paragrafoQuarto input[type="text"] {
        width: 203px;
    }

    .paragrafoQuarto select {
        width: 100%;
    }

.paragrafoTresQuartos {
    width: 685px;
    margin-right: 0 !important;
    float: left;
}

    .paragrafoTresQuartos input[type="text"] {
        width: 673px;
    }

    .paragrafoTresQuartos select {
        width: 685px;
    }

/* ----- PARAGRAFO COM UM QUINTO DA LARGURA ---------------------------------- */

.paragrafoQuinto {
    width: 167px;
    margin-right: 0 !important;
    float: left;
}

    .paragrafoQuinto input[type="text"] {
        width: 155px;
    }

    .paragrafoQuinto select {
        width: 167px;
    }

.paragrafoDoisQuintos {
    width: 356px;
    margin-right: 0 !important;
    float: left;
}

    .paragrafoDoisQuintos input[type="text"] {
    }

    .paragrafoDoisQuintos select {
        width: 356px;
    }

.paragrafoTresQuintos {
    background: red;
}

.paragrafoQuatroQuintos {
    background: red;
}

/* ----- OUTROS CAMPOS DE FORMULÁRIOS ---------------------------------------- */

.cijunInputDDD /* DDD do telefone */ {
    width: 20px !important;
}

.cijunSelectUF /* sigla do estado (select) */ {
    width: 60px !important;
}

.cijunInputNumero, /* numero da casa */ .cijunInputUF, /* sigla do estado (digitável) */ .cijunInputAno /* ano no formato AAAA */ {
    width: 50px !important;
}

.cijunInputCEP, /* CEP */ .cijunInputData, /* datas no formato DD/MM/AAAA */ .cijunInputTelefone, /* telefone */ .cijunInputCaptcha /* captcha */ {
    width: 100px !important;
    border-radius: 5px;
}

.cijunInputRG /* RG */ {
    width: 180px !important;
    text-transform: uppercase;
    border-radius: 5px;
}

.cijunInputCPF, /* CPF */ .cijunInputSenha, /* senha */ .cijunInputCidade, /* cidade */ .cijunInputValor /* valor numérico financeiro */ {
    width: 180px !important;
    border-radius: 5px;
}

.cijunInputLogradouro {
    width: 673px !important;
}

.cijunSelectEscola, /* select Escola */ .cijunSelectSerie /* select Série */ {
    width: 325px !important;
    border-radius: 5px;
}

/*--------Radio e Check---------------------*/
input[type="checkbox"], input[type="radio"] {
    margin: 5px 5px 0px 5px;
}

.cijunCheck, /* componente de checkbox */ .cijunRadio /* componente de radio button */ {
    width: 100% !important;
    table-layout: fixed !important;
}

.cijunCheckMetade, /* componente de checkbox */ .cijunRadioMetade /* componente de radio button */ {
    width: 50% !important;
    table-layout: fixed !important;
    margin: 0 0 0 13px;
}
/*---------------------------------------------*/

.cijunInputTextoDinamico {
    width: 350px !important;
}

.cijunImagemEditar /* botão Editar com imagem */ {
    margin-left: 10px;
    vertical-align: text-bottom;
    display: inline;
}

.btSecundario /* botões que não são de ações */ {
    -top: -10px !important;
    padding: 6px !important;
    font-size: 12px;
}

.btPesquisarEndereco /* botão Pesquisar Endereço do logradouro */ {
    width: 138px !important;
    margin-left: 16px;
}

.btLimparEndereco, /* botão Limpar do logradouro */ .btVoltarSenha /* botão Voltar da tela de alteração de senha */ {
    width: 65px !important;
    margin-left: 5px;
}

.btAdicionarFamiliar /*Alterado o tamanho desse botão pois foi aumentado o texto do mesmo*/ {
    width: 280px;
}

.btCancelarFamiliar, .btConfirmarLogin, /* botão Confirmar da tela de alteração de login */ .btConfirmarSenha /* botão Confirmar da tela de alteração de senha */ {
    width: 100px;
}

.linkEsqueciaSenha {
    color: #666 !important;
    font-size: 80% !important;
    text-align: right;
}

.campoObrigatorio {
    color: Red;
    font-style: italic;
    font-size: 11px;
}

.panelDependentes {
    overflow-x: auto;
    width: 100%;
    /*max-height: 500px;*/
    max-height: 85vh;
}

/* ----- GRIDS --------------------------------------------------------------- */

.gridTable {
    margin: 10px 20px;
    border-collapse: collapse;
    font-size: 13px;
}

    .gridTable td, .gridTable th {
        padding: 8px 10px;
        border: 1px solid #EEE;
        word-wrap: break-word;
        vertical-align: middle;
        line-height: 1.3;
    }

    .gridTable th {
        background: #F5F5F5;
        color: #555;
        padding: 5px 10px;
        line-height: 1.5;
        font-size: 14px;
        background: -moz-linear-gradient(top, #eeeeee 0%, #F5F5F5 99%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(99%,#F5F5F5));
        background: -webkit-linear-gradient(top, #eeeeee 0%,#F5F5F5 99%);
        background: -o-linear-gradient(top, #eeeeee 0%,#F5F5F5 99%);
        background: -ms-linear-gradient(top, #eeeeee 0%,#F5F5F5 99%);
        background: linear-gradient(to bottom, #eeeeee 0%,#F5F5F5 99%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#F5F5F5',GradientType=0 );
    }

    .gridTable tr:hover {
        background: #F5F5F5;
    }

    .gridTable img {
        margin: 0 5px !important;
        float: left;
    }

/* ----- JANELAS MODAL ------------------------------------------------------- */

.modalBackground, .ModalPopupBackground, .modalBackgroundMaster, .backgroundModal {
    filter: alpha(opacity=70);
    background-color: #FFF;
    opacity: 0.7;
}

.modal {
    background-color: #FFF;
    width: 950px;
    padding: 20px;
    border: solid 2px #aaa;
    position: relative;
}

.importantRed {
    color: #F00; /* vermelho */
}

/*
:disabled
{
    background: #dddddd;
}
*/
input[disabled] {
    background: #eee;
}
/*-------------------- Tela de FAQ ---------------------*/
.faq {
    padding: 0;
}

    .faq .titulo {
        width: 98%;
        background-color: #F3F3F3;
        font-size: 18px;
        padding: 10px 10px 0 10px;
        border: 1px solid #DDD;
        cursor: pointer;
    }

        .faq .titulo:hover {
            background-color: #FFF;
        }

        .faq .titulo span {
            display: block;
            padding-bottom: 10px;
        }

    .faq .pergunta {
        display: none;
        background-color: #FFF;
        width: 98%;
        margin: 0 0 0 0;
        padding: 10px 10px;
        border-left: 1px solid #DDD;
        border-right: 1px solid #DDD;
        cursor: pointer;
    }

        .faq .pergunta:last-child {
            border-bottom: 1px solid #DDD;
        }

        .faq .pergunta h3 {
            font-size: 16px;
            padding: 10px 0;
            margin: 0;
        }

        .faq .pergunta .resposta {
            display: none;
        }

            .faq .pergunta .resposta p {
                font-size: 14px;
                padding: 0 0 10px 0;
                margin: 0 0 0 0;
                text-align: justify;
                width: 98%;
            }
/*--------------------------------------------*/

.alignCenter {
    text-align: center;
}

.clear {
    clear: both;
    height: 0;
}

select[disabled] {
    background: #eee;
}

div.visualizadorEmail {
    word-wrap: break-word;
    overflow-x: auto;
    width: 100%;
    max-height: 500px;
    max-height: 70vh;
}

.custom-file-input::-webkit-file-upload-button {
    visibility: hidden;
    height: 40px;
    /*aumenta a distancia do texto para o botão*/
    width: 150px;
}

.custom-file-input::before {
    content: 'Selecione o arquivo';
    display: inline-block;
    background: -webkit-linear-gradient(top, #f9f9f9, #e3e3e3);
    border: 1px solid #999;
    border-radius: 3px;
    padding: 5px 8px;
    outline: none;
    white-space: nowrap;
    -webkit-user-select: none;
    cursor: pointer;
    text-shadow: 1px 1px #fff;
    font-weight: 700;
    font-size: 10pt;
}

.custom-file-input:hover::before {
    border-color: black;
}

.custom-file-input:active::before {
    background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}


.icone-info {
    color: dodgerblue;
    border: 1px solid dodgerblue;
    border-radius: 50% !important;
    display: inline-block !important;
    height: 0.9rem;
    padding: 0px 5px;
}

.tooltip {
    position: relative;
    display: inline-block;
}

    /* Tooltip text */
    .tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: black;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        position: absolute;
        z-index: 1;
    }

    /* Show the tooltip text when you mouse over the tooltip container */
    .tooltip:hover .tooltiptext {
        visibility: visible;
    }


/* REPONSIVIDADE*/

.text-input {
    border-radius: 5px;
    width: 95%;
}

input[type="text"] {
    border-radius:5px;
}


.radio-tabela {
    border-collapse: collapse;
    width: auto;
}


/* Ajuste para telas muito pequenas (Mobile) */
@media (max-width: 480px) {

    .radio-tabela,
    .radio-tabela tbody,
    .radio-tabela tr,
    .radio-tabela td {
        display: block !important;
        width: 100%;
    }

        .radio-tabela td {
            padding: 8px 0; /* Espaçamento vertical para facilitar o toque */
        }

    input[type="radio"] {
        margin: 0px 5px 3px 20px;
    }

    .label-responsive {
        margin: 0px 0px 0 20px;
    }
    .div-responsive {
        margin-top: 5px;
    }

    .paragrafoMetade input[type="text"] {
        width: 50% !important;
    }

    h2 {
        margin: 40px 0 20px !important;
        font-size: 24px;
        font-weight: 600;
    }
}

.div-responsive {
    margin-top: 10px;
}