/* prettier-ignore */
/*# sourceMappingURL=user.css.map */


/*---- Tabellen responsive ------------------------------------------*/
table {
  display: block;
  overflow: scroll;
}


/*---- Formular Eigenschaften gestalten ------------------------------------------*/
/* Styling für Label und Eingabefelder */
form label {
    display: block;             /* Label über dem Eingabefeld */
    margin-bottom: 0.5em;       /* Abstand zum Eingabefeld */
    font-weight: bold;          /* Optional: Fettdruck für Labels */
}

form input[type="text"],
form input[type="password"],
form input[type="email"],
form input[type="tel"],
form select,
form textarea {
    display: block;
    width: 100%;                /* Volle Breite für Eingabefelder */
    max-width: 400px;           /* Optional: maximale Breite für Lesbarkeit */
    padding: 8px;               /* Innenabstand für bessere Nutzbarkeit */
    margin-bottom: 10px;        /* Abstand nach unten zu anderen Feldern */
    border-radius: 3px;         /* Abgerundete Ecken */
    box-sizing: border-box;     /* Gleichmäßige Abstände */
}

/* Stil für Submit-Button */
form input[type="submit"] {
    background-color: #cbbaa6;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    margin-top: 10px;
}

form input[type="submit"]:hover {
    background-color: #ae967b;
}

/* Optional: Fehlernachrichten oder Hinweise */
form .error-message {
    color: red;
    font-size: 0.9em;
    margin-top: -5px;
}



.fancynavbar-togglerbar {
background-color: #cbbaa6 !important;
/*background-color: #decebc !important;  hellbeige*/
  /*background-color: #c8b39a !important;   beige*/
/*background-color: #9ec3e8 !important;*/
}

/* Logo in der Fancy Navbar größer machen */
.fancynavbar-brand-img {
  width: 60px;   /* gewünschte Breite */
  height: auto;  /* Höhe proportional */
}


/* Frame / Container reset, dass Inhalte 3 oder 4spaltig klappt */
.frame column {
    width: 33.33%;
    float: left;
    box-sizing: border-box;
}

.frame{
        margin-bottom: 40px !important;
	clear: both !important;
    }


/* Ausrichtung Inhalte gesamt*/
.justify-content-left{
  text-align: left !important;
}


/* eigene Button Farbe beige */
.btn-primary {
  background-color: #cbbaa6;
  border: none;              /* entfernt den Rahmen */
  margin: 10px 10px 10px 0;
}

/* Hover / Fokus identisch wie Normalzustand */
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  margin: 10px 10px 10px 0;
  background-color: #ae967b;
  border: none;
  box-shadow: none;          /* entfernt Bootstrap-Schatten bei Fokus */
}


.btn-primary {
  background-color: #cbbaa6;
  border-color: #cbbaa6;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #b7a48f; /* etwas dunkler für Hover */
  border-color: #b7a48f;
}



/*--------------------------------------------------------------
	Textfarbe bei Markierung
--------------------------------------------------------------*/
/* ganz am Ende deiner Styles */
html ::selection {
  background: #cb9c5a !important;
  color: #fff !important;
}

/* Fallback für alte Firefox-Versionen */
html ::-moz-selection {
  background: #cb9c5a !important;
  color: #fff !important;
}



/* Font Inhaltsbereich */
body {
    background-color: #fff;
    font-size: 16px;
    color: #797979;
    width: 100%;
    padding: 0;
    margin-left: 0;
    margin-right: 0;
    font-weight: 400;
    width:100%;
    font-family: 'Raleway', sans-serif;
}


/***********************
*** Links **************
************************/
a {
    color: #343a40;
}

a:hover {
    color: #343a40;
}

a:visited {
    color: #343a40;
}

.icon-link {
    color: #343a40;
}

.icon-link:hover {
    color: #343a40;
}

.icon-link:visited {
    color: #343a40;
}


/***** Sub Links im Hauptmenu weiss  */
.fancy-dropdown-item:visited,
.fancy-dropdown-item.is-active {
  color: #fff !important; /* nur für visited & active */
}




/**************************
*** Ueberschriften **************
**************************/
h1 {
    font-family: 'Montserrat', sans-serif;
    color:#6d6d6d;
    margin-bottom: 10px;
    font-size: 2rem;
    line-height: 4rem;
}
h2 {
    font-family: 'Montserrat', sans-serif;
    color:#6d6d6d;
    font-size: 1.4rem;
    line-height: 2rem;
  padding-bottom: 20px;
}
h3 {
      font-family: 'Montserrat', sans-serif;
    font-size: 1.4rem;
    color:#fff;
  line-height: 1.8rem;

}
h4 {
    font-size: 1.6rem;
    line-height: 2.2rem;
  font-color: #ffffff;
}
h5 {
    font-size: 1.3rem;
}
h6 {
    font-size: 1rem;
}



/**************************
*** Footer Links **********
**************************/

/* Links im Footer-Menü */
.footer-menu a,
.footer-menu a:link,
.footer-menu a:visited {
  color: #a1a1a1;           /* Grundfarbe */
  text-decoration: none;
}

.footer-menu a:hover,
.footer-menu a:focus {
  color: #ccc;              /* Hover/Focus */
}

/* Aktiver Menüpunkt optional etwas absetzen/aufhellen */
.footer-menu a.is-active {
  opacity: 0.9;
}

/* Der senkrechte Strich (Separator) */
.footer-menu .footermenu {
  color: #bfbfbf;           /* etwas heller als Link-Farbe */
  margin: 0 2px;
}

/* Sonderlink (PID 183) bekommt gleiche Farbe */
.footer-menu a.cookie-set,
.footer-menu a.cookie-set:visited {
  color: #a1a1a1;
}

/**************************
*** Footer Anschrift *****
**************************/

.footer address,
.footer address .footer-menu {
  color: #a1a1a1;           /* gleiche Farbe wie Menü */
  font-style: normal;       /* <address> Standard-Kursiv aufheben */
}

.footer address:hover,
.footer address:focus {
  color: #ccc;              /* gleicher Hover wie Menü */
}




/*--------------------------------------------------------------
	Tabellen
--------------------------------------------------------------*/

tbody tr:hover {
    background: #be9651;
    color: #fff;
}



.frame{
        margin-bottom: 40px !important;
	clear: both !important;
    }



.rootline-box {
        margin-bottom: 0px;
        padding-top: 20px !important;
        padding-left: 30px !important;
    }




/* Bilder responsive */
.img-fluid {
  max-width: 100%;
  height: auto;
}

img.img-fluid {
  max-width: 100%;
  height: auto;
  display: block;
}


hr {
  border-top: 3px dashed #be9651;
}

.frameemba {
  font-color: #ffffff !important;
        margin: 0;
    font-family: 'Montserrat', sans-serif;
    color:#1a1a1a;
    margin-bottom: 10px;
    font-size: 1.3rem;
    line-height: 2rem;

      border-radius: 15px; /* Abgerundete Ecken für den Kasten */
    padding: 20px; /* Innenabstand zum Rand */
  
  background-image: url("/fileadmin/Bilddatenbank/bg_blau_transparent.jpg") !important;
}

/* EmbaSpot */
.containerspot {
    background-color: #001f3f !important; /* Dunkelblauer Hintergrund */
    border-radius: 15px; /* Abgerundete Ecken für den Kasten */
    padding: 20px; /* Innenabstand zum Rand */
    position: relative;
}


.containerspot a,
.containerspot a:visited,
.containerspot a:active,
.containerspot a:focus {
    color: #fff; /* Gemeinsame Farbe für Hover, Visited, Active und Focus */
    text-decoration: none;
}

.containerspot a:hover {
    color: #fff; /* Gemeinsame Farbe für Hover, Visited, Active und Focus */
    text-decoration: underline;
}


.containerspot::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    border: 1px solid white; /* Weiße, 1px dünne Linie */
    border-radius: 12px; /* Abgerundete Linie */
    pointer-events: none;
}

/* Container automatisch H zuweisen*/
.containerspot h1,
.containerspot h2,
.containerspot h3,
.containerspot h4,
.containerspot h5,
.containerspot h6,
.containerspot p {
    color: white !important; /* Weißer Text für alle Überschriften und Absätze */
}



/*--------------------------------------------------------------
	Einstellungen Slider opacity
---------------------------------------------------------------*/
/* ===== Slider Grundlayout ===== */
#cafeHeader #carousel-slider,
#cafeHeader #carousel-slider .carousel-inner,
#cafeHeader #carousel-slider .carousel-item {
  height: 100vh; /* Vollbildhöhe wie vorher */
}

#cafeHeader #carousel-slider .carousel-item {
  position: relative;
}

#cafeHeader #carousel-slider .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* Bild füllt den Bereich */
  display: block;
  filter: brightness(55%); /* Bild abdunkeln statt Overlay-Deckfläche */
  /* alternativ: opacity: .6; wenn du wirklich Transparenz willst */
}

/* ===== Caption (Titel + Beschreibung) ===== */
#cafeHeader #carousel-slider .carousel-caption {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;           /* über dem Bild */
  width: min(90vw, 1000px);
  text-align: center;
  color: #cecece;
}

#cafeHeader #carousel-slider .carousel-caption h3 {
  color: #cecece;          /* volle weiße Schrift */
  opacity: 1;           /* nicht vom Bild beeinflusst */
  font-size: clamp(2rem, 6vw, 3.5rem);
  line-height: 1.1;
  margin: 0;
}
#cafeHeader #carousel-slider .carousel-caption h4 {
  font-size: clamp(1.1rem, 3vw, 1.75rem);
  color: #cecece;
  font-weight: 500; /* etwas leichter */
  margin-top: .5rem;
}


#cafeHeader #carousel-slider .carousel-caption p {
  font-size: clamp(1rem, 2.5vw, 1.25rem);
  margin-top: .75rem;
  opacity: .95;         /* leicht transparent für Fließtext */
  color: #cecece;
}


/* Pfeile und Indikatoren ganz nach oben */
#cafeHeader #carousel-slider .carousel-control-prev,
#cafeHeader #carousel-slider .carousel-control-next {
  z-index: 50;
}

#cafeHeader #carousel-slider .carousel-indicators {
  z-index: 40;
}

/* Caption darunter, aber über dem Bild */
#cafeHeader #carousel-slider .carousel-caption {
  z-index: 30;
}

/* Bild (und ggf. Link um das Bild) ganz unten */
#cafeHeader #carousel-slider .carousel-item img {
  position: relative;
  z-index: 1;
}







/*---- Bilder responsive ------------------------------------------*/
.image-embed-item, embed, object, video {
width:100%;
max-width: 100%;
height: auto;
}



/* Gallerie bis 992px auf volle Breite */
@media (max-width: 992px) {
    .ce-gallery {
        width: 100%;
    }
}
 
/* Anpassungen von kleinen bis groeßeren Geraeten */
@media (min-width: 640px) and (max-width: 1200px) {
    .ce-gallery .ce-column {
        margin: 0;
        /* Abstand zwischen Bildern */
        padding: 0 5px;
        box-sizing: border-box;
    }
 
 
    /* Kein Abstand beim ersten und letzten Bild */
    .ce-gallery .ce-column:first-child {
        padding-left: 0;
    }
    .ce-gallery .ce-column:last-child {
        margin-right: 0;
    }
 
    /* Fluid Image Tags */
    .ce-gallery img,
    .ce-gallery picture {
        width: 100%;
        height: auto;
    }
 
    /* Spaltenbreiten je nach eingestellten Columns */
    .ce-gallery[data-ce-columns="2"] .ce-column {
        width: 50%;
    }
 
    .ce-gallery[data-ce-columns="3"] .ce-column {
        width: 33%;
    }
 
    .ce-gallery[data-ce-columns="4"] .ce-column {
        width: 25%;
    }
 
    .ce-gallery[data-ce-columns="5"] .ce-column {
        width: 20%;
    }
}
 
/* Anpassungen fuer kleine Geraete */
@media (max-width: 640px) {
 
    /* Ein Bild pro Zeile */
    .ce-gallery .ce-column {
        margin: 0 0 10px;
        width: 100%;
        box-sizing: border-box;
    }
 
    /* Fluid Image Tags */
    .ce-gallery img,
    .ce-gallery picture {
        width: 100%;
        height: auto;
    }
}