
:root {
font-size:1em;
font-family:sans-serif;
color:#b0b0b0;
}

body
{
margin:0px;
background-repeat:no-repeat;
background-attachment:fixed;
background-position:left top;
background-color:#101010;
background-size:cover;
}

div#wrapper {
  margin: 0 auto;    /*  "auto"  =  mittig   */
  
  text-align:center;
  display: flex;
  flex-flow: row wrap;
}

img, iframe {max-width:100%;
     padding: 0;
     border:0px solid red;
}

iframe {
   width:100%;
   height:600px;

}

/* ausrichtung   */
.left {text-align:left;}
.center {text-align:center;}


article {
  width: 50em;
  margin: 0 auto;
  background:#101010;
  border:#BDB76B 0px solid;
  padding:1% 1% 17% 1%;
}

header {
  width: 50em;
  margin-top:0;
  padding:0;
  background:#101010;        
}

.sticky {
  position: sticky;
  bottom: 0; /* Element bleibt unten im Viewport */
}

footer {
  width:100%;
  margin:0;
  background:#101010;
  padding-top:10px;
  padding-bottom:10px;
  padding-left:3%;
  padding-right:3%;
  border:0px solid red;
}


nav {
   font-family:'arial';
   font-size:0.9em;
}

nav, nav ul, nav li {
  margin: 0;
  padding:0;
  border:none;
}

nav ul {
  display: flex;  
  flex-direction:row;
  flex-flow: row wrap;
  justify-content: center;
}

nav li {
  list-style-type:none;
  margin: 0px 0;
  padding-left:8px;
  padding-right:8px;
  padding-top:2px;
  padding-bottom:2px;
  
}

nav a {
  display:inline-block;
  width:100%;
  border: 0px solid red;
  margin: 0;
  font-family:"verdana",sans-serif;
}

nav a:link {color:#fe3939;border-color:#fe3939;}
nav a:visited {color:#fe3939;}
nav a:hover {color:#ffffff;text-decoration:none;background-color:#101010;}
nav a:active {color:#fe3939;}

/*   linien   */
hr{background-color:#b0b0b0; height:3px; border:0px;}

/* Smart Phones und Tablets mit mittlerer Auflösung */

@media all and (min-width: 600px) {
	
nav ul {
  flex-direction: row;
}

nav li {
  margin: 0 10px;
}	
}


/* Large screens */
@media all and (min-width: 800px) {
}



