* { margin: 0; padding: 0; border: 0; box-sizing: border-box; font-family: Georgia, serif; line-height: 1.5em;}

body { background-color: grey; opacity: 0.1; }

h1 { font-size: 30px; font-family: sans-serif; }
h2 { font-size: 21px; font-family: sans-serif; }
p { font-size: 15px; }
a { color: rebeccapurple; text-decoration: none;}

.page { width: 100%; max-width: 1100px; margin: 0 auto; background-color: #fcfcfc; padding-bottom: 100px;}

.header { display: block; width: 100% ;max-width: 1100px; margin: 0 auto; padding-top: 0px;height: fit-content ;border-bottom: 2px solid #eee;background-color: #fcfcfc; position: fixed; top: 0px;overflow: hidden; z-index: 10;}

.nameFromPics { display: block; width: 975px; height: 720px; margin: 0 auto;background-color: none; position: relative; }

.nameFromPics .word { display: block; text-align: left; height: fit-content; position: absolute;}

.nameFromPics .word.inka { top: 0px; left: 0px; }
.nameFromPics .word.perl { top: 350px;right: 0px; }

.nameFromPics .word.inka .letter { display: inline-block; height: 350px; vertical-align: top; }
.nameFromPics .word.perl .letter { display: inline-block; height: 350px; vertical-align: bottom; }

.nameFromPics .word .letter img { height: 100%; position: relative; filter: drop-shadow(5px 5px 4px #ccc);}

.content { background-color: #fcfcfc; position: relative; padding-bottom: 1px;}

.spaceblock { height: 900px; background-color: #fcfcfc;}

.introtext { text-align: left; background-color: #fcfcfc; float: right;width: 45%;margin-top: 20px; color: mediumpurple;padding-right: 120px;}

.aktuelles { padding-top: 0px; margin: 0 auto; width: 100%; background-color: #fcfcfc; min-height: 500px;}
.aktuelles .text { float: right; color: mediumpurple; padding-top: 350px; width: 60%;padding-right: 120px; text-align: right;}
.aktuelles .text h1 { margin: 20px 0; }
.aktuelles .text p { margin: 20px 0; }/*text-shadow: 2px 2px 4px #ccc;}*/
.aktuelles .imgwrap { float: left; position: sticky; top: 0px; z-index: 10; margin-left: 120px; height: 100px;}
.aktuelles .imgwrap img { position: absolute; top: -70px; width: 600px; left: 0px;}

.clearfix { clear: both; }

.menu { float: left; padding-left: 50px; display: flex; flex-wrap: wrap; justify-content: space-around; margin: 100px auto 0; width: 66%; background-color: #fcfcfc;}
.menu a { margin: 0% 5% 2%;width: 40%; height: 280px; display: flex; align-items: center; justify-content: center;}
.menu a img { display: block; }

.menu2 { display: flex; flex-wrap: wrap; justify-content: space-around; margin: 100px auto; width: 33%; background-color: #fcfcfc;}
.menu2 ul { display: flex; flex-flow: column; flex-wrap: wrap; list-style: none; width: 60%; height: 100%;}
.menu2 ul li { display: block; border: 1px solid #ccc; padding:25px; margin: 10px; font-size: 17px; }


@media only screen and (max-width: 1200px) {
	.header {padding-top: 50px;}
	h1 { font-size: 80px; }
	h2 { font-size: 55px; }
	p { font-size: 40px; }
	.introtext { width: 90%; margin-bottom: 50px;}
	.aktuelles .text { width: 90%;}
	.aktuelles .imgwrap { height: 900px; position: relative; top: 150px;margin-bottom: 00px;}
	.aktuelles .imgwrap img { width: 900px; }

	.menu { width: 95%; }
	.menu a { width: 40%; height: 400px; display: flex; align-items: center; justify-content: center;}
	.menu2 { padding-top: 100px;width: 80%;}
	.menu2 ul { width: 100%; height: 600px; }
	.menu2 ul li { font-size: 40px; padding: 30px;}
}