body {
	
	font-size: 18px;
	
}






/* text */
.fs-20 { font-size: 20px; }
.fs-23 { font-size: 23px; }
.fs-25 { font-size: 25px; }
.fs-30 { font-size: 30px; }
.h-sub1 { font-size: 25px; font-weight: bold; } 
.fs-small { font-size: 15px; }	




/* Modal Design */
.standardModalDesign { border-radius: 0px; border: 1px solid #282829; }
a.modalLink, a.modalLink:link, a.modalLink:visited, a.modalLink:hover, a.modalLink:active, a.modalLink:focus {
    color: inherit;
    text-decoration: none;
	cursor: grabbing;
}

a.lnk1, a.lnk1:link, a.lnk1:visited, a.lnk1:hover, a.lnk1:active, a.lnk1:focus {
    color: #545454;
    text-decoration: none;
}

a.wh, a.wh:link, a.wh:visited, a.wh:hover, a.lnk1:wh, a.lnk1:wh {
    color: #ffffff;
    text-decoration: none;
	font-weight: bold;
}

a.neutral, a.neutral:link, a.neutral:visited, a.neutral:hover, a.neutral:active, a.neutral:focus {
    color: inherit;
    text-decoration: none;
}



/* LINK DESIGN */
.infoBefore::before {
  content: url('/img/icons/link-45deg.svg');
  margin-right: 0px; /* Fügen Sie Abstand zwischen dem SVG und dem Text hinzu */
}



.info { position: relative; color: #000; text-decoration: none; background-color: #f0f0f0; padding: 5px 10px; 
    padding-left: 25px; display: inline-block; transition: background-color 0.3s; 
}
.info:hover { background-color: #ddd; }
.info:before {
    content: url('/img/icons/link-45deg.svg');
    position: absolute; 
    left: 3px; 
    top: 50%; 
    transform: translateY(-50%); 
    font-size: 16px; 
}
.boxlink { position: relative; color: #000; text-decoration: none; background-color: #f0f0f0; padding: 10px 10px; 
    display: inline-block; transition: background-color 0.3s; 
}
.boxlink:hover { background-color: #ddd; }
.politik-stand { padding: 10px; background-color: #E0A119 }


/* INPUT */
.br-none { border-radius: 0px; }
.form-control { border: 1px solid #C8C8C8; }
.form-control:focus {
  color: black;
  font-weight: bold;
  background-color: #F0F0F0;
  border-color: #C8C8C8;
  outline: 0;
  box-shadow: 0 0 0 0.0rem rgba(50, 55, 50, 0.25);
}
.registerFormLabels .form-label { font-size: 14px; color: #545454; position: relative; bottom: -9px; left: 6px; background-color: white; padding: 0px 5px 0px 5px; background-color: #EBEBEB; }


/* Effects */

.hover-grow { transition: transform 0.3s ease-in-out; }
.hover-grow:hover { transform: scale(1.03); -webkit-box-shadow: 0px 0px 23px 5px rgba(0,0,0,0.24); box-shadow: 0px 0px 23px 5px rgba(0,0,0,0.24); }

/* Specific */
.card-kategorie { max-width: 350px!important; }
.modal-backdrop { z-index: 100; }


/* Buttons */
button.btn-gastro { border: 1px solid black; background-color: #212529; font-size: 20px; border-radius: 0px; min-width: 200px; color: white; }
button.btn-gastro:hover { border: 1px solid black; background-color: #8797A8; font-size: 20px; border-radius: 0px; min-width: 200px; color: white; }

.btn-red-big { border: 1px solid black; background-color: #212529; font-size: 20px; border-radius: 0px; min-width: 200px; color: white; }
.btn-red-big:hover { border: 1px solid black; background-color: #8797A8; font-size: 20px; border-radius: 0px; min-width: 200px; color: white; }



.ms-submit {
  background-color: #70A82E; /* Grundfarbe */
  color: white;
  padding: 14px 20px;
  border: none;
  cursor: pointer;
  border-radius: 0px;
  font-size: 20px; 
  font-weight: bold;
  transition: background-color 0.3s ease; /* Weicher Übergang für die Farbänderung */
}

.ms-submit:hover {
  background-color: #45a049; /* Farbe beim Hover */
}



/* BOX SET */
.infobox-red { padding: 10px; font-size: 18px; color: white; background-color: #8C111F; margin: 5px; font-weight: bold; }
.hinweis-box { padding: 10px; font-size: inherit; background-color: #E6E6E6; margin: 5px; }

.stopTop { height: 20px; }

@media (max-width: 851px) {
    .handy-invis { display: none }
}

/* Forms */
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  background-color: #f0f0f0; /* Hintergrundfarbe */
  border: 1px solid #d3d3d3; /* Rahmen */
  padding: 5px; /* Innenabstand */
  border-radius: 5px; /* Abgerundete Ecken */
}

input[type="date"]:hover,
input[type="time"]:hover,
input[type="datetime-local"]:hover {
  background-color: #e9e9e9; /* Hintergrundfarbe beim Darüberfahren */
}

/* Stil für den Fokus-Zustand, um die Sichtbarkeit zu erhöhen */
input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus {
  border-color: #007bff; /* Rahmenfarbe */
  box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25); /* Schatten */
}

/* WIDTH components */
.flex-300 div { max-width: 300px; } .flex-350 div { max-width: 350px; } .flex-400 div { max-width: 400px; }




@keyframes colorize {
    0% {
        filter: grayscale(100%);
    }
    25% {
        filter: grayscale(50%);
    }
    50% {
        filter: grayscale(75%);
    }
    75% {
        filter: grayscale(25%);
    }
    100% {
        filter: grayscale(0%);
    }
}

#logoMain {
    animation: colorize 10s forwards;
}
.toGrey {
    animation: colorize 10s backwards;

}
.parallax {
    /* Grundlegende Styling für Parallax */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;

    /* Höhe des Parallax-Bereichs */
    min-height: 90vh; 
}
.toWhite {
    /* Anfänglicher Stil des Elements */
    background-color: initial; /* Ersetzen Sie 'initial' mit der ursprünglichen Hintergrundfarbe */
    animation: fadeToWhite 5s forwards; /* 5 Sekunden Animation */
}

@keyframes fadeToWhite {
    from {
        background-color: initial; /* Ersetzen Sie 'initial' mit der ursprünglichen Hintergrundfarbe */
        opacity: 1;
    }
    to {
        background-color: white;
        opacity: 1; /* 80% Deckkraft */
    }
}
.this-is-hot { background-color: #ffffff; border: 2px solid #990000; }



.jarallax{position:relative;z-index:0}.jarallax>.jarallax-img,picture.jarallax-img img{position:absolute;object-fit:cover;top:0;left:0;width:100%;height:100%;z-index:-1}