/* @import url('https://fonts.googleapis.com/css?family=Assistant:400,600,700,800|Open+Sans+Condensed:300|Ubuntu+Condensed|Work+Sans'); */
/* @import url('https://fonts.googleapis.com/css?family=Muli:300,300i,400,400i,500,500i,600,600i,700,700i&display=swap'); */
/* @import url('https://fonts.googleapis.com/css?family=Charm|Muli:300,300i,400,400i,500,500i,600,600i,700,700i&display=swap'); */
/* @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.1/font/bootstrap-icons.css"); */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css");
html,body {padding: 0;margin: 0;}
body {position: relative;overflow-x: hidden;-ms-overflow-style: -ms-autohiding-scrollbar;height: 100%;}
.oben{background-color: #f5f5f5;}
.top-logo {max-width: 220px;padding-top: 3px;}
@media(max-width: 992px) {.top-logo {max-width: 200px;padding-top: 3px;}}
h1.slogan {font-family: 'Muli', sans-serif ! Important;font-size: 2rem;font-weight: 300 !important;font-style: italic;letter-spacing: 3px;padding-top: 35px;}
@media(max-width: 1200px) {h1.slogan {font-size: 1rem !important;padding-top: 35px !important;}}

h1.slogan span.big {font-size: 2.5rem;}
a.test:hover{text-decoration: none !important;}

@media(max-width: 768px) {h1.slogan {padding-top: 15px !important;font-size:1rem !important;} .h2, h2 {font-size: 1.3rem;}}
@media(max-width: 1200px) {h1.slogan span.big {font-size: 2rem !important;}}

.nav-link {font-size: 1.2rem;}
.img-gleich{object-fit: cover;object-position: top;width: 100%;height: 712px;max-height: 712px;margin-bottom: 1rem;}

.kleber {position:relative;opacity: 0;}
.kleber.klebt {position: -webkit-sticky;position: sticky;top: 0;opacity: 1;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;font-size: 1.66rem;margin-bottom: 0.1rem;text-decoration: none;}

.navbar{padding: 0rem 0rem;}
.navbar-nav .nav-item a.nav-link {/*background-color: #F8F9FA;*/padding: 10px;font-weight: 600;}
.navbar-nav .nav-item a.nav-link:hover {background-color: #ececec;color: rgba(55,55,50,.9) !important;padding: 10px;}
.navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show > .nav-link {color: rgba(55,55,50,.9) !important;background-color: #ececec;}

.dropdown-menu {position: absolute;top: 100%;left: 0;z-index: 1000;display: none;float: left;min-width: 10rem;padding: .5rem 0;margin: 0rem 0 0;font-size: 1rem;color: #212529;text-align: left;list-style: none;background-color: #ececec;background-clip: padding-box;border: 0px solid rgba(0,0,0,.15);border-radius: 0rem;}
.dropdown-item.active, .dropdown-item:active {color: #fff;text-decoration: none;background-color: #53B557;}
.dropdown-divider {height: 0;margin: .5rem 0;overflow: hidden;border-top: 1px solid #c6c7c8;}


h3.cat-gerichte  {font-size: 2rem;font-family: 'Muli', sans-serif ! Important; font-weight: 300 !important; font-style: italic; /*line-height: 145%;*/color: #AC4851;}
.carousel-caption h1 {font-family: 'Muli', sans-serif ! Important;font-size: 2.5rem; font-weight: 300 ! important; font-style: italic;}/*font-family: 'Charm', cursive ! Important;*/
h5.card-title {font-family: 'Muli', sans-serif ! Important;font-size: 1.5rem; font-weight: 300 ! important; font-style: italic;}
@media(max-width: 414px) {.footerbg h3,.footerbg p {text-align: center;}}
.text-info{color:#53B557 !important;}
.text-success{color: #53B557 !important;}
.text-danger {color: #991a26 !important;}
/* .bg-success{background-color: #589741 !important;} */
.bg-success-50{background-color: rgba(55,151,65,.5) !important;}
.bg-light-80 { background-color: rgba(212, 212, 212, 0.62); }

.bg-thema{background-color: #E1E4DA !important;}
.bg-light-70{background-color:#cecece;}
.partyservice .list-group-item.active{background-color:#589741 !important;border-color:#c8c8c8;}/*background-color: #991a26 !important;border-color:#991a26;*/
.btn.btn-success{background-color: #53B557 !important;border-color: #666666;}
.btn-success.focus, .btn-success:focus { box-shadow: 0 0 0 .2rem rgba(129, 129, 129, 0.5);}
.text-success{color:#53B557 !important;}
.card-footer {border-top: 0px solid hwb(0 0% 100% / 0.125) !important;}
#myBtn {display: none;position: fixed;bottom: 20px;right: 30px;z-index: 99;font-size: 18px;border: none;outline: none;background-color: #53B557;color: white;cursor: pointer;padding: 4px 8px 7px;border-radius: 4px;}
.bg-dunkel {background-color: #292B2C !important;}
.bg-danger {background-color: #991A26 !important;}/*#A9414A*/
.bg-gruenhell{background-color: #c3e6cb;}
.bg-rothell{background-color: #F5C6CB;}
.badge-secondary-50{background-color: #b1c1ce;color: #ffffff;}
.list-group-item-secondary-50 {background-color: rgba(0,0,0,.03);}

.footerbg{background: #4a4949 ;} /*#141714de*/


.section .background-image {z-index: 0;position: absolute;top: 0px;width: 100%;min-height:1000px;height: 100%;background-size: cover;background-position: center;}
.section .background-image.background-image-fixed {background-attachment: fixed;}
    .opacity-before::before {
    content: "";
    background: rgba(0, 0, 0, 0.749);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
}

/****************************************************************************************************/
/* Custom CSS */
.fixed-bg-section {
    /* Setzt die Mindesthöhe der Section */
    min-height: 100vh;
    /* Ermöglicht die Positionierung des Overlays/Textes */
    position: relative; 
    /* Lädt das Bild */
    background-image: url('../../img/catering/usp1.webp'); 
    /* Bild füllt den Bereich aus */
    background-size: cover;
    /* Bild bleibt beim Scrollen fixiert */
    background-attachment: fixed;
    /* Bild zentrieren */
    background-position: center;
}

/* Der Opazitäts-Layer (Überlagerung) */
.fixed-bg-section::before {
    content: "";
    /* Füllt die gesamte Section aus */
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    /* Farbe und Opazität (RGBA-Wert) */
    background-color: rgba(0, 0, 0, 0.5); /* Schwarz mit 50% Opazität */
    /* Alternative mit Bootstrap-Variablen und Opacity: */
    /* background-color: var(--bs-primary); opacity: 0.5; */
    z-index: 1; 
}

/* Container für den Text, damit er über dem Overlay liegt */
.overlay-content {
    /* Text muss höher sein als der Opazitäts-Layer */
    z-index: 2;
    /* Stellt sicher, dass der Text im Layout zentriert wird */
    position: relative; 
    /* Zentriert den Inhalt (dank d-flex) */
    height: 100%; 
}


/****************************************************************************************************/


.fa.fa-tree {color: #991A26;font-size: 30px;padding-right: 10px;}
.fa.fa-asterisk{color: #991A26;font-size: 20px;padding-right: 10px;}
.fa.fa-utensils{color: #991A26;font-size: 20px;padding-right: 10px;}

.special.list-group-item {padding: .75rem 0.25rem;margin-bottom: 1px !important;background-color: #fff;border-top: none !important;border-right: none !important; border-bottom: 1px solid rgba(0,0,0,.125) ! important;border-left: none !important;}

.special.card-title{font-family: times;font-style: italic;font-size: 2rem;}
.weihnacht.nav-link{font-family: times;font-style: italic;font-size: 1.3rem;color:#AB4650 !important;margin: -2px;}

a.logg:hover{text-decoration: none;cursor: auto;}

.carousel-caption {right: 35%;left: 35%;}
.carousel-caption {width: auto;bottom: 10%;background-color: rgba(41, 41, 41, 0.5);/*opacity: .2;*/}

#bg-gerichte {height: auto; margin: 0 auto;width: 100%;position: relative;}
#bg-gerichte > *:first-child:before {content: '';width: 100%;height: 100%;display: block;position: absolute;left: 0px;top: 0px;pointer-events: none;background:linear-gradient(to bottom right,rgba(2, 2, 2, 0.7),rgba(235, 255, 230, 0.7));}

#kontakt a:link { text-decoration: none;}

.gradient-overlay-start {overflow: hidden;/*position: relative;*/ }
.gradient-overlay-start > *:first-child:before {content: '';width: 100%;height: 100%;display: block;position: absolute;left: 0px;top: 0px;pointer-events: none;/*background: linear-gradient(to bottom right, rgba(178, 213, 173,.1) , transparent 80%);*/background: linear-gradient(to bottom right, rgba(178, 213, 173,0.1), transparent 80%);}

/************************************ Cookies ******************************************************/
.cookiealert {position: fixed;bottom: 0;left: 0;width: 100%;margin: 0 !important;z-index: 999;opacity: 0;border-radius: 0;/*background: #212327 url("img/cubes.png");*/background: #212327;transform: translateY(100%);transition: all 500ms ease-out;color: #ecf0f1;}
.cookiealert.show {opacity: 1;transform: translateY(0%);transition-delay: 1000ms;}
.cookiealert a {text-decoration: underline}
.cookiealert .acceptcookies {margin-left: 10px;vertical-align: baseline;}

@-webkit-keyframes zoom {
  from {
    -webkit-transform: scale(1, 1);
  }
  to {
    -webkit-transform: scale(1.2, 1.2);
  }
}

@keyframes zoom {
  from {
    transform: scale(1, 1);
  }
  to {
    transform: scale(1.2, 1.2);
  }
}

.carousel-inner .carousel-item > img {
  -webkit-animation: zoom 20s;
  animation: zoom 20s;
}

.list-group-item.pi{
    list-style-position: outside;
    text-indent: -0.7em;
    padding-left: 2em;
    margin-left: 0;
    border:none;
    background: none !important;
    /* color: #ffffff; */
  }

.bgcolor{
position: absolute; 
top: 0px;
left: 0px;
width: 100%;
height: 100%;
content: ' ';
/* background: linear-gradient(#111111b8, rgba(17, 17, 17, 0.8), rgba(27, 27, 53, 0.59), rgba(17, 17, 17, 0.64), #111);
background-color: rgba(0, 0, 0, 0); */
background-color: #000000;
opacity: .5;
}

/*
*/
/* This should be based on your carousel setting. For bs, it should be 5second*/
/*
.carousel-fade .carousel-inner .carousel-item {
  opacity: 0;
  transition-property: opacity;
    overflow:hidden;
}
.carousel-item.active img {
    transition: transform 5000ms linear 0s;
    
    transform: scale(1.05, 1.05);
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}


@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .carousel-item.next,
    .carousel-fade .carousel-inner > .carousel-item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .carousel-item.prev,
    .carousel-fade .carousel-inner > .carousel-item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .carousel-item.next.left,
    .carousel-fade .carousel-inner > .carousel-item.prev.right,
    .carousel-fade .carousel-inner > .carousel-item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}
*/