﻿
.divScroll {
    overflow: auto; 
    height: 180px; 
    padding: 8px;
}

@font-face {
    font-family: 'systa-web-symbols';
    src: url('../../App_WebFonts/Fontello/Font/systa-web-symbols.eot?40317487');
    src: url('../../App_WebFonts/Fontello/Font/systa-web-symbols.eot?40317487#iefix') format('embedded-opentype'), url('../../App_WebFonts/Fontello/Font/systa-web-symbols.woff?40317487') format('woff'), url('../../App_WebFonts/Fontello/Font/systa-web-symbols.ttf?40317487') format('truetype'), url('../../App_WebFonts/Fontello/Font/systa-web-symbols.svg?40317487#systa-web-symbols') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* HTML */

body {
    margin: 0 auto;
    background-color: #F5F5F6;
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 20px;
    font-weight: 500;
    color: #2A3046;
}

p {
    font-weight: 500;
    font-size: 20px;
}

h1 {
    margin: 0;
    font-weight: 500;
    font-size: 40px;
}

h2 {
    font-weight: 500;
    font-size: 20px;
    margin: 0;
}

h3 {
    margin: 0;
    font-weight: 500;
    font-size: 14px;
}

a:link, a:visited, a:active{
    color: #2A3046;
    text-decoration: none;
    transition: 0.25s;
}

a:hover{
    color: #2A3046;
    transition: 0.25s;
}

table {
    font-size: 20px;
}

hr {
    text-align: left;
    width: 100%;
    border-style: inset;
    border: solid 1px #2A3046;    
}

#divCaixas hr {
    border: solid 2px #2A3046;
}


/* CONTADOR DE CARACTERES*/

.tag {
    margin: 0;
    text-align: right;
    font-size: 14px;
}

/* ARQUIVOS */

.arquivoImagem {
    width: 96px;
    height: 96px;
    background-size: cover;
    border-radius: 64px;
    border: solid 2px #2A3046;
}

/* TABLELESS */
.tabela {
    width: 100%;
    display: block;
    text-align: left;
}

#tabelaCabecalho {
    background-color: #C8CCE6;
    text-align: center;
    text-shadow: none;
}

#tabelaCabecalho .tabelaCelula {
    border: solid 1px #F5F5F6;
}


#tabelaCabecalho .tabelaCelula p {
    font-weight: 700;
}

.tabelaLinha {
    display: block;
}

.tabelaCelula {
    display: block;
    padding: 5%;
    width: 95%;
    vertical-align: bottom;
}



/* LOGON */

#bgLogon {    
    background-image: url(../../midias/systa-logon-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

#divLogon {
    padding: 5%;
    color: #FFFFFF;
}

#divLogon h1 {
    font-weight: 300;
}

.logonCampoID {
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 18px;
    width: 50%;
    padding: 8px 12px 8px 12px;
    border: solid 1px #FFF;
    border-radius: 12px;
    transition: 0.2s;
}

.logonCampoSenha {
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 18px;
    width: 50%;
    padding: 8px 12px 8px 12px;
    border: solid 1px #FFF;
    border-radius: 12px;
    transition: 0.2s;
}

.logonBotao {
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 18px;
    padding: 8px 12px 8px 12px;
    background-color: #FFF;
    border: solid 1px #FFF;
    color: #2A3046;
    border-radius: 12px;
    margin-right: 8px;
    transition: 0.2s;
}

.logonBotao:hover {
    border-radius: 0;
    background-color: #2A3046;
    border: solid 1px #FFFFFF;
    color: #FFFFFF;
    cursor: pointer;
    transition: 0.2s;
}

.logonLogotipo {
    position: fixed;
    bottom: 16px;
    right: 16px;
}

.logonLogotipo img {
    height: 24px;
}



/* RODAPÉ */

#divRodape {
    width: 100%;
    padding: 16px 0 16px 0;
    background-color: #FFFFFF;
    position: relative;
}

#divRodape a {
    margin-right: 32px;
    border: solid 1px #FFFFFF;
    border-radius: 4px;
    padding: 8px;
    transition: 0.25s;
}

#divRodape a:hover {
    border: solid 1px #2A3046;
    transition: 0.25s;
}



/* DESENVOLVEDOR */

#divDesenvolvedor {
    padding: 0 16px 0 16px;
    margin: 16px 0 8px 0;
    text-align: center;
    font-size: 12px;
}

#divDesenvolvedor a {
    font-weight: 700;
}



/* PARALAX */

.divParallax {
    position: relative;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}



/* TOPO */

#divTopo {
    background: linear-gradient(90deg, rgba(42,48,70,1) 0%, rgba(125,104,171) 100%);
    /*background-image: url(../../midias/systa-topo-bg.jpg);
    background-size: cover;
    background-position: bottom center;*/
    padding: 16px 0 16px 0;
    text-align: center;
    color: #FFFFFF;
    width: 100%;
}

#divTopo a {
    color: #FFFFFF;
}

#divTopo img {
    padding-bottom: 4px;
}

#divTopo h2 {
    font-weight: 700;
    font-size: 36px;
}

#divTopo .botao {
    background-color: #FFF;
    border-color: #2A3046;
    color: #2A3046;
}

#divTopo .botao:hover {

}



/* GRID */

.divGrid {
    width: 90%;
    margin: 0 auto;
}



/* MENU AUXILIAR */

.menuAux {
    display: none;
}

.menuAux h2 {
}

.menuAux a.aMenuAux {
}

a.aMenuAux:link, a.aMenuAux:visited, a.aMenuAux:active {
}

a.aMenuAux:hover{
}



/* BANNER */

#divBanner {
    width: 100%;
    padding: 48px 0 48px 0;
    margin-bottom: 81px;
    background-color: #A1A1A1; 
    text-align: center;
    color: #2A3046;
}

#divBannerAtualizacoes {
    width: 100%;
    padding: 48px 0 48px 0;
    background: linear-gradient(90deg, rgba(81,106,176,1) 0%, rgba(238,72,153,1) 100%);
    text-align: center;
    color: #FFFFFF;
}



/* MENU */

.sm {
    box-sizing: border-box; 
    position: relative;
    z-index: 9999;
    /*-webkit-tap-highlight-color: rgba(0,0,0,0);*/
}

.sm, .sm ul, .sm li {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: normal;
    /*direction: ltr;*/
    text-align: left;
}

.sm-rtl, .sm-rtl ul,.sm-rtl li {
    direction: rtl;
    text-align: right;
}

.sm>li>h1, .sm>li>h2, .sm>li>h3, .sm>li>h4, .sm>li>h5, .sm>li>h6 {
    margin: 0;
    padding: 0;
}

.sm ul {
    display: none;
}

.sm li, .sm a {
    position: relative;
}

.sm a {
    display: block;
}

.sm a.disabled {
    cursor: default;
}

.sm::after {
    content: "";
    display: block; 
    height: 0;
    font: 0px/0 serif; 
    clear: both; 
    overflow: hidden;
}

.sm *, .sm *::before, .sm *::after {
    box-sizing: inherit;
}

.sm-menu {
  background: transparent;
  /*border-radius: 8px;*/
  /*box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);*/
}

    .sm-menu a, .sm-menu a:hover, .sm-menu a:focus, .sm-menu a:active {
        padding: 10px 20px;
        /* make room for the toggle button (sub indicator) */
        padding-right: 58px;
        background-image: linear-gradient(to bottom, #F5F5F6, #A1A1A1);
        color: #2A3046;
        /*font-family: "PT Sans Narrow", "Arial Narrow", Arial, Helvetica, sans-serif;*/
        /*font-size: 18px;*/
        /*font-weight: bold;*/
        /*line-height: 23px;*/
        text-decoration: none;
        /*text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);*/
    }
.sm-menu a.current {
  /*background: #91D8F7;*/
  /*background-image: linear-gradient(to bottom, #006188, #006f9c);*/
  /*color: #fff;*/
}
.sm-menu a.disabled {
  /*color: #F5F5F6;*/
}
.sm-menu a .sub-arrow {
  position: absolute;
  top: 50%;
  margin-top: -17px;
  left: auto;
  right: 4px;
  width: 32px;
  height: 32px;
  overflow: hidden;
  font: bold 16px/34px monospace !important;
  text-align: center;
  text-shadow: none;
  /*background: rgba(0, 0, 0, 0.1);*/
  /*border-radius: 4px;*/
}
.sm-menu a .sub-arrow::before {
  content: '+';
}
.sm-menu a.highlighted .sub-arrow::before {
  content: '-';
}
.sm-menu > li:first-child > a, .sm-menu > li:first-child > :not(ul) a {
  /*border-radius: 8px 8px 0 0;*/
}
.sm-menu > li:last-child > a, .sm-menu > li:last-child > *:not(ul) a, .sm-menu > li:last-child > ul, .sm-menu > li:last-child > ul > li:last-child > a, .sm-menu > li:last-child > ul > li:last-child > *:not(ul) a, .sm-menu > li:last-child > ul > li:last-child > ul, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > a, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul {
  /*border-radius: 0 0 8px 8px;*/
}
.sm-menu > li:last-child > a.highlighted, .sm-menu > li:last-child > *:not(ul) a.highlighted, .sm-menu > li:last-child > ul > li:last-child > a.highlighted, .sm-menu > li:last-child > ul > li:last-child > *:not(ul) a.highlighted, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, .sm-menu > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted {
  border-radius: 0;
}
.sm-menu ul {
  background: #9C9E9F;
}
.sm-menu ul ul {
  /*background: rgba(102, 102, 102, 0.1);*/
}
.sm-menu ul a, .sm-menu ul a:hover, .sm-menu ul a:focus, .sm-menu ul a:active {
    background: transparent;
    color: #F5F5F6;
    text-shadow: none;
    border-left: 8px solid transparent;
}

.sm-menu ul a.current {
  /*background: #006892;*/
  /*background-image: linear-gradient(to bottom, #006188, #006f9c);*/
  /*color: #fff;*/
}
.sm-menu ul a.disabled {
  /*color: #F5F5F6;*/
}
.sm-menu ul ul a,
.sm-menu ul ul a:hover,
.sm-menu ul ul a:focus,
.sm-menu ul ul a:active {
  border-left: 16px solid transparent;
}
.sm-menu ul ul ul a,
.sm-menu ul ul ul a:hover,
.sm-menu ul ul ul a:focus,
.sm-menu ul ul ul a:active {
  border-left: 24px solid transparent;
}
.sm-menu ul ul ul ul a,
.sm-menu ul ul ul ul a:hover,
.sm-menu ul ul ul ul a:focus,
.sm-menu ul ul ul ul a:active {
  border-left: 32px solid transparent;
}
.sm-menu ul ul ul ul ul a,
.sm-menu ul ul ul ul ul a:hover,
.sm-menu ul ul ul ul ul a:focus,
.sm-menu ul ul ul ul ul a:active {
  border-left: 40px solid transparent;
}
.sm-menu ul li {
  /*border-top: 1px solid #2A3046;*/
}
.sm-menu ul li:first-child {
  border-top: 0;
}



/* CARDS */

#divCard01 {
    margin: 0 0 32px 0;
    padding: 24px;
    font-size: 24px;
    font-weight: 500;
    color: #FFF;
    text-shadow: 0 1px 3px #2A3046;
    min-height: 640px;
    border-bottom: solid 8px #b20d15;
}

#divCard02, #divCard03, #divCard04, #divCard05, #divCard06, #divCard07, #divCard08 {
    margin: -32px 0 32px 0;
    padding: 24px;
    font-size: 24px;
    font-weight: 500;
    color: #FFF;
    text-shadow: 0 1px 3px #2A3046;
    min-height: 640px;
    border-bottom: solid 8px #b20d15;
}

#divCard01 h2, #divCard02 h2, #divCard03 h2, #divCard04 h2, #divCard05 h2, #divCard06 h2, #divCard07 h2, #divCard08 h2 {
    margin: 0;
    font-size: 42px;
    font-weight: 700;
}

#divCard01 p, #divCard02 p, #divCard03 p, #divCard04 p, #divCard05 p, #divCard06 p, #divCard07 p, #divCard08 p {
    margin: 0 0 8px 0;
    padding-top: 24px;
    font-weight: 500;
}

#divCard01 .divGrid, #divCard02 .divGrid, #divCard03 .divGrid, #divCard04 .divGrid, #divCard05 .divGrid, #divCard06 .divGrid, #divCard07 .divGrid, #divCard08 .divGrid {
    margin-top: 16px;
}

#divCard01 .tabelaCelula, #divCard02 .tabelaCelula, #divCard03 .tabelaCelula, #divCard04 .tabelaCelula, #divCard05 .tabelaCelula, #divCard06 .tabelaCelula, #divCard07 .tabelaCelula, #divCard08 .tabelaCelula {
    padding: 5%;
}

#divCard01 .box, #divCard02 .box, #divCard03 .box, #divCard04 .box, #divCard05 .box, #divCard06 .box, #divCard07 .box, #divCard08 .box {
    margin-top: 16px;
    border: solid 1px #FFF;
}

#divCard01 .campo, #divCard02 .campo, #divCard03 .campo, #divCard04 .campo, #divCard05 .campo, #divCard06 .campo, #divCard07 .campo, #divCard08 .campo {
    margin-top: 4px !important;
}

#divCard01 .botao, #divCard02 .botao, #divCard03 .botao, #divCard04 .botao, #divCard05 .botao, #divCard06 .botao, #divCard07 .botao, #divCard08 .botao {
    font-size: 24px;
    border: solid 1px #C8CCE6;
}



/* FORMULÁRIOS */

.invisivel {
    visibility: hidden;
}

input:focus {
    background-color: #C8CCE6 !important;
    border: none !important;
    border-bottom: solid 2px #2A3046 !important;
    border-radius: 0 !important;
}

.campo {
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 18px;
    width: 90%;
    padding: 8px !important;
    border: solid 1px #2A3046 !important;
    border-radius: 12px !important;
    transition: 0.2s;
}

.botao {
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 18px;
    color: #FFF;
    padding: 8px;
    background-color: #2A3046;
    border: solid 1px #2A3046;
    border-radius: 12px;
    margin-right: 8px;
    text-shadow: none !important;
    transition: 0.2s;
}

.botao:hover {
    border-radius: 0;
    background-color: #2A3046;
    color: #FFFFFF;
    cursor: pointer;
    transition: 0.2s;
}

a.botao:link, a.botao:visited, a.botao:active {
    color: #FFF;
    text-decoration: none;
    transition: 0.25s;
}

a.botao:hover {
    color: #FFF;
    transition: 0.25s;
}

.campoDDL {
    font-family: "systa-web-symbols", "Rajdhani" !important;
    font-size: 18px;
    width: 95%;
    padding: 8px;
    border: solid 1px #2A3046;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    transition: 0.2s;
}

.divBotoes {
    /*display: table;*/
    /*width: 100%;*/
    margin: 48px 0 0 0;
    text-align: center;

    background-color: #A1A1A1;
    padding: 10px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    position: fixed;
    /*left: 0;*/
    right: 16px;
    bottom: 0; 

}

.divBotoes .botao {
    background-color: #FFF;
    border-color: #2A3046;
    color: #2A3046;
}

.divBotoes .botao:hover {
    background-color: #2A3046;
    border-color: #2A3046;
    color: #FFF;
}

.divBotoes a.botao:link, .divBotoes a.botao:visited, .divBotoes a.botao:active {
    color: #2A3046;
    text-decoration: none;
    transition: 0.25s;
}

.divBotoes a.botao:hover {
    color: #FFF;
    transition: 0.25s;
}

.divBotoesInterno {
    text-align: right;
    padding: 16px 0 0 0;
    margin-top: 32px;
    border-top: solid 1px #2A3046;
}

.divLinks {
    text-align: right;
    padding: 0;
    margin-top: 16px;
    font-size: 14px;
}


/* BOX */

.box {
    margin-bottom: 16px;
    background-color: #2A3046;
    border-radius: 4px;
    padding: 8px;
    text-align: left;
    font-weight: bold;
    font-size: 22px;
    color: #F5F5F6;
}

.boxDivisaoInterna {
    margin-bottom: 16px;
    border-bottom: solid 1px #2A3046;
    padding: 8px;
    padding-left: 0;
    text-align: left;
    font-weight: bold;
    font-size: 22px;
    color: #2A3046;
}

.box a {
    color: #F5F5F6;
}



/* ACCORDION */

.accordionHeader
{
    border: solid 4px #A1A1A1;
    background-color: #A1A1A1;
    color: #2A3046;
    padding: 8px;
    margin-top: 8px;
    cursor: pointer;
}
.accordionHeaderSelected
{
    border: solid 4px #2A3046;
    background-color: #2A3046;
    color: #FFF;
    padding: 8px;
    margin-top: 8px;
    cursor: pointer;
}
.accordionContent {
    border: 1px solid #C1C1C1;
    box-shadow: 0 0 6px #c1c1c1;
    background-color: #FFF;
    border-top: none;
    padding: 8px;
}



/* TABS */

.ajax__tab_default .ajax__tab_inner {
    margin-right: 8px;
    margin-bottom: 4px;
}

/*Header*/
.tab .ajax__tab_header {
    margin: 0;
}

/*Body*/
.tab .ajax__tab_body {
    border: none;
    padding-top: 32px;
    padding: 4px;
}

.tab .ajax__tab_body table {
    width: 100%;
}

.tab .ajax__tab_body h3 {
    font-size: 14px;
}

/*Tab Active*/
.tab .ajax__tab_active .ajax__tab_tab {
    padding: 12px;
    color: #FFF;
}

.tab .ajax__tab_active .ajax__tab_inner {
    background-color: #2A3046;
    border-bottom: solid 5px #A1A1A1;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.tab .ajax__tab_active .ajax__tab_outer {

}


/*Tab Hover*/
.tab .ajax__tab_hover .ajax__tab_tab {
    color: #2A3046;
    transition-duration: 0.5s;
}

.tab .ajax__tab_hover .ajax__tab_inner {
    background-color: #C8CCE6;
}

.tab .ajax__tab_hover .ajax__tab_outer {

}

/*Tab Inactive*/
.tab .ajax__tab_tab {
    padding: 8px;
    color: #2A3046;
}

.tab .ajax__tab_inner {
    border: none;
    border-bottom: solid 5px #A1A1A1;
}

.tab .ajax__tab_outer {

}



/* MODAL POPUP */

.painelForm {
    margin: 1em;
    background-color: #FFFFFF;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    height: 520px;
    width: 80%;
    overflow-y: scroll;
}

.painelMensagens {
    margin: 1em;
    background-color: #FFFFFF;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    width: 80%;
}

.menuBotoes
{
    text-align: right;
    padding: 1em;
}

.painelTituloAlerta
{
    padding: 0.5em;
    background-color: #b20d15;
    font-weight: 300;
    font-size: 16px;
    color: #FFFFFF;
    text-align: right;
}

.painelTituloConfirmacao
{
    padding: 0.5em;
    background-color: #91D8F7;
    font-weight: 300;
    font-size: 16px;
    color: #2A3046;
    text-align: right;
}

.painelTexto
{
    padding: 1em;
    font-size: 16px;
    text-align: left;
    color: #2A3046;
}     

.modalBackground {
	background-color: #2A3046;
	filter: alpha(opacity=10);
	opacity:0.8;
}

.estatisticas {
    padding: 8px;
    text-align: center;
    font-size: 18px;
}

.estatisticas h2 {
    font-weight: 500;
    font-size: 38px;
}




@media (min-width: 768px) {

    @-webkit-keyframes fadeIn {
    }

    @-moz-keyframes fadeIn {
    }

    @-o-keyframes fadeIn {
    }

    @keyframes fadeIn {
    }

    .fadeIn {
    }

    .divScroll {
        overflow: auto; 
        height: 180px; 
        border: solid 1px #2A3046;
        border-radius: 5px;
        padding: 8px;
    }



    /* HTML */

    body {
        font-size: 18px;
    }

    p {
        font-size: 20px;
    }

    h1 {
        font-size: 48px;
        font-weight: 900;
    }

    h2 {
        /*font-size: 22px;*/
        font-size: 18px;
        /*margin: 16px 0 4px 0;*/
        margin: 0 0 4px 0;
        margin: 0 0 4px 0;
    }

    h3 {
    }

    a:link, a:visited, a:active{
    }

    a:hover{
    }

    table {
        font-size: 18px;
        /*font-size: 22px;*/
    }

    hr {
    }



    /* TABLELESS */

    .tabela {
        width: 100%;
        display: table;
    }

    #tabelaCabecalho {
    }

    #tabelaCabecalho .tabelaCelula {
    }

    #tabelaCabecalho .tabelaCelula p {
    }

    .tabelaLinha {
        display: table-row;
    }

    .tabelaCelula {
        display: table-cell;
        padding: 16px;
        width: auto;
    }



    /* LOGON */

    #bgLogon {
        background-position: initial;
    }

    #divLogon {
        padding: 32px;
    }

    #divLogon h1 {
    }

    .logonCampoID {
        width: 128px;
    }

    .logonCampoSenha {
        width: 96px;
    }

    .logonBotao {
    }

    .logonBotao:hover {
    }

    .logonLogotipo {
        right: 32px;
    }

    .logonLogotipo img {
        height: 48px;
    }



    /* RODAPÉ */

    #divRodape {
        position: absolute;
        bottom: 0;
    }

    #divRodape a {
    }

    #divRodape a:hover {
    }



    /* DESENVOLVEDOR */

    #divDesenvolvedor {
        padding: 0;
    }

    #divDesenvolvedor a {
        font-weight: 700;
    }



    /* PARALAX */

    .divParallax {
    }



    /* TOPO */

    #divTopo {
        background-position-x: initial;
    }

    #divTopo a {
    }



    /* GRID */

    .divGrid {
        width: 960px;
        margin-bottom: 24px;
    }



    /* MENU AUXILIAR */

    .menuAux {
        width: 100%;
        background-color: #A1A1A1;
        color: #2A3046;
        box-shadow: 0 0 8px #2A3046;
        position: fixed;
        padding: 16px;
        display: none;
        z-index: 999;
    }

    .menuAux h2 {
        margin: 4px;
    }

    .menuAux a.aMenuAux {
        margin-right: 24px;
    }

    a.aMenuAux:link, a.aMenuAux:visited, a.aMenuAux:active {
        color: #FFFFFF;
        text-decoration: none;
        border: solid 1px #2A3046;
        padding: 5px;
    }

    a.aMenuAux:hover{
        border: solid 1px #FFFFFF; 
        transition: 0.25s;
    }



    /* BANNER */

    #divBanner {
    }

    #divBannerAtualizacoes {
    }


  /* MENU */

  .sm-menu ul {
    position: absolute;
    width: 12em;
  }

  .sm-menu li {
    float: left;
  }

  .sm-menu.sm-rtl li {
    float: right;
  }

  .sm-menu ul li, .sm-menu.sm-rtl ul li, .sm-menu.sm-vertical li {
    float: none;
  }

  .sm-menu a {
    white-space: nowrap;
  }

  .sm-menu ul a, .sm-menu.sm-vertical a {
    white-space: normal;
  }

  .sm-menu .sm-nowrap > li > a, .sm-menu .sm-nowrap > li > :not(ul) a {
    white-space: nowrap;
  }

.sm-menu {
    background: linear-gradient(90deg, rgba(42,48,70,1) 0%, rgba(125,104,171) 100%);
    padding: 8px;
    /*background-image: linear-gradient(to bottom, #3298c8, #2e8cb8);*/
    /*border-radius: 8px;*/
    /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
}

  .sm-menu a, .sm-menu a:hover, .sm-menu a:focus, .sm-menu a:active, .sm-menu a.highlighted {
    padding: 13px 24px;
    /*background: #9C9E9F;*/
    /*background-image: linear-gradient(to bottom, #3298c8, #2e8cb8);*/
    color: #2A3046;
  }

    .sm-menu a:hover, .sm-menu a:focus, .sm-menu a:active, .sm-menu a.highlighted {
        background: #FFFFFF;
        color: #2A3046;
        /*background-image: linear-gradient(to bottom, #2d89b4, #297ca3);*/
    }

  .sm-menu a.current {
    /*background: #006892;*/
    /*background-image: linear-gradient(to bottom, #006188, #006f9c);*/
    /*color: #fff;*/
  }

  .sm-menu a.disabled {
    /*background: #3092c0;
    background-image: linear-gradient(to bottom, #3298c8, #2e8cb8);
    color: #a1d1e8;*/
  }

  .sm-menu a .sub-arrow {
    top: auto;
    margin-top: 0;
    bottom: 2px;
    left: 50%;
    margin-left: -5px;
    right: auto;
    width: 0;
    height: 0;
    border-width: 5px;
    border-style: solid dashed dashed dashed;
    border-color: #2A3046 transparent transparent transparent;
    background: transparent;
    border-radius: 0;
  }

  .sm-menu a .sub-arrow::before {
    display: none;
  }

  .sm-menu > li:first-child > a, .sm-menu > li:first-child > :not(ul) a {
    /*border-radius: 8px 0 0 8px;*/
  }

  .sm-menu > li:last-child > a, .sm-menu > li:last-child > :not(ul) a {
    /*border-radius: 0 8px 8px 0 !important;*/
  }

  .sm-menu > li {
    border-left: 2px solid #F5F5F6;
  }

  .sm-menu > li:first-child {
    border-left: 0;
  }

  .sm-menu ul {
    border: 1px solid #A1A1A1;
    padding: 7px 0;
    background: #fff;
    border-radius: 0 0 4px 4px !important;
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.2);
  }

  .sm-menu ul ul {
    border-radius: 4px !important;
    background: #FFFFFF;
  }

  .sm-menu ul a, .sm-menu ul a:hover, .sm-menu ul a:focus, .sm-menu ul a:active, .sm-menu ul a.highlighted {
    border: 0 !important;
    padding: 9px 23px;
    background: transparent;
    color: #2A3046;
    border-radius: 0 !important;
  }

  .sm-menu ul a:hover, .sm-menu ul a:focus, .sm-menu ul a:active, .sm-menu ul a.highlighted {
    background: #A1A1A1;
    /*background-image: linear-gradient(to bottom, #3298c8, #2e8cb8);*/
    color: #FFFFFF;
  }

  .sm-menu ul a.current {
    background: #2A3046;
    /*background-image: linear-gradient(to bottom, #006188, #006f9c);*/
    color: #2A3046;
  }

  .sm-menu ul a.disabled {
    /*background: #FFFFFF;
    color: #F5F5F6;*/
  }

  .sm-menu ul a .sub-arrow {
    top: 50%;
    margin-top: -5px;
    bottom: auto;
    left: auto;
    margin-left: 0;
    right: 10px;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #2A3046;
  }

  .sm-menu ul li {
    border: 0;
  }

  .sm-menu .scroll-up, .sm-menu .scroll-down {
    position: absolute;
    display: none;
    visibility: hidden;
    overflow: hidden;
    background: #FFFFFF;
    height: 20px;
  }

  .sm-menu .scroll-up-arrow, .sm-menu .scroll-down-arrow {
    position: absolute;
    top: -2px;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    overflow: hidden;
    border-width: 8px;
    border-style: dashed dashed solid dashed;
    border-color: transparent transparent #FFFFFF transparent;
  }

  .sm-menu .scroll-down-arrow {
    top: 6px;
    border-style: solid dashed dashed dashed;
    border-color: #2A3046 transparent transparent transparent;
  }

  .sm-menu.sm-rtl.sm-vertical a .sub-arrow {
    right: auto;
    left: 10px;
    border-style: dashed solid dashed dashed;
    border-color: transparent #2A3046 transparent transparent;
  }

  .sm-menu.sm-rtl > li:first-child > a, .sm-menu.sm-rtl > li:first-child > :not(ul) a {
    border-radius: 0 8px 8px 0;
  }

  .sm-menu.sm-rtl > li:last-child > a, .sm-menu.sm-rtl > li:last-child > :not(ul) a {
    border-radius: 8px 0 0 8px !important;
  }

  .sm-menu.sm-rtl > li:first-child {
    border-left: 1px solid #2A3046;
  }

  .sm-menu.sm-rtl > li:last-child {
    border-left: 0;
  }

  .sm-menu.sm-rtl ul a .sub-arrow {
    right: auto;
    left: 10px;
    border-style: dashed solid dashed dashed;
    border-color: transparent #2A3046 transparent transparent;
  }

  .sm-menu.sm-vertical {
    /*box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);*/
  }

  .sm-menu.sm-vertical a {
    padding: 9px 23px;
  }

  .sm-menu.sm-vertical a .sub-arrow {
    top: 50%;
    margin-top: -5px;
    bottom: auto;
    left: auto;
    margin-left: 0;
    right: 10px;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #2A3046;
  }

  .sm-menu.sm-vertical > li:first-child > a, .sm-menu.sm-vertical > li:first-child > :not(ul) a {
    /*border-radius: 8px 8px 0 0;*/
  }

  .sm-menu.sm-vertical > li:last-child > a, .sm-menu.sm-vertical > li:last-child > :not(ul) a {
    /*border-radius: 0 0 8px 8px !important;*/
  }

  .sm-menu.sm-vertical > li {
    border-left: 0 !important;
  }

  .sm-menu.sm-vertical ul {
    /*border-radius: 4px !important;*/
  }

  .sm-menu.sm-vertical ul a {
    padding: 9px 23px;
  }



    /* CARDS */

    #divCard01 {
        margin: -31px 0 32px 0;
        padding: 72px;
    }

    #divCard02, #divCard03, #divCard04, #divCard05, #divCard06, #divCard07, #divCard08 {
        padding: 72px;
    }

    #divCard01 h2, #divCard02 h2, #divCard03 h2, #divCard04 h2, #divCard05 h2, #divCard06 h2, #divCard07 h2, #divCard08 h2 {
    }

    #divCard01 p, #divCard02 p, #divCard03 p, #divCard04 p, #divCard05 p, #divCard06 p, #divCard07 p, #divCard08 p {
        padding-top: 81px;
    }

    #divCard01 .divGrid, #divCard02 .divGrid, #divCard03 .divGrid, #divCard04 .divGrid, #divCard05 .divGrid, #divCard06 .divGrid, #divCard07 .divGrid, #divCard08 .divGrid {
        margin-top: 64px;
    }

    #divCard01 .tabelaCelula, #divCard02 .tabelaCelula, #divCard03 .tabelaCelula, #divCard04 .tabelaCelula, #divCard05 .tabelaCelula, #divCard06 .tabelaCelula, #divCard07 .tabelaCelula, #divCard08 .tabelaCelula {
        padding: 18px;
    }

    #divCard01 .box, #divCard02 .box, #divCard03 .box, #divCard04 .box, #divCard05 .box, #divCard06 .box, #divCard07 .box, #divCard08 .box {
        margin-top: 64px;
    }

    #divCard01 .campo, #divCard02 .campo, #divCard03 .campo, #divCard04 .campo, #divCard05 .campo, #divCard06 .campo, #divCard07 .campo, #divCard08 .campo {
    }

    #divCard01 .botao, #divCard02 .botao, #divCard03 .botao, #divCard04 .botao, #divCard05 .botao, #divCard06 .botao, #divCard07 .botao, #divCard08 .botao {
        font-size: 18px;
    }



    /* FORMULÁRIOS */

    .invisivel {
    }

    input:focus {
    }

    .campo {
        width: 100%;
    }

    .botao {
    }

    .botao:hover {
    }

    .campoDDL {
        width: auto;
    }

    .divBotoes {
    }



    /* BOX */

    .box {
    }



    /* ACCORDION */

    .accordionHeader
    {
    }
    .accordionHeaderSelected
    {
    }
    .accordionContent
    {
    }



    /* MODAL POPUP */

    .painelForm {
        width: 960px;
    }

    .painelMensagens 
    {
        width: 620px;
    }

    .menuBotoes
    {
    }

    .painelTituloAlerta
    {
    }

    .painelTituloConfirmacao
    {
    }

    .painelTexto
    {
    }     

    .modalBackground {
    }

}