/**
 * Compusofts Informática
 * Soluções em informação e automação
 * 
 * Emilia Yoshiko Takakura Omori Computadores ME
 * CNPJ: 67.049.932/0001-08
 * Av. Dom Pedro II, 146, Centro
 * Presidente Venceslau, CEP 19400-000, Brasil
 * Telefone: +55(18)3271-3245
 * http://www.compusofts.com.br
 * contato@compusofts.com.br
 * 
 * 
 * @name Padrao
 * @file Padrao.css 
 * @encoding UTF-8
 * @access public 
 * @date 24/10/2019 09:59:22
 * @license https://creativecommons.org/licenses/by-nc-nd/4.0/legalcode CC BY-NC-ND
 * @copyright (c) 2019, Compusofts Informática 
 * @author Marcel Aimar <marcel@compusofts.com.br>
 */
@import url('https://fonts.googleapis.com/css?family=Quicksand:400,500,700&display=swap');

@-webkit-keyframes girar {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes girar {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

:root{
    --azul-escuro:#00526d;
    --azul:#0087b4;
    --vermelho-pdf:#c10c0c;
    --menu-lateral:250px;
    --menu-topo:80px;
    --cinza-fundo:#f3f3f7;
    --topo-mobile:50px;
    --largura-maxima:1200px;
    --largura-minima:900px;

    --situacao-verde:#00b32f;
    --situacao-vermelho:#d60000;
    --situacao-amarelo:#dcd500;
}

*{
    margin: 0;
    padding: 0;
    outline: none;    
    box-sizing: border-box;
}
ul{
    list-style: none;
}

a{
    text-decoration: none;
    color: #0057a4;
    cursor: pointer;
}
html{
    display: flex;
    min-height: 100%;
}
body{
    font-family: 'Quicksand', sans-serif;
    background-color: var(--cinza-fundo);
    flex: 1;
    display: flex;
    flex-direction: column;
    /*justify-content: space-evenly;*/
    justify-content: flex-start;
    flex-flow: column wrap;
}

body.modoImpressao{
    --largura-maxima:auto;
    --largura-minima:auto;
    --menu-lateral:0;
    --menu-topo:0;

    background-color: #fff;
}
body.modoImpressao header{
    display: none !important;
}
body.modoImpressao footer{
    display: none !important;
}
body.modoImpressao #menuLateral{
    display: none !important;
}

a.botaoFlutuante{
    display: none;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    line-height: 60px;
    position: fixed;
    z-index: 8;
    right: 20px;
    bottom: 20px;
    background: var(--azul-escuro);
    color: #fff;
    font-size: 0;    
    text-align: center;
    cursor: pointer;
    box-shadow: 1px 1px 3px rgba(0,0,0,.3);
}
a.botaoFlutuante:before{
    font-size: 17px;
}

.Invisivel{
    display: none !important;
    visibility: hidden;
}

span.carregando,
span.carregando:before,
span.carregando:after {
    border-radius: 50%;
}
span.carregando {
    --height: 60px;
    --width: 60px;
    --timeIn:1.8s;
    --timeOut:1.5s;
    --circle:8px;
    --padding:10px;
    --borderWidth:1px;
    --borderColor:#cccccc;
    --backgroundColor:#f8f8f8;
    --color:#0087b4;
    --widthUse: calc(var(--width) - var(--padding) - var(--circle));
    --widthPseudo:calc((var(--widthUse) / 2));

    width: var(--width);
    height: var(--height);
    top:50%;
    left: 50%;
    /*transform: translate(-50%, -50%);*/
    z-index: 9;
    color: var(--color);
    font-size: 0px;
    text-indent: -999999em;
    position: absolute;
    box-shadow: inset 0 0 0 var(--circle), 0 0 0 var(--borderWidth) var(--borderColor);
    -webkit-transform: translate(-50%, -50%) translateZ(0);
    -ms-transform: translate(-50%, -50%) translateZ(0);
    transform: translate(-50%, -50%) translateZ(0);
    background: var(--backgroundColor);
    border: var(--padding) solid var(--backgroundColor);
}
span.carregando:before,
span.carregando:after {
    position: absolute;
    content: "";
    background: var(--backgroundColor);
    top: -1px;
    bottom: -1px;
    width: var(--widthPseudo);
}
span.carregando:before {
    border-radius: var(--widthPseudo) 0 0 var(--widthPseudo);
    left: -1px;

    -webkit-transform-origin: var(--widthPseudo) + 1px) var(--widthPseudo);
    transform-origin: calc((var(--widthUse) / 2) + 1px) var(--widthPseudo);

    -webkit-animation: girar var(--timeIn) infinite ease var(--timeOut);
    animation: girar var(--timeIn) infinite ease var(--timeOut);

}
span.carregando:after {        
    border-radius: 0 var(--widthPseudo) var(--widthPseudo) 0;
    right:-1px;    

    -webkit-transform-origin: 0 calc((var(--widthUse) / 2) );
    transform-origin: 0 var(--widthPseudo);

    -webkit-animation: girar var(--timeIn) infinite ease;
    animation: girar var(--timeIn) infinite ease;
}
span.carregando.semBorda{
    --borderWidth: 0;
    --backgroundColor: #fff;
    --circle: 6px;
    --padding: 8px;
}

#menuCelular{
    position: fixed;
    background: rgba(0,0,0,.5);
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 10;  
    visibility: hidden;
}
#menuCelular>.conteudo{
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    overflow: auto;
    width: 80%;       
    -webkit-transform: translateX(-100%);
    -webkit-transition-delay: .8s;
    -webkit-transition: transform .4s; /* For Safari 3.1 to 6.0 */

    transform: translateX(-100%);
    transition-delay: .8s;
    transition: transform .4s;    
}
#menuCelular>.conteudo>.usuario{
    background: var(--azul-escuro);
    padding: 45px 0 45px 75px;
    position: relative;
    overflow: hidden;
}
#menuCelular>.conteudo>.usuario:before{
    content: "";
    position: absolute;
    background: rgba(0, 0, 0, 0.05);
    left: 39px;
    width: 147px;
    height: 359px;
    transform: rotate(64deg);
    top: -188px;
}
#menuCelular>.conteudo>.usuario h1{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 18px;
    color: #fff;
    line-height: normal;
    margin: 0;
    padding: 0;
}
#menuCelular>.conteudo>.usuario small{
    font-size: 12px;
    color: rgba(255,255,255,.7);
}
#menuCelular>.conteudo>.usuario>i{
    border-radius: 50%;  
    width: 45px;
    height: 45px;
    left: 15px;
    background: #fff;
    line-height: 45px;
    text-align: center;
    font-size: 19px;
    color: #a5a5a5;
    position: absolute;
    top: calc(50% - 23px);
    overflow: hidden;
}
#menuCelular>.conteudo>.usuario>i>img{
    position: absolute;
    max-width: 43px;
    left: 1px;
    top: 1px;
    border-radius: 80%;
}
#menuCelular>.conteudo>nav{
    display: flex;
    flex-direction: column;
}
#menuCelular>.conteudo>nav>a{
    font-size: 15px;
    font-weight: 500;    
    color: #6b6b6b;
    font-family: inherit;
    height: 50px;
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
}
#menuCelular>.conteudo>nav>a:before{
    font-family: "Font Awesome 5 Pro";
    font-weight: 600;
    font-size: 19px;
    text-align: center;
    width: 60px;
}
#menuCelular>.conteudo>nav>a:first-of-type{
    background: var(--azul);
    height: 60px;
    color: #fff;    
}
#menuCelular>.conteudo>nav>a.separador{
    border-bottom: 1px solid #e2e2e2;
}
#menuCelular.visivel>.conteudo{
    transform: translateX(0);
}
#menuCelular.visivel.fechar>.conteudo{
    transition-duration: .2s;
    transform: translateX(-100%);
}

header{
    background: #fff;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    box-shadow: 1px 1px 10px rgba(0,0,0,.1);
    align-items: center;
    height: var(--menu-topo);
    z-index: 999;
    position: fixed;
    left: 0;
    right: 0;

}
header>*{
    margin-right: 20px;
}
header>a.logo{    
    height: 100%;
    width: 210px;
    background:  url("../../Imagens/IAE/LogoAdmin.jpg") no-repeat center right;
}
header .opcoes{
    width: 36px;
    line-height: 36px;
    font-size: 13px;
    display: block;
    border-radius: 50%;
    background-color: #fff;
    text-align: center; 
    color: #8a8a8a;
    cursor: pointer;
}
header .opcoes.menu{
    font-size: 19px;
    color: #3d3d3d;
    background-color: #fff;
    display: none;
    width: 25px;
}
header .opcoes.operante{
    background-color: var(--azul);
    color: #fff;
}
header .opcoes.notificacoes{
    background: #fff;

    font-size: 18px;
    position: relative;
    background-color: var(--background);
}
header .opcoes.notificacoes.novidades{
    background:var(--azul);
    color: #fff;
}
header .opcoes.notificacoes:not(.novidades):hover{
    background: #f8f8f8;
}
header .opcoes.notificacoes:after{
    border-radius: 50%;
    width: 7px;
    height: 7px;
    background: red;
    position: absolute;
    border: 3px solid #fff;
    top: 0;
    right: 0;
}
header .opcoes.notificacoes.novidades:after{
    content: "";
}
header>.menuItens{
    flex: 1;
    font-size: 17px;
    text-align: center;
    padding: 0;
    /*background: yellow;*/
}
header>.menuItens>ul{   
    margin: auto;    
    display: flex;
    justify-content: space-between;
    max-width: var(--largura-minima);
    /*background: yellow;*/
}
@media screen and (max-width: 1280px) { 
    header>.menuItens{
        padding: 0 30px;
        font-size: 15px;
    }
    header>.menuItens>ul{
        max-width: none;
        /*background: yellowgreen;*/
    }
}
header>.menuItens>ul>li{
    color: #313131;
    border-bottom: 3px solid transparent;
    padding: 7px 0;
    cursor: pointer;
}
header>.menuItens>ul>li:hover{
    color: var(--azul);
    border-bottom-color: var(--azul);
}
header>.menuItens>ul>li.subMenu{
    padding-right: 15px;
    position: relative;
}
header>.menuItens>ul>li.subMenu:after{
    content: "";
    border: 4px solid transparent;
    border-top-color: #888888;
    right: 0;
    top: calc(50% - 1px);
    position: absolute;
}
header>.menuItens>ul>li.subMenu:hover>ul{
    display: block;   
    text-align: left;
}
header>.menuItens>ul>li.subMenu:hover>ul>li{
    color: #313131;
}
header>.menuItens>ul>li.subMenu:hover>ul>li:hover{
    color: var(--azul);
}
header>.menuItens>ul>li.subMenu:hover:after{
    border-top-color: transparent;
    border-bottom-color: #888888;
    top: calc(50% - 5px);
}
header>.menuItens>ul>li>ul{
    display: none;
    position: absolute;
    top: -5px;
    background: #ffffff;
    z-index: -1;
    padding-top: 39px;
    left: -25px;
    right: -50px;
    border-radius: 6px;
    box-shadow: 2px 2px 4px 0px rgba(0,0,0,.1);
}
header>.menuItens>ul>li>ul>li{
    border-top: 1px solid #efefef;
    padding: 10px 0px 10px 25px;
}

header>.usuario{    
    position: relative;
    font-size: 13px;    
    cursor: pointer;
    max-width: 165px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-height: 40px;
    padding: 5px 47px 0 0;
    text-align: right;
}
header>.usuario>u{
    display: block;
    text-decoration: none;
}


/*header>.usuario:before{
    content: "";
    border: 4px solid transparent;
    border-top-color: #888888;
    right: 0;
    position: absolute;
    top: calc(50% - 4px);
}*/
header>.usuario>i{
    position: absolute;
    right: 0;
    top: calc(50% - 18px);
    border: 1px solid #f1f1f1;
    font-size: 17px;
}
header>.usuario>i img{
    position: absolute;
    max-width: 34px;
    left: 1px;
    top: 1px;
    border-radius: 80%;
}
header>.usuario>a{
    display: inline-block;
    font-size: 12px;
    color: var(--azul);
    font-weight: 400;
    text-align: right;
}
header>.usuario>a:hover{
    text-decoration: underline;
}
header>.usuario>a:before{
    float: left;
    content: "";
    border: 3px solid transparent;
    border-right-color: var(--azul);
    margin:6px 3px 0 0;
}
/*header>.usuario>span{
    display: block;
    font-size: 11px;
    color: #a9a9a9;
    font-weight: 300;
    text-align: right;
}*/

#conteudo{
    flex: 1;
    /*margin: 0 auto;*/
    align-content: center;
    alignment-adjust: central;
    overflow: hidden;
    /*padding-bottom: 5px;*/
    display: flex;
    padding: var(--menu-topo) 0 5px 0;

    /*max-width: 1024px;*/    
}
#conteudo .pagina{
    min-width: var(--largura-minima);
    max-width: var(--largura-maxima);
    margin: 0 auto;
    padding-top: 50px;
}
#conteudo .pagina>h1>a.mobile:before{
    font-weight: 900;
    font-size: 16px;
    font-family: "Font Awesome 5 Pro";
}
#conteudo .pagina>h1>a.mobile{
    display: none;
    width: 28px;
    height: 28px;
    line-height: 24px;
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    color: #fff;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 50%;
    cursor: pointer;
}
#conteudo .pagina>h1>a.mobile:hover{
    background-color: rgba(255,255,255,.1);
}

#conteudo .pagina>h1>a.mobile.voltar:before{
    content: "\f060";
}
#conteudo .pagina>h1>a.mobile.opcoes{
    background-image: url("../Imagens/SVG/menu-branco.svg"); 
    background-size: 57% auto;
}
@media screen and (max-width: 1280px) {
    .pagina{
        max-width: 850px;
    }
}
/*@media screen and (max-width: 1280px) {
    :root{   
        --menu-lateral:220px;
    }
}*/
nav#menuLateral{    
    background: var(--azul);
    width: var(--menu-lateral);
    position: fixed;
    left: 0;
    bottom: 0;
    top:0;
    padding-top: var(--menu-topo);
    z-index: 0;
}
nav#menuLateral>a{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 0 20px 45px;
    text-align: left;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
}
nav#menuLateral>a.inativo{
    opacity: .4;
    pointer-events: none;
    cursor: no-drop;
}




@media screen and (max-width: 1280px) {
    nav#menuLateral>a{
        font-size: 14px;
    }
}
nav#menuLateral>a:before{
    font-weight: 900;
    font-size: 15px;
    font-family: "Font Awesome 5 Pro";
    margin: 0 10px 0 0;
}
nav#menuLateral>a.principal:before{
    content: "\f015";
}
nav#menuLateral>a.editar:before{
    content: "\f304";
}
nav#menuLateral>a.contato:before{
    content: "\f0e0";
}
nav#menuLateral>a.contrato:before{
    content: "\f56c";
}
nav#menuLateral>a.estudante:before{
    content: "\f19d";
}
nav#menuLateral>a.arquivo:before{
    content: "\f15c";
}
nav#menuLateral>a.filtro:before{
    content: "\f0b0";
}
nav#menuLateral>a.dados:before{
    content: "\f009";
}
nav#menuLateral>a:first-of-type{
    background-color: var(--azul-escuro);
}
nav#menuLateral ~ #conteudo{
    margin-left:  var(--menu-lateral);
}
nav#menuLateral ~ footer{
    margin-left:  var(--menu-lateral);
}
nav#menuLateral ~ #MensagemFormulario{
    margin-left:  calc(var(--menu-lateral) / 2);
}

.lista{    

    --border:20px;
    --colorLineHover:#f9f9f9;
    --colorLineSelected:#f5f5f5;


    border-radius: var(--border);
    display: flex;
    flex-direction: column;
    box-shadow: 2px 2px 4px 0px rgba(0,0,0,.1);
    position:relative;
    max-width: var(--largura-minima);
}
.lista .titulo{
    background-color: var(--azul);
    border-radius: var(--border) var(--border) 0 0;
    line-height: var(--topo-mobile);
    padding: 0 10px 0 1px;
    text-transform: uppercase;
    color: #fff;
    font-size: 21px;

    display: flex;
    align-items: center;
}
.lista .titulo>h6,
.lista .titulo>.pesquisar{
    -webkit-transition: flex 300ms ease-in-out;
    -moz-transition: flex 300ms ease-in-out;
    -o-transition: flex 300ms ease-in-out;
    transition: flex 300ms ease-in-out;
}
.lista .titulo>h6{
    flex: 1;
    position:relative;
    padding-left: 20px;    
    font-size: 14px;
}
.lista:not(.pesquisando) .titulo>a:not(.invisivel) + h6{
    padding-left: 5px;
}
.lista .titulo>.pesquisar{
    border-radius: 20px;
    background-color:transparent;    
    cursor: pointer;
    height: 33px;
    position: relative;
    min-width: 33px;
    max-width: 100%;
    margin-left: 5px;
}
.lista .titulo>.pesquisar:after{
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f002";
    font-size: 16px;
    position: absolute;
    top: 2px;
    vertical-align: middle;
    line-height: 29px;
    right: 8px;
}
.lista .titulo>.pesquisar:hover{
    background-color: rgba(255,255,255,.1);
}
.lista .titulo>.pesquisar input::placeholder{
    color: rgba(255,255,255,.5);
}
.lista .titulo>.pesquisar input{
    font-size: 15px;
    border: none;
    color: #fff;
    position: absolute;
    right: 0;
    left: 35px;
    width: 0;
    line-height: 30px;
    background: none;
    font-family: inherit;
    font-weight: 500;
}
.lista .titulo>.pesquisar>i{    
    position: absolute;
    left: 0px;
    top: 0px;
    font-size: 16px;
    z-index: -1;
    cursor: pointer;
    bottom: 0;
    line-height: 33px;
    width: 36px;
    text-align: center;
}
.lista .titulo>ul.opcoes{
    display: flex;
    font-size: 13px;
    align-items: center;
    position: relative;
    z-index: 1;
}
.lista .titulo>a,
.lista .titulo>ul.opcoes>li{
    border-radius: 50%;
    width: 33px;
    height: 33px;
    /*background: red;*/
    text-align: center;
    line-height: 31px;
    margin-left: 5px;
    cursor: pointer;
    color: #fff;

    display: flex;
    align-items: center;
    justify-content: center;

    -webkit-transition-property: width,height,margin-left;
    -webkit-transition-duration: 150ms; 

    transition-duration: 150ms; 
    transition-property: width,height;

    position: relative;
    /*background: red;*/
}
.lista .titulo>a>i,
.lista .titulo>ul.opcoes>li>i{
    font-size: 16px;    

    -webkit-transition-property: font-size;
    -webkit-transition-duration: 150ms; 
    -webkit-transition-delay: 100ms;

    transition-property: font-size;
    transition-duration: 150ms; 
    transition-delay: 100ms;
}

*[data-title]:before{
    content: attr(data-title) " ";
    /*background: red;*/
    transform: scale(0) translateX(20px);
    background: var(--azul-escuro);
    top: -22px;
    position: absolute;
    color: #fff;

    -webkit-transition-property: transform;
    -webkit-transition-duration: 150ms; 

    transition-duration: 150ms; 
    transition-property: transform;

    border-radius: 10px;
    padding: 2px 10px;
    font-size: 12px;
    line-height: normal;
    text-transform: none;
    font-weight: 500;
}
*[data-title]:hover:before{
    transform: scale(1) translateX(0);
}


.lista .titulo>a:hover,
.lista .titulo>ul.opcoes>li:hover{
    background-color: rgba(255,255,255,.1);
}
.lista .titulo>a.invisivel,
.lista .titulo>ul.opcoes>li.invisivel,
.lista .titulo>a.desabilitado,
.lista .titulo>ul.opcoes>li.desabilitado{ 
    width: 0px;
    height: 0px;
    margin-left :0;
}

/*.lista .titulo>a.desabilitado,
.lista .titulo>ul.opcoes>li.desabilitado{
    cursor: no-drop;
    opacity: .5;
    pointer-events: none;
}*/


.lista .titulo>a.invisivel:before,
.lista .titulo>ul.opcoes>li.invisivel:before,
.lista .titulo>ul.opcoes>li.desabilitado:before{
    visibility: hidden;
}
.lista .titulo>a.invisivel>i,
.lista .titulo>ul.opcoes>li.invisivel>i,
.lista .titulo>ul.opcoes>li.desabilitado>i{
    font-size: 0;
}
.lista .dados{
    flex: 1;
    display: table;
    border-collapse: collapse;
    background: #fff;
    padding: 30px 0;
    font-size: 15px;
    table-layout: fixed;
    width: 100%;
    cursor: default;
    /**/
}
.lista .dados>section.cabecalho{
    display: table-header-group;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.lista .dados>section.cabecalho>ol{
    font-weight: 600;
}
.lista .dados>section.cabecalho>ol>li{
    white-space: nowrap;    
    position: relative;
    padding-right: 0;
}
.lista .dados>section.cabecalho>ol>li>span{   
    white-space: nowrap;
    position: relative;

    --cinza:#dadada;
    --cinzaEscuro:#3d3d3d;
}
.lista .dados>section.cabecalho>ol>li>span:before,
.lista .dados>section.cabecalho>ol>li>span:after{
    position: absolute;
    border:4px solid transparent;
    white-space: nowrap;
    top: 5px;
    right: 0;
    visibility: hidden;
}
.lista .dados>section.cabecalho>ol>li>span:after{
    border-top-color: var(--cinza);
}
.lista .dados>section.cabecalho>ol>li>span:before{
    border-bottom-color: var(--cinza);
    right: 6px;
}
.lista .dados>section.cabecalho>ol>li>span:hover:before,
.lista .dados>section.cabecalho>ol>li>span:hover:after{   
    visibility: visible;
}
.lista .dados>section.cabecalho>ol>li.ordenando>span:before,
.lista .dados>section.cabecalho>ol>li.ordenando>span:after{
    visibility: visible;   
}
.lista .dados>section.cabecalho>ol>li.ordenando.asc>span:before{
    border-bottom-color: var(--cinzaEscuro);
}
.lista .dados>section.cabecalho>ol>li.ordenando.desc>span:after{
    border-top-color: var(--cinzaEscuro);
}
.lista .dados>section.conteudo{
    display: table-row-group;
}
.lista .dados>section>ol{
    display: table-row;
    transform: scale(1);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    position: relative;

    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.lista .dados>section>ol:before{
    /*    content: "";
        position: absolute;
        left: 0;
        background: var(--azul-escuro);
        width: 0;
        bottom: 0;
        top: 0;
        display: none;
    
        -o-transition: width 100ms ease-in-out;
        transition: width 100ms ease-in-out;  */
}
.lista .dados>section>ol>li{
    display: table-cell;
    height: 44px;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 0 20px;
    position: relative;

    border-bottom: 1px solid #eaeaea;
}
.lista .dados>section>ol>li.foto,
.lista .dados>section>ol>li.menuOpcoes{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    text-align: center;
    z-index: 1;
    display: none;   
}
.lista .dados>section>ol>li.foto{ 
    left: 13px;   
    width: 50px;
    height: 50px;
    background: #f1f1f1;
    border-radius: 50%;
    font-size: 19px;
    line-height: 47px;
    color: #ccc;
    border: 1px solid #e4e4e4;
}
.lista .dados>section>ol>li.foto:before{
    content: "\f030";
}
.lista .dados>section>ol>li.menuOpcoes{ 


    font-size: 0;
    line-height: 30px;
    color: #ccc;

    right: -5px;
    width: 20px;
}
.lista .dados>section>ol>li.menuOpcoes:before{
    content: "\f142";    
    font-size: 15px;
}
.lista .dados>section>ol>li.foto>img{
    position: absolute;
    top: 50%;
    left: 50%;
    min-height: 100%;
    min-width: 100%;
    transform: translate(-50%, -50%);
}
.lista .dados span.carregando{
    transform: translate(-50%, -50%) translateZ(0) scale(0);

    -webkit-transition-property: transform;
    -webkit-transition-duration: 200ms; 
    -webkit-transition-delay: 10ms;

    transition-duration: 200ms; 
    transition-property: transform;
    transition-delay: 10ms;

    --height: 50px;
    --width: 50px;
    --timeIn: 1.5s;
    --timeOut: 1.1s;
    --circle: 8px;
}
.lista .dados>section.conteudo>ol:hover{  
    background: var(--colorLineHover);
    border-left-color: var(--colorLineHover);
    border-right-color: var(--colorLineHover);
}
.lista .dados>section.conteudo>ol.selecionado{
    border-left-color: var(--azul-escuro);
    border-right-color: var(--colorLineSelected);
    background-color: var(--colorLineSelected);
}
.lista .rodape{
    border-radius: 0 0 var(--border) var(--border);
    background: #fff;
    height: auto;    
    min-height: 15px;   
    /*border-top: 1px solid #eaeaea;*/ 
    display: flex;
    align-items: center;
    padding: 0 30px;
}
.lista .rodape>small{
    font-size: 13px;
    color: #9a9a9a;
    width: 25%;
}
.lista .rodape>small:last-of-type{
    text-align: right;
}
.lista .rodape ul.paginacao{
    display: flex;
    justify-content: center;
    padding: 15px 0;
    flex: 1;
}
.lista .rodape ul.paginacao>li{
    min-width: 29px;
    height: 29px;
    border-radius: 18px;
    text-align: center;
    margin: 0 2px;
    background: #f7f7f7;
    cursor: pointer;
    color: var(--azul);
    line-height: 29px;
    font-size: 14px;
    font-weight: 600;
    padding: 0 10px;
}
.lista .rodape ul.paginacao>li.operante{
    background-color: var(--azul);
    color: #fff;
}
.lista .rodape ul.paginacao>li:not(.operante):hover{
    background-color: rgba(0,0,0,.1);
}

.lista.classificavel .dados>section.cabecalho>ol>li>span{
    padding-right: 20px;  
    cursor: pointer;
}
.lista.classificavel .dados>section.cabecalho>ol>li>span:before,
.lista.classificavel .dados>section.cabecalho>ol>li>span:after{
    content: "";
}

.lista.carregando .dados span.carregando{
    transform: translate(-50%, -50%) translateZ(0) scale(1);
}
.lista.carregando .dados>section.cabecalho{
    opacity: .5;
}
.lista.carregando .dados>section.conteudo{
    opacity: .3;
    cursor: progress;
}
.lista.carregando .titulo>ul.opcoes>li.atualizar>i:last-of-type{
    -webkit-animation: girar .8s infinite ease;
    animation: girar .8s infinite ease;
}

.lista.acrescentando .dados>section.conteudo{
    opacity: 1;
}
.lista.acrescentando .dados span.carregando{
    --borderWidth:0;
    --backgroundColor:#fff;
    --circle: 6px;
    --padding: 8px;
    --timeIn: 1.3s;
    --timeOut: 0.6s;
    top: auto;
    bottom: 0;
}

.lista.pesquisando>.titulo>h6{
    flex: none;
    font-size: 0;
    padding-left: 0;
}
.lista.pesquisando>.titulo>p.pesquisar{
    background-color: rgba(255,255,255,.2);
    /*z-index: 0;*/
    flex: 1;
}
.lista.pesquisando>.titulo>p.pesquisar>input{
    width: calc(100% - 63px);
}
.lista.pesquisando>.titulo>.pesquisar>i{
    z-index: 1;
}
.lista.pesquisando>.titulo>a.voltar{
    position: absolute;
    z-index: 1;
}

.lista.foco>.titulo{
    background-color: var(--azul-escuro);
}
.lista.foco .titulo>ul.opcoes>li:before{
    background: var(--azul);
}

.lista.maximizada{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 999999999;
    max-width: 100%;

    --border:0;
}
.lista.maximizada .titulo>a:before,
.lista.maximizada .titulo>ul.opcoes>li:before{ 
    top: 36px;
}

footer{
    position: relative;
    padding: 25px 0;
    text-align: center;
    font-size: 12px;
}
footer span{
    font-size: 11px;
    padding-top: 5px;
    display: block;
}

form.padrao{
    position: relative;
    overflow: hidden;
    border-spacing: 0;
    display: flex;
    flex-direction: column;
}
form.padrao ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #c5c5c5;
    opacity: 1; /* Firefox */
}
form.padrao :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #c5c5c5;
}
form.padrao ::-ms-input-placeholder { /* Microsoft Edge */
    color: #c5c5c5;
}

form.padrao section{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /*Adicionei para ajustar o "p.adicionar" ao centro*/

    align-items: center;
}
form.padrao section>p{
    flex: 1;
    margin-left: 15px;
}
form.padrao section>p:first-of-type{
    margin-left: 0;
}
form.padrao section[data-label]{
    padding-top: 17px;
}
form.padrao section[data-label]:before{
    content: attr(data-label);
    top: 6px;
    left: 0;
    position: absolute;
    font-size: 12px;
    color: #888888;
    font-weight: 500;     
}
form.padrao p{
    padding: 10px 0;
    position: relative;
    /*border:1px solid red;*/
    /*background: red;*/
}
form.padrao textarea + label,
form.padrao select + label,
form.padrao input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) + label{
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;

    color: #888888;        
    font: 500 16px 'Quicksand', sans-serif;
    white-space: nowrap; 
    /*Deixar o LEFT sem informar, para não atrapalhar se tiver padding*/
    /*left: 0;*/
    top: 29px;
    /* Não pode tirar, pois os input[checkbox] estão como absolute */
    position: absolute;
    transform: translateY(0);
    transform-origin: 0 0;    
    z-index: 0;    
}
form.padrao [required] + label:before{
    content: "\2217";
    color: red;
    float: left;
    margin: 2px 4px 0 0;
    font-size: 12px;
}
form.padrao input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]),
form.padrao select,
form.padrao textarea{    
    width: 100%;
    border:none;
    border-bottom: 2px solid #dcdcdc;
    display: block;
    padding: 0;
    font: 500 16px 'Quicksand', sans-serif;
    /*font: 400 15px Roboto,RobotoDraft,Helvetica,Arial,sans-serif;*/
    position: relative;
    color: #565656;    
    margin-top: 17px;
    resize: vertical;
    min-height: 26px;
    height: 26px;
    border-spacing: 0;
    background-color: transparent;
    z-index: 1;
}
form.padrao select{
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    /*margin: 0;*/
    text-indent:0;
    background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='21px' width='8px'><text x='0' y='15' fill='rgb(132, 132, 132)' font-size='16'>\25be</text></svg>") no-repeat center right;
    padding-right: 12px;
}
form.padrao input[type=radio] + label,
form.padrao input[type=checkbox] + label{
    /*background: red;*/
    display: block;
    font-size: 16px;
    padding-left: 22px;
    position: relative;
}
form.padrao input[type=checkbox] + label:before,
form.padrao input[type=radio] + label:before{
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;

    background-color: #fff;
    border: 1px solid #ccc;
    left: 0;
    top: calc(50% - 8px);
    cursor: pointer;
    z-index: 0;
    font-weight: 700;
    font-size: 12px;
    text-align: center;
    line-height: 13px;
    color: #fff;
}
form.padrao input[type=checkbox] + label:before{     
    border-radius: 2px;
}
form.padrao input[type=radio] + label:before{ 
    border-radius: 50%;
    font-size: 26px;
    color: var(--azul);
}
form.padrao input[type=checkbox]:hover + label:before,
form.padrao input[type=checkbox]:focus + label:before,
form.padrao input[type=radio]:hover + label:before,
form.padrao input[type=radio]:focus + label:before{
    border-color: var(--azul);
}
form.padrao input[type=checkbox]:checked + label:before{  
    background-color: var(--azul);
    border-color: var(--azul);
    content: "\2713";
}
form.padrao input[type=radio]:checked + label:before{    
    content: "\2022";
    border-color: var(--azul);
}
form.padrao input[type=radio] ,
form.padrao input[type=checkbox] {
    position: absolute;
    z-index: 1;
    opacity: 0;
    width: 100%;
    height: 19px;
    cursor: pointer;
}
form.padrao input[type=checkbox].preencher{
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}
form.padrao textarea:focus + label,
form.padrao select:focus + label,
form.padrao input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):focus + label,
form.padrao input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio])[placeholder] + label,
form.padrao textarea + label.fixo,
form.padrao textarea + label.informado,
form.padrao textarea[placeholder] + label,
form.padrao select + label.fixo,
form.padrao select + label.informado,
form.padrao input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) + label.fixo,
form.padrao input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) + label.informado{
    transform: scale(.75) translateY(-22px);   
}
form.padrao input:focus:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]),
form.padrao select:focus,
form.padrao textarea:focus{
    border-bottom-color: var(--azul);
    color: #1e1e1e;           
}
form.padrao input:focus:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):focus + label,
form.padrao select:focus + label,
form.padrao textarea:focus + label{
    color: var(--azul);        
}
form.padrao button, 
form.padrao input[type=submit], 
form.padrao input[type=reset], 
form.padrao input[type=button]{ 
    display: inline-block;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;  
    z-index: auto;
    width: auto;
    height: auto;
    position: static;
    cursor: pointer;
    opacity: 1;
    /*margin: 0;*/
    padding: 10px 15px;
    overflow: visible;
    border:none;
    border: 1px solid var(--azul);
    -webkit-border-radius: 4px;
    border-radius: 3px;
    font:700 13px  'Quicksand', sans-serif;
    color: rgba(255,255,255,0.9);
    -o-text-overflow: clip;
    text-overflow: clip;
    /*    background: rgb(0,102,176);*/
    background: var(--azul);
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
    text-shadow: -1px 0px 0 rgba(6, 6, 6, 0.17);
    -webkit-transform: none;
    transform: none;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
    box-sizing: border-box;
}
form.padrao input[type=reset]{
    background: #ffffff;
    color: #3d3d3d;
    text-shadow: none;
    border: 1px solid #f9f9f9;
}
form.padrao input[type=date]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    display: none;
}
form.padrao input[type=date]{
    resize: none !important;
}


/*input[type="date"]:after {
    content: "\25BC"; 
    color: #555;
    padding: 0 5px;
}*/

/* change color of symbol on hover */
/*input[type="date"]:hover:after {
    color: #bf1400;
}*/

/* make the native arrow invisible and stretch it over the whole field so you can click anywhere in the input field to trigger the native datepicker*/
input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
    color: transparent;
    background: transparent;
}

/* adjust increase/decrease button */
input[type="date"]::-webkit-inner-spin-button {
    z-index: 1;
}

/* adjust clear button */
input[type="date"]::-webkit-clear-button {
    z-index: 1;
}

form.padrao section + hr,
form.padrao p + hr,
form.padrao hr + section,
form.padrao hr + p{
    margin-top: 13px;
}

form.padrao hr{
    border: none;
    border-bottom: 1px solid #e8e8e8;
    height: 21px;
    overflow: visible;
}
form.padrao hr:before{
    content: attr(title);
    color: var(--azul);
    font-size: 14px;
    font-weight: 600;
    float: left;
    border-bottom: 3px solid var(--azul);
    text-transform: uppercase;
}

form.padrao p.Botao{    
    text-align: right;
}
ol.itens,
form.padrao p.Cursos .ListaCursos{
    display: block;
    overflow: auto;
    /*border: 1px solid #b3b3b3;*/
    clear: both;
    /*padding: 8px;*/
    height: auto;
    background: #ffffff;
    margin: 10px 0 0 0;
    /*min-height: 45px;*/
    list-style: none;
}
ol.itens>li,
form.padrao p.Cursos .ListaCursos span.Curso{
    float: left;
    margin: 1px 2px;
    background: var(--azul);
    padding: 3px 10px;
    cursor: default;
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    border-radius: 14px;
    line-height: 19px;
}
ol.itens>li>a,
form.padrao p.Cursos .ListaCursos span.Curso dfn{
    float: right;
    width: 19px;
    height: 19px;
    margin: 0px -7px 0 5px;
    cursor: pointer;
    border-radius: 50%;
    text-align: center;
    line-height: 17px;
    font-size: 19px;
    color: #fff;
}
ol.itens>li>a:hover,
form.padrao p.Cursos .ListaCursos span.Curso dfn:hover{
    background: rgba(255,255,255,.2);
}
ol.itens>li>a:before,
form.padrao p.Cursos .ListaCursos span.Curso dfn:before{
    content: "×";
    font-style: normal;
}
form.padrao p.Cursos .ListaCursos + ul{
    position: absolute;
    width: 100%;
    border: 1px solid var(--azul);
    top: 63px;
    z-index: 9;
    height: auto;
    background: #ffffff;
    display: none;
}
form.padrao p.Cursos .ListaCursos + ul li{
    padding: 1px 5px;
    margin: 1px;
    border:1px solid #ffffff;
    cursor: pointer;
    display: block;
    border-bottom: 1px solid #dddddd;
    font-size: 14px;
}
form.padrao p.Cursos .ListaCursos + ul li:last-of-type{
    border-bottom-color: #ffffff;
}
form.padrao p.Cursos .ListaCursos + ul li:hover{
    background: #f9fdff;
    border:1px solid #b6d3e5;
}
form.padrao p.Cursos .ListaCursos + ul li.Listando{
    background: url("../../Imagens/Carregando5.gif") no-repeat center center;
    height: 20px;    
    border: none;
}

form.padrao p.iconeAcao{
    /*    flex: none;    
        margin-left: 10px;*/
    flex: none;
    border-radius: 50%;
    height: 30px;
    text-align: center;
    margin: 13px 0 0 0;
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--azul-escuro);
}
form.padrao p.iconeAcao:hover{   
    color: var(--azul);
    background: #f7f7f7;
}
form.padrao p.iconeAcao i{
    font-size: 15px;
    margin: 0;
}


form.padrao.filtroSobreLista{
    overflow: hidden;
    position: absolute;
    z-index: 1;
}
form.padrao.filtroSobreLista p.selecao{
    padding-right: 15px;
}
form.padrao.filtroSobreLista p.selecao:after{
    content: "";
    border: 4px solid transparent;
    border-top-color: #fff;
    float: right;
    margin: 2px 0 0 0;
    position: absolute;
    right: 0;
    bottom: 6px;
}
form.padrao.filtroSobreLista input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]), 
form.padrao.filtroSobreLista select, 
form.padrao.filtroSobreLista textarea{
    border-bottom: none;
    color: #fff;
    font-size: 15px;
    background: none;
}
form.padrao.filtroSobreLista p select option{
    color: var(--azul-escuro);
}
form.padrao.filtroSobreLista p input:not([type=button]):not([type=reset]):not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) + label,
form.padrao.filtroSobreLista p select + label{
    top: 20px;
    color: rgba(255,255,255,.8);
}

#conteudo form.FormLocked{
    opacity: .7;
    cursor: default;
    pointer-events: none;
}

/* Mante-los para não ter tanto trabalho, apenas alterando o layout */


.ListaArquivos ul{
    display: flex;
    flex-wrap: wrap;
}
.ListaArquivos ul>li{
    min-width: 130px;
    min-height: 48px;
    padding: 5px 9px 5px 40px;
    height: auto;
    overflow: hidden;
    border: 1px solid #f3f3f3;
    margin: 0 5px 5px 0;
    position: relative;
    background: #f9f9f9;
    color: #0c0c0c;
    font-weight: 500;
    font-size: 14px;

}
.ListaArquivos ul>li:hover{
    background: #f9f9f9;
    border:1px solid #e6e6e6;
    text-decoration: none;    
}
.ListaArquivos ul>li>a{
    position: absolute;
    left: 8px;
}
.ListaArquivos ul>li>a:before{
    font-weight: 900;
    font-size: 33px;
    font-family: "Font Awesome 5 Pro";
    margin: 0 10px 0 0;
    content: "\f56c";
    color: var(--vermelho-pdf);
}

.ListaArquivos ul>li>img{
    position: absolute;
    left: 0;
    top: 0;
}
.ListaArquivos ul>li>span{
    display: block;
    padding: 0;
    font-size: 12px;
    white-space: nowrap;
}
.ListaArquivos ul>li>span>a{
    padding: 0 7px 0 0;    
    border-right: 1px solid #cccccc;
    margin-right: 7px;
    display: inline-block;  
}
.ListaArquivos ul>li>span>a:hover{
    text-decoration: underline;
    color: var(--azul-escuro);
}
.ListaArquivos ul>li>span>a:last-of-type{
    border-right: none;
}

/* Precisa ser na RAIZ pois algumas mensagens estão dentro do formulário*/
body>#MensagemFormulario{
    border: 1px solid #bdb87a;
    font-weight: normal;
    background: #fbf8c4;
    font-size: 16px;
    color: #3d3d3d;
    position: fixed;
    bottom: 90px;
    font-size: 15px;
    text-align: center;
    z-index: 999;
    padding: 5px 5px 5px 13px;
    font-weight: 500;
    margin: 0 auto;
    transform: translate(-50%, 0);
    left: 50%;
    border-radius: 15px;
    visibility: hidden;
}
body>#MensagemFormulario dfn{
    float: left;
    width: 20px;
    height: 20px;
    margin: 1px 9px;
    display: none;
}
body>#MensagemFormulario.Erro dfn{
    width: 18px;
    background-position: 0 -107px;
}
body>#MensagemFormulario.Alerta dfn{
    background-position: -21px -107px;
}
body>#MensagemFormulario.OK dfn{
    /*background-position: -41px -107px;*/
}
body>#MensagemFormulario.OK{
    background-color: #464646;
    border-color: #464646;
    color: #fff;
}
body>#MensagemFormulario.visivel{
    visibility: visible;
}
body>#MensagemFormulario.Carregando dfn{
    background: url("../../Imagens/MensagemCarregando.gif") no-repeat center center;
}
body>#MensagemFormulario dfn.Fechar{
    float: right;
    cursor: pointer;
    margin: 0px 0px 0px 5px;
    width: 20px;
    height: 20px;
    background-position: -62px -106px;
    display: block;
    font-style: normal;
    background: #e6e183;
    text-align: center;
    line-height: 16px;
    border-radius: 50%;
    font-size: 21px;
    padding: 0;
}
body>#MensagemFormulario dfn.Fechar:after{
    content: "×";    
}
body>#MensagemFormulario.OK dfn.Fechar{
    background: #6d6d6d;
}

#conteudo .bloco{
    border-radius: 20px;
    background-color: #fff;    
    position: relative;
    overflow: hidden;
    box-shadow: 2px 2px 4px 0px rgba(0,0,0,.1);    
}
#conteudo h1{
    padding-bottom: 40px;
    text-transform: uppercase;
    font-size: 18px;
}
#conteudo h1>span>u,
#conteudo h1>u{
    font-style: normal;
    border-bottom: 3px solid var(--azul);
    text-decoration: none;
    padding-bottom: 2px;
}
#conteudo #MensagemFormulario{
    border: 1px solid #bdb87a;
    padding:6px 0;
    font-weight: normal;
    background:#fbf8c4;
    font-size: 16px;
    color: #3d3d3d;
    border-radius: 5px;
    /*margin: 20px auto -17px auto;*/
    /*display: none;*/
    clear: both;
}

.Bloco{
    display: inline-block;    
    font-size: 14px;
}
.Bloco > h2{
    /*    font-size: 12px;
        text-shadow: 0px 0px 1px #ffffff;
        padding: 5px;
        text-align: center;
        background: url("../../Imagens/jQuery.Flexigrid/wbg.gif") repeat-x 0 -1px;
        border-bottom:  1px solid #cccccc;
        color: #484848;*/

    text-transform: uppercase;
    font-size: 13px;
    text-align: left;
    background-color: #fff;
    padding: 0 0 25px 0;
    color: var(--azul);

    /*    
        text-shadow: 0px 0px 1px #ffffff;
        padding: 11px;
        text-align: center;
        background: var(--azul);
        color: #fff;
        text-transform: uppercase;*/
}
.Bloco > .Conteudo{
    padding: 0;
    overflow: hidden;
    position: relative;
    background: #ffffff;
    display: table;
}
.Bloco > .Conteudo > p{
    display: table-row;
    padding: 2px 0;   
}
.Bloco > .Conteudo > p>*{
    display: table-cell;
}
.Bloco > .Conteudo > p > span{
    /*white-space: pre-wrap;*/
    vertical-align: top;
    /*   
        overflow: hidden;
        text-overflow: ellipsis;*/
}
.Bloco > .Conteudo > p > strong{
    padding-right: 20px;    
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 1%;
}
.Bloco > .Conteudo > p > strong:before{
    content: ":";
    float: right;
    margin-right: -12px;

}
.Bloco > .Conteudo p.Separacao{
    border-top: 1px dotted #b6b6b6;
    padding-top: 6px;
    margin: 20px 0 0 0;
}
.Bloco > p strong{
    text-align: right;
    float: left;
}
.Bloco > p > span{
    float: left;
    padding: 0 0 0 8px;
}
.Bloco p span .NaoInformada{
    font-style: normal;
    color: #9e9e9e;
}
.Bloco .FormularioPadrao{
    /*font-family: Calibri, Arial;*/
}
.Bloco .FormularioPadrao .Botao .Button{
    float: right;
}
.Bloco .Conteudo .FormularioInterno{
    position: absolute;
    width: 100%;
    height: 100%;
    background: url("../Imagens/TravaBrancaForte.png");
    z-index: 9999;
    visibility: hidden;
}
.Bloco .Conteudo .FormularioInterno form{
    display: block;
}
.Bloco .Conteudo .FormularioInterno form label{
    font-size: 13px;
    display: block;
    font-weight: bold;
    color: #4a4a4a;
    padding: 0 0 2px 0;
}
.Bloco .Conteudo .FormularioInterno form p{
    overflow: hidden;
    padding: 1px 0;
}
.Bloco .Conteudo .FormularioInterno form p.Botoes{
    padding: 5px 0 0 0;
}
.Bloco .Conteudo .FormularioInterno.Ativo{
    visibility: visible;
}

#conteudo .ListaPadraoEstudantes{
    overflow: auto;
    height: 411px;
    width: 430px;
}
#conteudo .ListaPadraoEstudantes .Estudante{
    /*border-radius: 3px;*/
    /*margin: 0 2px;*/
    cursor: pointer;
    overflow: hidden;
    /*padding: 2px;*/
    /*border:1px solid #ffffff;*/
    display: flex;
    padding: 0 0 0 15px;
    align-items: center;
    position: relative;
}
#conteudo .ListaPadraoEstudantes .Estudante:hover {
    background: #f8f8f8;

}
#conteudo .ListaPadraoEstudantes .Estudante .Dados{
    overflow: hidden;
    padding: 15px 15px 15px 0;
    border-bottom:1px solid #eaeaea;
    flex: 1;
    margin-left: 15px;
}
#conteudo .ListaPadraoEstudantes .Estudante .Dados span{
    color: #909090;
    font-size: 12px;
    /*font-family: Arial;*/
    display: block;
    white-space: nowrap;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
    padding: 0;
}
#conteudo .ListaPadraoEstudantes .Estudante span.FotoPerfil{
    border-radius: 50%;
    overflow: hidden;   
    height: 55px;
    width: 55px;
}
#conteudo .ListaPadraoEstudantes .Estudante span.FotoPerfil span{
    height: 55px;
    width: 55px;

    /*border:1px solid #b6d3e5;*/

}
#conteudo .ListaPadraoEstudantes .Estudante .Dados span.Nome{
    color: #4a4a4a;
    font-size: 15px;
    padding: 0 0 3px 0;
    font-weight: 500;
}
#conteudo .ListaPadraoEstudantes .Estudante .Dados span.Email{
    background: url(../Imagens/Email.png) no-repeat left 9px;
    padding: 5px 0 0 15px;
    color: var(--azul);
}
#conteudo .ListaPadraoEstudantes .Carregando{
    background: url("../Imagens/Carregando.gif") no-repeat center center;
    height: 35px;
}

.TelaFlutuante{
    z-index: 100;
    /*background: url("../Imagens/TravaBranca.png");*/
    /*background: rgba(255,255,255,.7);*/
    position: absolute;

    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    display: none;
    justify-content: center;
    align-items: center;
    cursor: no-drop;
}
.TelaFlutuante .Bloco{
    text-align: left;
    box-shadow: 1px 1px 4px #9e9e9e;
    float: none;
    padding: 0;
    cursor: default;
    border:none;
    border-radius: 10px 10px 0 0;    
    /*border: 1px solid #cccccc;*/
}
.TelaFlutuante .Bloco .Conteudo{
    padding: 0;
}
.TelaFlutuante .Bloco > h2{
    cursor: move;    
    border-radius: 10px 10px 0 0;

    /*font-size: 13px;*/
    text-shadow: 0px 0px 1px #ffffff;
    padding: 11px;
    background: var(--azul);
    color: #fff;
}
.TelaFlutuante .Bloco > img.Fechar{
    float: right;
    cursor: pointer;
    margin: -13px -13px 0 0;
}
.TelaFlutuante .Bloco > a.fechar{
    position: absolute;
    right: 3px;
    top: 5px;
    border-radius: 50%;

    width: 28px;
    height: 28px;
    line-height: 24px;
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    color: #fff;
}
.TelaFlutuante .Bloco > a.fechar:hover{
    background-color: rgba(255,255,255,.1);
}
.TelaFlutuante form{
    padding: 25px 40px 90px 40px;
}
.TelaFlutuante form p.Botao{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #f7f7f7;
    padding: 10px;
    border-top: 1px solid #dedede;
}
.TelaFlutuante form p.Botao input[type=reset]{
    float: left;
}

.TelaFlutuante.Pessoas .Bloco > .Conteudo{   
    display: block;
}
.TelaFlutuante.Pessoas form{
    padding: 9px;
    background: #f1f1f1;
    border-bottom: 1px solid #dedede;
}
.TelaFlutuante.Pessoas form input[type=search]{
    width: 100%;
    border: 1px solid #dadada;
    line-height: 23px;
    text-indent: 8px;
}
.TelaFlutuante.Pessoas .Resultado{
    background: #f1f1f1;
    border-top: 1px solid gainsboro;
    padding: 10px 15px;
    font-size: 12px;
    font-weight: 400;
}

.TelaFlutuante.notificacoes{
    --altura-abas:60px;
}
.TelaFlutuante.notificacoes .Conteudo{
    display: block;
    width: 355px;
}
.TelaFlutuante.notificacoes ul.abas{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background: #0087b4;
    color: #fff;
    font-size: 30px;   
}
.TelaFlutuante.notificacoes ul.abas>li{    
    height: var(--altura-abas);
    flex: 1;
    text-align: center;
    padding: 10px 0;
    opacity: .7;    
    border-bottom: 3px solid transparent;
    cursor: pointer;
    position: relative;
}
.TelaFlutuante.notificacoes ul.abas>li.operante{
    border-bottom-color: #fff;
    opacity: 1;
}
.TelaFlutuante.notificacoes ul.abas>li + li{
    margin-left: 10px;
}
.TelaFlutuante.notificacoes ul.abas>li[data-novidades]:before{
    content: attr(data-novidades);
    position: absolute;
    border-radius: 10px;
    min-width: 16px;
    height: 16px;
    background: #d64141;
    font-size: 11px;
    font-weight: 700;
    padding: 0;
    text-align: center;
    line-height: 16px;
    right: 28px;
    top: 9px;
}
.TelaFlutuante.notificacoes nav{
    display: none;
    height: 419px;
    overflow: auto;
    position: relative;
}
.TelaFlutuante.notificacoes nav>a{

    --background:#fff;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
    color: #777777;
    background-color: var(--background);
    position: relative;
}
.TelaFlutuante.notificacoes nav>a:hover{
    --background: #f8f8f8;
}
.TelaFlutuante.notificacoes nav>a .FotoPerfil{
    border-radius: 50%;
    overflow: hidden;
    width: 55px;
    height: 55px;
    position: relative;
    margin: 0 15px;
}
.TelaFlutuante.notificacoes nav>a>.dados{
    flex: 1;
    padding: 20px 15px 20px 0;
    border-bottom: 1px solid #e4e4e4;
}
.TelaFlutuante.notificacoes nav>a>.dados .acao{
    display: block;
    font-size: 11px;
    color: var(--azul);
    padding: 6px 0 0 0;
}
.TelaFlutuante.notificacoes nav .nadaEncontrado{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.TelaFlutuante.notificacoes nav .nadaEncontrado>*{
    cursor: pointer;
}
.TelaFlutuante.notificacoes nav .nadaEncontrado>i{
    font-size: 35px;
    color: #cecece;
}
.TelaFlutuante.notificacoes nav .nadaEncontrado>b{
    padding: 15px 0 4px 0;
    font-size: 15px;
}
.TelaFlutuante.notificacoes nav .nadaEncontrado>small{
    font-size: 13px;
    color: var(--azul);
}
.TelaFlutuante.notificacoes nav .nadaEncontrado>small>i{
    font-size: 11px;
    margin-right: 5px;
}
.TelaFlutuante.notificacoes nav.operante{
    display: block;
}
.TelaFlutuante.notificacoes .Carregando{
    background: url(../Imagens/Carregando.gif) no-repeat center center;
    height: 80px;
}
.TelaFlutuante.notificacoes nav span.carregando{
    --borderWidth: 0;
    --backgroundColor: #fff;
    --circle: 5px;
    --padding: 7px;
    --timeIn: 1.2s;
    --timeOut: .2s;
}
.TelaFlutuante.notificacoes nav>a.novo{
    --background:#fffef0;
}
.TelaFlutuante.notificacoes nav>a.novo:before{
    content: "";
    width: 9px;
    height: 9px;
    background: #d64141;
    position: absolute;
    border: 3px solid var(--background);
    z-index: 1;
    border-radius: 50%;
    left: 57px;
    top: 57px;
}
.TelaFlutuante.notificacoes nav>a:last-of-type>.dados{
    border-bottom: none;
}

.TelaFlutuante.Ativa{
    display: flex;
}
.TelaFlutuante.telaInteira{
    background: rgba(0,0,0,.3);
    z-index: 999999;
    left: 0;
}
/*Opções da tela de estudante*/
#conteudo #TodasEscolas.Ativa ~ .pagina,
#conteudo #TodasEmpresas.Ativa ~ .pagina,
.TelaFlutuante.notificacoes.Ativa ~ #conteudo,
.TelaFlutuante.notificacoes.Ativa ~ footer,
.TelaFlutuante.notificacoes.Ativa ~ #menuLateral,
/* Opção para todos*/
.TelaFlutuante.Ativa ~ .pagina,

/* Tela de entrada de dados*/
.TelaFlutuante.entrada ~ #conteudo>.pagina,
.TelaFlutuante.entrada ~ #menuLateral{
    opacity: .4;
    filter: blur(2px);
}


.TelaFlutuante.entrada{
    z-index: 9999;
    left: 0;
    position: fixed;
}
.TelaFlutuante.entrada .Bloco{
    position: relative;
}
.TelaFlutuante.entrada form.padrao{
    width: 320px;
    padding: 15px 25px 75px 25px;
}
.TelaFlutuante.entrada form.padrao p{
    width: 100%;
}
.TelaFlutuante.entrada form.padrao p textarea{
    height: 150px;
    resize: none;
}

.TelaFlutuante.entrada ~ #conteudo .TelaFlutuante{
    filter:blur(1px);
    opacity: .9;
}


#Download{
    display: none;
}

@media screen and (max-width: 600px) {

    a,button,input, li, p, i{
        -webkit-tap-highlight-color: transparent;
        outline: none !important;
    }

    .lista.carregando{
        box-shadow: none;
    }
    .lista.carregando:not(.acrescentando) .dados {
        background: transparent;
    }


    *[data-title]:hover:before{
        display: none;
    }

    #MensagemFormulario{
        /*        bottom: 10px;
                right: 10px;
                left: 10px;
                font-size: 13px;
                top:auto;
                border-radius: 20px;   */
    }

    form.padrao section:not(.mobile){
        flex-direction: column;
    }
    #conteudo form.padrao section:not(.mobile)>p,
    form.padrao section:not(.mobile)>p{
        margin-left: 0;
        width: 100%;
    }
    form.padrao p.Botao{
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #f7f7f7;
        padding: 10px;
        z-index: 99;        
        border-top: 1px solid #dedede;
    }

    a.botaoFlutuante{
        display: block;
    }
    a.botaoFlutuante:hover{
        background-color: var(--azul);
    }

    /* Deixar o espaço no rodapé da lista para o botão*/
    a.botaoFlutuante.cadastrar + .lista .dados>section.conteudo{        
        padding-bottom: 105px;
    }

    /* Esconde o botão cadastrar, que sempre será o primeiro da grid, já que tem o "flutuante"*/
    a.botaoFlutuante.cadastrar + .lista ul.opcoes li:first-of-type{
        display: none;
    }

    #menuCelular.visivel{
        visibility: visible;
    }

    header{
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        padding-left: 15px;
        background-color: var(--azul);
        border-bottom-color: var(--azul);
        z-index: 9;
        box-shadow: none;
        display: none;

        --larguraMenu: 80%;
    }
    header .opcoes{
        background-color: rgba(0,0,0,0.1);
        color: #fff;
    }
    header .opcoes.notificacoes:not(.novidades):hover{
        background: rgba(0,0,0,0.2);
    }
    header .opcoes.menu{
        background-color: var(--azul);
        color: #fff;
        display: block;
    }
    header>a.logo{
        flex: 1;
        background:  url("../../Imagens/IAE/LogoAdmin.png") no-repeat center left;

    }
    header>.menuItens{
        display: none;
    }
    header>.usuario{
        display: none;
    }

    @media screen and (max-width: 350px) {
        header>a.logo{
            background-size: contain;   
        }
    }

    #conteudo{
        padding-top: 0;
    }
    #conteudo .pagina{
        max-width: inherit;
        min-width: 0;
        width: 100%;
        min-height: 100%;
        display: flex;
        flex-direction: column;
        /*padding-top:0;*/
        padding-top: var(--topo-mobile);
        position: absolute;
    }
    #conteudo .pagina>h1{
        /*padding-bottom: 0;*/
        height: var(--topo-mobile);
        background: var(--azul);
        display: flex;
        align-items: center;
        color: #fff;
        font-size: 14px;
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 99999999;
        padding: 0 5px;
    }
    #conteudo .pagina>h1 u {
        font-style: normal;
        border-bottom: none;
        padding-bottom: 0;   
    }
    #conteudo .pagina>h1>span{
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 0 5px;
    }
    #conteudo .pagina>h1>a.mobile{
        display: block;
    }

    .TelaFlutuante,
    .TelaFlutuante .Bloco{
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        background-color: #fff;
        width: 100%;
        /*display: flex;*/
    }
    .TelaFlutuante .Bloco > h2{
        line-height: 50px;
        cursor:default;    
        border-radius: 0;
        padding: 0;
        font-size: 14px;
    }
    .TelaFlutuante .Bloco > a.fechar{
        font-size: 0;
        left: 5px;
        line-height: 28px;
        top: 11px;
    }
    .TelaFlutuante .Bloco > a.fechar:before{
        content: "\f060";
        font-size: 16px;
        font-family: "Font Awesome 5 Pro";
        font-weight: 900;
    }
    .TelaFlutuante .Bloco > a.fechar + h2{
        padding-left: 38px;
    }    

    .TelaFlutuante.Ativa ~ .pagina,
    .TelaFlutuante.notificacoes.Ativa ~ #conteudo,
    .TelaFlutuante.notificacoes.Ativa ~ footer,
    #TodasEscolas.Ativa ~ .pagina,
    #TodasEmpresas.Ativa ~ .pagina
    {
        display: none !important;
    }
    .TelaFlutuante .Bloco .Conteudo{
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        top: 50px;
        overflow: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    .TelaFlutuante form {
        min-height: 100%;
        padding-bottom: 85px;
        display: flex;
        /*border-color: #e6e6e6;*/
    }
    .TelaFlutuante form p.Cursos{
        flex: 1;
    }
    .TelaFlutuante form .ListaCursos{
        padding: 0;
        border: none;
        overflow: hidden;
        height: auto;

    }
    .TelaFlutuante.notificacoes ul.abas{
        position: fixed;
        z-index: 2;
    }
    .TelaFlutuante.notificacoes .Conteudo{        
        width: auto;
    }
    .TelaFlutuante.notificacoes nav{
        margin-top: var(--altura-abas);
        /*min-height: calc(100% - var(--altura-abas));*/
        height: calc(100% - var(--altura-abas));
        /*overflow: hidden;*/
    }

    #conteudo .TelaFlutuante.Pessoas .Bloco > .Conteudo{
        display: flex;
        overflow: hidden;
    }

    #conteudo .TelaFlutuante.Pessoas .Bloco > .Conteudo .ListaPadraoEstudantes{
        height: auto;
        flex: 1;
        overflow: auto;
    }
    #conteudo .TelaFlutuante.Pessoas form{
        min-height: 0;
    }
    /*    #conteudo .TelaFlutuante.Pessoas .Bloco{
            top: 0;
        }*/

    header .opcoes.notificacoes:after{
        border-radius: 50%;
        width: 10px;
        height: 10px;
        border: none;
        top: 1px;
        right: 1px;
    }

    nav#menuLateral{
        flex-direction: column;
        bottom: auto;
        /*box-shadow: 2px 2px 1px rgba(0,0,0,.7);*/
        padding: 0;
        left: auto;
        right: 10px;
        margin-top: calc(var(--topo-mobile) - 5px);
        width: auto;
        z-index: 999999999;
        display: none;
    }
    nav#menuLateral:before{
        content: "";
        background: rgba(0,0,0,.5);
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        z-index: -1;
        cursor: no-drop;
    }
    nav#menuLateral>a.principal{
        display: none;
    }
    nav#menuLateral>a{
        color: #3d3d3d;
        padding:20px 25px;
        background: #fff;
    }
    nav#menuLateral>a:before {
        margin: 0 15px 0 0;
        color: #adadad;
    }
    nav#menuLateral ~ #conteudo,
    nav#menuLateral ~  footer,
    nav#menuLateral ~ #MensagemFormulario{
        margin-left: 0;
    }
    nav#menuLateral>a.inativo{
        opacity: 1;
        color: #c1c1c1;
    }


    nav#menuLateral.visivel{        
        display: flex;
    }
    nav#menuLateral.visivel ~ #conteudo,
    nav#menuLateral.visivel ~  footer,
    nav#menuLateral.visivel ~ #MensagemFormulario{
        filter: blur(1px);
    }

    footer{
        display: none;
        /*        font-size: 10px;
                position: absolute;*/
    }
    footer span{
        /*        font-size: 9px;
                padding-top: 1px;*/
    }

    .lista{
        border-radius:0;
        flex: 1;
        background: #fff;
    }
    .lista .titulo{
        border-radius: 0;
    }
    .lista .titulo>ul.opcoes>li:before{
        /*top: 36px;*/
        display: none;
    }
    .lista .dados{
        display: block;
        /*background: red;*/
        padding: 0;
        /*table-layout: initial;*/
        /*width: auto;*/
    }
    .lista .dados span.carregando{
        position: fixed;
    }
    .lista .dados>section.cabecalho{
        display: none;
    }
    .lista .dados>section.conteudo{
        display: flex;
        flex-direction: column;
    }
    .lista .dados>section>ol{
        display: flex;
        flex-direction: column;
        position: relative;
        padding: 13px 0;
        border-left-width: 5px;
        border-right-width: 5px;
        min-height: 85px;
        justify-content: center;
        border-bottom: 1px solid #eaeaea;
    }    
    .lista .dados>section.conteudo>ol:hover{   
        border-left-color: var(--azul-escuro);    
    }
    .lista .dados>section>ol>li{
        padding: 0;
        display: block;
        line-height: initial;
        height: auto;
        border: none;
    }
    .lista .dados>section>ol>li.menuOpcoes{
        display: block;
    }
    .lista .dados>section>ol>li.foto{
        display: block;
    }
    .lista .dados>section>ol>li.foto ~ li{
        padding-left: 80px;
    }
    .lista .dados>section>ol>li.menuOpcoes ~ li:not(.foto){
        /*Espaço para o menu de opções*/
        width: calc(100% - 13px);
    }
    .lista .dados>section>ol>li.principal{
        font-weight: 600;
        font-size: 16px;
    }
    .lista .dados>section>ol>li:first-of-type, .lista .dados>section>ol>li:last-of-type {
        padding: 0;
    }
    .lista .rodape{
        border-radius: 0;
        display: none;
    }

    #conteudo.listaMobile .pagina{
        padding-top: 0;
    }
    #conteudo.listaMobile .pagina>h1{
        display: none;
    }
    #conteudo.listaMobile .pagina .lista .titulo{
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 99999;
    }
    #conteudo.listaMobile .pagina .lista .dados{
        padding-top: 50px;
    }
}
