:root {
  --cor-fundo-cabecalho:  #6B7A8F;
  --cor-fundo-navegacao:  #F0A84F;
  --cor-fundo-principal:  #DCC7AA;
  --cor-fundo-secundario: #F7E2BF;
  --cor-fundo-rodape:     #F7C381;
  --cor-texto:            #040404;
  --cor-texto-cabecalho:  #F7F7DF;
  --cor-borda:            white;
  --espessura_borda:        1px;
}

html {
height: 100%;
width: 100%;
scrollbar-width: 10px;
scrollbar-color: var(--cor-fundo-cabecalho);
}

body, h1, h2, h3, h4, h5, h6, p, ol, ul, form, blockquote {
padding: 0;
margin: 0;
}

h1, h2, h3 {
padding-top: 10px;
padding-bottom: 5px;
}

p {
padding-bottom: 5px;
}

ol, ul {
padding-left: 20px;
}

body {
font-family: Calibri, Arial, Helvetica, sans-serif;
color: var(--cor-texto);
height: 100%;
width: 100%;
}

.link_escondido {
text-decoration: none;
}

.somente_tela_pequena {
display: none;
}

/* divisões horizontais */

#cabecalho {
float: top;
height: 10%;
width: 100%;
border-bottom: solid var(--cor-borda) var(--espessura_borda);
overflow: hidden;
background-color: var(--cor-fundo-cabecalho);
color: var(--cor-texto-cabecalho);
a:link, a:visited {  color:var(--cor-texto-cabecalho);}
}

#corpo {
float: top;
height:80%;
width: 100%;
border-bottom: solid var(--cor-borda) var(--espessura_borda);
overflow: hidden;
background-color: var(--cor-fundo-secundario);
}

#rodape {
float: top;
height: 10%;
width: 100%;
overflow: hidden;
background-color: var(--cor-fundo-rodape);
}

/* divisões verticais */

.coluna_esquerda {
float: left;
height: 100%;
width: 20%;
border-right: solid var(--cor-borda) var(--espessura_borda);
overflow: auto;
background-color: var(--cor-fundo-navegacao);
}

.coluna_central {
float: left;
height:100%;
width:40%;
border-right: solid var(--cor-borda) var(--espessura_borda);
overflow: auto;
background-color: var(--cor-fundo-principal);
}

.coluna_direita {
float: left;
height: 100%;
width:38%;
overflow: auto;
background-color: var(--cor-fundo-secundario);
}

/* áreas de conteúdo */

#conteudo_cabecalho {
padding-top: 1%;
padding-left: 2%;
}

#navegacao {
padding-top: 4%;
padding-left: 4%;
}

#texto_sobre {
height:92%;
width:92%;
float: top;
padding-left:4%;
padding-right:4%;
padding-top: 4%;
padding-bottom: 4%;
}

#formulario {
height:auto;
width:94%;
float: top;
padding-left:4%;
padding-right:2%;
padding-top: 4%;
}

#resultado {
height:92%;
width:94%;
float: top;
padding-left:4%;
padding-right:2%;
padding-top: 4%;
padding-bottom: 4%;
}

#conteudo_rodape {
padding-top: 2%;
padding-left: 2%;
text-align: center;
}

@media (max-width: 1080px) {  
h1 { font-size: 150%; }
h2, h3 { font-size: 120%; }
.coluna_esquerda { display: none; } 
.coluna_central { width:50%; }
#coluna_central_sobre { width:98%; }
.coluna_direita { width:48%; }
#coluna_direita_sobre { display:none; }
#conteudo_rodape { font-size: small; }
.somente_tela_pequena { display: block; }

    @media (orientation: landscape) {  
    .botao { margin-left: 40%;}
    #conteudo_cabecalho { margin-top: -3%; }
    }

    @media (orientation: portrait) {  
    .entrada { width: 90%; }
    .botao { margin-left: 25%; }
    }
}