<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";
.content.frontpage {
  padding-top: 0;
}
.content.frontpage .solutionWorldWrapper {
  display: none;
}

/* Fix Solution World in other Languages
-------------------------------------------------------------------------------*/
/*.solutionWorldWrapper {
    display: none;

    &amp;.padding-top {
        padding-top: 38px;
    }

    &amp;.show {
        display: block;
    }
}*/
/* Replaces h1, where h1 is not optimal for SEO
-------------------------------------------------------------------------------*/
.top-heading, .small-heading {
  color: #0e3a63;
  font-size: 2.57em;
  text-transform: none;
  font-weight: 700;
  margin-bottom: 10px;
  line-height: 1.16em;
}
.top-heading.heading-with-margin, .small-heading.heading-with-margin {
  margin-bottom: 36px;
}

.top-heading.margin-bottom {
  margin-bottom: 50px;
}

.small-heading {
  font-size: 2.142em;
}

.sub-heading {
  color: #0e3a63;
  font-weight: 700;
  font-size: 1.4em;
  margin-bottom: 14px;
  text-transform: none;
  line-height: 1.2em;
}

.text-padding-right {
  padding-right: 16px;
}

/* Slider
-------------------------------------------------------------------------------*/
.slider {
  background-color: #e2e2e2;
  height: 474px;
}

.social-icons-container {
  background-color: #e2e2e2;
  padding: 50px;
  text-align: center;
}
.social-icons-container .social-icons-headline, .social-icons-container .social-icons-subheadline {
  font-weight: 300;
  color: #0e3a63;
  line-height: 1.17;
  font-size: 4em;
  display: inline-block;
  margin-bottom: 4px;
}
.social-icons-container .social-icons-headline {
  font-size: 2.571em;
  font-weight: 700;
}
.social-icons-container .social-icons-subheadline {
  font-size: 2.14em;
  margin-bottom: 64px;
}
.social-icons-container .social-icon {
  width: 60px;
  height: 60px;
  display: inline-block;
  background-color: #0e3a63;
  border-radius: 50%;
  margin-right: 42px;
  padding: 16px 0;
  text-align: center;
}
.social-icons-container .social-icon img {
  display: inline-block;
  height: 28px;
}
.social-icons-container .social-icon:last-child {
  margin-right: 0;
}

.slider-container {
  position: relative;
  margin-top: 118px;
  overflow: hidden;
}
.slider-container .grid-inner {
  position: relative;
}
.slider-container .grid-inner .search {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}

.stage-small, .stage, .stage-empty {
  margin-top: min(182px, 14.359vw);
  overflow: hidden;
}

.frontpage-slider {
  width: 100% !important;
  height: 474px !important;
  /*position: absolute;
  top: 0;
  left: 0;*/
}
.frontpage-slider &gt; .slide {
  display: none;
}

.gbox-slider, #focus-on-slider {
  width: 100% !important;
}
.gbox-slider &gt; .focus-on-slide, #focus-on-slider &gt; .focus-on-slide {
  display: none;
}

.rsDefault, .rsDefault .rsOverflow, .rsDefault .rsSlide, .rsDefault .rsVideoFrameHolder, .rsDefault .rsThumbs {
  background-color: #fff !important;
}

.rsGbox .rsArrow.rsArrowRight {
  right: -62px !important;
}

.rsGbox .rsBullets {
  bottom: -42px !important;
}

.rsGbox .rsArrow.rsArrowLeft {
  left: -62px !important;
}

.rsGbox .rsBullet span {
  background: rgba(0, 0, 0, 0.5) !important;
}

.rsGbox .rsBullet.rsNavSelected span {
  background: #0e3a63 !important;
}

.stage-new .rsImg, .slide .rsImg {
  position: absolute;
  top: 0;
  left: 0;
}
.stage-new .read-more, .slide .read-more {
  background-color: #0e3a63;
  color: #fff;
  display: block;
  padding: 4px 0 5px 30px;
  background-image: url("/fileadmin/templates/img/button-arrow.jpg");
  background-size: 30px;
  background-position: 0 0;
  background-repeat: no-repeat;
}
.stage-new .stage-text-box, .slide .stage-text-box {
  padding: 0;
  bottom: 45px;
}
.stage-new .stage-text-box .inner, .slide .stage-text-box .inner {
  padding: 18px 18px 7px 18px;
}

/* Quicknavigation
-------------------------------------------------------------------------------*/
.quick-navigation-container, .tab-navigation-container {
  background-color: #e2e2e2;
}
.quick-navigation-container .quick-navigation, .quick-navigation-container .tab-navigation, .tab-navigation-container .quick-navigation, .tab-navigation-container .tab-navigation {
  display: flex;
}
.quick-navigation-container .quick-navigation .item, .quick-navigation-container .tab-navigation .item, .tab-navigation-container .quick-navigation .item, .tab-navigation-container .tab-navigation .item {
  width: 16.6%;
  font-size: 1.428em;
  font-weight: 300;
  color: #0e3a63;
  line-height: 1em;
  cursor: pointer;
  text-align: center;
}
.quick-navigation-container .quick-navigation .item .icon, .quick-navigation-container .tab-navigation .item .icon, .tab-navigation-container .quick-navigation .item .icon, .tab-navigation-container .tab-navigation .item .icon {
  width: 100px;
  height: 100px;
  margin: 0 auto 32px;
  border-radius: 50%;
  background-color: transparent;
  border: 1px solid #0e3a63;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
}
.quick-navigation-container .quick-navigation .item .icon.focus, .quick-navigation-container .tab-navigation .item .icon.focus, .tab-navigation-container .quick-navigation .item .icon.focus, .tab-navigation-container .tab-navigation .item .icon.focus {
  background-image: url("/fileadmin/templates/img/focus.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.solutionworld, .quick-navigation-container .tab-navigation .item .icon.solutionworld, .tab-navigation-container .quick-navigation .item .icon.solutionworld, .tab-navigation-container .tab-navigation .item .icon.solutionworld {
  background-image: url("/fileadmin/templates/img/solutionworld.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.renovation-tool, .quick-navigation-container .tab-navigation .item .icon.renovation-tool, .tab-navigation-container .quick-navigation .item .icon.renovation-tool, .tab-navigation-container .tab-navigation .item .icon.renovation-tool {
  background-image: url("/fileadmin/templates/img/renovation_tool_new.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.merkliste, .quick-navigation-container .tab-navigation .item .icon.merkliste, .tab-navigation-container .quick-navigation .item .icon.merkliste, .tab-navigation-container .tab-navigation .item .icon.merkliste {
  background-image: url("/fileadmin/templates/img/merkliste.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.planungstool, .quick-navigation-container .tab-navigation .item .icon.planungstool, .tab-navigation-container .quick-navigation .item .icon.planungstool, .tab-navigation-container .tab-navigation .item .icon.planungstool {
  background-image: url("/fileadmin/templates/img/planungstool.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.bimtool, .quick-navigation-container .tab-navigation .item .icon.bimtool, .tab-navigation-container .quick-navigation .item .icon.bimtool, .tab-navigation-container .tab-navigation .item .icon.bimtool {
  background-image: url("/fileadmin/templates/img/bm-tool.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.find-us, .quick-navigation-container .tab-navigation .item .icon.find-us, .tab-navigation-container .quick-navigation .item .icon.find-us, .tab-navigation-container .tab-navigation .item .icon.find-us {
  background-image: url("/fileadmin/templates/img/map.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.support, .quick-navigation-container .tab-navigation .item .icon.support, .tab-navigation-container .quick-navigation .item .icon.support, .tab-navigation-container .tab-navigation .item .icon.support {
  background-image: url("/fileadmin/templates/img/support_member.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.sales-map, .quick-navigation-container .tab-navigation .item .icon.sales-map, .tab-navigation-container .quick-navigation .item .icon.sales-map, .tab-navigation-container .tab-navigation .item .icon.sales-map {
  background-image: url("/fileadmin/templates/img/sales_map.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item .icon.catalogue, .quick-navigation-container .tab-navigation .item .icon.catalogue, .tab-navigation-container .quick-navigation .item .icon.catalogue, .tab-navigation-container .tab-navigation .item .icon.catalogue {
  background-image: url("/fileadmin/templates/img/catalogue_new.svg");
  background-size: 43px 45px;
}
.quick-navigation-container .quick-navigation .item:hover, .quick-navigation-container .quick-navigation .item.active, .quick-navigation-container .tab-navigation .item:hover, .quick-navigation-container .tab-navigation .item.active, .tab-navigation-container .quick-navigation .item:hover, .tab-navigation-container .quick-navigation .item.active, .tab-navigation-container .tab-navigation .item:hover, .tab-navigation-container .tab-navigation .item.active {
  text-decoration: underline;
}
.quick-navigation-container .quick-navigation .item:hover .icon, .quick-navigation-container .quick-navigation .item.active .icon, .quick-navigation-container .tab-navigation .item:hover .icon, .quick-navigation-container .tab-navigation .item.active .icon, .tab-navigation-container .quick-navigation .item:hover .icon, .tab-navigation-container .quick-navigation .item.active .icon, .tab-navigation-container .tab-navigation .item:hover .icon, .tab-navigation-container .tab-navigation .item.active .icon {
  background-color: #fff;
}
.quick-navigation-container .quick-navigation-mobile, .quick-navigation-container .tab-navigation-mobile, .tab-navigation-container .quick-navigation-mobile, .tab-navigation-container .tab-navigation-mobile {
  display: none;
  text-align: center;
}
.quick-navigation-container .quick-navigation-mobile select, .quick-navigation-container .tab-navigation-mobile select, .tab-navigation-container .quick-navigation-mobile select, .tab-navigation-container .tab-navigation-mobile select {
  font-size: 1.3em;
}
.quick-navigation-container .quick-navigation-mobile label, .quick-navigation-container .tab-navigation-mobile label, .tab-navigation-container .quick-navigation-mobile label, .tab-navigation-container .tab-navigation-mobile label {
  display: block;
}
.quick-navigation-container .grid-inner, .tab-navigation-container .grid-inner {
  position: relative;
  padding: 50px 0;
}
.quick-navigation-container &gt; .grid-inner:after, .tab-navigation-container &gt; .grid-inner:after {
  content: " ";
  width: 0;
  height: 0;
  -webkit-transform: rotate(360deg);
  border-style: solid;
  border-width: 22px 26px 0 26px;
  border-color: #e2e2e2 transparent transparent transparent;
  position: absolute;
  bottom: -22px;
  margin-left: -26px;
  z-index: 2;
}
.quick-navigation-container &gt; .grid-inner.first:after, .tab-navigation-container &gt; .grid-inner.first:after {
  left: 8.3%;
}
.quick-navigation-container &gt; .grid-inner.second:after, .tab-navigation-container &gt; .grid-inner.second:after {
  left: 25%;
}
.quick-navigation-container &gt; .grid-inner.third:after, .tab-navigation-container &gt; .grid-inner.third:after {
  left: 41.67%;
}
.quick-navigation-container &gt; .grid-inner.fourth:after, .tab-navigation-container &gt; .grid-inner.fourth:after {
  left: 58.27%;
}
.quick-navigation-container &gt; .grid-inner.fifth:after, .tab-navigation-container &gt; .grid-inner.fifth:after {
  left: 75%;
}
.quick-navigation-container &gt; .grid-inner.sixth:after, .tab-navigation-container &gt; .grid-inner.sixth:after {
  left: 91.67%;
}
.quick-navigation-container .content-container .tab-content, .tab-navigation-container .content-container .tab-content {
  display: none;
  background-color: #fff;
  position: relative;
}
.quick-navigation-container .content-container .tab-content.active, .tab-navigation-container .content-container .tab-content.active {
  display: block;
}
.quick-navigation-container .content-container .grid-inner, .tab-navigation-container .content-container .grid-inner {
  padding: 0;
}
.quick-navigation-container .content-container .text-container, .quick-navigation-container .content-container .image-container, .tab-navigation-container .content-container .text-container, .tab-navigation-container .content-container .image-container {
  width: 50%;
}
.quick-navigation-container .content-container .text-container, .tab-navigation-container .content-container .text-container {
  padding: 74px 90px 106px 0;
}
.quick-navigation-container .content-container .text-container .top-heading, .tab-navigation-container .content-container .text-container .top-heading {
  margin-bottom: 24px;
}
.quick-navigation-container .content-container .text-container p, .tab-navigation-container .content-container .text-container p {
  line-height: 1.57em;
  margin-bottom: 1.5em;
}
.quick-navigation-container .content-container .text-container p.margin-bottom-double, .tab-navigation-container .content-container .text-container p.margin-bottom-double {
  margin-bottom: 4.5em;
}
.quick-navigation-container .content-container .text-container .focus-on-text, .tab-navigation-container .content-container .text-container .focus-on-text {
  margin-bottom: 1.5em;
}
.quick-navigation-container .content-container .text-container .focus-on-text div, .tab-navigation-container .content-container .text-container .focus-on-text div {
  line-height: 1.57em;
}
.quick-navigation-container .content-container .image-container, .tab-navigation-container .content-container .image-container {
  width: 50%;
  left: 50%;
  position: absolute;
  top: 0;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: cover;
  height: 100%;
}
.quick-navigation-container .content-container .image-container .normal-image, .tab-navigation-container .content-container .image-container .normal-image {
  display: none;
}
.quick-navigation-container .content-container .image-container .big-icon, .tab-navigation-container .content-container .image-container .big-icon {
  width: 130px;
  max-width: 130px;
  margin-top: 154px;
  margin-left: 64px;
}
.quick-navigation-container .content-container .text-container.big, .tab-navigation-container .content-container .text-container.big {
  width: 70%;
}
.quick-navigation-container .content-container .text-container.big .video-container, .tab-navigation-container .content-container .text-container.big .video-container {
  position: relative;
}
.quick-navigation-container .content-container .text-container.big video, .tab-navigation-container .content-container .text-container.big video {
  width: 100%;
  margin: 24px 0;
}
.quick-navigation-container .content-container .text-container.big .video-play, .tab-navigation-container .content-container .text-container.big .video-play {
  position: absolute;
  width: 60px;
  height: 60px;
  margin-top: -30px;
  margin-left: -30px;
  left: 50%;
  top: 50%;
  background-image: url("../img/video-play.jpg");
  background-repeat: no-repeat;
  background-size: 100%;
  pointer-events: none;
}
.quick-navigation-container .content-container .image-container.small, .tab-navigation-container .content-container .image-container.small {
  width: 30%;
  left: 70%;
}
.quick-navigation-container .content-container .solutionWorldWrapper, .tab-navigation-container .content-container .solutionWorldWrapper {
  margin-top: 0;
  margin-bottom: 0;
  padding: 83px 0 83px;
}
.quick-navigation-container .single-content-container, .tab-navigation-container .single-content-container {
  padding: 74px 0 106px 0;
}
.quick-navigation-container .single-content-container .top-heading, .tab-navigation-container .single-content-container .top-heading {
  margin-bottom: 24px;
}
.quick-navigation-container .tool-ribbon, .tab-navigation-container .tool-ribbon {
  background-color: #e2e2e2;
  padding: 48px 0 60px;
  margin: 20px 0 80px;
}
.quick-navigation-container .tool-ribbon .grid-inner, .tab-navigation-container .tool-ribbon .grid-inner {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.quick-navigation-container .tool-ribbon .icon-box, .tab-navigation-container .tool-ribbon .icon-box {
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0 5.5px 13.5px 0 rgba(0, 0, 0, 0.25);
  text-align: center;
  width: 20%;
  margin-right: 3%;
  padding: 20px 8px 16px;
  display: flex;
  flex-wrap: wrap;
  cursor: pointer;
}
.quick-navigation-container .tool-ribbon .icon-box:hover, .tab-navigation-container .tool-ribbon .icon-box:hover {
  text-decoration: none;
  background-color: #0e3a63;
  color: #fff;
}
.quick-navigation-container .tool-ribbon .icon-box:hover path, .tab-navigation-container .tool-ribbon .icon-box:hover path {
  fill: #fff;
}
.quick-navigation-container .tool-ribbon .icon-box .icon, .tab-navigation-container .tool-ribbon .icon-box .icon {
  display: block;
  margin: 0 auto;
}
.quick-navigation-container .tool-ribbon .icon-box .text, .tab-navigation-container .tool-ribbon .icon-box .text {
  margin-top: 15px;
  flex: 0 0 100%;
  align-self: flex-end;
}
.quick-navigation-container .example-image-container, .tab-navigation-container .example-image-container {
  display: flex;
  align-items: center;
}

/* Neuster Event/Messe
-------------------------------------------------------------------------------*/
.newest-event-container {
  /*padding: 70px 0 90px;*/
}
.newest-event-container .top-heading {
  margin-bottom: 48px;
}
.newest-event-container .events {
  border-top: 1px solid #0e3a63;
  border-bottom: 1px solid #0e3a63;
  margin-bottom: 40px;
  padding: 36px 0;
}
.newest-event-container .events .event.newest .event-title, .newest-event-container .events .event.newest .event-location, .newest-event-container .events .event.newest .event-date {
  font-size: 1.5em;
}
.newest-event-container a .icon-link-text {
  color: #0e3a63;
}

/* Vier Kästen
-------------------------------------------------------------------------------*/
.four-boxes {
  padding: 70px 0;
}
.four-boxes .single-box .box-image {
  display: block;
  margin-bottom: 16px;
  display: block;
  background-size: cover;
  background-position: center;
  height: 210px;
}
.four-boxes .single-box .box-date {
  color: #6e6e6e;
}

.special-dealer-box .box-image {
  display: block;
  margin-bottom: 16px;
}
.special-dealer-box input[type=text] {
  width: 54%;
  display: inline-block;
  background: #e2e2e2;
  padding: 8px 20px 10px;
  font-size: 1.428em;
  border: 0;
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
}
.special-dealer-box input[type=text]::placeholder {
  color: #6e6e6e;
  font-family: "Open Sans", sans-serif;
}
.special-dealer-box input[type=submit] {
  width: 46%;
  display: inline-block;
  padding: 9px 12px;
}

/* Referenzen
-------------------------------------------------------------------------------*/
.references-container {
  padding: 52px 0 52px;
}

.top-heading.references {
  margin-bottom: 50px;
}

.references .icon-link-text {
  color: #0e3a63;
}

.grid-sizer,
.grid-item {
  /*width: calc(25% - 3px);*/
  width: 25%;
  display: block;
  position: relative;
}
.grid-sizer img,
.grid-item img {
  width: 100%;
  display: block;
}

.packery.references {
  margin-bottom: 40px;
}
.packery.references .grid-sizer,
.packery.references .grid-item {
  width: 25%;
  display: block;
  position: relative;
}
.packery.references .grid-sizer img,
.packery.references .grid-item img {
  width: 100%;
  display: block;
}
.packery.references .grid-item {
  margin-bottom: 0;
}
.packery.references .gutter-sizer {
  width: 0;
}
.packery.references .grid-item {
  height: 225px;
}
.packery.references .grid-item .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #fff;
  background-color: rgba(14, 58, 99, 0.8);
  display: none;
  padding: 15px;
}
.packery.references .grid-item .overlay .date {
  font-size: 1em;
  font-weight: 400;
}
.packery.references .grid-item .overlay h4 {
  color: #fff;
  text-transform: none;
  font-size: 1.428em;
  font-weight: 600;
  line-height: 1.15em;
  margin-bottom: 14px;
}
.packery.references .grid-item .overlay .preview-text h2 {
  font-size: 1em;
  font-weight: normal;
  margin-bottom: 0;
}
.packery.references .grid-item .overlay .preview-text h3 {
  font-size: 1em;
  font-weight: normal;
  margin-bottom: 0;
  color: #fff;
}
.packery.references .grid-item .overlay .preview-text p {
  margin-bottom: 0;
}
.packery.references .grid-item:hover .overlay {
  display: block;
}
.packery.references .grid-item-width2 { /*width: calc(50% - 3px);*/
  width: 50%;
}
.packery.references .grid-item-height2 {
  height: 450px;
}

/* Radon Seite
-------------------------------------------------------------------------------*/
.animated-numbers {
  font-size: 4.5em;
  line-height: 1.1em;
  margin-bottom: 36px;
}
.animated-numbers .unit {
  font-size: 0.5em;
}

/* GBox-Page
-------------------------------------------------------------------------------*/
.slide-heading {
  font-weight: bold;
  color: #0e3a63;
  margin-bottom: 16px;
  display: inline-block;
  font-size: 1.2em;
}

ul.advantages-list li {
  margin-bottom: 1em;
}

.gbox-possibilities-image {
  margin-bottom: 12px;
}

.gbox-schnitt {
  padding-top: 140px;
  padding-bottom: 80px;
  text-align: center;
  position: relative;
}
.gbox-schnitt .gbox-schnitt-info {
  position: absolute;
  color: #0e3a63;
  width: 190px;
  font-family: "Indie Flower", sans-serif;
  font-size: 1.45em;
  line-height: 1.1em;
}
.gbox-schnitt .gbox-schnitt-line {
  position: absolute;
}
.gbox-schnitt #gbox-schnitt-info-1 {
  top: 0;
  left: 44%;
}
.gbox-schnitt #gbox-schnitt-info-1-line {
  top: 16%;
  left: 52%;
}
.gbox-schnitt #gbox-schnitt-info-2 {
  top: 24%;
  left: 24%;
}
.gbox-schnitt #gbox-schnitt-info-2-line {
  top: 28%;
  left: 40%;
}
.gbox-schnitt #gbox-schnitt-info-3 {
  top: 31%;
  right: 14%;
}
.gbox-schnitt #gbox-schnitt-info-3-line {
  top: 40.5%;
  right: 29%;
}
.gbox-schnitt #gbox-schnitt-info-4 {
  top: 47%;
  left: 17%;
}
.gbox-schnitt #gbox-schnitt-info-4-line {
  top: 51%;
  left: 32%;
}
.gbox-schnitt #gbox-schnitt-info-5 {
  top: 52%;
  right: 19%;
}
.gbox-schnitt #gbox-schnitt-info-5-line {
  top: 59%;
  right: 35.5%;
}
.gbox-schnitt #gbox-schnitt-info-6 {
  top: 66%;
  left: 20%;
}
.gbox-schnitt #gbox-schnitt-info-6-line {
  top: 69%;
  left: 37%;
}
.gbox-schnitt #gbox-schnitt-info-7 {
  top: 67%;
  right: 17%;
}
.gbox-schnitt #gbox-schnitt-info-7-line {
  top: 66%;
  right: 32%;
}
.gbox-schnitt #gbox-schnitt-info-8 {
  top: 93%;
  left: 24%;
}
.gbox-schnitt #gbox-schnitt-info-8-line {
  top: 87%;
  left: 38%;
}
.gbox-schnitt #gbox-schnitt-info-9 {
  top: 88%;
  right: 19%;
}
.gbox-schnitt #gbox-schnitt-info-10 {
  top: 88%;
  right: 19%;
  top: 100%;
  left: 0;
  display: none;
}
.gbox-schnitt .info-list {
  display: none;
  color: #0e3a63;
  font-family: "Indie Flower", sans-serif;
  font-size: 1.25em;
  line-height: 1.1em;
}
.gbox-schnitt .info-list .col4 {
  text-align: center;
}
.gbox-schnitt .info-list .gbox-image-responsive {
  max-height: 260px;
}

/* YouTube Playlist
-------------------------------------------------------------------------------*/
.youtube-playlist {
  display: flex;
  flex-wrap: wrap;
}
.youtube-playlist .video-item {
  width: 31%;
  margin-right: 3%;
  margin-bottom: 24px;
}
.youtube-playlist .video-item:nth-child(3n) {
  margin-right: 0;
}
.youtube-playlist .video-item .video-thumbnail {
  display: block;
  cursor: pointer;
  position: relative;
}
.youtube-playlist .video-item .video-thumbnail .video-play {
  position: absolute;
  width: 60px;
  height: 60px;
  margin-top: -30px;
  margin-left: -30px;
  left: 50%;
  top: 50%;
  background-image: url("../img/video-play.jpg");
  background-repeat: no-repeat;
  background-size: 100%;
}
.youtube-playlist .video-item .video-thumbnail:hover {
  opacity: 0.8;
}
.youtube-playlist .video-item .video-date {
  color: #6e6e6e;
  font-size: 0.9em;
}
.youtube-playlist .video-item .video-title {
  font-weight: 700;
  color: #0e3a63;
}

/* Reference Overview Tiles
-------------------------------------------------------------------------------*/
.reference-tile-overview {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.reference-tile-overview .reference-tile {
  height: 350px;
  width: 31.3%;
  margin-bottom: 80px;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
}
.reference-tile-overview .reference-tile .background-blur {
  background: rgba(255, 255, 255, 0.61);
  backdrop-filter: blur(13px);
  padding: 14px 28px;
  position: absolute;
  bottom: 0;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.reference-tile-overview .reference-tile .over-heading, .reference-tile-overview .reference-tile .to-article-link {
  font-size: 0.875em;
  width: 100%;
  color: #0e3a63;
}
.reference-tile-overview .reference-tile h3 {
  line-height: 1.38;
  font-size: 1em;
  font-weight: 700;
  width: 100%;
  margin-bottom: 8px;
}
.reference-tile-overview .reference-tile .to-article-link {
  text-align: right;
  align-self: flex-end;
}
.reference-tile-overview .reference-tile .to-article-link .arrow-right-to-article {
  height: 10px;
  padding-right: 7px;
  vertical-align: middle;
  margin-top: -2px;
}

/* Reference details
-------------------------------------------------------------------------------*/
.reference-details .reference-main-image {
  position: relative;
  margin-bottom: 52px;
}
.reference-details .reference-main-image &gt; img {
  display: block;
}
.reference-details .reference-main-image .location {
  position: absolute;
  left: 0;
  top: 40%;
  transform: translate(0, -50%);
  background-color: rgba(255, 255, 255, 0.84);
  padding: 8px;
  font-weight: 600;
  color: #0e3a63;
}
.reference-details .reference-main-image .location-indicator {
  vertical-align: middle;
  margin-right: 12px;
}
.reference-details .content-blocks {
  margin-bottom: 82px;
}
.reference-details .content-blocks h3 {
  font-size: 2.14em;
  font-weight: 700;
  line-height: 1;
  color: #0e3a63;
}
.reference-details .content-blocks .text-image h3 {
  font-size: 1.42em;
  margin-bottom: 32px;
  font-weight: 700;
  line-height: 1;
  color: #0e3a63;
}
.reference-details .attachments {
  width: 32%;
  padding: 30px;
  background-color: #0e3a63;
}
.reference-details .attachments .headline {
  color: #fff;
  font-weight: 700;
  line-height: 1;
  font-size: 1.42em;
}
.reference-details .attachments ul.link-list {
  list-style-type: none;
  margin-left: 0;
}
.reference-details .attachments ul.link-list li, .reference-details .attachments ul.link-list li a {
  color: #fff;
  white-space: nowrap;
}
.reference-details .attachments .download-icon {
  margin-left: 8px;
  vertical-align: middle;
}
.reference-details .linked-products .headline {
  font-size: 2.14em;
  font-weight: 700;
  line-height: 1;
  color: #0e3a63;
  margin-bottom: 48px;
}
.reference-details .facts-table-container {
  margin-bottom: 82px;
}
.reference-details .facts-table-container .facts-table {
  width: 100%;
}
.reference-details .facts-table-container .facts-table th {
  background-color: #0e3a63;
  color: #fff;
  font-weight: 700;
  font-size: 1.42em;
  padding: 8px;
  border: 1px solid #0e3a63;
  text-align: left;
}
.reference-details .facts-table-container .facts-table td {
  border: 1px solid #757679;
  padding: 8px;
}
.reference-details .facts-table-container .facts-table td:first-child {
  border-left: 0;
}
.reference-details .facts-table-container .facts-table td:last-child {
  border-right: 0;
}
.reference-details .facts-table-container .facts-table tr.even td {
  background-color: #e6e7e9;
}

/* Call to actions
-------------------------------------------------------------------------------*/
.call-to-actions {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  z-index: 36;
}
.call-to-actions .email, .call-to-actions .phone, .call-to-actions .download, .call-to-actions .login, .call-to-actions .searchicon {
  display: block;
  width: 60px;
  height: 60px;
  background-color: #0e3a63;
  margin-bottom: 10px;
  background-image: url("../img/quick-navigation/email.svg");
  background-size: 76%;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}
.call-to-actions .email:hover, .call-to-actions .phone:hover, .call-to-actions .download:hover, .call-to-actions .login:hover, .call-to-actions .searchicon:hover {
  opacity: 0.8;
}
.call-to-actions .download {
  background-image: url("../img/quick-navigation/download.svg");
}
.call-to-actions .phone {
  background-image: url("../img/quick-navigation/phone.svg");
}
.call-to-actions .login {
  background-image: url("../img/quick-navigation/login.svg");
}
.call-to-actions .searchicon {
  background-image: url("../img/quick-navigation/search.svg");
}

/* Service Bar
-------------------------------------------------------------------------------*/
.service-bar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 30px;
  background-color: #e2e2e2;
}
.service-bar ul {
  text-align: left;
  list-style-type: none;
  margin-left: 11.49vw;
}
.service-bar ul li {
  display: inline-block;
}
.service-bar ul li a {
  padding: 3px 0 5px;
  display: block;
  margin-right: 36px;
  font-size: 1em;
  font-weight: 300;
  color: #6e6e6e;
}

@media screen and (min-width: 1220px) {
  .service-bar ul {
    margin-left: 180px;
  }
}
.header-wrapper {
  padding-top: 30px;
  transition: 150ms all ease-in-out;
}
.header-wrapper .header {
  z-index: 2;
  position: relative;
}
.header-wrapper.header-sticky {
  padding-top: 0;
}

/* New Hamburger Menu
-------------------------------------------------------------------------------*/
.hamburger {
  padding: 0;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  overflow: visible;
  align-self: center;
  /*.is-active:hover {
      opacity: 0.7;
  }*/
}
.hamburger .is-active .hamburger-inner,
.hamburger .is-active .hamburger-inner::before,
.hamburger .is-active .hamburger-inner::after {
  background-color: #fff;
}

/*.hamburger:hover {
    opacity: 0.7;
}*/
.hamburger-box {
  width: 30px;
  height: 20px;
  display: inline-block;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 30px;
  height: 4px;
  background-color: #0e3a63;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before, .hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -10px;
}

.hamburger-inner::after {
  bottom: -10px;
}

/* Burger animation */
.hamburger--3dx .hamburger-box {
  perspective: 80px;
}

.hamburger--3dx .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx .hamburger-inner::before, .hamburger--3dx .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx.is-active .hamburger-inner {
  background-color: transparent !important;
  box-shadow: none;
  transform: rotateY(180deg);
}

.hamburger--3dx.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
  box-shadow: none;
}

.hamburger--3dx.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
  box-shadow: none;
}

/* Verbände
-------------------------------------------------------------------------------*/
.associations {
  padding: 86px 0;
  border-bottom: 1px solid #D3D3D3;
}
.associations .association img {
  width: auto;
  height: 96px;
  filter: grayscale(100%);
  opacity: 0.7;
  transition: filter 0.1s ease;
}
.associations .association img.galabau-logo {
  opacity: 1;
}
.associations .association img:hover {
  filter: none;
  opacity: 1;
}

.pre-footer.with-associations {
  padding-top: 44px;
}

/* Media Queries
-------------------------------------------------------------------------------*/
@media screen and (max-width: 1220px) {
  .slider-container .slide .stage-inner .stage-text-box {
    right: 16px;
  }
  .four-boxes .single-box .box-image {
    height: 170px;
  }
  .gbox-schnitt {
    text-align: left;
    padding-top: 0;
    padding-bottom: 0;
  }
  .gbox-schnitt .gbox-schnitt-line, .gbox-schnitt .gbox-schnitt-info {
    display: none;
  }
  .gbox-schnitt .gbox-image {
    display: none;
  }
  .gbox-schnitt .info-list {
    display: block;
  }
  .rsGbox .rsArrow.rsArrowRight {
    right: 12px !important;
  }
  .rsGbox .rsArrow.rsArrowLeft {
    left: 12px !important;
  }
}
@media screen and (max-width: 1024px) {
  .stage, .stage-inner {
    height: 420px;
  }
  .quick-navigation-container .grid-inner, .tab-navigation-container .grid-inner {
    padding: 24px 0;
  }
  .quick-navigation-container .quick-navigation .item .icon, .tab-navigation-container .tab-navigation .item .icon {
    width: 60px;
    height: 60px;
    background-size: 32px 33px !important;
    margin: 0 auto 18px;
  }
  .quick-navigation-container .content-container .text-container, .tab-navigation-container .content-container .text-container {
    padding: 74px 52px 106px 36px;
  }
}
@media screen and (max-width: 1006px) {
  .slider-container {
    margin-top: 0;
  }
  .frontpage-slider {
    height: 370px !important;
  }
  .four-boxes .single-box .box-image {
    height: 120px;
  }
  .quick-navigation-container .content-container .image-container .big-icon {
    width: 84px;
    margin-top: 138px;
    margin-left: 0;
  }
  .reference-tile-overview .reference-tile {
    width: 48.5%;
  }
  .call-to-actions .email, .call-to-actions .phone {
    width: 60px;
    height: 60px;
  }
  .stage-small, .stage, .stage-empty {
    margin-top: 0;
  }
  .slider-container .slide .stage-inner .stage-text-box {
    bottom: auto;
    top: 50%;
    transform: translate(0, -50%);
    right: 36px;
  }
  .service-bar ul {
    margin-left: 13.225vw;
  }
  .service-bar ul li a {
    padding: 7px 0 7px;
  }
  .associations {
    padding: 64px 0;
    border-bottom: 1px solid #D3D3D3;
  }
  .associations .association img {
    height: 72px;
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .packery.references .grid-sizer,
  .packery.references .grid-item {
    width: 50%;
  }
  .packery.references .grid-item-width2 {
    width: 100%;
  }
  .quick-navigation-container .tool-ribbon .grid-inner, .tab-navigation-container .tool-ribbon .grid-inner {
    justify-content: center;
  }
  .quick-navigation-container .tool-ribbon .grid-inner .icon-box, .tab-navigation-container .tool-ribbon .grid-inner .icon-box {
    width: 45.5%;
    margin-bottom: 24px;
  }
  .quick-navigation-container .tool-ribbon .example-image-container .arrow, .tab-navigation-container .tool-ribbon .example-image-container .arrow {
    max-height: 133px;
  }
}
@media screen and (max-width: 720px) {
  .quick-navigation-container .quick-navigation, .tab-navigation-container .tab-navigation {
    display: none;
  }
  .quick-navigation-container .quick-navigation-mobile, .tab-navigation-container .tab-navigation-mobile {
    display: block;
  }
  .quick-navigation-container &gt; .grid-inner.first:after, .quick-navigation-container &gt; .grid-inner.second:after, .quick-navigation-container &gt; .grid-inner.third:after, .quick-navigation-container &gt; .grid-inner.fourth:after, .quick-navigation-container &gt; .grid-inner.fifth:after, .quick-navigation-container &gt; .grid-inner.sixth:after, .tab-navigation-container &gt; .grid-inner.first:after, .tab-navigation-container &gt; .grid-inner.second:after, .tab-navigation-container &gt; .grid-inner.third:after, .tab-navigation-container &gt; .grid-inner.fourth:after, .tab-navigation-container &gt; .grid-inner.fifth:after, .tab-navigation-container &gt; .grid-inner.sixth:after {
    left: 50%;
  }
  .quick-navigation-container #content-second.solution-world {
    padding-top: 84px;
  }
  .social-icons-container .social-icon {
    width: 40px;
    height: 40px;
    margin-right: 24px;
    padding-top: 11px;
  }
  .social-icons-container .social-icon img {
    height: 20px;
  }
  .slider-container .slide .stage-inner .stage-text-box {
    right: auto;
  }
  .quick-navigation-container .content-container .text-container, .quick-navigation-container .content-container .image-container {
    width: 100%;
  }
  .quick-navigation-container .content-container .text-container {
    padding: 74px 0 36px 0;
  }
  .quick-navigation-container .content-container .image-container {
    position: static;
    background: none;
  }
  .quick-navigation-container .content-container .image-container .normal-image, .quick-navigation-container .content-container .image-container .backstretch-image {
    display: block;
    position: static;
  }
  .quick-navigation-container .content-container #content-third .image-container, .quick-navigation-container .content-container #content-fifth .image-container {
    display: none;
  }
  #focus-on-slider.rsDefault .rsArrowIcn {
    bottom: 5%;
    top: auto;
  }
  .call-to-actions .email, .call-to-actions .phone, .call-to-actions .download, .call-to-actions .searchicon {
    width: 36px;
    height: 36px;
  }
}
@media screen and (max-width: 620px) {
  .frontpage-slider {
    height: 270px !important;
  }
  .top-heading, .social-icons-container .social-icons-headline {
    font-size: 2.8em;
  }
  .social-icons-container .social-icons-subheadline {
    font-size: 1.8em;
    margin-bottom: 48px;
  }
  .slider-container .slide .stage-inner .stage-text-box {
    width: 84%;
    left: 50%;
    transform: translate(-50%, 0);
    top: 24px;
    bottom: auto;
  }
  .slider-container .slide .stage-inner .stage-text-box .inner {
    max-height: 190px;
    overflow: hidden;
  }
  .quick-navigation-container .content-container .grid-inner, .tab-navigation-container .content-container .grid-inner {
    padding: 0 16px;
  }
  .tab-navigation-container h1 {
    font-size: 2.2em;
    padding: 0 16px;
  }
  .newest-event-container, .four-boxes {
    padding-left: 16px;
    padding-right: 16px;
  }
  .four-boxes .single-box {
    margin-bottom: 24px !important;
  }
  .four-boxes .single-box .box-image {
    height: 170px;
  }
  .gbox-schnitt .col8 {
    margin-top: 32px;
  }
  .rsGbox .rsArrow.rsArrowRight .rsArrowIcn {
    top: 48px !important;
  }
  .rsGbox .rsArrow.rsArrowLeft .rsArrowIcn {
    top: 48px !important;
  }
  .reference-tile-overview .reference-tile {
    width: 100%;
    margin-bottom: 54px;
  }
  .reference-details .attachments {
    width: 100%;
    float: none;
    margin-bottom: 64px;
    padding: 16px;
  }
  .reference-details h2 {
    margin-bottom: 32px;
  }
  .reference-details .col8.margin-bottom-double {
    margin-bottom: 32px;
  }
  .reference-details .content-blocks h3 {
    margin-bottom: 0;
  }
  .reference-details .content-blocks .text-image h3 {
    margin-top: 12px;
  }
  .call-to-actions {
    top: 60%;
  }
  .header-wrapper {
    padding-top: 0;
  }
  .header-wrapper .service-bar {
    display: none;
  }
  .contact-part {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .contact-part .contact-image {
    width: 66%;
    margin-bottom: 24px;
  }
  .contact-part .contact-image img {
    height: auto;
    object-fit: cover;
    width: auto;
  }
  .contact-part .contact-data {
    margin-left: 0;
    width: 100%;
  }
  .associations {
    padding: 38px 16px;
  }
  .associations .association img {
    width: auto;
    height: 54px;
  }
}
@media screen and (max-width: 480px) {
  .social-icons-container {
    padding: 50px 25px;
  }
  .social-icons-container .social-icon {
    margin-right: 12px;
  }
  .associations .association img {
    width: auto;
    height: 44px;
  }
}
@media screen and (max-width: 320px) {
  .contact-part .contact-image {
    width: 100%;
  }
}
/* Target audience
-------------------------------------------------------------------------------*/
#target-audience-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2000;
  background: rgba(255, 255, 255, 0.85);
  flex-wrap: wrap;
  align-items: center;
  overflow: hidden;
}
#target-audience-overlay #target-audience-inner {
  position: relative;
  margin: 0 auto;
  border: 1px solid #e2e2e2;
  padding: 30px 40px;
  background: #efefef;
  box-shadow: 0 10px 14px rgba(0, 0, 0, 0.2);
}
#target-audience-overlay #target-audience-inner h3 {
  margin-bottom: 12px;
}
#target-audience-overlay #target-audience-inner h4 {
  color: #737373;
  font-weight: 400;
  font-size: 1.2rem;
}
#target-audience-overlay #target-audience-inner .target-audience-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#target-audience-overlay #target-audience-inner .target-audience-title .target-audience-title-icon {
  margin-left: 30px;
}
#target-audience-overlay #target-audience-inner .target-audience-title svg {
  height: 35px;
}
#target-audience-overlay #target-audience-inner .target-audience-title:hover {
  cursor: pointer;
}
#target-audience-overlay #target-audience-inner .target-audience-lower {
  display: flex;
  justify-content: space-between;
}
#target-audience-overlay #target-audience-inner .target-audience-lower .target-audience-lower-button {
  align-self: flex-end;
}
#target-audience-overlay .target-audience-lower-button button {
  display: inline-block;
  padding: 12px 36px 12px 36px;
  background: #d8d8d8;
  border: none;
  position: relative;
  font-weight: 400;
  font-size: 0.8em;
  text-align: center;
  margin: 0 12px 12px 0;
}
#target-audience-overlay .target-audience-lower-button button:hover {
  background: #c4c4c4;
  cursor: pointer;
}
#target-audience-overlay .target-audience-box-container {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
#target-audience-overlay .target-audience-box {
  width: 10rem;
  height: 6rem;
  margin: 0.75rem 0.75rem 0.75rem 0;
  padding: 0.5rem;
  background: #fff;
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
  line-height: 0.9em;
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-direction: column;
}
#target-audience-overlay .target-audience-box:hover {
  background-color: #0e3a63;
  cursor: pointer;
  color: #fff;
}
#target-audience-overlay .target-audience-box svg {
  height: 50%;
}
#target-audience-overlay .target-audience-box h5 {
  margin: 10px 0 0 0;
  font-size: 0.8rem;
  text-align: center;
}
@media screen and (max-width: 620px) {
  #target-audience-overlay .target-audience-box {
    width: 7rem;
    height: 4.2rem;
    margin: 0.5rem 0.5rem 0.5rem 0;
    padding: 0.3rem;
  }
  #target-audience-overlay .target-audience-box h5 {
    font-size: 0.7rem;
  }
}
@media screen and (max-width: 480px) {
  #target-audience-overlay .target-audience-box {
    width: 5.5rem;
    height: 3.3rem;
    margin: 0.25rem 0.25rem 0.25rem 0;
    padding: 0.15rem;
  }
  #target-audience-overlay .target-audience-box h5 {
    margin: 1px 0 0 0;
    font-size: 0.5rem;
  }
}

/*# sourceMappingURL=frontpage.css.map */
</pre></body></html>