/***Basis-Anweisungen
********************************************/


.wrapper-xl { max-width: 1800px; }
.wrapper-m, .path-admin { max-width: 1400px; }
.wrapper-s { max-width: 1200px; }
.wrapper-xs { max-width: 900px; }

.wrapper, .path-admin { width: 100%; padding: 0px 16px; margin: 0px auto; }

.wrapper.wrapper-pl { padding: 0px 0px 0px 20px; }
.wrapper.wrapper-pr { padding: 0px 20px 0px 0px; }

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

  .wrapper, .path-admin { padding: 0px 40px; }
  .wrapper.wrapper-pl { padding: 0px 0px 0px 30px; }
  .wrapper.wrapper-pr { padding: 0px 30px 0px 0px; }

}

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

  .wrapper, .path-admin { padding: 0px 50px; }
  .wrapper.wrapper-pl { padding: 0px 0px 0px 44px; }
  .wrapper.wrapper-pr { padding: 0px 44px 0px 0px; }

}


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

  .wrapper, .path-admin { padding: 0px 50px; }
  .wrapper.wrapper-pl { padding: 0px 0px 0px 44px; }
  .wrapper.wrapper-pr { padding: 0px 44px 0px 0px; }

}

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

  .wrapper, .path-admin { padding: 0px 60px;  }
  .wrapper.wrapper-pl { padding: 0px 0px 0px 60px; }
  .wrapper.wrapper-pr { padding: 0px 60px 0px 0px; }

}


.form-item--error-message {
  font-size: 0.9em;
  color: red;
  padding: 4px 0px;
  margin: 5px 0px;
}

.w-32 { width: 8rem; } /* 256px */
.w-64 { width: 16rem; }
.w-screen	{ width: 100vw; }
.w-full	{ width: 100%; }
.w-half	{ width: 50%; }

.h-screen	{ height: 100vh; }
.h-full	{ height: 100%; }
.min-h-screen { min-height: 100vh; }

.underline { text-decoration: underline; }
.underline-hover:hover { text-decoration: underline; }
.uppercase { text-transform: uppercase; }

.overflow-hidden { overflow: hidden; }

.pointer:hover	{ cursor: pointer; }

.order-last { order: 99; }
.order-2 { order: 2; }


 /* a-Behavior */
 a{
  text-decoration: none; outline: none;
 }

h1 a { background: #FFF; padding: 10px; line-height: 1.3em; }
.description a { text-decoration: underline; }
a:hover { cursor: pointer!important; }

 /* img-Behavior */
 img { display: block; width: 100%; height: auto; }
 a img{ border: none; }

 /* Listen */
/* Bullets von Listen weg */
 ul, ul li.leaf{ list-style-image: none; list-style-type: none;}
 html ul.menu { margin: 0px; }

.slick-dots li, .slick__arrow li {
  float: left; margin: 2px;
}
.slick__arrow li.slick-active button {
  background: #0D0D0D;
}

/* strong */
strong {
  font-weight: normal;
}
em { font-style: normal; }

.link-button { background: #ece8df; padding: 20px; font-size: 1.4em; }

.absolute { position: absolute; }
.top-0 { top: 0px; }
.top-120 { top: 120px; }
.top-50 { top: 50%; }
.bottom-0 { bottom: 0px; }
.left-0 { left: 0px; }
.left-50 { left: 50%; }
.left-100 { left: 100%; }
.right-0 { right: 0px; }
.inset-0 { inset: 0px; }

.-z-1 { z-index: -1; }
.-z-2 { z-index: -2; }
.-z-3 { z-index: -3; }

.z-1 { z-index: 1; }
.z-2 { z-index: 2; }
.z-3 { z-index: 3; }
.z-10 { z-index: 10; }
.z-100 { z-index: 100; }

.opacity-80 { opacity: 0.8; }


.m-xs { margin: 10px; }
.m-s { margin: 20px; }
.m-m { margin: 40px; }

.mr-s { margin-right: 20px; }
.mr-m { margin-right: 40px; }
.mr-l { margin-right: 60px; }
.mr-20, .mr-xl { margin-right: 5rem; }
.mr-xxl { margin-right: 7rem; }

.ml-15 { margin-left: 15px; }
.ml-s { margin-left: 20px; }
.ml-25 { margin-left: 1.563rem; }
.ml-m { margin-left: 40px; }
.ml-l { margin-left: 60px; }
.ml-20 { margin-left: 5rem; } /* 80px */

.mb-xs { margin-bottom: 1rem; } /* 10px */
.mb-s { margin-bottom: 1.25rem; } /* 20px */
.mb-10, .mb-m { margin-bottom: 2.5rem; } /* 40px */
.mb-40px { margin-bottom: 40px; }
.mb-15, .mb-l { margin-top: 3.75rem; }
.mb-20, .mb-xl { margin-bottom: 5rem; }

.mt-s { margin-top: 20px; }
.mt-7 { margin-top: 1.75rem; }  /* 28px */
.mt-10, .mt-m { margin-top: 2.5rem; }  /* 40px */
.mt-15, .mt-l { margin-top: 3.75rem; }  /* 60px */
.mt-20, .mt-xl { margin-top: 5rem; }  /* 80px */
.mt-half { margin-top: 50%; }

.pt-xs { padding-top: 10px; }
.pt-s { padding-top: 20px; }
.pt-m { padding-top: 30px; }
.pt-l { padding-top: 60px; }
.pt-8 { padding-top: 2rem; } /* 32px */
.pt-16 { padding-top: 4rem; }

.pb-xs { padding-bottom: 10px; }
.pb-s { padding-bottom: 20px; }
.pb-m { padding-bottom: 30px; }
.pb-8 { padding-bottom: 2rem; }
.pb-l { padding-bottom: 4rem; }

.pl-xs { padding-left: 10px; }
.pl-s { padding-left: 20px; }
.pl-m { padding-left: 30px; }
.pl-l { padding-left: 50px; }
.pl-20 { padding-left: 5rem; }

.pr-xs { padding-right: 10px; }
.pr-s { padding-right: 20px; }
.pr-m { padding-right: 30px; }
.pr-l { padding-right: 50px; }
.pr-20 { padding-right: 5rem; }

.p-0 { padding: 0px; }

.m-auto { margin: auto; }
.m-0, .m-0 > p { margin: 0px; }

.pvsmall { padding-top: 32px; padding-bottom: 32px; }
.bgcolorfourtopleiste.pvsmall { padding-top: 28px; padding-bottom: 28px; }

.sticky-header .bgcolorfourtopleiste.pvsmall {
  padding-top: 20px;
  padding-bottom: 20px;
}

.sticky-header .pvsmall {
  padding-top: 26px;
  padding-bottom: 26px;
}

.buttonpadding { padding: 20px 40px; }
.pvmiddle { padding: 80px 0px; }
.pvbig { padding: 160px 0px; }
.pvbottombig { padding-bottom: 140px; }
.pvtopbig { padding-top: 140px; }

 #variations.pvbottombig { padding-bottom: 110px; }
.phbig, .slick-dots { padding-left: 140px; padding-right: 140px; }
.layout__region > div.stretchself.phbig { width: calc(100% - 280px); height: calc(100% - 280px); }

.phbigl { padding-left: 140px; }
.phbigr { padding-right: 140px; }
.mhbigl { margin-left: 140px; }
.mhbigr { margin-right: 140px; }

.margsmall { margin: 10px; }
.pteaserabstand { margin: 12px; }
.mleftmiddle { margin-left: 30px; }
.mbottomhalfbig { margin-bottom: 50px; }
.mtopmiddle { margin-top: 30px; }
.mtophalfbig { margin-top: 50px; }
.mtopbig { margin-top: 70px; }
.mrightbig { margin-right: 100px; }
.mbottommiddle { margin-bottom: 30px; }


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

.layout__region > div.stretchself .buttonstyle { margin-top: 30px; }

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

    .pvbig { padding: 140px 0px; }
    .pvbottombig, #variations.pvbottombig { padding-bottom: 90px; }
    .pvtopbig { padding-top: 90px; }
    .phbig, .slick-dots { padding-left: 90px; padding-right: 90px; }
    .layout__region > div.stretchself.phbig { width: calc(100% - 180px); height: calc(100% - 180px); }
    .phbigl { padding-left: 90px; }
    .phbigr { padding-right: 90px; }
    .mhbigl { margin-left: 90px; }
    .mhbigr { margin-right: 90px; }

  }


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

    .pt-8 { padding-top: 1.6rem; }
    .pb-8 { padding-bottom: 1.6rem; }

    .pvbig { padding: 120px 0px; }
    .pvbottombig, #variations.pvbottombig { padding-bottom: 90px; }
    .pvmiddle { padding: 60px 0px; }
    .phbig, .slick-dots { padding-left: 65px; padding-right: 65px; }
    .layout__region > div.stretchself.phbig { width: calc(100% - 130px); height: calc(100% - 180px); }
    .phbigl { padding-left: 65px; }
    .phbigr { padding-right: 65px; }
    .mhbigl { margin-left: 65px; }
    .mhbigr { margin-right: 65px; }

    .pvsmall {
      padding-top: 24px;
      padding-bottom: 24px;
    }
    .sticky-header .pvsmall {
      padding-top: 22px;
      padding-bottom: 22px;
    }

    .margsmall { margin: 6px; }
    .mbottomhalfbig { margin-bottom: 30px; }
    .mtophalfbig { margin-top: 30px; }

    .layout__region > div.stretchself .buttonstyle { margin-top: 20px; }

  }

@media only screen and (min-width: 1025px)and (max-width: 1350px) {
  .paragraph-id--5 .layout__region > div.stretchself.pvbig { padding-top: 60px; padding-bottom: 60px; height: calc(100% - 120px); }
  .paragraph-id--5 h2 { margin-bottom: 30px; }

  .mrightbig {
    margin-right: 60px;
}
.flexpayment .mrightbig {
  margin-right: 35px;
}

  .pvbig { padding: 80px 0px; }
  .pvbottombig, #variations.pvbottombig { padding-bottom: 70px; }
  .pvtopbig { padding-top: 70px; }
  .pvmiddle { padding: 50px 0px; }
  .phbig, .slick-dots { padding-left: 50px; padding-right: 50px; }
  .layout__region > div.stretchself.phbig { width: calc(100% - 100px); height: calc(100% - 140px);  }
  .phbigl { padding-left: 50px; }
  .phbigr { padding-right: 50px; }
  .mhbigl { margin-left: 50px; }
  .mhbigr { margin-right: 50px; }

}

@media only screen and (min-width: 1025px)and (max-width: 1100px) {
  .flexpayment .mrightbig {
    margin-right: 12px;
  }
 }

@media only screen and (min-width: 1025px)and (max-width: 1150px) {
  .paragraph-id--5 .layout__region > div.stretchself.pvbig { padding-top: 40px; padding-bottom: 40px; height: calc(100% - 80px); }
}

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

    .pvbig { padding: 60px 0px; }
    .pvbottombig, #variations.pvbottombig { padding-bottom: 50px; }
    .pvtopbig { padding-top: 50px; }
    .pvmiddle { padding: 30px 0px; }
    .phbig, .slick-dots { padding-left: 30px; padding-right: 30px; }
    .layout__region > div.stretchself.phbig { width: calc(100% - 60px); height: calc(100% - 100px); }
    .phbigl { padding-left: 30px; }
    .phbigr { padding-right: 30px; }
    .mhbigl { margin-left: 30px; }
    .mhbigr { margin-right: 30px; }


    .pvsmall {
      padding-top: 20px;
      padding-bottom: 20px;
    }
    .bgcolorfourtopleiste.pvsmall { padding-top: 18px; padding-bottom: 18px; }
    .mainrow.pvsmall {
  padding-top: 29px;
  padding-bottom: 29px;
}

    .sticky-header .pvsmall {
      padding-top: 12px;
      padding-bottom: 12px;
    }

    .margsmall { margin: 5px; }
    .mbottomhalfbig { margin-bottom: 20px; }
    .mtophalfbig { margin-top: 20px; }
    .mtopbig { margin-top: 50px; }

    .mrightbig { margin-right: 50px; }

    .layout__region > div.stretchself { position: relative; }
    .layout__region > div.text-absolute.stretchself { position: absolute; }

  }

  @media only screen and (max-width: 800px) {
  .paragraph--type--image .phbig { padding-left: 0px; padding-right: 0px; }
}

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

    .pvbig { padding: 50px 0px; }
    .pvbottombig, #variations.pvbottombig { padding-bottom: 40px; }
    .pvtopbig { padding-top: 40px; }
    .pvmiddle { padding: 30px 0px; }
    .mtopbig { margin-top: 40px; }
    .phbig, .slick-dots { padding-left: 20px; padding-right: 20px; }
    .layout__region > div.stretchself.phbig { width: calc(100% - 40px); height: calc(100% - 80px); }
    .phbigl { padding-left: 20px; }
    .phbigr { padding-right: 20px; }
    .mhbigl { margin-left: 20px; }
    .mhbigr { margin-right: 20px; }

    .buttonpadding { padding: 18px 25px; }

    .mainrow.pvsmall { padding-top: 25px; padding-bottom: 25px; }

    .sticky-header .pvsmall {
      padding-top: 25px;
      padding-bottom: 25px;
    }

    .sticky-header .bgcolorfourtopleiste.pvsmall {
      padding-top: 18px;
      padding-bottom: 18px;
}

}

@media only screen and (min-width: 1024px) {
  .md-ml-l { margin-left: 3.75rem; }
  .md-ml-m { margin-left: 2.5rem; }
  .md-ml-s { margin-left: 1.25rem; }
}

@media only screen and (min-width: 768px) {
  .pt-8 { padding-top: 1rem; }
  .pb-8 { padding-bottom: 1rem; }

  .sm-p-0 { padding: 0px; }
  .sm-pl-m { padding-left: 20px; }
  .sm-pr-m { padding-right: 20px; }

  .sm-ml-40 { margin-left: 2.5rem; }
  .sm-ml-m { margin-left: 30px; }
  .sm-ml-l { margin-left: 3.75rem; }
  .sm-ml-20 { margin-left: 1.25rem; }
  .sm-mt-s { margin-top: 20px; }
  .sm-mt-0 { margin-top: 0px; }

  .sm-m-0 { margin: 0px; }
  .sm-pr-l { padding-right: 50px; }
  .sm-pl-l { padding-left: 50px; }
}

@media only screen and (min-width: 480px) {
.xs-pb-s { padding-bottom: 20px; }
.xs-pt-s { padding-top: 20px; }
.xs-pl-s { padding-left: 20px; }
.xs-pr-s { padding-right: 20px; }
}


.absolute-center {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%,-50%);
}

.translate-y-50 { transform: translateY(-50%); }
.translate-x-50 { transform: translateX(-50%); }

.fixed { position: fixed; }
.sticky { position: sticky; }

/* Tabelle */
table, caption, tbody, tfoot, thead, tr {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    width: 100%;
    vertical-align: baseline;
    background: transparent;
}


body {
position: relative;
width: 100%;
font-size: 100%;
-moz-osx-font-smoothing: grayscale;
-moz-font-feature-settings: "liga", "kern";
-webkit-font-smoothing: antialiased;
text-rendering: optimizelegibility;
-webkit-text-size-adjust: 100%;
overflow-x: hidden;
height: auto;
margin: 0px; padding: 0px;
}

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
}

a { color: inherit; }
a:hover {
  cursor: pointer;
}


/* CSS Code für hochauflösende Displays */
@media
  screen and (-webkit-min-device-pixel-ratio: 2),
  screen and (min-resolution: 192dpi),
  screen and (min-resolution: 2dppx) {
}


.smallicons img { width: 100px; margin-right: 30px; }

.page-body, .path-checkout #block-alex-theme-content { position: relative; width: 100%; padding-top: 150px; }

.page-node-1 .page-body { padding-top: 70px; }
main { position: relative; width: 100%; overflow: hidden; margin: 0px; padding: 0px; }

.viewsreference--view-title { display: none; }

b { font-weight: 500; }
small { font-size: 0.8em; }

h1, h2, h3, h4, h5 { font-weight: normal; margin: 0px; padding: 0px; }
h1 span { padding: 0px 8px; margin: 0px 0px; display: inline-block; width: auto; }



.flexbox-container.bottom-container {
  align-content: stretch; justify-content: flex-start; align-items:stretch;
}

/* Tabellen */
 table {
    border-collapse: collapse;
    border-radius: 0px;
    background: transparent;
    padding: 5px;
    width: 100%;
    margin: 30px 0px;
 }

 tr:last-child {
    border-bottom: medium none;
}
tr:first-child {
    border-top: medium none;
}
tr {
  font-weight: normal;
}

th.text-left {
    text-align: left;
}

th {
    background: none;
    color: #718A82;
    font-size: 0.8em;
font-weight: normal;
text-transform: uppercase;
    padding: 18px 12px 20px 0px;
    text-align: left;
    vertical-align: middle;
}

th a {
  color: #718A82;
}

td {
    font-size: 0.75em;
    padding: 12px 24px 12px 0px;
    text-align: left;
    text-shadow: none;
    vertical-align: middle;

}

td a {
   text-decoration: underline;
}

 /* Allgemeine Seitenelemente */

 #block-alex-theme-page-title, .view-popup, .tooltip-content { display: none; }

/* Klassen */
.link-absolute, .absolut { display: block; width: 100%; height: 100%; z-index: 2!important; top: 0px; left: 0px; position: absolute!important; border: none!important; }

.block { display: block; }
.inline-block { display: inline-block; }
.text-left { text-align: left; }
.text-center { text-align: center; }

/* Textfeld */
.textfeld{ padding: 60px 0px; }

.accordeon_content { display: none; }

.relative { position: relative; }

/* ANIMATIONEN */
/* Drehungen */
.rotate{ transition: all 0.3s; }
.rotate:hover img{ transform: rotate(2deg); }

/* fuer die Post-Animation */
.post { opacity:0; }
.post.animated {
  opacity:1;
}

.animated {
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInUp {
	0% {
		opacity: 0;
		-moz-transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInUp {
	0% {
		opacity: 0;
		-o-transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.animated.fadeInUp {
	-webkit-animation-name: fadeInUp;
	-moz-animation-name: fadeInUp;
	-o-animation-name: fadeInUp;
	animation-name: fadeInUp;
}




@media screen and (min-width: 1440px) {
 .xl-inline-block { display: inline-block; }
 .xl-block { display: block; }
}

@media screen and (min-width: 1024px) {
 .md-w-full { width: 100%; }
 .md-block { display: block; }
 .md-inline-block { display: inline-block; }
 .md-hidden { display: none; }
 .md-flex { display: flex; }
}

 @media screen and (min-width: 768px) {
  .sm-w-96 { 	width: 24rem; /* 384px */ }
  .sm-w-full { width: 100%; }
  .sm-w-auto { width: auto; }
  .sm-block { display: block; }
  .sm-inline-block { display: inline-block; }
  .sm-hidden { display: none; }
  .sm-flex { display: flex; }
  .sm-order-last { order: 99; }
}

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

   .xs-block { display: block; }
   .xs-hidden { display: none; }

   .form-container #edit-infos .fieldset-wrapper .js-form-type-datetime, .form-container #edit-infos .fieldset-wrapper .form-item-personen {
    display: block!important;
    width: 100%!important;
}

.xs-w-80 { width: 20rem; }
.xs-w-full { width: 100%; }
.xs-max-w-full { max-width: 100%; }

}


/*******************************************/
/*                                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-y-50px {
    grid-row-gap: 50px;
}

.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;
}

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

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, .md-grid-cols-2 { 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; }

}
