.columns > div {
  display: grid;
}

.columns-2-cols > div {
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.columns-3-cols > div {
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px;
}

.columns-4-cols > div {
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 30px;
}

.columns-5-cols > div {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 16px;
}

.vertical-center-align > div{
  align-items: center;
}

.columns > div:first-child {
  margin-top: 0;
}

.columns > div > .columns-img-col img {
  display: block;
}

.columns-2-cols.columns-30-70 > div {
  grid-template-columns: 1fr 2.33fr;
}

.columns-2-cols.columns-70-30 > div {
  grid-template-columns: 2.33fr 1fr;
}

.columns-2-cols.columns-33-66 > div {
  grid-template-columns: 1fr 2fr;
}

.columns-2-cols.columns-66-33 > div {
  grid-template-columns: 2fr 1fr;
}

.columns-2-cols.columns-40-60 > div {
  grid-template-columns: 1fr 1.5fr;
}

.columns-2-cols.columns-60-40 > div {
  grid-template-columns: 1.5fr 1fr;
}



@media (width <= 655px) {
.invert-mobile.columns-2-cols > div > div:nth-child(1) {
    grid-row: 2;
  }

.invert-mobile.columns-2-cols > div > div:nth-child(2) {
    grid-row: 1;
  }
}




.columns-3-cols.columns-25-25-50 > div {
  grid-template-columns: 1fr 1fr 2fr ;
}

.columns-3-cols.columns-25-50-25 > div {
  grid-template-columns: 1fr 2fr 1fr ;
}

.columns-3-cols.columns-50-25-25 > div {
  grid-template-columns: 2fr 1fr 1fr ;
}

.columns-4-cols.columns-20-20-20-40 > div {
  grid-template-columns: 1fr 1fr 1fr 2fr;
}

.columns-4-cols.columns-20-20-40-20 > div {
  grid-template-columns: 1fr 1fr 2fr 1fr;
}

.columns-4-cols.columns-20-40-20-20 > div {
  grid-template-columns: 1fr 2fr 1fr 1fr;
}

.columns-4-cols.columns-40-20-20-20 > div {
  grid-template-columns: 2fr 1fr 1fr 1fr;
}

.columns-5-cols.columns-17-17-17-17-30 > div {
  grid-template-columns: 1fr 1fr 1fr 1fr 1.71fr;
}

.columns-5-cols.columns-17-17-17-30-17 > div {
  grid-template-columns: 1fr 1fr 1fr 1.71fr 1fr;
}

.columns-5-cols.columns-17-17-30-17-17 > div {
  grid-template-columns: 1fr 1fr 1.71fr 1fr 1fr;
}

.columns-5-cols.columns-17-30-17-17-17 > div {
  grid-template-columns: 1fr 1.71fr 1fr 1fr 1fr;
}

.columns-5-cols.columns-30-17-17-17-17 > div {
  grid-template-columns: 1.71fr 1fr 1fr 1fr 1fr;
}

.columns > div > div > :where(h1,h2,h3,h4,h5,h6):first-child {
  margin-top: 0;
}

@media (width <= 1140px) {
  .columns-2-cols > div,
  .columns-3-cols > div,
  .columns-4-cols > div,
  .columns-5-cols > div,
  .columns-2-cols.columns-30-70 > div,
  .columns-2-cols.columns-70-30 > div,
  .columns-2-cols.columns-33-66 > div,
  .columns-2-cols.columns-66-33 > div,
  .columns-2-cols.columns-40-60 > div,
  .columns-2-cols.columns-60-40 > div,
  .columns-3-cols.columns-25-25-50 > div,
  .columns-3-cols.columns-25-50-25 > div,
  .columns-3-cols.columns-50-25-25 > div,
  .columns-4-cols.columns-20-20-20-40 > div,
  .columns-4-cols.columns-20-20-40-20 > div,
  .columns-4-cols.columns-20-40-20-20 > div,
  .columns-4-cols.columns-40-20-20-20 > div,
  .columns-5-cols.columns-17-17-17-17-30 > div,
  .columns-5-cols.columns-17-17-17-30-17 > div,
  .columns-5-cols.columns-17-17-30-17-17 > div,
  .columns-5-cols.columns-17-30-17-17-17 > div,
  .columns-5-cols.columns-30-17-17-17-17 > div {
    grid-template-columns: repeat( auto-fit, minmax(300px, 1fr) );
  }
}