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

/* estilo para tela maior */

body{/* estiliza a tag body */
    font-family: Trebuchet MS;/* estilo fonte */
    color: #333;/* define cor da fonte cinza */
    margin: 0px;/* retira as margem */
    width: 100%;/* largura */
    overflow: hidden;
}
input{
    display: none;
}
label[for="bt_menu"]{
    display: none;
}
.coluna-menu{
    position: relative;
    float: left;
    width: 180px;/* largura dos menus */
    height: 100%;
}
.item ul {/* estiliza os menus com background cinza */
    list-style: none;/* oculta caracteres da lista */
    background-color: #666666;/* background cinza claro */
    padding: 5px 0px 0px 8px;/* espacamento a esquerda */
    height: 39px;/* altura */
    width: 148px;/* largura */
    margin-bottom: -12px;/* espacamento abaixo */
    border-radius: 4px;/* cantos arredondados */
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}
.item ul li a{/* estiliza a tag 'a' */
    color: #FFF;/* define cor da fonte branca */
    text-decoration:none;/* sem efeito */
}
.item ul li a div{/* estiliza a tag div */
    padding-top: 8px;/* espacamento acima */
    cursor: pointer;/* cursor do mouse tipo link*/
}
.item ul:hover{/* configura entrada do cursor do mouse */
    background-color: #CCC;/* background cinza */
    text-decoration: none;/* sem efeito  */
}
.item2 ul {/* estiliza os menus sem background */
    list-style: none;/* oculta caracteres da lista */
    background-color: #fff;/* background branco */
    padding-left: 17px;/* espacamento a esquerda */
    height: 39px;/* altura */
    width: 148px;/* largura */
    margin-bottom: -12px;
    border-radius: 4px;/* cantos arredondados */
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}
.item2 ul li a{/* estiliza a tag 'a' */
    color: #333;/* define cor da fonte cinza */
    text-decoration: none;/* sem efeito */
}
.item2 ul li a div{/* estiliza a tag div */
    padding-top: 8px;
    cursor: pointer;/* cursor do mouse tipo link*/
}
.item2 ul:hover{/* configura entrada do cursor do mouse */
    text-decoration: underline;/* efeito sublinhado */
}
.frame{/* estiliza o iframe */
	margin-left: -4px;
    width: 668px;
    max-width: 100%;
    height: 1700px;
    max-height: 100%;
    border: none;
    overflow: hidden;
}

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

    body{/* estiliza a tag body */
        font-family: Trebuchet MS;/* estilo fonte */
        color: #333;/* define cor da fonte cinza */
        margin: 0px;/* retira as margem */
        width: 100%;/* largura */
        overflow: hidden;
    }
    input{/* oculta o input checbox */
        display: none;
    }
    label[for="bt_menu"]{
        display: block;
    }
    img{/* oculta a tag img */
        display: none;
    }
    .icon{
		color: #fff;
        text-align: center;
        background-color: #666666; /* define cor cinza escuro para menu estilizado*/
        height: 32px;/* altura do menu */
        width: 80px;/* largura do menu */
        cursor: pointer;
        padding: 5px;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
    }
    .icon:before{
        content: '\002630';
        font-size: 20px;
        z-index: 1;
    }
    input:checked ~ .coluna-menu{
        position: absolute;
        visibility: visible;
        display: block;
        height: 100%;
        width: 100%;
    }
    .coluna-menu{
        margin-top: 5px;
        display: none;
    }
    .item ul {/* estiliza os menus com background cinza */
        list-style: none;/* oculta caracteres da lista */
        background-color: #666666;/* background cinza claro */
        margin: 0px;
        padding: 5px 0px 10px 20px;/* espacamento a esquerda */
        border-bottom: solid 1px #fff;
        height: 30px;/* altura */
        width:100%;/* largura */
    }
    .item ul li a{/* estiliza a tag 'a' */
        color: #fff;/* define cor da fonte cinza */
        text-decoration: none;/* sem efeito */
    }
    .item ul li a div{/* estiliza a tag div */
        cursor:pointer;/* cursor do mouse tipo link*/
    }
    .item ul:hover{/* configura entrada do cursor do mouse */
        background-color: #ccc;/* background cinza */
        text-decoration: none;/* efeito sublinhado */
    }
    .item2 ul {/* estiliza os menus sem background */
        list-style: none;/* oculta caracteres da lista */
        margin: 0px;
        padding: 10px 0px 0px 20px;/* espacamento a esquerda */
        height: 30px;/* altura */
        width: 100%;/* largura */
    }
    .item2 ul li a{/* estiliza a tag 'a' */
        color: #333;/* define cor da fonte cinza */
        text-decoration: none;/* sem efeito */
    }
    .item2 ul li a div{/* estiliza a tag div */
        padding-top: 8px;
        cursor: pointer;/* cursor do mouse tipo link*/
    }
    .item2 ul:hover{/* configura entrada do cursor do mouse */
        text-decoration: underline;/* efeito sublinhado */
    }
    .frame{/* estiliza o iframe */
        width: 668px;
        max-width: 100%;
        height: 1700px;
        max-height: 100%;
        border: none;
        overflow: hidden;
    }

}

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

    body{/* estiliza a tag body */
        font-family: Trebuchet MS;/* estilo fonte */
        color: #333;/* define cor da fonte cinza */
        margin: 0px;/* retira as margem */
        width: 100%;/* largura */
        overflow: hidden;
    }
    input{/* oculta o input checbox */
        display: none;
    }
    label[for="bt_menu"]{
        display: block;
    }
    img{/* oculta a tag img */
        display: none;
    }
    .icon{
        text-align: center;
        background-color: #666666;
        height: 32px;/* altura do menu */
        width: 80px;/* largura do menu */
        cursor: pointer;
        padding: 5px;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
    }
    .icon:before{
        content: '\002630';
        font-size: 20px;
        z-index: 1;
    }
    input:checked ~ .coluna-menu{
        position: absolute;
        visibility: visible;
        display: block;
        height: 100%;
        width: 100%;
    }
    .coluna-menu{
        margin-top: 5px;
        display: none;
    }
    .item ul {/* estiliza os menus com background cinza */
        list-style: none;/* oculta caracteres da lista */
        background-color: #666666;/* background cinza claro */
        margin: 0px;
        padding: 5px 0px 5px 20px;/* espacamento a esquerda */
        height: 30px;/* altura */
        width:100%;/* largura */
    }
    .item ul li a{/* estiliza a tag 'a' */
        color: #fff;/* define cor da fonte cinza */
        text-decoration:none;/* sem efeito */
    }
    .item ul li a div{/* estiliza a tag div */
        font-size: 13px;
        cursor: pointer;/* cursor do mouse tipo link*/
    }
    .item ul:hover{/* configura entrada do cursor do mouse */
        background-color: #ccc;/* background cinza */
        text-decoration: none;/* efeito sublinhado */
    }
    .item2 ul {/* estiliza os menus sem background */
        list-style: none;/* oculta caracteres da lista */
        margin: 0px;
        padding: 10px 0px 0px 20px;/* espacamento a esquerda */
        height: 30px;/* altura */
        width: 100%;/* largura */
    }
    .item2 ul li a{/* estiliza a tag 'a' */
        color: #000;/* define cor da fonte cinza */
        text-decoration: none;/* sem efeito */
    }
    .item2 ul li a div{/* estiliza a tag div */
        font-size: 13px;
        padding-top: 8px;
        cursor: pointer;/* cursor do mouse tipo link*/
    }
    .item2 ul:hover{/* configura entrada do cursor do mouse */
        text-decoration: underline;/* efeito sublinhado */
    }
    .frame{/* estiliza o iframe */
        width: 668px;
        max-width: 100%;
        height: 1700px;
        max-height: 100%;
        border: none;
        overflow: hidden;
    }

}