body { background-color: black; }
p { color: white; font-size: 10px; font-family: Monaco, verdana, geneva; line-height: 15px; }
td {}
#header { background-color: black; background-repeat: repeat; position: absolute; top: 0; left: 0; width: 100%; height: 105px; z-index: 2; }
#logo { position: absolute; top: 12px; left: 2px; width: 480px; height: 92px; z-index: 3; }
#image { background-image: url(../imgs/bg_01_dark.jpg); background-repeat: no-repeat; background-size:cover; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
#menu1 { color: #8d7426; font-size: 12px; font-family: courier, "courier new", monospace, geneva; font-weight: normal; font-style: normal; line-height: 12px; position: absolute; top: 140px; left: 40px; width: 100px; height: 200px; z-index: 2; }
#menu1 a:link { color: #dae1b8 ; font-size: 12px; font-family: courier, "courier new", monospace, geneva; line-height: 15px; text-decoration: underline; }
#menu1 a:hover { color: black !important; font-size: 12px; font-family: courier, "courier new", monospace, geneva; line-height: 15px; background-color: #dae1b8; text-decoration: none; }
#menu1 a:active { color: white ; font-size: 12px; font-family: courier, "courier new", monospace, geneva; line-height: 15px; }
#menu1 a:visited { color: #dae1b8 ; font-size: 12px; font-family: courier, "courier new", monospace, geneva; line-height: 15px; text-decoration: underline; }
#menu2 { color: #dae1b8; font-size: 10px; font-family: Monaco, verdana, geneva; font-weight: normal; line-height: 15px; text-decoration: none; text-align: left; position: absolute; top: 140px; left: 150px; width: 200px; height: 100%; z-index: 2; }
#menu2 a:link { color: white ; font-size: 10px; font-family: Monaco, verdana, geneva; line-height: 15px; text-decoration: none; }
#menu2 a:hover { color: olive ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; background-color: #dae1b8; text-decoration: none; }
#menu2 a:active { color: white ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; text-decoration: line-through; }
#menu2 a:visited { color: white; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; }
#middle { position: absolute; top: 50%; left: 50%; width: 434px; height: 514px; margin-top: -257px; margin-left: -217px; }
#menu3 { color: #dae1b8; font-size: 10px; font-family: Monaco, verdana, geneva; font-weight: normal; line-height: 15px; text-decoration: none; text-align: left; position: absolute; top: 140px; left: 370px; width: 200px; height: 100%; z-index: 2; }
#menu3 a:link { color: white ; font-size: 10px; font-family: Monaco, verdana, geneva; line-height: 15px; text-decoration: none; }
#menu3 a:hover { color: olive ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; background-color: #dae1b8; text-decoration: none; }
#menu3 a:active { color: white ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; text-decoration: line-through; }
#menu3 a:visited { color: white; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; }
#bild1 { color: #dae1b8; font-size: 10px; font-family: Monaco, verdana, geneva; font-weight: normal; line-height: 15px; text-decoration: none; text-align: left; position: absolute; top: 140px; left: 140px; width: 400px; height: 100%; z-index: 2; }
#bild2 { color: #dae1b8; font-size: 10px; font-family: Monaco, verdana, geneva; font-weight: normal; line-height: 15px; text-decoration: none; text-align: left; position: absolute; top: 140px; left: 550px; width: 400px; height: 100%; z-index: 2; }
#bild2 embed { min-height: 270px;}
#menu3d { color: #dae1b8; font-size: 10px; font-family: Monaco, verdana, geneva; font-weight: normal; line-height: 15px; text-decoration: none; text-align: left; position: absolute; top: 140px; left: 370px; width: 300px; height: 100%; z-index: 2; }
#menu3d a:link { color: white ; font-size: 10px; font-family: Monaco, verdana, geneva; line-height: 15px; text-decoration: none; }
#menu3d a:hover { color: olive ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; background-color: #dae1b8; text-decoration: none; }
#menu3d a:active { color: white ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; text-decoration: line-through; }
#menu3d a:visited { color: white; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; }
#menu3d2 { color: #dae1b8; font-size: 10px; font-family: Monaco, verdana, geneva; font-weight: normal; line-height: 15px; text-decoration: none; text-align: left; position: absolute; top: 140px; left: 690px; width: 300px; height: 100%; z-index: 2; }
#menu3d2 a:link { color: white ; font-size: 10px; font-family: Monaco, verdana, geneva; line-height: 15px; text-decoration: none; }
#menu3d2 a:hover { color: olive ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; background-color: #dae1b8; text-decoration: none; }
#menu3d2 a:active { color: white ; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; text-decoration: line-through; }
#menu3d2 a:visited { color: white; font-size: 10px; font-family:  Monaco, verdana, geneva; line-height: 15px; }

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    #logo { position: inherit; top: inherit; left: inherit; height: 92px; z-index: 3; max-width: 270px;}
    #logo img {width: 100%; height: auto; margin-left: -15px;}
    
    #image {z-index: -1;}
    
    #menu1 { position: absolute; margin-left: 5px; width: 85px; top: inherit; left: inherit;}
    #menu2 { float: right; position: inherit; width: calc( 100% - 95px );}
    #menu3, #menu3d, #menu3d2, #bild1, #bild2 { position: inherit; padding: 20px 0 0 0; display: block; overflow: auto; width: calc( 100% - 95px ); float: right;}
    #bild1 {padding-top: 0;}
    #bild1 img, #bild2 img { width: 100%; height: auto;}
    
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    #logo { position: inherit; top: inherit; left: inherit; height: 130px; z-index: 3; max-width: 360px;}
    #logo img {width: 100%; height: auto;}
    
    #image {z-index: -1;}
    
    #menu1 { position: absolute; padding-left: 40px; width: 130px; top: inherit; left: inherit; font-size: 14px; line-height: 16px;}
    #menu1 a:link { font-size: 14px; line-height: 16px;}
    #menu2, #bild1 { float: left; position: inherit; width: calc( 33% - 75px ); margin-left: 170px; font-size: 12px; line-height: 17px; padding-left: 20px; padding-right: 20px; box-sizing: border-box;}
    #menu3, #menu3d, #menu3d2, #bild2 { position: inherit; display: block; overflow: auto; width: calc( 33% - 75px ); float: left; font-size: 12px; line-height: 17px; padding-left: 20px; padding-right: 20px; box-sizing: border-box;}
    #menu3d2 { float: right;}
    #menu2 a:link , #bild1 a:link, #menu3 a:link, #menu3d a:link, #menu3d2 a:link, #bild2 a:link { font-size: 12px; line-height: 17px; }
    #bild1 {padding-top: 0;}
    #bild1 img, #bild2 img { width: 100%; height: auto;}
    #bild2 embed { min-height: 270px;}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    #bild2 embed { min-height: 380px;}
}