.pg-row {
  display: flex;
  flex-flow: row wrap;
  margin: 0 -15px;
}

/* Horizontal alignment */
.pg-row.pg-alignment-left {
  justify-content: flex-start;
}

.pg-row.pg-alignment-center {
  justify-content: center;
}

.pg-row.pg-alignment-right {
  justify-content: flex-end;
}

/* Vertical alignment */
.pg-row.pg-align-items-top {
  align-items: flex-start;
}

.pg-row.pg-align-items-middle {
  align-items: center;
}

.pg-row.pg-align-items-bottom {
  align-items: flex-end;
}

/* Grid */
.pg-col {
  box-sizing: border-box;
  padding: 15px;
  position: relative;
  width: 100%;
}

.pg-sm-1-column .pg-col {
  flex: 0 0 100%;
  max-width: 100%;
}

.pg-sm-2-column .pg-col {
  flex: 0 0 50%;
  max-width: 50%;
}

.pg-sm-3-column .pg-col {
  flex: 0 0 33.3%;
  max-width: 33.3%;
}

.pg-sm-4-column .pg-col {
  flex: 0 0 25%;
  max-width: 25%;
}

.pg-sm-5-column .pg-col {
  flex: 0 0 20%;
  max-width: 20%;
}

.pg-sm-6-column .pg-col {
  flex: 0 0 16.6%;
  max-width: 16.6%;
}

.pg-sm-7-column .pg-col {
  flex: 0 0 14.285%;
  max-width: 14.285%;
}

.pg-sm-8-column .pg-col {
  flex: 0 0 12.5%;
  max-width: 12.5%;
}

@media (min-width: 768px) {
  .pg-md-1-column .pg-col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .pg-md-2-column .pg-col {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .pg-md-3-column .pg-col {
    flex: 0 0 33.3%;
    max-width: 33.3%;
  }

  .pg-md-4-column .pg-col {
    flex: 0 0 25%;
    max-width: 25%;
  }

  .pg-md-5-column .pg-col {
    flex: 0 0 20%;
    max-width: 20%;
  }

  .pg-md-6-column .pg-col {
    flex: 0 0 16.6%;
    max-width: 16.6%;
  }

  .pg-md-7-column .pg-col {
    flex: 0 0 14.285%;
    max-width: 14.285%;
  }

  .pg-md-8-column .pg-col {
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
}

@media (min-width: 992px) {
  .pg-lg-1-column .pg-col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .pg-lg-2-column .pg-col {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .pg-lg-3-column .pg-col {
    flex: 0 0 33.3%;
    max-width: 33.3%;
  }

  .pg-lg-4-column .pg-col {
    flex: 0 0 25%;
    max-width: 25%;
  }

  .pg-lg-5-column .pg-col {
    flex: 0 0 20%;
    max-width: 20%;
  }

  .pg-lg-6-column .pg-col {
    flex: 0 0 16.6%;
    max-width: 16.6%;
  }

  .pg-lg-7-column .pg-col {
    flex: 0 0 14.285%;
    max-width: 14.285%;
  }

  .pg-lg-8-column .pg-col {
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
}