/* Premium Projektlayout UIkit v2 */

:root {
  --gl-bg: #f8f5f1;
  --gl-card: #fffaf4;
  --gl-sand: #d8c6ae;
  --gl-gold: #b79b6c;
  --gl-gold: #beb3a5;
  --gl-olive: #6f7465;
  --gl-dark: #2f312d;
  --gl-muted: #77746d;
}

body {
  
  color: var(--gl-dark);
}

.project-bg {
  background: var(--gl-bg);
}

.uk-modal-dialog {
    background: #fffaf4;
    width: auto;
    max-width:960px;
    padding: 35px;
}
.uk-modal-dialog .gl-section {
    padding: 0;
}

.gl-project-hero {
  position: relative;
  min-height: 640px;
  background-size: cover;
  background-position: center;
  color: #fff;
}

.gl-project-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(28,31,24,.88) 8%, rgba(28,31,24,.2) 50%);
}

.gl-project-hero-content {
  position: relative;
  padding: 150px 35px 115px;
}

.gl-kicker {
  color: var(--gl-sand);
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 700;
}

.gl-title {
  font-size: 60px;
  line-height: 1.08;
  font-weight: 300;
  margin: 18px 0;
  color: white;
}

.gl-subtitle {
  font-size: 21px;
  line-height: 1.6;
  max-width: 560px;
}

.gl-btn-premium {
  display: inline-block;
  padding: 15px;
  text-align: center;
  background: var(--gl-gold);
  color: var(--gl-dark);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 12px;
  font-weight: 700;
}

.gl-btn-premium.gl-btn-small {
  padding: 5px 18px;
  letter-spacing: .12em;
  font-size: 12px;
}

.gl-btn-premium:hover {
  background: #9d845a;
  color: #fff;
  text-decoration: none;
}

.gl-highlight-box {
  position: relative;
  z-index: 5;

}

.gl-highlight-item {
  text-align: center;
  border-right: 1px solid rgba(183,155,108,.28);
  padding-left: 0;
}

.gl-highlight-item:last-child {
  border-right: 0;
}

.gl-highlight-icon {
  color: var(--gl-gold);
  font-size: 34px;
  margin-bottom: 14px;
}

.gl-section {
  padding: 85px 0;
}

.gl-section h2,
.gl-highlight-expose h2  {
  color: var(--gl-dark);
  font-weight: 300;
  font-size: 42px;
  line-height: 1.2;
}

.gl-highlight-expose h2 {
  font-size: 22px;
  margin-top: 0px;
}

.gl-section h3 {
  color: var(--gl-dark);
  font-weight: 300;
  font-size: 30px;
}

.gl-section h4,
.gl-highlight-expose h4 {
  color: var(--gl-gold);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 13px;
}
.gl-highlight-expose h4 {
  margin-bottom: 0;
}

.gl-highlight-expose {
  
  background-color: #e8e1da;
  background-size: 80%;
  background-repeat: no-repeat;
  background-position: right 5% bottom 25%;
  margin-top: -100px;
  height: 250px;
}

@media (max-width: 767px) {
  .gl-highlight-expose {
    margin-top: 0;
    background-size: contain;
  }
}

.gl-text-card,
.gl-card {
  background: var(--gl-card);
  border-radius: 8px;
  box-shadow: 0 12px 35px rgba(47,49,45,.08);
}

.gl-text-card {
  padding: 45px;
}

.gl-image-soft {
  box-shadow: 0 14px 40px rgba(47,49,45,.12);
}

.gl-teaser-card {
  overflow: hidden;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(47,49,45,.10);
  position: relative;
}

.gl-teaser-card img {
  width: 100%;
  display: block;
}

.gl-teaser-card-content {
  padding: 24px;
}

.gl-teaser-card h3 {
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 700;
  margin-bottom: 8px;
}

.gl-teaser-card p {
  color: var(--gl-muted);
}

.gl-arrow {
  color: var(--gl-gold);
  font-size: 24px;
  float: right;
}

.gl-detail-list dt {
  color: var(--gl-olive);
  font-weight: 700;
}

.gl-detail-list dd {
  margin-bottom: 16px;
  font-size: 17px;
}

.gl-apartment {
  padding: 28px;
  height: 100%;
}

.gl-apartment h3 {
  font-size: 24px;
  margin-bottom: 10px;
}

.gl-apartment ul {
  padding-left: 18px;
}

.gl-apartment li {
  margin-bottom: 7px;
}

.gl-cta {
  background: var(--gl-olive) !important;
  color: #fff;
  border-radius: 8px;
  padding: 45px !important;
}

.gl-cta h2 {
  color: #fff;
}

.gl-floorplan-box {
  background: #fffaf4;
  border-radius: 8px;
  box-shadow: 0 12px 35px rgba(47,49,45,.08);
  padding: 40px;
}

@media (max-width: 767px) {
  .gl-title {
    font-size: 38px;
  }

  .gl-project-hero-content {
    padding: 100px 0 80px;
  }

  .gl-highlight-item {
    border-right: 0;
    border-bottom: 1px solid rgba(183,155,108,.28);
    padding: 20px 0;
  }
}

<!-- =========================================================
     WOHNUNGSSLIDER – UIkit v2
     Grundriss oben, Beschreibung darunter
========================================================= -->

.gl-apartment-slider {
  position: relative;
  margin-top: 45px;
}

.gl-apartment-slider .uk-slidenav {
  display: block;
  width: 54px;
  height: 54px;
  margin-top: -27px;
  background: rgba(255, 250, 244, .95);
  border-radius: 50%;
  box-shadow: 0 8px 24px rgba(47, 49, 45, .18);
  color: #2f312d;
  font-size: 30px;
  line-height: 54px;
  text-align: center;
}

.gl-apartment-slider .uk-slidenav:hover {
  background: #b79b6c;
  color: #fff;
}

.gl-apartment-slide {
}

.gl-apartment-slider-card {
  overflow: hidden;
  background: #fffaf4;
  border-radius: 10px;
  box-shadow: 0 16px 45px rgba(47, 49, 45, .11);
}

.gl-apartment-floorplan {
  position: relative;
  padding: 0;
  background: white;
  text-align: center;
}

.gl-apartment-floorplan img {
  display: inline-block;
  width: auto;
  max-width: 100%;
  max-height: 430px;
  object-fit: contain;
}

.gl-apartment-number {
  position: absolute;
  top: 24px;
  left: 24px;
  z-index: 2;
  padding: 9px 14px;
  background: #6f7465;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: 3px;
}

.gl-apartment-status {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 2;
  padding: 9px 14px;
  background: #b79b6c;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: 3px;
}

.gl-apartment-content {
}

.gl-apartment-slide h3 {
  margin: 0 0 8px;
  color: #2f312d;
  font-size: 32px;
  font-weight: 300;
  line-height: 1.2;
}

.gl-apartment-meta {
  margin-bottom: 27px;
  color: #b79b6c;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.gl-apartment-facts {
  margin-bottom: 28px;
  padding: 20px 0;
  border-top: 1px solid rgba(183, 155, 108, .28);
  border-bottom: 1px solid rgba(183, 155, 108, .28);
}

.gl-apartment-fact {
  text-align: center;
  border-right: 1px solid rgba(183, 155, 108, .25);
}

.gl-apartment-fact:last-child {
  border-right: 0;
}

.gl-apartment-fact strong {
  display: block;
  margin-bottom: 4px;
  color: #2f312d;
  font-size: 19px;
  font-weight: 500;
}

.gl-apartment-fact span {
  color: #77746d;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.gl-apartment-highlights {
  margin: 24px;
  padding: 0;
  list-style: none;
  /*
  column-count: 2;
  column-gap: 40px;
  */
}

.gl-apartment-highlights li {
  position: relative;
  break-inside: avoid;
  margin-bottom: 11px;
  padding-left: 23px;
  color: #55554f;
  line-height: 1.55;
}

.gl-apartment-highlights li:before {
  content: "—";
  position: absolute;
  top: 0;
  left: 0;
  color: #b79b6c;
  font-weight: 700;
}

.gl-apartment-pagination {
  margin-top: 28px;
  text-align: center;
}

.gl-apartment-pagination li {
  display: inline-block;
  margin: 0 4px;
}

.gl-apartment-pagination li a {
  display: block;
  width: 34px;
  height: 34px;
  padding: 0;
  background: transparent;
  border: 1px solid rgba(183, 155, 108, .5);
  border-radius: 50%;
  color: #6f7465;
  font-size: 12px;
  line-height: 32px;
  text-align: center;
}

.gl-apartment-pagination li.uk-active a,
.gl-apartment-pagination li a:hover {
  background: #b79b6c;
  border-color: #b79b6c;
  color: #fff;
}

@media (max-width: 767px) {
  .gl-apartment-slide {
    padding: 0;
  }

  .gl-apartment-slider .uk-slidenav {
    display: none;
  }

  .gl-apartment-floorplan {
    min-height: 300px;
    padding: 65px 20px 25px;
  }

  .gl-apartment-floorplan img {
    max-height: 300px;
  }

  .gl-apartment-content {
    padding: 28px 24px 32px;
  }

  .gl-apartment-content h3 {
    font-size: 27px;
  }

  .gl-apartment-highlights {
    column-count: 1;
  }

  .gl-apartment-fact {
    margin-bottom: 18px;
    border-right: 0;
  }
}