@font-face {font-family: 'Mael'; src: url('assets/mael.ttf') format('truetype'); }
@font-face {font-family: 'Journal'; src: url('assets/journal.ttf') format('truetype'); }

html, body, div, span, object, iframe, 
h1, h2, h3, h4, h5, h6, p, a, b, u, i, center,
strike, strong, sub, sup, tt, var,
ol, ul, li, form, table, caption, tr, th, td,
article, aside, footer, header, menu, nav {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit;   vertical-align: text-top; }

body {line-height: 1; }
ol, ul {list-style: none; }
img.alignright {float: right; }
img.alignleft {float: left; }
img.aligncenter {clear: both; display: block; margin-right: auto; margin-left: auto; }
body {border-style: none; }

a, a:hover {text-decoration: none; border: none; border-style: none; box-shadow: none; }

/* ANIMATION */
@-webkit-keyframes fadein {from {opacity: 0; } to {opacity: 1; } }
@keyframes fadein {from {opacity: 0; } to {opacity: 1; } }
body { -webkit-animation: fadein 2s; animation: fadein 2s; }
.inhalt-haupt a { transition-duration: 0.5s; border-bottom: 1px dotted #848d96; }
.inhalt-haupt a:hover {transition-duration: 0.1s; border-bottom: 1px dotted #CA486d; }
.inhalt-fuss-gesamt .inhalt-fuss-teil ul li a { transition-duration: 0.5s; }
.inhalt-fuss-gesamt .inhalt-fuss-teil ul li a:hover { transition-duration: 0.1s; }

/* 
SEITENSTRUKTUR index-seite
flex-haupt
	flex-kind-bild
	flex-kind-inhalt
		inhalt-kopf
		inhalt-haupt
		inhalt-fuss
			inhalt-fuss-teil (für auflistung links)
			inhalt-fuss-teil-impressum

SEITENSTRUKTUR unterseiten

*/


/* DISPLAY */
header, footer, article, aside, menu, nav, section {display: block; }
.flex-haupt                   {width: 100vw; height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; }
.flex-haupt .flex-kind-bild   {width: 50%; height: 100vh; }
.flex-haupt .flex-kind-bild0  {width: 50%; height: 100vh; }
.flex-haupt .flex-kind-bild1  {width: 50%; height: 100vh; }
.flex-haupt .flex-kind-bild2  {width: 50%; height: 100vh; }
.flex-haupt .flex-kind-inhalt {width: 50%; min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: auto; }
.flex-haupt .flex-kind-inhalt .flex-kind-inhalt-vertikal-zentrieren {padding: 80px; max-width: 640px; margin-top: auto; margin-bottom: auto; }
.inhalt-fuss-gesamt .inhalt-fuss-teil {display: inline-block; }
@media (max-width: 800px)  {.flex-haupt {height: auto; -ms-flex-wrap: wrap; flex-wrap: wrap; } }
@media (max-width: 800px)  {.flex-haupt .flex-kind-inhalt {width: 100%; height: auto; } }
@media (max-width: 800px)  {.flex-haupt .flex-kind-bild {height: 80vh; width: 100%; } }
@media (max-width: 800px)  {.flex-haupt .flex-kind-bild0 {height: 80vh; width: 100%; } }
@media (max-width: 800px)  {.flex-haupt .flex-kind-bild1 {height: 80vh; width: 100%; } }
@media (max-width: 800px)  {.flex-haupt .flex-kind-bild2 {height: 80vh; width: 100%; } }


/* ABSTÄNDE */
.inhalt-haupt {padding: 20px 0 20px 0; }
.inhalt-fuss-gesamt .inhalt-fuss-teil {width: 30%; margin-bottom: 40px; }
.inhalt-fuss-gesamt .inhalt-fuss-teil ul li {margin-bottom: 12px; }
@media (max-width: 1200px) {.inhalt-haupt {padding: 15px 0; } }
@media (max-width: 800px)  {.inhalt-haupt {padding: 10px 0; } }
@media (max-width: 500px)  {.inhalt-fuss-gesamt .inhalt-fuss-teil {width: 90%; } }
@media (max-width: 1200px) {.flex-haupt .flex-kind-inhalt .flex-kind-inhalt-vertikal-zentrieren {padding: 60px; } }
@media (max-width: 800px)  {.flex-haupt .flex-kind-inhalt .flex-kind-inhalt-vertikal-zentrieren {padding: 40px; } }


/* BILDER */
.flex-kind-bild   {background-image: url("assets/bgrnd_left.jpg"); background-position: center center; background-size: cover; }
.flex-kind-bild0  {background-image: url("assets/bgrnd0.jpg"); background-position: center center; background-size: cover; }
.flex-kind-bild1  {background-image: url("assets/bgrnd1.jpg"); background-position: center center; background-size: cover; }
.flex-kind-bild2  {background-image: url("assets/bgrnd2.jpg"); background-position: center center; background-size: cover; }
.flex-kind-inhalt {background-image: url("assets/bgrnd_right.svg"); background-repeat: no-repeat;  background-size: contain; background-position: center center;}

/* FARBEN */
a                           {color: #49feec; }  /* Helles Türkisblau */
a:hover                     {color: #3be3e4; }  /* Helles Cyanblau */
html                        {background-color: #03076c; }  /* Sehr dunkles Blau (fast Schwarz) */
body                        {background-color: #03076c; color: #49feec; }  /* Dunkles Blau mit hellblauem Text */
.inhalt-kopf                {color: #3be3e4; }  /* Helles Cyanblau */
.inhalt-kopf h1             {color: #54c3d7; }  /* Weiches Türkis */
.inhalt-haupt p             {color: #54c3d7; }  /* Weiches Türkis */
.inhalt-haupt a             {color: #49feec; }  /* Helles Türkisblau */
.inhalt-haupt a:hover       {color: #3be3e4; }  /* Helles Cyanblau */
.inhalt-fuss-gesamt         {color: #54c3d7; }  /* Weiches Türkis */
.inhalt-fuss-teil a         {color: #49feec; }  /* Helles Türkisblau */
.inhalt-fuss-teil a:hover   {color: #3be3e4; }  /* Helles Cyanblau */
.inhalt-fuss-teil-impressum {color: #54c3d7; opacity: 0.5; }  /* Halbtransparentes Türkis */
.rot                        {color: #f21c01; }  /* intensives Rot */



/* SCHRIFT*/
body             { font-family: 'Mael', sans-serif; font-weight: 400; font-size: 21px; line-height: 33px; }
.inhalt-kopf     { font-size: 32px; line-height: 48px; }
.inhalt-kopf h1  { font-size: 58px; line-height: 58px; }
.inhalt-haupt    { font-family: 'Verdana', sans-serif; }
.inhalt-haupt h3 { font-family: 'Journal', sans-serif; font-size: 42px; line-height: 30px; }
.inhalt-anmrkg   { font-family: 'Verdana', sans-serif; font-size: 11px; line-height: 14px; }

.inhalt-fuss-gesamt {font-family: 'Arial', sans-serif; font-size: 11px; line-height: 11px; }
.inhalt-fuss-gesamt .inhalt-fuss-teil h3 {font-size: 11px; line-height: 11px; }
.inhalt-fuss-gesamt .inhalt-fuss-teil ul li {font-size: 16px; line-height: 16px;  }