@charset "utf-8";
/* CSS Document */

/* Global vars ------------------------------ */
:root{
    /* colors */
    --primary-color: #50A692; /* Hintergrundfarbe */
    --primary-inv-color: #fff; /* Schrift auf Hintergrundfarbe */
    
    --primary-font-color: #000; /* Schriftfarbe Fließtext */
    --primary-header-color: #5a5a5a; /* Schriftfarbe Header */
    --primary-mainnav-color: #5a5a5a;/* Schriftfarbe Menü - bei nach oben scrollen / Schriftfarbe wenn Seite gestartet siehe unten bei Nav_var1 und 2*/
    --link-hover-color: #A1A1A1; /* normaler TextLink - Farbe */
    --footer-txt-color: #A1A1A1; /* Schriftfarbe Footer */
    --hr-color: #ede6d8; /* Trennstrichte z.B. Footer*/
    
    --hero-header-color: #fff; /* Schriftfarbe im Header */
    --hero-header-overlay-color: rgba(0,0,0,0.2); /*Overlay über Headerbild*/
    
    --img-link-bg-color: transparent; /*nicht in Verwendung*/
    
    --btn-drop-color: #fff; /*3 Kästchen mit Text - Farbe von ÜberschriftenTextfeld */
    
    --primary-hg-color-1: #e9e9e9; /*Farbe ungerade Zeilen von Wohnungsfinder*/
    --primary-hg-color-2: #ffffff; /*Farbe gerade Zeilen von Wohnungsfinder*/
  
    
    /* Nav */
    --nav-height__S: 80px; /*Höhe NaviLeiste*/
    --nav-height__M: 80px;
    --nav-height__L: 100px;
    --nav-color: #5a5a5a; /*Schriftfarbe Menü bei Neustart der Seite*/
  
    /* 3 Striche Menü Mobile Version */
    /* Wird nicht korrekt in den Menüs Übernommen siehe Ticket #2869
       Farbe muss direkt in NAV unten eingegeben werden.*/
  
    --menue-icon-color__top: #50A692;
    --menue-icon-color__not-top: #50A692;
    
    
    /* Nav Proj-Logo - Breite festgesetzt - höhe Auto */
    --main-logo-w__S: 60px;
    --main-logo-h__S: auto;
    --main-logo-w__L: 65px;
    --main-logo-h__L: auto;
    
    /* Abstand des Logos im Menü oben/rechts/unten/links  */
    --main-logo-m__S: 10px 0 0 0;
    --main-logo-m__L: 20px 0 0 0;
    
    /* Hero */
    --swiper-heder-h__S:500px;
    --swiper-heder-h__M:400px;
    --swiper-heder-h__L:550px;/*Höhe von HeaderBild*/
    
    --swiper-overlay-pos-l__M:0px;/*Container der Maske nach rechts*/
    
    /* Verschiebung der Maske nacht rechts innerhalb des Containers */
    --swiper-overlay-left__S: -20px;
    --swiper-overlay-left__M: 0px;
    --swiper-overlay-left__L: 0px;

    /*Höhe Maske über HeaderBild*/
    --swiper-overlay-h__S:30px;
    --swiper-overlay-h__M:0px;
    --swiper-overlay-h__L:0px;
    

    /* Hero Proj-Logo */
    --object-logo-h__S:50px;
    --object-logo-m__S: 30px auto 20px auto;
    
    --object-logo-h__M:70px;
    --object-logo-m__M: 20px auto 20px auto; /*-40px 0 20px 15px;*/
    
    --object-logo-h__L:70px;
    --object-logo-m__L: 0px 0 20px var(--object-logo-ml__L); /* Logo von unterhalb des Header Bildes in HeaderBild schieben-20px */
    
    
    /* Abstand von Content Elementen wird im ContentElement überschrieben */
    --spacer__L: 0px;
    --spacer__S: 0px;
    
    /* PIC GAL */
    --picGal-h__S:300px;
    --picGal-h__M:350px;/*höhe von Bildern in der Gallerie*/
   
    
    /* FULL BG */
    --fullPic-h__S: 200px;
    --fullPic-h__M: 300px;/*höhe von Bildern die über die ganze Breite gehen*/
    
    /* image dropdown */
    --btn-drop-header-h__S: 60px;
    --btn-drop-header-h__M: 80px;/*3 Kästchen mit Text - Höhe von Zeile mit Überschrift */

    
    /* Schatten bei 3 Kästchen mit Text */
    --box-shadow-down:2px 2px 6px -2px rgba(0,0,0,0);
    --box-shadow-all:0px 3px 8px 0px rgba(0,0,0,0.0);
    
    /* object list items // Anzahl der Spalten Wohnungsfinder */
    --obj-list-items__S: 5;
    --obj-list-items__M: 8;
    
    /* object image slider -Höhe Bilder im Wohnungsfinder */
    --objGal-h__S:100px;
    --objGal-h__M:200px;
    
    /* Wohnungsfinder Filter */
    --wpf-hg-color: #5a5a5a;  /* Hintergund Regler für Filter */
    --wpf-hg-style-color: var(--primary-color); /* Farbe Regler für Filter */
    
    /* Punkte für Headerbilder */
    --slider-selection-on-color: var(--primary-color);
    --slider-selection-off-color: var(--primary-hg-color-2);
    
    /* spinner */
    --spinner-ring-color:#A0A1A1; /*ring der erscheind wenn daten geladen werden*/
    --spinner-pfeil-color:var(--primary-color); /* Pfeil zeigt nach unten auf Filterergebnis*/
    
    /* popup when daten für wohnungsfinder geladen werden - wenn verzögert */
    --modal-bg-color: #5a5a5a;
    --modal-txt-color: #575756;
    --modal-link-color: var(--primary-color);
    
    /* lightbox Schriftartfarbe */
    --lightbox-color: #fff;
  
    /* Mouse Over Effekts */
    /* MO Zoom */
    --mo-zoom-duration: 3.0s; /* Sollte Dauer von Zommeffekt einstellen*/
    --mo-zoom-scale: 1.05; /* Sollte Stärke von Zommeffekt einstellen*/
  
}

/* Nav Variationen */

.nav__var1{
    /* Layout Nav Dynamisch - Navizeile nur beim Scrollen hinterlegt */
    --wrapper-spacer__S: 0px;
    --wrapper-spacer__L: 0px;/*weißer Abstand zwischen Websiteoberkante Headerbild - beeinflusst nicht die Position vom Menü */

    /* nav style farbe von Menüzeile wenn man Seite startet */
    --nav-bg-color__top: rgba(255,255,255,1);
    --nav-box-shadow__top: 0px 0px 5px 0px rgb(0 0 0 / 0%);

    --nav-bg-color__not-top: rgba(255,255,255,0.95);/*Farbe von Menüzeile wenn man nach oben scrolled 0 transparent 1 deckend*/
    --nav-box-shadow__not-top: 0px 2px 5px 0px rgb(0 0 0 / 6%);/*Schatten von Menüzeile wenn man nach oben scrolled */

    /* Logo im Menü Transparenz */
    --nav-mainlogo-opacity__top: 1;
    --nav-mainlogo-opacity__not-top: 1;

    --nav-font-color__top:  #5a5a5a;/* Fontcolor für Menü wenn ganz oben*/

    /* 3 Striche Menü Mobile Version*/
    --nav-menueIcon-color__top: var(--menue-icon-color__top); //#bd9e56;
    --nav-menueIcon-color__not-top:  var(--menue-icon-color__not-top);
}

.nav__var2{
    /* Layout Navigartionszeile Fix - immer sichtbar */
    --wrapper-spacer__S: var(--nav-height__S);
    --wrapper-spacer__L: var(--nav-height__L);/*weißer Abstand zwischen Websiteoberkante Headerbild - beeinflusst nicht die Position vom Menü */

    /* nav style */
    --nav-bg-color__top: rgba(255,255,255,1);/*Farbe von Menüzeile wenn man Seite frisch öffnet - 1.00 ist deckend - 0.00 ist durchsichtig*/
    --nav-box-shadow__top: 0px 2px 5px 0px rgb(0 0 0 / 6%);/*Schatten von Menüzeile wenn man die Seite frisch öffnet*/

    --nav-bg-color__not-top: rgba(0,255,255,1.00);/*Farbe von Menüzeile wenn man nach oben scrolled - 1.00 ist deckend - 0.00 ist durchsichtig*/
    --nav-box-shadow__not-top: 0px 2px 5px 0px rgb(0 0 0 / 6%);/*Schatten von Menüzeile wenn man nach oben scrolled*/

     /* Logo im Menü Transparenz */
    --nav-mainlogo-opacity__top: 1;
    --nav-mainlogo-opacity__not-top: 1;

    --nav-font-color__top: var(--nav-color);/* Fontcolor für Menü wenn ganz oben*/

    /* 3 Striche Menü Mobile Version*/
    --nav-menueIcon-color__top: var(--menue-icon-color__top); //#bd9e56;
    --nav-menueIcon-color__not-top:  var(--menue-icon-color__not-top);
}

/* full Pic & link Overlay */
.img-overlay-wrapper .btn.btn-custom-1{
    --btn-custom-1-px: 15px; /* Button margin left/right  */
    --btn-custom-1-py: 15px; /* Button margin top/bottom  */
    --btn-custom-1-span-px: 50px; /* Desktop: Text margin left/right  */
    --btn-custom-1-bottom: 30%; /* Desktop: Abstand von unten */
    --btn-custom-1-bg-hover: #F33A6A; /* ROSA statt 000 HG on hover */
    --btn-custom-1-white-space__S: normal; /* Mobile: Text Zeilenumbruch Ja/Nein -> normal/nowrap */
    --btn-custom-1-white-space__L: nowrap; /* Desktop: Text Zeilenumbruch Ja/Nein -> normal/nowrap */
    --btn-custom-1-border-color__L: var(--primary-color);  /* Desktop: Border off // ohne Rahmen = var(--primary-color)  // mit Rahmen = var(--primary-inv-color) */
    --btn-custom-1-border-color-hover__L: #FFC300 ;  /* GELB statt 000 Desktop: Border hover // ohne Rahmen = var(--btn-custom-1-bg-hover) // mit Rahmen = var(--primary-color) */
}