html {
    --text-color: #375623;
    background-color: #e2efda;
    color: var(--text-color);
    font-family: 'Calibri', 'Gill Sans', 'Gill Sans MT', 'Trebuchet MS', sans-serif;
}

body {
    overflow-x: auto;
}

header {
    display: flex;
    margin: auto;
    width: 80%;
}

#focoLogoOSB, #focoLogoPrograma, #focoTitle {
    display: block;
    align-self: center;
}

#focoLogoOSB, #focoLogoPrograma {
    width: 25%;
    flex-grow: 0;
    flex-shrink: 0;
    margin: 2ex;
}

#focoTitle {
    flex-grow: 1;
}

h1, h2 {
    text-align: center;
}

h2 {
    font-weight: normal;
}

#inspiracao {
    font-size: 14pt;
}

nav {
    display: flex;
    margin: auto;
    width: 90%;
    border: solid var(--text-color);
    border-width: 1px  0   0  1px;
    user-select: none;
}

nav > a {
    flex: 1 1 0px;
    text-align: center;
    font-size: 14pt;
    font-weight: bold;
    background-color: rgba(255,255,255,.3);
    border: solid 1px var(--text-color);
    border-width:  0  1px 1px  0;
}

nav > a:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,.7);
}

nav > a:active {
    background-color: rgba(155,155,155,.7);
}

nav > a.active {
    cursor: initial;
    background-color: rgba(255,255,255,.9);
}

main {
    background-color: rgba(255,255,255,.9);
    width: 90%;
    margin: auto;
    display: block;
    border: solid var(--text-color) 1px;
    border-top: none;
    box-sizing: border-box;
}

main > article {
    display: none;
}

main[data-active=busca] {
    min-width: 1400px;
}

main[data-active=relatorio] > #relatorio {
    display: block;
}

main[data-active=busca] > #busca {
    display: block;
}

main[data-active=insercao] > #insercao {
    display: block;
}

main[data-active=visualizacao] > #visualizacao {
    display: block;
}

footer {
    margin-top: 2ex;
}

footer > p {
    font-size: 10pt;
    margin: 0px;
    text-align: center;
    color: #000;
}

#usuarioInfo {
    position: fixed;
    top: 1ex;
    right: 1ex;
    background-color: #fff;
    padding: 0.5ex;
    border: solid 1px var(--text-color);
    text-align: center;
    z-index: 10;
}

#usuarioInfo .adminOnly {
    display: none;
}

#usuarioInfo.admin > b.adminOnly {
    display: inline;
}

#usuarioInfo.admin a.adminOnly {
    display: block;
}

#usuarioInfo:hover {
    padding: 1.25ex;
}

#usuarioInfo:hover #usuarioLogin {
    font-weight: bold;
}

#usuarioInfo:hover > #usuarioBotoes {
    display: block;
}

#usuarioBotoes {
    display: none;
    text-align: center;
    margin-top: 2ex;
}

#usuarioBotoes > a {
    padding: 1.25ex;
    display: block;
}

#usuarioBotoes > a:hover {
    background-color: rgba(0,0,0,.2)
}

#loginError {
    display: block;
    text-align: center;
    color: red;
    font-weight: bold;
    margin: 1ex;
}

#loginForm {
    display: block;
    margin: auto;
    text-align: center;
}

#loginForm > label {
    display: block;
    margin: auto;
    width: 300px;
    padding: 0.75ex;
    text-align: right;
}


#painelAdmin {
    display: block;
    width: 900px;
    margin: auto;
    background-color: #fff;
    border: solid 1px var(--text-color);
}

#painelAdmin > a.adminButton {
    display: block;
    text-align: center;
    padding: 1ex;
}

#painelAdmin > a.adminButton:hover {
    background-color: rgba(0,0,0,.1);
}







.tg  {border-collapse:collapse;border-spacing:0;}
.tg td{border-color:black;border-style:solid;border-width:1px;font-size:12px;
  overflow:hidden;padding:10px 5px;word-break:normal;}
.tg th{border-color:black;border-style:solid;border-width:1px;font-size:10px;
  overflow:hidden;padding:10px 5px;word-break:normal;}
.tg .tg-ul38{position:-webkit-sticky;position:sticky;text-align:left;top:-1px;vertical-align:top;will-change:transform}
.tg .tg-0lax{text-align:left;vertical-align:top}
.tg-sort-header::-moz-selection{background:0 0}
.tg-sort-header::selection{background:0 0}.tg-sort-header{cursor:pointer}
.tg-sort-header:after{content:'';float:right;margin-top:7px;border-width:0 5px 5px;border-style:solid;
  border-color:#404040 transparent;visibility:hidden}
.tg-sort-header:hover:after{visibility:visible}
.tg-sort-asc:after,.tg-sort-asc:hover:after,.tg-sort-desc:after{visibility:visible;opacity:.4}
.tg-sort-desc:after{border-bottom:none;border-width:5px 5px 0}


thead {
    background-color: rgba(0,0,0,.1);
    font-weight: bold;
}



#painelAdmin form {
    display: block;
    text-align: center;
}

#painelAdmin label {
    display: block;
    padding: 1ex;
}

#painelAdmin label > span {
    min-width: 180px;
    display: inline-block;
}

#painelAdmin input[type='text'] {
    width: 300px;
}