/*
    code by Iatek LLC 2018 - CC 2.0 License - Attribution required
    code customized by Azmind.com
*/

.carousel-item {
  width: 100%;
}

@media (min-width: 768px) and (max-width: 991px) {
  /* Show 4th slide on md if col-md-4*/
  .carousel-inner .active.col-md-4.carousel-item + .carousel-item + .carousel-item + .carousel-item {
      position: absolute;
      top: 0;
      right: -33.3333%;  /*change this with javascript in the future*/
      z-index: -1;
      display: block;
      visibility: visible;
  }
}
@media (min-width: 576px) and (max-width: 768px) {
  /* Show 3rd slide on sm if col-sm-6*/
  .carousel-inner .active.col-sm-6.carousel-item + .carousel-item + .carousel-item {
      position: absolute;
      top: 0;
      right: -50%;  /*change this with javascript in the future*/
      z-index: -1;
      display: block;
      visibility: visible;
  }
}
@media (min-width: 576px) {
  .carousel-item {
      margin-right: 0;
  }
  /* show 2 items */
  .carousel-inner .active + .carousel-item {
      display: block;
  }
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {
      transition: none;
  }
  .carousel-inner .carousel-item-next {
      position: relative;
      transform: translate3d(0, 0, 0);
  }
  /* left or forward direction */
  .active.carousel-item-left + .carousel-item-next.carousel-item-left,
  .carousel-item-next.carousel-item-left + .carousel-item,
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item {
      position: relative;
      transform: translate3d(-100%, 0, 0);
      visibility: visible;
  }
  /* farthest right hidden item must be also positioned for animations */
  .carousel-inner .carousel-item-prev.carousel-item-right {
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
      display: block;
      visibility: visible;
  }
  /* right or prev direction */
  .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
  .carousel-item-prev.carousel-item-right + .carousel-item,
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item {
      position: relative;
      transform: translate3d(100%, 0, 0);
      visibility: visible;
      display: block;
      visibility: visible;
  }

  .carousel-item {
    width: calc(100% / 2);
  }
}
/* MD */
@media (min-width: 768px) {
  /* show 3rd of 3 item slide */
  .carousel-inner .active + .carousel-item + .carousel-item {
      display: block;
  }
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
      transition: none;
  }
  .carousel-inner .carousel-item-next {
      position: relative;
      transform: translate3d(0, 0, 0);
  }
  /* left or forward direction */
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
      position: relative;
      transform: translate3d(-100%, 0, 0);
      visibility: visible;
  }
  /* right or prev direction */
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
      position: relative;
      transform: translate3d(100%, 0, 0);
      visibility: visible;
      display: block;
      visibility: visible;
  }

  .carousel-item {
    width: 50%;
  }
}
/* LG */
@media (min-width: 991px) {
  /* show 4th item */
  .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {
      display: block;
  }
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
      transition: none;
  }
  /* Show 5th slide on lg if col-lg-3 */
  .carousel-inner .active.col-lg-3.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
      position: absolute;
      top: 0;
      right: -25%;  /*change this with javascript in the future*/
      z-index: -1;
      display: block;
      visibility: visible;
  }
  /* left or forward direction */
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
      position: relative;
      transform: translate3d(-100%, 0, 0);
      visibility: visible;
  }
  /* right or prev direction //t - previous slide direction last item animation fix */
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
      position: relative;
      transform: translate3d(100%, 0, 0);
      visibility: visible;
      display: block;
      visibility: visible;
  }

  .carousel-item {
    width: 25%;
  }
}


html {
    font-size: 62.5%;
  }
  
  body {
    font-size: 1.6rem;
  }
  
  html,
  body {
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  scroll-behavior: smooth;
  margin: 0;
  padding: 0;
  font-family: Montserrat;
  color: #fff;
  }
  
  .producoes_bg {
    height: auto;
    width: 100%;
    background-color: black;
    margin: 0;
    padding: 0;
  }

  .producoes_nav {
    padding-bottom: 5%;
    padding-top: 10%;
    /* max-height: 25px; */
  }

  .producoes_categorias {
    text-align: center;
    padding-left: 0;
  }

  .producoes_categorias a {
    text-align: center;
    text-decoration: none;
    color: #555555;
  }

  .producoes_categorias a:hover {
    text-decoration: none;
    color: white;
  }

  .open {
    color: white !important;
    text-decoration: none !important;
  }

  .grid-container {
    display: grid;
    height: auto;
    width: auto;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: 200px;
    gap: 20px 20px;
    padding-bottom: 5%;
  }
  
  .grid_video:nth-child(8n) {
    grid-column: auto /span 3;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 1) {
    grid-column: auto /span 4;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 2) {
    grid-column: auto /span 2;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 3) {
    grid-column: auto /span 3;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 4) {
    grid-column: auto /span 3;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 5) {
    grid-column: auto /span 2;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 6) {
    grid-column: auto /span 4;
    grid-row: auto /span 2;
  }
  
  .grid_video:nth-child(8n + 7) {
    grid-column: auto /span 3;
    grid-row: auto /span 2;
  }
  
  .thumb_textos {
      position: absolute;
      z-index: 99;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%); 
      -o-transform: translate(-50%); 
      transform: translate(-50%); 
      text-align: center;
  }
  
  .thumb_textos a {
    text-decoration: none;
    color: #fff;
  }

  .thumb_p a {
    text-decoration: none;
    color: #fff;
  }
  
  .thumb_transparency {
    background: rgba(0, 0, 0, 0.35);
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    z-index: 2;
  }

  .thumb_link {
    background: rgba(0, 0, 0, 0);
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    z-index: 99;
  }

  .grid_video {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 98;
  }
  
  .grid_video video {
    display: grid; 
    height: 100%; 
    min-height: 100.2%; 
    -o-object-fit: cover; 
    object-fit: cover; 
    position: relative; 
    left: 50%; 
    -webkit-transform: translate(-50%); 
    -o-transform: translate(-50%); 
    transform: translate(-50%);
    width: 100%; 
    width: auto; 
    min-width: 100%; 
    z-index: 1;
  }

  .projetos_sem-post {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    grid-column: auto /span 6;
    grid-row: auto /span 2;
  }

  
  @media (max-width: 1023px) {
    .grid-container {
        display: grid;
        height: auto;
        width: auto;
        grid-template-columns: 1fr;
        grid-auto-rows: 150px;
        gap: 20px 0px;
    }
  }

  @media (max-width: 1600px) {
    .producoes_nav {
      padding-bottom: 5%;
      padding-top: 15vh;
      /* max-height: 25px; */
    }  
  }