@charset "UTF-8";

/*** Kopfbereich ***/

/*** Sprungmark Formatierung  ***/
.sprungmarken {
	padding: 0.111rem;
	position: absolute;
	background: #fff;
	left: 2.5%;
	transform: translateX(-300%);
	transition: transform 0.3s;
	border: 0.1111rem solid #34444c;
	z-index: 1;
}

#sprungmarke a:active, #sprungmarke a:focus,
#sprungmarke a:hover {
	text-decoration: underline;
	background-color: #476274;
	color: white !important;
}

header #kopf {
	margin: 0;
	display: block;
	text-overflow: ellipsis;
}

/*** Logo ***/
#kopf a {
	padding: 0 0.8333rem 0 0;
	display: inline-block;
	border: 0.1111rem solid transparent;
	color: black;
	border-radius: 0.25rem;
	margin: 0.8333rem 0.5556rem;
}

#title {
	font-family: Verdana;
	text-shadow: 0.1667rem 0.2777rem 0.1111rem rgba(150, 150, 150, .3);
}

#kopf h1 {
/* 	min-width: 6.8333rem;
 */	width: auto;
/* 	max-width: calc(100% - 10.5556rem); */
	vertical-align: middle;
	display: inline-block;
}

#kopf #title {
	font-size: 2.5rem;
	color: #476274;
	font-variant: small-caps;
	font-family: "Times News Roman", serif;
}

#kopfzeile .screen {
	display: none;
	position: fixed;
	z-index: 10;
	right: 0;
	top: 0.5556rem;
	margin: 0.5556rem 0 0 0;
	border-top: none;
	border-bottom: none;
	padding-top: 0;
	padding-bottom: 0;
	border-top: none;
}

#kopfzeile .screen a {
	background-color: white;
	border-bottom: 0.0556rem solid #476274;
	border-left: 0.0556rem solid #476274;
	border-radius: 0.2777rem 0 0 0.2777rem;
	border-top: 0.0556rem solid #476274;
	box-shadow: 0.2777rem 0.2777rem 0.2777rem #476274;
	color: #476274;
	margin: 0;
	padding: 0.2777rem;
	font-size: 1rem;
	text-decoration: none;
}

#kopf a:active,
#kopf a:focus,
#kopf a:hover {
	background-color: transparent;
	border: 0.1111rem dotted #476274;
	text-decoration: none;
}	

#kopfzeile .screen a:active, #kopfzeile .screen a:focus,
#kopfzeile .screen a:hover {
	text-decoration: underline;
	background-color: #476274;
	color: white !important;
}

/* nach unten Button */
.btnBottomEintritt {
	animation-duration: 0.25s;
	animation-fill-mode: both;
	animation-name: btnBottomEintritt;
}

/* Einblenden nach unten */
@keyframes btnBottomEintritt {
	from {
		opacity:0;
		transform: translate3d(0, 100%, 0);
	}

	to {
		opacity: 1;
	}
}

/* Ausblenden nach oben */
.btnBottomExit {
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: btnBottomExit;
}

@keyframes btnBottomExit {
	from {
		opacity:1;
	}

	to {
		opacity: 0;
		transform: translate3d(0, 100%, 0);
	}
}