/* Barrierefreiheit: Tastenkürzel (Accesskeys)
 * Alt+0 = Barrierefreie Einstellungen öffnen
 * Alt+1 = Startseite (Home)
 * Alt+2 = Menü öffnen, Fokus in Navigation
 * Alt+8 = Cookie-Einstellungen (tarteaucitron) – wird per JS gesetzt
 * Alt+9 = Kontakt
 * Erster Tab = Skip-Link „Zum Hauptinhalt springen“
 */
:root {
	--accessibility: #000;
	--black: #000;	
}

html {
	scroll-behavior: smooth;
}
body {

}
body.high-contrast {
	--color-primary: #000;
	--color-black: #000000;
	--color-dark: #333333;
	--color-gray: #878787;
	--color-bg-light: #fff;
	--color-white: #000;
	--color-bg-dark: #8c251b;
	--color-bg-dark: #000;
}

body {
}

html.large-font {
	font-size: 1.25rem;
	--font-size-body: clamp(20px, 1.3vw, 22px);
	--ratio-section: 1.5;
}

html.xlarge-font {
	font-size: 1.5rem;
	--font-size-body: clamp(22px, 1.7vw, 24px);
	--ratio-section: 1.5;
}

body.high-contrast .section-bg-dark {
    background: #000 !important;
}
body.high-contrast .navbar-nav .dropdown-menu {
	background: #fff !important;
	color: #000 !important;
}
body.high-contrast #hand {
	margin-top: 30px;
}
body.high-contrast .hero-section h1 {
    background: #fff !important;
	padding: 1rem 2rem;
	font-size: clamp(32px, 5vw, 52px);
}
body.high-contrast .section-bg-dark hr {
    border-top: 1px solid #fff;
    opacity: .5;
}
body.high-contrast input.search-query,
body.high-contrast #kontaktformular label,
body.high-contrast h1,
body.high-contrast h2,
body.high-contrast h3,
body.high-contrast h4,
body.high-contrast h5,
/* body.high-contrast h6, */
body.high-contrast p,
body.high-contrast span,
body.high-contrast li,
body.high-contrast a {
	color: #fff;
}

body.high-contrast .search-btn i,
body.high-contrast .text-bg p,
body.high-contrast .text-bg a.bg_1,
body.high-contrast footer p,
body.high-contrast footer a,
body.high-contrast .skip-link,
body.high-contrast .text-bg h1,
body.high-contrast .text-bg h2.lead,
{
	/* background: #fff; */
	/* color: #000;  */
}
body.high-contrast footer p,
body.high-contrast footer li,
body.high-contrast footer a,
body.high-contrast footer h2,
body.high-contrast footer h3,
body.high-contrast footer span
{
	color: #000;
}

body.high-contrast .section-bg-dark h1,
body.high-contrast .section-bg-dark h2,
body.high-contrast .section-bg-dark h3,
body.high-contrast .section-bg-dark h4,
body.high-contrast .section-bg-dark h5,
body.high-contrast .section-bg-dark h6,
body.high-contrast .section-bg-dark p,
body.high-contrast .section-bg-dark span,
body.high-contrast .section-bg-dark li,
body.high-contrast .section-bg-dark a	
{
	color: #fff;
}

/* body.xlarge-font .section-bg-dark .checkbox-rect input[type="checkbox"]:checked + label:before {
	background: yellow;
} */


body.navbar-mobile-preview .navbar-custom #navbarNav .nav-link {
    padding: 0.5rem 0.6rem;
    font-size: 1rem;
    letter-spacing: 0.5px;
    text-decoration: none;
    color: inherit;
}

/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * * * * * * * * * * * * * * * * * * */
/*  TOOL CONTAINER for barriere switch */
.skip-link {
	position: absolute;
	left: -999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	z-index: 100;
	letter-spacing: .05em;
	z-index: 99999;
}

.skip-link:focus {
	position: absolute;
	left: 10px;
	top: 10px;
	width: auto;
	height: auto;
	background: var(--accessibility);
	color: #fff;
	padding: 8px 16px;
	border-radius: 6px;
	text-decoration: none;
	/* font-weight: bold; */
}

.accessibility-panel .HL {
	background: var(--accessibility);
	color: #fff !important;
	font-size: 1rem;
	width: 100%;
	padding: 12px 16px;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	margin-bottom: 1em;
}

.accessibility-panel {
	position: fixed;
	top: 230px;
	right: 85px;
	z-index: 9999;
	background: #fff;
	border: none;
	color: var(--black);
	border-radius: 12px;
	box-shadow: 0 8px 12px rgba(0,0,0,0.5);
	width: 260px;
	display: none;
	background: #ddd;
	padding-bottom: 1rem;
}
.accessibility-panel select {
	width: 48%; display: inline-block; height: auto;
}
.accessibility-panel label,
.accessibility-panel p,
.accessibility-panel div
 { font-size: 1rem; }
.settings-button {
	position: fixed;
	top: 30%;
	right: 15px;
	z-index: 10000;
	font-size: 2.8rem;
	background: var(--accessibility);
	color: white;
	border: none;
	border-radius: 50%;
	width: 3rem;
	height: 3rem;
	cursor: pointer;
}

.setting-item {
	margin: 3px 12px;
	background: #fff;
	border-radius: 8px;
}
.setting-item.sh,
.setting-item-inner {
	padding: 8px 12px;	
}
.setting-item label {
	display: inline-block;
	width: 50%; margin: 0; line-height: 1rem;
}
.setting-item label.breit {
	width: 75%;
}
.setting-item select {
	border: none; line-height: 1rem; font-size: 1rem); margin: 0;
}
.setting-item input { margin: 0; }
.setting-item select:focus-visible,
.setting-item input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--accessibility);
	outline-offset: 3px;
	border-radius: 4px;
	background: #eef5fa;
}

.setting-item a {
	padding: 8px 12px;	
	display: block;
	border-radius: 8px;
	color: var(--black);
}
.setting-item a:focus,
.setting-item a:focus-visible {
	background-color: var(--accessibility);
	color: #fff !important;
}

.settings-button {
	display: inline-flex;
	align-items: center;
	background: var(--accessibility);         /* dunkles Blau, anpassbar */
	color: #fff;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	transition: background 0.2s, box-shadow 0.2s;
	outline: none;
	box-shadow: 0 1px 4px rgba(0,0,0,0.07);
}

.settings-button:focus,
.settings-button:hover {
	background: var(--accessibility);
	box-shadow: 0 0 0 3px #80c7ff;
}

/* Das Bild anpassen, falls nötig: */
.settings-button img {
	width: 3em;
	height: 3em;
	object-fit: contain;
	margin-right: 0.5em;
	display: block;
	transition: 1s;;
}

/* Visually hidden für Screenreader-Text */
.visually-hidden {
	position: absolute !important;
	height: 1px; width: 1px;
	overflow: hidden;
	clip: rect(1px,1px,1px,1px);
	white-space: nowrap;
	border: 0;
	padding: 0; margin: -1px;
}

.visually-hidden {
	position: absolute !important;
	height: 1px; width: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}
.high-contrast .lang-sep,
.high-contrast #hero .hero-content h1.hero-h1-chars .char {
    color: #000 !important;
}
.nav-drill-back span {
	color: #000 !important;
}
@media (max-width: 1199.98px) {
	.accessibility-panel {
		top: inherit;
		bottom: 100px;
		/* left: 15px; */
		max-width: 95%;
	}
	.no-scroll .accessibility-panel {
		display: none !important;
	}
	.settings-button {
		position: fixed;
		top: inherit;
		bottom: 20px;
	}
	.nav-collapse.in.collapse {
		height: 100vh;
	}
	.nav-collapse .dropdown-menu a {
		border:1px solid var(--orange) !important;		
	}
	.settings-button,
	.settings-button img {
		width: 1.5em;
		height: 1.5em;
	}
}

@media (max-width: 768px) {
	.no-scroll .navbar-collapse {
		margin: 0;
		padding: 0 !important;
	}
	.xlarge-font body.navbar-mobile-preview .navbar-custom #navbarNav .nav-link {
		font-size: .8rem;
	}
}