/*---------------------- six-panel start ----------------------*/

.six-panel.block-grid .image::before {
  float: left;
  padding-top: 75%;
  content: '';
}

.six-panel.block-grid .image::after {
  display: block;
  content: '';
  clear: both;
}

/** col text **/

.six-panel .col-text li {
  margin-left: 1rem;
  margin-bottom: 1rem;
}

.six-panel .col-text li {
  list-style: square;
  padding-left: 0.3rem;
}

.six-panel .col-text li::marker {
  font-size: 11px;
}

@media only screen and (min-width: 576px) {
  .six-panel.block-grid {
    grid-template-columns: 100%;
  }
}

@media only screen and (min-width: 768px) {
  .six-panel.block-grid .col-span-2{
    grid-column: span 2;
  }
  
  
  .six-panel.block-grid {
    grid-template-columns: repeat(3, 33.33%);
  }

  .six-panel.block-grid .image::before {
    float: left;
    padding-top: 75%;
    content: '';
  }
  .six-panel.block-grid .image::after {
    display: block;
    content: '';
    clear: both;
  }

  .six-panel.block-grid .el--1 {
    grid-column: 1 / span 2;
    grid-row: 1;
  }
  
  .six-panel.block-grid .el--2 {
    grid-column: 3;
  }

  .six-panel.block-grid .el--5 {
    grid-column: 1 / span 2;
    grid-row: 3;  
  }

  .six-panel.block-grid .el--6 {
    grid-column: 3;
  }

  .six-panel.block-grid .el--5 {
    grid-column: 1 / span 2;
    grid-row: 3;  
  }
  
  .six-panel.block-grid .el--6 {
    grid-column: 3;
  }

  .six-panel.block-grid .el--9 {
    grid-column: 1 / span 2;
    grid-row: 5;  
  }
  
  .six-panel.block-grid .el--10 {
    grid-column: 3;
  }

}

@media only screen and (min-width: 992px) {
  .six-panel .col-text {
    -moz-columns: 2 auto;
         columns: 2 auto;
  }
}
/*---------------------- six-panel end ----------------------*/
