@import url("../css/font-awesome.min.css");

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
  -webkit-transition: all 500ms ease-out;
  -moz-transition: all 500ms ease-out;
  -o-transition: all 500ms ease-out;  
  transition: all 500ms ease-out;
}

html, body {
  min-height: 100%;
}

body {
  display: block;
  background-color: white;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  font: normal 14px Arial, Helvetica, sans-serif;
  color: black;
  overflow-x: hidden;
}

a {
  font-weight: bold;
  color: rgb(27,67,129);
  text-decoration: none;
}

#div_full {
  position: relative;
  clear: both;
  display: block;
  width: 1920px;
  margin: 0 0 0 0;
  margin-left: calc( 50vw - 960px );
  padding: 0 0 0 0;
  overflow-x: hidden;
}

#centro {
  position: relative;
  display: block;
  width: 1090px;
  margin: 0 auto;
  padding: 10px 0 0 0;
}

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

  #centro {
    width: calc( 100% - 10px );
  }

}

/******************************************************************************
 * cabeçalho
 ******************************************************************************/

#cabecalho {
  float: left;
  position: relative;
  background: white;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  clear: both;
  border: 0;
}

#cabecalho .centro {
  position: relative;
  display: block;
  width: 1090px;
  margin: 0 auto;
  padding: 0;
}

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

  #cabecalho .centro {
    width: calc( 100% - 10px );
  }

}

#cabecalho .logo {
  float: left;
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 5px 0;
  clear: none;
}

#cabecalho .logo img {
  border: 0;
  height: 70px;
}

#cabecalho .logopainel {
  float: left;
  display: block;
  position: relative;
  margin: 5px 0;
  padding: 0;
}

#cabecalho .logopainel img {
  border: 0;
  height: 80px;
}

#cabecalho .etiqueta {
  float: right;
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
  clear: right;
  font: 700 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#cabecalho .info {
  float: right;
  display: block;
  position: relative;
  font: 500 11px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: gainsboro;
  color: black;
  margin: 0 0 10px 0;
  padding: 7px 10px;
  text-align: left;
}

#cabecalho_home {
  float: left;
  position: relative;
  background-color: transparent;
  background-image: url('../img/topo.jpg');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;
  display: block;
  width: 100vw;
  height: calc( 100vh - 80px );
  margin: 0;
  padding: 0;
  clear: both;  
  border: 0;
}

#cabecalho_home .logo {
  float: left;
  display: table-cell;
  position: relative;
  margin: 0;
  padding: 0;
  clear: none;
}

#cabecalho_home .logo img {
  border: 0;
  height: 150px;
}

#cabecalho_home .motto {
  float: left;
  display: block;
  position: relative;
  margin: 25vh 0 0 0;
  padding: 0;
  clear: left;
  width: 200px;
}

#cabecalho_home .motto h1 {
  margin: 0;
  padding: 0;
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  text-align: center;
}

#cabecalho_home .motto p {
  margin: 0;
  padding: 0;
  font: 400 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-align: center;
}


/******************************************************************************
 * Menu Capa
 ******************************************************************************/


#menu_capa {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  height: 80px;
  margin: 0;
  padding: 0 0 0 0;
  color: black;
  border: 0;
  background: transparent;
  text-align: center;
}

#menu_capa ul {
  overflow: auto;
  list-style-type: none;
  text-align: center;
  margin: 0 auto;
  padding: 0;
}

#menu_capa li {
  text-align: center;
  display: inline-block;
  margin: 0;
  padding: 0;
}

#menu_capa a {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  height: 80px;
  padding: 0 15px;
  text-decoration: none;
  font: 300 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  border: 0;
  border-bottom: solid 3px white;
}

#menu_capa .current_page_item a {
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#menu_capa a:hover {
  color: rgb(27,67,129);
  border-bottom: solid 3px rgb(27,67,129);
}

#menu_capa .special_item a {
  margin: 0 0 0 10px;
  font: 700 1.5vw  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  background: rgb(76,176,52);
  text-transform: uppercase;
  border-bottom: solid 3px rgb(76,176,52);
}

#menu_capa .special_item a:hover {
  color: rgb(242,240,43);
  border-bottom: solid 3px rgb(242,240,43);
}

/******************************************************************************
 * Menu
 ******************************************************************************/

#menu {
  float: right;
  position: relative;
  display: block;
  width: auto;
  height: 80px;
  margin: 0;
  padding: 0 0 0 0;
  color: black;
  border: 0;
  background: transparent;
  text-align: center;
}

#menu ul {
  overflow: auto;
  list-style-type: none;
  text-align: center;
  margin: 0 auto;
  padding: 0;
}

#menu li {
  text-align: center;
  display: inline-block;
  margin: 0;
  padding: 0;
}

#menu a {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  height: 80px;
  padding: 0 15px;
  text-decoration: none;
  font: 300 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  border: 0;
  border-bottom: solid 3px white;
}

#menu .current_page_item a {
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#menu a:hover {
  color: rgb(27,67,129);
  border-bottom: solid 3px rgb(27,67,129);
}

#menu .special_item a {
  margin: 0 0 0 10px;
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  background: rgb(76,176,52);
  text-transform: uppercase;
  border-bottom: solid 3px rgb(76,176,52);
}

#menu .special_item a:hover {
  color: rgb(242,240,43);
  border-bottom: solid 3px rgb(242,240,43);
}

/* -----------------------------------------------------------------------------
  HAMBURGER ICONS COMPONENT
----------------------------------------------------------------------------- */

#menuhamb {
  float: right;
  background: rgba(0,0,0,0.5);
  position: relative;
  display: none;
  margin: 0;
  padding: 0 0 0 0;
  color: black;
  border: 0;
  -webkit-transition: 250ms all;
  transition: 250ms all;
}

#menuhamb ul {
  overflow: auto;
  list-style-type: none;
  margin: 0 auto;
  padding: 0;
}

#menuhamb li {
  float: left;
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 0 15px;
  height: 20px;
}

#menuhamb a {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 3px 0 0 0;
  text-decoration: none;
  font: 500 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: 0;
  text-transform: uppercase;
}

#menuhamb .current_page_item a {
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#menuhamb a:hover {
  color: rgb(47,146,239);
}

#menuhamb .special_item a {
  margin: 0 0 0 10px;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(242,240,43);
  text-transform: uppercase;
}

#menuhamb .special_item a:hover {
  color: rgb(47,146,239);
}

#menuhamb .current_special_item a {
  margin: 0 0 0 10px;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(76,176,52);
}

#menuhamb .current_special_item a:hover {
  color: rgb(27,67,129);
}

.c-hamburger {
  float: right;
  display: block;
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0;
  width: 20px;
  height: 20px;
  font-size: 0;
  text-indent: -9999px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  cursor: pointer;
  -webkit-transition: background 0.3s;
          transition: background 0.3s;
}

.c-hamburger:focus {
  outline: none;
}

.c-hamburger span {
  display: block;
  position: absolute;
  top: 8px;
  left: 0px;
  right: 0px;
  height: 4px;
  background: black;
}

.c-hamburger span::before,
.c-hamburger span::after {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: black;
  content: "";
}

.c-hamburger span::before {
  top: -8px;
}

.c-hamburger span::after {
  bottom: -8px;
}

.c-hamburger--htx {
  background-color: transparent;
}

.c-hamburger--htx span {
  -webkit-transition: background 0s 0.3s;
          transition: background 0s 0.3s;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
  -webkit-transition-duration: 0.3s, 0.3s;
          transition-duration: 0.3s, 0.3s;
  -webkit-transition-delay: 0.3s, 0s;
          transition-delay: 0.3s, 0s;
}

.c-hamburger--htx span::before {
  -webkit-transition-property: top, -webkit-transform;
          transition-property: top, transform;
}

.c-hamburger--htx span::after {
  -webkit-transition-property: bottom, -webkit-transform;
          transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.c-hamburger--htx.is-active {
  background-color: rgba(0,0,0,0.5);
}

.c-hamburger--htx.is-active #menuhamb {
  display: block;
}

.c-hamburger--htx.is-active span {
  background: none;
}

.c-hamburger--htx.is-active span::before {
  top: 0;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
  background: white;
}

.c-hamburger--htx.is-active span::after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  background: white;
}

.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
  -webkit-transition-delay: 0s, 0.3s;
          transition-delay: 0s, 0.3s;
}

/******************************************************************************
 * redessociais
 ******************************************************************************/

#redes_sociais {
  float: left;
  width: 100%;
  padding: 5px 0;
  margin: 0;
  border: 0;
  background: gainsboro;
  text-align: center;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#redes_sociais span {
  display: block;
  background: white;
  width: 1090px;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0 auto;
  padding: 0;
  border: 0;
}

#redes_sociais img {
  float: right;
  border: 0;
  margin: 0 0 0 5px;
}

/******************************************************************************
 * Rodapé
 ******************************************************************************/

#rodape {
  float: left;
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  clear: both;
  background-color: white;
  background-image: url('img/rodape.png');
  background-position: bottom left;
  background-size: 240px 10px;
  background-repeat: repeat-x;
}

#rodape .midiasocial {
  float: right;
  display: inline-block;
  position: relative;
  margin: 50px 40px 0 0;
  padding: 0;
}

#rodape .midiasocial a {
  display: inline-block;
  border: 0;
  height: 20px;
  border-radius: 10px;
  font: 700 10px  'Open Sans', Arial, Helvetica, sans-serif;
  color: white;
  margin: 0 5px 0 5px;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-filter: grayscale(100%); 
  filter: grayscale(100%);
}

#rodape .midiasocial a:hover {
  -webkit-filter: none; 
  filter: none;
}

#rodape .topo {
  float: left;
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 10px 0 0 0;
  background: rgb(27,67,129);
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  clear: both;
}

#rodape .meio {
  float: left;
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 10px 0;
  background: rgb(47,146,239);
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  clear: both;
}

#rodape .contato {
  float: left;
  display: inline-block;
  position: relative;
  width: 50%;
  margin: 0 10px 0 0;
  padding: 0;
  background: transparent;
  text-align: left;
}

#rodape .contato H1 {
  display: table-cell;
  width: 100%;
  height: 50px;
  vertical-align: bottom;
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 26px;
  color: rgb(47,146,239);
  margin: 0;
  padding: 0 0 10px 0;
}

#rodape .contato H1 a {
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(47,146,239);
  text-decoration: none;
}

#rodape .contato .texto {
  display: table-cell;
  width: 100%;
  vertical-align: top;
  font: 300 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 10px 0 20px 0;
}

#rodape .faq {
  float: left;
  display: inline-block;
  position: relative;
  width: calc( 25% - 21px );
  height: auto;
  margin: 0 10px 0 0;
  padding: 0 0 0 10px;
  text-align: left;
  border-left: solid 1px white;
}

#rodape .faq H1 {
  display: table-cell;
  width: 100%;
  height: 50px;
  vertical-align: bottom;
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 26px;
  color: white;
  margin: 0;
  padding: 0 0 10px 0;
}

#rodape .faq H1 a {
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
}

#rodape .faq .texto {
  display: table-cell;
  width: 100%;
  vertical-align: top;
  font: 300 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 10px 0 20px 0;
}

#rodape .contas {
  float: left;
  display: inline-block;
  position: relative;
  width: calc( 25% - 21px );
  margin: 0;
  padding: 0 0 0 10px;
  text-align: left;
  border-left: solid 1px white;
}

#rodape .contas H1 {
  display: table-cell;
  width: 100%;
  height: 50px;
  vertical-align: bottom;
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 26px;
  color: white;
  margin: 0;
  padding: 0 0 10px 0;
}

#rodape .contas H1 a {
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
}

#rodape .contas .texto {
  display: table-cell;
  width: 100%;
  vertical-align: top;
  font: 300 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 10px 0 20px 0;
}

#rodape .barra {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 5px 0 20px 0;
  background: white;
  clear: both;
  font: 400 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-align: center;
}

#rodape .barra_esq {
  float: left;
  display: block;
  position: relative;
  width: 70%;
  margin: 0;
  padding: 0;
}

#rodape .barra_dir {
  float: right;
  display: block;
  position: relative;
  width: 29%;
  margin: 0;
  padding: 0 0 20px 0;
  text-align: right;
}

#rodape .barra_dir img {
  height: 50px;  
  margin: 0 0 0 20px;
  padding: 0;
  border: 0px;
}

#rodape .centro {
  display: block;
  position: relative;
  width: 1090px;
  margin: 0 auto;
  padding: 0;
  background: transparent;
  clear: both;
}

#rodape .copyright {
  float: left;
  display: block;
  width: 100%;
  clear: both;
  margin: 0;
  padding: 0px 15px 10px 0;
  text-align: left;
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
}

#rodape .menu {
  float: left;
  width: 100%;
  clear: both;
  position: relative;
  display: block;
  margin: 0;
  padding: 5px 0 0 0;
  color: black;
  border: 0;
}

#rodape .menu ul {
  overflow: auto;
  list-style-type: none;
  margin: 0 auto;
  padding: 0;
}

#rodape .menu li {
  float: left;
  margin: 0;
  padding: 0 15px 10px 0;
}

#rodape .menu a {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  text-decoration: none;
  font: 300 15px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  border: 0;
}

#rodape .menu .current_page_item a {
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#rodape .menu a:hover {
  color: rgb(27,67,129);
}

#rodape .menu .special_item a {
  margin: 0 0 0 10px;
  font: 700 15px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(76,176,52);
}

#rodape .menu .special_item a:hover {
  color: rgb(27,67,129);
}

/******************************************************************************
 * Login
 ******************************************************************************/

 
  
#login {
  position: absolute;
  z-index: 500;
  top: calc( 30vh - 150px );
  left: calc( 50% - 250px );
  display: table;
  width:  500px;
  padding: 20px;
  margin: 0;
  background: rgb(27,67,129);
  border: 0;
  -moz-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  -webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);  
}

#login .titulo {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  font: 700 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  clear: both;
}

#login form {
  display: block;
  width: 100%;
  color: #d35400;
  margin: 0px 20px 0px 0px;
  padding: 10px 0px 10px 0px;
  clear: none;
}

#login fieldset{
  width: 100%;
  padding: 0px;
  margin: 0px;
  border: 0;
}

#login label {
  float: left;
  display: block;
  clear: none;
  width: calc( 50% - 10px );
  margin: 0 5px;
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-transform: uppercase;
}

#login .campo {
  float: left;
  display: block;
  clear: none;
  width: calc( 50% - 10px );
  margin: 0 5px;
  padding: 5px 10px 5px 10px;
  font: 700 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  background-color: white;
  border: 0;
  border-radius:5px;
}

#login .botao {
  float: left;
  width: calc( 100% - 10px );
  padding: 10px 0px;
  text-align: center;
  margin: 30px 5px 15px 5px;
  font: 400 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  color: white;
  background-color: rgb(47,146,239);
  border: 0;
}
#login .botao:hover {
  color: white;
  background-color: rgb(76,176,52);
}


/******************************************************************************
 * conteudo
 ******************************************************************************/

#conteudo {
  float: left;
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
}

/******************************************************************************
 * Page
 ******************************************************************************/

#page {
  position: relative;
  margin: 0 auto;
  display: block;
  width: 1090px;
  padding: 0;
  clear: both;
}

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

  #page {
    width: calc( 100% - 10px );
  }
 
}

/******************************************************************************
 * #painel
 ******************************************************************************/
 
#paineldivisor {
  float: left;
  display:block;
  width: 45px;
  margin: 0;
  padding: 0px;
}

#painel_esq {
  float: left;
  position: relative;
  margin: 0;
  width: 720px;
  overflow: hidden;
  color: dimgray;
  padding: 0;
  text-align: left;
  border: 0;
  font: 700 28px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#painel_esq h1 {
  float: left;
  display: block;
  position: relative;
  font: 700 28px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 25px;
  color: black;
  text-align: left;
  padding: 0 0 15px 0;
  clear: both;
  text-transform: uppercase;
  border: 0;
}

#painel_esq img.icone {
  float: left;
  display: block;
  position: relative;
  border: 0;
  height: 20px;
  padding: 0 0 0 0;
  margin: 25px 0 0 10px;
}

#painel_esq h1 .bordinha {
  position: absolute;
  display: block;
  left: 0;
  bottom: 0;
  width: 150px;
  height: 5px;
  border: 0;
  background: rgb(27,67,129);
}

#painel_esq p {
  margin: 0px 0px 5px 0px;
  padding: 0;
  text-align: justify;
  font: 400 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#painel_esq .saiba_mais a {
  display: block;
  position: relative;
  float: left;
  margin: 25px 0 0 10px;
  padding: 4px 15px;
  text-decoration: none;
  text-transform: uppercase;
  border: 0;
  background: rgb(27,67,129);
  font: 400 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#painel_esq .saiba_mais a:hover {
  background: black;
}

#painel_dir {
  float: right;
  position: relative;
  margin: 0;
  width: 350px;
  overflow: hidden;
  color: dimgray;
  padding: 0;
  text-align: right;
  border: 0;
}

#painel_dir h1 {
  float: left;
  display: block;
  position: relative;
  margin-bottom: 25px;
  font: 700 28px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-align: left;
  padding: 0 0 15px 0;
  clear: both;
  text-transform: uppercase;
  border: 0;
}

#painel_dir h1 .bordinha {
  position: absolute;
  display: block;
  left: 0;
  bottom: 0;
  width: 150px;
  height: 5px;
  border: 0;
  background: rgb(27,67,129);
}

#painel_dir p {
  margin: 0px 0px 5px 0px;
  padding: 0;
  text-align: justify;
  font: 400 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#painel_dir .saiba_mais a {
  display: block;
  float: right;
  margin: 20px 0 0 0;
  padding: 5px 15px;
  text-decoration: none;
  text-transform: uppercase;
  border: 0;
  background: rgb(27,67,129);
  font: 400 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#painel_dir .saiba_mais a:hover {
  background: black;
}

.painel_scroll {
  float: left;
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height:200px; 
  overflow: auto;
  font: 400 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-align: left;
}

.painel_scroll p {
  font: 400 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-align: left;
}

#painel {
  float: left;
  display: block;
  width: 100%;
  overflow: hidden;
  margin: 0;
  color: dimgray;
  padding: 0px;
  text-align: left;
}

#painel img.titulo {
  width: 306px;
  border: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 5px;  
  background: transparent;
  -moz-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  -webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);  
}

#painel h1 {
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 5px;
  color: rgb(27,67,129);
  text-align: left;
  clear: both;
}

#painel h1 a {
  text-decoration: none;
  color: rgb(27,67,129);
}

#painel h1 a:hover {
  text-decoration: none;
  color: #d35400;
}

#painel h2 {
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 0 5px 0;
  color: rgb(27,67,129);
  clear: both;
}

#painel p {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: justify;
  margin: 0 0 5px 0;
}

#painel p img {
  float: left;
  margin: 0 5px 5px 0;
}

#painel p.data {
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
  color: darkred;
}

#painel p.dataleft {
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: darkred;
}

#painel .endereco {
  float: left;
  display: block;
  margin: 0 0 10px 0;
  padding: 0;
  clear: both;
}

#painel .endereco .icone {
  float: left;
  width: 15px;
  display: block;
  border: 0;
  clear: none;
}

#painel .endereco .icone img {
  margin:3px 0 0 0;
  border: 0;
}

#painel .endereco .texto {
  float: left;
  display:  block;
  margin: 0 0 0 5px;
  padding: 0;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: justify;
  clear: none;
}

#painel .categoria {
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 5px;
  color: dimgray;
}

#painel .categoria img {
  float: left;
  width: 100px;
  padding: 0px 10px 0px 0px;
}

#painel form {
  width: 310px;
  border: 0;
  margin: 0;
  padding: 0;
}
  
#painel fieldset {
  width: 310px;
  margin: 0;
  display:block;
  border:0;
  padding: 0;
}

#painel fieldset#body {
  padding:0;
  margin:0;
}

#painel #nome_pedido {
  float: left;
  width: 140px;
  height: auto;
  border: 0;
  background: white;
  color: #d35400;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 5px;
  margin: 0 0 5px 0;
}

#painel #email_pedido {
  float: right;
  width: 140px;
  height: auto;
  border: 0;
  background: white;
  color: #d35400;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 5px;
  margin: 0 0 5px 0;
}

#painel #mensagem_pedido {
  float: left;
  width: 300px;
  border: 0;
  background: white;
  color: #d35400;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 5px;
  margin: 0 0 5px 0;
  resize: none;
}

#painel #enviar {
  display: block;
  width: 310px;
  margin: 0;
  border: 0;
  padding: 5px;
  letter-spacing: 1px;
  background: rgb(57,55,56);
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  clear: both;
}

/******************************************************************************
 * Slider
 ******************************************************************************/

#slider {
  position: relative;
  float: left;
  top: 0;
  left: 0;
  width: 100vw;
  height: 33.85vw;
  padding: 0;
  z-index: 1;
  display: table;
  margin: 0 0 10px 0;
  border: 0;
  background: black;
}

#slider .cycle-overlay {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  margin: 0;
  z-index: 300;
  display: block;
  background: transparent;
  padding: 0;
  height: 100%;
}

#slider .titbanner {
  float: right;
  position: relative;
  margin: 4vh 80px 0 0;
  width: 45%;
  display: block;
  font: 700 4vh  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  text-align: right;
  border: 0;
}

#slider .titbanner a {
  font: bold 38px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  text-shadow: 2px 2px 2px rgba(255,255,255,0.5);
  text-decoration: none;
}

#slider .titbanner a:hover {
  font: bold 38px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
  text-shadow: 2px 2px 2px rgba(255,255,255,0.5);
}

#slider .descrbanner {
  float: right;
  position: relative;
  margin: 10px 80px 0 0;
  width: 45%;
  display: block;
  font: 400 2vh  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  text-align: right;
  border: 0;
  clear: right;
}

#slider .txtbanner {
  position: relative;
  top: 30%;
  left: 0;
  display: block;
  color: black;
  text-shadow: 2px 2px 2px rgba(255,255,255,0.5);
  font-size: 20px;
  max-height: 100px;
}

#slider .txtbanner p {
  margin: 0 0 5px 0;
}

#slider .databanner {
  float: right;
  position: absolute;
  width: 45%;
  bottom: 4vh;
  right: 80px;
  display: block;
  margin: 0;
  text-align: right;
  color: white;
  font: 700 6vh  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#slider .databanner .dia {
  float: right;
  display: block;
  width: 8vh;
  text-align: center;
  position: relative;
  font: bold 6vh  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  clear: right;
}

#slider .databanner .mes {
  float: right;
  display: block;
  width: 8vh;
  text-align: center;
  position: relative;
  text-transform: uppercase;
  font: 700 3vh  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  clear: right;
}

#slider .databanner .ano {
  position: relative;
  display: block;
  width: 100%;
  text-align: center;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-shadow: 2px 2px rgb(47,146,239);
  margin: 0;
  padding: 0;
}

#slider .slider_esq {
  position: absolute;
  left: 30px;
  top: calc( 17.5vw - 25px );
  width: 50px;
  margin: 0;
  padding: 0;
  z-index: 15;
  border: 0;
  border-radius: 25px;
}

#slider .slider_esq:hover {
  background: rgb(27,67,129);
}

#slider .slider_esq img {
  margin: 0;
  padding: 0;
}

#slider .slider_dir {
  position: absolute;
  right: 30px;
  top: calc( 17.5vw - 25px );
  width: 50px;
  margin: 0;
  padding: 0;
  z-index: 15;
  border: 0;
  border-radius: 25px;
}

#slider .slider_dir:hover {
  background: rgb(27,67,129);
}

#slider .slider_dir img {
  margin: 0;
  padding: 0;
}

#slider .slider_painel {
  position: relative;
  width: 100%;
  padding: 0;
  z-index: 10;
  border: 0;
}

#slider .slider_painel img {
  width: 100%;
  margin: 0 0 5px 0;
  padding: 0;
  border: 0;
}

#slider .slider_bt {
  float: left;
  width: 1090px;
  margin: 10px 0;
  padding: 0;
  text-align: center;
}

#slider .slider_bt img  {
  margin: 0 0 0 5px;
  border: 0;
}

#slider .btimg { 
  display: inline-block;
  width: 78px; 
  height: 6px; 
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 5px 0 0;
  cursor: pointer; 
  text-decoration: none;
  background: rgb(57,55,56);
  color: transparent;
  -moz-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  -webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);    
}

#slider .btimg.cycle-pager-active { 
  display: inline-block;
  width: 78px; 
  height: 6px; 
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 5px 0 0;
  cursor: pointer; 
  text-decoration: none;
  background: rgb(27,67,129);
  color: transparent;
  -moz-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  -webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);
  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.5);    
}

#slider .cycle-overlay a { 
  display: block;
  width: 100%;
  height: 100%;
}

#slider .titulo {
  position: relative;
  top: 15%;
  right: 0;
  display: block;
  font: bold 30px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  border: solid 1px white;
}



/******************************************************************************
 * pnmanager
 ******************************************************************************/

#pnmanager {
  position: relative;
  float: right;
  width: calc( 100% - 210px );
  padding: 5px 5px 15px 5px;
  margin: 0;
  border: solid 1px #ecf0f1;
}

#breadcrumb {
  position: relative;
  margin: 0 0 5px 0;
  padding: 0 0 5px 0;
  background: transparent;
  clear: both;
  border-bottom: solid 1px #ecf0f1;
}

#pnmanager .breadcrumb {
  text-align: left;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0;
  color: rgb(57,55,56);
  letter-spacing: 1px;
}

#pnmanager .breadcrumb a {
  text-decoration: none;
  color: rgb(27,67,129);
}

#pnmanager .breadcrumb a:hover {
  text-decoration: none;
  color: #d35400;
}

/******************************************************************************
 * Sidebar
 ******************************************************************************/

#sidebar {
  float: left;
  position: relative;
  width: 200px;
  font-size: 12px;
  padding: 5px;
  margin: 0 0 20px 0;
  background-color: transparent;
  border: solid 1px #ecf0f1;
}

#sidebar .logo {
  display: block;
  position: relative;
  margin: 10px 0;
  padding: 0;
}

#sidebar .logo img {
  border: 0;
  width: 100%;
}

#sidebar .divisor {
  display: block;
  width: 100%;
  height: 10px;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

#sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
}

#sidebar li {
  position: relative;
  padding: 0;
}

#sidebar p {
  margin: 0 0px;
  padding: 0px 20px 10px 20px;
  text-align: left;
  font: 400 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#sidebar h2 {
  display: block;
  position: relative;
  border: 0;
  width: 100%;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: rgb(27,67,129);
  color: white;
  margin: 0 0 3px 0;
  padding: 0;
  text-align: left;
}

#sidebar h2 a {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  text-decoration: none;
  color: white;
  padding: 7px 0 7px 10px;
  letter-spacing: 1px;
}

#sidebar h2 a:hover {
  width: auto;
  text-decoration: none;
  background-color: #d35400;
}

#sidebar h2 span {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  text-decoration: none;
  color: white;
  padding: 7px 0 7px 10px;
  letter-spacing: 1px;
}

#sidebar h2 span:hover {
  width: auto;
  text-decoration: none;
  background-color: #d35400;
}

#sidebar h3 {
  display: block;
  position: relative;
  width: 100%;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: white;
  color: black;
  margin: 0;
  padding: 0 0 5px 0;
  text-align: left;
}

#sidebar h3 p {
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  margin: 0;
  padding: 0 5px 5px 5px;
}

#sidebar h3 a {
  border: none;
  text-decoration: none;
  color: black;
}

#sidebar h3 a:hover {
  text-decoration: none;
  color: #d35400;
}

#sidebar h4 {
  display: block;
  position: relative;
  width: 100%;
  font: 500 11px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: gainsboro;
  color: black;
  margin: 0 0 10px 0;
  padding: 7px 10px;
  text-align: left;
}

#sidebar h4 p {
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  margin: 0;
  padding: 0 5px 0 5px;
}

#sidebar h4 a {
  border: none;
  text-decoration: none;
  color: black;
}

#sidebar h4 a:hover {
  text-decoration: none;
  color: #d35400;
}

#sidebar .seta {
  position: absolute;
  top: 10px;
  right: 10px;
}

#sidebar .midia {
  width: 100%;
  display: block;
  margin: 5px 0;
  padding: 0;
  text-align: center;
}

#sidebar .midia img {
  margin: 0 2px;
  padding: 0;
}

/******************************************************************************
 * Topbar
 ******************************************************************************/

#topbar {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  font-size: 12px;
  padding: 0;
  margin: 0px 0 10px 0;
  background-color: transparent;
  text-align: center;
}

#topbar .centro {
  display: table;
  position: relative;
  width: 1090px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  z-index: 0;
}

#topbar .titulo {
  float: left;
  display: block;
  margin: 0;
  padding: 70px 0;
  text-decoration: none;
  font: 400 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: none;
  text-transform: uppercase;
  text-align: left;
}

#topbar .grande {
  margin: 0;
  padding: 0;
  text-decoration: none;
  font: 400 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: none;
  text-transform: uppercase;
}

#topbar .pequeno {
  margin: 0;
  padding: 0;
  text-decoration: none;
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: none;
  text-transform: uppercase;
}


#topbar .barra {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: rgb(57,55,56);
  background-repeat: no-repeat; 
  background-size: cover;  
  background-position: center;
}

#topbar .barra:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(255,165,0,0.5);
}

#topbar .topmenu {
  position: absolute;
  bottom: 0;
  display: block;
  border: 0;
  margin: 0 0px 0 0;
  clear: none;
}

#topbar .topmenu a {
  float: left;
  display: inline-block;
  margin: 0 3px 0 0;
  padding: 5px 10px;
  text-decoration: none;
  font: 500 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(76,176,52);
  color: white;
  border: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
}

#topbar .topmenu a:hover {
  background: rgb(47,146,239);
}

#topbar .topmenu a.current_item {
  background: white;
  color: black;
}

#topbar .topmenu a.current_item:hover {
  background: white;
  color: rgb(76,176,52);
}

#topbar .topmenu a.special_item {
  background: rgb(242,240,43);
  color: black;
}

#topbar .topmenu a.special_item:hover {
  background: rgb(242,240,43);
  color: rgb(76,176,52);
}

/******************************************************************************
 * post
 ******************************************************************************/
 
#post {
  float: right;
  position: relative;
  display: block;
  overflow: hidden;
  width: calc( 100% - 220px );
  margin: 0px 0px 40px 0px;
  padding: 15px 0px 15px 0px;
  text-align: left;
  color: black;
}


#post .topo {
  float: right;
  display: block;
  width: 100%;
  margin: 0px 0px 15px 0px;
  padding: 0;
  font: 700 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  background: transparent;
  color: rgb(27,67,129);
}

#post .topo a {
  float: right;
  display: inline-block;
  border: 0;
  height: 30px;
  border-radius: 15px;
  background: black;
  font: 700 10px  'Open Sans', Arial, Helvetica, sans-serif;
  text-decoration: none;
  color: white;
  margin: 5px 0 0 5px;
  text-transform: uppercase;
}

#post .topo img {
  height: 30px;
}

#post .topo a:hover {
  background: rgb(27,67,129);
}

#post .topo a.link {
  height: auto;
  padding: 5px 5px 5px 10px;
  border-radius: 10px;
}

#post .esquerda {
  float: left;
  display: block;
  width: 200px;
  margin: 0 0px 5px 0px;
  padding: 0 0 5px 0;
  text-align: center;
}

#post .icone_barra {
  float: left;
  display: block;
  width: 200px;
  margin: 20px 0 0 0;
  padding: 0;
  text-align: center;
}

#post .icone_barra img {
  height: 20px;
}

#post .icone_barra a {
  display: inline-block;
  margin: 0 3px;
}

#post .programacao {
  float: left;
  display: block;
  width: 200px;
  margin: 30px 0px;
  padding: 0;
}

#post .programacao h2 {
  font: 700 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
  text-align: left;
  text-transform: uppercase;
}

#post .programacao p {
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  margin: 0;
  padding: 0;
  text-align: left;
}

#post .lista_link {
  float: left;
  display: block;
  width: calc( 100% - 20px );
  margin: 20px 0px;
  padding: 5px 10px;
  text-align: left;
  border: solid 1px #ecf0f1;
  font: 700 12px  'Open Sans', Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#post .lista_link a {
  display: inline-block;
  border: 0;
  background: black;
  font: 700 10px  'Open Sans', Arial, Helvetica, sans-serif;
  text-decoration: none;
  color: white;
  margin: 0 0 0 5px;
  padding: 5px 10px;
  text-transform: uppercase;
}

#post .lista_link a:hover {
  background: rgb(27,67,129);
}

#post .direita {
  float: right;
  display: block;
  width: calc( 100% - 220px );
  margin: 0 0px 5px 0px;
  padding: 0 0 5px 0;
}

.tres-colunas{
   -moz-column-count: 3;
   -moz-column-gap: 15px;
   -moz-column-rule: 1px solid #ccc;
   -webkit-column-count: 3;
   -webkit-column-gap: 15px;
   -webkit-column-rule: 1px solid #ccc;
}

#post .barratopo {
  position: relative;
  display: block;
  width: 880px;
  height: 280px;
  margin: 20px 0 10px 0;
  padding: 0;
  background: rgb(57,55,56);
  background-color: rgb(57,55,56);
  background-repeat: no-repeat; 
  background-size: cover;  
  background-position: center;
}

#post .barratopo img {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 880px;
  height: 180px;
  z-index: 3;
}

#post .barratopo span {
  position: absolute;
  display: block;
  bottom: 10px;
  right: 15px;
  font: bold 28px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  z-index: 4;
  text-shadow: 2px 2px black;
}

#post .foto {
  float: left;
  display: block;
  vertical-align: middle;
  text-align: center;
  margin: 0 20px 20px 0;
  padding: 0;
  border: 0; 
  height: 400px;
  width: 400px;
  overflow: hidden;
  background-color: #ecf0f1;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;  
}

#post .logo {
  float: left;
  display: block;
  vertical-align: middle;
  text-align: center;
  margin: 0 20px 20px 0;
  padding: 0;
  border: 0; 
  height: 200px;
  width: 200px;
  overflow: hidden;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;  
}

#post h1 {
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 15px 0 25px 0;
  padding: 0;
  color: rgb(47,146,239);
}

#post h2 {
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 0 5px 0;
  padding: 0;
  color: rgb(57,55,56);
}

#post h3 {
  font: bold 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 0 5px 0;
  padding: 0;
  color: rgb(57,55,56);
}

#post .categoria {
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 5px;
  color: dimgray;
}

#post .categoria a {
  border: none;
  color: dimgray;
}

#post .categoria img {
  float: left;
  width: 200px;
  padding: 0px 10px 5px 0px;
}

#post .title {
  font: 700 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 0 15px 0;
  color: rgb(27,67,129);
}

#post .title a {
  text-decoration: none;
  color: rgb(27,67,129);
}

#post .title a:hover {
  text-decoration: none;
  color: #d35400;
}

#post .title img {
  float: left;
  width: 200px;
  padding: 0px 10px 5px 0px;
}

#post .subtitle {
  margin: 3px 10px 2px 0px;
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  float: right;
}

#post .subtitle a {
  background-color: rgb(27,67,129); 
  color: white;
  display: block;
  border-radius:5px;
  border: solid 1px rgb(27,67,129);
  text-decoration: none;
  text-transform: lowercase;
  padding: 2px 10px 2px 10px;
}

#post .subtitle a:hover {
  background-color: white; 
  color: rgb(27,67,129);
}

#post .subtitle img {
  float: left;
  width: 200px;
  padding: 0px 10px 5px 0px;
}

#post .botaotopo {
  margin: 3px 10px 2px 0px;
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  float: right;
}

#post .botaotopo a {
  background-color: rgb(27,67,129); 
  color: white;
  display: block;
  border-radius:5px;
  border: solid 1px rgb(27,67,129);
  text-decoration: none;
  text-transform: lowercase;
  padding: 2px 10px 2px 10px;
}

#post .botaotopo a:hover {
  background-color: white; 
  color: rgb(27,67,129);
}

#post p {
  font: 400 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0px 0px 10px 0px;
  text-align: justify;
}

#post .cargo {
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 5px;
  color: rgb(27,67,129);
}

#post .nome {
  font: bold 18px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 15px;
  color: dimgray;
}

#post ul {
  font: 400 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  list-style-position: inside;
  margin: 0px 0px 10px 0px;
}

#post .destaque {
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-top: 0;
  margin-bottom: 5px;
  text-decoration: none;
  padding: 0;
  border-top: solid 1px rgb(27,67,129);
  border-bottom: solid 1px rgb(27,67,129);
}

#post .destaque img {
  border: 0px;
  padding-left: 5px;
}

#post .texto {
  font: normal 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-top: 0;
  margin-bottom: 5px;
  padding: 0;
  text-decoration: none;
}

#post .texto p {
  font: normal 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-top: 0;
  margin-bottom: 5px;
  text-decoration: none;
}

#post .texto img {
  border: 0px;
  padding-left: 5px;
}

#post .imagem {
  width: 80%;
  margin: 10px 0px 10px 30px;
  font: normal 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-decoration: none;
  border: solid 5px silver;
  border-radius: 10px;
  padding: 5px;
}

.linkbutton {
  float: right;
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 5px 0px 10px 5px;
}

.linkbutton a {
  float: left;
  display: block;
  border: solid 1px rgb(27,67,129);
  border-radius: 5px;
  text-align: center;
  padding: 2px 10px 2px 10px;
  background-color: rgb(27,67,129);
  color: white;
  text-decoration: none;
  font: bold 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  margin-left: 5px;
}

.linkbutton a:hover {
  background-color: transparent;
  color: rgb(27,67,129);
}

#post .topico {
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  padding: 5px;
}

#post .nometop {
  float: left;
  width: 500px;
  
}

#post .tittop {
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#post .tittop a {
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#post .moderador {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#post .desctop {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#post .estatop {
  margin-left: 500px;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  
}

#post .comentario {
  
}

#post .item {
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  margin-top: 5px;
}

#post .autor {
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  padding: 5px 0;
  clear: both;
}

#post .chamada p {
  font: 500 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 5px 0 15px 0;
  text-decoration: none;
  clear: both;
}

#post .corpo {
  padding: 5px;
}

#post .info {
  display: block;
  font: normal 11px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  border: solid 1px rgb(47,146,239);
  border-radius: 5px;
  padding: 5px;
  margin: 0 0 10px 0;
}

#post .info p {
  font: normal 11px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  padding: 0;
  margin: 0 0 3px 0;
}

#post .intro {
  display: block;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  padding: 0;
  margin: 0 0 10px 0;
}

#post .intro p {
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  padding: 0;
  margin: 0 0 3px 0;
}

#post .painel {
  float: left;
  position: relative;
  display: block;
  width: 340px;
  height: 280px;
  margin: 0;
  padding: 20px 0;
  text-align: center;
  background: rgba(255,255,255,0.2);
}

#post .painel:hover {
  background: rgba(255,255,255,0.5);
}

#bethel_unidades .simbolo {
  display: block;
  width: 100%;
  height: 120px;
  text-align: center;
  margin: 0 0 15px 0;
  padding: 0;
  
  background-color: transparent;
  background-image: url('../img/logo.png');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: contain;  
  
}

#post .painel .simbolo {
  display: block;
  width: 100%;
  height: 120px;
  text-align: center;
  margin: 0 0 15px 0;
  padding: 0;
  
  background-color: transparent;
  background-image: url('../img/logo.png');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: contain;  
}

#post .painel .etiqueta {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 30px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
}

#post .painel .info {
  display: block;
  width: 100%;
  text-align: center;
  font: 500 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(47,146,239);
  margin: 0;
  padding: 0;
  border: 0;
}

#post .painelcircular {
  float: left;
  position: relative;
  display: block;
  width: 25%;
  margin: 0;
  padding: 20px 0;
  text-align: center;
  background: transparent;
}

#post .painelcircular .etiqueta {
  margin: 0;
  padding: 25px;
  display: table-cell;
  width: 250px;
  height: 250px;
  border: 0;
  border-radius: 125px;
  text-align: center;
  vertical-align: middle;
  font: 700 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  background: rgba(27,67,129,0.5);
}

#post .painelcircular .etiqueta:hover {
  color: transparent;
  background: transparent;
}

#post .painelcircular .botao {
  display: table-cell;
  width: 250px;
  height: 250px;
  border: 0;
  border-radius: 125px;
  text-align: center;
  vertical-align: middle;
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
  background-color: transparent;
  background-image: url('../img/projeto.jpg');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;  
}

/******************************************************************************
 * paginacao
 ******************************************************************************/
 
.paginacao {
  float: left;
  width: 100%;
  text-align: center;
  margin: 20px 10px 0px 0px;
  color: dimgray;
  padding: 0px 0px 5px 0px;
  border: none;
  text-align: center;
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

.paginacao b {
  width: 15px;
  margin-right: 2px;
  padding: 2px 5px 2px 5px;
  text-decoration: none;
  text-transform: lowercase;
  text-align: center;
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: rgb(27,67,129);
  color: white;
  border: solid 1px rgb(27,67,129);
}

.paginacao a {
  width: 15px;
  margin-right: 2px;
  padding: 2px 5px 2px 5px;
  text-decoration: none;
  text-transform: lowercase;
  text-align: center;
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: white;
  color: rgb(27,67,129);
  border: solid 1px rgb(27,67,129);
}

.paginacao a:hover {
  margin-right: 2px;
  padding: 2px 5px 2px 5px;
  text-decoration: none;
  text-transform: lowercase;
  text-align: center;
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
  border: solid 1px #d35400;
}

/******************************************************************************
 * formulario
 ******************************************************************************/
 
#formulario {
  float: left;
  overflow: hidden;
  width: 100%;
  margin: 0px 0px 10px 0px;
  padding: 0px 0px 15px 0px;
  color: rgb(57,55,56);
  text-align: left;
  border: none;
  clear: both;
}

#formulario .btopcao {
  margin: 3px 10px 2px 0px;
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  float: right;
}

#formulario .btopcao a {
  background-color: rgb(27,67,129); 
  color: white;
  display: block;
  border-radius:5px;
  border: solid 1px rgb(27,67,129);
  text-decoration: none;
  text-transform: lowercase;
  padding: 2px 10px 2px 10px;
}

#formulario .btopcao a:hover {
  background-color: white; 
  color: rgb(27,67,129);
}

#formulario H4 {
  margin: 5px 0px 5px 0px;
  padding: 0px;
  font: 700 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: rgb(57,55,56);
  text-transform: uppercase;
}

#formulario .subtitle {
  font: bold 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 5px 25px;
  color: rgb(57,55,56);
}

#formulario form {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  border: none;
}

#formulario fieldset {
  float: left;
  width: 100%;
  margin: 0px 0px 20px 0px;
  padding: 0px 0px 15px 0px;
  border: none;
  clear: both;
}

#formulario legend {
  display: block;
  text-align: left;
  padding: 5px 15px 5px 15px;
  margin: 0px 10px 0px 10px;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif  border: solid 2px rgb(57,55,56);
  background: silver;
  color: rgb(27,67,129);
}

#formulario .secao {
  float: left;
  width: 100%;
  display: block;
  margin: 5px 0;
  padding: 0;
  border: 0;
  border-bottom: solid 2px rgb(57,55,56);
  clear: both;
}

#formulario .secao p {
  float: left;
  display: block;
  width: auto;
  margin: 0 0 0 0;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  text-transform: uppercase;
  color: white;
  background-color: rgb(57,55,56);
  padding: 3px 10px;
}

#formulario .campo {
  position: relative;
  float: left;
  display: block;
  padding: 0px;
  margin: 0 5px 0 0;
}

.largura100 {
  width: calc(100% - 5px);
}

.largura95 {
  width: calc(95% - 5px);
}

.largura90 {
  width: calc(90% - 5px);
}

.largura85 {
  width: calc(85% - 5px);
}

.largura80 {
  width: calc(80% - 5px);
}

.largura75 {
  width: calc(75% - 5px);
}

.largura70 {
  width: calc(70% - 5px);
}

.largura65 {
  width: calc(65% - 5px);
}

.largura60 {
  width: calc(60% - 5px);
}

.largura55 {
  width: calc(55% - 5px);
}

.largura50 {
  width: calc(50% - 5px);
}

.largura45 {
  width: calc(45% - 5px);
}

.largura40 {
  width: calc(40% - 5px);
}

.largura35 {
  width: calc(35% - 5px);
}

.largura30 {
  width: calc(30% - 5px);
}

.largura25 {
  width: calc(25% - 5px);
}

.largura20 {
  width: calc(20% - 5px);
}

.largura15 {
  width: calc(15% - 5px);
}

.largura10 {
  width: calc(10% - 5px);
}

.largura5 {
  width: calc(5% - 5px);
}

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

.largura100 {
  width: calc(100% - 5px);
}

.largura95 {
  width: calc(100% - 5px);
}

.largura90 {
  width: calc(100% - 5px);
}

.largura85 {
  width: calc(100% - 5px);
}

.largura80 {
  width: calc(100% - 5px);
}

.largura75 {
  width: calc(100% - 5px);
}

.largura70 {
  width: calc(100% - 5px);
}

.largura65 {
  width: calc(100% - 5px);
}

.largura60 {
  width: calc(100% - 5px);
}

.largura55 {
  width: calc(100% - 5px);
}

.largura50 {
  width: calc(100% - 5px);
}

.largura45 {
  width: calc(100% - 5px);
}

.largura40 {
  width: calc(50% - 5px);
}

.largura35 {
  width: calc(50% - 5px);
}

.largura30 {
  width: calc(50% - 5px);
}

.largura25 {
  width: calc(50% - 5px);
}

.largura20 {
  width: calc(25% - 5px);
}

.largura15 {
  width: calc(25% - 5px);
}

.largura10 {
  width: calc(25% - 5px);
}

.largura5 {
  width: calc(25% - 5px);
}


}

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

.largura40 {
  width: calc(100% - 5px);
}

.largura35 {
  width: calc(100% - 5px);
}

.largura30 {
  width: calc(100% - 5px);
}

.largura25 {
  width: calc(100% - 5px);
}

.largura20 {
  width: calc(100% - 5px);
}

.largura15 {
  width: calc(100% - 5px);
}

.largura10 {
  width: calc(100% - 5px);
}

.largura5 {
  width: calc(100% - 5px);
}


}
#formulario .etiqueta {
  position: relative;
  float: left;
  display: block;
  text-align: left;
  padding: 0;
  margin: 0;
  width: 100%;
  text-transform: uppercase;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#formulario .controle {
  position: relative;
  float: left;
  display: block;
  padding: 0px;
  width: 100%;
  margin: 0;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
}

#formulario .controle img {
  width: 120px;
}

#formulario .readonly {
  position: relative;
  float: left;
  display: block;
  width: 100%;
  padding: 1px 5px ;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  border: solid 1px rgb(57,55,56);
  background-color:lightyellow;
}

#formulario .caixa {
  float: left;
  display: block;
  width: 100%;
  padding: 2px 5px 0 5px;
  font: normal 10px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 2px 0 5px 0;
  border: solid 1px rgb(57,55,56);
  background-color:lightyellow;
}

#formulario .exibicao {
  float: left;
  display: block;
  width: 100%;
  padding: 2px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  border: solid 1px rgb(57,55,56);
  background-color:lightyellow;
}

#formulario .filler {
  float: left;
  display: block;
  width: 100%;
  padding: 2px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 10px;
  border: 0;
  background-color: transparent;
}

#formulario input {
  float: left;
  width: 100%;
  padding: 2px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin-bottom: 5px;
  border: solid 1px rgb(57,55,56);
  background-color:white;
  resize: none;  
}

#formulario textarea {
  float: left;
  width: 100%;
  padding: 2px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin-bottom: 5px;
  border: solid 1px rgb(57,55,56);
  background-color:white;
  resize: none;  
}

#formulario select {
  float: left;
  width: 100%;
  padding: 1px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin-bottom: 5px;
  border: solid 1px rgb(57,55,56);
  background-color:white;
}

#formulario input:hover, select:hover, textarea:hover {
  background-color:#F0FFE6;
}

#formulario .checkbox input[type=checkbox] {
  display: none;
}

#formulario .checkbox label {
  display: inline-block;
  cursor: pointer;
  position: relative;
  padding: 0 0 0 25px;
  font: 400 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 15px 0px 0;
}

#formulario .checkbox label:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  position: absolute;
  left: 0;
  bottom: 1px;
  background-color: white;
  border: solid 2px rgb(27,67,129);
  border-radius: 2px;
}

#formulario .checkbox input[type=checkbox]:checked + label:before {
  content: "";
  font: 400 10px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  line-height: 15px;
  background-color: rgb(27,67,129);
}

#formulario .radio {
  width: 15px;
  font: bold 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
}

#formulario button {
  background-color: rgb(27,67,129);
  color: white;
  text-align: center;
  min-width: 80px;
  border: 0;
  margin: 0px 10px 0px 0px;
  padding: 4px 10px;
  font: bold 12px  'Open Sans', Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#formulario button:hover {
  background-color:rgb(57,55,56);
  color: white;
}

#formulario br {
  clear: left;
}

#formulario .check-select-multiple {
  float: left;
  height: 100px;
  overflow-y: auto;
  padding: 5px;
  width: 100%;
  margin: 0px 0px 5px 0px;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: solid 1px rgb(57,55,56);
  background-color: white;
}

#formulario .check-select-multiple input[type=checkbox] {
  display: none;
}

#formulario .filtro-checkbox {
  float: left;
  width: 100%;
  overflow-y: none;
  padding: 0;
  margin: 0 0 0 0;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: 0;
  height: 13px;
}

#formulario .filtro-checkbox input[type=checkbox] {
  display: none;
}

#formulario .filtro-checkbox label {
  display: inline-block;
  cursor: pointer;
  position: relative;
  padding-left: 25px;
  margin: 0 15px 5px 0;
}

#formulario .filtro-checkbox label:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 10px;
  position: absolute;
  left: 0;
  bottom: 1px;
  background-color: white;
  border: solid 2px rgb(57,55,56);
  border-radius: 2px;
}

#formulario .filtro-checkbox input[type=checkbox]:checked + label:before {
  content: "";
  font-size: 10px;
  color: white;
  text-align: center;
  line-height: 15px;
  background-color: rgb(27,67,129);
}

#formulario a.infobotao {
  float: right;
  background-color: dimgray;
  color: white;
  text-align: center;
  min-width: 80px;
  border: 0;
  margin: 0px 15px 0px 0px;
  padding: 4px 10px;
  font: bold 10px  'Open Sans', Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#formulario a.infobotao:hover {
  background-color:rgb(57,55,56);
  color: white;
}

#formulario span.infobotao {
  float: right;
  background-color: dimgray;
  color: white;
  text-align: center;
  min-width: 80px;
  border: 0;
  margin: 0px 10px 0px 0px;
  padding: 4px 10px;
  font: bold 10px  'Open Sans', Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#formulario span.infobotao:hover {
  background-color:rgb(57,55,56);
  color: white;
}

#formulario table {
  width: 100%;
  border: none;
  margin: 0px 0px 0px 20px;
  cellpadding: 0px;
  border: solid 1px rgb(27,67,129);
}

#formulario th {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(27,67,129);
  padding: 2px 5px 2px 5px;
  color: white;
  text-align: left;
}

#formulario td {
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
  padding: 2px 5px 2px 5px;
  text-align: left;
}

#formulario a {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
}

#formulario a:hover {
  color: #d35400;
}

#formulario img {
  border: none;
  text-decoration: none;
  padding-left: 3px;
}

#formulario .divisor {
  float: left;
  display: block;
  width: 100%;
  clear: both;
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 5px 25px;
  color: rgb(57,55,56);
}

#formulario table#alter td {
  background-color:lightyellow;
}

#formulario table#alter tr.dif td {
  background-color:white;
}

#formulario .ui-spinner {
  margin: 0;
  padding: 0;
  width: 100%;
}

#formulario .ui-spinner-input {
  margin: 0;
  padding: 1px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  border: solid 1px rgb(27,67,129);
  background-color:white;
  width: calc( 100% - 18px );
}

#formulario .ui-spinner-button {
  margin: 0;
  border: 0;
}

#formulario .ui-spinner-up {
  margin: 0;
  background-color: transparent;
  background-image: url('img/seta-up.png');
  background-repeat: no-repeat;
  background-position: center; 
  border: 0;
}

#formulario .ui-spinner-down {
  margin: 0;
  background-color: transparent;
  background-image: url('img/seta-down.png');
  background-repeat: no-repeat;
  background-position: center; 
  border: 0;
}

#formulario .botoeira {
  display: block;
  width: 100%;
  float: right;
  text-align: right;
  margin: 5px 0;
  padding: 0;
}

/* DatePicker Container */
.ui-datepicker {
  background: white;
  width: auto;
  height: auto;
  margin: 5px auto 0;
  font: 700 9px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
}
.ui-datepicker a {
  text-decoration: none;
}
/* DatePicker Table */
.ui-datepicker table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.ui-datepicker-header {
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  display: block;
  height: 30px;
  margin: 0;
  padding: 0;
  background: rgb(27,67,129);
  color: white;
}
.ui-datepicker-title {
  text-align: center;
}
.ui-datepicker-prev, .ui-datepicker-next {
  display: inline-block;
  width: 30px;
  height: 30px;
  text-align: center;
  cursor: pointer;
  line-height: 600%;
  overflow: hidden;
}
.ui-datepicker-prev {
  float: left;
  background-image: url('img/seta-left.png');
  background-repeat: no-repeat;
  background-position: center center;
}
.ui-datepicker-prev:hover {
  background-color: transparent;
  background-image: url('img/seta-left-full.png');
  background-repeat: no-repeat;
  background-position: center center;
}
.ui-datepicker-next {
  float: right;
  background-image: url('img/seta-right.png');
  background-repeat: no-repeat;
  background-position: center center;
}
.ui-datepicker-next:hover {
  background-color: transparent;
  background-image: url('img/seta-right-full.png');
  background-repeat: no-repeat;
  background-position: center center;
}
.ui-datepicker thead {
  background-color: rgb(57,55,56);
  color: white;
  border: 0;
}
.ui-datepicker th {
  text-transform: uppercase;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  border: 0;
  padding: 2px;
}
.ui-datepicker tbody td {
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 2px;
  border: 0;
}
.ui-datepicker td span, .ui-datepicker td a {
  display: inline-block;
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: center;
  width: 30px;
  height: 30px;
  line-height: 30px;
  color: rgb(27,67,129);
}
.ui-datepicker-calendar .ui-state-default {
  background: gainsboro;
  color: rgb(27,67,129);
}
.ui-datepicker-calendar .ui-state-active {
  background: rgb(27,67,129);
  color: white;
}
.ui-datepicker-calendar .ui-state-hover {
  background: rgb(27,67,129);
  color: white;
}
.ui-datepicker-calendar .ui-datepicker-cmd-today {
  background: rgb(57,55,56);
  color: white;
  border: 0;
}

#formulario .captcha {
  float: right;
  border: solid 1px rgb(27,67,129);
  display: block;
  width: 200px;
  margin: 0 5px 0 0;
  padding: 5px;
}

#formulario .captcha #captcha {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 0 5px 0;
}

#formulario .captcha input {
  float: left;
  width: calc( 100% - 40px );
  font: bold 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 5px 0;
  border: solid 1px rgb(27,67,129);
  background-color:white;
  text-align: center;
  resize: none;  
  clear: none;
}

#formulario .captcha #troca_captcha {
  float: right;
  display: block;
  height: 25px;
  width: auto;
  margin: 2px 0 0 0;
  padding: 0;
  clear: none;
}

/******************************************************************************
 * popup
 ******************************************************************************/
 
.popup {
  background: transparent;
  width:350px;
  height:350px;
  padding: 0;
  margin: 0;
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: 0;
}

.popup .link {
  float: right;
  color: black;
  text-decoration: none;
  padding-top: 15px;
  margin-right: 30px;
  display: box;
  width: 30px;
  height: 30px;
}

.popup .link:visited .link:active .link:hover {
  color: black;
  text-decoration : none;
}

.popup .ui-dialog-content {
  border: 0;
  margin: 0;
  padding: 0;
  background: rgb(27,67,129);
  color: white;
}

.popup .ui-dialog-titlebar  {
  background: transparent;
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  padding: 0;
}

.popup .ui-dialog-titlebar-close {
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: white;
  border: solid 2px rgb(27,67,129);
  color: white;
}

.popup .mensagem {
  width: 350px;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  margin: 40px 20px;
}

.popup .mensagem h1 {
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
}

.popup .mensagem p {
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
}

/******************************************************************************
 * filtro
 ******************************************************************************/
 
#filtro {
  float: right;
  display: block;
  width: 100%;
  overflow: hidden;
  margin: 0px 0px 0px 0px;
  color: rgb(57,55,56);
  padding: 0px 0px 0px 0px;
  text-align: left;
  border: none;
}

#filtro H1 {
  float: left;
  margin: 0px 0px 0px 0px;
  padding: 0px;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: rgb(27,67,129);
}

#filtro H1 a {
  border: none;
  color: rgb(27,67,129);
}

#filtro H1 img {
  float: right;
  width: 80px;
  border: 0px;
  padding: 0px 10px 5px 0px;
}

#filtro H2 {
  float: left;
  clear: left;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  text-transform: uppercase;
  margin: 5px 0px 5px 0px;
  color: rgb(57,55,56);
}

#filtro .botao {
  float: right;
  margin: 3px 0px 2px 5px;
  font: 400 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

#filtro .botao a {
  background-color: rgb(27,67,129); 
  color: white;
  display: block;
  border: 0;
  text-decoration: none;
  text-transform: uppercase;
  padding: 3px 10px 3px 10px;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#filtro .botao a:hover {
  background-color: dimgray; 
  color: white;
}

#filtro .botao span {
  background-color: rgb(27,67,129); 
  color: white;
  display: block;
  border: 0;
  text-decoration: none;
  text-transform: uppercase;
  padding: 3px 10px 3px 10px;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#filtro .botao span:hover {
  background-color: dimgray; 
  color: white;
  cursor: pointer; 
}

#filtro .botao img {
  float: left;
  width: 200px;
  padding: 0px 10px 5px 0px;
}

#filtro .icofiltro {
  float: right;
  display: block;
  position: relative;
  margin: 0 3px 0 0;
  padding: 0px;
  height: 16px;
  width: 16px;
  border: solid 1px transparent;
  border-radius: 8px;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 16px;
  color: black;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 300;
  font-size: 12px;
  text-align: center;
}

#filtro .divisor {
  float: left;
  display: block;
  width: 100%;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  text-transform: uppercase;
  margin: 5px 0px 5px 0px;
  color: rgb(57,55,56);
  padding: 0px;
  clear: both;
  border: 0;
}

#filtro .divisor h1 { 
  float: left;
  clear: left;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  text-transform: uppercase;
  margin: 0;
  color: rgb(57,55,56);
}

#filtro .categoria {
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  margin: 0px 0px 5px 0px;
  padding: 0px;
  clear: left;
}

#filtro .categoria a {
  border: none;
  color: dimgray;
}

#filtro .categoria img {
  float: left;
  width: 200px;
  padding: 0px 10px 5px 0px;
}

#filtro p {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0px 15px 5px 0px;
  text-align: left;
}

#filtro ul {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-top: 0;
  margin-bottom: 0px;
}

#filtro .ui-tabs {
  border: solid 1px #ecf0f1;
  width: calc( 100% - 12px );
  margin: 0;
  padding: 5px;
  background: transparent; 
}

#filtro .ui-tabs-panel {
  background: transparent;
  padding: 0;
  border: 0; 
  margin: 5px 0 0 0 ;
  overflow: auto;
}

#filtro .ui-widget-header { 
  background: transparent; 
  border: none; 
}
#filtro .ui-tabs-nav {
  background: transparent; 
  display: table-cell;
  vertical-align: middle;
  padding: 0;
  margin: 0;
}

#filtro .ui-tabs-nav img {
  margin: 0 5px 0 0;
  padding: 0;
  height: 10px;
}

#filtro .ui-tabs-nav .ui-state-default { 
  padding: 3px;
  margin: 0 3px 0 0;
  background: white;
  color: rgb(57,55,56);
  border: 0;
} 
#filtro .ui-tabs-nav .ui-state-active { 
  padding: 3px;
  margin: 0 3px 0 0;
  background: rgb(27,67,129);
  color: white;
  border: 0;
} 
#filtro .ui-tabs-nav .ui-state-default a { 
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
  text-transform: uppercase;
  border: 0;
} 
#filtro .ui-tabs-nav .ui-state-active a { 
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  text-transform: uppercase;
  border: 0; 
}

/******************************************************************************
 * sidepanel
 ******************************************************************************/

#sidepanel {
  float: left;
  width: 175px;
  font-size: 12px;
  padding: 0;
  margin: 0px 0 20px 0;
  background-color: transparent;
  border: 0;
}

#sidepanel .topo {
  display: block;
  width: 175px;
  height: 25px;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

#sidepanel .divisor {
  display: block;
  width: 175px;
  height: 10px;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}
#sidepanel .info {
  display: block;
  margin: 0 0 5px 0;
  padding: 0 0 5px 0;
  text-align: left;
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  border: 0;
  border-bottom: solid 1px rgb(47,146,239);
}
#sidepanel ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#sidepanel li {
  padding: 0;
}

#sidepanel h1 {
  display: block;
  border: 0;
  width: 100%;
  margin: 0 0 3px 0;
  padding: 5px 0;
  text-align: center;
  text-transform: uppercase;
  background: rgb(27,67,129);
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#sidepanel h2 {
  display: block;
  border: 0;
  width: 100%;
  margin: 0 0 3px 0;
  padding: 3px 0;
  text-align: center;
  text-transform: uppercase;
  background: rgb(57,55,56);
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#sidepanel p {
  margin: 0 0 5px 0;
  padding: 0 0 5px 0;
  text-align: left;
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  border: 0;
}

#sidepanel a {
  border: none;
  text-decoration: none;
  color: #d35400;
}

#sidepanel a:hover {
  text-decoration: none;
  color: rgb(27,67,129);
}

#sidepanel .seta {
  float: right;
}

/******************************************************************************
 * rolagem
 ******************************************************************************/

#rolagem  {
  float: left;
  display: block;
  align: center;
  position: relative;
  width: 100%;
  padding: 5px;
  margin: 0 0 0 0;
  background: white;
  border: solid 1px gainsboro; 
  clear: both;
  overflow: hidden;
  height: calc( 90vh - 150px );
}

#rolagem .scroll {
  float: left;
  display: block;
  position: relative;
  overflow: auto;
  width: 100%;
  height: 100%;
  margin: 0;
  background: white;
  padding: 0px 0px 0px 0px;
  border: solid 1px gainsboro;
  clear: both;
}

#rolagem .scroll img {
  border: none;
  text-decoration: none;
  padding-left: 3px;
}

#rolagem .scroll a {
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
}

#rolagem .scroll a:hover {
  color: rgb(27,67,129);
}

#rolagem table {
  display: table;
  border-collapse: separate;
  border-spacing: 0;
  border-color: gray;
  width: 100%;
  position: relative;
  border: 0;
  margin: 0px 0px 0px 0px;
}

#rolagem thead {
  display: table-header-group;
  vertical-align: middle;
  border-color: inherit;
}

#rolagem tbody {
  display: table-row-group;
  vertical-align: middle;
  border-color: inherit
}

#rolagem tfoot {
  display: table-footer-group;
  vertical-align: middle;
  border-color: inherit
}

#rolagem table > tr {
  vertical-align: middle;
  background-color: white;
}

#rolagem tbody tr:nth-child(odd) {
  background-color: lightyellow;
}

#rolagem tbody tr:hover {
  background-color: #8EFFC1;
}

#rolagem col {
  display: table-column
}

#rolagem colgroup {
  display: table-column-group
}

#rolagem tr {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit
}

#rolagem td, th {
  display: table-cell;
  vertical-align: inherit
}

#rolagem td {
  cursor: hand;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
  padding: 3px 5px;
}

#rolagem table.doc {
  border-spacing: 2px;
}

#rolagem td.volume {
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: ;
  color: white;
  border: 0;
  border-radius: 5px;
  margin-bottom: 2px;
}

#rolagem td.secao {
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: #bdc3c7;
  color: rgb(57,55,56);
  border: 0;
  border-radius: 5px;
  margin-bottom: 2px;
}

#rolagem td.espec {
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: #ecf0f1;
  color: rgb(57,55,56);
  border: 0;
  border-radius: 5px;
  margin-bottom: 2px;
}

#rolagem a.btacao {
  float: right;
  display: block;
  padding: 2px 10px;
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: ;
  color: white;
  border: 0;
  border-radius: 5px;
  text-decoration: none;
  text-transform: uppercase;
}

#rolagem a.btacao:hover {
  background: ;
  color: white;
}

#rolagem a.icoacao {
  float: right;
  display: block;
  padding: 0;
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: 0;
  text-decoration: none;
  text-transform: uppercase;
}

#rolagem a.icoacao:hover {
  color: white;
}

#rolagem th {
  font: 700 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  background: gainsboro;
  padding: 2px 5px;
  color: rgb(57,55,56);
  text-align: left;
}

#rolagem th.vazio {
  text-transform: uppercase;
  background: transparent;
  padding: 0;
}

#rolagem th.header { 
  display: table-cell;
  width: auto;
  background-image: url(img/bg.gif);     
  cursor: pointer; 
  font-weight: 700; 
  background-repeat: no-repeat; 
  background-position: center left; 
  padding-left: 20px; 
  border-right: 1px solid white; 
  margin-left: -1px; 
} 

#rolagem .pequeno {
  font: 300 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#rolagem th.headerSortUp { 
  background-image: url(img/asc.gif);
} 

#rolagem th.headerSortDown { 
  background-image: url(img/desc.gif);
} 

#rolagem .scroll .comentario {
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

/******************************************************************************
 * rolagembloco
 ******************************************************************************/

#rolagembloco  {
  float: left;
  display: block;
  align: center;
  position: relative;
  width: 100%;
  padding: 5px;
  margin: 0 0 0 0;
  background: white;
  border: solid 1px gainsboro; 
  clear: both;
  overflow: hidden;
  height: calc( 90vh - 150px );
}

#rolagembloco .scroll {
  float: left;
  display: block;
  position: relative;
  overflow: auto;
  width: 100%;
  height: 100%;
  margin: 0;
  background: white;
  padding: 0px 0px 0px 0px;
  border: solid 1px gainsboro;
  clear: both;
}

#rolagembloco .scroll img {
  border: none;
  text-decoration: none;
  padding-left: 3px;
}

#rolagembloco .scroll a {
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
}

#rolagembloco .scroll a:hover {
  color: rgb(27,67,129);
}

#rolagembloco table {
  display: table;
  border-collapse: separate;
  border-spacing: 0;
  border-color: gray;
  width: 100%;
  position: relative;
  border: 0;
  margin: 0px 0px 0px 0px;
}

#rolagembloco thead {
  display: table-header-group;
  vertical-align: middle;
  border-color: inherit;
}

#rolagembloco tbody {
  display: table-row-group;
  vertical-align: middle;
  border-color: inherit
}

#rolagembloco tfoot {
  display: table-footer-group;
  vertical-align: middle;
  border-color: inherit
}

#rolagembloco table > tr {
  vertical-align: middle;
}

#rolagembloco col {
  display: table-column
}

#rolagembloco colgroup {
  display: table-column-group
}

#rolagembloco tr {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit
}

#rolagembloco td, th {
  display: table-cell;
  vertical-align: inherit
}

#rolagembloco td {
  cursor: hand;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
  padding: 3px 5px;
}

#rolagembloco table.doc {
  border-spacing: 2px;
}

#rolagembloco td.volume {
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: ;
  color: white;
  border: 0;
  border-radius: 5px;
  margin-bottom: 2px;
}

#rolagembloco td.secao {
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: #bdc3c7;
  color: rgb(57,55,56);
  border: 0;
  border-radius: 5px;
  margin-bottom: 2px;
}

#rolagembloco td.espec {
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: #ecf0f1;
  color: rgb(57,55,56);
  border: 0;
  border-radius: 5px;
  margin-bottom: 2px;
}

#rolagembloco a.btacao {
  float: right;
  display: block;
  padding: 2px 10px;
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: ;
  color: white;
  border: 0;
  border-radius: 5px;
  text-decoration: none;
  text-transform: uppercase;
}

#rolagembloco a.btacao:hover {
  background: ;
  color: white;
}

#rolagembloco a.icoacao {
  float: right;
  display: block;
  padding: 0;
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: 0;
  text-decoration: none;
  text-transform: uppercase;
}

#rolagembloco a.icoacao:hover {
  color: white;
}

#rolagembloco th {
  font: 700 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  background: gainsboro;
  padding: 2px 5px;
  color: black;
  text-align: left;
}

#rolagembloco th.vazio {
  text-transform: uppercase;
  background: transparent;
  padding: 0;
}

#rolagembloco th.header { 
  display: table-cell;
  width: auto;
  background-image: url(img/bg.gif);     
  cursor: pointer; 
  font-weight: 700; 
  background-repeat: no-repeat; 
  background-position: center left; 
  padding-left: 20px; 
  border-right: 1px solid white; 
  margin-left: -1px; 
} 

#rolagembloco .pequeno {
  font: 300 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#rolagembloco th.headerSortUp { 
  background-image: url(img/asc.gif);
} 

#rolagembloco th.headerSortDown { 
  background-image: url(img/desc.gif);
} 

#rolagembloco .scroll .comentario {
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}


#rolagembloco table {
  width: 100%;
  border: 0;
  border-spacing: 2px;
  border-collapse: separate;
  margin: 0;
  padding: 0px;
}

#rolagembloco tr {
  background: transparent;
  padding: 0;
  margin: 0;
}

#rolagembloco th {
  font: 700 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: gainsboro;
  padding: 2px 5px;
  margin: 0;
  color: black;
  text-align: left;
  text-transform: uppercase;
}

#rolagembloco td {
  position: relative;
  background: whitesmoke;
  border: solid 1px gainsboro;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  color: black;
  text-transform: none;
}

#rolagembloco td.oculta {
  background: transparent;
  border: solid 1px transparent;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  margin: 0;
  color: transparent;
  text-transform: none;
}

#rolagembloco td.total {
  background: whitesmoke;
  border: solid 1px gainsboro;
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  margin: 0;
  color: rgb(57,55,56);
  text-transform: none;
}

#rolagembloco td.titulo {
  background: rgb(27,67,129);
  border: solid 1px rgb(27,67,129);
  border-radius: 5px;
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 3px 3px 3px;
  text-align: center;
  color: white;
}

#rolagembloco td.centro {
  background: whitesmoke;
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  color: rgb(57,55,56);
  text-align: center;
}

#rolagembloco td.direita {
  background: whitesmoke;
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  color: rgb(57,55,56);
  text-align: right;
}

#rolagembloco td.mini {
  background: whitesmoke;
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  text-align: left;
  color: rgb(57,55,56);
}

#rolagembloco .comentario {
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#rolagembloco p {
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 5px 0px;
  padding: 0px;
  color: black;
}

#rolagembloco td p {
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 0px 0px;
  padding: 0px;
  color: black;
}

#rolagembloco span.titulo {
  display: inline-block;
  border: 0;
  padding: 0;
  margin: 0;
  font: 700 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

#rolagembloco span.tag {
  display: inline-block;
  border: 0;
  border-radius: 5px 0;
  background: #C5D5D6;
  padding: 2px 10px;
  margin: 1px 2px 1px 0;
  font: 400 9px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

/******************************************************************************
 * rolagempainel
 ******************************************************************************/

#rolagempainel  {
  float: left;
  display: block;
  align: center;
  position: relative;
  width: 100%;
  padding: 5px;
  margin: 0 0 0 0;
  background: white;
  border: 0; 
  clear: both;
  overflow: hidden;
  height: calc( 90vh - 150px );
}

#rolagempainel .scroll {
  float: left;
  display: block;
  position: relative;
  overflow: auto;
  width: 100%;
  height: calc( 100% - 25px );
  margin: 0;
  background: white;
  padding: 0px 0px 0px 0px;
  border: 0;
  clear: both;
}

#rolagempainel .scroll img {
  border: none;
  text-decoration: none;
  padding-left: 3px;
}

#rolagempainel .scroll a {
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
}

#rolagempainel .scroll a:hover {
  color: rgb(27,67,129);
}

#rolagempainel table {
  display: table;
  border-collapse: separate;
  border-spacing: 0;
  border-color: gray;
  width: 100%;
  position: relative;
  border: 0;
  margin: 0px 0px 0px 0px;
}

#rolagempainel table > tr {
  vertical-align: middle;
}

#rolagempainel col {
  display: table-column
}

#rolagempainel colgroup {
  display: table-column-group
}

#rolagempainel tr {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit
}

#rolagempainel td, th {
  display: table-cell;
  vertical-align: inherit
}

#rolagempainel td,th {
  border: 0;
  padding: 3px 5px;
}

#rolagempainel .scroll .comentario {
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

.span_dash {
  float: none;
  display: inline;
  font: 500 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

.scroll_fecho {
  float: left;
  display: table;
  position: relative;
  width: 100%;
  margin: 5px 0 0 0;
  background: transparent;
  padding: 5px;
  clear: both;
  border: solid 1px gainsboro; 
}

.scroll_botoeira {
  position: relative;
  float: left;
  display: block;
  margin: 0;
  padding: 0;
  text-align: left;
  border: ; 
  background-color: transparent;
}

.scroll_botao {
  float: right;
  display: block;
  margin: 0 5px 0px 0px;
  padding: 0;
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  border: 0;
  color: white;
}

.scroll_botao a {
  display: inline-block;
  margin-left: 5px;
  border: 0;
  background-color: #657576; 
  color: white;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-decoration: none;
  text-transform: uppercase;
  padding: 2px 8px 2px 8px;
}

.scroll_botao a:hover {
  background-color: rgb(47,146,239); 
  color: white;
}

.scroll_botao span {
  margin-left: 5px;
  border: 0;
  background-color: #657576; 
  color: white;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-decoration: none;
  text-transform: uppercase;
  padding: 2px 8px 2px 8px;
 
}

.scroll_botao span:hover {
  background-color: rgb(47,146,239); 
  color: white;
  cursor: pointer;
}

.scroll_botao img {
  float: left;
  height: 16px;
  padding: 0px 10px 5px 0px;
}

.scroll_btdivisor {
  float: right;
  margin: 5px 0px 0px 0px;
  display: block;
  width: 20px;
  height: 10px;
  padding: 0;
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

.scroll_legenda {
  float: right;
  display: table;
  vertical-align: middle;
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  text-align: right;
  border: 0;
}

.scroll_legenda .icone {
  float: left;
  margin: 0 0 0 5px;
  padding: 2px 0px 0 0;
  display: table-cell;
  vertical-align: middle;
  border: 0;
}

.scroll_legenda .texto {
  float: right;
  display: table-cell;
  vertical-align: middle;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  border: 0;
  margin:0;
  padding: 0 5px 0 0;
  text-align: left;
}

/*************************************************************************************************
 *
 *  arvore
 *
 *************************************************************************************************/
.arvore {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  background: white;
  border: solid 1px rgb(57,55,56);
  overflow: auto;
  height: 500px;
}

.arvore table {
  display: table;
  border-collapse: separate;
  border-spacing: 0;
  border-color: gray;
  width: 100%;
  position: relative;
  margin: 0px 0px 0px 0px;
}
.arvore table > tr {
  vertical-align: middle;

}
.arvore tr {
  width: 100%;
  display: table-row;
  width: 100%;
  vertical-align: inherit;
  border-color: inherit
}
.arvore td, th {
  display: table-cell;
  vertical-align: inherit
}
.arvore td {
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
  padding: 2px 5px 2px 5px;
  vertical-align: middle;
}

.arvore td img {
  border: 0;
  padding: 0;
  margin: 0 2px;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  filter: alpha(opacity=40);
  -moz-opacity:0.4;
  -khtml-opacity: 0.4;
  opacity: 0.4;
}

.arvore tr:hover img {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity:1.0;
  -khtml-opacity: 1.0;
  opacity: 1.0;
}

.arvore .titular td {
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;

}
.arvore .titular td a {
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}
.arvore .titular td a:hover {
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
}
.arvore .dependente td {
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: transparent;
}
.arvore .dependente td a {
  text-decoration: none;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}
.arvore .dependente td a:hover {
  text-decoration: none;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
}

.arvore td.nome {
  width: 60%;
}

.arvore td.categoria {
  width: 40%;

}

/******************************************************************************
 * dialogo
 ******************************************************************************/

.dialogo {
  border: 0;
  background: transparent;
  padding: 10px;
  margin: 0;
  display: none;
}

.dialogo label, input, textarea { 
  display:block; 
}
.dialogo form {
  width: 100%;
  border: 0;
  margin: 10px 0;
  padding: 0;
  background: transparent;
  color: black;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif; 
}
.dialogo fieldset { 
  padding: 0; 
  border:0; 
  margin:0; 
}
.dialogo label {
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  color: black;
  padding: 0;
  text-transform: uppercase;
  margin: 5px 0; 
}
.dialogo textarea { 
  width: 100%;
  height: 150px;
  margin: 0;
  font: 700 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 15px;
  border: solid 1px #ecf0f1;
  background: #ecf0f1;
  color: black;
}
.dialogo input[type=text] { 
  width: calc( 100% - 20px );
  margin: 0 5px;
  font: 700 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  padding: 15px;
  border: solid 1px rgb(27,67,129);
  color: black;
}
.dialogo select { 
  width: calc( 100% - 10px );
  margin: 0 5px; 
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  padding: 5px;
  border: solid 1px rgb(27,67,129);
  color: rgb(57,55,56);
}
.dialogo select option { 
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  padding: 5px;
  color: rgb(57,55,56);
}
.dialogo h1 {
  display: block;
  text-align: center;
  text-transform: uppercase;
  font: 700 15px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(27,67,129);
  color: white;
  padding: 10px 0; 
  margin: 0 0 10px 0; 
}
.dialogo h2 {
  display: block;
  text-align: center;
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  padding: 10px; 
  margin: auto 0; 
}

.dialogo .ui-dialog {
  display: block;
  width: 850px;
  height: 500px;
  border: solid 1px white;
}

.dialogo .ui-dialog-content {
  background: white;
  margin: 0;
  padding: 40px 20px;
  font: 700 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-align: center;
}

.dialogo .ui-dialog-titlebar  {
  position: relative;
  display: block;
  background: rgb(27,67,129);
  background-image: url(img/logo-header.png);
  background-position: left center;
  background-repeat: no-repeat;
  font: 700 14x  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  padding: 5px 10px; 
  margin: 0;
  text-transform: uppercase;
  border: 0;
}

.dialogo .ui-dialog-titlebar-title  {
  display: block;
}

.dialogo .ui-dialog-titlebar-close  {
  position: absolute;
  z-index: 5000;
  background: black;
  background-image: url(img/close.png);
  background-position: center center;
  display: block;
  top: 0px;
  right: -10px;
  border: solid 3px white;
  width:30px;
  height: 30px;
  border-radius: 15px;
}

.dialogo .ui-dialog-buttonpane {
  background: white;
  text-align: center;
  margin: 0;
  padding: 0 10px 10px 0;
  border-bottom: solid 10px rgb(27,67,129);
  border: 0;
}

.dialogo .ui-dialog-buttonset {
  text-align: center;
  margin: 0;
}

.dialogo .ui-dialog-buttonset button {
  background: rgb(27,67,129);
  color: black;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  padding: 5px 15px;
  border: 0;
  border-radius: 5px;
}

.dialogo .ui-dialog-buttonset button:hover {
  background: black;
  color: white;
}

.dialogo #infotitulo {
  display: block;
  text-align: center;
  text-transform: uppercase;
  font: 700 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(27,67,129);
  color: white;
  padding: 0; 
  margin: 0 0 5px 0; 
}

.dialogo #infoconteudo {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  padding: 10px; 
  margin: auto 0; 
}

.dialogo #infoconteudo p {
  display: block;
  text-align: left;
  font: 500 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  padding: 0; 
  margin: 0; 
  clear: both;
}

.dialogo .infodata {
  float: left;
  display: block;
  margin: 0 0 5px 0;
  padding: 0;
  clear: both;
}

.dialogo .infodata .icone {
  float: left;
  width: 15px;
  text-align: center;
  display: block;
  border: 0;
  clear: none;
}

.dialogo .infodata .icone img {
  margin: 2px 0 0 0;
  border: 0;
}

.dialogo .infodata .texto {
  float: left;
  display:  block;
  margin: 0 0 0 5px;
  padding: 0;
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: justify;
  clear: none;
}

.dialogo #infodescricao {
  display: block;
  text-align: left;
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  padding: 5px; 
  margin: 5px 0; 
  border: solid 1px rgb(27,67,129);
  clear: both;
}

/******************************************************************************
 * ficha
 ******************************************************************************/
 
#ficha {
  align: right;
  width: 100%;
  margin: 10px 0px 10px 0px;
  border: 0;
  background: transparent;
  padding: 0px 0px 0px 0px;
  clear: both;
}

#ficha h1 {
  position: relative;
  float: left;
  width: 100%;
  padding: 0px;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  text-transform: uppercase;
  margin: 5px 0px 5px 0px;
  color: rgb(57,55,56);
}

#ficha .divisor {
  position: relative;
  float: left;
  display: block;
  width: 100%;
  margin: 10px 0px;
  padding: 0px;
  font: 700 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: rgb(57,55,56);
}

#ficha .botao {
  float: right;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0px 0px 0px 0px;
}

#ficha .botao a {
  float: right;
  display: block;
  border: 0;
  margin: 3px 0 0 3px;
  text-align: center;
  padding: 3px 10px 3px 10px;
  background-color: dimgray;
  color: white;
  text-decoration: none;
  font: 500 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#ficha .botao a:hover {
  background-color: rgb(27,67,129);
  color: white;
}

#ficha .tdbotao {
  border: solid 1px rgb(27,67,129);
  border-radius: 5px;
  text-align: center;
  padding: 2px 10px 2px 10px;
  background-color: rgb(27,67,129);
  color: white;
  text-decoration: none;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#ficha .tdbotao:hover {
  background-color: transparent;
  color: rgb(27,67,129);
}

#ficha .tdbotao a {
  text-align: center;
  color: white;
  text-decoration: none;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#ficha .tdbotao a:hover {
  color: rgb(27,67,129);
}

#ficha table {
  position: relative;
  clear: both;
  float: left;
  display: table;
  width: 100%;
  border: none;
  margin: 0px auto;
  padding: 0;
  border-collapse: separate;
}

#ficha tr {
  border: 0;
}

#ficha th {
  background: transparent;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  text-align: left;
  border: 0;
  padding: 0;
  margin: 0;
}

#ficha td {
  border: 0;
  font: 400 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  padding: 2px 5px;
  margin: 0 0 2px 0;
  background: rgb(245,245,245);
  border: solid 1px gainsboro;
}

#ficha td p {
  font: 400 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 5px 0px;
  padding: 0px;
  color: rgb(57,55,56);
}

#ficha td ul {
  list-style: square;
  list-style-position: inside;
  margin: 0 0 5px 5px;
  padding-left: 1em;
  text-indent: -1em;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#ficha td ul li {
  font: 400 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0;
  padding: 0;
}

#ficha td.titulo {
  background: rgb(27,67,129);
  border: solid 1px rgb(27,67,129);
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 3px 3px 3px;
  text-align: center;
  color: white;
}

#ficha td.centro {
  border: solid 1px rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  color: rgb(57,55,56);
  text-align: center;
}

#ficha td.direita {
  border: solid 1px rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  color: rgb(57,55,56);
  text-align: right;
}

#ficha td.mini {
  border: solid 1px rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  text-align: left;
  color: rgb(57,55,56);
}

#ficha td p {
  font: 400 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 3px 0px;
  padding: 0px;
  color: rgb(57,55,56);
}

#ficha a {
  text-decoration: none;
  color: rgb(27,67,129);
}

#ficha img {
  border: none;
  text-decoration: none;
  padding-left: 3px;
}

#ficha .banner {
  float: left;
  position: relative;
  display: block;
  padding: 0px 2px;
  margin: 10px 0 10px 0;
  border: 0;
  width: 100%;
  clear: both;
}

#ficha .banner img {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
}

#ficha .banner .titulo {
  position: absolute;
  top: 10px;
  right: 20px;
  width: 50%;
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: right;
}

/******************************************************************************
 * anexo
 ******************************************************************************/
 
.anexo {
  align: center;
  width: 700px;
  margin-left: 10px;
  margin-bottom: 10px;
  border: 0;
  background: transparent;
  padding: 0px 0px 0px 0px;
}

.anexo .title {
  margin: 20px 0px 0px 20px;
  padding: 0px;
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: rgb(57,55,56);
}

.anexo table {
  width: 80%;
  border: none;
  margin: 0px auto;
  padding: 0px;
  cellpadding: 0px;
}

.anexo th {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  background: transparent;
  padding: 2px 2px 2px 2px;
  color: rgb(57,55,56);
  text-align: center;
}

.anexo td {
  background: whitesmoke;
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  text-align: left;
  color: rgb(57,55,56);
}

.anexo td.link {
  background: rgb(57,55,56);
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  text-align: center;
  color: white;
}

.anexo td.link:hover {
  border: solid 1px #d35400;
  background: #d35400;
  color: white;
}

.anexo td.link a {
  text-decoration: none;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

.anexo td.link a:hover {
  text-decoration: none;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

.anexo a {
  text-decoration: none;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

.anexo img {
  border: none;
  text-decoration: none;
  padding-left: 3px;
}

.anexo table#alter td {
  background:transparent;
}

.anexo table#alter tr.dif td {
  background:#F0FFE6;
}

/******************************************************************************
 * lista
 ******************************************************************************/
 
#lista {
  display: block;
  width: 100%;
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
  clear: both;
}

#lista .title {
  margin: 20px 0px 0px 0px;
  padding: 0px;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: rgb(57,55,56);
}

#lista .subtitle {
  margin: 3px 10px 2px 0px;
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  float: right;
}

#lista .subtitle a {
  background-color: rgb(27,67,129); 
  color: white;
  display: block;
  border-radius:5px;
  border: solid 1px rgb(27,67,129);
  text-decoration: none;
  text-transform: lowercase;
  padding: 2px 10px 2px 10px;
}

#lista .subtitle a:hover {
  background-color: white; 
  color: rgb(27,67,129);
}

#lista table {
  width: 100%;
  border: none;
  border-collapse:collapse;
  margin: 0 0 5px 0;
  padding: 0;
}

#lista td {
  background: rgb(27,67,129);
  border: solid 1px rgb(57,55,56);
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  margin: 0;
  text-align: left;
  color: white;
}

#lista a {
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#lista a:hover {
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
}

#lista .titulo a {
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#lista .titulo a:hover {
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
}

#lista .categoria {
  background: white;
  color: rgb(57,55,56);
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: center;
  margin: 0;
  padding: 2px;
}

#lista .categoria a {
  float: left;
  display: block;
  margin: 0 3px 0 0;
  padding: 2px 10px;
  text-decoration: none;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(47,146,239);
  color: white;
}

#lista .categoria a:hover {
  background: rgb(57,55,56);
  color: white;
}

#lista .formato {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: center;
  text-transform: uppercase;
}

#lista .tamanho {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
}

#lista .info {

  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

#lista .status {
  color: rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: center;
}

#lista .descricao {
  background: white;
  color: rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

#lista .link {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 3px 10px 3px 10px;
  text-align: center;
  border: solid 1px #d35400;
  border-radius: 5px;
  background: #d35400;
  color: white;
}

#lista td.link a {
  text-decoration: none;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#lista td.link a:hover {
  text-decoration: none;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#lista .apoio {
  float: left;
  width: 70%;
  margin-left: 40px;
  padding: 0;
}

#lista img {
  float: left;
  border: 1px;
  text-decoration: none;
  margin: 0px;
  padding: 5px 10px 5px 0px;
  height: 50px;
}

#lista .assunto {
  width: 700px;
  border: solid 1px rgb(57,55,56);
  border-radius: 5px;
  text-decoration: none;
  margin: 30px 0 0 20px;
  padding: 0;
}

#lista .ident {
  border: 0;
  border-radius: 4px 4px 0 0;
  margin: 0;
  padding: 5px;
  background: rgb(27,67,129);
}

#lista .titassunto {
  
}

#lista .tituloas {
  width: 500px;
  float: left;
  font: bold 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#lista .tituloas a {
  font: bold 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
}

#lista .qtdpost {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#lista .titdesc {
  clear: both;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  
}

#lista #postagem {

}

#lista .topico {
  border-top: solid 1px rgb(57,55,56);
  padding: 5px;
}

#lista .nometop {
  float: left;
  width: 500px;
  
}

#lista .tittop {
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#lista .tittop a {
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#lista .moderador {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#lista .desctop {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#lista .estatop {
  margin-left: 500px;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  
}

#lista .dtcria {

}

#lista .nvisto {
 
}

#lista .ncoment {

}

#lista .dtcoment {

}

#lista .mais {
  border-top: solid 1px rgb(57,55,56);
  padding: 3px;
  background: rgb(27,67,129);
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
  text-align: right;
}

#lista .mais a {
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
}

#lista .blog {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  height: 120px;
  border: 0;
  border-top: solid 3px rgb(27,67,129);
  border-bottom: solid 1px rgb(27,67,129);
  margin: 0 0 6px 0;
  color: dimgray;
  padding: 0px;
  text-align: center;
  background: transparent;
}

#lista .blog:hover {
  background: white;
  border-top: solid 3px #d35400;
  border-bottom: solid 1px #d35400;
}

#lista .blog .data {
  float: left;
  display: block;
  width: 10%;
  text-align: center;
}

#lista .blog .info {
  float: right;
  display: block;
  width: 89%;
}

#lista .blog .dia {
  display: block;
  width: 100%;
  text-align: center;
  font: bold 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#lista .blog .mes {
  display: block;
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#lista .blog .ano {
  display: block;
  width: 100%;
  text-align: center;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#lista .blog a {
  float: left;
  position: relative;
  display: block;
  text-decoration: none;
  position: relative;
  width: 200px;
  height: 200px;
  border: 0;  
  margin: 0 0 6px 0;
}

#lista .blog a:hover {
  background: rgba(239,161,72,0.5);
}

#lista .blog .titulo {
  float: left;
  width: 100%;
  height: 30px;
  margin: 5px 0 0 0;
  padding: 0;
  border: 0;
  text-align: left;
}

#lista .blog .titulo a {
  text-decoration: none;
  font: normal 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#lista .blog .titulo a:hover {
  text-decoration: none;
  color: #d35400;
}

#lista .blog .categoria {
  float: left;
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 3px 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

#lista .blog .categoria a {
  display: block;
  width: auto;
  height: auto;
  margin: 0 3px 0 0;
  padding: 2px 10px;
  text-decoration: none;
  font: bold 11px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(47,146,239);
  color: white;
}

#lista .blog .categoria a:hover {
  background: rgb(57,55,56);
  color: white;
}

#lista .blog .descricao {
  float: left;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

/******************************************************************************
 * 
 ******************************************************************************/
 
.msgerro {
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 2px 5px 2px 5px;
  color: red;
  text-align: center;
  width: 100%;
}

.msgsimples {
  display: block;
  width: 70%;
  margin: 0 auto;
  font: bold 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 15px;
  color: red;
  border: solid 2px red;
  text-align: center;
  clear: both;
}

#errorpanel  {
  //float: left;
  display: block;
  margin: 5px auto;
  background-color: rgba(255,0,0,0.5);
  border: solid 3px transparent;
  border-radius: 10px;
  width: 90%;
  padding: 10px 10px 10px 20px;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#errorpanel h2 {
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 10px;
  color: white;
}

#errorpanel h1 {
  font: normal 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-bottom: 5px;
}

#errorpanel p {
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0px 0px 5px 0px;
}

#file_browse_wrapper {
  position: relative;
  float: right;
  display: block;
  width: 93px;
  height: 28px;
  background: url('img/file_browse_normal.png') 0 0 no-repeat;
  border:none;
  overflow:hidden;
  margin: 2px 5px 0 0;
}

#file_browse_wrapper:hover {
  background: url('img/file_browse_hover.png') 0 0 no-repeat;
}

#file_browse_wrapper:active {
  background: url('img/file_browse_pressed.png') 0 0 no-repeat;
}

#file_browse_wrapper .file_browse{
  position: absolute;
  top: 2px;
  right: 2px;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
}

#calendario {
  position: relative;
  margin: 0 0 20px 20px;
  width: 1003px;
  border: 0;
  background: transparent;
  clear: both;
}

#calendario .header {
  position: relative;
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 5px 0;
  border: 0;
  clear: none;
}

#calendario .header h1 {
  position: relative;
  display: table;
  margin: 0 auto;
  width: auto;
  text-align: center;
  text-transform: uppercase;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  padding: 0;
}
#calendario .header h2 {
  position: relative;
  display: block;
  margin: 0 auto;
  width: auto;
  text-align: center;
  text-transform: uppercase;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  padding: 0;
}

#calendario .ano_prev {
  position: absolute;
  top: 0;
  left: 0;
  display: table;
  width: 80px;
  height: 30px;
  margin: 0 0 0 0;
  padding: 0;
  border: 0;
  text-align: center;
  font: normal 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#calendario .ano_prev a {
  position: relative;
  display: block;
  text-align:center;
  text-decoration: none;
  width: 80px;
  height: 30px;
  margin: 0;
  padding: 0;
  font: normal 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  background: rgb(27,67,129);
}

#calendario .ano_prev a:hover {
  text-decoration: none;
  background: #d35400;
}

#calendario .ano_prox {
  position: absolute;
  top: 0;
  right: 10px;
  display: table;
  width: 80px;
  height: 30px;
  margin: 0 0 0 0;
  padding: 0;
  border: 0;
  text-align: center;
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#calendario .ano_prox a {
  position: relative;
  display: block;
  text-align:center;
  text-decoration: none;
  width: 80px;
  height: 30px;
  margin: 0;
  padding: 0;
  font: normal 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  background: rgb(27,67,129);
}

#calendario .ano_prox a:hover {
  text-decoration: none;
  background: #d35400;
}

#calendario .ui-tabs {
  border: 0;
  margin: 0;
  background: transparent;
}

#calendario .ui-tabs-panel {
  background: transparent;
  padding: 15px 0;
  border: 0;
  margin: 0;
}

#calendario .ui-widget-header { 
  background: transparent; 
  border: none; 
} 
#calendario .ui-tabs-nav .ui-state-default { 
  display: block;
  width: 80px;
  padding: 0;
  margin: 0 3px 3px 0;
  border: 0;
  border-radius: 0;
  text-align: center;
} 
#calendario .ui-tabs-nav .ui-state-active { 
  display: block;
  width: 80px;
  padding: 0;
  margin: 0 3px 3px 0;
  border: 0;
  border-radius: 0;
  text-align: center;
} 
#calendario .ui-tabs-nav .ui-state-default a { 
  display: block;
  width: 80px;
  margin: 0;
  padding: 5px 0;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(57,55,56);
  color: white;
  text-decoration: none;
  border: 0;
  border-radius: 0;
  text-align: center;
} 
#calendario .ui-tabs-nav .ui-state-default a:hover { 
  background: dimgray;
} 
#calendario .ui-tabs-nav .ui-state-active a { 
  display: block;
  width: 80px;
  margin: 0;
  padding: 5px 0;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: #d35400;
  color: black;
  text-decoration: none;
  border: 0; 
  border-radius: 0;
  text-align: center;
}
#calendario .celula-vazio {
  float: left;
  display: block;
  border: solid 1px transparent;
  background: transparent;
  margin: 0 6px 5px 0;
  padding: 5px;
  width: 125px;
  height: 85px;
}
#calendario .celula-dia {
  float: left;
  display: block;
  border: solid 1px rgb(57,55,56);
  color: dimgray;
  background: white;
  margin: 0 6px 5px 0;
  padding: 5px;
  width: 125px;
  height: 85px;
}
#calendario .celula-dia h1 {
  float: left;
  font: bolder 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  margin: 0;
  padding: 0;
}
#calendario .celula-dia h2 {
  float: right;
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  margin: 0;
  padding: 0;
}
#calendario .celula-dia p {
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  clear: both;
}
#calendario .celula-dia ul {
  font: normal 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  margin: 0;
  padding: 0;
  list-style: none;
}
#calendario .celula-dia ul li {
  font: normal 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  color: dimgray;
  margin: 0;
  clear: both;
}

#calendario .celula-dia ul li a {
  font: bold 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  color: rgb(27,67,129);
  margin: 0;
  clear: both;
}

#calendario .celula-dia ul li a:hover {
  color: #d35400;
}

#calendario .celula-feriado {
  float: left;
  display: block;
  border: solid 1px rgb(57,55,56);
  background: gainsboro;
  margin: 0 6px 5px 0;
  padding: 5px;
  width: 125px;
  height: 85px;
}
#calendario .celula-feriado h1 {
  float: left;
  font: bolder 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
  margin: 0;
  padding: 0;
}
#calendario .celula-feriado h2 {
  float: right;
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
  margin: 0;
  padding: 0;
}
#calendario .celula-feriado p {
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  clear: both;
}
#calendario .celula-feriado ul {
  font: normal 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  margin: 0;
  padding: 0;
  list-style: none;
}
#calendario .celula-feriado ul li {
  font: normal 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  color: dimgray;
  margin: 0;
  clear: both;
}
#calendario .celula-feriado ul li a {
  font: bold 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  color: rgb(27,67,129);
  margin: 0;
  clear: both;
}

#calendario .celula-feriado ul li a:hover {
  color: #d35400;
}

#calendario .celula-hoje {
  float: left;
  display: block;
  border: solid 1px rgb(57,55,56);
  color: dimgray;
  background: rgba(239,161,72,0.5);
  margin: 0 6px 5px 0;
  padding: 5px;
  width: 125px;
  height: 85px;
}
#calendario .celula-hoje h1 {
  float: left;
  font: bolder 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
}
#calendario .celula-hoje h2 {
  float: right;
  font: bold 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
}
#calendario .celula-hoje p {
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  clear: both;
}
#calendario .celula-hoje ul {
  font: normal 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  margin: 0;
  padding: 0;
  list-style: none;
}
#calendario .celula-hoje ul li {
  font: normal 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  color: dimgray;
  margin: 0;
  clear: both;
}
#calendario .celula-hoje ul li a {
  font: bold 8px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  color: rgb(27,67,129);
  margin: 0;
  clear: both;
}

#calendario .celula-hoje ul li a:hover {
  color: #d35400;
}

/*************************************************************************************************
*
*  MODAL
*
*************************************************************************************************/

#mask {
  position:absolute;
  left:0;
  top:0;
  z-index:1009000;
  background-color:#000;
  display:none;
}
 
#boxes .window {
  position:absolute;
  left:50%;
  top:50%;
  width:600px;
  //height:200px;
  display:none;
  z-index:1009999;
  padding: 30px;
}
 
#boxes #dialog {
  width:400px;
  padding: 20px;
  border: 0;
  background-color: rgb(27,67,129);
  color: white;
}
 
#boxes #dialog a {
  float: right;
  display: block;
  width: 40px;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  padding: 0;
  margin: 0;
}
 
#boxes #dialog h1 {
  float: left;
  display: block;
  width: 340px;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: left;
  padding: 0;
  margin: 0;
}

#boxes #dialog h2 {
  display: block;
  font: bold 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  padding: 5px 0 0 0;
  clear: both;
}

#boxes #dialog h3 {
  display: block;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  padding: 5px 0 5px 0;
  text-align: center;
  clear: both;
}
 
#boxes #dialog p {
  display: block;
  padding: 0;
  border: solid 2px rgb(27,67,129);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: justify;
}

#boxes #dialog .erro {
  display: block;
  background-color: #d35400;
  padding: 0;
  border: 0;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: left;
}

#boxes .close{display:block; text-align:right;}

/*************************************************************************************************
 *
 *  cupom mapa
 *
 *************************************************************************************************/

#mapaong {
  width: calc(100% - 6px);
  height: 300px;
  margin: 5px 0;
  border: solid 1px rgb(27,67,129);
}

#item_mapa {
  display: block;
  width: 150px;
  height: auto;
  position: relative;
  border: 0;
  background: white;
  margin: 0;
  padding: 5px;
}

#item_mapa .logo img {
  float: left;
  margin: 0 0 5px 0;
  padding: 0;
  width: 100%;
  border: 0;
}

#item_mapa .titulo {
  display: block;
  width: 100%;
  margin: 0 0 5px 0;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  clear: both;
}

#item_mapa .endereco {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  font: normal 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  clear: both;
}

/******************************************************************************
 * SliderCMS
 ******************************************************************************/

#slidercms {
  position: relative;
  display: table;
  margin: 15px auto 0 auto;
  width: 100%;

  padding: 0;
  border: 0;
}

#slidercms .header {
  position: relative;
  background: transparent;
  z-index: 500;
  display: block;
  width: 80%;
  height: 25px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-top: solid 1px dimgray;
  clear: none;
}

#slidercms .header h1 {
  display: table;
  margin: 0 auto;
  width: auto;
  text-align: center;
  font: bold 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-transform: lowercase;
  margin-top: -15px;
  padding: 3px 30px;
  background: white;
}

#slidercms .header h2 {
  text-align: center;
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}

#slidercms .header h2 a {
  display: inline-block;
  width: auto;
  padding: 1px 10px;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: solid 1px rgb(27,67,129);
  text-transform: uppercase;
  text-decoration: none;
  margin: 2px;
  background: rgb(27,67,129);
}

#slidercms .header h2 a:hover {
  background: #d35400;
  border: solid 1px #d35400;
}


#slidercms .slider_esq {
  position: absolute;
  top: 0;
  left: 0;
  display: table;
  width: 50px;
  height: 50px;
  margin: -20px 0 0 0;
  padding: 0;
  text-align: center;
  font: normal 24px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#slidercms .slider_esq a {
  position: relative;
  display: block;
  text-align:center;
  width: 42px;
  height: 42px;
  text-decoration: none;
  margin: 3px;
  padding: 0;
  font: normal 28px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#slidercms .slider_esq a:hover {
  text-decoration: none;
  opacity: 0.5;
}

#slidercms .slider_esq a img {
  width: 42px;
  height: 42px;
  border: 0;
}

#slidercms .slider_dir {
  position: absolute;
  top: 0;
  right: 0;
  display: table;
  width: 50px;
  height: 50px;
  margin: -20px 0 0 0;
  padding: 0;
  text-align: center;
  font: bold 24px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#slidercms .slider_dir a {
  position: relative;
  display: block;
  text-align:center;
  width: 42px;
  height: 42px;
  text-decoration: none;
  margin: 3px;
  padding: 0;
  font: normal 28px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#slidercms .slider_dir a:hover {
  text-decoration: none;
  opacity: 0.5;
}

#slidercms .slider_dir a img {
  width: 42px;
  height: 42px;
  border: 0;
}

#slidercms .slider_painel {
  position: relative;
  display: table;
  width: 100%;

  margin: 10px 0 0 2px;
  padding: 0;
  border: 0;
  clear: both;
  min-height: 500px;
}

#slidercms .slider_pagina {
  position: relative;
  display: table;
  width: 100%;
  z-index: 800;
  margin: 0 0 0 0;
  padding: 0;
  font: normal 18px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  min-height: 500px;
  clear: both;
  
}

#slidercms .slider_pagina p {
  font: normal 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0 80px;
  text-align: justify;
  padding: 0;
}

#slidercms .slider_pagina ul {
  font: normal 16px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0 80px;
  text-align: left;
  padding: 0;
  list-style-position:inside;
}

#slidercms .slider_pagina .titulodiv {
  position: relative;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 0 5px 0;
  color: rgb(27,67,129);
  clear: both;
}

#slidercms .slider_painel img {
  margin: 0 0 5px 0;
  padding: 0;
  border: 0;
}

#slidercms .slider_bt {
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 100%;
  margin: 5px 0;
  padding: 0;
  text-align: center;
  clear: both;
}

#slidercms .slider_bt img  {
  margin: 0 0 0 5px;
  border: 0;
}

#slidercms .btimg { 
  display: inline-block;
  width: 78px; 
  height: 6px; 
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 5px 0 0;
  cursor: pointer; 
  text-decoration: none;
  background: rgb(57,55,56);
  color: transparent;
}

#slidercms .btimg.cycle-pager-active { 
  display: inline-block;
  width: 78px; 
  height: 6px; 
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0 5px 0 0;
  cursor: pointer; 
  text-decoration: none;
  background: #d35400;
  color: transparent;   
}

/******************************************************************************
 * #blog
 ******************************************************************************/
 
#cms {
  position: relative;
  display: table;
  border-collapse: separate;
  border-spacing: 0;
  border-color: gray;
  width: 100%;
  margin: 0;
  padding: 20px 0;
  text-align: left;
  background: white;
}

#cms .textoblog {
  position: relative;
  display: table;
  width: calc( 100% - 22px );
  font: normal 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-top: 0;
  margin-bottom: 5px;
  padding: 10px;
  text-decoration: none;
  border: solid 1px rgb(57,55,56);
}

#cms .textoblog p {
  font: normal 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin-top: 0;
  margin-bottom: 5px;
  text-decoration: none;
}

#cms .textoblog img {
  border: 0px;
  padding-left: 5px;
}


#cms .chamada {
  display: block;
  width: 100%;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 20px 0 40px 0;
  color: rgb(57,55,56);
}

#cms .itemblog {
  float: left;
  position: relative;
  display: table;
  width: 100%;
  height: 110px;
  border: 0;
  border-top: solid 3px rgb(27,67,129);
  border-bottom: solid 1px rgb(27,67,129);
  margin: 0 0 6px 0;
  color: dimgray;
  padding: 0px;
  text-align: center;
  background: transparent;
}

#cms .itemblog:hover {
  background: white;
  border-top: solid 3px #d35400;
  border-bottom: solid 1px #d35400;
}

#cms .itemblog .datablog {
  float: left;
  display: table;
  width: 10%;
  vertical-align: middle;
  text-align: center;
  height: 110px;
}

#cms .itemblog .infoblog {
  float: right;
  display: block;
  width: 89%;
  border: 0;
  height: 110px;
}

#cms .itemblog .dia {
  display: block;
  width: 100%;
  text-align: center;
  font: bold 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#cms .itemblog .mes {
  display: block;
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#cms .itemblog .ano {
  display: block;
  width: 100%;
  text-align: center;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#cms .itemblog .titulo {
  float: left;
  dsplay: block;
  width: auto;
  margin: 5px 0 5px 0;
  padding: 0;
  border: 0;
  text-align: left;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#cms .itemblog .titulo a {
  float: left;
  text-decoration: none;
  border: 0;  
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

#cms .itemblog .titulo a:hover {
  color: #d35400;
}

#cms .itemblog .categoria {
  float: right;
  display: block;
  width: auto;
  margin: 5px 0 3px 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
}

#cms .itemblog .categoria a {
  display: inline-block;
  width: auto;
  margin: 0 3px 0 0;
  padding: 2px 10px;
  text-decoration: none;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(27,67,129);
  color: white;
  text-transform: uppercase;
}

#cms .itemblog .categoria a:hover {
  background: #d35400;
  color: white;
}

#cms .itemblog .descricao {
  float: left;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

/******************************************************************************
 * headerCMS
 ******************************************************************************/

#headercms {
  position: relative;
  display: block;
  margin: 20px auto 5px auto;
  width: 100%;
  height: auto;
  padding: 0;
  border: 0;
}

#headercms .header {
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-top: solid 1px rgb(27,67,129);
  clear: none;
}

#headercms .header h1 {
  display: table;
  margin: 0 auto;
  width: auto;
  text-align: center;
  font: bold 20px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-transform: uppercase;
  margin-top: -12px;
  padding: 0 30px;
  background: white;
}

#headercms .header h2 {
  text-align: center;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
}

#headercms .header h2 a {
  display: inline-block;
  width: auto;
  padding: 1px 10px;
  font: bold 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  border: solid 1px rgb(27,67,129);
  text-transform: uppercase;
  text-decoration: none;
  margin: 2px;
  background: rgb(27,67,129);
}

#headercms .header h2 a:hover {
  background: #d35400;
  border: solid 1px #d35400;
}

#headercms .header h3 {
  text-align: center;
  font: bold 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 5px 0;
  padding: 0;
}

#headercms .header h3 a {
  display: inline-block;
  width: auto;
  padding: 3px 10px;
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-transform: uppercase;
  text-decoration: none;
  margin: 2px;
  background: rgb(27,67,129);
}

#headercms .header h3 a:hover {
  background: #d35400;
}

#headercms .header h4 {
  text-align: center;
  font: bold italic 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 5px 0 0 0;
  padding: 0;
}

/******************************************************************************
 * Sliderpost
 ******************************************************************************/

#sliderpost {
  position: relative;
  float: right;
  display: inline-block;
  margin: 5px;
  width: 300px;
  height: 200px;
  padding: 0;
  border: 0;
  clear: none;
}

#sliderpost img {
  width: 300px;
  height: 200px;
  padding: 0;
  border: 0;
}

#sliderpost .cycle-overlay {
  position: absolute;
  width: 300px;
  bottom: 5px;
  left: 0;
  z-index: 300;
  display: block;
  background: rgba(200,200,200,0.5);
  padding: 5px;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#sliderpost .slider_painel {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  clear: both;
}

#sliderpost .slider_painel img {
  margin: 0 0 5px 0;
  padding: 0;
  border: 0;
}

#sliderpost .slider_bt {
  position: absolute;
  right: 0;
  top: 5px;
  display: block;
  width: 100px;
  margin: 0;
  padding: 0;
  z-index: 1000;
  text-align: right;
}

#sliderpost .btimg { 
  display: inline-block;
  width: 10px; 
  height: 10px;
  border:0;
  border-radius: 5px;
  margin: 0 5px 0 0;
  cursor: pointer; 
  text-decoration: none;
  background: white;
  color: transparent;
}

#sliderpost .btimg.cycle-pager-active { 
  display: inline-block;
  width: 10px; 
  height: 10px;
  border:0;
  border-radius: 5px;
  margin: 0 5px 0 0;
  cursor: pointer; 
  text-decoration: none;
  background: #d35400;
  color: transparent;   
}

/******************************************************************************
 * accordion
 ******************************************************************************/
 
.accordion {
  position: relative;
  display: table;
  width: calc(100% - 2px);
  font: normal 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 10px 0;
  padding: 0;
  color: white;
  clear: both;
}

.accordion h2 {
  background: rgb(57,55,56);
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  padding: 10px 0;
}

.accordion .ui-accordion {
  background: white;
  border: 0;
  color: white;
}

.accordion .ui-accordion-header {
  margin: 0;
  font: 700 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding: 5px 10px;
  border: 0;
  background: white;
  border: solid 1px #bdc3c7;
  color: rgb(27,67,129);
}

.accordion .ui-accordion-header .titulo {
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  display: block;
  padding: 5px 10px;
}


.accordion .ui-accordion-header:hover {
  cursor: help;
}

.accordion .ui-accordion-header-active {
  margin: 0;
}

.accordion .ui-accordion-content {
  display: block;
  border: 0;
  font: 400 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-decoration: none;
  background-color: white;
  color: rgb(57,55,56);
  margin: 0 0 10px 0;
  padding: 5px 10px;
}

/******************************************************************************
 * #lideranca
 ******************************************************************************/

#lideranca {
  float: left;
  margin: 0;
  width: 100%;
  border:0;
  background: transparent;
}
#lideranca ul {
  list-style-position: inside;
  margin: 3px 3px 3px 0;
  padding: 0;
  text-indent: 0;
}
#lideranca .ui-tabs {
  border: 0;
  margin: 0;
  background: transparent;
}

#lideranca .ui-tabs-panel {
  background: transparent;
  padding: 15px 0;
  border: 0;
  margin: 0;
}

#lideranca .ui-widget-header { 
  background: transparent; 
  border: none; 
}

#lideranca .ui-tabs-nav {
}

#lideranca .ui-tabs-nav .ui-state-default { 
  padding: 3px;
  margin: 0 3px 3px 0;
  border: solid 1px rgb(27,67,129);
  text-align: center;
  background: white;
  color: rgb(27,67,129);
  outline: none;
}

#lideranca .ui-tabs-nav .ui-state-active { 
  padding: 3px;
  margin: 0 3px 3px 0;
  border: solid 1px rgb(27,67,129);
  text-align: center;
  background: rgb(27,67,129);
  color: white;
  outline: none;
}

#lideranca .ui-tabs-nav .ui-state-default a { 
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  text-decoration: none;
  outline: none;
}

#lideranca .ui-tabs-nav .ui-state-active a { 
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  outline: none;
}

#lideranca .foto {
  float: left;
  width: 150px;
  height: 200px;
  margin: 0 15px 0 0;
  padding: 0;
  background: rgb(57,55,56);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover; 
}

#lideranca .foto img {
  width: 150px;
  margin: 0;
  padding: 0;
}

#lideranca .texto {
  float: left;
  width: 920px;
  margin: 0 ;
  padding: 0;
}
#lideranca .texto h1 {
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  padding: 0;
}
#lideranca .texto h2 {
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  padding: 0;
}
#lideranca .texto p {
  font: 400 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  padding: 0;
}
#lideranca .texto br {
  margin: 0 0 5px 0;
}
#lideranca .colunas {
  float: left;
  width: 100%;
  margin: 0 ;
  padding: 0;

}
/******************************************************************************
 * #listagem
 ******************************************************************************/

#listagem {
  float: left;
  margin: 0;
  width: 100%;
  border:0;
  background: transparent;
}
#listagem ul {
  list-style-position: inside;
  margin: 3px 3px 3px 0;
  padding: 0;
  text-indent: 0;
}
#listagem .ui-tabs {
  border: 0;
  margin: 0;
  background: transparent;
}

#listagem .ui-tabs-panel {
  background: transparent;
  padding: 0 0 15px 0;
  border: 0;
  margin: 0;
}

#listagem .ui-widget-header { 
  background: transparent; 
  border: none; 
}

#listagem .ui-tabs-nav {
}

#listagem .ui-tabs-nav .ui-state-default { 
  padding: 3px;
  margin: 0 3px 3px 0;
  border: solid 1px #d35400;
  border-radius: 3px;
  text-align: center;
  background: white;
  color: #d35400;
}

#listagem .ui-tabs-nav .ui-state-active { 
  padding: 3px;
  margin: 0 3px 3px 0;
  border: solid 1px #d35400;
  border-radius: 3px;
  text-align: center;
  background: #d35400;
  color: white;
}

#listagem .ui-tabs-nav .ui-state-default a { 
  font: normal 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #d35400;
  text-decoration: none;
}

#listagem .ui-tabs-nav .ui-state-active a { 
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
}

#listagem .foto {
  float: left;
  width: 150px;
  margin: 0 15px 0 0;
  padding: 0;
}

#listagem .foto img {
  width: 150px;
  margin: 0;
  padding: 0;
}

#listagem .texto {
  float: left;
  width: 665px;
  margin: 0 ;
  padding: 0;
}
#listagem .texto h1 {
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  padding: 0;
}
#listagem .texto h2 {
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  padding: 0;
}
#listagem .texto p {
  font: normal 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  padding: 0;
}

#resumo {
  float: left;
  background: white;
  display: block;
  width: 100%;
  padding: 5px;
  margin: 0 0 10px 0;
  border: 0;
  border-radius: 10px 0;
  font: normal 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

#resumo .grupo {
  float: left;
  background: rgb(27,67,129);
  display: block;
  padding: 5px 10px;
  margin: 0;
  border: 0;
  border-radius: 10px 0 0 0;
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#resumo .info {
  float: left;
  background: dimgray;
  display: block;
  padding: 5px 10px;
  margin: 0 0 0 5px;
  border: 0;
  border-radius: 0 0 10px 0;
  font: bold 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
}

#resumo .status {
  float: right;
  background: rgb(27,67,129);
  display: block;
  padding: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  border: 0;
  border-radius: 10px;
  color: white;
}

#resumo .descricao {
  float: left;
  background: transparent;
  display: block;
  width: calc( 100% - 10px );
  padding: 5px;
  margin: 5px 0 0 0;
  border: solid 1px rgb(57,55,56);
  border-radius: 0 0 10px 0;
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: dimgray;
  clear: both;
}

.item_lista {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  border: solid 1px #ecf0f1;
  margin: 0 0 5px 0;
  color: dimgray;
  padding: 10px;
  text-align: center;
  background: transparent;
}

.item_lista:hover {
  background: #ecf0f1;
}

.item_lista .titulo {
  float: left;
  dsplay: block;
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  text-align: left;
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

.item_lista .titulo a {
  margin: 0;
  padding: 0;
  text-decoration: none;
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

.item_lista .titulo a:hover {
  color: #d35400;
}

.item_lista .link {
  float: right;
  display: block;
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
}

.item_lista .link a {
  margin: 0;
  padding: 0;
  text-decoration: none;
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
}

.item_lista .link a:hover {
  color: #d35400;
}

.item_lista .infolink {
  float: left;
  display: block;
  width: 100%;
  margin: 5px 0 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: 400 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

.item_lista .comentario {
  float: left;
  display: block;
  width: auto;
  margin: 5px 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: 400 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  clear: left;
}

.item_lista .data {
  float: left;
  display: block;
  width: auto;
  margin: 5px 0 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: 700 14px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  clear: left;
}

.item_lista .foto {
  float: right;
  display: block;
  width: 320px;
  height: 240px;
  margin: 0;
  padding: 0;
  border: 0;
  background-color: rgb(57,55,56);
  background-repeat: no-repeat; 
  background-size: cover;
  color: rgb(57,55,56);
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
}

.item_lista .itemfoto {
  float: left;
  display: block;
  vertical-align: middle;
  text-align: center;
  padding: 0;
  margin: 0 10px 0 0;
  border: 0; 
  width: 175px;
  height: 90px;
  overflow: hidden;
  background-color: #ecf0f1;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;  
  clear: none;
}

.item_lista .itemconteudo {
  float: right;
  display: block;
  text-align: left;
  padding: 0;
  margin: 0;
  border: 0; 
  width: calc( 100% - 185px );
  height: auto;
  overflow: auto;
  clear: none;
}

.item_lista .itemesquerda {
  float: left;
  display: block;
  text-align: left;
  padding: 0;
  margin: 0;
  border: 0; 
  width: 175px;
  height: auto;
  clear: left;
}

.item_lista .fonte {
  float: left;
  display: block;
  margin: 0;
  padding: 0 0 0 0;
  border: 0;
  background: transparent;
  color: black;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  clear: left;
}

.item_lista .chamada {
  float: left;
  display: block;
  margin: 0;
  padding: 0 0 0 0;
  border: 0;
  background: transparent;
  color: black;
  font: 400 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  clear: left;
}

.itemblog_divisor {
  float: left;
  position: relative;
  display: block;
  width: 20px;
  height: 390px;
  border: 0;
  margin: 0;
  clear: none;
  background: transparent;
}

.itemblog_home {
  float: left;
  position: relative;
  display: block;
  width: 350px;
  height: 380px;
  border: 0;
  padding: 0;
  color: rgb(57,55,56);
  margin: 0 0 10px 0;
  text-align: center;
  background: white;
  clear: none;
}


.itemblog_home .itemfoto {
  float: left;
  display: block;
  vertical-align: middle;
  text-align: center;
  padding: 0;
  margin: 0;
  border: 0; 
  width: 350px;
  height: 185px;
  overflow: hidden;
  background-color: ;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;  
  clear: none;
}

.itemblog_home .titulo {
  float: left;
  display: inline-block;
  width: calc( 100% - 10px );
  margin: 0 5px;
  padding: 0;
  border: 0;
  text-align: left;
  font: 700 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: white;
  color: black;
}

.itemblog_home .titulo a {
  text-decoration: none;
  border: 0;  
  padding: 0;
  font: 700 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
  text-transform: uppercase;
}

.itemblog_home .fonte {
  float: left;
  display: inline-block;
  width: 100%;
  margin: 0 5px;
  padding: 0 0 0 0;
  border: 0;
  background: transparent;
  color: black;
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

.itemblog_home .chamada {
  float: left;
  display: inline-block;
  width: 100%;
  margin: 0 5px;
  padding: 0 0 0 0;
  border: 0;
  background: transparent;
  color: black;
  font: 300 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

.item_file {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  height: 85px;
  border: solid 1px #ecf0f1;
  margin: 0 0 6px 0;
  color: dimgray;
  padding: 0px;
  text-align: center;
  background: transparent;
}

.item_file .infoblog {
  float: left;
  display: block;
  width: calc( 100% - 160px );
  border: 0;
  height: 85px;
  padding: 5px;
  margin: 0;
}

.item_file:hover {
  background: #ecf0f1;
}

.item_file .datablog {
  float: right;
  display: table-cell;
  width: 150px;
  vertical-align: middle;
  height: 85px;
  padding: 5px;
  margin: 0;
}

.item_file .infoblog {
  float: left;
  display: block;
  width: calc( 100% - 160px );
  border: 0;
  height: 85px;
  padding: 5px;
  margin: 0;
}

.item_file .formato {
  float: right;
  display: block;
  width: 100%;
  text-align: right;
  font: bold 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  clear: both;
  padding: 10px 0;
}

.item_file .icoarquivo {
  float: right;
  display: block;
  position: relative;
  margin: 0 0 0 5px;
  padding: 0px;
  height: 20px;
  width: 20px;
  border: 0;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 30px;
  color: white;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  text-align: center;
  
}

.item_file .tamanho {
  float: right;
  display: block;
  width: 100%;
  text-align: right;
  text-transform: uppercase;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  clear: both;
  padding: 5px 0;
}

.item_file .titulo {
  float: left;
  display: block;
  width: auto;
  margin: 5px 0 5px 0;
  padding: 0;
  border: 0;
  text-align: left;
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

.item_file .titulo a {
  float: left;
  text-decoration: none;
  border: 0;  
  font: bold 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
}

.item_file .titulo a:hover {
  color: #d35400;
}

.item_file .lista_categ {
  float: right;
  display: block;
  width: auto;
  margin: 5px 0 3px 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: white;
  font: bold 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
}

.item_file .lista_categ a {
  display: inline-block;
  width: auto;
  margin: 0 3px 0 0;
  text-transform: uppercase;
  padding: 3px 10px;
  text-decoration: none;
  font: 400 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background: rgb(27,67,129);
  color: white;
}

.item_file .lista_categ a:hover {
  background: rgb(57,55,56);
  color: white;
}

.item_file .descricao {
  float: left;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}
.item_file .referencia {
  float: left;
  display: block;
  width: 100%;
  margin: 5px 0 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}
.item_file .tag {
  float: right;
  margin: 0;
  padding: 5px 5px 5px 10px;
  border: 0;
  border-radius: 0 5px 0 5px;
  background: #3498db;
  color: white;
  font: normal 9px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

.twitter_home {
  float: right;
  width: calc( 100% - 12px );
  position:relative; 
  display:block; 
  background: transparent;
  margin: 0;
  padding: 5px;
  border: solid 1px #ecf0f1;
  overflow: auto;
}

.item_agenda {
  float: left;
  position: relative;
  display: block;
  width: calc( 100% - 10px );
  height: 60px;
  border: 0;
  margin: 0 0 6px 0;
  padding: 5px;
  text-align: center;
  background: #ecf0f1;
}

.item_agenda .titulo {
  float: right;
  dsplay: block;
  width: 290px;
  margin: 0 0 5px 0;
  padding: 0;
  border: 0;
  text-align: right;
  font: 400 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

.item_agenda .titulo a {
  text-decoration: none;
  border: 0;  
  font: 400 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: black;
}

.item_agenda .titulo a:hover {
  color: #d35400;
}

.item_agenda .categoria {
  float: right;
  display: block;
  width: 290px;
  margin: 0 0 0 0;
  padding: 0;
  border: 0;
  color: black;
  font: 700 12px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: right;
}

.item_agenda .descricao {
  float: left;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgb(57,55,56);
  font: normal 12px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

.item_agenda .data {
  float: left;
  position: relative;
  width: 50px;
  display: block;
  margin: 0;
  padding: 0;
  color: black;
}

.item_agenda .data .dia {
  float: left;
  position: relative;
  display: block;
  width: 50px;
  text-align: center;
  font: 700 40px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  clear: both;
  border: 0;
  line-height: 40px;
}

.item_agenda .data .mes {
  float: left;
  position: relative;
  display: block;
  width: 50px;
  text-align: center;
  text-transform: uppercase;
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 20px;
  margin: 0;
  padding: 0;
  clear: both;
  border: 0;
}

/******************************************************************************
 * div_nucleo
 ******************************************************************************/

#div_nucleo {
  float: left;
  display: block;
  position: relative;
  clear: both;
  width: 100%;
  height: auto;
  padding: 0 0 0 0;
  margin: 20px 0;
  border: 0;
  background: rgb(238,238,238);
}

#div_nucleo img {
  border: 0;
  height: 60px;
  margin: 10px;
}

#div_nucleo .ui-tabs {
  border: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent; 
}

#div_nucleo .ui-widget-header { 
  background: transparent; 
  border: 0; 
  margin: 0;
  padding: 0;
}

#div_nucleo .ui-tabs-nav {
  background: transparent; 
  padding: 0;
  margin: 0 auto 0 auto;
  text-align: center;
  border: 0;
}

#div_nucleo .ui-tabs-nav ul {
  margin: 0;
  padding: 0;
  border: 0;
}

#div_nucleo .ui-tabs-nav li {
  display: inline-block; 
  float: none;
  margin: 0;
  padding: 0;
  border: 0;
}

#div_nucleo .ui-tabs-nav .ui-state-default { 
  padding: 0 10px;
  margin: 0;
  background: transparent;
  color: rgb(57,55,56);
  border: 0;
  opacity: 0.5;
} 
#div_nucleo .ui-tabs-nav .ui-state-default:hover { 
  opacity: 1.0;
} 
#div_nucleo .ui-tabs-nav .ui-state-active { 
  padding: 0 10px;
  margin: 0;
  background: transparent;
  color: white;
  border: 0;
  opacity: 1;
  background: rgb(218,218,218);
} 
#div_nucleo .ui-tabs-nav .ui-state-default a { 
  font: 700 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  text-decoration: none;
  text-transform: uppercase;
  border: 0;
  outline: none;
} 
#div_nucleo .ui-tabs-nav .ui-state-active a { 
  font: 700 10px  'Open Sans', Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
  text-transform: uppercase;
  border: 0; 
  outline: none;
}
#div_nucleo .ui-tabs-panel {
  display: block;
  padding: 0 20px 20px 20px;
  border: 0; 
  margin: 0 ;
  background: rgb(218,218,218);
  color: black;
  height: 300px;
}

#div_nucleo .ui-tabs-panel p {
  color: black;
}

#div_nucleo .logo {
  float:left; 
  display:block; 
  width: 25%; 
  height: auto;
  clear: none; 
  margin: 0 10px 10px 0;
  padding: 0;
}

#div_nucleo .barratopo {
  position: relative;
  display: block;
  width: 100%;
  height: 280px;
  margin: 20px 0 10px 0;
  padding: 0;
  background: rgb(57,55,56);
  background-color: rgb(57,55,56);
  background-repeat: no-repeat; 
  background-size: cover;  
  background-position: center;
}

#div_nucleo .barratopo img {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 180px;
  z-index: 3;
}

#div_nucleo .barratopo span {
  position: absolute;
  display: block;
  bottom: 10px;
  right: 15px;
  font: bold 28px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  z-index: 4;
  text-shadow: 2px 2px black;
}

/******************************************************************************
 * formsite
 ******************************************************************************/
 
#formsite {
  float: left;
  overflow: hidden;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  color: rgb(57,55,56);
  text-align: left;
  border: none;
  clear: both;
}

#formsite H4 {
  margin: 5px 0px 5px 0px;
  padding: 0px;
  font: bold 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  color: rgb(57,55,56);
  text-transform: uppercase;
}

#formsite .subtitle {
  font: bold 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 5px 25px;
  color: rgb(57,55,56);
}

#formsite form {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  border: none;
}

#formsite fieldset {
  float: left;
  width: 100%;
  margin: 0px 0px 10px 0px;
  padding: 0px 0px 0px 0px;
  border: none;
  clear: both;
}

#formsite legend {
  display: block;
  text-align: left;
  padding: 5px 15px 5px 15px;
  margin: 0px 10px 0px 10px;
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif  border: solid 2px rgb(57,55,56);
  background: silver;
  color: rgb(27,67,129);
}

#formsite .campo {
  position: relative;
  float: left;
  display: block;
  padding: 0px;
  margin: 0 5px 0 0;
}

#formsite .etiqueta {
  position: relative;
  float: left;
  display: block;
  text-align: left;
  padding: 0;
  margin: 0;
  width: 100%;
  text-transform: uppercase;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(76,176,52);
}

#formsite .controle {
  position: relative;
  float: left;
  display: block;
  padding: 0px;
  width: 100%;
  margin: 0;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
}

#formsite .controle img {
  width: 120px;
}

#formsite .readonly {
  position: relative;
  float: left;
  display: block;
  width: 100%;
  padding: 1px 5px ;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  border: solid 1px rgb(57,55,56);
  background-color:lightyellow;
}

#formsite .caixa {
  float: left;
  display: block;
  width: 100%;
  padding: 2px 5px 0 5px;
  font: normal 10px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 2px 0 5px 0;
  border: solid 1px rgb(57,55,56);
  background-color:lightyellow;
}

#formsite .exibicao {
  float: left;
  display: block;
  width: 100%;
  padding: 2px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  margin: 0 0 5px 0;
  border: solid 1px rgb(57,55,56);
  background-color:lightyellow;
}

#formsite input {
  float: left;
  width: 100%;
  padding: 3px 5px;
  font: 700 16px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin-bottom: 5px;
  border: 0;
  background-color:#ecf0f1;
  resize: none;  
}
#formsite textarea {
  float: left;
  width: 100%;
  padding: 2px 5px;
  font: 700 16px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin-bottom: 5px;
  border: 0;
  background-color:#ecf0f1;
  resize: none;  
}
#formsite select {
  float: left;
  width: 100%;
  padding: 1px 5px;
  font: 700 16px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin-bottom: 5px;
  border: 0;
  background-color:#ecf0f1;
}

#formsite input:hover, select:hover, textarea:hover {
  background-color:#F0FFE6;
}

#formsite .checkbox input[type=checkbox] {
  display: none;
}

#formsite .checkbox label {
  display: inline-block;
  cursor: pointer;
  position: relative;
  padding: 0 0 0 25px;
  font: 400 12px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  margin: 0 15px 5px 0;
}

#formsite .checkbox label:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 10px;
  position: absolute;
  left: 0;
  bottom: 1px;
  background-color: white;
  border: solid 2px rgb(27,67,129);
  border-radius: 2px;
}

#formsite .checkbox input[type=checkbox]:checked + label:before {
  content: "";
  font: 400 10px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-align: center;
  line-height: 15px;
  background-color: rgb(27,67,129);
}

#formsite .radio {
  width: 15px;
  font: bold 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(57,55,56);
  border: none;
}

#formsite button {
  background-color: rgb(27,67,129);
  color: white;
  text-align: center;
  min-width: 80px;
  border: 0;
  margin: 0px 10px 0px 0px;
  padding: 4px 10px;
  font: bold 12px  'Open Sans', Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

#formsite button:hover {
  background-color:rgb(57,55,56);
  color: white;
}

#formsite .divisor {
  font: bold 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
  margin: 0px 0px 5px 25px;
  color: rgb(57,55,56);
}

#formsite .ui-spinner {
  margin: 0;
  padding: 0;
  width: 100%;
}

#formsite .ui-spinner-input {
  margin: 0;
  padding: 1px 5px;
  font: normal 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  border: solid 1px rgb(27,67,129);
  background-color:white;
  width: calc( 100% - 18px );
}

#formsite .ui-spinner-button {
  margin: 0;
  border: 0;
}

#formsite .ui-spinner-up {
  margin: 0;
  background-color: transparent;
  background-image: url('img/seta-up.png');
  background-repeat: no-repeat;
  background-position: center; 
  border: 0;
}

#formsite .ui-spinner-down {
  margin: 0;
  background-color: transparent;
  background-image: url('img/seta-down.png');
  background-repeat: no-repeat;
  background-position: center; 
  border: 0;
}

#formsite .captcha {
  float: right;
  border: solid 1px rgb(27,67,129);
  display: block;
  width: 200px;
  margin: 0 5px 0 0;
  padding: 5px;
}

#formsite .captcha #captcha {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 0 5px 0;
}

#formsite .captcha input {
  float: left;
  width: calc( 100% - 40px );
  font: bold 14px  'Open Sans', Trebuchet MS, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 5px 0;
  border: solid 1px rgb(27,67,129);
  background-color:white;
  text-align: center;
  resize: none;  
  clear: none;
}

#formsite .captcha #troca_captcha {
  float: right;
  display: block;
  height: 25px;
  width: auto;
  margin: 2px 0 0 0;
  padding: 0;
  clear: none;
}

#formsite .botoeira {
  display: block;
  width: 100%;
  float: right;
  text-align: right;
  margin: 5px 0;
  padding: 0;
}

/*************************************************************************************************
 *
 *  tagrole
 *
 *************************************************************************************************/
 
.tagrole {
  float: left;
  display: block;
  border: 0;
  border-radius: 5px 0;
  background: #1abc9c;
  padding: 2px 10px;
  margin: 1px 2px 1px 0;
  font: 700 10px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-transform: uppercase;
}

/*************************************************************************************************
 *
 *  divs bethel
 *
 *************************************************************************************************/
 
#bethel_intro {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  background : rgb(47,146,239);
  padding: 20px 0 0 0;
}


#bethel_intro .titulo {
  display: block;
  width: 100%;
  font: 700 40px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 26px;
  color: rgb(242,240,43);
  margin: 0;
  padding: 0 0 10px 0;
}

#bethel_intro .titulo a {
  font: 700 40px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 26px;
  color: rgb(242,240,43);
  text-decoration: none;
}

#bethel_intro .texto {
  display: block;
  font: 300 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 10px 0 0 0;
}

#bethel_inst {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  height: auto;
  background : rgb(27,67,129);
  padding: 0 0;
}

#bethel_inst a { 
  text-decoration: none;
  border: 0; 
  outline: none;
}

#bethel_inst .painel {
  float: left;
  position: relative;
  display: block;
  width: 33.3%;
  margin: 0;
  padding: 0;
  text-align: center;
  background: transparent;
}

#bethel_inst .simbolo {
  display: block;
  width: 100%;
  text-align: center;
  margin: 0;
  padding: 20px 0;
}

#bethel_inst .etiqueta {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 40px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(242,240,43);
  margin: 0;
  padding: 0;
}

#bethel_acoes {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  background-color: transparent;
  background-image: url('../img/projeto.jpg');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;
  padding: 0 0;
}

#bethel_acoes .texto {
  font: 700 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  padding: 50px 0;
  text-align: center;
}

#bethel_familia {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  background : rgb(242,240,43);
  padding: 0;
}

#bethel_familia .titulo {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
}

#bethel_familia .titulo a {
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  text-decoration: none;
}

#bethel_familia .chamada {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(160,161,8);
  margin: 0;
  padding: 10px 0;
}

#bethel_familia .painel {
  float: left;
  position: relative;
  display: block;
  width: 25%;
  margin: 0;
  padding: 20px 0;
  text-align: center;
  background: transparent;
}

#bethel_familia .etiqueta {
  margin: 0;
  padding: 25px;
  display: table-cell;
  width: 250px;
  height: 250px;
  border: 0;
  border-radius: 125px;
  text-align: center;
  vertical-align: middle;
  font: 700 32px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  background: rgba(27,67,129,0.5);
}

#bethel_familia .etiqueta:hover {
  color: transparent;
  background: transparent;
}

#bethel_familia .botao {
  display: table-cell;
  width: 250px;
  height: 250px;
  border: 0;
  border-radius: 125px;
  text-align: center;
  vertical-align: middle;
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
  background-color: transparent;
  background-image: url('../img/projeto.jpg');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;  
}

#bethel_unidades {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  background : rgb(76,176,52);
  padding: 0 0;
}

#bethel_unidades .titulo {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
}

#bethel_unidades .titulo a {
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  text-decoration: none;
}

#bethel_unidades .painel {
  float: left;
  position: relative;
  display: block;
  width: 345px;
  height: 280px;
  margin: 0;
  padding: 10px 0;
  text-align: center;
  background: rgba(255,255,255,0.2);
}

#bethel_unidades .painel:hover {
  background: rgba(255,255,255,0.5);
}

#bethel_unidades .simbolo {
  display: block;
  width: 100%;
  height: 120px;
  text-align: center;
  margin: 0 0 15px 0;
  padding: 0;
  
  background-color: transparent;
  background-image: url('../img/logo.png');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: contain;  
  
}

#bethel_unidades .simbolo img {
  display: block;
  float: none;
  text-align: center;
  border: 0;
  margin: 0 auto;
}

#bethel_unidades .etiqueta {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 26px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(242,240,43);
  margin: 0;
  padding: 0;
}

#bethel_unidades .info {
  display: block;
  width: 100%;
  text-align: center;
  font: 500 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
}

#bethel_noticias {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  background : rgb(47,146,239);
  padding: 0 0;
}

#bethel_noticias .titulo {
  display: block;
  width: 100%;
  text-align: center;
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(242,240,43);
  margin: 0 0 20px 0;
  padding: 0;
}

#bethel_noticias .titulo a {
  font: 700 48px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(242,240,43);
  text-decoration: none;
}

#bethel_noticias .painel {
  float: left;
  position: relative;
  display: block;
  width: 345px;
  margin: 0;
  padding: 0 9px;
  text-align: center;
  background: transparent;
}

#bethel_noticias .imagem {
  display: block;
  width: 100%;
  height: 250px;
  text-align: center;
  margin: 0 0 5px 0;
  padding: 0;
  background-color: transparent;
  background-image: url('../img/doe.jpg');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;  
}

#bethel_noticias .etiqueta {
  display: block;
  width: 100%;
  text-align: left;
  font: 700 24px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: rgb(27,67,129);
  margin: 0;
  padding: 0;
}

#bethel_noticias .info {
  display: block;
  width: 100%;
  text-align: left;
  font: 300 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
}

#bethel_doe {
  float: left;
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  background-color: transparent;
  background-image: url('../img/doe.jpg');
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;
  padding: 0;
}

#bethel_doe .painel {
  float: left;
  position: relative;
  display: block;
  margin: 0 0 50px 0;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}

#bethel_doe .titulo {
  float: left;
  clear: both;
  display: block;
  font: 700 60px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
}

#bethel_doe .texto {
  float: left;
  clear: both;
  display: block;
  width: 30%;
  font: 700 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: white;
  margin: 0;
  padding: 0;
}

#bethel_doe .botao {
  float: left;
  clear: both;
  display: block;
  margin: 20px 0 0 0;
  padding: 0;
}

#bethel_doe .botao a {
  display: block;
  font: 700 18px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: white;
  color: rgb(27,67,129);
  margin: 0 0 0 0;
  padding: 5px 15px;
  text-transform: uppercase;
  text-decoration: none;
}

#bethel_doe .botao a:hover {
  background-color: rgb(47,146,239);
  color: white;
}

/*Filter styles*/
.saturate {-webkit-filter: saturate(3); filter: saturate(3);}
.grayscale {-webkit-filter: grayscale(100%); filter: grayscale(100%);}
.contrast {-webkit-filter: contrast(160%); filter: contrast(160%);}
.brightness {-webkit-filter: brightness(0.25); filter: brightness(0.25);}
.blur {-webkit-filter: blur(3px); filter: blur(3px);}
.invert {-webkit-filter: invert(100%); filter: invert(100%);}
.sepia {-webkit-filter: sepia(100%); filter: sepia(100%);}
.huerotate {-webkit-filter: hue-rotate(180deg); filter: hue-rotate(180deg);}
.rss.opacity {-webkit-filter: opacity(50%); filter: opacity(50%);}

#barra_idioma {
  float: right;
  position: relative;
  display: block;
  width: 100px;
  border: 0;
  margin: 0 0px 0 0;
  clear: none;
}

$barra_idioma a {
  display: inline-block;
  margin: 0;
  padding: 0;
}

#barra_idioma img {
  float: left;
  border: 0;
  margin: 0 3px 0 0;
  padding: 0;
  display: inline-block;
}

.tagnome {
  display: inline-block;
  font: 700 14px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  background-color: rgb(76,176,52);
  color: white;
  margin: 5px 5px 5px 0;
  padding: 5px 10px;
  border: 0;
  border-radius: 10px;
  text-transform: uppercase;
}

.prest_contas_ano {
  float: left;
  display: block;
  width: 100%;
  border: solid 2px #3498db;
  padding: 5px 10px;
  margin: 0 0 5px 0;
  background: white;
  color: #3498db;
  font: 700 20px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}

.prest_contas_categ {
  float: left;
  display: block;
  width: 100%;
  border: 0;
  padding: 5px 10px;
  margin: 0 0 5px 0;
  background: white;
  color: white;
  font: 700 16px  Roboto, Trebuchet, Verdana, Tahoma, Arial, Helvetica, sans-serif;
  text-align: left;
}