@media (min-width: 769px) {
  .one-column {
    display: flex;
    /* position: relative; */
  }
  .one-column .column {
    flex: 100% !important;
    opacity: 1 !important;
  }
  .two-column {
    display: flex;
  }
  .two-column .column-first-50-50 {
    flex: 50% !important;
    margin-left: 10px;
    margin-right: 3px;
  }
  .two-column .column-first-33-66 {
    flex: 33% !important;
    margin-left: 10px;
    margin-right: 3px;
  }
  .two-column .column-first-66-33 {
    flex: 66% !important;
    margin-left: 10px;
    margin-right: 3px;
  }
  .two-column .column-first-25-75 {
    flex: 25% !important;
    margin-left: 10px;
    margin-right: 3px;
  }
  .two-column .column-first-75-25 {
    flex: 75% !important;
    margin-left: 10px;
    margin-right: 3px;
  }
  .two-column .column-second-50-50 {
    flex: 50% !important;
    margin-left: 5px;
    margin-right: 10px;
  }
  .two-column .column-second-33-66 {
    flex: 66% !important;
    margin-left: 5px;
    margin-right: 10px;
  }
  .two-column .column-second-66-33 {
    flex: 33% !important;
    margin-left: 5px;
    margin-right: 10px;
  }
  .two-column .column-second-25-75 {
    flex: 75% !important;
    margin-left: 5px;
    margin-right: 10px;
  }
  .two-column .column-second-75-25 {
    flex: 25% !important;
    margin-left: 5px;
    margin-right: 10px;
  }
  .three-column {
    display: flex;
  }
  .three-column .column {
    flex: 33% !important;
    margin-left: 10px;
    margin-right: 5px;
  }
  .four-column {
    display: flex;
  }
  .four-column .column {
    flex: 25% !important;
    margin-left: 10px;
    margin-right: 5px;
  }
}
.one-column .column,
.two-column .column,
.three-column .column,
.four-column .column {
  flex: 100%;
}
.one-column [class^=column-first-],
.one-column [class^=column-second-],
.two-column [class^=column-first-],
.two-column [class^=column-second-],
.three-column [class^=column-first-],
.three-column [class^=column-second-],
.four-column [class^=column-first-],
.four-column [class^=column-second-] {
  flex: 100%;
}

.column-justify-flex-start {
  justify-content: flex-start;
}

.column-justify-center {
  justify-content: center;
}

.column-justify-flex-end {
  justify-content: flex-end;
}

.column-justify-space-between {
  justify-content: space-between;
}

.column-justify-space-around {
  justify-content: space-around;
}

.column-justify-space-evenly {
  justify-content: space-evenly;
}

.column-align-flex-start {
  align-items: flex-start;
}

.column-align-center {
  align-items: center;
}

.column-align-flex-end {
  align-items: flex-end;
}

.grid-container-sm-1 {
  display: grid;
  grid-template-columns: repeat(1, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-1 {
    display: grid;
    grid-template-columns: repeat(1, auto);
  }
}
.grid-container-sm-2 {
  display: grid;
  grid-template-columns: repeat(2, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-2 {
    display: grid;
    grid-template-columns: repeat(2, auto);
  }
}
.grid-container-sm-3 {
  display: grid;
  grid-template-columns: repeat(3, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-3 {
    display: grid;
    grid-template-columns: repeat(3, auto);
  }
}
.grid-container-sm-4 {
  display: grid;
  grid-template-columns: repeat(4, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-4 {
    display: grid;
    grid-template-columns: repeat(4, auto);
  }
}
.grid-container-sm-5 {
  display: grid;
  grid-template-columns: repeat(5, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-5 {
    display: grid;
    grid-template-columns: repeat(5, auto);
  }
}
.grid-container-sm-6 {
  display: grid;
  grid-template-columns: repeat(6, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-6 {
    display: grid;
    grid-template-columns: repeat(6, auto);
  }
}
.grid-container-sm-7 {
  display: grid;
  grid-template-columns: repeat(7, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-7 {
    display: grid;
    grid-template-columns: repeat(7, auto);
  }
}
.grid-container-sm-8 {
  display: grid;
  grid-template-columns: repeat(8, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-8 {
    display: grid;
    grid-template-columns: repeat(8, auto);
  }
}
.grid-container-sm-9 {
  display: grid;
  grid-template-columns: repeat(9, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-9 {
    display: grid;
    grid-template-columns: repeat(9, auto);
  }
}
.grid-container-sm-10 {
  display: grid;
  grid-template-columns: repeat(10, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-10 {
    display: grid;
    grid-template-columns: repeat(10, auto);
  }
}
.grid-container-sm-11 {
  display: grid;
  grid-template-columns: repeat(11, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-11 {
    display: grid;
    grid-template-columns: repeat(11, auto);
  }
}
.grid-container-sm-12 {
  display: grid;
  grid-template-columns: repeat(12, auto);
}

@media only screen and (min-width: 768px) {
  .grid-container-12 {
    display: grid;
    grid-template-columns: repeat(12, auto);
  }
}