/* ///////////////////////////// */
/* BODY */ 
body{margin: 0; padding: 0; height: 100vh;}

/* ///////////////////////////// */
/* HEAD */
.cabeca{background-color: #0e2f5a; color: #939598;  width: 100%; min-height: 10%; position: relative; top: 0; justify-content: center; align-items: center; display: flex;}
.cabeca h1{padding: 10px 50px 10px 10px;}
.cabeca img{padding: 10px 10px 10px 50px;}
@media (max-width: 500px){
    .cabeca{ text-align: center; flex-direction: column;}
    .cabeca img{padding: 30px 0px 0px 0px;}
}

/* ///////////////////////////// */
/* CORPO */
.corpo{background-color: rgb(255, 255, 255); width: 100%; height: auto; min-height: 80%;}

/* ///////////////////////////// */
/* DADOS PIX */
.pix_logo{ width: 15em; height: 5em; object-fit: cover;  }
.div_pix{display: flex; justify-content: center; padding: 30px 10px 0px 10px;}
.form_pix{width: 400px; padding: 10px; border: 0px solid black; border-radius: 10px; box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.5);}
.sub_titulo_form{font-size: 18px; color: black;}
.form_select{width: 100%; margin-bottom: 18px; border: 2px solid; border-radius: 4px; height: 21px;}
.form_select:focus-within {outline: 1px solid rgb(223, 150, 4); border: 2px solid rgb(223, 150, 4);}
.form_select select{border: 0px solid; outline: none;}
.form_select input{border: 0px solid; outline: none;}
.itens_option{padding: 0; margin: 0; border: 0;}
.form_imput_global{ width: 100%; box-sizing: border-box; border-radius: 4px;}
.form_imput_global{height: 25px; border-radius: 4px; outline: none;}
.form_imput_global:focus-within {outline: 1px solid rgb(223, 150, 4); border: 2px solid rgb(223, 150, 4);}
.input_chave{width: 75%; padding-left: 0; border: 0px solid black;}
.botao_gerar_div{padding: 6px 0; display: flex; align-items: center; justify-content: center;}
.botao_gerar_remover{background-color: transparent; border: none; padding: 0; margin: 0; font: inherit; cursor: pointer; outline: none;}
.botao_gerar{font-weight: bold; font-size: 21px; background-color: #0e2f5a; color: white; width: 300px; height: 35px; border-radius: 15px; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4) ;}
.botao_gerar:hover{background-color: #32bcad; color: #0e2f5a; }
@media (max-width: 500px){
    .sub_titulo_form{font-size: 22px; color: black;}
    .input_chave{width: 230px; padding-left: 0; border: 0px solid black;}
}

/* ///////////////////////////// */
/* QR CODE */
    /* IMPRIMIR*/
    .imprimir{display: none;}
    /*.ocultar{display: none;}*/
    @media print{
        @page { margin: 0;}
        body{width: 100%; height: 100%;}
        .imprimir{display: block; align-items: center;}
        .div_pix ,.cabeca, .rodape, .botao_gerar_div{display: none;}
    }
    /*/////////*/

.qrcode_div_table{display: flex; justify-content: center;}
.qrcode_table{border: 1px solid rgb(176, 176, 176); border-style: dashed; border-width: 3.5px; border-radius: 5px; margin: 50px; padding: 10px;}
.qrcode_table td{max-width: 280px;  word-wrap: break-word;}
.td_pague_com_pix{text-align: center;}
@media (max-width: 500px){
    .qrcode_div_table{display: flex; justify-content: center;}
    .qrcode_table{border: 1px solid rgb(176, 176, 176); border-style: dashed; border-width: 3.5px; border-radius: 5px; margin: 50px; padding: 10px;}
    .qrcode_table td{max-width: 280px;  word-wrap: break-word;}
    .td_pague_com_pix{text-align: center;}
}


/* ///////////////////////////// */
/* RODAPE */
.rodape{background-color: #0e2f5a; min-height: 10%;}
.rodape_div{color: white; width: 100%;  position: relative; bottom: 0; justify-content: center; display: flex;}
.rodape_conteudo{ width: 100%; margin: 0px 50px; flex-direction: row; display: flex; padding: 30px;}
.rodape_conteudo a{text-decoration: none; color: inherit;}

.rodape_empresa{padding: 30px 0px 0px 0px;}
.rodape_empresa div{padding: 10px 0px;}

.rodape_linkuteis{padding-left: 30px;}
.rodape_linkuteis ul{padding: 0;}
.rodape_linkuteis li{list-style-type: none; padding: 5px 0px; font-size: 18px; }
.rodape_empresa a{font-size: 20px;}

@media (max-width: 500px){
    .rodape_conteudo{flex-direction: column;}

    .rodape_empresa{padding-bottom: 30px;}
    .rodape_empresa div{font-size: 18px; padding: 10px 00px;}
    .rodape_empresa a{font-size: 20px;}
    
    .rodape_titulo_linkuteis{font-size: 40px;}
    .rodape_link{font-size: 25px;}
}

/* ///////////////////////////// */
/**/
/* ///////////////////////////// */
/**/
/* ///////////////////////////// */