@import url('reset+.css');
html, body, section, aside, span, h1, h5, h6, p, a, img, figure, figcaption, address, form, footer, header, label, ul, li {
	margin: 0;
	padding: 0;
	border: 0 none;
	outline: 0 none;
	font-size: 100.01%;
	font-weight: normal;
	font: inherit;
	vertical-align: baseline;
	background-color: transparent;
}
header, ul, section, figure, figcaption, form, footer, h1, h5, h6, a, aside, details, address {
	display: block;
}
ul {
	list-style: none;
}
a {
	-webkit-text-decoration-skip: objects;
}
a:active, a:hover {
	outline-width: 0;
}
svg:not(:root) {
  overflow: hidden;
}
input {
	font-family: sans-serif;
	line-height: 1.15;
	overflow: visible;
}
[type=checkbox] {
	box-sizing: border-box;
	padding: 0;
}
input[type=checkbox], input[type=submit], input[type=button], button {
	margin: 0;
	padding: 0;
	border: 0 none;
	outline: 0 none;
}
input, select, a img {
	vertical-align: middle;
}
html {
	height: 100%;
	font-family: sans-serif;
	line-height: 1.15;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	background-color: #597eab;
	background-image: linear-gradient(#1a2533, #476488);
	background-attachment: fixed;
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}
:root {
	font-size: 16px;
}
:root {
	font-size: 16px;
	--font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', "Segoe UI Emoji", "Segoe UI Symbol", 'San Francisco', "Apple Color Emoji", 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', Helvetica, 'Helvetica Neue', sans-serif;
}
body {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	line-height: 1;
	font-family: var(--font);
	color: #06274F;
}
h1 {
	position: relative;
	font-size: 2rem;
	font-weight: 100;
}
h1 span {
	font-size: 61.8%;
}
h1 a {
	padding: 6vw 9.6% 7vw 0;
	text-align: right;
	font-size: calc(2rem + 2.2vw);
	color: rgba(255, 255, 255, .7);
	letter-spacing: .08em;
	white-space: nowrap;
	filter: drop-shadow(4px 7px 4px currentColor);
	z-index: 2;
	transition: all 1s linear .2s;
}
header:hover h1 a {
	color: rgba(255, 255, 255, 1);
	text-shadow: 0 0 0 transparent, 0 0 8px white;
	transition: all .5s linear .2s;
}
address {
	font-family: Georgia;
	font-size: calc(1rem + .3vw);
	font-style: italic;
}
h5 {
	font-family: Georgia;
	font-size: calc(.83rem + .3vw);
	font-style: italic;
	margin: 0 1em;
	unicode-bidi: bidi-override;
	direction: rtl;
	color: #aaa;
}
h6 {
	font-family: "Courier New", Courier, monospace;
	font-size: calc(.67rem + .3vw);
	font-style: italic;
	text-align: end;
	color: black;
	display: none;
}
p {
	text-align: justify;
	-ms-hyphens: auto;
	hyphens: auto;
	text-rendering: optimizeLegibility;
}
a {
	color: #06274F;
	text-decoration: none;
	transition: color .5s;
}
footer a {
	font-size: calc(.9167rem + .3vw);
}
a:hover {
	transition: color .5s;
}
a:focus-visible, button:focus-visible {
	outline: 1px solid #FFE27A;
}
img {
	height: auto;
	width: 100%;
	min-width: inherit;
	vertical-align: middle;
}
::-moz-selection {
	background-color: transparent;
}
::selection {
	background-color: transparent;
}
@keyframes blink_hell { 
    20% { color: white; }
    70% { color: black; }
}
@keyframes blink_dunkel { 
    20% { color: black; }
    70% { color: white; }
}
p {
	text-indent: 1em;
}
header {
	position: relative;
	height: calc(50px + 18.5vw);
	max-height: 300px;
	background-image: url('../img/foto02.jpg');
	background-size: 105%;
	background-position: center center;
	background-repeat: no-repeat;
	overflow: hidden;
	box-shadow: 0 0 0 transparent, inset 20px 0 100px 20px rgba(0, 0, 0, 0.5), inset 0 -10px 60px rgba(0, 0, 0, 0.5), 0 8px 8px -3px rgba(0, 0, 0, 0.5);
}
input[type=checkbox], input[type=checkbox]:checked {
	display: none;
}
label {
	display: block;
	position: relative;
	cursor: pointer;
}
input[type=checkbox]:hover ~ ul, input[type=checkbox]:focus ~ ul, input[type=checkbox]:checked ~ ul {
 	visibility: visible;
	opacity: 1;
	transition:  all .5s ;
}
label:after {
	position: absolute;
	top: 0;
	right: 0;
	margin-top: -1rem;
	height: 4rem;
	line-height: 4rem;
	width: 38.2%;
	background-color: #4E459D;
	background-image: linear-gradient(#6C63B5, #4E459D 40%, #342A8A);
	border-radius: 4px 0 0 38.2%;
	text-align: center;
	color: white;
	content: 'Menü ☰';
	box-shadow: 0 0 0 transparent, -2px 2px 6px rgba(0, 0, 0, 0.3);
	z-index: 6;
	transition: all 0.5s;
}
label:hover:after {
	background-color: #6C63B5;
	background-image: linear-gradient(#6C63B5, #4E459D 80%, #342A8A);
	box-shadow: 0 0 0 transparent, -2px 2px 6px rgba(0, 0, 0, 0.5);
	content: 'öffnen';
	transition: all 0.5s;
	z-index: 5;
}
#sub + label:after {
	top: 0;
	width: 38.2%;
	font-size: large;
}
#sub + label:hover:after {
	font-size: small;
}
input:checked + label:after {
	content: 'Menü ✗';
}
input:checked:hover + label:after {
	content: 'schließen';
}
ul {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 0;
	visibility: hidden;
	opacity: 0;
	z-index: 3;
	transition: all 1s .2s;
}
li a {
	line-height: 3em;
	font-size: calc(1.0833rem + .3vw);
	padding-left: 38.2%;
	color: white;
	text-shadow: 0 0 0 transparent, 0 0 12px 1px rgb(255, 247, 219);
	box-shadow: 0 0 0 transparent, 1px 4px 6px -2px rgba(0, 0, 0, 0.5);
	background-color: #6C63B5;
	background-image: linear-gradient(#A9A4DA, #9890DA 40%, #6C63B5);
	transition: all .2s;
}
li a:hover {
	color: white;
	background-color: #9890DA;
	background-image: linear-gradient(#A9A4DA, #9890DA 80%, #6C63B5);
	animation: blink_hell .8s 1 ease;
	transition: all .2s;
}
section {
	margin: 0 auto;
	width: 98%;
	display: flex;
	flex-direction: column;
}
@-webkit-keyframes ecke {
    0%   { opacity: 1; }
    25%  { opacity: 1; }
    75%  { opacity: .2; }
    100% { opacity: 1; }
}
@keyframes ecke {
    0%   { opacity: 1; }
    25%  { opacity: 1; }
    75%  { opacity: .2; }
    100% { opacity: 1; }
}
.ecke {
	position: relative;
	display: inline-block;
	height: 0;
	width: 0;
	margin-right: 1em;
	vertical-align: text-top;
	animation: ecke 2s 13;
	border-top: 9px solid transparent;
	border-bottom: 9px solid transparent;
	border-left: 9px solid #D5B8EA;
	filter: drop-shadow(4px 7px 2px silver);
}
footer {
	display: flex;
	flex-direction: column;
	text-align: center;
}
footer:after {
	content: '©Copyright Felix Gottlieb - Alle Rechte vorbehalten';
	font-family: "Courier New", Courier, monospace;
	font-size: small;
	font-style: italic;
	margin: 0 auto;
	padding: .5rem 0;
	color: black;
}
footer a {
	padding: 1em;
	overflow: hidden;
	color: #eee;
	background-color: rgba(255, 255, 255, .3);
	transition: all .5s ease-in-out;
}
footer:hover a {
	color: white;
}
footer a + a {
	margin-top: .2em;
}
form {
	position: relative;
	display: block;
	padding: .5em 2%;
	text-align: center;
	background-color: rgb(185, 202, 233);
	border-radius: 3px;
	box-shadow: 0 4px 12px -1px rgba(0, 0, 0, 0.3);
}
form p {
	font-size: calc(1rem + .3vw);
	line-height: 1.7em;
	margin: 0 1em;
	padding: 0 .5em;
}
textarea::-moz-selection {
	color: #601F8C;
	background-color: #dce4f4;
}
textarea::selection {
	color: #601F8C;
	background-color: #dce4f4;
}
input, textarea {
	width: 100%;
	max-width: 95%;
	padding: 0 .4em;
	background-color: #fffcf1;
	border: 0 none;
	border-radius: 3px;
	box-shadow: 0 2px 4px #ccc inset;
}
input {
	height: 1.9em;
	line-height: 1.9em;
}
textarea {
	height: 7em;
	text-align: justify;
	overflow: hidden;
}
input:focus, textarea:focus {
	background-color: #fff;
	outline: none;
}
button {
	height: 3em;
	margin-top: .5em;
	padding: 0 1em;
	color: white;
	background-color: #224E82;
	background: linear-gradient(to bottom, #a6b8cd, #224E82 40%, #0d1f34);
	border-radius: 8px;
	cursor: pointer;
	transition: all .2s linear;
}
button:hover {
	background-color: #a6b8cd;
	background: linear-gradient(to bottom, #a6b8cd, #224E82 80%, #0d1f34);
	transition: all .2s linear;
}
button + button {
	margin-left: .2em;
}
form figure {
	float: left;
	margin: .5em 0;
	max-width: 99%;
	overflow: hidden;
	box-shadow: 1px 4px 6px -2px rgba(0, 0, 0, 0.5);
}
address {
	margin-top: 1rem;
	white-space: nowrap;
	line-height: 3em;
	text-align: center;
	background-color: #EEF4FD;
	border-radius: 100px 100px 200px 200px / 1px 1px 1.5px 1.5px;
	box-shadow: 0 1px 6px -1px rgba(0, 0, 0, 0.3), 0 0 40px -8px rgba(0, 0, 0, 0.1) inset;
	transition: background-color 1s ease-in-out;
}
address br {
	display: none;
}
.uline {
	text-decoration: underline;
}
@media only screen and (min-width: 481px) {
p::-moz-selection {
	background-color: #FFF9EA;
}
p::selection {
	background-color: #FFF9EA;
}
label:before {
	position: absolute;
	right: 30%;
	z-index: 1;
	height: 1rem;
	width: 1rem;
	color: white;
	content: '';
	background-color: transparent;
	border-right: 1px solid;
	border-bottom: 1px solid;
	z-index: 7;
}
#sub + label:before {
	top: 20px;
	left: inherit;
	right: 6%;
	transform: rotate(45deg);
}
#sub:checked + label:before {
	top: 28px;
	transform: rotate(-135deg);
}
input + label:hover:before {
	transition: all .5s;
}
footer a {
	border-radius: 20%;
	background-color: rgba(0, 0, 0, .1);
	transition: all .5s;
}
footer a:hover {
	background-color: rgba(0, 0, 0, .2);
	animation: blink_dunkel .8s ease 1;
	transition: all .5s;
}
}
@media screen and (min-width: 831px) {
label:after {
	width: 42.7%;
	padding-right: 19.1%;
	content: '';
	background: none transparent;
	box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
input:checked + label:after {
	content: '';
}
#sub + label:before, #sub + label:after {
	display: none;
}
ul {
	flex-direction: row;
	justify-content: space-between;
	height: auto;
	visibility: inherit;
	opacity: inherit;
}
li a {
	padding: inherit;
	width: calc(25vw - 1px);
	max-width: 319px;
	text-align: center;
}
.uline {
	white-space: pre-wrap;
}
section {
	flex-direction: row-reverse;
	justify-content: space-between;
}
.mit_sidebar {
	width: 61.8%;
	padding: 1em 0 .6em;
	margin-bottom: 10px;
}
aside {
	width: 37.2%;
}
footer {
	flex-direction: row;
	align-items: center;
	justify-content: space-evenly;
}
footer a {
	width: calc(100vw / 3);
	margin: 0 1em;
	background-color: rgba(232, 238, 248, 0);
	background-image: linear-gradient(to right, rgba(254, 253, 252, 0) 0%, rgba(254, 253, 252, .6) 38.2%, rgba(254, 253, 252, 0));
	transition: all .5s;
}
footer a + a {
	margin-top: 0;
}
footer a:hover {
	background-color: rgba(232, 238, 248, .2);
	background-image: linear-gradient(to right, rgba(254, 253, 252, 0) 0%, rgba(254, 253, 252, 1) 38.2%, rgba(254, 253, 252, 0));
	transition: all .5s;
}
footer:after {
	display: none;
}
h6 {
	display: inherit;
}
}
@media only screen and (min-width: 1201px) {
h1 a {
	font-size: 3.65rem;
	padding: 4.5rem 9.6% 5.25rem 0;
}
li a {
	font-size: 1.3083rem;
}
form p, address {
	font-size: 1.225rem;
}
footer a {
	font-size: 1.1417rem;
}
h5 {
	font-size: 1.055rem;
}
h6 {
	font-size: .895rem;
}
li:first-child a, li:last-child a {
	border-radius: 4px 0 0 4px;
}
li:last-child a {
	border-radius: 0 4px 4px 0;
}
}
@media only screen and (min-width: 1921px) {
header + figure {
	border-radius: 19.2px;
}
}
@media screen and (prefers-color-scheme: light), (prefers-color-scheme: no-preference) {
html {
	background-image: linear-gradient(#597eab, #B9CEE7);
	background-attachment: fixed;
}
h5, h6 {
	color: #06274F;
}
}