.floatleft {float:left;}
.floatright {float:right;}
.clear {clear:both;}

body, header, footer, .wrapper {
  margin: 0 auto; }

html {
  background: #000 
              url(../images/Kinski.jpg) 
              no-repeat
              top center 
              fixed;
  background-size: cover;
  width: 100%;
  height: 100%;
  padding:0; }

html.impr {
  background-image: url(../images/Kinski-Polizei.jpg); }
.impr header, .impr footer {
  background-color: #000; }

header, footer, .wrapper {
  padding: 1em 2em 0em 2em;
  max-width: 60em; }

header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;}

footer {
/*  position: sticky;
  -webkit-position: sticky;*/
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding-top:0.4em; }

.wrapper {
  padding-top: 10em; /*header nicht verdecken*/
  padding-bottom: 4em; /*footer nicht verdecken*/ }

nav {
/*  position: fixed;
  top: 5em;
  left:0;
  right: 0; */
  margin-top: 4.5em;
  text-align:right; }

main {
  display: block; /*Grund: IE 10 und 11 kennen main-Element nicht*/
  padding: 2em 0; }

article {}
aside {}
section {}


/* ****** FONTS + TYPO ****** */

body {
  font-family: ralewaylight, sans-serif;
  font-size: 1.05rem;
  line-height:1.35;
  color:#fff; }

h1, h2, h3, h4, h5, h6 {margin:1.2em 0 0.6em;}
h1, .h1, h3, .h3, h5, .h5 {
  font-family: momstypewriterregular, serif;}
h1, .h1 {font-size: 6.2rem; border:none !important;margin:0;}
h2, .h2 {font-size: 2.1rem; }
h3, .h3 {font-size: 1.6rem; }
h4, .h4 {font-size: 1.8rem; }
h5, .h5 {font-size: 1.4rem; }
h6, .h6 {font-size: 1.5rem; }
.small {font-size:65%;}

p, a, div, span, ul, ol {}
p, div, ul, ol {
  margin: 0;
  padding: 0 0 0.6em 0; }
a {
  color:#fff;
  text-decoration: none;
  border-bottom: .1em dashed #fff; }
a:visited { /* Deklarationen */ }
a:focus   { /* Deklarationen */ }
a:hover   {border-bottom:none; }
a:active  { /* Deklarationen */ }

ul, ol {
  padding-left:1.2em; }
li {
  padding-left:0.6em;
  padding-bottom:0.3em; }


/* ****** NAVIGATION MENU ****** */

ul.navi {
  padding-left:0;
  padding-right:0;}
ul.navimain {}
ul.navimain li {
  display:inline-block;
  padding-left:0;
  padding-right:1.6em; }
ul.navimain li:last-child {padding-right:0;}
ul.navimeta {}
ul.navimeta li {
  display:inline-block;
  padding-left:0;
  padding-right:1.6em;
  font-size:80%; }


/* ****** RESPONSIVE ****** */

/* ++++++ Medium Devices */
@media only screen and (min-width: 640px) and (max-width: 1024px) {
h1, a.h1 {font-size: 12vw;}
nav {margin-top: 9vw;}}


/* ++++++ Small Devices */
@media only screen and (max-width: 639px) {
h1, a.h1 {font-size: 15vw;}
nav {margin-top: 0vw;}
ul.navimain li {display:block;padding-right:0;line-height:2.0em;}
.navimeta a, .navimeta span {font-size:80%;}
.wrapper {padding-top:8em; padding-bottom:4em;}}



/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

@font-face { font-family: 'momstypewriterregular';
             src: url('../fonts/moms_typewriter-webfont.woff2') format('woff2'); }
@font-face { font-family: 'ralewaylight';
             src: url('../fonts/raleway-light-webfont.woff2') format('woff2'); }