@charset "UTF-8";
/* 
    Arquivo: contraste-preto.css
    Criado em: 19/09/2016, 14:29:00
    Diretoria: Diretoria de Serviços de Processamento de Dados - DSPD
    Autores  : Gabriel Cabral / Krissia Menezes
    Descrição: CSS Customizado para alterar a cor de fundo de todas as páginas do sistema, inclusive a página de Acessibilidade.
               COR DE FUNDO PRETO
*/

/*
|------------------------------------------------------------------------------
| RESET 
|------------------------------------------------------------------------------
*/
*{
    margin: 0;
    padding:0;
    font-size:100%;
    box-sizing: border-box;
    border:none;
    outline:none;
    font-weight:300;
    box-sizing: border-box;
}
body {text-align: center; background-color: #000 !important;}
ul{list-style:none;}
img{max-width:100%;}

/* MIGALHA DE PÃO */
.breadcrumb{background-color: #333333 !important; color: #fff !important; border: 1px solid #fff !important;}
.breadcrumb span{color: #fff !important;}
.breadcrumb a{color: #FFFF00 !important;}
.breadcrumb a:focus{text-decoration: underline;}

/* H2 DE TODAS AS PÁGINAS INTERNAS */
.principal-article h2{font-size: 1.3em; color: #fff !important; margin-top: -1%;}/* Título h2 das páginas: MAPA DE NOTAS, RECADASTRAMENTO, TROCAR SENHA*/

/* TODOS OS INPUTS DOS FORMULÁRIOS */
.form-control{background-color: #000 !important; color: #fff !important;}



/*
|------------------------------------------------------------------------------
| MENSAGENS
|------------------------------------------------------------------------------
*/
.alert-success{border:1px solid green;}
.alert-info{border:1px solid #31708f;}
.alert-danger{border:1px solid #a94442;}

.mensagem-info{background-color: #000 !important; color: #fff !important; border-color: #9FCFFF !important;}
.mensagem-danger{background-color: #000 !important; color: #fff !important; border-color: #a94442 !important;}
.mensagem-success{background-color: #000 !important; color: #66CC33 !important; border-color: #66CC33 !important;}
.mensagem-warning{background-color: #000 !important; color: #fff !important; border-color: #DFD179 !important;}
.mensagem-warning strong{color: #fff !important;}


/*
|------------------------------------------------------------------------------
| BARRA DE ACESSIBILIDADE  
|------------------------------------------------------------------------------
*/
.menu-acessivel{width: 100%; padding: 6px; background-color: #35434f; float: left; font-family: 'Open Sans', sans-serif;}
.menu-acessivel .icon-bar{background-color: #fff;}
.menu-acessivel .navbar-brand{color: #fff !important; font-size: 1em;}
.nav>li>a {
    position: relative;
    display: block;
    padding: 1px;
}
.navbar-nav>li>a {
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 25px;
}
.navbar-nav>li>span {
    margin-right: 2px;
    line-height: 25px;
}
.menu-acessivel li {margin-left: 0; font-size: 13px; color: #fff; float: left;}
.menu-acessivel li a{color: #FFFF00; font-weight: 400;}
.menu-acessivel li a:focus, .menu-acessivel li a:hover{background-color: #000; text-decoration: underline; border-radius: 4px;}
.menu-acessivel .divider-vertical {height: 25px;margin: 0 9px;border-left: 1px solid #888;border-right: 1px solid #888;}
.menu-acessivel .divider-horizontal {width: 100%;margin: 9px 0px;border-top: 1px solid #888;}

.numero{padding: 0 5px; border-radius: 5px; background-color: #000; color: #fff;}
.branco{ padding: 5px; border-radius: 5px; background-color: #fff; color: #000;}
.preto{ padding: 5px; border-radius: 5px; background-color: #000; color: #fff;}
.azul{ padding: 5px; border-radius: 5px; background-color: #9FCFFF; color: #000;}
.amarelo{ padding: 5px; border-radius: 5px; background-color: #DFD179; color: #000;}



/*
|------------------------------------------------------------------------------
| CABEÇALHO 
|------------------------------------------------------------------------------
*/
/*
| TOPO: LOGO DA UEPA + NOME DO USUÁRIO
| PÁGINAS QUE COMPÕE TAIS CLASSES: MAIN, MAPA DE NOTAS, RECADASTRAMENTO, TROCAR SENHA
*/
header .cabecalho{width: 100%; padding: 2% 0; margin-left: 0; background-color: #000 !important; float: left;}
header .cabecalho .logo{width: 100%; background-color: #fff;}
header .cabecalho .cabecalho-username{
    background-color: #333333 !important;
    margin-top: 15%;
    color: #fff !important;
    padding: 3% 0;
    border-radius: 4px;
    font-size: 1.1em;
    border-bottom: 5px solid #fff !important;
}

/*
|------------------------------------------------------------------------------
| MENU 
|------------------------------------------------------------------------------
*/
.menu-reponsivo{background-color:#333333; border: 1px solid #fff !important;}
.menu-reponsivo button{background-color: #000 !important; border-color: #FFFF00 !important; color: #FFFF00 !important;}

#navbar-brand-centered{width: 100%; float: left; padding: 0;}
#menu{
    float: left;
    box-shadow:0px 0px 5px grey;
    width: 100%;
    border-bottom: 5px solid #FFF; /*COR DA BORDA INFERIOR, COR ANTERIOR: #47c9af*/
    font-family: Raleway, sans-serif;
    border-bottom-left-radius:4%;
    border-bottom-right-radius:4%;  } /*Formatando a sombra do menu(esquerda, direita, centro e cor)*/
#menu .glyphicon {font-size:120%;}
#menu ul{
    background-color: #333333 !important; /*inseri a cor semelhante ao azul da logo da uepa para o menu*/
    list-style:none; /*retirei os estilos da lista*/
}
#menu ul li{
    display:inline; /*tornando a minha lista na horizontal*/
}
#menu ul li a{
    padding: 1% 25px 1px 25px; /*FORMATAÇÃO DE UM ESPAÇO DENTRO DO MEU MENU - cima- direita - baixo - esquerda*/
    display:inline-block;
    z-index: 2;
    font-size: 120%;
    font-weight: bold;
    text-decoration:none;
    text-transform:uppercase;
    color: #fff !important;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
#menu> ul > li.active > a,
#menu > ul > li:hover > a,
#menu > ul > li > a:hover {
    color: #000 !important;
    background: #fff !important;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
}
#menu,
#menu ul,
#menu ul li,
#menu ul li a {
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*
|------------------------------------------------------------------------------
| RODAPÉ 
|------------------------------------------------------------------------------
*/
.rodape{width:100%; background-color: #000; color: #fff; padding: 2%; float: left;}
.icones span{font-size:2em; margin-right: 1%;}
.rodape p{font-size: 1em; margin-top: 1%; text-align: center;}
.rodape a{color: #FFFF00 !important;}
.rodape a:hover, .rodape a:focus{text-decoration: underline;}

.btn-rodape{border-radius:5%; cursor:pointer; padding:0;}
.btn-rodape #flip{font-size: 1.2em; background-color: #000 !important; border-color:#FFFF00 !important; color: #FFFF00 !important;}

.rodape #panel{font-size: 1.3em; padding: 10px; display: none; font-family:Tahoma, Geneva, sans-serif;}

/*
|------------------------------------------------------------------------------
| /FIM DO RESET 
|------------------------------------------------------------------------------
*/




/*============================================================================ 
  |  ARQUIVO: index.php
  |  DESCRIÇÃO: Página de login do sistema SIGA Aluno
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
#main-login{padding: 5% 0; margin: 0; float: left; background-color: #000 !important; width: 100%;}
#main-login .painel-login {margin: 0 auto; padding: 0; background-color: #000 !important;}


#main-login .panel-heading {background-color: #000 !important;}
#main-login .panel-heading .logo{width: 100%; background-color: #fff !important;}

#main-login .painel-login .formulario{border-right: 1px solid rgba(205,205,205,1); padding-top: 10px;}
#main-login .painel-login .primeiro-acesso{font-size: 1.1em; padding-top: 10px; padding-bottom: 2.5px;}

/*ALTERANDO COR DE FUNDO E COR DA FONTE*/
#main-login .painel-login .formulario,
#main-login .painel-login .primeiro-acesso,
#main-login .painel-login .col-md-6 .form-group .input-index input{background-color: #000 !important; color: #fff !important;}

#main-login .painel-login .col-md-6 .form-group .input-index{ width: 100%; font-size: 1.1em; font-family: 'Open Sans', sans-serif;}
#main-login .painel-login .col-md-6 .form-group .botao-enviar{ float: right; margin-bottom: 5px; background-color: #000 !important; border-color:#FFFF00; color: #FFFF00 !important;}
#main-login .painel-login .col-md-6 .form-group .botao-enviar:hover{color: #fff !important;}
#main-login .painel-login .col-md-6 .form-group .botao-enviar:focus{border:2px solid #da6709;}



/*============================================================================ 
  |  ARQUIVO: confirmacao.php
  |  DESCRIÇÃO: Página de login do sistema SIGA Aluno
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
#main-confirmacao{padding: 5% 0; margin: 0; float: left; width: 100%;}
#main-confirmacao .painel-confirmacao {margin: 0 auto; padding: 0;}

/*ALTERANDO COR DE FUNDO*/
 #main-confirmacao .panel-heading {background-color: #000 !important;}
#main-confirmacao .panel-heading .logo{background-color: #fff !important; width: 100%;}

/*ALTERANDO COR DE FUNDO E COR DA FONTE*/
#main-confirmacao,
#main-confirmacao .painel-confirmacao .formulario-confirmacao,
#main-confirmacao .painel-confirmacao .formulario-confirmacao .form-group input[type= 'text']{background-color: #000 !important; color: #fff !important;}

#main-confirmacao .painel-confirmacao .formulario-confirmacao{padding: 2% 5%;}
#main-confirmacao .painel-confirmacao .formulario-confirmacao h3{margin: 15px 0; }
#main-confirmacao .painel-confirmacao .formulario-confirmacao legend{font-size: 1.4em;}
#main-confirmacao .painel-confirmacao .formulario-confirmacao .form-group input[type= 'text']{ width: 100%; font-size: 0.7em;}
#main-confirmacao .painel-confirmacao .formulario-confirmacao .btn-rodape-confirmacao .btn-confirmacao{float: right;}

/*CONTRASTE NO BOTÃO*/
#main-confirmacao .painel-confirmacao .formulario-confirmacao .btn-rodape-confirmacao .btn-confirmacao{background-color: #000 !important; border-color:#FFFF00; color: #FFFF00 !important;}
#main-confirmacao .painel-confirmacao .formulario-confirmacao .btn-rodape-confirmacao .btn-confirmacao:hover{color: #fff !important;}








/*============================================================================ 
  |  ARQUIVO: main.php
  |  DESCRIÇÃO: Página Inicial do sistema SIGA Aluno
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
#principal{float: left; width: 100%;  margin-top: 2%; margin-bottom: 2%;}
#principal .principal-article{background-color: #000 !important; color: #fff !important; border: 1px solid #fff !important; border-radius: 4px; border-left: 5px solid #fff !important; padding-left: 2%; padding-right: 2%;}
#principal .principal-article h3{font-size: 1.2em;}
#principal .principal-article .dd__main{margin-left: 3%;}
#principal .principal-article .lista-main{list-style: lower-alpha; background-color: #333333; padding:1% 5%;}



/*============================================================================ 
  |  ARQUIVO: notas/index.php
  |  DESCRIÇÃO: Página Mapa de Notas do sistema SIGA Aluno
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
#principal .principal-article .tabela-meus-dados thead{background-color: #000 !important; color: #fff !important; border-color: #fff !important;  font-size: 1.1em;}
#principal .principal-article .tabela-meus-dados thead tr th{font-weight: bold;}
#principal .principal-article .tabela-meus-dados tbody{background-color: #333333 !important;}

#principal .principal-article .tabela-minhas-notas {border: 2px solid #fff;}
#principal .principal-article .tabela-minhas-notas thead{background-color: #333333 !important; color: #fff !important;}
#principal .principal-article .tabela-minhas-notas thead tr th{font-weight: bold !important;}/* APLICANDO NEGRITO */
#principal .principal-article .tabela-minhas-notas thead tr th, #principal .principal-article .tabela-minhas-notas tbody tr td{border: 1px solid #fff; }

/*CORES DAS LINHAS DA TABELA DE NOTAS*/
.linha-escura{background-color: #000 !important;}
.linha-clara{background-color: #777 !important; }

.periodo{padding: 10px; font-weight: bold; font-size: 0.85em; border-radius: 15px; }
.titulo-h3{margin: 0; font-weight: bold;}




/*============================================================================ 
  |  ARQUIVO: alteraDados/index.php
  |  DESCRIÇÃO: Página de Recadastramento do sistema SIGA Aluno
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
.bloco-recad {font-family: 'Open Sans', sans-serif; border-color: #fff !important;}/*Estilo da fonte*/

.bloco-recad .panel-heading{background-color: #333333 !important; color: #fff !important; border-color: #fff !important;}
.bloco-recad .panel-body{background-color: #000 !important; color: #fff !important; border-color: #fff !important;}

.bloco-recad .panel-body .row .col-md-6{margin: 7px 0;}/*Espaçamento entre as colunas col-md-6*/
.bloco-recad .panel-body .row .col-md-4{margin: 7px 0;}/*Espaçamento entre as colunas col-md-4*/
.bloco-recad .panel-body .row .col-md-8{margin: 7px 0;}/*Espaçamento entre as colunas col-md-8*/
.bloco-recad .panel-body .row .col-md-6 label{font-size: 1.2em;}/*Tamanho da fonte da label*/

.btn-formulario{margin: 10px 0; padding: 20px; text-align: center;}
.btn-formulario button{background-color: #000 !important; color: #FFFF00 !important; border-color: #FFFF00 !important;}
.btn-formulario button:hover{color: #fff !important;}

.progress-bar-padrao{background-color: #333333 !important; color: #fff !important; border: 1px solid #fff;}



/*============================================================================ 
  |  ARQUIVO: alteraDados/impressao.php
  |  DESCRIÇÃO: Página para imprimir o comprovante de atualização cadastral
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
#principal .principal-article .impressao {font-family: 'Open Sans', sans-serif;}/*Estilo da fonte*/
#principal .principal-article .impressao .panel-heading{background-color: #333333 !important; color: #fff !important; border-color: #fff !important;}
#principal .principal-article .impressao h3 a{text-decoration: none; color: #fff;}
#principal .principal-article .impressao .panel-body{background-color: #000 !important; color: #fff !important; border-color: #fff !important;}
#principal .principal-article .impressao .panel-body dl dl{width: 100%;}
#principal .principal-article .impressao .panel-body dl dt{padding: 0 15px;}
#principal .principal-article .impressao .panel-body dl dd{margin-bottom: 10px; padding: 0 15px;}
#principal .principal-article .impressao .panel-body dl dd ul{list-style: disc;}
#principal .principal-article .linha__assinatura{width: 100%; border-bottom: 1px solid #000;}

.progress-bar-success{background-color: #333333 !important; color: #fff !important; border: 1px solid green;}




/*============================================================================ 
  |  ARQUIVO: tsenha.php
  |  DESCRIÇÃO: Página para efetuar a troca de senha
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
.bloco-tr-senha {font-family: 'Open Sans', sans-serif; }
.bloco-tr-senha .bloco-botoes{padding: 0; margin-bottom: 20px; margin-top: 20px;}
.bloco-tr-senha .bloco-botoes .col-md-6 label{font-size: 1.2em;}

.bloco-tr-senha .bloco-botoes button{background-color: #000 !important;border-color:#FFFF00; color: #FFFF00 !important; }
.bloco-tr-senha .bloco-botoes button:hover{color: #fff !important;}




/*
|------------------------------------------------------------------------------
| MOBILE FIRST 
|------------------------------------------------------------------------------
@media screen and (min-width: 480px)
@media screen and (min-width: 568px)
@media screen and (min-width: 640px)
@media screen and (min-width: 667px)
@media screen and (min-width: 768px)
@media screen and (min-width: 1024px)
@media screen and (min-width: 1366px)
*/
/* SMALL DEVICES - SMARTPHONES */
@media screen and (min-width: 480px) {
    /*===== LOGO - LOGIN =====*/
    #main-login .panel-heading .logo,  #main-confirmacao .panel-heading .logo{width: 40%;}
    header .cabecalho .logo{width: 50%;}
    .principal-article h2{font-size: 1.6em;}/* Título h2 das páginas: MAPA DE NOTAS, RECADASTRAMENTO, TROCAR SENHA*/
    
     /*===== PÁGINA PRA IMPRESSÃO DO COMPROVANTE DE ATUALIZAÇÃO CADASTRAL: alteraDados/impressao.php =====*/
    #principal .principal-article .impressao .panel-body dl{width: 100% !important; float: left;}
    #principal .principal-article .impressao .panel-body dl dt{width: 50% !important; float: left; text-align: right;}
    #principal .principal-article .impressao .panel-body dl dd{width: 50% !important; padding: 0; float: left;}

}

/* SMALL DEVICES - SMARTPHONES - iPhone */
@media screen and (min-width: 640px){
    /*===== LOGO UEPA =====*/
    #main-login .panel-heading .logo,  #main-confirmacao .panel-heading .logo{width: 40%;}
    header .cabecalho .logo{width: 50%;}
    
    /*===== LINHA DE ASSINATURA =====*/
    #principal .principal-article .linha__assinatura{width: 40% !important; text-decoration: underline !important; margin: 0 auto;}
}

/* SMALL DEVICES - SMARTPHONES - iPhone */
@media screen and (min-width: 768px){
    /*===== LOGO UEPA =====*/
    #main-login .panel-heading .logo,  #main-confirmacao .panel-heading .logo{width: 40%;}
    header .cabecalho .logo{width: 100%;}
    
    /*===== LINHA DE ASSINATURA =====*/
    #principal .principal-article .linha__assinatura{width: 40% !important; text-decoration: underline !important; margin: 0 auto;}
}


/* MEDIUM DEVICES - TABLETS & DESKTOPS*/
@media screen and (min-width: 960px) {

    #main-login .panel-heading .logo,  #main-confirmacao .panel-heading .logo{width: 40%;}/*LOGO UEPA*/
    header .cabecalho .logo{width: 80%;}

    #main-confirmacao .painel-confirmacao .formulario-confirmacao{padding: 2% 15%;}
    
    /*===== LINHA DE ASSINATURA =====*/
    #principal .principal-article .linha__assinatura{width: 40% !important; text-decoration: underline !important; margin: 0 auto;}
}

/* LARGE DEVICES - WIDE SCREENS*/
@media screen and (min-width: 1280px) {

    #main-login .panel-heading .logo,  #main-confirmacao .panel-heading .logo{width: 40%;}/*LOGO UEPA*/
    header .cabecalho .logo{width: 80%;}

    #main-login .col-md-2, #main-confirmacao .col-md-2{width: 20%;}
    #main-login .painel-login, #main-confirmacao .painel-confirmacao {margin: 0 auto; padding: 0;  width: 60%;}

    #main-confirmacao .painel-confirmacao .formulario-confirmacao .form-group input[type= 'text']{font-size: 1.1em;}/*TAMANHO DA FONTE DO INPUT*/
    
    /*===== LINHA DE ASSINATURA =====*/
    #principal .principal-article .linha__assinatura{width: 40% !important; text-decoration: underline !important; margin: 0 auto;}
}

@media screen and (min-width: 1366px) {

}

/*
|------------------------------------------------------------------------------
| MENU
|------------------------------------------------------------------------------
*/
@media (max-width: 850px) {
    #menu ul li a{
        display:inline-block;
        font-size: 100%;
    }
}
@media (max-width: 768px) {
    #menu,
    #menu ul,
    #menu ul li,
    #menu ul li a{
        display:block;
        font-size:100%;

    }
}

@media (max-width: 736px) {
    #menu,
    #menu ul,
    #menu ul li,
    #menu ul li a{
        display:block;
        font-size:100%;

    }
}

@media (max-width: 667px) {
    #menu,
    #menu ul,
    #menu ul li,
    #menu ul li a{
        display:block;
        font-size:100%;
    }
}

@media (max-width: 600px) {
    #menu,
    #menu ul,
    #menu ul li,
    #menu ul li a{
        display:block;
        font-size:100%;
    }
}

@media (max-width: 568px) {
    #menu,
    #menu ul,
    #menu ul li,
    #menu ul li a{
        display:block;
        font-size:100%;
    }
}





/*
|------------------------------------------------------------------------------
| IMPRESSÃO 
|------------------------------------------------------------------------------
*/
@media print{
    
    h2{color: #000 !important;}
    
    /* OCULTAR ELEMENTOS */
    .oculta-impressao{display: none !important; margin: 0 !important; padding: 0 !important; font-size: 0px !important;}
    
    /* DL */
    #principal .principal-article .impressao .panel-body dl{width: 100%; float: left;}

    /* DT */
    #principal .principal-article .impressao .panel-body dl dt.col-10{width: 10%; float: left;}
    #principal .principal-article .impressao .panel-body dl dt.col-15{width: 15%; float: left;}
    #principal .principal-article .impressao .panel-body dl dt.col-20{width: 20%; float: left;}
    #principal .principal-article .impressao .panel-body dl dt.col-25{width: 25%; float: left;}
    #principal .principal-article .impressao .panel-body dl dt.col-30{width: 30%; float: left;}
    #principal .principal-article .impressao .panel-body dl dt.col-50{width: 50%; float: left;}
    
    /* DD */
    #principal .principal-article .impressao .panel-body dl dd.col-10{width: 10%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-15{width: 15%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-20{width: 20%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-25{width: 25%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-30{width: 30%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-50{width: 50%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-70{width: 70%; padding: 0; float: left; text-align: left;}
    #principal .principal-article .impressao .panel-body dl dd.col-75{width: 75%; padding: 0; float: left; text-align: left;}
    
    /* LINHA DE ASSINATURA */
    #principal .principal-article .linha__assinatura{width: 50% !important; text-decoration: underline !important; margin: 0 auto;}
}




/*============================================================================ 
  |  ARQUIVO: acessibilidade.html
  |  DESCRIÇÃO: Página com informações sobre a acessibilidade do sistema
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
/*
|------------------------------------------------------------------------------
| CABEÇALHO 
|------------------------------------------------------------------------------
*/
header .logo-acessibilidade{width:85%; margin: 1%; background-color: #fff !important;}/* Imagem da página de acessibildiade */


/*
|------------------------------------------------------------------------------
| CONTEÚDO PRINCIPAL
|------------------------------------------------------------------------------
*/
#main-acessibilidade{background-color: #000 !important; color: #fff !important; border: 1px solid #fff !important; border-radius: 4px;}
#main-acessibilidade a{color: #FFFF00 !important;}

#main-acessibilidade .acessibilidade-sistema, .navegacao-teclado, .sugestoes{width: 100%; padding: 1%;}
#main-acessibilidade .acessibilidade-sistema p, .navegacao-teclado p, .sugestoes p{ font-size: 1.2em;}
#main-acessibilidade .navegacao-teclado .lista{background-color: #333333; border-radius: 4px; padding:1% 5%; list-style: square; font-size: 1.1em;}

#main-acessibilidade .publicacao{width: 100%; padding: 1%; font-size: 1em; color: #fff !important;}

.titulo-h2{color: #fff !important; border-bottom: 1px solid #fff !important; border-left: 5px solid #fff !important; padding-left: 1%; margin-bottom: 3%; border-radius: 3px 0 0 3px;}


/*============================================================================ 
  =============================== MOBILE FIRST ===============================
  ============================================================================*/

/* SMALL DEVICES - SMARTPHONES */
@media screen and (min-width: 480px) {
    /*===== CABEÇALHO =====*/
    header .logo-acessibilidade{ width:55%; margin: 1%;}/* Imagem da página de acessibildiade */
}

/* SMALL DEVICES - SMARTPHONES - iPhone */
@media screen and (min-width: 640px){
    /*===== CABEÇALHO =====*/
    header .logo-acessibilidade{ width:40%; margin: 1%;}/* Imagem da página de acessibildiade */
}


/* MEDIUM DEVICES - TABLETS & DESKTOPS*/
@media screen and (min-width: 960px) {
    /*===== CABEÇALHO =====*/
    header .logo-acessibilidade{ width:28%; margin: 1%;}/* Imagem da página de acessibildiade */
}

/* LARGE DEVICES - WIDE SCREENS*/
@media screen and (min-width: 1280px) {
    /*===== CABEÇALHO =====*/
    header .logo-acessibilidade{ width:25%; margin: 1%;}/* Imagem da página de acessibildiade */

}

@media screen and (min-width: 1366px) {
    /*===== CABEÇALHO =====*/
    header .logo-acessibilidade{ width:25%; margin: 1%;}/* Imagem da página de acessibildiade */

}