body.main {
 overflow-y : scroll;
 overflow-x : hidden;
 text-align : center;
 padding : 0px;
 margin : 0px;
 background-image : url('../../media/bg.jpg'); /*linear-gradient(to bottom, #AAA 0px, #DDD 300px, #FFF 100%);*//*#DDCCFF;*/ /*#2E3436;*/
 background-attachment : fixed;
 background-position : right bottom;
 background-size : calc(100%) calc((100% - 150px) / 1182*1536);
}

@media (max-height: 650px) {
 body.main {
  background-position : right top;
  background-size : calc(100%) calc(150px / 354*1536);
 }
}

@media (max-width: calc(4/3*(100vh - 150px)/1182*1536)) {
 body.main {
  background-position : 70% bottom;
  background-size : auto calc((100% - 150px) / 1182*1536);
 }
}

@media (max-width: calc(4/3*(150px / 354*1536))) and (max-height: 650px) {
 body.main {
  background-position : 70% top;
  background-size : auto calc(150px / 354*1536);
 }
}

iframe {
 background-color : rgba(255, 255, 255, 0.7);
 border-radius : 4px;
}

.NoJsHeight {
 bottom : 0px;
}

#BoxAll {
 text-align : left;
 position : relative;
 top : 30px;
 display : inline-block;
 width : 80%;
 max-width : 1500px;
 min-width : 600px;
 padding-top : 130px;
 padding-bottom : 20px;
}
#BoxAll.NoJsHeight {
 min-height : calc(100vh - 190px);
}
#BoxCenter.NoJsHeight {
 height : calc(100vh - 190px);
}

#BoxTop {
 color : #000;
 font-family : 'Liberation Sans';
 position : absolute;
 vertical-align : bottom;
 height : 130px;
 top : 0px;
 width : 100%;
 display : block;
 margin-top : 0px;
}

#BoxTop hr {
 margin : 0px;
 position : absolute;
 bottom : 5px;
 border : 0px none transparent;
 height : 3px;
 left : 0px;
 right : 0px;
 background : linear-gradient(to right, transparent 0%, red 10%, red 90%, transparent 100%);
}

#BoxAnimations {
 position : absolute;
 font-size : 1.6em;
 top : 0px;
 right : 2vw;
 height : 100px;
 width : 200px;
}

#BoxAnimations .ani {
 position : absolute;
 top : 0px;
 right : 0px;
 height : 100%;
 display : none;
 white-space : nowrap;
}

#BoxCenter {
 position: relative;
 display : block;
 width : 100%;
 box-sizing : border-box;
 padding-left : 350px;
 padding-right : 30px;
}

#FrameBox {
 width : 100%;
 z-index : 3;
}
#FrameBox.NoJsHeight {
 height : 100%;
}
#FrameBox iframe {
 width : 100%;
 height : 100%;
 margin-right : -100%;
 float : left;
 border : 0px none white;
}





#BoxTop h1 {
 font-size : 3em;
 white-space : nowrap;
 margin : 0px;
 padding : 0px;
 font-weight : bold;
 margin : 0px;
 padding : 0px;
 margin-left : 10%;
 margin-top : 5px;
 color : red;
}

#BoxTop h2 {
 font-size : 2em;
 font-weight : normal;
 white-space : nowrap;
 margin : 0px;
 padding : 0px;
 margin-left : 20%;
 margin-top : 5px;
 color : red;
}





#BoxLeft {
 position : static;
 width : 300px;
 margin-left : -320px;
 float : left;
 overflow : hidden;
 white-space : nowrap;
}

#titelbild {
 width : 100%;
 display : inline-block;
 vertical-align : top;
 overflow : hidden;
 border-radius : 4px;
}

#inhaltsverzeichnis {
 margin : 0px;
 padding-top : 10px;
 position : relative;
 padding-left : 0px;
 width : 100%;
 display : none;
 vertical-align : top;
 white-space : normal;
 color : white;
 font-size : 10px;
}

#inhaltsverzeichnis .dateList {
 margin-left : 0px;
 padding-left : 0px;
}

#inhaltsverzeichnis .dateList .date {
 font-weight : bold;
 margin-left : 0em;
 width : auto;
 margin-right : 0.3em;
}

#inhaltsverzeichnis .dateList a {
 color : white;
}
#inhaltsverzeichnis ol li {
 font-weight : normal;
}
#inhaltsverzeichnis ol li a.active {
 font-weight : bold;
}

#inhaltsverzeichnis a {
 color : black;
 text-decoration : none;
 display : inline;
 padding : 0px;
}
#inhaltsverzeichnis a:link    {  }
#inhaltsverzeichnis a:visited {  }
#inhaltsverzeichnis a:focus   {  }
#inhaltsverzeichnis a:hover   { color : #F99; }
#inhaltsverzeichnis a:active  { color : #A00; }
#inhaltsverzeichnis a.active {
 color : red;
}


#BoxLinks {
 white-space : nowrap;
 text-align : center;
 position : absolute;
 bottom : 8px;
 left : 0px;
 right : 0px;
 font-size : 0px;
}
#BoxTop a.MenuLink {
 font-size: 13px;
 display : inline-block;
 color : red;
 padding-left : 10px;
 padding-right : 10px;
 padding-top : 0.15em;
 text-decoration : none;
 background-image : url('BahnUmriss_gray.svg#svgView(preserveAspectRatio(none))');
 width : 7em;
 height : 1.25em;
 background-size : 100% 100%;
 margin : 0px;
}
#BoxTop a:link    { }
#BoxTop a:visited { }
#BoxTop a:focus   { }
#BoxTop a:hover   { color : #FF8000; }
#BoxTop a:active  { color : #A00000; }
#BoxTop a.MenuLink.active {
 background-image : url('BahnUmriss.svg#svgView(preserveAspectRatio(none))');
 text-decoration : none;
 color : black;
 font-weight : bold;
 cursor : default;
}







@media handheld, screen and (max-width: 1200px) {
 body.main {
  padding-top : 0px;
 }

 #BoxLeft {
  width : 150px;
  margin-left : -170px;
 }

 #BoxCenter {
  padding-left : 170px;
  padding-right : 0px;
 }

 #BoxAnimations {
  font-size : 1.1em;
  height : 50px;
  top : 20px;
 }

 #BoxTop h1 {
  margin-top : 20px;
  font-size : 2em;
 }
 #BoxTop h2 {
  margin-top : 10px;
  font-size : 1.2em;
 }
}

@media handheld, screen and (max-width: 610px) {
 #BoxAll {
  width : 100%;
  min-width : 500px;
 }

 #BoxTop h1 {
  margin-left : 7%;
 }

 #BoxTop h2 {
  margin-left : 14%;
 }
}

@media handheld, screen and (max-width: 550px) {
 body.main {
  overflow-x : scroll;
 }

 #BoxLeft {
  width : 90px;
  margin-left : -100px;
 }

 #BoxCenter {
  padding-left : 100px;
  padding-right : 0px;
 }

 #BoxTop h1 {
  margin-left : 10px;
 }
 #BoxTop h2 {
  margin-left : 20px;
 }
}