
.contenedor_hexagonos {
  box-sizing: border-box; 
  height: auto;
  }
  
  .cuerpo_hexagono {
/*    position: relative;  */
    width: 98.1vw;
    height: 90vh;
   
    font-family: "Montserrat", sans-serif;
    background: #4b94b1;
   
  /* 
   object-fit: scale-down;
    height: 100vh;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);  */
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
  
  .honeycomb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    justify-content: center;
    align-items: center;
    max-width: 1200px;
   
    margin: 0 auto;
    padding: 0;
    transform: translateY(34px);
    /*  transform: translateY(34.375px);  */
  
  }
  
  .honeycomb-cell {
    flex: 1 1 200px;
    max-width: 160px;
    height: 90px;
    /* 
    flex: 0 1 250px;
    max-width: 250px;
    height: 137.5px;
    */
    margin: 40px 11px 20px;
    position: relative;
    padding: 0.5em;
    text-align: center;
    z-index: 1;
  }
  
  .honeycomb-cell__title {
    object-fit: contain;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    -webkit-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
    word-break: break-word;
    text-transform: uppercase;
    color: #fff;
    font-weight:600;
    font-size:1.2em;
    /* transition: opacity 350ms;   */ 
    
    transition: opacity 350s;
  }
  
  .honeycomb-cell__title > small {
    font-weight: 300;
    margin-top: 0.35em;
  }
  
  .honeycomb-cell__image {
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
  }
  
  .honeycomb-cell::before, .honeycomb-cell::after {
    content: "";
  }
  
  .honeycomb-cell::before, .honeycomb-cell::after, .honeycomb-cell__image {
    top: -50%;
    left: 0;
    width: 100%;
    height: 200%;
    display: block;
    position: absolute;
    -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
            clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    z-index: -1;
  }
  
  .honeycomb-cell::before {
    background: rgb(135, 152, 161);
    transform: scale(1.055);
  }
  
  .honeycomb-cell::after {
    background: #16313bcb;
    opacity: 0.7;
    transition: opacity 350ms;
  }
  
  .honeycomb-cell:hover .honeycomb-cell__title {
    opacity: 0.6;
  }
  
  .honeycomb-cell:hover::before {
    background: #cbf803;
  }
  
  .honeycomb-cell:hover::after {
    opacity: 0.6;
  }
  
  .honeycomb__placeholder {
    display: none;
    opacity: 0.6;
    width: 200px;
    margin: 0 10px;
  }
  
  @media (max-width: 550px) {
    .honeycomb-cell {
      margin: 81.25px 25px;
    }
  }
  
  @media (min-width: 550px) and (max-width: 825px) {
    .honeycomb-cell:nth-child(5n) {
      margin-right: calc(40% - 200px);
      margin-left: calc(40% - 200px);
    }
  
    .honeycomb__placeholder:nth-child(5n+4) {
      display: block;
    }
  }
  
  @media (min-width: 825px) and (max-width: 1100px) {
    .honeycomb-cell:nth-child(8n+6) {
      margin-left: calc(50% - 200px);
    }
  
    .honeycomb-cell:nth-child(5n+6) {
      margin-right: calc(50% - 200px);
    }
  
    .honeycomb__placeholder:nth-child(5n),
  .honeycomb__placeholder:nth-child(5n+6) {
      display: block;
    }
  }
  
  @media (min-width: 1100px) {
    .honeycomb-cell:nth-child(5n+4) {
      margin-left: calc(40% - 300px);
    }
  
    .honeycomb-cell:nth-child(5n+4),
  .honeycomb-cell:nth-child(6n+4):nth-last-child(1) {
      margin-right: calc(40% - 300px);
    }
  
    .honeycomb__placeholder:nth-child(6n+4),
    .honeycomb__placeholder:nth-child(6n+4),
    .honeycomb__placeholder:nth-child(6n+4) {
      display: block;
    }
  }