/* //ANCHOR -----CONTAINER--  ______*/
.main-wrapper { max-width: var(--side-max-width); margin: auto; padding: 0; }
/* //ANCHOR -----FLEXBOX--  ______*/
/* //ANCHOR flex Grundlagen */
.flex { display: flex !important; }
.flex-row { display: flex !important; flex-direction: row !important; }
.flex-column { display: flex !important; flex-direction: column !important; }
.flex-1 { flex: 1 !important; }
.flex-wrap { flex-wrap: wrap !important; }
/* //ANCHOR felx Jusify-Content */
.jc-start { justify-content: flex-start !important; }
.jc-end { justify-content: flex-end !important; }
.jc-center { justify-content: center !important; }
.jc-between { justify-content: space-between !important; }
.jc-around { justify-content: space-around !important; }
.jc-evenly { justify-content: space-evenly !important; }
/* //ANCHOR felx Align-Items */
.ai-start { align-items: flex-start !important; }
.ai-end { align-items: flex-end !important; }
.ai-center { align-items: center !important; }
.ai-stretch { align-items: stretch !important; }
.ai-baseline { align-items: baseline !important; }
/* //ANCHOR felx Align-self */
.as-start { align-self: flex-start !important; }
.as-end { align-self: flex-end !important; }
.as-center { align-self: center !important; }
.as-stretch { align-self: stretch !important; }
.as-baseline { align-self: baseline !important; }
/* //ANCHOR felx Align-content */
.ac-start { align-content: flex-start !important; }
.ac-end { align-content: flex-end !important; }
.ac-center { align-content: center !important; }
.ac-stretch { align-content: stretch !important; }
.ac-baseline { align-content: baseline !important; }
/* //ANCHOR flex ROW + justify */
.flex-row-start { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; }
.flex-row-end { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; }
.flex-row-center { display: flex !important; flex-direction: row !important; justify-content: center !important; }
.flex-row-between { display: flex !important; flex-direction: row !important; justify-content: space-between !important; }
.flex-row-around { display: flex !important; flex-direction: row !important; justify-content: space-around !important; }
.flex-row-evenly { display: flex !important; flex-direction: row !important; justify-content: space-evenly !important; }
/* //ANCHOR flex ROW-Reverse + justify */
.flex-row-reverse-start { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-start !important; }
.flex-row-reverse-end { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; }
.flex-row-reverse-center { display: flex !important; flex-direction: row-reverse !important; justify-content: center !important; }
.flex-row-reverse-between { display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important; }
.flex-row-reverse-around { display: flex !important; flex-direction: row-reverse !important; justify-content: space-around !important; }
.flex-row-reverse-evenly { display: flex !important; flex-direction: row-reverse !important; justify-content: space-evenly !important; }
/* //ANCHOR flex COLUMN + justify */
.flex-column-start { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; }
.flex-column-end { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; }
.flex-column-center { display: flex !important; flex-direction: column !important; justify-content: center !important; }
.flex-column-between { display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
.flex-column-around { display: flex !important; flex-direction: column !important; justify-content: space-around !important; }
.flex-column-evenly { display: flex !important; flex-direction: column !important; justify-content: space-evenly !important; }
/* //ANCHOR flex COLUMN-Reverse + justify */
.flex-column-reverse-start { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-start !important; }
.flex-column-reverse-end { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
.flex-column-reverse-center { display: flex !important; flex-direction: column-reverse !important; justify-content: center !important; }
.flex-column-reverse-between { display: flex !important; flex-direction: column-reverse !important; justify-content: space-between !important; }
.flex-column-reverse-around { display: flex !important; flex-direction: column-reverse !important; justify-content: space-around !important; }
.flex-column-reverse-evenly { display: flex !important; flex-direction: column-reverse !important; justify-content: space-evenly !important; }
@media (min-width: 480px) {
  .flex-sm { display: flex !important; }
  .flex-row-sm { display: flex !important; flex-direction: row !important; }
  .flex-column-sm { display: flex !important; flex-direction: column !important; }
  .flex-1-sm { flex: 1 !important; }
  .flex-wrap-sm { flex-wrap: wrap !important; }
  /*  felx Jusify-Content */
  .jc-start-sm { justify-content: flex-start !important; }
  .jc-end-sm { justify-content: flex-end !important; }
  .jc-center-sm { justify-content: center !important; }
  .jc-between-sm { justify-content: space-between !important; }
  .jc-around-sm { justify-content: space-around !important; }
  .jc-evenly-sm { justify-content: space-evenly !important; }
  /*  felx Align-Items */
  .ai-start-sm { align-items: flex-start !important; }
  .ai-end-sm { align-items: flex-end !important; }
  .ai-center-sm { align-items: center !important; }
  .ai-stretch-sm { align-items: stretch !important; }
  .ai-baseline-sm { align-items: baseline !important; }
  /*  felx Align-self */
  .as-start-sm { align-self: flex-start !important; }
  .as-end-sm { align-self: flex-end !important; }
  .as-center-sm { align-self: center !important; }
  .as-stretch-sm { align-self: stretch !important; }
  .as-baseline-sm { align-self: baseline !important; }
  /*  felx Align-content */
  .ac-start-sm { align-content: flex-start !important; }
  .ac-end-sm { align-content: flex-end !important; }
  .ac-center-sm { align-content: center !important; }
  .ac-stretch-sm { align-content: stretch !important; }
  .ac-baseline-sm { align-content: baseline !important; }
  /*  flex ROW + justify */
  .flex-row-start-sm { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; }
  .flex-row-end-sm { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; }
  .flex-row-center-sm { display: flex !important; flex-direction: row !important; justify-content: center !important; }
  .flex-row-between-sm { display: flex !important; flex-direction: row !important; justify-content: space-between !important; }
  .flex-row-around-sm { display: flex !important; flex-direction: row !important; justify-content: space-around !important; }
  .flex-row-evenly-sm { display: flex !important; flex-direction: row !important; justify-content: space-evenly !important; }
  /*  flex ROW-Reverse + justify */
  .flex-row-reverse-start-sm { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-start !important; }
  .flex-row-reverse-end-sm { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; }
  .flex-row-reverse-center-sm { display: flex !important; flex-direction: row-reverse !important; justify-content: center !important; }
  .flex-row-reverse-between-sm { display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important; }
  .flex-row-reverse-around-sm { display: flex !important; flex-direction: row-reverse !important; justify-content: space-around !important; }
  .flex-row-reverse-evenly-sm { display: flex !important; flex-direction: row-reverse !important; justify-content: space-evenly !important; }
  /*  flex COLUMN + justify */
  .flex-column-start-sm { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; }
  .flex-column-end-sm { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; }
  .flex-column-center-sm { display: flex !important; flex-direction: column !important; justify-content: center !important; }
  .flex-column-between-sm { display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
  .flex-column-around-sm { display: flex !important; flex-direction: column !important; justify-content: space-around !important; }
  .flex-column-evenly-sm { display: flex !important; flex-direction: column !important; justify-content: space-evenly !important; }
  /*  flex COLUMN-Reverse + justify */
  .flex-column-reverse-start-sm { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-start !important; }
  .flex-column-reverse-end-sm { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
  .flex-column-reverse-center-sm { display: flex !important; flex-direction: column-reverse !important; justify-content: center !important; }
  .flex-column-reverse-between-sm { display: flex !important; flex-direction: column-reverse !important; justify-content: space-between !important; }
  .flex-column-reverse-around-sm { display: flex !important; flex-direction: column-reverse !important; justify-content: space-around !important; }
  .flex-column-reverse-evenly-sm { display: flex !important; flex-direction: column-reverse !important; justify-content: space-evenly !important; }
}

@media (min-width: 768px) {
  .flex-md { display: flex !important; }
  .flex-row-md { display: flex !important; flex-direction: row !important; }
  .flex-column-md { display: flex !important; flex-direction: column !important; }
  .flex-1-md { flex: 1 !important; }
  .flex-wrap-md { flex-wrap: wrap !important; }
  /*  felx Jusify-Content */
  .jc-start-md { justify-content: flex-start !important; }
  .jc-end-md { justify-content: flex-end !important; }
  .jc-center-md { justify-content: center !important; }
  .jc-between-md { justify-content: space-between !important; }
  .jc-around-md { justify-content: space-around !important; }
  .jc-evenly-md { justify-content: space-evenly !important; }
  /*  felx Align-Items */
  .ai-start-md { align-items: flex-start !important; }
  .ai-end-md { align-items: flex-end !important; }
  .ai-center-md { align-items: center !important; }
  .ai-stretch-md { align-items: stretch !important; }
  .ai-baseline-md { align-items: baseline !important; }
  /*  felx Align-self */
  .as-start-md { align-self: flex-start !important; }
  .as-end-md { align-self: flex-end !important; }
  .as-center-md { align-self: center !important; }
  .as-stretch-md { align-self: stretch !important; }
  .as-baseline-md { align-self: baseline !important; }
  /*  felx Align-content */
  .ac-start-md { align-content: flex-start !important; }
  .ac-end-md { align-content: flex-end !important; }
  .ac-center-md { align-content: center !important; }
  .ac-stretch-md { align-content: stretch !important; }
  .ac-baseline-md { align-content: baseline !important; }
  /*  flex ROW + justify */
  .flex-row-start-md { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; }
  .flex-row-end-md { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; }
  .flex-row-center-md { display: flex !important; flex-direction: row !important; justify-content: center !important; }
  .flex-row-between-md { display: flex !important; flex-direction: row !important; justify-content: space-between !important; }
  .flex-row-around-md { display: flex !important; flex-direction: row !important; justify-content: space-around !important; }
  .flex-row-evenly-md { display: flex !important; flex-direction: row !important; justify-content: space-evenly !important; }
  /*  flex ROW-Reverse + justify */
  .flex-row-reverse-start-md { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-start !important; }
  .flex-row-reverse-end-md { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; }
  .flex-row-reverse-center-md { display: flex !important; flex-direction: row-reverse !important; justify-content: center !important; }
  .flex-row-reverse-between-md { display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important; }
  .flex-row-reverse-around-md { display: flex !important; flex-direction: row-reverse !important; justify-content: space-around !important; }
  .flex-row-reverse-evenly-md { display: flex !important; flex-direction: row-reverse !important; justify-content: space-evenly !important; }
  /*  flex COLUMN + justify */
  .flex-column-start-md { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; }
  .flex-column-end-md { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; }
  .flex-column-center-md { display: flex !important; flex-direction: column !important; justify-content: center !important; }
  .flex-column-between-md { display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
  .flex-column-around-md { display: flex !important; flex-direction: column !important; justify-content: space-around !important; }
  .flex-column-evenly-md { display: flex !important; flex-direction: column !important; justify-content: space-evenly !important; }
  /*  flex COLUMN-Reverse + justify */
  .flex-column-reverse-start-md { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-start !important; }
  .flex-column-reverse-end-md { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
  .flex-column-reverse-center-md { display: flex !important; flex-direction: column-reverse !important; justify-content: center !important; }
  .flex-column-reverse-between-md { display: flex !important; flex-direction: column-reverse !important; justify-content: space-between !important; }
  .flex-column-reverse-around-md { display: flex !important; flex-direction: column-reverse !important; justify-content: space-around !important; }
  .flex-column-reverse-evenly-md { display: flex !important; flex-direction: column-reverse !important; justify-content: space-evenly !important; }
}

@media (min-width: 1024px) {
  .flex-lg { display: flex !important; }
  .flex-row-lg { display: flex !important; flex-direction: row !important; }
  .flex-column-lg { display: flex !important; flex-direction: column !important; }
  .flex-1-lg { flex: 1 !important; }
  .flex-wrap-lg { flex-wrap: wrap !important; }
  /*  felx Jusify-Content */
  .jc-start-lg { justify-content: flex-start !important; }
  .jc-end-lg { justify-content: flex-end !important; }
  .jc-center-lg { justify-content: center !important; }
  .jc-between-lg { justify-content: space-between !important; }
  .jc-around-lg { justify-content: space-around !important; }
  .jc-evenly-lg { justify-content: space-evenly !important; }
  /*  felx Align-Items */
  .ai-start-lg { align-items: flex-start !important; }
  .ai-end-lg { align-items: flex-end !important; }
  .ai-center-lg { align-items: center !important; }
  .ai-stretch-lg { align-items: stretch !important; }
  .ai-baseline-lg { align-items: baseline !important; }
  /*  felx Align-self */
  .as-start-lg { align-self: flex-start !important; }
  .as-end-lg { align-self: flex-end !important; }
  .as-center-lg { align-self: center !important; }
  .as-stretch-lg { align-self: stretch !important; }
  .as-baseline-lg { align-self: baseline !important; }
  /*  felx Align-content */
  .ac-start-lg { align-content: flex-start !important; }
  .ac-end-lg { align-content: flex-end !important; }
  .ac-center-lg { align-content: center !important; }
  .ac-stretch-lg { align-content: stretch !important; }
  .ac-baseline-lg { align-content: baseline !important; }
  /*  flex ROW + justify */
  .flex-row-start-lg { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; }
  .flex-row-end-lg { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; }
  .flex-row-center-lg { display: flex !important; flex-direction: row !important; justify-content: center !important; }
  .flex-row-between-lg { display: flex !important; flex-direction: row !important; justify-content: space-between !important; }
  .flex-row-around-lg { display: flex !important; flex-direction: row !important; justify-content: space-around !important; }
  .flex-row-evenly-lg { display: flex !important; flex-direction: row !important; justify-content: space-evenly !important; }
  /*  flex ROW-Reverse + justify */
  .flex-row-reverse-start-lg { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-start !important; }
  .flex-row-reverse-end-lg { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; }
  .flex-row-reverse-center-lg { display: flex !important; flex-direction: row-reverse !important; justify-content: center !important; }
  .flex-row-reverse-between-lg { display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important; }
  .flex-row-reverse-around-lg { display: flex !important; flex-direction: row-reverse !important; justify-content: space-around !important; }
  .flex-row-reverse-evenly-lg { display: flex !important; flex-direction: row-reverse !important; justify-content: space-evenly !important; }
  /*  flex COLUMN + justify */
  .flex-column-start-lg { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; }
  .flex-column-end-lg { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; }
  .flex-column-center-lg { display: flex !important; flex-direction: column !important; justify-content: center !important; }
  .flex-column-between-lg { display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
  .flex-column-around-lg { display: flex !important; flex-direction: column !important; justify-content: space-around !important; }
  .flex-column-evenly-lg { display: flex !important; flex-direction: column !important; justify-content: space-evenly !important; }
  /*  flex COLUMN-Reverse + justify */
  .flex-column-reverse-start-lg { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-start !important; }
  .flex-column-reverse-end-lg { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
  .flex-column-reverse-center-lg { display: flex !important; flex-direction: column-reverse !important; justify-content: center !important; }
  .flex-column-reverse-between-lg { display: flex !important; flex-direction: column-reverse !important; justify-content: space-between !important; }
  .flex-column-reverse-around-lg { display: flex !important; flex-direction: column-reverse !important; justify-content: space-around !important; }
  .flex-column-reverse-evenly-lg { display: flex !important; flex-direction: column-reverse !important; justify-content: space-evenly !important; }
}

@media (min-width: 1280px) {
  .flex-xl { display: flex !important; }
  .flex-row-xl { display: flex !important; flex-direction: row !important; }
  .flex-column-xl { display: flex !important; flex-direction: column !important; }
  .flex-1-xl { flex: 1 !important; }
  .flex-wrap-xl { flex-wrap: wrap !important; }
  /*  felx Jusify-Content */
  .jc-start-xl { justify-content: flex-start !important; }
  .jc-end-xl { justify-content: flex-end !important; }
  .jc-center-xl { justify-content: center !important; }
  .jc-between-xl { justify-content: space-between !important; }
  .jc-around-xl { justify-content: space-around !important; }
  .jc-evenly-xl { justify-content: space-evenly !important; }
  /*  felx Align-Items */
  .ai-start-xl { align-items: flex-start !important; }
  .ai-end-xl { align-items: flex-end !important; }
  .ai-center-xl { align-items: center !important; }
  .ai-stretch-xl { align-items: stretch !important; }
  .ai-baseline-xl { align-items: baseline !important; }
  /*  felx Align-self */
  .as-start-xl { align-self: flex-start !important; }
  .as-end-xl { align-self: flex-end !important; }
  .as-center-xl { align-self: center !important; }
  .as-stretch-xl { align-self: stretch !important; }
  .as-baseline-xl { align-self: baseline !important; }
  /*  felx Align-content */
  .ac-start-xl { align-content: flex-start !important; }
  .ac-end-xl { align-content: flex-end !important; }
  .ac-center-xl { align-content: center !important; }
  .ac-stretch-xl { align-content: stretch !important; }
  .ac-baseline-xl { align-content: baseline !important; }
  /*  flex ROW + justify */
  .flex-row-start-xl { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; }
  .flex-row-end-xl { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; }
  .flex-row-center-xl { display: flex !important; flex-direction: row !important; justify-content: center !important; }
  .flex-row-between-xl { display: flex !important; flex-direction: row !important; justify-content: space-between !important; }
  .flex-row-around-xl { display: flex !important; flex-direction: row !important; justify-content: space-around !important; }
  .flex-row-evenly-xl { display: flex !important; flex-direction: row !important; justify-content: space-evenly !important; }
  /*  flex ROW-Reverse + justify */
  .flex-row-reverse-start-xl { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-start !important; }
  .flex-row-reverse-end-xl { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; }
  .flex-row-reverse-center-xl { display: flex !important; flex-direction: row-reverse !important; justify-content: center !important; }
  .flex-row-reverse-between-xl { display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important; }
  .flex-row-reverse-around-xl { display: flex !important; flex-direction: row-reverse !important; justify-content: space-around !important; }
  .flex-row-reverse-evenly-xl { display: flex !important; flex-direction: row-reverse !important; justify-content: space-evenly !important; }
  /*  flex COLUMN + justify */
  .flex-column-start-xl { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; }
  .flex-column-end-xl { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; }
  .flex-column-center-xl { display: flex !important; flex-direction: column !important; justify-content: center !important; }
  .flex-column-between-xl { display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
  .flex-column-around-xl { display: flex !important; flex-direction: column !important; justify-content: space-around !important; }
  .flex-column-evenly-xl { display: flex !important; flex-direction: column !important; justify-content: space-evenly !important; }
  /*  flex COLUMN-Reverse + justify */
  .flex-column-reverse-start-xl { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-start !important; }
  .flex-column-reverse-end-xl { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
  .flex-column-reverse-center-xl { display: flex !important; flex-direction: column-reverse !important; justify-content: center !important; }
  .flex-column-reverse-between-xl { display: flex !important; flex-direction: column-reverse !important; justify-content: space-between !important; }
  .flex-column-reverse-around-xl { display: flex !important; flex-direction: column-reverse !important; justify-content: space-around !important; }
  .flex-column-reverse-evenly-xl { display: flex !important; flex-direction: column-reverse !important; justify-content: space-evenly !important; }
}

@media (min-width: 1440px) {
  .flex-xxl { display: flex !important; }
  .flex-row-xxl { display: flex !important; flex-direction: row !important; }
  .flex-column-xxl { display: flex !important; flex-direction: column !important; }
  .flex-1-xxl { flex: 1 !important; }
  .flex-wrap-xxl { flex-wrap: wrap !important; }
  /*  felx Jusify-Content */
  .jc-start-xxl { justify-content: flex-start !important; }
  .jc-end-xxl { justify-content: flex-end !important; }
  .jc-center-xxl { justify-content: center !important; }
  .jc-between-xxl { justify-content: space-between !important; }
  .jc-around-xxl { justify-content: space-around !important; }
  .jc-evenly-xxl { justify-content: space-evenly !important; }
  /*  felx Align-Items */
  .ai-start-xxl { align-items: flex-start !important; }
  .ai-end-xxl { align-items: flex-end !important; }
  .ai-center-xxl { align-items: center !important; }
  .ai-stretch-xxl { align-items: stretch !important; }
  .ai-baseline-xxl { align-items: baseline !important; }
  /*  felx Align-self */
  .as-start-xxl { align-self: flex-start !important; }
  .as-end-xxl { align-self: flex-end !important; }
  .as-center-xxl { align-self: center !important; }
  .as-stretch-xxl { align-self: stretch !important; }
  .as-baseline-xxl { align-self: baseline !important; }
  /*  felx Align-content */
  .ac-start-xxl { align-content: flex-start !important; }
  .ac-end-xxl { align-content: flex-end !important; }
  .ac-center-xxl { align-content: center !important; }
  .ac-stretch-xxl { align-content: stretch !important; }
  .ac-baseline-xxl { align-content: baseline !important; }
  /*  flex ROW + justify */
  .flex-row-start-xxl { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; }
  .flex-row-end-xxl { display: flex !important; flex-direction: row !important; justify-content: flex-end !important; }
  .flex-row-center-xxl { display: flex !important; flex-direction: row !important; justify-content: center !important; }
  .flex-row-between-xxl { display: flex !important; flex-direction: row !important; justify-content: space-between !important; }
  .flex-row-around-xxl { display: flex !important; flex-direction: row !important; justify-content: space-around !important; }
  .flex-row-evenly-xxl { display: flex !important; flex-direction: row !important; justify-content: space-evenly !important; }
  /*  flex ROW-Reverse + justify */
  .flex-row-reverse-start-xxl { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-start !important; }
  .flex-row-reverse-end-xxl { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; }
  .flex-row-reverse-center-xxl { display: flex !important; flex-direction: row-reverse !important; justify-content: center !important; }
  .flex-row-reverse-between-xxl { display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important; }
  .flex-row-reverse-around-xxl { display: flex !important; flex-direction: row-reverse !important; justify-content: space-around !important; }
  .flex-row-reverse-evenly-xxl { display: flex !important; flex-direction: row-reverse !important; justify-content: space-evenly !important; }
  /*  flex COLUMN + justify */
  .flex-column-start-xxl { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; }
  .flex-column-end-xxl { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; }
  .flex-column-center-xxl { display: flex !important; flex-direction: column !important; justify-content: center !important; }
  .flex-column-between-xxl { display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
  .flex-column-around-xxl { display: flex !important; flex-direction: column !important; justify-content: space-around !important; }
  .flex-column-evenly-xxl { display: flex !important; flex-direction: column !important; justify-content: space-evenly !important; }
  /*  flex COLUMN-Reverse + justify */
  .flex-column-reverse-start-xxl { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-start !important; }
  .flex-column-reverse-end-xxl { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
  .flex-column-reverse-center-xxl { display: flex !important; flex-direction: column-reverse !important; justify-content: center !important; }
  .flex-column-reverse-between-xxl { display: flex !important; flex-direction: column-reverse !important; justify-content: space-between !important; }
  .flex-column-reverse-around-xxl { display: flex !important; flex-direction: column-reverse !important; justify-content: space-around !important; }
  .flex-column-reverse-evenly-xxl { display: flex !important; flex-direction: column-reverse !important; justify-content: space-evenly !important; }
}
/* //ANCHOR -----GRID--  ______*/
.grid-resp { display: grid; grid-template-columns: repeat(
auto-fit,
minmax(var(--min-col-width), var(--max-col-width))
); }
.grid { display: grid !important; height: 100%; }
.grid__item--nostretch { justify-self: start; align-self: start; }
/* erzeugt gleich große Zeilen */
.grid--row-subgrid-1 { display: grid; grid-template-rows: subgrid; grid-row: span 1; }
.grid--row-subgrid-2 { display: grid; grid-template-rows: subgrid; grid-row: span 2; }
.grid--row-subgrid-3 { display: grid; grid-template-rows: subgrid; grid-row: span 3; }
.grid--row-subgrid-4 { display: grid; grid-template-rows: subgrid; grid-row: span 4; }
.grid--row-subgrid-5 { display: grid; grid-template-rows: subgrid; grid-row: span 5; }
/* erzeugt gleich große Spalten */
.grid--column-subgrid-1 { display: grid; grid-template-columns: subgrid; grid-column: span 1; }
.grid--column-subgrid-2 { display: grid; grid-template-columns: subgrid; grid-column: span 2; }
.grid--column-subgrid-3 { display: grid; grid-template-columns: subgrid; grid-column: span 3; }
.grid--column-subgrid-4 { display: grid; grid-template-columns: subgrid; grid-column: span 4; }
.grid--column-subgrid-5 { display: grid; grid-template-columns: subgrid; grid-column: span 5; }
/* -------------------- */
.grid--1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid--7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid--8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid--9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid--10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid--11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid--12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.grid--13 { grid-template-columns: repeat(13, minmax(0, 1fr)); }
.grid--14 { grid-template-columns: repeat(14, minmax(0, 1fr)); }
.grid--15 { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.grid--16 { grid-template-columns: repeat(16, minmax(0, 1fr)); }
.grid--17 { grid-template-columns: repeat(17, minmax(0, 1fr)); }
.grid--18 { grid-template-columns: repeat(18, minmax(0, 1fr)); }
.grid--19 { grid-template-columns: repeat(19, minmax(0, 1fr)); }
.grid--20 { grid-template-columns: repeat(20, minmax(0, 1fr)); }
.col--1  { grid-column: span 1; }
.col--2  { grid-column: span 2; }
.col--3  { grid-column: span 3; }
.col--4  { grid-column: span 4; }
.col--5  { grid-column: span 5; }
.col--6  { grid-column: span 6; }
.col--7  { grid-column: span 7; }
.col--8  { grid-column: span 8; }
.col--9  { grid-column: span 9; }
.col--10 { grid-column: span 10; }
.col--11 { grid-column: span 11; }
.col--12 { grid-column: span 12; }
.col--13 { grid-column: span 13; }
.col--14 { grid-column: span 14; }
.col--15 { grid-column: span 15; }
.col--16 { grid-column: span 16; }
.col--17 { grid-column: span 17; }
.col--18 { grid-column: span 18; }
.col--19 { grid-column: span 19; }
.col--20 { grid-column: span 20; }
@media (min-width: 480px) {
.grid-sm { display: grid !important; height: 100%; }
  .grid--1-sm { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid--2-sm { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3-sm { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4-sm { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--5-sm { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid--6-sm { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid--7-sm { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid--8-sm { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid--9-sm { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid--10-sm { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid--11-sm { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid--12-sm { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.grid--13-sm { grid-template-columns: repeat(13, minmax(0, 1fr)); }
.grid--14-sm { grid-template-columns: repeat(14, minmax(0, 1fr)); }
.grid--15-sm { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.grid--16-sm { grid-template-columns: repeat(16, minmax(0, 1fr)); }
.grid--17-sm { grid-template-columns: repeat(17, minmax(0, 1fr)); }
.grid--18-sm { grid-template-columns: repeat(18, minmax(0, 1fr)); }
.grid--19-sm { grid-template-columns: repeat(19, minmax(0, 1fr)); }
.grid--20-sm { grid-template-columns: repeat(20, minmax(0, 1fr)); }
.col--1-sm  { grid-column: span 1; }
.col--2-sm  { grid-column: span 2; }
.col--3-sm  { grid-column: span 3; }
.col--4-sm  { grid-column: span 4; }
.col--5-sm  { grid-column: span 5; }
.col--6-sm  { grid-column: span 6; }
.col--7-sm  { grid-column: span 7; }
.col--8-sm  { grid-column: span 8; }
.col--9-sm  { grid-column: span 9; }
.col--10-sm { grid-column: span 10; }
.col--11-sm { grid-column: span 11; }
.col--12-sm { grid-column: span 12; }
.col--13-sm { grid-column: span 13; }
.col--14-sm { grid-column: span 14; }
.col--15-sm { grid-column: span 15; }
.col--16-sm { grid-column: span 16; }
.col--17-sm { grid-column: span 17; }
.col--18-sm { grid-column: span 18; }
.col--19-sm { grid-column: span 19; }
.col--20-sm { grid-column: span 20; }
}
@media (min-width: 768px) { 
.grid-md { display: grid !important; height: 100%; }
.grid--1-md { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid--2-md { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3-md { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4-md { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--5-md { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid--6-md { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid--7-md { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid--8-md { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid--9-md { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid--10-md { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid--11-md { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid--12-md { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.grid--13-md { grid-template-columns: repeat(13, minmax(0, 1fr)); }
.grid--14-md { grid-template-columns: repeat(14, minmax(0, 1fr)); }
.grid--15-md { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.grid--16-md { grid-template-columns: repeat(16, minmax(0, 1fr)); }
.grid--17-md { grid-template-columns: repeat(17, minmax(0, 1fr)); }
.grid--18-md { grid-template-columns: repeat(18, minmax(0, 1fr)); }
.grid--19-md { grid-template-columns: repeat(19, minmax(0, 1fr)); }
.grid--20-md { grid-template-columns: repeat(20, minmax(0, 1fr)); }
.col--1-md  { grid-column: span 1; }
.col--2-md  { grid-column: span 2; }
.col--3-md  { grid-column: span 3; }
.col--4-md  { grid-column: span 4; }
.col--5-md  { grid-column: span 5; }
.col--6-md  { grid-column: span 6; }
.col--7-md  { grid-column: span 7; }
.col--8-md  { grid-column: span 8; }
.col--9-md  { grid-column: span 9; }
.col--10-md { grid-column: span 10; }
.col--11-md { grid-column: span 11; }
.col--12-md { grid-column: span 12; }
.col--13-md { grid-column: span 13; }
.col--14-md { grid-column: span 14; }
.col--15-md { grid-column: span 15; }
.col--16-md { grid-column: span 16; }
.col--17-md { grid-column: span 17; }
.col--18-md { grid-column: span 18; }
.col--19-md { grid-column: span 19; }
.col--20-md { grid-column: span 20; }
}
@media (min-width: 1024px) {
.grid-lg { display: grid !important; height: 100%; }
.grid--1-lg { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid--2-lg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3-lg { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4-lg { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--5-lg { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid--6-lg { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid--7-lg { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid--8-lg { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid--9-lg { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid--10-lg { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid--11-lg { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid--12-lg { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.grid--13-lg { grid-template-columns: repeat(13, minmax(0, 1fr)); }
.grid--14-lg { grid-template-columns: repeat(14, minmax(0, 1fr)); }
.grid--15-lg { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.grid--16-lg { grid-template-columns: repeat(16, minmax(0, 1fr)); }
.grid--17-lg { grid-template-columns: repeat(17, minmax(0, 1fr)); }
.grid--18-lg { grid-template-columns: repeat(18, minmax(0, 1fr)); }
.grid--19-lg { grid-template-columns: repeat(19, minmax(0, 1fr)); }
.grid--20-lg { grid-template-columns: repeat(20, minmax(0, 1fr)); }
.col--1-lg  { grid-column: span 1; }
.col--2-lg  { grid-column: span 2; }
.col--3-lg  { grid-column: span 3; }
.col--4-lg  { grid-column: span 4; }
.col--5-lg  { grid-column: span 5; }
.col--6-lg  { grid-column: span 6; }
.col--7-lg  { grid-column: span 7; }
.col--8-lg  { grid-column: span 8; }
.col--9-lg  { grid-column: span 9; }
.col--10-lg { grid-column: span 10; }
.col--11-lg { grid-column: span 11; }
.col--12-lg { grid-column: span 12; }
.col--13-lg { grid-column: span 13; }
.col--14-lg { grid-column: span 14; }
.col--15-lg { grid-column: span 15; }
.col--16-lg { grid-column: span 16; }
.col--17-lg { grid-column: span 17; }
.col--18-lg { grid-column: span 18; }
.col--19-lg { grid-column: span 19; }
.col--20-lg { grid-column: span 20; }
}
@media (min-width: 1280px) {
.grid-xl { display: grid !important; height: 100%; }
.grid--1-xl { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid--2-xl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3-xl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4-xl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--5-xl { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid--6-xl { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid--7-xl { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid--8-xl { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid--9-xl { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid--10-xl { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid--11-xl { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid--12-xl { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.grid--13-xl { grid-template-columns: repeat(13, minmax(0, 1fr)); }
.grid--14-xl { grid-template-columns: repeat(14, minmax(0, 1fr)); }
.grid--15-xl { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.grid--16-xl { grid-template-columns: repeat(16, minmax(0, 1fr)); }
.grid--17-xl { grid-template-columns: repeat(17, minmax(0, 1fr)); }
.grid--18-xl { grid-template-columns: repeat(18, minmax(0, 1fr)); }
.grid--19-xl { grid-template-columns: repeat(19, minmax(0, 1fr)); }
.grid--20-xl { grid-template-columns: repeat(20, minmax(0, 1fr)); }
.col--1-xl  { grid-column: span 1; }
.col--2-xl  { grid-column: span 2; }
.col--3-xl  { grid-column: span 3; }
.col--4-xl  { grid-column: span 4; }
.col--5-xl  { grid-column: span 5; }
.col--6-xl  { grid-column: span 6; }
.col--7-xl  { grid-column: span 7; }
.col--8-xl  { grid-column: span 8; }
.col--9-xl  { grid-column: span 9; }
.col--10-xl { grid-column: span 10; }
.col--11-xl { grid-column: span 11; }
.col--12-xl { grid-column: span 12; }
.col--13-xl { grid-column: span 13; }
.col--14-xl { grid-column: span 14; }
.col--15-xl { grid-column: span 15; }
.col--16-xl { grid-column: span 16; }
.col--17-xl { grid-column: span 17; }
.col--18-xl { grid-column: span 18; }
.col--19-xl { grid-column: span 19; }
.col--20-xl { grid-column: span 20; }
}
@media (min-width: 1440px) { 
.grid-xxl { display: grid !important; height: 100%; }
.grid--1-xxl { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid--2-xxl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3-xxl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4-xxl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--5-xxl { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid--6-xxl { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid--7-xxl { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid--8-xxl { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid--9-xxl { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid--10-xxl { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid--11-xxl { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid--12-xxl { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.grid--13-xxl { grid-template-columns: repeat(13, minmax(0, 1fr)); }
.grid--14-xxl { grid-template-columns: repeat(14, minmax(0, 1fr)); }
.grid--15-xxl { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.grid--16-xxl { grid-template-columns: repeat(16, minmax(0, 1fr)); }
.grid--17-xxl { grid-template-columns: repeat(17, minmax(0, 1fr)); }
.grid--18-xxl { grid-template-columns: repeat(18, minmax(0, 1fr)); }
.grid--19-xxl { grid-template-columns: repeat(19, minmax(0, 1fr)); }
.grid--20-xxl { grid-template-columns: repeat(20, minmax(0, 1fr)); }
.col--1-xxl  { grid-column: span 1; }
.col--2-xxl  { grid-column: span 2; }
.col--3-xxl  { grid-column: span 3; }
.col--4-xxl  { grid-column: span 4; }
.col--5-xxl  { grid-column: span 5; }
.col--6-xxl  { grid-column: span 6; }
.col--7-xxl  { grid-column: span 7; }
.col--8-xxl  { grid-column: span 8; }
.col--9-xxl  { grid-column: span 9; }
.col--10-xxl { grid-column: span 10; }
.col--11-xxl { grid-column: span 11; }
.col--12-xxl { grid-column: span 12; }
.col--13-xxl { grid-column: span 13; }
.col--14-xxl { grid-column: span 14; }
.col--15-xxl { grid-column: span 15; }
.col--16-xxl { grid-column: span 16; }
.col--17-xxl { grid-column: span 17; }
.col--18-xxl { grid-column: span 18; }
.col--19-xxl { grid-column: span 19; }
.col--20-xxl { grid-column: span 20; }
}
/* //ANCHOR -----LAYOUTS______ */
.layout { display: grid; gap: var(--layout-gap); }
.layout > * { min-width: 0; }
/* //ANCHOR 480px */
@media (min-width: 480px) { /* ---theatre-sm--- */
.layout--theatre-sm { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--theatre-sm > header { grid-column: 1/13; grid-row: 1/2; }
.layout--theatre-sm > nav { grid-column: 1/3; grid-row: 2/4; }
.layout--theatre-sm > main { grid-column: 3/11; grid-row: 2/3; }
.layout--theatre-sm > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--theatre-sm > footer { grid-column: 3/11; grid-row: 3/4; }
/* ---shelve-sm--- */
.layout--shelve-sm { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--shelve-sm > header { grid-column: 1/9; grid-row: 1/2; }
.layout--shelve-sm > nav { grid-column: 9/13; grid-row: 1/2; height: auto; }
.layout--shelve-sm > main { grid-column: 1/9; grid-row: 2/3; }
.layout--shelve-sm > aside { grid-column: 9/13; grid-row: 2/3; }
.layout--shelve-sm > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---brick-sm--- */
.layout--brick-sm { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--brick-sm > header { grid-column: 1/10; grid-row: 1/2; }
.layout--brick-sm > nav { grid-column: 10/13; grid-row: 1/2; height: auto; }
.layout--brick-sm > main { grid-column: 3/13; grid-row: 2/3; }
.layout--brick-sm > aside { grid-column: 1/3; grid-row: 2/3; }
.layout--brick-sm > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---spin--sm-- */
.layout--spin-sm { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--spin-sm > header { grid-column: 3/13; grid-row: 1/2; }
.layout--spin-sm > nav { grid-column: 1/3; grid-row: 1/3; height: 100svh; }
.layout--spin-sm > main { grid-column: 3/11; grid-row: 2/3; }
.layout--spin-sm > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--spin-sm > footer { grid-column: 1/11; grid-row: 3/4; }
/* ---custom-sm--- */
.layout--custom-sm { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--custom-sm > :nth-child(1) { grid-column: var(--layout-item-1-column); grid-row: var(--layout-item-1-row); }
.layout--custom-sm > :nth-child(2) { grid-column: var(--layout-item-2-column); grid-row: var(--layout-item-2-row); }
.layout--custom-sm > :nth-child(3) { grid-column: var(--layout-item-3-column); grid-row: var(--layout-item-3-row); }
.layout--custom-sm > :nth-child(4) { grid-column: var(--layout-item-4-column); grid-row: var(--layout-item-4-row); }
.layout--custom-sm > :nth-child(5) { grid-column: var(--layout-item-5-column); grid-row: var(--layout-item-5-row); }
.layout--custom-sm > :nth-child(6) { grid-column: var(--layout-item-6-column); grid-row: var(--layout-item-6-row); }
.layout--custom-sm > :nth-child(7) { grid-column: var(--layout-item-7-column); grid-row: var(--layout-item-7-row); }
.layout--custom-sm > :nth-child(8) { grid-column: var(--layout-item-8-column); grid-row: var(--layout-item-8-row); }
.layout--custom-sm > :nth-child(9) { grid-column: var(--layout-item-9-column); grid-row: var(--layout-item-9-row); }
.layout--custom-sm > :nth-child(10) { grid-column: var(--layout-item-10-column); grid-row: var(--layout-item-10-row); }
}
/* //ANCHOR 768px */
@media (min-width: 768px) { /* ---theatre-md--- */
.layout--theatre-md { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--theatre-md > header { grid-column: 1/13; grid-row: 1/2; }
.layout--theatre-md > nav { grid-column: 1/3; grid-row: 2/4; }
.layout--theatre-md > main { grid-column: 3/11; grid-row: 2/3; }
.layout--theatre-md > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--theatre-md > footer { grid-column: 3/11; grid-row: 3/4; }
/* ---shelve-md--- */
.layout--shelve-md { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--shelve-md > header { grid-column: 1/9; grid-row: 1/2; }
.layout--shelve-md > nav { grid-column: 9/13; grid-row: 1/2; height: auto; }
.layout--shelve-md > main { grid-column: 1/9; grid-row: 2/3; }
.layout--shelve-md > aside { grid-column: 9/13; grid-row: 2/3; }
.layout--shelve-md > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---brick-md--- */
.layout--brick-md { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--brick-md > header { grid-column: 1/10; grid-row: 1/2; }
.layout--brick-md > nav { grid-column: 10/13; grid-row: 1/2; height: auto; }
.layout--brick-md > main { grid-column: 3/13; grid-row: 2/3; }
.layout--brick-md > aside { grid-column: 1/3; grid-row: 2/3; }
.layout--brick-md > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---spin-md--- */
.layout--spin-md { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--spin-md > header { grid-column: 3/13; grid-row: 1/2; }
.layout--spin-md > nav { grid-column: 1/3; grid-row: 1/3; height: 100svh; }
.layout--spin-md > main { grid-column: 3/11; grid-row: 2/3; }
.layout--spin-md > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--spin-md > footer { grid-column: 1/11; grid-row: 3/4; }
/* ---custom-md--- */
.layout--custom-md { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--custom-md > :nth-child(1) { grid-column: var(--layout-item-1-column); grid-row: var(--layout-item-1-row); }
.layout--custom-md > :nth-child(2) { grid-column: var(--layout-item-2-column); grid-row: var(--layout-item-2-row); }
.layout--custom-md > :nth-child(3) { grid-column: var(--layout-item-3-column); grid-row: var(--layout-item-3-row); }
.layout--custom-md > :nth-child(4) { grid-column: var(--layout-item-4-column); grid-row: var(--layout-item-4-row); }
.layout--custom-md > :nth-child(5) { grid-column: var(--layout-item-5-column); grid-row: var(--layout-item-5-row); }
.layout--custom-md > :nth-child(6) { grid-column: var(--layout-item-6-column); grid-row: var(--layout-item-6-row); }
.layout--custom-md > :nth-child(7) { grid-column: var(--layout-item-7-column); grid-row: var(--layout-item-7-row); }
.layout--custom-md > :nth-child(8) { grid-column: var(--layout-item-8-column); grid-row: var(--layout-item-8-row); }
.layout--custom-md > :nth-child(9) { grid-column: var(--layout-item-9-column); grid-row: var(--layout-item-9-row); }
.layout--custom-md > :nth-child(10) { grid-column: var(--layout-item-10-column); grid-row: var(--layout-item-10-row); }
}
/* //ANCHOR 1024px */
@media (min-width: 1024px) { /* ---theatre-lg--- */
.layout--theatre-lg { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--theatre-lg > header { grid-column: 1/13; grid-row: 1/2; }
.layout--theatre-lg > nav { grid-column: 1/3; grid-row: 2/4; }
.layout--theatre-lg > main { grid-column: 3/11; grid-row: 2/3; }
.layout--theatre-lg > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--theatre-lg > footer { grid-column: 3/11; grid-row: 3/4; }
/* ---shelve-lg--- */
.layout--shelve-lg { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--shelve-lg > header { grid-column: 1/9; grid-row: 1/2; }
.layout--shelve-lg > nav { grid-column: 9/13; grid-row: 1/2; height: auto; }
.layout--shelve-lg > main { grid-column: 1/9; grid-row: 2/3; }
.layout--shelve-lg > aside { grid-column: 9/13; grid-row: 2/3; }
.layout--shelve-lg > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---brick-lg--- */
.layout--brick-lg { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--brick-lg > header { grid-column: 1/10; grid-row: 1/2; }
.layout--brick-lg > nav { grid-column: 10/13; grid-row: 1/2; height: auto; }
.layout--brick-lg > main { grid-column: 3/13; grid-row: 2/3; }
.layout--brick-lg > aside { grid-column: 1/3; grid-row: 2/3; }
.layout--brick-lg > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---spin-lg--- */
.layout--spin-lg { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--spin-lg > header { grid-column: 3/13; grid-row: 1/2; }
.layout--spin-lg > nav { grid-column: 1/3; grid-row: 1/3; height: 100svh; }
.layout--spin-lg > main { grid-column: 3/11; grid-row: 2/3; }
.layout--spin-lg > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--spin-lg > footer { grid-column: 1/11; grid-row: 3/4; }
/* ---custom-lg--- */
.layout--custom-lg { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--custom-lg > :nth-child(1) { grid-column: var(--layout-item-1-column); grid-row: var(--layout-item-1-row); }
.layout--custom-lg > :nth-child(2) { grid-column: var(--layout-item-2-column); grid-row: var(--layout-item-2-row); }
.layout--custom-lg > :nth-child(3) { grid-column: var(--layout-item-3-column); grid-row: var(--layout-item-3-row); }
.layout--custom-lg > :nth-child(4) { grid-column: var(--layout-item-4-column); grid-row: var(--layout-item-4-row); }
.layout--custom-lg > :nth-child(5) { grid-column: var(--layout-item-5-column); grid-row: var(--layout-item-5-row); }
.layout--custom-lg > :nth-child(6) { grid-column: var(--layout-item-6-column); grid-row: var(--layout-item-6-row); }
.layout--custom-lg > :nth-child(7) { grid-column: var(--layout-item-7-column); grid-row: var(--layout-item-7-row); }
.layout--custom-lg > :nth-child(8) { grid-column: var(--layout-item-8-column); grid-row: var(--layout-item-8-row); }
.layout--custom-lg > :nth-child(9) { grid-column: var(--layout-item-9-column); grid-row: var(--layout-item-9-row); }
.layout--custom-lg > :nth-child(10) { grid-column: var(--layout-item-10-column); grid-row: var(--layout-item-10-row); }
}
/* //ANCHOR 1280px */
@media (min-width: 1280px) { /* ---theatre-xl--- */
.layout--theatre-xl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--theatre-xl > header { grid-column: 1/13; grid-row: 1/2; }
.layout--theatre-xl > nav { grid-column: 1/3; grid-row: 2/4; }
.layout--theatre-xl > main { grid-column: 3/11; grid-row: 2/3; }
.layout--theatre-xl > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--theatre-xl > footer { grid-column: 3/11; grid-row: 3/4; }
/* ---shelve-xl--- */
.layout--shelve-xl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--shelve-xl > header { grid-column: 1/9; grid-row: 1/2; }
.layout--shelve-xl > nav { grid-column: 9/13; grid-row: 1/2; height: auto; }
.layout--shelve-xl > main { grid-column: 1/9; grid-row: 2/3; }
.layout--shelve-xl > aside { grid-column: 9/13; grid-row: 2/3; }
.layout--shelve-xl > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---brick-xl--- */
.layout--brick-xl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--brick-xl > header { grid-column: 1/10; grid-row: 1/2; }
.layout--brick-xl > nav { grid-column: 10/13; grid-row: 1/2; height: auto; }
.layout--brick-xl > main { grid-column: 3/13; grid-row: 2/3; }
.layout--brick-xl > aside { grid-column: 1/3; grid-row: 2/3; }
.layout--brick-xl > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---spin-xl--- */
.layout--spin-xl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--spin-xl > header { grid-column: 3/13; grid-row: 1/2; }
.layout--spin-xl > nav { grid-column: 1/3; grid-row: 1/3; height: 100svh; }
.layout--spin-xl > main { grid-column: 3/11; grid-row: 2/3; }
.layout--spin-xl > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--spin-xl > footer { grid-column: 1/11; grid-row: 3/4; }
/* ---custom-xl--- */
.layout--custom-xl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--custom-xl > :nth-child(1) { grid-column: var(--layout-item-1-column); grid-row: var(--layout-item-1-row); }
.layout--custom-xl > :nth-child(2) { grid-column: var(--layout-item-2-column); grid-row: var(--layout-item-2-row); }
.layout--custom-xl > :nth-child(3) { grid-column: var(--layout-item-3-column); grid-row: var(--layout-item-3-row); }
.layout--custom-xl > :nth-child(4) { grid-column: var(--layout-item-4-column); grid-row: var(--layout-item-4-row); }
.layout--custom-xl > :nth-child(5) { grid-column: var(--layout-item-5-column); grid-row: var(--layout-item-5-row); }
.layout--custom-xl > :nth-child(6) { grid-column: var(--layout-item-6-column); grid-row: var(--layout-item-6-row); }
.layout--custom-xl > :nth-child(7) { grid-column: var(--layout-item-7-column); grid-row: var(--layout-item-7-row); }
.layout--custom-xl > :nth-child(8) { grid-column: var(--layout-item-8-column); grid-row: var(--layout-item-8-row); }
.layout--custom-xl > :nth-child(9) { grid-column: var(--layout-item-9-column); grid-row: var(--layout-item-9-row); }
.layout--custom-xl > :nth-child(10) { grid-column: var(--layout-item-10-column); grid-row: var(--layout-item-10-row); }
}
/* //ANCHOR 1440px */
@media (min-width: 1440px) { /* ---theatre-xxl--- */
.layout--theatre-xxl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--theatre-xxl > header { grid-column: 1/13; grid-row: 1/2; }
.layout--theatre-xxl > nav { grid-column: 1/3; grid-row: 2/4; }
.layout--theatre-xxl > main { grid-column: 3/11; grid-row: 2/3; }
.layout--theatre-xxl > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--theatre-xxl > footer { grid-column: 3/11; grid-row: 3/4; }
/* ---shelve-xxl--- */
.layout--shelve-xxl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--shelve-xxl > header { grid-column: 1/9; grid-row: 1/2; }
.layout--shelve-xxl > nav { grid-column: 9/13; grid-row: 1/2; height: auto; }
.layout--shelve-xxl > main { grid-column: 1/9; grid-row: 2/3; }
.layout--shelve-xxl > aside { grid-column: 9/13; grid-row: 2/3; }
.layout--shelve-xxl > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---brick-xxl--- */
.layout--brick-xxl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--brick-xxl > header { grid-column: 1/10; grid-row: 1/2; }
.layout--brick-xxl > nav { grid-column: 10/13; grid-row: 1/2; height: auto; }
.layout--brick-xxl > main { grid-column: 3/13; grid-row: 2/3; }
.layout--brick-xxl > aside { grid-column: 1/3; grid-row: 2/3; }
.layout--brick-xxl > footer { grid-column: 1/13; grid-row: 3/4; }
/* ---spin-xxl--- */
.layout--spin-xxl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--spin-xxl > header { grid-column: 3/13; grid-row: 1/2; }
.layout--spin-xxl > nav { grid-column: 1/3; grid-row: 1/3; height: 100svh; }
.layout--spin-xxl > main { grid-column: 3/11; grid-row: 2/3; }
.layout--spin-xxl > aside { grid-column: 11/13; grid-row: 2/4; }
.layout--spin-xxl > footer { grid-column: 1/11; grid-row: 3/4; }
/* ---custom-xxl--- */
.layout--custom-xxl { grid-template-columns: var(--layout-column-width); grid-template-rows: var(--layout-row-height); }
.layout--custom-xxl > :nth-child(1) { grid-column: var(--layout-item-1-column); grid-row: var(--layout-item-1-row); }
.layout--custom-xxl > :nth-child(2) { grid-column: var(--layout-item-2-column); grid-row: var(--layout-item-2-row); }
.layout--custom-xxl > :nth-child(3) { grid-column: var(--layout-item-3-column); grid-row: var(--layout-item-3-row); }
.layout--custom-xxl > :nth-child(4) { grid-column: var(--layout-item-4-column); grid-row: var(--layout-item-4-row); }
.layout--custom-xxl > :nth-child(5) { grid-column: var(--layout-item-5-column); grid-row: var(--layout-item-5-row); }
.layout--custom-xxl > :nth-child(6) { grid-column: var(--layout-item-6-column); grid-row: var(--layout-item-6-row); }
.layout--custom-xxl > :nth-child(7) { grid-column: var(--layout-item-7-column); grid-row: var(--layout-item-7-row); }
.layout--custom-xxl > :nth-child(8) { grid-column: var(--layout-item-8-column); grid-row: var(--layout-item-8-row); }
.layout--custom-xxl > :nth-child(9) { grid-column: var(--layout-item-9-column); grid-row: var(--layout-item-9-row); }
.layout--custom-xxl > :nth-child(10) { grid-column: var(--layout-item-10-column); grid-row: var(--layout-item-10-row); }
}