@import url('https://fonts.googleapis.com/css?family=Muli:400,700,900');

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

canvas {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

body{
  font-family: 'Muli', sans-serif;
  font-size: 100%;
  color: #444;
  line-height: 1.4; 
  overflow-y: scroll; 
}

body.mobile{
  font-size: 105%;
  line-height: 1.5; 
}

.wrapper{
	margin: 0 auto;
	width: 90%;
}

.hidden {display: none; }

.header-container-bar{ right: 5%; }

.main-content img { outline: 0; border: 0}

.main-content p { line-height: 1.5; }
.main-content p a { /*word-break: break-all; */ outline: 0 }
.main-content p img { max-width: 100%; margin-top: 2em; }
.main-content [data-fancybox] img { max-width: 100%; margin-top: 2em; }
.main-content > img { max-width: 100%; margin-top: 2em; }
.main-content > div > img { max-width: 100%; margin-top: 2em; }
.main-content > div > div > img { max-width: 100%; margin-top: 2em; }
.main-content figcaption { text-align: center; font-size: .7em; font-style: italic; margin-bottom: 2em;}
.main-content p + figcaption { margin-top: -.5em;}

nav > ul > li{
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}
nav > ul  ul{
  display: none;
}

.map a,
.map a:focus{
  outline:0;
}
#map {
  width: 100%;
  height: 350px;
}

.project-detail { 
  background: #fff;
  padding: 0.5em 25px 0 25px !important;
  border: 1px solid #b5cc2d;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.header-quote { display: none;}

.project-tab{ display: none; }
.project-tab-stage{ display: block !important; margin-bottom: 5em; }

.header-social{ display: none; }

.header-search{ display: inline-block; }

.main-container .project-title-shy{ display: block; }
.pagination-top {display: none;}

.header-container nav > ul > li {
  margin-bottom: .75em;
}

.header-container-nav{
  padding-top: 80px;
  padding-bottom: 140px;
}

.icon-search {
  display: inline-block;
  top: 20px;
}

.form-seach{
  background: rgba(0,0,0,.5);
  display: inline-block;
  height: 36px;
  margin: 0;
  padding: 0 3px 0 9px;
  vertical-align: bottom;
}
.form-seach form{
  margin: 0;
  padding: 0;
  vertical-align: bottom;
}

.form-seach form label{
  margin: 0;
  padding: 0;
  vertical-align: bottom;
}

.header-container-bar input{ 
  width: 0px;
  border-width: 0;
  background: transparent;
  letter-spacing: 1px;
  color: #fff;
  outline: 0;
  padding: 3px 0;
  margin: 6px 0 0 0;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}
.header-container-bar input:focus{
  width: 150px;
}

.header-container-bar ::-webkit-input-placeholder, /* Chrome/Opera/Safari */
.header-container-bar ::-moz-placeholder, /* Firefox 19+ */
.header-container-bar :-ms-input-placeholder, /* IE 10+ */
.header-container-bar :-moz-placeholder { /* Firefox 18- */
  font-weight: 700;
  color: #fff;
  font-size: 0.9em;
}

/*-----*/

#contraste{
  margin-left: 18px;
}

#contraste::after{
  content: "\f042";
  font-size: 12px;
  font-family: 'FontAwesome';
  color: #000;
  margin-left: 5px;
}


/*-----*/

.icon-search { 
  white-space: nowrap;
}
.icon-search input{
  width: 70%;
}
.icon-search:before {  
  content: "\f002";
  font-family: 'FontAwesome';
  color: #fff;
  /*vertical-align: middle;*/
  margin-right: 8px;
}

.graph-project {
  padding-bottom: 2em;
  margin-bottom: 3em !important;
  border-bottom: 1px solid #ddd;
}

.hide-mobile{
  display: none;
}

.grid-item { 
  width: 100%; 
  margin-right: 0; 
  margin-bottom: 1.5em !important;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.rodape-mobile{ display: block; }
.rodape-desktop{ display: none; padding: 3em 0; }



@media (min-width: 540px) {

  .grid-item { 
    width: 47%; 
    margin-right: 3%; 
    margin-bottom: 1.2em !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  /*https://stackoverflow.com/questions/6509106/is-there-a-way-to-break-a-list-into-columns*/
  /*https://welcome.totheinter.net/columnizer-jquery-plugin/*/
  nav > ul {
    -moz-column-count: 2;
    -moz-column-gap: 30px;
    -webkit-column-count: 2;
    -webkit-column-gap: 30px;
    column-count: 2;
    column-gap: 30px;
  }

  .header-container-nav{
    padding-top: 60px;
    padding-bottom: 160px;

  }

  .icon-search { 
    position: block;
    top: auto;
  }

  .wrapper{ width: 80%; }
  .header-container-bar{ right: 10%;}
  .header-social{ display: inline-block; }
  .header-search{ display: none; }

  .graph-project .graph-legend{
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px;
  }

}

@media (min-width: 900px) {


  nav > ul ul{ display: block; }


  .header-container nav > ul > li{
    margin-bottom: 1em;
  }

  .rodape-mobile{ display: none; }
  .rodape-desktop{ display: block;}

  .main-container .project-title-shy{ display: none;}
  .pagination-top {display: block;}

  .project-tab { display: block; }
  .project-tab-stage{ display: none !important; }
  .project-tab-stage.stage-selected{ display: block !important; }

  .project-detail{ background: inherit;   padding: 1.5em 0 0 0 !important; border: 0; }
  .header-quote{ display: inline-block;}

  #map { height: 420px; }

  .graph-project {
    padding-bottom: inherit;
    margin-bottom: inherit;
    border-bottom: 0;
  }

  .hide-mobile{ display: block; }

  /*https://stackoverflow.com/questions/6509106/is-there-a-way-to-break-a-list-into-columns*/
  /*https://welcome.totheinter.net/columnizer-jquery-plugin/*/
  .columns-2 {
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px;
  }

  .columns-3,
  nav > ul {
    -moz-column-count: 3;
    -moz-column-gap: 20px;
    -webkit-column-count: 3;
    -webkit-column-gap: 20px;
    column-count: 3;
    column-gap: 20px;   
  }

  .dashboard-item:not(:first-child){
    border-left: 1px dotted #ddd;
  }

  .graph-project .graph-legend{
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
  }

}

@media (min-width: 1120px) {
  .wrapper{ width: 70%; }
  .header-container-bar{right: 15%;}
}

@media (min-width: 1380px) {
  .wrapper{ width: 65%; }
  .header-container-bar{right: 17.5%;}
}


/* --------- NAVIGATION ---------- */

.header-container nav{}
.header-container nav a {
  color: #ccc;
  text-decoration: none;
}
.header-container nav a:hover {
  color: #fff;
}

.header-container nav ul {
  list-style-type: none;
  padding: 0;
}

.header-container nav > ul {
  margin: 0; 
}

.header-container nav > ul > li > a{
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .75px;
  font-size: 0.85em;
  color: #b5cc2d;
  line-height: 1.5; 
  display: inline-block;
}

.header-container nav > ul > li.header-social-menu > a{
  font-size: 12px;d
}

.header-container nav > ul ul li {
  margin-top: 1px;
}
.header-container nav > ul ul li > a{
  font-size: .95em;
}
.header-container nav ul ul ul {
  display: none;
}


/* ---------- */

.header-container-bar{
  position: fixed;
  z-index: 9999;
  top: 0;
  margin-top: 10px;
}

.navbar-toggle{
  display: inline-block;

  vertical-align: top;
  text-align: center;
  background: rgba(0,0,0,.5);
  height: 36px;

}

.navbar-toggle a{
  display: inline-block;
  padding: 5px 9px 0 9px;
  margin: 0;
  z-index: 9999;
  text-decoration: none;
}
.navbar-toggle .icon-bar-text {
  color: #fff;
  font-size: .5em;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0;
  text-shadow: 0px 0px 6px rgba(0, 0, 0, .8);
}

.navbar-toggle .icon-bar {
  display: block;
  width: 20px;
  height: 2px;
  background: #fff;
  margin: 5px auto;
  padding: 0;

  -webkit-transition: transform .2s;
  -moz-transition: transform .2s;
  -o-transition: transform .2s;
  transition: transform .2s;
}

.menu-active .navbar-toggle .icon-bar.top{
  -ms-transform: rotate(-45deg) translate(-5px,5px);
  -webkit-transform: rotate(-45deg) translate(-5px,5px);
  transform: rotate(-45deg) translate(-5px,5px);
}
.menu-active .navbar-toggle .icon-bar.middle{
  opacity: 0;
}
.menu-active .navbar-toggle .icon-bar.bottom{
  -ms-transform: rotate(45deg) translate(-5px,-5px); 
  -webkit-transform: rotate(45deg) translate(-5px,-5px); 
  transform: rotate(45deg) translate(-5px,-5px);
}


.header-bar{
  display: block;
  text-align: right;
  width: 100%;
  background: #fbfbfb;
}
.navbar-btn{
  display: inline-block;
  color: #000;
  /*opacity: .8;*/
  text-transform: uppercase;
  font-size: 0.6em;
  padding-top: 4px;
  padding-bottom: 8px;
  text-decoration: none;
  letter-spacing: 1px;
  vertical-align: middle;
  /*text-shadow: 0px 0px 6px rgba(0, 0, 0, .8);*/
}


/* ---------- */

.footer-container nav{
  /*height: 350px !important;*/
}
.footer-container nav a {
  text-decoration: none;
}
.footer-container nav a:hover {
  color: #fff;
}

.footer-container nav ul {
  list-style-type: none;
  padding: 0;
}

.footer-container nav > ul {
  margin-top: 2em;
  margin-bottom: 1em; 
}

.footer-container nav > ul > li{
  margin-bottom: 1.2em;
}
.footer-container nav > ul > li > a{ /* TITULO*/
  font-weight: 900;
  font-size: .7em;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #b5cc2d;
}
.footer-container nav > ul ul li > a{ /* SUBTITULO*/
  font-size: 0.8em;
  color: #a2aba1;

}
.footer-container nav ul ul ul {
  display: none;
}

/** ************************************************* */
/** ************************************************* */
/** ************************************************* */


.home .header-container{
  min-height: 50vh;
}

.home .main-container{
  margin-top: 40px;
  padding-top: 50vh;
}


/** ************************************************* */
/** ************************************************* */
/** ************************************************* */

.home.menu-active .header-container{
  /*height: auto;*/
}

.header-container{
  background-color: #5d840d;
  /*background-image: url(../images/bg_low.jpg);*/
  background-position: center center;
  background-size: cover;
  width: 100%;
  z-index: 999;
  -moz-box-shadow:    inset 0 0 200px rgba(0,0,0,0.25);
  -webkit-box-shadow: inset 0 0 200px rgba(0,0,0,0.25);
  box-shadow:         inset 0 0 200px rgba(0,0,0,0.25);
  min-height: 120px;
  max-height: 100vh;
  overflow: hidden;
  position: fixed;
  top: 0;
}

.page-bg {
  opacity: 0;
  animation-name: fadeIn;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
  animation-duration: 1s;
  animation-fill-mode:forwards;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.header-container-nav{
  display: none;
  opacity: 0;
  background-color: rgba(0,0,0,.65);
  -webkit-transition: opacity 1s ease;
  -moz-transition: opacity 1s ease;
  -o-transition: opacity 1s ease;
  transition: opacity 1s ease;
}

.menu-active .header-container-nav{ opacity: 1; }
/*.menu-active .header-container{ max-height: 100vh; }*/

/** ************************************************* */
/** ************************************************* */
/** ************************************************* */


.header-container-fixed{
  position: absolute; 
  width: 100%; 
  bottom:0;
  /*top:0;*/
  z-index: 999;
}

.header-container-fixed > div {
  position: relative;
}

.header-container h1{
  padding: 0;
  margin: 0;
  display: inline-block;
  vertical-align: bottom;
}
.header-container .header-quote{
  padding: 0;
  margin: 0;
  font-weight: 700;
  color: #fff;
  font-size: 1em;
  margin-left: 20px;
  vertical-align: bottom;
  margin-bottom: 16px;
  text-align: right;
  text-shadow: 0px 0px 6px rgba(0, 0, 0, .8);
}

.header-container h1 a{
 display: block;
 width: 196px;
 height: 80px;
 margin: 0;
 padding: 0;
 -webkit-transition: all .25s ease;
 -moz-transition: all .25s ease;
 -o-transition: all .25s ease;
 transition: all .25s ease;
}

.home.menu-active .header-container.big h1 a {
 width: 200px;
 height: 80px;
}

.home .header-container.big h1 a {
  width: 300px;
  height: 120px;
}


.mobile.menu-active .header-container.big h1 a {
 width: 150px;
 height: 60px;
}

.header-container h1 img{
  width: 100%;
  margin-bottom: -2px;
}
.header-container h1 span{
  display: none;
}

.main-container{
 background: #fbfbfb;
 margin-top: 40px;
 padding-top: 100px;
 padding-bottom: 3em;
}

.footer-container{
  /*background: #172115;*/
  /*background: #2f652b;*/
  background: #232f20 ;
  color: #adabab;
  padding-top: 0.5em;
  padding-bottom: 1em;
}

.footer-cred-container{
  text-align: center;
  background: #fff;
  padding-top: 1em;
  padding-bottom: 1em;
}
.footer-cred-container img{
  max-width: 90%;
}

.box-aside{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 1em 1em;
  margin-bottom: 3em;
}

/*.box-aside .submenu-title {
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.85em;
  color: #b5cc2d;
  margin-top: 0;
  margin-bottom: 0.25em;
}*/
.box-aside ul{
  padding: 0;
  margin: 0;
  list-style-type: none;
}
.box-aside ul li{
  font-size: 1em;
  margin-top: 4px;
}
.box-aside ul li a{
  color: #2f652b; 
  text-decoration: none;
}
/*.box-aside ul li::before {
  content: "- ";
  margin-right: 10px;
  }*/

  .box-aside.submenu{ background: #b5cc2d; }
  
/*  .box-aside.submenu h5,
  .box-aside.submenu h5 a{
    margin-bottom: 10px;
  }*/

.box-aside.submenu .submenu-title,
.box-aside.submenu .submenu-title a{
  font-weight: 900;
    text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  /*font-size: 0.85em;*/
    color: #2f652b; 
  /*color: #b5cc2d;*/
  margin-top: 0;
  margin-bottom: 0.25em;
}

  
  .box-aside.submenu li a.selected{ color: #fff; }

  .box-aside.related{ background: #f0f0f0; }
  
  .box-aside.related h5,
  .box-aside.related h5 a {
    color: #2f652b; 
    text-decoration: none;
    margin-bottom: 10px;
  }

  .box-aside.related li a.selected{ color: #000; }




  /* ------ FORMULARIO ------- */

  .main-content .form-item{
    margin-bottom: 1.2em;
  }

  .main-content label{ 
    display: inline-block; 
    font-weight: 700; 
    margin: 0 2% .3em 4px; 
    font-size: .9em; 
    color: #666;
  }

  .main-content select,
  .main-content input[type=email],
  .main-content input[type=text],
  .main-content textarea { 
    padding: 5px 6px; 
    border: 1px #ccc solid; 
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px; 
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width:100%;
  }

  .main-content textarea { 
    height: 120px;
  }

  /* ------ LISTA ------- */

  .notification{
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    font-weight: 700;
    padding: 1em 1.5em;
    margin-bottom: 2em;
  }
  .notification b{ font-weight: 900;}

  .notification.success{
    background: #d9ec66;
    color: #768425;
    border: 1px #b5cc2d solid;
  }
  .notification.error{
    background: #fba6a6;
    color: #a03333;
    border: 1px #af5b5b solid;
  }
  .notification.alert{
    background: #f9ed8e;
    color: #ad8100;
    border: 1px #deb43c solid;
  }


  /* ------ LISTA ------- */

  .main-content ol,
  .main-content ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }

  .main-content ol li {
    counter-increment: step-counter;
    margin-bottom: 0.5em;
    margin-left: 30px;
    text-indent: -30px;
  }

  .main-content ol li::before {
    content: counter(step-counter);
    margin-right: 5px;
    font-size: 0.85em;

    color: #b5cc2d;
    font-weight: 900;
    padding: 0 8px;
  }

  .main-content ul li {
    margin-bottom: 0.5em;
    margin-left: 30px;
    text-indent: -30px;
  }

  .main-content ul li::before {
    content: "■";
    font-size: 0.85em;
    margin-right: 5px;
    padding: 0 8px;
    color: #b5cc2d;
  }

  .main-content .ol-attribution ul li {
    margin-left: 5px ;
    margin-right: 8px;
  }

  .main-content .ol-attribution ul li::before {
    content: ''!important;
    position: absolute;
    margin:0;
    padding:0;
  }

  /* ------ GALLERY ------- */

  .gallery{}
  .gallery-item{}
  .gallery-icon{}
  .gallery-icon img {width: 100%; height: 150px; margin-bottom: 1em}


  blockquote {
    font-style: italic;
    color: #999;
    margin-top: 2em;
    margin-bottom: 2em;
  }

  /* ------ FORM ------- */

  form{}
  form fieldset{}

  label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
  }

  /* ------ TABLE ------- */

  table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em auto 3em auto;
  }

  table caption {
    caption-side: bottom;
    font-size: 0.8em;
    font-style: italic;
    color: #999;
    text-align: center;
    margin-top: 1.5em;
  }
  table caption a {
    font-weight: 700;
    color: #999;
  }

  table td, table th{
    text-align: left;
    font-size: .9em;
  }
  table th{
    /*white-space: nowrap;*/
    padding: 6px 8px;
  }
  table td{
    padding: 12px 8px;
  }
  table td a, table th a{
    font-weight: 700;
    text-decoration: none;
    color: #666;
  }
  table td a:hover, table th a:hover{
    color: #000;
  }
  table thead tr{
    border-bottom: 2px solid #b5cc2d;
  }
  table thead th{
    font-size: .7em;
    text-transform: uppercase;
    font-weight: 900;
    color: #b7d434;
    /*color: #666;*/
  }
  table tbody tr{
    border-bottom: 1px dotted #999;
    transition: background-color 0.25s ease;
  }
  table tbody tr:hover{
    background: #f0f0f0;
  }

  table tfoot{
    font-weight: 900;
    font-size: .95em;
  }

  .responsive { overflow-x:auto; }
  .align-right{ text-align: right; }
  .align-center{ text-align: center; }


  table.responsive-table th{
    display: none;
  }
  table.responsive-table td,
  table.responsive-table tr{
    display: block;
  }
  table.responsive-table tr{
/*    padding-top: 0.5em;
padding-bottom: 0.5em;*/
}
table.responsive-table td{
  border: none;
  border-bottom: 1px solid #eee;
  position: relative;
  padding-left: 50%;
  white-space: normal;
  text-align: left;
}

/*  table.responsive-table td:before { 
    content: attr(data-th); 
    display: inline-block;
    font-weight: 700;
    font-size: 0.8em;
    line-height: 1.2;
    text-transform: uppercase;
    width: 30%;
    }*/

    table.responsive-table td:before{
      content: attr(data-th); 
      position: absolute;
      left: 6px;
      width: 45%;
      top: 50%;
      transform: translateY(-50%);
      padding-right: 10px;
      font-size: .8em;
      text-align: left;
      font-weight: 700;
    }


    /* ------ TABLE ------- */

    .main-container > div p > a{
      font-weight: 700;
      color: #2f652b;
    }
    .main-container > div p > a:hover{
      color: #b5cc2d;
    }
    .main-container header .breadcrumb,
    .main-container header .breadcrumb a{
      text-transform: uppercase;
      text-decoration: none;
      font-size: 0.75rem;
      font-weight: 900;
      letter-spacing: 0.5px;
      color: #b5cc2d;
    }
    .main-container header .breadcrumb a:hover{
      text-decoration: underline;
    }

    .main-container header{
      margin-bottom: 4em;
    }
    .main-container header h2{
      width: 80%;
      line-height: 1.1;
      font-size: 2em;
      font-weight: 400;
      color: #2f652b;
      margin: 0 0 5px 0;
      padding: 0;
    }
    .main-container header p{
      font-size: 1em;
      line-height: 1.4;
      /*width: 80%;*/
      font-style: italic;
      color: #999;
      margin-top: 0;
    }
    .main-container header p a{
      font-weight: 700;
      color: #666;
    }

    .main-container.expanded .project-title-shy{
      display: block !important;
      /*border-bottom: 2px solid #999;*/
    }

    .main-container h1{ font-size: 1.6em; }

    .main-container h2{
      font-size: 1.4em;
      font-weight: 400;
      color: #666;
/*      margin-top: 3em;
margin-bottom: .5em;*/
margin-top: 2.5em;
margin-bottom: 1em;
padding-bottom: 5px;
}

    .main-container h2.title-home{
      display: none;
    }


.main-container .main-content > *:first-child{
  margin-top: 0;
}
.main-container aside > *:first-child{
  margin-top: 0;
}

.main-container h3{
  text-transform: uppercase;
  /*color: #666 !important;*/
  color: #2f652b !important;
  font-size: 1em;
  font-weight: 900;
  letter-spacing: .5px;
  margin-top: 3em;
  margin-bottom: 1em;
  position: relative;
}

.main-container h3 span,
.main-container h3 a{
  /*display: block;*/
  margin-left: 8px;
  font-size: .8em;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  color: #999;
  text-decoration: none;
  text-transform: none;
}
.main-container h3 a:after{
  content:" »";
}
.main-container h3 a:hover{
  color: #b5cc2d;
}

.main-container h4{
  font-size: 1.1em;
  margin-top: 2em;
  /*margin-bottom: 1em;*/
}

.main-container h5{ font-size: 1em; }

/*.main-container h6{ font-size: .67em; text-transform: uppercase; letter-spacing: 1px; }*/



/* ------ ELEMENTOS ------- */

.btn {
  display: inline-block;
  font-weight: 700;
  padding: 6px 15px;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 2px solid transparent;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  outline:none;

  color: #ccc;
  background: #fff;
  border-color: #ccc !important;
  border-width: 1px !important;

  font-size: 0.9em;
}


.btn-title {
  color:#666; 
  font-size: .8rem; 
  font-weight: 900;
  text-transform:uppercase; 
  margin-bottom: 0;
  text-decoration: none;
}
.btn-title-desc {
  font-size: 0.85em;
  line-height: 1.4;
}

.btn-small {
  font-size: 0.8em;
  padding: 3px 10px;
}

.btn-big {
  font-size: 2em;
  padding: 3px 10px;
}

.btn-website{
  margin-bottom: 2em;
  color: #fff  !important;
  background: #b5cc2d !important;
  border-color: #b5cc2d !important;
  border-width: 2px !important;
}

.btn.btn-verde {
  color: #b5cc2d;
  background: #fff;
  border-color: #b5cc2d !important;
  border-width: 2px !important;
}
.btn.btn-form-project {
  color: #fff;
  background: #b5cc2d;
  border-color: #b5cc2d !important;
  border-width: 2px !important;
  margin-top: 1em;
}

.btn:hover,
.btn:active{
  color: #444 !important;;
  background: #ccc;
  border-color: #ccc;
}
.btn.btn-verde:hover,
.btn.btn-verde:active {
  color: #fff !important;
  background: #b5cc2d;
  border-color: #b5cc2d !important;
}
.btn.btn-form-project:hover {
  color: #b5cc2d !important;
  background: #fff;
  border-color: #b5cc2d !important;
  border-width: 2px !important;
}



/*    .feature-box{
      background-color: #fff;
      border: 1px solid #eee;
      padding: 1em 25px;

      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;

      -webkit-background-clip: padding-box;
      -moz-background-clip: padding;
      background-clip: padding-box;
      -webkit-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
      -moz-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
      box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);

      overflow-x:auto;
      }*/

      .feature-box{
        background-color: #fff;
        border: 1px solid #eee;
        padding: 1em 25px 1em 25px;

        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;

        -webkit-background-clip: padding-box;
        -moz-background-clip: padding;
        background-clip: padding-box;
        -webkit-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        -moz-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);

        /*overflow-x:auto;*/
      }

      .home .feature-box{
        margin: 2em auto 3em auto;
      }

      .feature-box > *:first-child { margin-top: 0; }
      .feature-box > *:last-child { margin-bottom: 0; }

      .image-box{
        display: inline-block;
        background-color: #fff;
        border: 1px solid #eee;
        padding: 1em 30px;
        text-align: center;

        margin: 2em auto 3em auto;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;

        -webkit-background-clip: padding-box;
        -moz-background-clip: padding;
        background-clip: padding-box;
        -webkit-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        -moz-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);

        overflow-x:auto;
      }

      .image-box > *:first-child { margin-top: 0; }
      .image-box > *:last-child { margin-bottom: 0; }

      /*----------------*/

      .highlight-container{
        background: #eee;
        padding-top: 2.5em;
        padding-bottom: 2em;
      }

      .highlight-container h3{
        color: #2f652b;
      }

      .highlight-item{
        margin-bottom: 1.5em;
      }
      .highlight-icon img,
      .highlight-item img{
        width: 100%;
        height: 200px;
      }

      .highlight-img{ 
        display: block; 
        width: 100%; 
        background-position: center center;
        background-size: cover;
      }

      .highlight-item-title{
        margin-top: 20px;
      }  
      .highlight-item-text{
        font-size: 0.9em;
      }
      .highlight-item-title a {
        font-weight: 700;
        text-decoration: none;
        color: #444;
      }
      .highlight-item-title a:hover {
        color: #000;
      }
      .highlight-item-title:after{
        content: "";
        display: block;
        background: #444;
        width: 20%;
        height: 2px;
        margin-top: 12px;
        margin-bottom: 12px;
      }

      /*------- HOME ------*/

      .home-banner{
        background-image: url(../images/banner_resultados.jpg);
        background-position: center center;
        background-size: cover;
        color: #fff; 
        font-size: 1.4em;
        font-weight: 700;
        padding: 15px 30px 20px 30px;
        margin-bottom: 2em;
        display: block;
        text-decoration: none;
        text-align: left;
        line-height: 1;
      }

      .home-banner span.amp{
        font-weight: 400;
        color: #666;
        font-size: 1.3em;
      }

      .home-banner-description{
        font-size: .8em;
        font-weight: 400;
        color: rgba(255,255,255,.8);
      }

      .btn-more{
        display: block;
        margin-top: 0.5em;
        font-size: .9em;
        font-weight: 700;
        letter-spacing: 0;
        color: #b5cc2d;
        text-decoration: none;
        text-transform: none;
      }
      .btn-more:after{
        content:" »";
      }

      .dashboard-box{
        background-color: #fff;
        border: 1px solid #eee;
        padding: 1em 15px;

        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;

        -webkit-background-clip: padding-box;
        -moz-background-clip: padding;
        background-clip: padding-box;
        -webkit-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        -moz-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);

      }

      .dashboard,
      .dashboard-item{
        margin-bottom: .5em;
      }

      .dashboard-item:not(:first-child){
        /*border-left: 0;*/
      }

      /* -------  */
/*
        .dashboard-item{
          width: 30%;
          margin-right: 3%;
          }*/

          /* -------  */


          .dashboard-numbers{
            font-size: 2.5em;
            font-weight: 900;
            letter-spacing: -1px;
            color: #b5cc2d;
            line-height: 1.2;
          }
          .dashboard-numbers span.dot {
            font-weight: 400 !important;
          }

          .dashboard-numbers span.unidade {
            font-weight: 400 !important;
            /*display: block;*/
            font-size: .5em;
          }

          .dashboard-image img{
            width: 100%;
          }
          .dashboard-text{
            text-transform: uppercase;
            font-size: 0.7em;
            font-weight: 900;
            margin-top: 0;
            color: #666;
            width: 90%;
          }
          .dashboard-text span{
            text-transform: uppercase;
            white-space: nowrap;
            text-transform: none;
            font-style: italic;
            font-weight: 400;
            color: #666;
          }

          .map{
            border: 1px solid #ddd;
            margin: 0;
            padding: 0;
          }
          .map img{
            display: block;
            max-width: 100%;
            margin: 0;
            padding: 0;
          }

          .graph{
            margin-top: 2em;
            margin-bottom: 0;
          }
          .graph > div{
            margin-bottom: 1em;
          }
          .graph img{
            max-width: 90%;
            margin: 0;
            padding: 0;
          }
          .graph p{
            font-size: .7em;
            font-weight: 700;
            line-height: 1.2;
            margin: 6px 0 0 0;
          }

          .graph-legend-home {
            margin: 2em 2% !important;
          }

          .graph-legend,
          .graph-legend a{
            font-size: .9em;
            font-weight: 700;
            color: #444;
            text-decoration: none;
          }
          .graph-legend a:hover{
            color: #000;
          }
          .main-content ul.graph-legend{
            list-style-type: none;
          }

          .main-content ul.graph-legend li:before{
            content:"";
            padding: 0;
            margin-left: 5px;
            margin-right: 12px;
            display: inline-block;

            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            border-radius: 50%;

            vertical-align: middle;
            width: 11px;
            height: 11px;
            border-width: 3px;
          }

          .main-content ul.graph-legend li.cor1:before{
            /*vermelho*/
            background:   rgb(222,77,51);
            border-color: rgb(179,62,41);
          }
          .main-content ul.graph-legend li.cor2:before{
            /*laranja*/
            background:   rgb(243,151,35);
            border-color: rgb(204,127,29);
          }
          .main-content ul.graph-legend li.cor3:before{
            /*amarelo*/
            background:   rgb(250,215,55);
            border-color: rgb(212,182,47);
          }
          .main-content ul.graph-legend li.cor4:before{
            /*verde*/
            background:   rgb(192,202,49);
            border-color: rgb(155,163,40);
          }
          .main-content ul.graph-legend li.cor5:before{
            /*turquesa*/
            background:   rgb(74,183,207);
            border-color: rgb(60,149,168);
          }
          .main-content ul.graph-legend li.cor6:before{
            /*azul*/
            background:   rgb(63,128,191);
            border-color: rgb(46,94,140);
          }
          .main-content ul.graph-legend li.cor7:before{
            background:   rgb(218,94,183);
            border-color: rgb(179,77,150);
          }

          table.graph-bar tr {
            border: 0 !important;
          }
          table.graph-bar td {
            padding: 0.25em 10px 0.25em 0 ; 
          }
          table.graph-bar .graph-bar-title{
            width: 50%;
            font-size: .8em;
            font-weight: 700;
          }
          table.graph-bar .graph-bar-total{
            /*width: 10%;*/
            font-weight: 900;
            font-size: 0.8em;
            text-align: right;
          }
          table.graph-bar .graph-bar-item{
            width: 50%;
          }
          table.graph-bar .graph-bar-item a{
            display: inline-block;
            height: 12px;
            background: #ccc;
            vertical-align: middle;
          }
          table.graph-bar tr:hover{
            background: transparent !important;
          }
          table.graph-bar tr:hover .graph-bar-item a{
            background: #2f652b;
          }

          .relatorio-img {
            width: 100%; 
            margin-top: 0 !important; 
            margin-bottom: 1.5em;
          }

          /*--- SEARCH ---*/

          .news{}

          .news-item{
           padding-bottom: 1.3em;
           margin-bottom:  1.2em;
         }
         .news-search-item{
           margin-bottom:  4em;
         }

         .news-item.destaque{ 
          padding: 0 1em 1em 1em; 
          margin-bottom: 2em; 
          background: #f0f0f0;
          -webkit-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
          -moz-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
          box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        }
        .news-search-item.destaque{ 
          padding: 0 1.5em 1.5em 1.5em; 
          margin-bottom: 4em; 
          background: #f0f0f0;
          -webkit-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
          -moz-box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
          box-shadow: 0 7px 20px -10px rgba(64, 64, 64, 0.9);
        } 

        .news-item.destaque:before,
        .news-search-item.destaque:before{
          content:"Destaque"; 
          text-transform: uppercase;
          display: block; font-size: .7em;
          letter-spacing: 1px; font-weight: 900;
          color: #b5cc2d; padding: 10px 0 5px 0;
        }

        .news-image img{ 
          width:90%; margin-top: .5em; margin-bottom: .5em;
        }

        .news-search-image img{ 
          width:100%;
          margin-bottom: 1em;
        }

        .news-search-date,
        .news-date{
          font-weight: 900; 
          font-size: 0.8em; 
          color: #b5cc2d; 
          letter-spacing: 1px; 
          margin-bottom: 0.5em;
        }

        .news-search-item.destaque .news-search-date,
        .news-item.destaque .news-date{ display: none;}

        .news-search-date:after,
        .news-date:after{
          content:"";
          display: block;
          background: #b5cc2d;
          margin-top: 0.7em;
          margin-bottom: 0.7em;
          width: 20%;
          height: 2px;
        }
        .news-search-date:after{
          margin-bottom: 20px;
          width: 10%;
        }

        .news-title{
          font-size: 1em; 
          font-weight: 700;  
          margin-bottom: 0.75em; 
          line-height: 1.3
        }
        .news-search-title{
          width: 90%;
          font-size: 1.2em; 
          font-weight: 700;  
          margin-bottom: 1em; 
          line-height: 1.4
        }

        .news-search-title a,
        .news-title a{
          text-decoration: none; 
          color: #666;
        }
        .news-search-title a:hover,
        .news-title a:hover{
          color: #000;
        }

        .desc{
          font-size: 0.85em;
          line-height: 1.6
        }

        .news-creditos {
          color: #666; 
          margin-top: 3em;
          margin-bottom: 4em;
          font-size: .85em;
          font-weight: 700;
        }
        .news-creditos:before { 
          content: "";
          display: block;
          background: #ccc;
          margin-bottom: 1em;
          width: 20%;
          height: 2px;
        }

        .share a {
          font-family: 'FontAwesome';
          font-size: 18px;
          display: inline-block; 
          text-decoration: none;
          width: 30px; 
          height: 30px; 
          -webkit-border-radius: 50%;
          -moz-border-radius: 50%;
          border-radius: 50%;
          background-color: #ddd;
          margin-right: 5px;
          color: #fff;
          overflow: hidden;
          text-align: center;
          -webkit-transition: background .3s ease;
          -moz-transition: background .3s ease;
          -o-transition: background .3s ease;
          transition: background .3s ease;  
        }

        .share a:hover {
          background: #2f652b;
        }

        .share a span{
          display: inline-block;
          line-height: 1.8;
        }

        .share a.facebook span:before{ content: "\f09a"; }
        .share a.twitter span:before{ content: "\f099"; }
        .share a.whatsapp span:before{ content: "\f232"; }

        .share a.whatsapp{ display: none; }
        .mobile .share a.whatsapp{ display: inline-block; }

        /*-------------------------------------------------*/


        .project-search{ border-top: 2px solid #444; margin-bottom: 2em; overflow: hidden;}

        .project-search-item{ border-bottom: 1px dotted #444; padding: 1.8em 15px 1.2em 15px;}
        .project-search-item:hover{ background-color: #f0f0f0; }

        .project-search-resp{ font-size: 1.1em;  font-weight: 700}
        .project-search-resp a{ text-decoration: none; color: #444;}
        .project-search-resp a:hover { color: #000;}
        .project-search-title{ font-size: 0.9em;  margin-bottom: 0.5em}
        .project-search-type{ text-transform: uppercase; color:#b5cc2d; font-size: 0.8em; font-weight: 700; margin-bottom: 0.5em}

        .project-search-desc{ text-transform: uppercase; font-size: 0.55em; font-weight: 900; margin-top: 4px; margin-bottom: 2px; color: #666;}
        .project-search-value{ font-size: 0.8em; margin-bottom: 12px;}


        /* -------------- */

        .form-project{ margin-bottom: 2.5em;}

        .form-project-item{
          position: relative;
          padding-top: 10px;
          margin-bottom: 1em;
        }

        .form-project label{
          display: block;
          font-size: 0.67em;
          font-weight: 700;
          text-transform: uppercase;
          position: absolute;
          top: 0;
          left: 5px;
          opacity: 0;
          padding-top: 6px;

          -webkit-transition: all .5s ease;
          -moz-transition: all .5s ease;
          -o-transition: all .5s ease;
          transition: all .5s ease;  
        }

        .form-project label.visible{
          padding-top: 3px;
          opacity: 1;
        }

        ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
          /*color: #b5cc2d;*/
          color: #aaa;
          font-weight: normal;
        }
        ::-moz-placeholder { /* Firefox 19+ */
          color: #aaa;
          font-weight: normal;
        }
        :-ms-input-placeholder { /* IE 10+ */
          color: #aaa;
          font-weight: normal;
        }
        :-moz-placeholder { /* Firefox 18- */
          color: #aaa;
          font-weight: normal;
        }


        .form-project input[type=text],
        .form-project select {
          width: 100%;
          color: #b5cc2d;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          padding: 7px 0 2px 0;
          font-size: 1.2em;
          font-family: inherit;
          background: transparent;
          border-bottom: 1px solid #ddd;
          border-top: 0;
          border-left: 0;
          border-right: 0;
          outline: 0;

/*    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;*/
  }


  .form-project input[type=text]:focus,
  .form-project select:focus {
    border-bottom: 1px solid #444;
  }


  .form-project select optgroup{
    color: #999;
  }
  .form-project select optgroup,
  .form-project select option {
    font-size: .9em;
  }

  .form-project input[type=text]{
    font-weight: 700;
    padding-left: 4px;
  }




  /* ------------ PAGINATION ------------ */ 

  .pagination{
    text-align: center;
    font-size: 1.1em;
    font-weight: 700;
    margin-bottom: 3em;
  }

  .pagination a {
    text-decoration: none;

  }

  .pagination a,
  .pagination span {
    display: inline-block;
    padding: 3px 8px;
    margin-right: 2px;
  }
  .pagination a.pagination-prev,
  .pagination a.pagination-next,
  .pagination a.pagination-page{
    color: #999;
  }

  .pagination a.pagination-prev:hover,
  .pagination a.pagination-next:hover,
  .pagination a.pagination-page:hover{
    color: #444;
  }
  .pagination span.pagination-current {
    background: #b5cc2d;
    font-weight: 700;
    color: #fff;
  }

  .pagination-top {
    margin-top: 3.5em;
  }
  .main-container.expanded .pagination-top {
    display: none;
  }
  .pagination-top a{
    /*display: block;*/
    font-weight: 700;
    text-decoration: none;
    color: #999;
  }

  .pagination-top a:after{
    font-family: 'FontAwesome';
    content: "\f106";
    margin-left: 5px;
  }
  /*--------------------   PROJETO -----------------------------------*/

  .filtro {
    list-style-type: none;
    padding: 0 0 5px 0;
    margin-top: 0;
  }

  .filtro-item {
    font-size:1.5em;
    color: #999;
  }

  .filtro-item a{
    text-decoration: none;
    color: #b5cc2d;

  }

  .filtro-item a:hover{
    color: #2f652b;
  }

  .filtro-tema a{
    margin-bottom:10px;
    font-size:1em;
    text-decoration: none;
    color: #b5cc2d;
  }
  .filtro-tema a:hover{
    color: #2f652b;
  }
  /*aside h6{
    margin-bottom: 0;
  }
*/
    aside .filter-title{
    margin-bottom: 0;
    font-size: .67em; 
    text-transform: uppercase;
    letter-spacing: 1px;
  }

  .project-tab{
    width: 100%;
    border-bottom: 2px solid #999;
    margin-bottom: 1em;
    position: relative;
  }

  .main-container.expanded .project-tab {
    border-bottom: 2px solid #eee;
  }

  .project-tab-btn{
    display: inline-block;
    padding: 8px 15px 5px 15px;
    margin-right: 8px;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.7em;
    letter-spacing: 1px;
    font-weight: 700;
    color: #aaa;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
  }
  .project-tab-btn:hover{
    color: #666;
  }
  .project-tab-btn.selected{
    font-weight: 900;
    color: #666;
    border-top: 2px solid #999;
    border-left: 2px solid #999;
    border-right: 2px solid #999;
    border-bottom: 2px solid #fbfbfb;
    margin-bottom: -4px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
  }

  .project-tab-all{
    font-size: .55em;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 700;
    position: absolute;
    right: 8px;
    top: 6px;
    background: #2f652b;
    padding: 3px 8px 2px 8px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    text-decoration: none;
  }
  .project-tab-all:hover{
    color: #ddd;
  }


  aside.project-detail{
    padding-top: 3em;
  }

  /*.project-tab-stage > *:first-child{ margin-top: 0; }*/

  .busca-home{
    text-transform: uppercase;
    color: #999;
    font-size: 0.9em;
    font-weight: 700;
    margin-right: 10px;
  }

  /* ---------- */

  .biblioteca-container {
    /*height: 350px !important;*/
  }
  .biblioteca-container a {
    text-decoration: none;
    text-transform: none;
  }
  .biblioteca-container a:hover {
    color: #2f652b;
  }

  .biblioteca-container ul {
    list-style-type: none;
    padding: 0;
  }

  .biblioteca-container ul li {
    text-indent: 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    margin-bottom: 0 !important;
  }
  .biblioteca-container ul li:before{

    content: "" !important;
    margin-right: 0 !important;
    padding: 0 !important;

  }

  .biblioteca-container > ul {
    margin-top: 0;
    margin-bottom: 4em; 
  }

  .biblioteca-container > ul ul {
    margin-bottom: 2em; 
  }

  .biblioteca-container > ul > li{
    margin-bottom: 0em;
  }
  .biblioteca-container > ul > li > a{ /* TITULO*/
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #b5cc2d;
  }
  .biblioteca-container > ul ul li > a{ /* SUBTITULO*/
    font-size: 0.9em;
    color: #747a73;
  }
  .biblioteca-container > ul ul li > a:hover{ /* SUBTITULO*/
    color: #444;
  }

  .biblioteca-search{ border-top: 2px solid #444; margin-bottom: 2em; overflow: hidden;}

  .biblioteca-search-item{ border-bottom: 1px dotted #444; padding: 1em 10px .5em 10px;}
  .biblioteca-search-item:hover{ background-color: #f0f0f0; }

  .biblioteca-search-resp{ font-size: 1.1em;  font-weight: 700}
  .biblioteca-search-resp a{ text-decoration: none; color: #444;}
  .biblioteca-search-resp a:hover { color: #000;}
  .biblioteca-search-title{ font-size: 0.9em;  margin-bottom: 0.5em}
  .biblioteca-search-type{ text-transform: uppercase; color:#b5cc2d; font-size: 0.8em; font-weight: 700; margin-bottom: 0.5em}

  .biblioteca-search-desc{ text-transform: uppercase; font-size: 0.55em; font-weight: 900; margin-top: 4px; margin-bottom: 2px; color: #666;}
  .biblioteca-search-value{ font-size: 0.8em; margin-bottom: 12px;}

  .biblioteca-search-img{ 
    display: block; 
    width: 100%; 
    background: #eee;
    margin-bottom: .5em;
    background-position: center center;
    background-size: cover;
    border: 1px solid #ccc;}

    .video img{
      width: 100%;
      display: block;
    }
    .video{
      position: relative;
      display: block;
      text-decoration: none;
    }

    .video:before{
      content: "\f144";
      font-size: 70px;
      font-family: 'FontAwesome';
      text-decoration: none;

      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      border-radius: 50%;

      color: #fff;

      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);

      opacity: .5;
      -webkit-transition: all .5s ease;
      -moz-transition: all .5s ease;
      -o-transition: all .5s ease;
      transition: all .5s ease; 
      text-shadow: 0px 0px 8px rgba(0, 0, 0, .5);
    }

    .video:hover:before {  opacity: 1; }

    .social { text-decoration: none;}
    .social span{ display:none; }


    .social:before {
      font-family: 'FontAwesome';
      font-weight: 400 !important;
      display: inline-block;
      text-decoration: none;
      vertical-align: middle;
      text-shadow: 0px 0px 8px rgba(0, 0, 0, .5);
    }

    .header-social .social:before {
      font-size: 1.6em;
      padding: 12px 5px;
      color: #fff;  
    }
    .header-social-menu .social:before {
      font-size: 2.5em;
      padding-right: 8px;
      color: #b5cc2d;  
    }

    .social-facebook:before { content: "\f082"; }
    .social-twitter:before { content: "\f081"; }
    .social-youtube:before { content: "\f166"; }

    .social-menu:before { content: "\f0c9"; font-size: 2em; }

    #chart-tooltip{
      position: fixed;
      font-size: .7em;
      padding: 2px 4px;
      display: none;
      top: -200px;
      background: #000;
      color: #fff;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      border-radius: 3px;
    }

    #chart-tooltip span{
      font-weight: 700;
    }

    /* ----- */

    .etapas-projeto{
      display: table;
      width: 100%;
    }
    .etapas-projeto-row{
      display: table-row;
    }
    .etapas-projeto-item span{
      display: block;
    }
    .etapas-projeto-item{
      display: table-cell;
      font-weight: 700;
      font-size: .9em;
      color: #888;
      background: #ddd;
      margin:0;
      width: 33%;
      /*padding: 8px 10px;*/
      padding: 5px 0px 5px 20px;
      text-align: center;
      vertical-align: middle;
      background-image: url('../images/seta.png');
      background-position: left center;
      background-repeat: no-repeat;
    }
    .etapas-projeto-item:first-child{
      padding: 5px 10px 5px 20px;
    }
    .etapas-projeto-item.concluido { background: #2f652b; color: #fff;}
    .etapas-projeto-item.concluido + .etapas-projeto-item { 
      background-image: url('../images/seta_next.png');
      background-position: left center;
      background-repeat: no-repeat;
    }
    .etapas-projeto-item.concluido + .etapas-projeto-item.concluido {
      background-image: url('../images/seta.png'); 
    }
    .etapas-projeto-titulo{
      text-transform: uppercase;
      letter-spacing: 1px;
      font-size: .6em;
      font-weight: 900;
    }
    .etapas-projeto-data{
      font-weight: 400;
      font-size: .9em;
    }

    .desembolso{
      margin-bottom: 3.5em;
    }
    .desembolso-bg{
      background: #ddd;
      width: 100%;
    }
    .desembolso-prog{
      background: #2f652b;
      color: #fff;
      display: block;
      text-align: right;
      padding: 2px 10px;
      font-weight: 900;
      overflow: hidden;
    }

    .newsletter{
      border: 2px #dedede solid;
      text-align: center;
      margin-top: 2em;

      padding: .75em .75em 1.25em .75em;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
    }
    .newsletter-title{
      font-size: .7rem;
      color: #666;
      display: block;
      margin-bottom: 1em;
      text-transform: uppercase;
      font-weight: 900;
    }
    .newsletter-title span{
      white-space: nowrap;
    }
    .newsletter input[type=text]{
      background: #fff;
      width: 70%;
      padding: 2px 8px 3px 8px;
      font-family: inherit;
      font-size: .9em;
    }
    .newsletter input[type=button]{
      background: #b5cc2d !important;
      color: #fff;
      margin-left: 5px;
      padding: 5px; 
    }
    .newsletter input[type=button]:hover{
      background: #2f652b !important;
      color: #fff !important;
      border-color: #2f652b !important; 
    }

    /*--------------------   QUADRO LÓGICO -----------------------------------*/
    
    .quadro-logico {
      text-align: center !important;
      margin: 2em auto;
    }

    .quadro-logico a{

      display: inline-block;

      font-size: 1.1em;
      font-weight: 700;

      padding: 0;

      text-align: center;
      text-decoration: none;
      white-space: nowrap;
      vertical-align: middle;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;

      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      outline: none;

      color: #b5cc2d;
      background: #fff;
      border: 3px solid #b5cc2d !important;

      -webkit-transition: all 250ms ease-out;
      -moz-transition: all 250ms ease-out;
      -o-transition: all 250ms ease-out;
      transition: all 250ms ease-out;

    }

    .quadro-logico a div{
      padding: 3px 12px;
    }
    .quadro-logico a div:not(:last-child){
      border-bottom: 2px #b5cc2d solid;
    }

    .quadro-logico a:hover{
      color: #fff;
      background: #b5cc2d;
    }


    @media print {

      body {
        font-size: 75%;
      }
      .header-container{
        background: none !important;
        position: relative;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
      }

      .header-bar,
      .header-container-bar{
        display: none;
      }


      .footer-container,
      .footer-cred-container{
        display: none !important;
        margin: 0 !important;
        padding: 0px !important;
      }
      .main-container{
        padding: 2em 0 !important;
        margin: 2em 0 !important;
      }

      .project-tab-stage{
        display: block !important;
      }

      .desembolso-bg,
      .etapas-projeto-item{
        border: 1px dotted #ccc;
        color: #ccc;
        font-size: 1.2em;
        page-break-inside: avoid;
        white-space: nowrap;
      }

      .desembolso-prog,
      .etapas-projeto-item.concluido{
        border: 2px solid #2f652b ;
        font-weight: 700 !important;
        color: #2f652b  !important;
      }

      .grid{
        display: block !important;
        height: auto !important;
      }
      .dashboard-item{
        display: block;
        position: relative !important;
        top: initial !important;
        left: initial !important;
        width: 47% !important;
        /*left: 50% !important;*/
        margin-right: 0;
        margin-bottom: .5em;
      }

      .hide-print{
        display: none !important;
      }
    }