/* gs20201117 siehe Sicherung */
/* Diese CSS-Datei enthält alles Notwendige für die 
	Formatierung der linken Navigation und
	die daraus folgende Positionierung der Hauptinhaltsspalte. */
:root {
	/* geerbt von standard.css: */
	/* --schrift: #4b4a48;
	--hintergrund: #fff;
	--hintergrundzwei: #e9f2f7;
	--hintergrunddrei: #ddd;
	--eins: #046aa2;
	--schrifteins: #02407f;
	--zwei: #387652;
	--grueneins: #27754a;
	--gruenzwei: #0d9144; */
	/* elan-spezifisch: */
	--logoblau: #0069d4;
	--sand: #f4f4ec;
	--ikone: #63a9de;
}

@media (prefers-color-scheme: dark), (inverted-colors: inverted) {
	:root {
		/* geerbt von standard.css: */
		/* --schrift: #ffffcc;
		--hintergrund: #000;
		--hintergrundzwei: #171717;
		--hintergrunddrei: #333;
		--eins: #38b3fa;
		--schrifteins: #38b3fa;
		--zwei: #0fb353; */
		--logoblau: #0075eb; /* etwas heller als das Logo-Blau von Elan für ausreichend Kontrast zum schwarzen Hintergrund */
		--sand: #333;
		--ikone: #63a9de;
	}
}



/* Navi links */
@media (min-width: 992px) {
	.mainmenu ul.navbar-nav .left-menu-heading {
		display: block;
		position: absolute;
		left: 0;
		top: 100%;
		/* margin-top: 93px; */
		/* NEU: background-color + padding 09.06.2021 Lue */
		/* background-color: #fff; */ /* wahrscheinlich unnötig aber störend beim dark mode 30.03.2022 Lue */
		margin-top: 78px;
		padding-top: 15px;
		padding-bottom: 15px;
		width: 280px;
		right: 680px;
		margin-left: auto;
		margin-right: auto;
		font-size: 1.55rem;
		font-weight: 400;
	}
		
	.mainmenu .navbar-nav .left-menu,
	.mainmenu .navbar-nav .left-menu ul {
		box-shadow: none !important;
		margin-top: 160px;
		width: 280px;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 680px;
		/* top: 100%; */
		top: calc(100% - 15px);
	}
	
	.mainmenu .collapse ul ul.left-menu ul {
		position: relative;
		top: 0;
		left: 0;
		margin-top: 0;
		padding-left: 0;
		box-shadow: none !important;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a {
		padding: 15px 30px 15px 11px;
		/* border-bottom: 1px solid #dee2e6; */
		border-bottom: 1px solid var(--hintergrunddrei);
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a::after {
		font-family: "Font Awesome 6 Pro";
		font-weight: 900;
		content: "\f054";
		border: none;
		/* color: #046aa2; gs20200713 */
		color: var(--logoblau); /* gs20200713 von REHADAT Naviblau zu Elan-Logo-blau */
		font-size: 18px;
		position: absolute;
		top: 15px;
		right: 10px;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li:hover > a::after, 
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a:focus::after,
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a:active::after {
		color: #fff;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a.active {
		color: #fff;
		background-image: linear-gradient(44deg, rgba(2,64,127,0.9), rgba(4,106,162,0.9)); /* gs20201117 wieder eingesetzt */
		/* background-image: linear-gradient(44deg, rgba(105,3,54,0.9), rgba(151,28, 28,0.9)); gs20200625 herausgenommen */
		/* background-image: linear-gradient(44deg, rgba(105,3,54,0.9), rgba(221,0,0,0.9)); gs20201117 herausgenommen */
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a.active::after {
		content: "\f078";
		color: #fff;
	}
	
	.mainmenu .collapse ul ul > li:hover > a, 
	.mainmenu .collapse ul ul > li:focus > a, 
	.mainmenu .collapse ul ul > li > a:focus, 
	.mainmenu .collapse ul ul > li > a:active, 
	.mainmenu .collapse ul ul ul > li:hover > a, 
	.mainmenu .collapse ul ul ul > li:focus > a, 
	.mainmenu .collapse ul ul ul > li > a:focus, 
	.mainmenu .collapse ul ul ul > li > a:active {
		color: #fff;
		/* background-image: linear-gradient(44deg, rgba(105,3,54,0.9), rgba(151,28, 28,0.9)); gs20200625 herausgenommen */
		/* background-image: linear-gradient(44deg, rgba(105,3,54,0.9), rgba(221,0,0,0.9)); gs20201117 herausgenommen */
		background-image: linear-gradient(44deg, rgba(4,106,162,0.9), rgba(2,64,127,0.9)); /*gs20201117 neu */
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a {
		/* width: 270px; */
		font-weight: 400;
		padding-top: 10px;
		padding-bottom: 0;
		padding-left: 20px;
		border-bottom: none;
		border-top: none;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li:last-child > a {
		/* border-bottom: 1px solid #dee2e6; */
		border-bottom: 1px solid var(--hintergrunddrei);
		padding-bottom: 15px;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:hover,
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:focus,
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:active,
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a.active {
		/* color: #046aa2; gs20200713 */
		color: var(--logoblau); /* gs20200713 von REHADAT Naviblau zu Elan-Logo-blau */
		background: var(--hintergrund);
		text-decoration: underline;
	}
	
	@media (prefers-color-scheme: dark), (inverted-colors: inverted) {
		.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:hover,
		.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:focus,
		.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:active,
		.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a.active {
			color: var(--ikone);
			background: #171717;
		}
	}
	
	
	
	
	/* Bei Folgeseiten (=alles, was nicht Homepage ist) Platz für die linke Navigation lassen */
	main.followingpage {
		max-width: 960px;
		margin: 0 auto;
		padding: 0 5px 0 325px;
	}
	
	.single-col, 
	.single-col-short {
		width: 630px;
		padding: 0;
		margin: 0;
	}
}



@media (min-width: 1200px) {
	.mainmenu ul.navbar-nav .left-menu-heading {
		right: 860px;
	}
	
	.mainmenu .navbar-nav .left-menu, 
	.mainmenu .navbar-nav .left-menu ul {
		right: 860px;
	}
	
	main.followingpage {
		max-width: 1140px;
		padding: 0 15px 0 375px;
	}
	
	.single-col, 
	.single-col-short {
		width: 760px;
		padding: 0 0 0 15px;
	}
}