/* ----------------------------------------------------------------
Grid Layout
color for geopark estrela - #006cb6
-----------------------------------------------------------------*/

.grid-layout, .portfolioo, .posts {
  position: relative;
  display: block;
  clear: both;
  padding: 0;
}

.grid-layout {
  opacity: 0;
  margin-bottom: -2px !important;
}

.grid-layout.grid-loaded {
  opacity: 1;
}

.grid-mix-size .portfolio-item:nth-child(2n) .new-badge {
  right: 70px !important;
}

.grid-mix-size .portfolio-item:nth-child(2n)>.portfolio-item-wrap {
  -webkit-transform: scale(0.75);
  transform: scale(0.8);
}

/*Grid columns: 5*/

.grid-6-columns .grid-item, .post-6-columns .post-item, .portfolio-6-columns .portfolio-item {
  width: 16.6666666666%;
}

.grid-6-columns .grid-item.large-width, .post-6-columns .post-item.large-width, .portfolio-6-columns .portfolio-item.large-width {
  width: 33.333333333%;
}

/*Grid columns: 5*/

.grid-5-columns .grid-item, .post-5-columns .post-item, .portfolio-5-columns .portfolio-item {
  width: 20%;
}

.grid-5-columns .grid-item.large-width, .post-5-columns .post-item.large-width, .portfolio-5-columns .portfolio-item.large-width {
  width: 40%;
}

/*Grid columns: 4*/

.grid-4-columns .grid-item, .post-4-columns .post-item, .portfolio-4-columns .portfolio-item {
  width: 25%;
}

.grid-4-columns .grid-item.large-width, .post-4-columns .post-item.large-width, .portfolio-4-columns .portfolio-item.large-width {
  width: 50%;
}

/*Grid columns: 3*/

.grid-3-columns .grid-item, .post-3-columns .post-item, .portfolio-3-columns .portfolio-item {
  width: 33.333333333%;
}

.grid-3-columns .grid-item.large-width, .post-3-columns .post-item.large-width, .portfolio-3-columns .portfolio-item.large-width {
  width: 66.6666666666%;
}

/*Grid columns: 2*/

.grid-2-columns .grid-item, .post-2-columns .post-item, .portfolio-2-columns .portfolio-item {
  width: 50.00%;
}

.grid-2-columns .grid-item.large-width, .post-2-columns .post-item.large-width, .portfolio-2-columns .portfolio-item.large-width {
  width: 100%;
}

/*Grid columns: 1*/

.grid-1-columns .grid-item, .post-1-columns .post-item, .portfolio-1-columns .portfolio-item {
  width: 100%;
}

.grid-1-columns .grid-item.large-width, .post-1-columns .post-item.large-width, .portfolio-1-columns .portfolio-item.large-width {
  width: 100%;
}

@media (max-width: 1380px) {
  .grid-5-columns .grid-item, .post-5-columns .post-item, .portfolio-5-columns .portfolio-item {
    width: 25%;
  }
  .grid-5-columns .grid-item.large-width, .post-5-columns .post-item.large-width, .portfolio-5-columns .portfolio-item.large-width {
    width: 50%;
  }
}

/*Tablet Landscape*/

@media (max-width: 991px) {
  /*Grid columns: 5,4*/
  .grid-5-columns .grid-item, .post-5-columns .post-item, .portfolio-5-columns .portfolio-item, .grid-4-columns .grid-item, .post-4-columns .post-item, .portfolio-4-columns .portfolio-item {
    width: 33.3333333333%;
  }
  .grid-5-columns .grid-item.large-width, .post-5-columns .post-item.large-width, .portfolio-5-columns .portfolio-item.large-width, .grid-4-columns .grid-item.large-width, .post-4-columns .post-item.large-width, .portfolio-4-columns .portfolio-item.large-width {
    width: 66.6666666666%;
  }
  /*Grid columns: 3,2*/
  .portfolio-3-columns .portfolio-item, .portfolio-2-columns .portfolio-item {
    width: 100%;
  }
  /*Grid columns: 3,2*/
  .grid-3-columns .grid-item, .grid-2-columns .grid-item, .post-2-columns .post-item, .post-3-columns .post-item {
    width: 50%;
  }
  .grid-3-columns .grid-item.large-width, .post-3-columns .post-item.large-width, .portfolio-3-columns .portfolio-item.large-width, .grid-2-columns .grid-item.large-width, .post-2-columns .post-item.large-width, .portfolio-2-columns .portfolio-item.large-width {
    width: 100%;
  }
}

/*Tablet Portrait*/

@media (max-width: 767px) {
  /*Grid columns: 5,4*/
  .grid-5-columns .grid-item, .post-5-columns .post-item, .portfolio-5-columns .portfolio-item, .grid-4-columns .grid-item, .post-4-columns .post-item, .portfolio-4-columns .portfolio-item {
    width: 50%;
  }
  .grid-5-columns .grid-item.large-width, .post-5-columns .post-item.large-width, .portfolio-5-columns .portfolio-item.large-width, .grid-4-columns .grid-item.large-width, .post-4-columns .post-item.large-width, .portfolio-4-columns .portfolio-item.large-width {
    width: 100%;
  }
  /*Grid columns: 3,2*/
  .portfolio-3-columns .portfolio-item, .portfolio-2-columns .portfolio-item {
    width: 100%;
  }
  /*Grid columns: 3,2*/
  .grid-3-columns .grid-item, .grid-2-columns .grid-item, .post-2-columns .post-item, .post-3-columns .post-item {
    width: 100%;
  }
  .grid-3-columns .grid-item.large-width, .post-3-columns .post-item.large-width, .portfolio-3-columns .portfolio-item.large-width, .grid-2-columns .grid-item.large-width, .post-2-columns .post-item.large-width, .portfolio-2-columns .portfolio-item.large-width {
    width: 100%;
  }
}

/*Tablet Portrait*/

@media (max-width: 480px) {
  /*Grid columns: 5,4,3,2*/
  .grid-5-columns .grid-item, .post-5-columns .post-item, .portfolio-5-columns .portfolio-item, .grid-4-columns .grid-item, .post-4-columns .post-item, .portfolio-4-columns .portfolio-item, .grid-3-columns .grid-item, .post-3-columns .post-item, .portfolio-3-columns .portfolio-item, .grid-2-columns .grid-item, .post-2-columns .post-item, .portfolio-2-columns .portfolio-item {
    width: 100%;
  }
  .grid-5-columns .grid-item.large-width, .post-5-columns .post-item.large-width, .portfolio-5-columns .portfolio-item.large-width, .grid-4-columns .grid-item.large-width, .post-4-columns .post-item.large-width, .portfolio-4-columns .portfolio-item.large-width, .grid-3-columns .grid-item.large-width, .post-3-columns .post-item.large-width, .portfolio-3-columns .portfolio-item.large-width, .grid-2-columns .grid-item.large-width, .post-2-columns .post-item.large-width, .portfolio-2-columns .portfolio-item.large-width {
    width: 100%;
  }
}

/*Grid item */

.grid-item .post-item {
  width: 100%;
  padding: 0;
}

.grid-item>img, .grid-item>a>img {
  width: 100%;
}

/* ----------------------------------------------------------------
	Grid Filter
-----------------------------------------------------------------*/

.grid-filter {
  clear: both;
  display: block;
  height: auto;
  width: 100%;
  margin-bottom: 26px;
  position: relative;
}

.grid-filter ul {
  list-style: none;
  padding: 0;
  position: relative;
  height: auto;
}

.grid-filter li {
  position: relative;
  margin-right: 6px;
  border: 0;
  margin-bottom: -1px;
  display: inline-block;
  /* float: left; */
}

.grid-filter li a {
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  display: block;
  position: relative;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 15px;
  color: #565656;
  border-radius: 10px;
  transition: all .3s ease;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
}

.grid-filter li:hover a, .grid-filter li.active a {
  color: #ffffff;
  background-color: #006cb6;
}

.grid-filter.gf-outline li:hover a, .grid-filter.gf-outline li.active a {
  border-color: #006cb6;
  color: #006cb6;
  background-color: transparent;
}
