/*!
 * Bootstrap Grid v5.3.3 (https://getbootstrap.com/)
 * Copyright 2011-2024 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */



/* Define @container contexts for layout areas */
body,
header,
main,
aside,
footer,
[class*="col-"]:has([class*="row"]) /* Smart targeting: only nested grids become containers */
{
  container-type: inline-size;
}
/* debug 
div {
  outline: 1px solid red;
}
*/

/* Frame Settings */
/*  frame space padding (section) */

section[class^="section-"] .section-container
{
  padding-top: calc(var(--bs-gutter-y) * 3);
  padding-bottom: calc(var(--bs-gutter-y) * 2);
}

section.frame-inner-space-before-100 .section-container {padding-top: 0 !important;}
section.frame-inner-space-before-1 .section-container {padding-top: calc(var(--bs-gutter-y) * 1)  !important;}
section.frame-inner-space-before-2 .section-container {padding-top: calc(var(--bs-gutter-y) * 2)  !important;}
section.frame-inner-space-before-3 .section-container {padding-top: calc(var(--bs-gutter-y) * 3)  !important;}
section.frame-inner-space-before-4 .section-container {padding-top: calc(var(--bs-gutter-y) * 4)  !important;}
section.frame-inner-space-before-5 .section-container {padding-top: calc(var(--bs-gutter-y) * 5)  !important;}
section.frame-inner-space-before-6 .section-container {padding-top: calc(var(--bs-gutter-y) * 6)  !important;}

section.frame-inner-space-after-100 .section-container {padding-bottom: 0 !important;}
section.frame-inner-space-after-1 .section-container {padding-bottom: calc(var(--bs-gutter-y) * 1)  !important;}
section.frame-inner-space-after-2 .section-container {padding-bottom: calc(var(--bs-gutter-y) * 2)  !important;}
section.frame-inner-space-after-3 .section-container {padding-bottom: calc(var(--bs-gutter-y) * 3)  !important;}
section.frame-inner-space-after-4 .section-container {padding-bottom: calc(var(--bs-gutter-y) * 4)  !important;}
section.frame-inner-space-after-5 .section-container {padding-bottom: calc(var(--bs-gutter-y) * 5)  !important;}
section.frame-inner-space-after-6 .section-container {padding-bottom: calc(var(--bs-gutter-y) * 6)  !important;}


/*  frame space margin */

.frame-content,
.frame-container{
  margin-bottom: var(--bs-gutter-y);
}

.topbar .frame-content,
.topbar .frame-content > * {
  margin: 0;
}

.frame-space-before-100 {margin-top: 0 !important;}
.frame-space-before-1 {margin-top: var(--bs-margin-1) !important;}
.frame-space-before-2 {margin-top: var(--bs-margin-2) !important;}
.frame-space-before-3 {margin-top: var(--bs-margin-3) !important;}
.frame-space-before-4 {margin-top: var(--bs-margin-4) !important;}
.frame-space-before-5 {margin-top: var(--bs-margin-5) !important;}
.frame-space-before-6 {margin-top: var(--bs-margin-6) !important;}
.frame-space-before-7 {margin-top: var(--bs-margin-7) !important;}
.frame-space-before-8 {margin-top: var(--bs-margin-8) !important;}
.frame-space-before-9 {margin-top: var(--bs-margin-9) !important;}
.frame-space-before-10 {margin-top: var(--bs-margin-10) !important;}
.frame-space-before-11 {margin-top: var(--bs-margin-11) !important;}
.frame-space-before-12 {margin-top: var(--bs-margin-12) !important;}
.frame-space-before-13 {margin-top: var(--bs-margin-13) !important;}

.frame-space-after-100 {margin-bottom: 0 !important;}
.frame-space-after-1 {margin-bottom: var(--bs-margin-1) !important;}
.frame-space-after-2 {margin-bottom: var(--bs-margin-2) !important;}
.frame-space-after-3 {margin-bottom: var(--bs-margin-3) !important;}
.frame-space-after-4 {margin-bottom: var(--bs-margin-4) !important;}
.frame-space-after-5 {margin-bottom: var(--bs-margin-5) !important;}
.frame-space-after-6 {margin-bottom: var(--bs-margin-6) !important;}
.frame-space-after-7 {margin-bottom: var(--bs-margin-7) !important;}
.frame-space-after-8 {margin-bottom: var(--bs-margin-8) !important;}
.frame-space-after-9 {margin-bottom: var(--bs-margin-9) !important;}
.frame-space-after-10 {margin-bottom: var(--bs-margin-10) !important;}
.frame-space-after-11 {margin-bottom: var(--bs-margin-11) !important;}
.frame-space-after-12 {margin-bottom: var(--bs-margin-12) !important;}
.frame-space-after-13 {margin-bottom: var(--bs-margin-13) !important;}

/* ruler */
.frame-ruler-before {border-top: var(--bs-border-width) solid hsl(from var(--bs-text-500) h s l / 0.25); padding-top: var(--bs-gutter-y);}
.frame-ruler-after {border-bottom: var(--bs-border-width) solid hsl(from var(--bs-text-500) h s l / 0.25); padding-bottom: var(--bs-gutter-y);}

/* indent */
.frame-indent {margin-left: 0; margin-right: 0;}
.frame-indent-left {margin-left: 0%;}
.frame-indent-right {margin-right: 0%;}

@media (min-width: 768px) {
.frame-indent {margin-left: 8.333333%; margin-right: 8.333333%;}
.frame-indent-left {margin-left: 0;}
.frame-indent-right {margin-right: 0;}
}

@media (min-width: 1024px) {
.frame-indent {margin-left: 8.333333%; margin-right: 8.333333%;}
.frame-indent-left {margin-left: 16.6666665%;}
.frame-indent-right {margin-right: 16.6666665%;}
.frame-grid .frame-indent{margin-left: 8.33333333%; margin-right: 8.33333333%;}
.frame-grid .frame-indent-left{margin-left: 8.33333333%;}
.frame-grid .frame-indent-right{margin-right: 8.33333333%;}
}

@media (min-width: 1280px) {
.frame-indent {margin-left: 16.6666665%; margin-right: 16.6666665%;}
.frame-indent-left {margin-left: 33.333333%;}
.frame-indent-right {margin-right: 33.333333%;}
.frame-grid .frame-indent{margin-left: 8.33333333%; margin-right: 8.33333333%;}
.frame-grid .frame-indent-left{margin-left: 16.6666665%;}
.frame-grid .frame-indent-right{margin-right: 16.6666665%;}
}

/* ===== BASIS-SETUP ===== */

.pattern {
  container-type: inline-size;
  display: flex;
  flex-wrap: wrap;
}

.pattern > * {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
}

/* ===== XS (320px+) ===== */
@container pattern (max-width: 439px) {
  /* 12 - Full Width */
  .pattern-xs-12 > * {
    width: 100%;
  }

  /* 66 - Equal (6-6) */
  .pattern-xs-66 > * {
    width: 50%;
  }

  /* 57 - Alternierend (5-7 ⇄ 7-5) */
  .pattern-xs-57 > *:nth-child(4n+1),
  .pattern-xs-57 > *:nth-child(4n) {
    width: 41.66666667%;
  }
  .pattern-xs-57 > *:nth-child(4n+2),
  .pattern-xs-57 > *:nth-child(4n+3) {
    width: 58.33333333%;
  }

  /* 75 - Alternierend (7-5 ⇄ 5-7) */
  .pattern-xs-75 > *:nth-child(4n+1),
  .pattern-xs-75 > *:nth-child(4n) {
    width: 58.33333333%;
  }
  .pattern-xs-75 > *:nth-child(4n+2),
  .pattern-xs-75 > *:nth-child(4n+3) {
    width: 41.66666667%;
  }

  /* 48 - Alternierend (4-8 ⇄ 8-4) */
  .pattern-xs-48 > *:nth-child(4n+1),
  .pattern-xs-48 > *:nth-child(4n) {
    width: 33.33333333%;
  }
  .pattern-xs-48 > *:nth-child(4n+2),
  .pattern-xs-48 > *:nth-child(4n+3) {
    width: 66.66666667%;
  }

  /* 84 - Alternierend (8-4 ⇄ 4-8) */
  .pattern-xs-84 > *:nth-child(4n+1),
  .pattern-xs-84 > *:nth-child(4n) {
    width: 66.66666667%;
  }
  .pattern-xs-84 > *:nth-child(4n+2),
  .pattern-xs-84 > *:nth-child(4n+3) {
    width: 33.33333333%;
  }

  /* 336 - Alternierend (3-3-6 ⇄ 6-3-3) */
  .pattern-xs-336 > *:nth-child(6n+1),
  .pattern-xs-336 > *:nth-child(6n+2),
  .pattern-xs-336 > *:nth-child(6n+5),
  .pattern-xs-336 > *:nth-child(6n) {
    width: 25%;
  }
  .pattern-xs-336 > *:nth-child(6n+3),
  .pattern-xs-336 > *:nth-child(6n+4) {
    width: 50%;
  }

  /* 633 - Alternierend (6-3-3 ⇄ 3-3-6) */
  .pattern-xs-633 > *:nth-child(6n+1),
  .pattern-xs-633 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-xs-633 > *:nth-child(6n+2),
  .pattern-xs-633 > *:nth-child(6n+3),
  .pattern-xs-633 > *:nth-child(6n+5),
  .pattern-xs-633 > *:nth-child(6n) {
    width: 25%;
  }

  /* 246 - Alternierend (2-4-6 ⇄ 6-4-2) */
  .pattern-xs-246 > *:nth-child(6n+1),
  .pattern-xs-246 > *:nth-child(6n) {
    width: 16.66666667%;
  }
  .pattern-xs-246 > *:nth-child(6n+2),
  .pattern-xs-246 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-xs-246 > *:nth-child(6n+3),
  .pattern-xs-246 > *:nth-child(6n+4) {
    width: 50%;
  }

  /* 642 - Alternierend (6-4-2 ⇄ 2-4-6) */
  .pattern-xs-642 > *:nth-child(6n+1),
  .pattern-xs-642 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-xs-642 > *:nth-child(6n+2),
  .pattern-xs-642 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-xs-642 > *:nth-child(6n+3),
  .pattern-xs-642 > *:nth-child(6n) {
    width: 16.66666667%;
  }
}
/* ===== SM (440px+) ===== */

@container pattern (min-width: 440px) {
  .pattern-sm-12 > * {
    width: 100%;
  }
  
  .pattern-sm-66 > * {
    width: 50%;
  }
  
  .pattern-sm-57 > *:nth-child(4n+1),
  .pattern-sm-57 > *:nth-child(4n) {
    width: 41.66666667%;
  }
  .pattern-sm-57 > *:nth-child(4n+2),
  .pattern-sm-57 > *:nth-child(4n+3) {
    width: 58.33333333%;
  }
  
  .pattern-sm-75 > *:nth-child(4n+1),
  .pattern-sm-75 > *:nth-child(4n) {
    width: 58.33333333%;
  }
  .pattern-sm-75 > *:nth-child(4n+2),
  .pattern-sm-75 > *:nth-child(4n+3) {
    width: 41.66666667%;
  }
  
  .pattern-sm-48 > *:nth-child(4n+1),
  .pattern-sm-48 > *:nth-child(4n) {
    width: 33.33333333%;
  }
  .pattern-sm-48 > *:nth-child(4n+2),
  .pattern-sm-48 > *:nth-child(4n+3) {
    width: 66.66666667%;
  }
  
  .pattern-sm-84 > *:nth-child(4n+1),
  .pattern-sm-84 > *:nth-child(4n) {
    width: 66.66666667%;
  }
  .pattern-sm-84 > *:nth-child(4n+2),
  .pattern-sm-84 > *:nth-child(4n+3) {
    width: 33.33333333%;
  }
  
  .pattern-sm-336 > *:nth-child(6n+1),
  .pattern-sm-336 > *:nth-child(6n+2),
  .pattern-sm-336 > *:nth-child(6n+5),
  .pattern-sm-336 > *:nth-child(6n) {
    width: 25%;
  }
  .pattern-sm-336 > *:nth-child(6n+3),
  .pattern-sm-336 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-sm-633 > *:nth-child(6n+1),
  .pattern-sm-633 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-sm-633 > *:nth-child(6n+2),
  .pattern-sm-633 > *:nth-child(6n+3),
  .pattern-sm-633 > *:nth-child(6n+5),
  .pattern-sm-633 > *:nth-child(6n) {
    width: 25%;
  }
  
  .pattern-sm-246 > *:nth-child(6n+1),
  .pattern-sm-246 > *:nth-child(6n) {
    width: 16.66666667%;
  }
  .pattern-sm-246 > *:nth-child(6n+2),
  .pattern-sm-246 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-sm-246 > *:nth-child(6n+3),
  .pattern-sm-246 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-sm-642 > *:nth-child(6n+1),
  .pattern-sm-642 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-sm-642 > *:nth-child(6n+2),
  .pattern-sm-642 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-sm-642 > *:nth-child(6n+3),
  .pattern-sm-642 > *:nth-child(6n) {
    width: 16.66666667%;
  }
}

/* ===== MD (768px+) ===== */

@container pattern (min-width: 768px) {
  .pattern-md-12 > * {
    width: 100%;
  }
  
  .pattern-md-66 > * {
    width: 50%;
  }
  
  .pattern-md-57 > *:nth-child(4n+1),
  .pattern-md-57 > *:nth-child(4n) {
    width: 41.66666667%;
  }
  .pattern-md-57 > *:nth-child(4n+2),
  .pattern-md-57 > *:nth-child(4n+3) {
    width: 58.33333333%;
  }
  
  .pattern-md-75 > *:nth-child(4n+1),
  .pattern-md-75 > *:nth-child(4n) {
    width: 58.33333333%;
  }
  .pattern-md-75 > *:nth-child(4n+2),
  .pattern-md-75 > *:nth-child(4n+3) {
    width: 41.66666667%;
  }
  
  .pattern-md-48 > *:nth-child(4n+1),
  .pattern-md-48 > *:nth-child(4n) {
    width: 33.33333333%;
  }
  .pattern-md-48 > *:nth-child(4n+2),
  .pattern-md-48 > *:nth-child(4n+3) {
    width: 66.66666667%;
  }
  
  .pattern-md-84 > *:nth-child(4n+1),
  .pattern-md-84 > *:nth-child(4n) {
    width: 66.66666667%;
  }
  .pattern-md-84 > *:nth-child(4n+2),
  .pattern-md-84 > *:nth-child(4n+3) {
    width: 33.33333333%;
  }
  
  .pattern-md-336 > *:nth-child(6n+1),
  .pattern-md-336 > *:nth-child(6n+2),
  .pattern-md-336 > *:nth-child(6n+5),
  .pattern-md-336 > *:nth-child(6n) {
    width: 25%;
  }
  .pattern-md-336 > *:nth-child(6n+3),
  .pattern-md-336 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-md-633 > *:nth-child(6n+1),
  .pattern-md-633 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-md-633 > *:nth-child(6n+2),
  .pattern-md-633 > *:nth-child(6n+3),
  .pattern-md-633 > *:nth-child(6n+5),
  .pattern-md-633 > *:nth-child(6n) {
    width: 25%;
  }
  
  .pattern-md-246 > *:nth-child(6n+1),
  .pattern-md-246 > *:nth-child(6n) {
    width: 16.66666667%;
  }
  .pattern-md-246 > *:nth-child(6n+2),
  .pattern-md-246 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-md-246 > *:nth-child(6n+3),
  .pattern-md-246 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-md-642 > *:nth-child(6n+1),
  .pattern-md-642 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-md-642 > *:nth-child(6n+2),
  .pattern-md-642 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-md-642 > *:nth-child(6n+3),
  .pattern-md-642 > *:nth-child(6n) {
    width: 16.66666667%;
  }
}

/* ===== LG (1024px+) ===== */

@container pattern (min-width: 1024px) {
  .pattern-lg-12 > * {
    width: 100%;
  }
  
  .pattern-lg-66 > * {
    width: 50%;
  }
  
  .pattern-lg-57 > *:nth-child(4n+1),
  .pattern-lg-57 > *:nth-child(4n) {
    width: 41.66666667%;
  }
  .pattern-lg-57 > *:nth-child(4n+2),
  .pattern-lg-57 > *:nth-child(4n+3) {
    width: 58.33333333%;
  }
  
  .pattern-lg-75 > *:nth-child(4n+1),
  .pattern-lg-75 > *:nth-child(4n) {
    width: 58.33333333%;
  }
  .pattern-lg-75 > *:nth-child(4n+2),
  .pattern-lg-75 > *:nth-child(4n+3) {
    width: 41.66666667%;
  }
  
  .pattern-lg-48 > *:nth-child(4n+1),
  .pattern-lg-48 > *:nth-child(4n) {
    width: 33.33333333%;
  }
  .pattern-lg-48 > *:nth-child(4n+2),
  .pattern-lg-48 > *:nth-child(4n+3) {
    width: 66.66666667%;
  }
  
  .pattern-lg-84 > *:nth-child(4n+1),
  .pattern-lg-84 > *:nth-child(4n) {
    width: 66.66666667%;
  }
  .pattern-lg-84 > *:nth-child(4n+2),
  .pattern-lg-84 > *:nth-child(4n+3) {
    width: 33.33333333%;
  }
  
  .pattern-lg-336 > *:nth-child(6n+1),
  .pattern-lg-336 > *:nth-child(6n+2),
  .pattern-lg-336 > *:nth-child(6n+5),
  .pattern-lg-336 > *:nth-child(6n) {
    width: 25%;
  }
  .pattern-lg-336 > *:nth-child(6n+3),
  .pattern-lg-336 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-lg-633 > *:nth-child(6n+1),
  .pattern-lg-633 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-lg-633 > *:nth-child(6n+2),
  .pattern-lg-633 > *:nth-child(6n+3),
  .pattern-lg-633 > *:nth-child(6n+5),
  .pattern-lg-633 > *:nth-child(6n) {
    width: 25%;
  }
  
  .pattern-lg-246 > *:nth-child(6n+1),
  .pattern-lg-246 > *:nth-child(6n) {
    width: 16.66666667%;
  }
  .pattern-lg-246 > *:nth-child(6n+2),
  .pattern-lg-246 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-lg-246 > *:nth-child(6n+3),
  .pattern-lg-246 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-lg-642 > *:nth-child(6n+1),
  .pattern-lg-642 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-lg-642 > *:nth-child(6n+2),
  .pattern-lg-642 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-lg-642 > *:nth-child(6n+3),
  .pattern-lg-642 > *:nth-child(6n) {
    width: 16.66666667%;
  }
}

/* ===== XL (1200px+) ===== */

@container pattern (min-width: 1200px) {
  .pattern-xl-12 > * {
    width: 100%;
  }
  
  .pattern-xl-66 > * {
    width: 50%;
  }
  
  .pattern-xl-57 > *:nth-child(4n+1),
  .pattern-xl-57 > *:nth-child(4n) {
    width: 41.66666667%;
  }
  .pattern-xl-57 > *:nth-child(4n+2),
  .pattern-xl-57 > *:nth-child(4n+3) {
    width: 58.33333333%;
  }
  
  .pattern-xl-75 > *:nth-child(4n+1),
  .pattern-xl-75 > *:nth-child(4n) {
    width: 58.33333333%;
  }
  .pattern-xl-75 > *:nth-child(4n+2),
  .pattern-xl-75 > *:nth-child(4n+3) {
    width: 41.66666667%;
  }
  
  .pattern-xl-48 > *:nth-child(4n+1),
  .pattern-xl-48 > *:nth-child(4n) {
    width: 33.33333333%;
  }
  .pattern-xl-48 > *:nth-child(4n+2),
  .pattern-xl-48 > *:nth-child(4n+3) {
    width: 66.66666667%;
  }
  
  .pattern-xl-84 > *:nth-child(4n+1),
  .pattern-xl-84 > *:nth-child(4n) {
    width: 66.66666667%;
  }
  .pattern-xl-84 > *:nth-child(4n+2),
  .pattern-xl-84 > *:nth-child(4n+3) {
    width: 33.33333333%;
  }
  
  .pattern-xl-336 > *:nth-child(6n+1),
  .pattern-xl-336 > *:nth-child(6n+2),
  .pattern-xl-336 > *:nth-child(6n+5),
  .pattern-xl-336 > *:nth-child(6n) {
    width: 25%;
  }
  .pattern-xl-336 > *:nth-child(6n+3),
  .pattern-xl-336 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-xl-633 > *:nth-child(6n+1),
  .pattern-xl-633 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-xl-633 > *:nth-child(6n+2),
  .pattern-xl-633 > *:nth-child(6n+3),
  .pattern-xl-633 > *:nth-child(6n+5),
  .pattern-xl-633 > *:nth-child(6n) {
    width: 25%;
  }
  
  .pattern-xl-246 > *:nth-child(6n+1),
  .pattern-xl-246 > *:nth-child(6n) {
    width: 16.66666667%;
  }
  .pattern-xl-246 > *:nth-child(6n+2),
  .pattern-xl-246 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-xl-246 > *:nth-child(6n+3),
  .pattern-xl-246 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-xl-642 > *:nth-child(6n+1),
  .pattern-xl-642 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-xl-642 > *:nth-child(6n+2),
  .pattern-xl-642 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-xl-642 > *:nth-child(6n+3),
  .pattern-xl-642 > *:nth-child(6n) {
    width: 16.66666667%;
  }
}

/* ===== XXL (1480px+) ===== */

@container pattern (min-width: 1480px) {
  .pattern-xxl-12 > * {
    width: 100%;
  }
  
  .pattern-xxl-66 > * {
    width: 50%;
  }
  
  .pattern-xxl-57 > *:nth-child(4n+1),
  .pattern-xxl-57 > *:nth-child(4n) {
    width: 41.66666667%;
  }
  .pattern-xxl-57 > *:nth-child(4n+2),
  .pattern-xxl-57 > *:nth-child(4n+3) {
    width: 58.33333333%;
  }
  
  .pattern-xxl-75 > *:nth-child(4n+1),
  .pattern-xxl-75 > *:nth-child(4n) {
    width: 58.33333333%;
  }
  .pattern-xxl-75 > *:nth-child(4n+2),
  .pattern-xxl-75 > *:nth-child(4n+3) {
    width: 41.66666667%;
  }
  
  .pattern-xxl-48 > *:nth-child(4n+1),
  .pattern-xxl-48 > *:nth-child(4n) {
    width: 33.33333333%;
  }
  .pattern-xxl-48 > *:nth-child(4n+2),
  .pattern-xxl-48 > *:nth-child(4n+3) {
    width: 66.66666667%;
  }
  
  .pattern-xxl-84 > *:nth-child(4n+1),
  .pattern-xxl-84 > *:nth-child(4n) {
    width: 66.66666667%;
  }
  .pattern-xxl-84 > *:nth-child(4n+2),
  .pattern-xxl-84 > *:nth-child(4n+3) {
    width: 33.33333333%;
  }
  
  .pattern-xxl-336 > *:nth-child(6n+1),
  .pattern-xxl-336 > *:nth-child(6n+2),
  .pattern-xxl-336 > *:nth-child(6n+5),
  .pattern-xxl-336 > *:nth-child(6n) {
    width: 25%;
  }
  .pattern-xxl-336 > *:nth-child(6n+3),
  .pattern-xxl-336 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-xxl-633 > *:nth-child(6n+1),
  .pattern-xxl-633 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-xxl-633 > *:nth-child(6n+2),
  .pattern-xxl-633 > *:nth-child(6n+3),
  .pattern-xxl-633 > *:nth-child(6n+5),
  .pattern-xxl-633 > *:nth-child(6n) {
    width: 25%;
  }
  
  .pattern-xxl-246 > *:nth-child(6n+1),
  .pattern-xxl-246 > *:nth-child(6n) {
    width: 16.66666667%;
  }
  .pattern-xxl-246 > *:nth-child(6n+2),
  .pattern-xxl-246 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-xxl-246 > *:nth-child(6n+3),
  .pattern-xxl-246 > *:nth-child(6n+4) {
    width: 50%;
  }
  
  .pattern-xxl-642 > *:nth-child(6n+1),
  .pattern-xxl-642 > *:nth-child(6n+4) {
    width: 50%;
  }
  .pattern-xxl-642 > *:nth-child(6n+2),
  .pattern-xxl-642 > *:nth-child(6n+5) {
    width: 33.33333333%;
  }
  .pattern-xxl-642 > *:nth-child(6n+3),
  .pattern-xxl-642 > *:nth-child(6n) {
    width: 16.66666667%;
  }
}

/* Grid Boostrap */

 :root {
  --bs-breakpoint-xs: 320px;
  --bs-breakpoint-sm: 440px; /* 576px */
  --bs-breakpoint-md: 768px; /* 768px */
  --bs-breakpoint-lg: 1024px; /* 992px */
  --bs-breakpoint-xl: 1200px; /* 1200px */
  --bs-breakpoint-xxl: 1480px; /* 1440px */


  --bs-container-xs: 100%;
  --bs-container-sm: 100%; 
  --bs-container-md: 100%; 
  --bs-container-lg: 100%;
  --bs-container-xl: 100%; 
  --bs-container-xxl: 100rem;
}

:root {
  --bs-gutter-x: 1rem;
  --bs-gutter-y: 1rem;
  --bs-container-padding: calc(var(--bs-gutter-x) * 1);
}

.container-fluid {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: var(--bs-gutter-x);
  padding-left: var(--bs-gutter-x);
}
 .container,
 .container-xxl,
 .container-xl,
 .container-lg,
 .container-md,
 .container-sm  {
  margin-right: auto;
  margin-left: auto;
  width: var(--bs-container-xs);
  padding-right: var(--bs-container-padding);
  padding-left: var(--bs-container-padding);
}
.frame-section {
    overflow: hidden; /* @todo check if nessesary */
}
.frame-section.breakout-1 > .container {
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
}
.frame-section.breakout-2 > .container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}
.frame-container.breakout-1 { 
    margin-left: calc(var(--bs-gutter-x) * -1);
    margin-right: calc(var(--bs-gutter-x) * -1);
}
.frame-section,
.frame-container.breakout-2  {
    width: 100cqw; /* Container Query Width */
    margin-inline: calc((100cqw - 100%) / -2);
}
.frame-container.breakout-3 { 
    margin-left: calc(var(--bs-gutter-x) * -.75);
    margin-right: calc(var(--bs-gutter-x) * -.75);
}
 @media (min-width: 480px) {
  :root {
    --bs-gutter-x: 1.125rem;
    --bs-gutter-y: 1.125rem;
    --bs-container-padding: calc(var(--bs-gutter-x) * 1.25);
  }
   .container-sm, .container {
     max-width: var(--bs-container-sm);
     padding-right: var(--bs-container-padding);
     padding-left: var(--bs-container-padding);
   }
   .frame-section.breakout-1 > .container {
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
  }
  .frame-container.breakout-1 { 
    margin-left: calc(var(--bs-gutter-x) * -1);
    margin-right: calc(var(--bs-gutter-x) * -1);
  }
 }
 @media (min-width: 768px) {
    :root {
      --bs-gutter-x: 1.25rem;
      --bs-gutter-y: 1.25rem;
      --bs-container-padding: calc(var(--bs-gutter-x) * 2);
    }
   .container-md, .container-sm, .container {
    max-width: var(--bs-container-md);
    padding-right: var(--bs-container-padding);
    padding-left: var(--bs-container-padding);
  }
  .frame-section.breakout-1 > .container {
    padding-right: calc(var(--bs-gutter-x) * .75);
    padding-left: calc(var(--bs-gutter-x) * .75);
  }
  .frame-container.breakout-1 { 
    margin-left: calc(var(--bs-gutter-x) * -1);
    margin-right: calc(var(--bs-gutter-x) * -1);
  }
 }
 @media (min-width: 1024px) {
  :root {
    --bs-gutter-x: 1.375rem;
    --bs-gutter-y: 1.375rem;
    --bs-container-padding: calc(var(--bs-gutter-x) * 2.5);
  }
   .container-lg, .container-md, .container-sm, .container {
    max-width: var(--bs-container-lg);
    padding-right: var(--bs-container-padding);
    padding-left: var(--bs-container-padding);
  }
  .frame-section.breakout-1 > .container {
    padding-right: calc(var(--bs-gutter-x) * 1.5);
    padding-left: calc(var(--bs-gutter-x) * 1.5);
  }
  .frame-container.breakout-1 { 
    margin-left: calc(var(--bs-gutter-x) * -1.5);
    margin-right: calc(var(--bs-gutter-x) * -1.5);
  }
 }
 @media (min-width: 1280px) {
  :root {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
    --bs-container-padding: calc(var(--bs-gutter-x) * 4);
  }
   .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: var(--bs-container-xl);
    padding-right: var(--bs-container-padding);
    padding-left: var(--bs-container-padding);
  }
  .frame-section.breakout-1 > .container {
    padding-right: calc(var(--bs-gutter-x) * 1);
    padding-left: calc(var(--bs-gutter-x) * 1);
  }
  .frame-container.breakout-1 { 
    margin-left: calc(var(--bs-gutter-x) * -1.5);
    margin-right: calc(var(--bs-gutter-x) * -1.5);
  }
 }
 @media (min-width: 1480px) {
  :root {
    --bs-gutter-x: 1.625rem;
    --bs-gutter-y: 1.625rem;
    --bs-container-padding: calc(var(--bs-gutter-x) * 4);
  }
   .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: var(--bs-container-xxl);
    padding-right: var(--bs-container-padding);
    padding-left: var(--bs-container-padding);
  }
  .frame-section.breakout-1 > .container {
    padding-right: calc(var(--bs-gutter-x) * 1);
    padding-left: calc(var(--bs-gutter-x) * 1);
  }
  .frame-container.breakout-1 { 
    margin-left: calc(var(--bs-gutter-x) * -2);
    margin-right: calc(var(--bs-gutter-x) * -2);
  }
 }

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.row > * {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
}

 .col {
   flex: 1 0 0%;
 }
 
 .row-cols-auto > * {
   flex: 0 0 auto;
   width: auto;
 }
 
 .row-cols-xs-1 > * {
   flex: 0 0 auto;
   width: 100%;
 }
 
 .row-cols-xs-2 > * {
   flex: 0 0 auto;
   width: 50%;
 }
 
 .row-cols-xs-3 > * {
   flex: 0 0 auto;
   width: 33.33333333%;
 }
 
 .row-cols-xs-4 > * {
   flex: 0 0 auto;
   width: 25%;
 }
 
 .row-cols-xs-5 > * {
   flex: 0 0 auto;
   width: 20%;
 }
 
 .row-cols-xs-6 > * {
   flex: 0 0 auto;
   width: 16.66666667%;
 }
 .row-cols-xs-8 > * {
  flex: 0 0 auto;
  width: 12.5%;
}
.row-cols-xs-10 > * {
  flex: 0 0 auto;
  width: 10%;
}
.row-cols-xs-12 > * {
  flex: 0 0 auto;
  width: 8.33333333%;
}
 
 .col-auto {
   flex: 0 0 auto;
   width: auto;
 }
 
 .col-1 {
   flex: 0 0 auto;
   width: 8.33333333%;
 }
 
 .col-2 {
   flex: 0 0 auto;
   width: 16.66666667%;
 }
 
 .col-3 {
   flex: 0 0 auto;
   width: 25%;
 }
 
 .col-4 {
   flex: 0 0 auto;
   width: 33.33333333%;
 }
 
 .col-5 {
   flex: 0 0 auto;
   width: 41.66666667%;
 }
 
 .col-6 {
   flex: 0 0 auto;
   width: 50%;
 }
 
 .col-7 {
   flex: 0 0 auto;
   width: 58.33333333%;
 }
 
 .col-8 {
   flex: 0 0 auto;
   width: 66.66666667%;
 }
 
 .col-9 {
   flex: 0 0 auto;
   width: 75%;
 }
 
 .col-10 {
   flex: 0 0 auto;
   width: 83.33333333%;
 }
 
 .col-11 {
   flex: 0 0 auto;
   width: 91.66666667%;
 }
 
 .col-12 {
   flex: 0 0 auto;
   width: 100%;
 }
 
 .offset-1 {
   margin-left: 8.33333333%;
 }
 
 .offset-2 {
   margin-left: 16.66666667%;
 }
 
 .offset-3 {
   margin-left: 25%;
 }
 
 .offset-4 {
   margin-left: 33.33333333%;
 }
 
 .offset-5 {
   margin-left: 41.66666667%;
 }
 
 .offset-6 {
   margin-left: 50%;
 }
 
 .offset-7 {
   margin-left: 58.33333333%;
 }
 
 .offset-8 {
   margin-left: 66.66666667%;
 }
 
 .offset-9 {
   margin-left: 75%;
 }
 
 .offset-10 {
   margin-left: 83.33333333%;
 }
 
 .offset-11 {
   margin-left: 91.66666667%;
 }
 

.gx-100 {
   --bs-gutter-x: 0;
} 
.gx-1 {
   --bs-gutter-x: var(--bs-padding-1);
}
.gx-2 {
   --bs-gutter-x: var(--bs-padding-2);
}
.gx-3 {
   --bs-gutter-x: var(--bs-padding-3);
}
.gx-4 {
   --bs-gutter-x: var(--bs-padding-4);
}
.gx-5 {
   --bs-gutter-x: var(--bs-padding-5);
}
.gx-6 {
   --bs-gutter-x: var(--bs-padding-6);
}
.gx-7 {
   --bs-gutter-x: var(--bs-padding-7);
}
.gx-8 {
   --bs-gutter-x: var(--bs-padding-8);
}
.gx-9 {
   --bs-gutter-x: var(--bs-padding-9);
}


.gy-100 {
   --bs-gutter-y: 0;
} 
.gy-1 {
   --bs-gutter-y: var(--bs-padding-1);
}
.gy-2 {
   --bs-gutter-y: var(--bs-padding-2);
}
.gy-3 {
   --bs-gutter-y: var(--bs-padding-3);
}
.gy-4 {
   --bs-gutter-y: var(--bs-padding-4);
}
.gy-5 {
   --bs-gutter-y: var(--bs-padding-5);
}
.gy-6 {
   --bs-gutter-y: var(--bs-padding-6);
}
.gy-7 {
   --bs-gutter-y: var(--bs-padding-7);
}
.gy-8 {
   --bs-gutter-y: var(--bs-padding-8);
}
.gy-9 {
   --bs-gutter-y: var(--bs-padding-9);
}

  @container (min-width: 320px) {
   .col-xs {
     flex: 1 0 0%;
   }
 
   .row-cols-xs-auto > * {
     flex: 0 0 auto;
     width: auto;
   }
   .row-cols-xs-1 > * {
     flex: 0 0 auto;
     width: 100%;
   }
   .row-cols-xs-2 > * {
     flex: 0 0 auto;
     width: 50%;
   }
   .row-cols-xs-3 > * {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
   .row-cols-xs-4 > * {
     flex: 0 0 auto;
     width: 25%;
   }
   .row-cols-xs-5 > * {
     flex: 0 0 auto;
     width: 20%;
   }
   .row-cols-xs-6 > * {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
  .row-cols-xs-8 > * {
    flex: 0 0 auto;
    width: 12.5%;
  }
  .row-cols-xs-10 > * {
    flex: 0 0 auto;
    width: 10%;
  }
  .row-cols-xs-12 > * {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
 
   .col-xs-auto {
     flex: 0 0 auto;
     width: auto;
   }
 
   .col-xs-1 {
     flex: 0 0 auto;
     width: 8.33333333%;
   }
 
   .col-xs-2 {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
 
   .col-xs-3 {
     flex: 0 0 auto;
     width: 25%;
   }
 
   .col-xs-4 {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
 
   .col-xs-5 {
     flex: 0 0 auto;
     width: 41.66666667%;
   }
 
   .col-xs-6 {
     flex: 0 0 auto;
     width: 50%;
   }
 
   .col-xs-7 {
     flex: 0 0 auto;
     width: 58.33333333%;
   }
 
   .col-xs-8 {
     flex: 0 0 auto;
     width: 66.66666667%;
   }
 
   .col-xs-9 {
     flex: 0 0 auto;
     width: 75%;
   }
 
   .col-xs-10 {
     flex: 0 0 auto;
     width: 83.33333333%;
   }
 
   .col-xs-11 {
     flex: 0 0 auto;
     width: 91.66666667%;
   }
 
   .col-xs-12 {
     flex: 0 0 auto;
     width: 100%;
   }
 
   .offset-xs-0 {
     margin-left: 0;
   }
 
   .offset-xs-1 {
     margin-left: 8.33333333%;
   }
 
   .offset-xs-2 {
     margin-left: 16.66666667%;
   }
 
   .offset-xs-3 {
     margin-left: 25%;
   }
 
   .offset-xs-4 {
     margin-left: 33.33333333%;
   }
 
   .offset-xs-5 {
     margin-left: 41.66666667%;
   }
 
   .offset-xs-6 {
     margin-left: 50%;
   }
 
   .offset-xs-7 {
     margin-left: 58.33333333%;
   }
 
   .offset-xs-8 {
     margin-left: 66.66666667%;
   }
 
   .offset-xs-9 {
     margin-left: 75%;
   }
 
   .offset-xs-10 {
     margin-left: 83.33333333%;
   }
 
   .offset-xs-11 {
     margin-left: 91.66666667%;
   }
 }
 
 @container (min-width: 440px) {
   .col-sm {
     flex: 1 0 0%;
   }
 
   .row-cols-sm-auto > * {
     flex: 0 0 auto;
     width: auto;
   }
   .row-cols-sm-1 > * {
     flex: 0 0 auto;
     width: 100%;
   }
   .row-cols-sm-2 > * {
     flex: 0 0 auto;
     width: 50%;
   }
   .row-cols-sm-3 > * {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
   .row-cols-sm-4 > * {
     flex: 0 0 auto;
     width: 25%;
   }
   .row-cols-sm-5 > * {
     flex: 0 0 auto;
     width: 20%;
   }
   .row-cols-sm-6 > * {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
  .row-cols-sm-8 > * {
    flex: 0 0 auto;
    width: 12.5%;
  }
  .row-cols-sm-10 > * {
    flex: 0 0 auto;
    width: 10%;
  }
  .row-cols-sm-12 > * {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
 
   .col-sm-auto {
     flex: 0 0 auto;
     width: auto;
   }
 
   .col-sm-1 {
     flex: 0 0 auto;
     width: 8.33333333%;
   }
 
   .col-sm-2 {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
 
   .col-sm-3 {
     flex: 0 0 auto;
     width: 25%;
   }
 
   .col-sm-4 {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
 
   .col-sm-5 {
     flex: 0 0 auto;
     width: 41.66666667%;
   }
 
   .col-sm-6 {
     flex: 0 0 auto;
     width: 50%;
   }
 
   .col-sm-7 {
     flex: 0 0 auto;
     width: 58.33333333%;
   }
 
   .col-sm-8 {
     flex: 0 0 auto;
     width: 66.66666667%;
   }
 
   .col-sm-9 {
     flex: 0 0 auto;
     width: 75%;
   }
 
   .col-sm-10 {
     flex: 0 0 auto;
     width: 83.33333333%;
   }
 
   .col-sm-11 {
     flex: 0 0 auto;
     width: 91.66666667%;
   }
 
   .col-sm-12 {
     flex: 0 0 auto;
     width: 100%;
   }
 
   .offset-sm-0 {
     margin-left: 0;
   }
 
   .offset-sm-1 {
     margin-left: 8.33333333%;
   }
 
   .offset-sm-2 {
     margin-left: 16.66666667%;
   }
 
   .offset-sm-3 {
     margin-left: 25%;
   }
 
   .offset-sm-4 {
     margin-left: 33.33333333%;
   }
 
   .offset-sm-5 {
     margin-left: 41.66666667%;
   }
 
   .offset-sm-6 {
     margin-left: 50%;
   }
 
   .offset-sm-7 {
     margin-left: 58.33333333%;
   }
 
   .offset-sm-8 {
     margin-left: 66.66666667%;
   }
 
   .offset-sm-9 {
     margin-left: 75%;
   }
 
   .offset-sm-10 {
     margin-left: 83.33333333%;
   }
 
   .offset-sm-11 {
     margin-left: 91.66666667%;
   }
 }

 @container (min-width: 768px) {
   .col-md {
     flex: 1 0 0%;
   }
   .row-cols-md-auto > * {
     flex: 0 0 auto;
     width: auto;
   }
   .row-cols-md-1 > * {
     flex: 0 0 auto;
     width: 100%;
   }
   .row-cols-md-2 > * {
     flex: 0 0 auto;
     width: 50%;
   }
   .row-cols-md-3 > * {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
   .row-cols-md-4 > * {
     flex: 0 0 auto;
     width: 25%;
   }
   .row-cols-md-5 > * {
     flex: 0 0 auto;
     width: 20%;
   }
   .row-cols-md-6 > * {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
  .row-cols-md-8 > * {
    flex: 0 0 auto;
    width: 12.5%;
  }
  .row-cols-md-10 > * {
    flex: 0 0 auto;
    width: 10%;
  }
  .row-cols-md-12 > * {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

   .col-md-auto {
     flex: 0 0 auto;
     width: auto;
   }
 
   .col-md-1 {
     flex: 0 0 auto;
     width: 8.33333333%;
   }
 
   .col-md-2 {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
 
   .col-md-3 {
     flex: 0 0 auto;
     width: 25%;
   }
 
   .col-md-4 {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
 
   .col-md-5 {
     flex: 0 0 auto;
     width: 41.66666667%;
   }
 
   .col-md-6 {
     flex: 0 0 auto;
     width: 50%;
   }
 
   .col-md-7 {
     flex: 0 0 auto;
     width: 58.33333333%;
   }
 
   .col-md-8 {
     flex: 0 0 auto;
     width: 66.66666667%;
   }
 
   .col-md-9 {
     flex: 0 0 auto;
     width: 75%;
   }
 
   .col-md-10 {
     flex: 0 0 auto;
     width: 83.33333333%;
   }
 
   .col-md-11 {
     flex: 0 0 auto;
     width: 91.66666667%;
   }
 
   .col-md-12 {
     flex: 0 0 auto;
     width: 100%;
   }
 
   .offset-md-0 {
     margin-left: 0;
   }
 
   .offset-md-1 {
     margin-left: 8.33333333%;
   }
 
   .offset-md-2 {
     margin-left: 16.66666667%;
   }
 
   .offset-md-3 {
     margin-left: 25%;
   }
 
   .offset-md-4 {
     margin-left: 33.33333333%;
   }
 
   .offset-md-5 {
     margin-left: 41.66666667%;
   }
 
   .offset-md-6 {
     margin-left: 50%;
   }
 
   .offset-md-7 {
     margin-left: 58.33333333%;
   }
 
   .offset-md-8 {
     margin-left: 66.66666667%;
   }
 
   .offset-md-9 {
     margin-left: 75%;
   }
 
   .offset-md-10 {
     margin-left: 83.33333333%;
   }
 
   .offset-md-11 {
     margin-left: 91.66666667%;
   }
 }

 @container (min-width: 1024px) {
   .col-lg {
     flex: 1 0 0%;
   }
   .row-cols-lg-auto > * {
     flex: 0 0 auto;
     width: auto;
   }
   .row-cols-lg-1 > * {
     flex: 0 0 auto;
     width: 100%;
   }
   .row-cols-lg-2 > * {
     flex: 0 0 auto;
     width: 50%;
   }
   .row-cols-lg-3 > * {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
   .row-cols-lg-4 > * {
     flex: 0 0 auto;
     width: 25%;
   }
   .row-cols-lg-5 > * {
     flex: 0 0 auto;
     width: 20%;
   }
   .row-cols-lg-6 > * {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
   .row-cols-lg-8 > * {
    flex: 0 0 auto;
    width: 12.5%;
  }
  .row-cols-lg-10 > * {
    flex: 0 0 auto;
    width: 10%;
  }
  .row-cols-lg-12 > * {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
   .col-lg-auto {
     flex: 0 0 auto;
     width: auto;
   }
 
   .col-lg-1 {
     flex: 0 0 auto;
     width: 8.33333333%;
   }
 
   .col-lg-2 {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
 
   .col-lg-3 {
     flex: 0 0 auto;
     width: 25%;
   }
 
   .col-lg-4 {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
 
   .col-lg-5 {
     flex: 0 0 auto;
     width: 41.66666667%;
   }
 
   .col-lg-6 {
     flex: 0 0 auto;
     width: 50%;
   }
 
   .col-lg-7 {
     flex: 0 0 auto;
     width: 58.33333333%;
   }
 
   .col-lg-8 {
     flex: 0 0 auto;
     width: 66.66666667%;
   }
 
   .col-lg-9 {
     flex: 0 0 auto;
     width: 75%;
   }
 
   .col-lg-10 {
     flex: 0 0 auto;
     width: 83.33333333%;
   }
 
   .col-lg-11 {
     flex: 0 0 auto;
     width: 91.66666667%;
   }
 
   .col-lg-12 {
     flex: 0 0 auto;
     width: 100%;
   }
 
   .offset-lg-0 {
     margin-left: 0;
   }
 
   .offset-lg-1 {
     margin-left: 8.33333333%;
   }
 
   .offset-lg-2 {
     margin-left: 16.66666667%;
   }
 
   .offset-lg-3 {
     margin-left: 25%;
   }
 
   .offset-lg-4 {
     margin-left: 33.33333333%;
   }
 
   .offset-lg-5 {
     margin-left: 41.66666667%;
   }
 
   .offset-lg-6 {
     margin-left: 50%;
   }
 
   .offset-lg-7 {
     margin-left: 58.33333333%;
   }
 
   .offset-lg-8 {
     margin-left: 66.66666667%;
   }
 
   .offset-lg-9 {
     margin-left: 75%;
   }
 
   .offset-lg-10 {
     margin-left: 83.33333333%;
   }
 
   .offset-lg-11 {
     margin-left: 91.66666667%;
   }
 }

 @container (min-width: 1280px) {
   .col-xl {
     flex: 1 0 0%;
   }
 
   .row-cols-xl-auto > * {
     flex: 0 0 auto;
     width: auto;
   }
   .row-cols-xl-1 > * {
     flex: 0 0 auto;
     width: 100%;
   }
   .row-cols-xl-2 > * {
     flex: 0 0 auto;
     width: 50%;
   }
   .row-cols-xl-3 > * {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
   .row-cols-xl-4 > * {
     flex: 0 0 auto;
     width: 25%;
   }
   .row-cols-xl-5 > * {
     flex: 0 0 auto;
     width: 20%;
   }
   .row-cols-xl-6 > * {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
   .row-cols-xl-8 > * {
    flex: 0 0 auto;
    width: 12.5%;
  }
  .row-cols-xl-10 > * {
    flex: 0 0 auto;
    width: 10%;
  }
  .row-cols-xl-12 > * {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
 
   .col-xl-auto {
     flex: 0 0 auto;
     width: auto;
   }
 
   .col-xl-1 {
     flex: 0 0 auto;
     width: 8.33333333%;
   }
 
   .col-xl-2 {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
 
   .col-xl-3 {
     flex: 0 0 auto;
     width: 25%;
   }
 
   .col-xl-4 {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
 
   .col-xl-5 {
     flex: 0 0 auto;
     width: 41.66666667%;
   }
 
   .col-xl-6 {
     flex: 0 0 auto;
     width: 50%;
   }
 
   .col-xl-7 {
     flex: 0 0 auto;
     width: 58.33333333%;
   }
 
   .col-xl-8 {
     flex: 0 0 auto;
     width: 66.66666667%;
   }
 
   .col-xl-9 {
     flex: 0 0 auto;
     width: 75%;
   }
 
   .col-xl-10 {
     flex: 0 0 auto;
     width: 83.33333333%;
   }
 
   .col-xl-11 {
     flex: 0 0 auto;
     width: 91.66666667%;
   }
 
   .col-xl-12 {
     flex: 0 0 auto;
     width: 100%;
   }
 
   .offset-xl-0 {
     margin-left: 0;
   }
 
   .offset-xl-1 {
     margin-left: 8.33333333%;
   }
 
   .offset-xl-2 {
     margin-left: 16.66666667%;
   }
 
   .offset-xl-3 {
     margin-left: 25%;
   }
 
   .offset-xl-4 {
     margin-left: 33.33333333%;
   }
 
   .offset-xl-5 {
     margin-left: 41.66666667%;
   }
 
   .offset-xl-6 {
     margin-left: 50%;
   }
 
   .offset-xl-7 {
     margin-left: 58.33333333%;
   }
 
   .offset-xl-8 {
     margin-left: 66.66666667%;
   }
 
   .offset-xl-9 {
     margin-left: 75%;
   }
 
   .offset-xl-10 {
     margin-left: 83.33333333%;
   }
 
   .offset-xl-11 {
     margin-left: 91.66666667%;
   }
 }

 @container (min-width: 1480px) {
   .col-xxl {
     flex: 1 0 0%;
   }
 
   .row-cols-xxl-auto > * {
     flex: 0 0 auto;
     width: auto;
   }
   .row-cols-xxl-1 > * {
     flex: 0 0 auto;
     width: 100%;
   }
   .row-cols-xxl-2 > * {
     flex: 0 0 auto;
     width: 50%;
   }
   .row-cols-xxl-3 > * {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
   .row-cols-xxl-4 > * {
     flex: 0 0 auto;
     width: 25%;
   }
   .row-cols-xxl-5 > * {
     flex: 0 0 auto;
     width: 20%;
   }
   .row-cols-xxl-6 > * {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
   .row-cols-xxl-8 > * {
    flex: 0 0 auto;
    width: 12.5%;
  }
  .row-cols-xxl-10 > * {
    flex: 0 0 auto;
    width: 10%;
  }
  .row-cols-xxl-12 > * {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

   .col-xxl-auto {
     flex: 0 0 auto;
     width: auto;
   }
 
   .col-xxl-1 {
     flex: 0 0 auto;
     width: 8.33333333%;
   }
 
   .col-xxl-2 {
     flex: 0 0 auto;
     width: 16.66666667%;
   }
 
   .col-xxl-3 {
     flex: 0 0 auto;
     width: 25%;
   }
 
   .col-xxl-4 {
     flex: 0 0 auto;
     width: 33.33333333%;
   }
 
   .col-xxl-5 {
     flex: 0 0 auto;
     width: 41.66666667%;
   }
 
   .col-xxl-6 {
     flex: 0 0 auto;
     width: 50%;
   }
 
   .col-xxl-7 {
     flex: 0 0 auto;
     width: 58.33333333%;
   }
 
   .col-xxl-8 {
     flex: 0 0 auto;
     width: 66.66666667%;
   }
 
   .col-xxl-9 {
     flex: 0 0 auto;
     width: 75%;
   }
 
   .col-xxl-10 {
     flex: 0 0 auto;
     width: 83.33333333%;
   }
 
   .col-xxl-11 {
     flex: 0 0 auto;
     width: 91.66666667%;
   }
 
   .col-xxl-12 {
     flex: 0 0 auto;
     width: 100%;
   }
 
   .offset-xxl-0 {
     margin-left: 0;
   }
 
   .offset-xxl-1 {
     margin-left: 8.33333333%;
   }
 
   .offset-xxl-2 {
     margin-left: 16.66666667%;
   }
 
   .offset-xxl-3 {
     margin-left: 25%;
   }
 
   .offset-xxl-4 {
     margin-left: 33.33333333%;
   }
 
   .offset-xxl-5 {
     margin-left: 41.66666667%;
   }
 
   .offset-xxl-6 {
     margin-left: 50%;
   }
 
   .offset-xxl-7 {
     margin-left: 58.33333333%;
   }
 
   .offset-xxl-8 {
     margin-left: 66.66666667%;
   }
 
   .offset-xxl-9 {
     margin-left: 75%;
   }
 
   .offset-xxl-10 {
     margin-left: 83.33333333%;
   }
 
   .offset-xxl-11 {
     margin-left: 91.66666667%;
   }
 }