/* ###################################
   ##  Large Devices, Wide Screens  ##
   ################################### */

/* Allgemein
-------------*/

	/* Anzeige-Steuerung
	---------------------*/

		.show-on-1180 {
			display: block;
		}

		.hide-on-1180 {
			display: none;
		}

	/* Hintergrundbild nach oben verschieben
	-----------------------------------------*/

		body {
			background-image: url("../../images/bgrfull-tablet.png");
		}

		.wrapper-container {
			margin-top: 180px;
		}

/* Headerlinks müssen relativ und mit höherem Index positioniert werden
* damit "Menü"-Button (Tablet-Viewport) nicht darüber liegt und Anklicken verhindert
-------------------------------------------------------------------------------------*/

	.headerlinks .languages,
	.headerlinks .tablet-search *,
	.headerlinks .printer {
		position: relative;
		z-index: 20;
	}

/* Suche im Headerlink
-----------------------*/

	.tablet-search {
		display: inline;
	}

/* Fontsize im Header
----------------------*/

	.fontsize {
		display: none;
	}

/* Logo-Position aktualisieren
-------------------------------*/

	.logo {
		top: 30px;
		left: -28px;
	}

	/* Menü-Öffnen-Button
	----------------------*/

		/* In der Tablet-Ansicht die blaue Leiste über das Logo positionieren
		----------------------------------------------------------------------*/

			.headerlinks {
				position: relative;
				z-index: 10;
				top: 0px;
			}

		.open-navigation-menu {
			display: block;
			position: relative;
			font-size: 20px;
			color: #FFFFFF;
			line-height: 50px;
			padding: 0;
			width: auto;
			cursor: pointer;
			text-align: center;
			text-transform: uppercase;
		}

			.open-navigation-menu img {
				display: none;
			}

	/* Wrapper-Abstand links und rechts
	------------------------------------*/

		.wrapper {
			width: 100%;
			padding: 0 10px 0 10px;
		}

		header {
			margin-left: -10px;
			margin-right: -10px;
		}

	/* To-Top Button mit Abstand nach rechts
	-----------------------------------------*/

		.gototop {
			right: 10px;
		}

	/* Linke Navigation ausblenden
	 * und rechten Hauptinhalt-Container auf volle Breite setzen
	-------------------------------------------------------------*/

		.sidebar-left {
			display: none;
		}

		.content-right {
			width: 100%;
		}

	/* Notfallbutton rechts oben positionieren
	-------------------------------------------*/

		.notfall {
			top: 115px;
			right: 0;
		}

/* Startseite
--------------*/

	/* Kachelüberschrift etwas kleiner
	-----------------------------------*/

		.tile-content h2 {
			font-size: 21px;	/* damit Kachel-Überschrift nicht 2 zeilig wird */
		}

/* Hauptnavigation
--------------------*/

	/* Button zum Öffnen der Hauptnavigation
	-----------------------------------------*/

	.nav-tablet-menubutton {
		display: block;
		position: relative;
		color: #FFFFFF;
		line-height: 50px;
		padding: 0;
		width: auto;
		cursor: pointer;
		text-align: center;
	}

		.nav-tablet-menubutton * {
			font-size: 20px;
		}

		/* Hover-Effekt: Grünfärben aller Elemente darin
		-------------------------------------------------*/

			.nav-tablet-menubutton:hover * {
				color: #8DD449;
			}

/* Hauptnavigation
-------------------*/

	header nav {
		/*display: none;*/
		position: absolute;
		top: 50px;
		width: 100%;
		background-color: #E4E4E4;
		padding: 10px;
		z-index: 3;
	}

		header nav ul {
			list-style-type: none;
		}

		header nav ul li {
			width: 100%;
		}

			header nav ul li a,
			header nav ul li a *{
				color: #666666;
			}

	/* Expander
	------------*/

		header nav ul .expander {
			display: inline-block;
			position: absolute;
			top: 0;
			right: 0;
			width: 45px;
			height: 36px;
			background-color: transparent;
			background-image: none;
			background-repeat: no-repeat;
			background-position: center center;
			cursor: pointer;
			border-bottom: 1px solid transparent; /* Damit der Rand 100% ein nimmt */
		}

		header nav ul .expander.closed {
			background-image: url("../../images/mainnav-closed-white.png");
		}

		header nav ul .expander.open {
			background-image: url("../../images/mainnav-open-white.png");
		}

		header nav > ul > li > a > .expander.open,
		header nav > ul > li > ul > li > a > .expander.open,
		header nav > ul > li > ul > li > ul > li > a > .expander.open {
			background-image: url("../../images/mainnav-open-gray.png");
		}

		header nav > ul > li > a > .expander.closed,
		header nav > ul > li > ul > li > a > .expander.closed,
		header nav > ul > li > ul > li > ul > li > a > .expander.closed {
			background-image: url("../../images/mainnav-closed-gray.png");
		}

	/* Allgemeine Styles für Einträge
	----------------------------------*/

		header nav ul a {
			display: block;
			position: relative;
			clear: both;
			border-top: 1px solid #FFFFFF;
			border-bottom: 1px solid #BFBFBF;
		}

		header nav ul a .text {
			display: block;
			padding: 10px;
			margin-right: 0;
			color: #000000;
		}

	/* Abstände
	------------*/

		/* 2.Ebene **/
		header nav ul li a {
			padding-left: 0px; /* Hier nicht 20px da immer ein 5px Rand links existiert */
		}

		/* 3.Ebene **/
		header nav ul ul li a {
			padding-left: 20px;
		}

		/* 4.Ebene **/
		header nav ul ul ul li a {
			padding-left: 40px;
		}

		/* 5.Ebene **/
		header nav ul ul ul ul li a {
			padding-left: 60px;
		}

		/* 6.Ebene **/
		header nav ul ul ul ul ul li a {
			padding-left: 80px;
		}

	/* Hintergrundfarben
	---------------------*/

		/* 1. Ebene */
		header nav ul li,
		header nav ul li > a .expander {
			background-color: #FFFFFF;
		}

		/* 1. Ebene Expender */
		header nav ul li > a .expander {
			background-color: #FFFFFF;
			#background-image: url("../../images/mainnav-closed-gray.png");
		}

		/* 2. Ebene */
		/*header > nav > ul > li.inpath,*/
		header nav ul ul li,
		header nav ul ul li > a .expander{
			background-color: #EFEFEF;
		}

		/* 3. Ebene **/
		header nav ul ul ul li,
		header nav ul ul ul li > a .expander {
			background-color: #E1E1E1;
		}

		/* 4.Ebene **/
		header nav ul ul ul ul li,
		header nav ul ul ul ul li > a .expander {
			background-color: #C8C8C8;
		}

	/* Hover-Effekt für alle Einträge
	----------------------------------*/

		header nav a:hover,
		header nav a:hover .text,
		header nav a:hover .expander,
		header nav a:hover i.fa,
		header nav li.current > a,
		header nav li.current > a .text,
		header nav li.current > a .expander {
			background-color: #8DD449;
			color: #FFFFFF;
		}

	/* Bilder für Schnelleinstieg ausblenden
	-----------------------------------------*/

		header nav a img {
			display: none;
		}

	/* Suche als Link ebenso ausblenden
	------------------------------------*/

		header nav .suche {
			display: none !important;
		}


/* Hauptmenü Tablet-Ansicht
--------------------------*/

@media only screen and (min-width : 481px) and (max-width : 1180px) {

	header nav {
		display: none;	/* Beim Betreten der Seite Menu nicht anzeigen */
		padding: 0;
		margin: 0;
	}

	/* Expander in der ersten Ebene ausblenden
	---------------------------------------------------------------------*/

		header nav.medweb > ul > li > a .expander {
			display: none;
		}

	/* Die Einträge der ersten Ebene werden als blaue Blöcke dargestellt
	---------------------------------------------------------------------*/

		header nav.medweb > ul > li {
			display: inline-block;
			width: calc(100% / 8);
			height: 70px;
			float: left;
			background-color: #0056A2;
			padding: 0;
		}

	/* Zentrierte Darstellung
	--------------------------*/

		header nav.medweb > ul > li > a {
			text-align: center;
		}

	/* Die Breite der Hauptelemente ergibt sich aus deren Anzahl
	-------------------------------------------------------------*/

		header nav.medweb > ul > li {
			width: 25%;	/* 4 Elemente nebeneinander plazieren */
		}

		@media only screen and (min-width : 960px) {
			header nav.medweb > ul > li {
				width: calc(100% / 8);	/* bei ausreichender Bildschirmbreite passen auch 8 Elemente nebeneinander */
			}
		}

	header nav.medweb > ul > li > a {
		height: 70px;
		padding: 20px 20px 0 20px;
		border: 0;
	}

	header nav.medweb > ul > li > a * {
		border: 0 !important;
	}

	header nav.medweb > ul > li > a .text {
		margin-right: 0;
		color: #FFFFFF;
		padding: 0;
	}

	/**
	 * Ab der 2.Ebene werden alle Untermenü-Punkte ausgeblendet,
	 * welche nicht im Pfad liegen
	 */

		header nav > ul ul {
			display: none;	/* Alle Ausblenden */
		}

		header nav > ul > li.inpath ul {
			display: block;	/* aktiven Pfad und darunter einblenden */
		}

		/**
		 * Das Sub-Menu muss absolute positioniert werden,
		 * damit es 100% Breite einnimmt
		 */

			header nav.medweb > ul > li.inpath > ul {
				position: absolute;
				top: 140px;
				left: 0;
				width: 100%;
			}

			/**
			 * Bei einzeiliger 1.Ebene wird die 2.Ebene etwas höher positioniert
			 */
			@media only screen and (min-width : 960px) {
				header nav.medweb > ul > li.inpath > ul {
					top: 70px;
				}
			}

	/* Abstände in der Tablet-Ansicht anpassen
	-------------------------------------------*/

		/* 3.Ebene **/
		header nav ul ul li a {
			padding-left: 10px;
		}

		/* 4.Ebene **/
		header nav ul ul ul li a {
			padding-left: 30px;
		}

		/* 5.Ebene **/
		header nav ul ul ul ul li a {
			padding-left: 50px;
		}

		/* 6.Ebene **/
		header nav ul ul ul ul ul li a {
			padding-left: 70px;
		}

	/* Schnelleinstieg-Menü
	------------------------*/

		.schnelleinstieg:hover > ul {
			display: block;
			position: absolute;
			top: 140px;
			right: 0;
			background-color: #FFFFFF;
		}

		/* Bei einzeiliger 1.Ebene wird das Schnelleinstiegmenue etwas höher positioniert
		----------------------------------------------------------------------------------*/

			@media only screen and (min-width : 960px) {
				.schnelleinstieg:hover > ul {
					top: 70px;
				}
			}

		.schnelleinstieg > ul li {
			background-color: #FFFFFF;
		}

		.schnelleinstieg > ul li a {
			border: 0;
		}

		.schnelleinstieg > ul li img {
			display: block;
		}

		header nav .schnelleinstieg li a span {
			padding: 0;
			margin: 0;
			border: 0;
		}

}

/* Schnelleinstieg-Menü wird standardmäßig ausgeblendet,
 * da es sonst beim Öffnen des Menüs in mobilem Viewport immer aufgeklappt erscheint
 ------------------------------------------------------------------------------------*/

	header nav .schnelleinstieg > ul {
		display: none;
		background-color: red;
	}

/* Bindestrich bei Schnelleinstieg ausblenden
----------------------------------------------*/

	.schnelleinstieg .text i {
		display: none;
	}

/* Das nonUKJ Mini-Menü ausblenden
-----------------------------------*/

	.nav-nonukj {
		display: none;
	}

/* non-UKJ: Position der blauen Hauptmenü-Leiste
-----------------------------------------*/

	.nonukj .nav-tablet-menubutton {
		position: absolute;
		top: 200px;
	}

	.nonukj header {
		background-color: #FFFFFF;
	}

	@media only screen and (min-width : 480px) {

		.nonukj .headerlinks {
			position: absolute;
			top: 0px;
			width: 100%;
		}

		.nonukj .nav-tablet-menubutton {
			position: relative;
			top: 0;
		}

		.nonukj header {
			height: 170px;
		}

		.nonukj header nav {
			top: 170px;
		}

			.nonukj header nav {
				top: 50px;
			}

			.logo-nonukj {
				position: absolute;
				top: 50px;
			}
			
			.logo-nonukj > a:last-child {
				width: 200%;
			}

			body {
				background-position: center 60px;
			}

			.nonukj body {
				background-position: center 110px;
			}

			.notfall {
				top: 160px;
			}

			.nonukj .notfall {
				top: 185px;
			}

			.wrapper-container {
				margin-top:  240px;
			}

	}

/* Aktuelles
-------------*/

	body.startseite .newslist article {
		overflow: hidden;
		min-height: 91px;
		padding-top: 11px;
	}

		body.startseite .newslist article p {
			height: 20px;
			overflow: hidden;
		}
