/*******************************************/
/*                                GRID                        */
/*                                                                    */
/*******************************************/

.grid, .grid-sup > div, .grid-sup > ul { display: grid; }
.grid-cols-1-sup > div, .grid-cols-1-sup > ul, .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2-sup > div, .grid-cols-2-sup > ul, .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3-sup > div, .grid-cols-3-sup > ul, .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-4-sup > div, .grid-cols-4-sup > ul, .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-cols-5-sup > div, .grid-cols-5-sup > ul, .grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid-cols-6-sup > div, .grid-cols-6-sup > ul, .grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid-cols-7-sup > div, .grid-cols-7-sup > ul, .grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid-cols-8-sup > div, .grid-cols-8-sup > ul, .grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }

.justify-items-stretch .grid { justify-items: stretch; }

.flex-wrap { flex-wrap: wrap; }
.inline-flex { display: inline-flex; }

.flex, .flex-sup > div, .flex-sup > ul { display: flex; }
.flex-1	{ flex: 1 1 0%; }
.flex-auto { flex: 1 1 auto; }
.flex-initial { flex: 0 1 auto; }
.flex-none { flex: none; }
.flex-col { flex-direction: column; }

.gridalignend, .items-end { align-items: end; }
.gridalignstretch, .flexstretch .layout--twocol { align-items: stretch; align-content: stretch; }
.aligncenter .layout { align-items: center; align-content: center; }

.shrink-0	{ flex-shrink: 0; }
.shrink { flex-shrink: 1; }

.justcenter .layout, .justify-center, .justify-center-sup > .layout { justify-content: center; }
.justify-between, .justify-between-sup > .layout { justify-content: space-between; }
.justify-end, .justify-end-sup > .layout { justify-content: flex-end; }

.content-center { align-content: center; }
.content-start { align-content: flex-start; }
.content-end { align-content: flex-end; }
.content-stretch, .content-stretch-sup > .layout { align-content: stretch; }

.items-stretch, .items-stretch-sup .layout { align-items: stretch; }
.items-start, .items-start-sup .layout { align-items: flex-start; }
.items-end, .items-end-sup .layout { align-items: flex-end; }
.items-center, .items-center-sup .layout, .items-center .grid { align-items: center; }

.flexstretch .layout--twocol div, .items-stretch .layout--twocol div, .items-stretch > div, .justify-items-stretch > div > div > div { height: 100%; }
.flexautowidth .layout > div { width: auto; }

.layout--twocol {
  width: 100%;
}

.grid-area-1-2-sup > div > div, .grid-area-1-2 > div {
  grid-area: 1/-1;
}

body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33 {
  display: grid;
  grid-template-columns: calc(33.3334% - 24px) calc(33.3334% - 24px) calc(33.3334% - 24px) ;
  grid-column-gap: 36px;
}

body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33 > .layout__region--first,
body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33 > .layout__region--third,
body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33 > .layout__region--second {
  display: inline-block; width: 100%;
}

body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33 > .layout__region--top,
body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33 > .layout__region--bottom {
  display: none;
}

body .layout--threecol-33-34-33 > .layout__region--first,
body .layout--threecol-33-34-33 > .layout__region--third,
body .layout--threecol-33-34-33 > .layout__region--second {
  width: 33.333334%; flex:auto;
}

body .layout--twocol > .layout__region--first, .layout--twocol > .layout__region--second, .paragraph--type--abholmap > div { flex: 0 1 calc(50% - 30px); }
body .layout--twocol > .layout__region--first, .paragraph--type--abholmap > div:first-child { margin-right: 30px; }
body .layout--twocol > .layout__region--second, .paragraph--type--abholmap > div:last-child { margin-left: 30px; }

.flexwrapper > div {
  display: flex;
  flex-wrap: wrap;
}

.grid > div {
  position: relative;
}

body .fivegrid {
  display: grid;
  grid-template-columns: 20% 20% 20% 20% 20%;
  grid-column-gap: 0px;
}
body .fourgrid {
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-column-gap: 0px;
}

.gallerythumbs .view-content {
  display: grid;
  grid-template-columns: calc(16.6666666% - 10px) calc(16.6666666% - 10px) calc(16.6666666% - 10px) calc(16.6666666% - 10px) calc(16.6666666% - 10px) calc(16.6666666% - 10px);
  grid-column-gap: 12px;
  }

body .fourgridnested .layout__region {
  display: grid;
  grid-template-columns: calc(25% - 90px) calc(25% - 90px) calc(25% - 90px) calc(25% - 90px);
  grid-column-gap: 120px;
}

.fourgrid > div, .fourgrid > article, .fivegrid > div {
  margin-bottom: 0px;
}

.gap-y-10px {
    grid-row-gap: 10px;
}
.gap-y-20px {
    grid-row-gap: 20px;
}
.gap-x-10px {
    grid-column-gap: 10px;
}
.gap-x-20px {
    grid-column-gap: 20px;
}
.gap-x-30px {
    grid-column-gap: 30px;
}
.gap-x-50px {
    grid-column-gap: 50px;
}

.gap-x-70px {
    grid-column-gap: 70px;
}

body .threegrid{
  display: grid;
  grid-template-columns: calc(33.3334% - 6px) calc(33.3334% - 6px) calc(33.3334% - 6px) ;
  grid-column-gap: 9px;
}

body .threegrid > div {
  margin-bottom: 9px;
}

.twogrid {
  display: grid;
  grid-template-columns: calc(50% - 8px) calc(50% - 8px);
  grid-column-gap: 16px;
}
.twocolumns {
  grid-template-columns: calc(50% - 8px) calc(50% - 8px);
}

.twogrid > div {
  margin-bottom: 8px;
}

@media screen and (max-width: 1440px) {
  body .fivegrid {
    grid-template-columns: 33.3334% 33.3334% 33.3334%;
  }
}

@media screen and (max-width: 1200px) {
  body .fourgrid {
    grid-template-columns: 33.3334% 33.3334% 33.3334%;
  }
}

@media screen and (max-width: 1000px) {
  body .fivegrid {
    grid-template-columns: 50% 50%;
  }
}

@media screen and (max-width: 900px) {
  .fourgrid, .threegrid {
    grid-template-columns: 50% 50%;
    grid-column-gap: 0px;
  }

  body .fourgridnested .layout__region {
    display: grid;
    grid-template-columns: calc(50% - 40px) calc(50% - 40px);
    grid-column-gap: 80px;
  }
  .fourgrid > div, .threegrid > div, .fourgrid > article {
    margin-bottom: 0px;
  }
}

@media screen and (min-width: 480px) {
  .xs-flex-sup > div, .xs-flex-sup > ul, .xs-flex { display: flex; }
  .xs-grid-sup > div, .xs-grid-sup > ul, .xs-grid  { display: grid; }
  .xs-grid-cols-2-sup > div, .xs-grid-cols-2-sup > ul, .xs-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xs-grid-cols-3-sup > div, .xs-grid-cols-3-sup > ul, .xs-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .xs-grid-cols-4-sup > div, .xs-grid-cols-4-sup > ul, .xs-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

}

@media screen and (min-width: 768px) {
  .sm-flex-sup > div, .sm-flex-sup > ul, .sm-flex { display: flex; }
  .sm-grid-sup > div, .sm-grid-sup > ul, .sm-grid { display: grid; }
  .sm-grid-cols-1-sup > div, .sm-grid-cols-1-sup > ul, .sm-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .sm-grid-cols-2-sup > div, .sm-grid-cols-2-sup > ul, .sm-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sm-grid-cols-3-sup > div, .sm-grid-cols-3-sup > ul, .sm-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sm-grid-cols-4-sup > div, .sm-grid-cols-4-sup > ul, .sm-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sm-grid-cols-5-sup > div, .sm-grid-cols-5-sup > ul, .sm-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .sm-grid-cols-6-sup > div, .sm-grid-cols-6-sup > ul, .sm-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .sm-grid-cols-7-sup > div, .sm-grid-cols-7-sup > ul, .sm-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .sm-grid-cols-8-sup > div, .sm-grid-cols-8-sup > ul, .sm-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .sm-items-center { align-items: center; }
}

@media screen and (min-width: 1024px) {
  .md-flex-sup > div, .md-flex-sup > ul, .md-flex { display: flex; }
  .md-grid-sup > div, .md-grid-sup > ul, .md-grid { display: grid; }
  .md-grid-cols-2-sup > div, .md-grid-cols-2-sup > ul, .md-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md-grid-cols-3-sup > div, .md-grid-cols-3-sup > ul, .md-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md-grid-cols-4-sup > div, .md-grid-cols-4-sup > ul, .md-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .md-grid-cols-5-sup > div, .md-grid-cols-5-sup > ul, .md-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .md-grid-cols-6-sup > div, .md-grid-cols-6-sup > ul, .md-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .md-grid-cols-7-sup > div, .md-grid-cols-7-sup > ul, .md-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .md-grid-cols-8-sup > div, .md-grid-cols-8-sup > ul, .md-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}

@media screen and (min-width: 1440px) {
  .xl-flex-sup > div, .xl-flex-sup > ul, .xl-flex { display: flex; }
  .xl-grid-sup > div, .xl-grid { display: grid; }
  .xl-grid-cols-2-sup > div, .xl-grid-cols-2-sup > ul, .xl-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xl-grid-cols-3-sup > div, .xl-grid-cols-3-sup > ul, .xl-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .xl-grid-cols-4-sup > div, .xl-grid-cols-4-sup > ul, .xl-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .xl-grid-cols-5-sup > div, .xl-grid-cols-5-sup > ul, .xl-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .xl-grid-cols-6-sup > div, .xl-grid-cols-6-sup > ul, .xl-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .xl-grid-cols-7-sup > div, .xl-grid-cols-7-sup > ul, .xl-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .xl-grid-cols-8-sup > div, .xl-grid-cols-8-sup > ul, .xl-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}


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

body .layout--threecol-33-34-33 > div {
  flex: 0 1 100%;
}

.image-right .layout--twocol > .layout__region--first { order: 2; }

body .layout--twocol > .layout__region--first, .layout--twocol > .layout__region--second { flex: 0 1 100%; }
body .layout--twocol > .layout__region--first, .paragraph--type--abholmap > div:first-child { margin-right: 0px; }
body .layout--twocol > .layout__region--second, .paragraph--type--abholmap > div:last-child { margin-left: 0px; }


}


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

  .xs-grid-cols-2 .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xs-grid-cols-3 .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .xs-grid-cols-4 .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .xs-grid-cols-5 .grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .xs-grid-cols-6 .grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .xs-grid-cols-7 .grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .xs-grid-cols-8 .grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }

  .xs-text-center { text-align: center; }

  body .threegrid {
    grid-template-columns: calc(50% - 2px) calc(50% - 2px);
    grid-column-gap: 4px;
  }

  .fourgrid, .threegrid, .twogrid, .fivegrid, .fourgridnested .layout__region {
    display: block
  }

  .fourgrid > div, .threegrid > div, .twogrid > div, .fourgrid > article {
    margin-bottom: 0px;
  }

  body .paragraph--type--wrapper .gridarea .layout--threecol-33-34-33, .layout--threecol-33-34-33 {
    display: block!important;
  }
  .layout--threecol-33-34-33 .layout__region { width: 100%!important; }

}