.Columns {
  display: flex;
  flex-direction: row;
  gap: var(--spaces);
}

.Columns > script {
    display: none !important;
  }

.Columns.Columns-alignment--middle > .Column {
    justify-content: center;
  }

.Columns > .Column {
    display: flex;
    flex-direction: column;
    gap: 0 var(--spaces);
    min-width: 0;
    max-width: 100%;
  }

.Columns > .Column > .Column:last-child {
      flex: 1;
    }

.Columns-visibility--showOnlyOnDesktop {
  display: none;
}

@media screen and (min-width: 769px) {

.Columns-visibility--showOnlyOnDesktop {
    display: flex;
}
  }

.Columns-visibility--showOnlyOnMobile {
  display: flex;
}

@media screen and (min-width: 769px) {

.Columns-visibility--showOnlyOnMobile {
    display: none;
}
  }

.Columns-mobile--100-100 {
  flex-direction: column;
}

.Columns-mobile--100-100 > .Column {
    flex-basis: 100%;
  }

.Columns-mobile--50-50 {
  flex-direction: row;
}

.Columns-mobile--50-50 > .Column {
    flex-basis: 50%;
    max-width: calc(50% - var(--spaces) - 1);
  }

.Columns-mobile--25-75 {
  flex-direction: row;
}

.Columns-mobile--25-75 > .Column:nth-of-type(1) {
    flex-basis: 25%;
    max-width: calc(25% - var(--spaces) - 1);
  }

.Columns-mobile--25-75 > .Column:nth-of-type(2) {
    flex-basis: 75%;
    max-width: calc(75% - var(--spaces) - 1);
  }

.Columns-mobile--75-25 {
  flex-direction: row;
}

.Columns-mobile--75-25 > .Column:nth-of-type(1) {
    flex-basis: 75%;
    max-width: calc(75% - var(--spaces) - 1);
  }

.Columns-mobile--75-25 > .Column:nth-of-type(2) {
    flex-basis: 25%;
    max-width: calc(25% - var(--spaces) - 1);
  }

.Columns-mobile--33-66 {
  flex-direction: row;
}

.Columns-mobile--33-66 > .Column:nth-of-type(1) {
    flex-basis: 33.33.33%;
    max-width: calc(33.33.33% - var(--spaces) - 1);
  }

.Columns-mobile--33-66 > .Column:nth-of-type(2) {
    flex-basis: 66.66%;
    max-width: calc(66.66% - var(--spaces) - 1);
  }

.Columns-mobile--66-33 {
  flex-direction: row;
}

.Columns-mobile--66-33 > .Column:nth-of-type(1) {
    flex-basis: 66.66%;
    max-width: calc(6.66% - var(--spaces) - 1);
  }

.Columns-mobile--66-33 > .Column:nth-of-type(2) {
    flex-basis: 33.3%;
    max-width: calc(33.33% - var(--spaces) - 1);
  }

.Columns-mobile--100-100-100 {
  flex-direction: column;
}

.Columns-mobile--100-100-100 > .Column {
    flex-basis: 100%;
  }

.Columns-mobile--33-33-33 {
  flex-direction: row;
}

.Columns-mobile--33-33-33 > .Column {
    flex-basis: 33.33%;
    max-width: calc(33.33% - var(--spaces) - 1);
  }

.Columns-mobile--16-66-16 {
  flex-direction: row;
}

.Columns-mobile--16-66-16 > .Column:nth-of-type(1) {
    flex-basis: 16.66%;
    max-width: calc(16.66% - var(--spaces) - 1);
  }

.Columns-mobile--16-66-16 > .Column:nth-of-type(2) {
    flex-basis: 66.66%;
    max-width: calc(66.66% - var(--spaces) - 1);
  }

.Columns-mobile--16-66-16 > .Column:nth-of-type(3) {
    flex-basis: 16.66%;
    max-width: calc(16.66% - var(--spaces) - 1);
  }

.Columns-mobile--16-16-66 {
  flex-direction: row;
}

.Columns-mobile--16-16-66 > .Column:nth-of-type(1) {
    flex-basis: 16.66%;
    max-width: calc(16.66% - var(--spaces) - 1);
  }

.Columns-mobile--16-16-66 > .Column:nth-of-type(2) {
    flex-basis: 16.66%;
    max-width: calc(16.66% - var(--spaces) - 1);
  }

.Columns-mobile--16-16-66 > .Column:nth-of-type(3) {
    flex-basis: 66%;
    max-width: calc(66% - var(--spaces) - 1);
  }

.Columns-mobile--66-16-16 {
  flex-direction: row;
}

.Columns-mobile--66-16-16 > .Column:nth-of-type(1) {
    flex-basis: 66%;
    max-width: calc(66% - var(--spaces) - 1);
  }

.Columns-mobile--66-16-16 > .Column:nth-of-type(2) {
    flex-basis: 16.66%;
    max-width: calc(16.66% - var(--spaces) - 1);
  }

.Columns-mobile--66-16-16 > .Column:nth-of-type(3) {
    flex-basis: 16.66%;
    max-width: calc(16.66% - var(--spaces) - 1);
  }

.Columns-mobile--25-25-25-25 {
  flex-direction: row;
  flex-wrap: wrap;
}

.Columns-mobile--25-25-25-25 > .Column {
    flex-basis: calc(25% - var(--spaces));
    max-width: calc(25% - var(--spaces) - 1);
  }

.Columns-mobile--50-50-50-50 {
  flex-direction: row;
  flex-wrap: wrap;
}

.Columns-mobile--50-50-50-50 > .Column {
    flex-basis: calc(50% - var(--spaces));
    max-width: calc(50% - var(--spaces) - 1);
  }

.Columns-mobile--100-100-100-100 {
  flex-direction: column;
}

.Columns-mobile--100-100-100-100 > .Column {
    flex-basis: 100%;
  }

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .Columns-tablet--100-100 {
    flex-direction: column;
  }

    .Columns-tablet--100-100 > .Column {
      flex-basis: 100%;
    }

  .Columns-tablet--50-50 {
    flex-direction: row;
  }

    .Columns-tablet--50-50 > .Column {
      flex-basis: 50%;
      max-width: calc(50% - var(--spaces) - 1);
    }

  .Columns-tablet--25-75 {
    flex-direction: row;
  }

    .Columns-tablet--25-75 > .Column:nth-of-type(1) {
      flex-basis: 25%;
      max-width: calc(25% - var(--spaces) - 1);
    }

    .Columns-tablet--25-75 > .Column:nth-of-type(2) {
      flex-basis: 75%;
      max-width: calc(75% - var(--spaces) - 1);
    }

  .Columns-tablet--75-25 {
    flex-direction: row;
  }

    .Columns-tablet--75-25 > .Column:nth-of-type(1) {
      flex-basis: 75%;
      max-width: calc(75% - var(--spaces) - 1);
    }

    .Columns-tablet--75-25 > .Column:nth-of-type(2) {
      flex-basis: 25%;
      max-width: calc(25% - var(--spaces) - 1);
    }

  .Columns-tablet--33-66 {
    flex-direction: row;
  }

    .Columns-tablet--33-66 > .Column:nth-of-type(1) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

    .Columns-tablet--33-66 > .Column:nth-of-type(2) {
      flex-basis: 66.66%;
      max-width: calc(66.66% - var(--spaces) - 1);
    }

  .Columns-tablet--66-33 {
    flex-direction: row;
  }

    .Columns-tablet--66-33 > .Column:nth-of-type(1) {
      flex-basis: 66.66%;
      max-width: calc(66.66% - var(--spaces) - 1);
    }

    .Columns-tablet--66-33 > .Column:nth-of-type(2) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

  .Columns-tablet--100-100-100 {
    flex-direction: column;
  }

    .Columns-tablet--100-100-100 > .Column {
      flex-basis: 100%;
    }

  .Columns-tablet--33-33-33 {
    flex-direction: row;
  }

    .Columns-tablet--33-33-33 > .Column {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

  .Columns-tablet--16-66-16 {
    flex-direction: row;
  }

    .Columns-tablet--16-66-16 > .Column:nth-of-type(1) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns-tablet--16-66-16 > .Column:nth-of-type(2) {
      flex-basis: 66%;
      max-width: calc(66% - var(--spaces) - 1);
    }

    .Columns-tablet--16-66-16 > .Column:nth-of-type(3) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

  .Columns-tablet--16-16-66 {
    flex-direction: row;
  }

    .Columns-tablet--16-16-66 > .Column:nth-of-type(1) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns-tablet--16-16-66 > .Column:nth-of-type(2) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns-tablet--16-16-66 > .Column:nth-of-type(3) {
      flex-basis: 66%;
      max-width: calc(66% - var(--spaces) - 1);
    }

  .Columns-tablet--66-16-16 {
    flex-direction: row;
  }

    .Columns-tablet--66-16-16 > .Column:nth-of-type(1) {
      flex-basis: 66%;
      max-width: calc(66% - var(--spaces) - 1);
    }

    .Columns-tablet--66-16-16 > .Column:nth-of-type(2) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns-tablet--66-16-16 > .Column:nth-of-type(3) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

  .Columns-tablet--100-100-100-100 {
    flex-direction: column;
  }

    .Columns-tablet--100-100-100-100 > .Column {
      flex-basis: 100%;
    }

  .Columns-tablet--50-50-50-50 {
    flex-direction: row;
    flex-wrap: wrap;
  }

    .Columns-tablet--50-50-50-50 > .Column {
      flex-basis: calc(50% - var(--spaces));
      max-width: calc(50% - var(--spaces) - 1);
    }

  .Columns-tablet--25-25-25-25 {
    flex-direction: row;
    flex-wrap: wrap;
  }

    .Columns-tablet--25-25-25-25 > .Column {
      flex-basis: calc(25% - var(--spaces));
      max-width: calc(25% - var(--spaces) - 1);
    }
}

@media screen and (min-width: 1026px) {
  .Columns--50-50 {
    flex-direction: row;
  }

    .Columns--50-50 > .Column {
      flex-basis: 50%;
      max-width: calc(50% - var(--spaces) - 1);
    }

  .Columns--25-75 {
    flex-direction: row;
  }

    .Columns--25-75 > .Column:nth-of-type(1) {
      flex-basis: 25%;
      max-width: calc(25% - var(--spaces) - 1);
    }

    .Columns--25-75 > .Column:nth-of-type(2) {
      flex-basis: 75%;
      max-width: calc(75% - var(--spaces) - 1);
    }

  .Columns--75-25 {
    flex-direction: row;
  }

    .Columns--75-25 > .Column:nth-of-type(1) {
      flex-basis: 75%;
      max-width: calc(75% - var(--spaces) - 1);
    }

    .Columns--75-25 > .Column:nth-of-type(2) {
      flex-basis: 25%;
      max-width: calc(25% - var(--spaces) - 1);
    }

  .Columns--33-66 {
    flex-direction: row;
  }

    .Columns--33-66 > .Column:nth-of-type(1) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

    .Columns--33-66 > .Column:nth-of-type(2) {
      flex-basis: 66.66%;
      max-width: calc(66.66% - var(--spaces) - 1);
    }

  .Columns--66-33 {
    flex-direction: row;
  }

    .Columns--66-33 > .Column:nth-of-type(1) {
      flex-basis: 66.66%;
      max-width: calc(66.66% - var(--spaces) - 1);
    }

    .Columns--66-33 > .Column:nth-of-type(2) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

  .Columns--40-60 {
    flex-direction: row;
  }

    .Columns--40-60 > .Column:nth-of-type(1) {
      flex-basis: 40%;
      max-width: calc(40% - var(--spaces) - 1);
    }

    .Columns--40-60 > .Column:nth-of-type(2) {
      flex-basis: 60%;
      max-width: calc(60% - var(--spaces) - 1);
    }

  .Columns--60-40 {
    flex-direction: row;
  }

    .Columns--60-40 > .Column:nth-of-type(1) {
      flex-basis: 60%;
      max-width: calc(60% - var(--spaces) - 1);
    }

    .Columns--60-40 > .Column:nth-of-type(2) {
      flex-basis: 40%;
      max-width: calc(40% - var(--spaces) - 1);
    }

  .Columns--33-33-33 {
    flex-direction: row;
  }

    .Columns--33-33-33 > .Column:nth-of-type(1) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

    .Columns--33-33-33 > .Column:nth-of-type(2) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

    .Columns--33-33-33 > .Column:nth-of-type(2) {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

  .Columns--33-33-33 {
    flex-direction: row;
  }

    .Columns--33-33-33 > .Column {
      flex-basis: 33.33%;
      max-width: calc(33.33% - var(--spaces) - 1);
    }

  .Columns--16-66-16 {
    flex-direction: row;
  }

    .Columns--16-66-16 > .Column:nth-of-type(1) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns--16-66-16 > .Column:nth-of-type(2) {
      flex-basis: 66%;
      max-width: calc(66% - var(--spaces) - 1);
    }

    .Columns--16-66-16 > .Column:nth-of-type(3) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

  .Columns--16-16-66 {
    flex-direction: row;
  }

    .Columns--16-16-66 > .Column:nth-of-type(1) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns--16-16-66 > .Column:nth-of-type(2) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns--16-16-66 > .Column:nth-of-type(3) {
      flex-basis: 66%;
      max-width: calc(66% - var(--spaces) - 1);
    }

  .Columns--66-16-16 {
    flex-direction: row;
  }

    .Columns--66-16-16 > .Column:nth-of-type(1) {
      flex-basis: 66%;
      max-width: calc(66% - var(--spaces) - 1);
    }

    .Columns--66-16-16 > .Column:nth-of-type(2) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

    .Columns--66-16-16 > .Column:nth-of-type(3) {
      flex-basis: 16.66%;
      max-width: calc(16.66% - var(--spaces) - 1);
    }

  .Columns--25-25-25-25 {
    flex-direction: row;
    flex-wrap: wrap;
  }

    .Columns--25-25-25-25 > .Column {
      flex-basis: calc(25% - var(--spaces));
      max-width: calc(25% - var(--spaces) - 1);
    }
}

.Column.has-backgroundcolor {
  padding: var(--spaces);
}

.Headline + .Columns,
.Text + .Columns {
  margin-top: var(--margin-s);
}

@media screen and (max-width: 768px) {

.Headline + .Columns,
.Text + .Columns {
    margin-top: var(--margin-s--mobile);
}
  }

.Columns + .Columns {
  margin-top: 32px;
}