/* este css estiliza o arquivo index */
@charset "utf-8";

@font-face{/* fonte da pagina */
    font-family: 'fonteTrebuchet';/* nome da fonte */
    src: url(../font/trebuchet-ms.ttf);/* caminho da fonte */
}

body{/* configura o corpo da pagina */
    font-family: fonteTrebuchet;/* tipo de fonte */
    color: #333;/* fonte COR */
    padding: 0px;/* espacamento interno */
    margin: 0px;/* espacamento externo */
    overflow: hidden;/* oculta barra de rolagem */
}

@media (min-width: 848px){/* estilo para tela maior */

    input#bt_menu{/* configura a tag checkbox */
        display: none;/* oculta checkbox */
    }
    label[for="bt_menu"]{/* configura a label vinculada ao checkbox */
        display: none;/* oculta escrita menu */
    }
    nav#menu{/* configura os menus no lado esquerdo da pagina principal */
        margin: 10px 0px 0px 0px;/* espacamento acima da nav menu */
        position: relative;/* posicao relativa */
        width: 180px;/* largura */
        height: 100%;/* altura */
        float: left;/* flutuar lado esquerdo */
    }
    nav#menu ul{/* configura a lista ordenada do menu */
        padding: 0px;/* espacamento interno */
        margin: 0px;/* espacamento externo */
        list-style: none;/* ocultar caracteres da lista */
    }
    nav#menu div#div1 ul{/* configura a categoria de menus principais */
        text-transform: uppercase;/* caixa alta */
        background-color: #006cb5;/* fundo COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        margin: 0px 0px 4px 0px;/* espacamento abaixo dos menus */
        width: 170px;/* largura */
        height: 39px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    nav#menu div#div1 a{/* configura os links dos menus principais */
        text-decoration: none;/* sem sublinhado */
    }
    nav#menu div#div1 div{/* configura o texto nos menus principais */
        color: #fff;/* fonte COR */
        padding: 10px 0px 0px 12px;/* espacamento interno */
    }
    nav#menu div#div1 ul:hover{/* configura o efeito mouse nos menus principais */
        text-decoration: underline #fff;/* sublinhado branco */
        background-color: #0050a0;/* fundo COR */
    }
    nav#menu div#div2 ul{/* configura a categoria de menus secundarios */
        background-color: #fff;/* fundo COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        margin: 0px 0px 4px 0px;/* espacamento abaixo dos menus */
        width: 170px;/* largura */
        height: 39px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    nav#menu div#div2 a{/* configura os links dos menus secundarios */
        text-decoration: none;/* sem sublinhado */
    }
    nav#menu div#div2 div{/* configura o texto nos menus secundarios */
        color: #333;/* fonte COR */
        padding: 10px 0px 0px 12px;/* espacamento interno */
    }
    nav#menu div#div2 ul:hover{/* configura o efeito mouse nos menus secundarios */
        text-decoration: underline #333;/* sublinhado cinza */
        background-color: #eee;/* fundo COR */
    }
    nav#menu div#div3{/* configura botao baixar tabelas */
        text-align: center;/* alinhamento centro */
        padding: 10px 0px 0px 0px;/* espacamento interno */
        width: 170px;/* largura */
    }
    nav#menu a.opacidade{/* configura a tag a */
        border-top-left-radius: 25px;/* borda redonda cima esquerdo */
        border-top-right-radius: 25px;/* borda redonda cima direito */
        border-bottom-left-radius: 25px;/* borda redonda baixo esquerdo */
        border-bottom-right-radius: 25px;/* borda redonda baixo direito */
        display: inline-block;/* em linha */
        background: #222;/* fundo COR */
        padding: 0;/* espacamento interno */
        margin: 0;/* espacamento externo */
        height: 30px;/* altura */
    }
    nav#menu a.opacidade:hover img {/* configura efeito mouse na tag img */
        opacity: 0.7;/* opacidade */
    }
    nav#menu a.opacidade img {/* configura a tag img */
        display: block;/* fixa */
        -webkit-transition: all 0.5s linear;/* transicao chrome */
        -moz-transition: all 0.5s linear;/* transicao mozilla */
        -ms-transition: all 0.5s linear;/* transicao ms explorer */
        -o-transition: all 0.5s linear;/* transicao opera */
        transition: all 0.5s linear;/* transicao */
    }
    iframe#frame{/* configura o iframe no index */
        border: none;/* sem formatacao*/
        width: 668px;/* largura */
        max-width: 100%;/* largura maxima */
        height: 1890px;/* altura */
        overflow: hidden;/* oculta barra de rolagem */
    }

}/* fim estilo para tela maior */

@media (max-width: 847px){/* estilo para tela media */

    input{/* configura a tag input checkbox */
        display: none;/* oculta checkbox */
    }
    label[for="bt_menu"]{/* configura a label vinculada ao checkbox */
        display: block;/* mostra escrita menu */
    }
    img{/* configura a tag img */
        display: none;/* oculta a tag img */
    }
    .icon{/* configura a area do icone menu */
        color: #fff;/* fonte COR */
        text-align: center;/* alinhamento centro */
        background-color: #006cb5;/* fundo COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        padding: 5px;/* espacamento interno */
        width: 80px;/* largura */
        height: 32px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    .icon:before{/* configura o estado do icone menu */
        font-size: 20px;/* tamanho da fonte */
        z-index: 1;/* empilhado primeiro */
        content: '\002630';/* caracter 3 barras horizontais*/
    }
    input:checked ~ nav#menu{/* atua sobe a nav menu ao ativar o checkbox */
        position: absolute;/* posicao absoluta */
        width: 100%;/* largura */
        height: 100%;/* altura */
        visibility: visible;/* visivel */
        display: block;/* mostra nav */
    }
    nav#menu{/* configura os menus no lado esquerdo da pagina principal */
        margin: 5px 0px 0px 0px;/* espacamento acima da nav menu */
        display: none;/* oculta nav */
    }
    nav#menu ul{/* configura a lista ordenada do menu */
        padding: 0px;/* espacamento interno */
        margin: 0px;/* espacamento externo */
        list-style: none;/* oculta caracteres da lista */
    }
    nav#menu div#div1 ul{/* configura a categoria de menus principais */
        text-transform: uppercase;/* caixa alta */
        background-color: #006cb5;/* fundo COR */
        border-bottom: solid 1px #aaf;/* borda abaixo solida COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        margin: 0px;/* espacamento externo */
        width: 100%;/* largura */
        height: 39px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    nav#menu div#div1 a{/* configura os links dos menus principais */
        text-decoration: none;/* sem sublinhado */
    }
    nav#menu div#div1 div{/* configura o texto nos menus principais */
        color: #fff;/* fonte COR */
        padding: 10px 0px 0px 12px;/* espacamento interno */
    }
    nav#menu div#div1 ul:hover{/* configura o efeito mouse nos menus principais */
        text-decoration: underline #fff;/* sublinhado branco */
        background-color: #0050a0;/* fundo COR */
    }
    nav#menu div#div2 ul{/* configura a categoria de menus secundarios */
        background-color: #fff;/* fundo COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        margin: 0px;/* espacamento externo */
        width: 100%;/* largura */
        height: 39px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    nav#menu div#div2 a{/* configura os links dos menus secundarios */
        text-decoration: none;/* sem formatacao */
    }
    nav#menu div#div2 div{/* configura o texto nos menus secundarios */
        color: #333;/* fonte COR */
        padding: 10px 0px 0px 12px;/* espacamento interno */
    }
    nav#menu div#div2 ul:hover{/*  */
        text-decoration: underline #333;/* sublinhado cinza */
        background-color: #eee;/* fundo COR */
    }
    iframe#frame{/* configura o iframe no index */
        border: none;/* sem formatacao*/
        width: 668px;/* largura */
        max-width: 100%;/* largura maxima */
        height: 1890px;/* altura */
        overflow: hidden;/* oculta barra de rolagem */
    }

}/* fim estilo para tela media */

@media (max-width: 320px){/* estilo para tela menor */

    input{/* configura a tag input checkbox */
        display: none;/* oculta checkbox */
    }
    label[for="bt_menu"]{/* configura a label vinculada ao checkbox */
        display: block;/* mostra escrita menu */
    }
    img{/* configura a tag img */
        display: none;/* oculta a tag img */
    }
    .icon{/* configura a area do icone menu */
        color: #fff;/* fonte COR */
        text-align: center;/* alinhamento centro */
        background-color: #006cb5;/* fundo COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        padding: 5px;/* espacamento interno */
        width: 80px;/* largura */
        height: 32px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    .icon:before{/* configura o estado do icone menu */
        font-size: 20px;/* tamanho da fonte */
        z-index: 1;/* empilhado primeiro */
        content: '\002630';/* codigo do caracter */
    }
    input:checked ~ nav#menu{/* atua sobe a nav menu ao ativar o checkbox */
        position: absolute;/* posicao absoluta */
        width: 100%;/* largura */
        height: 100%;/* altura */
        visibility: visible;/* visivel */
        display: block;/* mostra nav */
    }
    nav#menu{/* configura os menus no lado esquerdo da pagina principal */
        margin: 5px 0px 0px 0px;/* espacamento acima da nav menu */
        display: none;/* oculta nav */
    }
    nav#menu ul{/* configura a lista ordenada do menu */
        padding: 0px;/* espacamento interno */
        margin: 0px;/* espacamento externo */
        list-style: none;/* oculta caracteres da lista */
    }
    nav#menu div#div1 ul{/* configura a categoria de menus principais */
        font-size: 12px;/* tamanho da fonte */
        text-transform: uppercase;/* caixa alta */
        background-color: #006cb5;/* fundo COR */
        border-bottom: solid 1px #aaf;/* borda abaixo solida COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        padding: 3px 0px 0px 0px;/* espacamento interno */
        margin: 0px;/* espacamento externo */
        width: 100%;/* largura */
        height: 36px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    nav#menu div#div1 a{/* configura os links dos menus principais */
        text-decoration: none;/* sem sublinhado */
    }
    nav#menu div#div1 div{/* configura o texto nos menus principais */
        color: #fff;/* fonte COR */
        padding: 10px 0px 0px 12px;/* espacamento interno */
    }
    nav#menu div#div1 ul:hover{/* configura o efeito mouse nos menus principais */
        text-decoration: underline #fff;/* sublinhado branco */
        background-color: #0050a0;/* fundo COR */
    }
    nav#menu div#div2 ul{/* configura a categoria de menus secundarios */
        font-size: 12px;/* tamanho da fonte */
        background-color: #fff;/* fundo COR */
        -webkit-border-radius: 4px;/* bordas arredondadas chrome */
        -moz-border-radius: 4px;/* bordas arredondadas mozilla */
        -ms-border-radius: 4px;/* bordas arredondadas ms explorer */
        -o-border-radius: 4px;/* bordas arredondadas opera */
        border-radius: 4px;/* bordas arredondadas */
        padding: 3px 0px 0px 0px;/* espacamento interno */
        margin: 0px;/* espacamento externo */
        width: 100%;/* largura */
        height: 36px;/* altura */
        cursor: pointer;/* efeito navegacao */
    }
    nav#menu div#div2 a{/* configura os links dos menus secundarios */
        text-decoration: none;/* sem sublinhado */
    }
    nav#menu div#div2 div{/* configura o texto nos menus secundarios */
        color: #333;/* fonte COR */
        padding: 10px 0px 0px 12px;/* espacamento interno */
    }
    nav#menu div#div2 ul:hover{
        text-decoration: underline #333;/* sublinhado cinza */
        background-color: #eee;/* fundo COR */
    }
    iframe#frame{/* configura o iframe no index */
        border: none;/* sem formatacao*/
        width: 668px;/* largura */
        max-width: 100%;/* largura maxima */
        height: 1890px;/* altura */
        overflow: hidden;/* oculta barra de rolagem */
    }

}/* fim estilo para tela menor */
