@charset "UTF-8";
/* 
    Arquivo: geral.css
    Criado em: 07/04/2016, 14:29:00
    Diretoria: Diretoria de Serviços de Processamento de Dados - DSPD
    Autores  : Gabriel Cabral / Krissia Menezes
    Descrição: CSS Customizado para todas as páginas do SIGA Aluno
*/

/*
|------------------------------------------------------------------------------
| 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: #f5f5f5;}
a{text-decoration:none;}
ul{list-style:none;}
img{max-width:100%;}

/* H2 DE TODAS AS PÁGINAS INTERNAS */
.principal-article h2{font-size: 1.3em; color: #000; margin-top: -1%;}/* Título h2 das páginas: MAPA DE NOTAS, RECADASTRAMENTO, TROCAR SENHA*/

/*
|------------------------------------------------------------------------------
| MENSAGENS
|------------------------------------------------------------------------------
*/
.alert-success{border:1px solid green;}
.alert-info{border:1px solid #31708f;}
.alert-danger{border:1px solid #a94442;}


/*
|------------------------------------------------------------------------------
| 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; 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: #fff; font-weight: 400;}
.menu-acessivel li a:focus, .menu-acessivel li a:hover{border:1.5px solid #da6709 !important; border-radius: 4px; background-color: #000; color: #fff; text-decoration: none;}
.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: #337ab7; 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;}

/*
.oculto{font-size: 0; margin: 0; border: none; } ocultando niveis de cabeçalhos, legend, caption etc*/


/*
|------------------------------------------------------------------------------
| 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: url(../imagens/school.png) top center; float: left;}
header .cabecalho .logo{width: 100%;}
header .cabecalho .cabecalho-username{
    background-color: #f5f5f5;
    margin-top: 15%;
    color: #114488;
    padding: 3% 0;
    border-radius: 4px;
    font-size: 1.1em;
    border-bottom: 5px solid #114488;

}


/*
|------------------------------------------------------------------------------
| MENU 
|------------------------------------------------------------------------------
*/
.menu-reponsivo{background-color:#148; }
.menu-reponsivo button{background-color: white; border:white;}

#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:#148; /*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; /*MUDANDO A COR DO MENU FONT, COR ANTIGA: #444444*/
    -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: #148; /*MUDANDO A COR DO FONT HOVER, COR ANTIGA: #FFF*/
    background:#fff;
    -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: #35434f; 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: #E9DDC6 !important;}

.btn-rodape{border-radius:5%; cursor:pointer; padding:0;}
.btn-rodape #flip{font-size: 1.2em; color: #fff !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: url(../imagens/school.png); width: 100%;}
#main-login .painel-login {margin: 0 auto; padding: 0;}

#main-login .panel-heading {background-color: #f5f5f5;}
#main-login .panel-heading .logo{width: 100%;}

#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;}

#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;}
#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; background: url(../imagens/school.png); width: 100%;}
#main-confirmacao .painel-confirmacao {margin: 0 auto; padding: 0;}

#main-confirmacao .panel-heading {background-color: #f5f5f5;}
#main-confirmacao .panel-heading .logo{width: 100%;}

#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;}





/*============================================================================ 
  |  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: #fff; border: 1px solid #e3e3e3; border-radius: 4px; border-left: 5px solid #148; 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: #F6F7F8; 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: #fff; color: #337AB7; 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:#C5E3ED;}

#principal .principal-article .tabela-minhas-notas thead{background-color: #114488; color: #fff;}
#principal .principal-article .tabela-minhas-notas {border: 2px solid #114488; }
#principal .principal-article .tabela-minhas-notas thead tr th, #principal .principal-article .tabela-minhas-notas tbody tr td{border: 1px solid #114488; }

/*CORES DAS LINHAS DA TABELA DE NOTAS*/
.linha-escura{background-color: #DBDBDB;}
.linha-clara{background-color: #FFFFFF; }

.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; }/*Estilo da fonte*/

.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*/

.btn-formulario{margin: 10px 0; padding: 20px; text-align: center;}
.bloco-recad .panel-body .row .col-md-6 label{font-size: 1.2em;}/*Tamanho da fonte da label*/

.progress-bar-padrao{background-color: #e8e8e8; color: #000; border: 1px solid #000;}



/*============================================================================ 
  |  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 h3 a{text-decoration: none; color: #fff;}
#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;}



/*============================================================================ 
  |  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;}

/* MENSAGENS PARA INFORMAR SE AS SENHAS INFORMADAS CONFEREM */
.bloco-tr-senha .msg-success{background-color: #dff0d8; color: #3c763d; border-color: #3c763d;}
.bloco-tr-senha .msg-danger{background-color: #f2dede; color: #a94442; border-color: #a94442;}

/*
|------------------------------------------------------------------------------
| 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%; float: left;}
    #principal .principal-article .impressao .panel-body dl dt{width: 50%; float: left; text-align: right;}
    #principal .principal-article .impressao .panel-body dl dd{width: 50%; 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{
    
    /* 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: main, mapadenotas, recadastramento, trocasenha
  |  DESCRIÇÃO: Inserção de uma imagem de Carregando ao clicar nos links em geral.
  |  CSS PERSONALIZADO COM SUAS RESPECTIVAS CLASSES
  ============================================================================*/
#blanket,#aguarde {
    position: fixed;
    display: none;
}

#blanket {
    left: 0;
    top: 0;
    background-color: #f0f0f0;
    filter: alpha(opacity =         65);
    height: 100%;
    width: 100%;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
    opacity: 0.65;
    z-index: 9998;
}

#aguarde {
    width: 50%;
    height: 30px;
    top: 40%;
    left: 24%;
   	line-height: 30px;

    z-index: 9999;
    padding-left: 27px;
}
#aguarde > p{
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
	margin-top:-10px;	
}
