html { height:95%; font-family:Verdana,sans-serif; font-size:14px; }

body { height:100%; padding:0.0cm; background: #fdfdfd; }
body { margin-left:2.5%; margin-right:2.5%; margin-bottom:0px; }

#headline                  { border-bottom: 1px solid #b0b0b0; text-align: center; }
#headline    li            { display:inline; list-style:square; }
#headline    a             { color:#505050; font-weight:bold; font-style:italic; text-decoration: none; }
#headline    a.selected    { color:#c04010; }
#headline    a:hover       { color:white; background-color:darkblue; }
#headline    li.selected   { color:darkorange; }
#headline    li.mainlevel  { font-weight:bold; line-height:100%; }

#hauptmenue                { padding-bottom:0px; margin-left:-20px; }

#firmenlogo                { padding-top:20px; padding-right:10px; padding-left:10px; padding-bottom:20px; }

#inhalt                    { background:#fbfbfb; border:1px solid #808080; clear:both; }
#inhalt                    { border-radius:5px; }
#inhalt                    { color:#505050; }
#inhalt                    { padding-right:2.5%; padding-bottom:2.5%; padding-top:2.5%; padding-left: 2.5%; }
#inhalt                    { margin-bottom:2.5%; }

@media only screen and ( min-width: 1451px ) {

#headline    li            { margin-right:14px; font-size:14px; }
#headline    li.selected   { }
#headline    li.mainlevel  { font-size:18px; }

#headline    ul            { margin:0px; padding-top:0px; padding-bottom:10px; }

.selecttable { width:100%; border:thin solid grey; border-collapse: collapse; background: #f9f9f9; }
.selecttable { font-size:11px; }
.selecttable a  { font-size:11px; }
.selecttable th { text-align:right; vertical-align: top; }
.selecttable td { border:thin solid grey; vertical-align: top; }
.selecttable input    { font-size:11px; }
.selecttable select   { font-size:11px; }
.selecttable textarea { font-size:11px; }
.selecttable button   { font-size:11px; }

}

@media only screen and ( min-width: 1101px ) and ( max-width: 1450px ) {

#headline                  { position:absolute; border:none; width:295px; }

#firmenlogo                { position:absolute; top:0px; left:0px; }

#hauptmenue                { position:absolute; top:85px; left:20px; }

#headline                  { text-align:right; left:10px; }

#headline    li            { margin-right:0px; font-size:14px; }
#headline    li            { margin-left:-58px; display:block; line-height:140%; }
#headline    li.selected   { }
#headline    li.mainlevel  { font-size:18px; }
#headline    li.mainlevel  { line-height:120%; }

#headline    ul            { margin:0px; padding-top:10px; padding-bottom:10px; }

#headline    ul            { padding-top:10px; border-top: 1px dashed grey; }

#headline    ul            { padding-left:85px; width:125px; }

#status                    { float:right; clear:none; }

.selecttable { width:100%; border:thin solid grey; border-collapse: collapse; background: #f9f9f9; }
.selecttable { font-size:12px; }
.selecttable a  { font-size:12px }
.selecttable th { text-align:right; vertical-align: top; }
.selecttable td { border:thin solid grey; vertical-align: top; }
.selecttable input    { font-size:12px; }
.selecttable select   { font-size:12px; }
.selecttable textarea { font-size:12px; }
.selecttable button   { font-size:12px; }

}

@media only screen and ( min-width: 801px ) and ( max-width: 1100px ) {

#headline    li            { margin-right:12px; font-size:12px; }
#headline    li.selected   { }
#headline    li.mainlevel  { font-size:14px; }

#headline    ul            { margin:0px; padding-top:0px; padding-bottom:10px; }

.selecttable { width:100%; border:thin solid grey; border-collapse: collapse; background: #f9f9f9; }
.selecttable { font-size:11px; }
.selecttable a  { font-size:11px; }
.selecttable th { text-align:right; vertical-align: top; }
.selecttable td { border:thin solid grey; vertical-align: top; }
.selecttable input    { font-size:11px; }
.selecttable select   { font-size:11px; }
.selecttable textarea { font-size:11px; }
.selecttable button   { font-size:11px; }

}

@media only screen and ( min-width: 801px ) {

#headline                  { }

/*
#headline    ul            { margin:0px; padding-top:0px; padding-bottom:0.5vw; }
*/

/*
#headline    ul            { margin:0px; padding-top:0px; padding-bottom:10px; }
*/

/*
#headline    li            { margin-right:1.4vw; font-size:0.8vw; }
#headline    li.selected   { }
#headline    li.mainlevel  { font-size:1.1vw; }
*/

/*
#headline    li            { margin-right:18px; font-size:14px; }
#headline    li.selected   { }
#headline    li.mainlevel  { font-size:18px; }
*/

#hauptmenue                { float:left; min-height:100px; padding-top:25px; }

#firmenlogo                { float:right; }

#login                     { display:none; }

#status                    { text-align: center; color:green; clear:both; }
#status                    { padding-top:0px; padding-bottom:0px; }

}

@media only screen and ( max-width: 800px ) {

#headline                  { min-width:380px; }
#headline    ul            { padding-left:0px; }

#headline    li            { font-size:11px; line-height:250%; }
#headline    li            { border: 1px solid #d0d0d0; border-radius:5px; background:#f5f5f5; padding:2px; }
#headline    li            { margin-left:5px; margin-right:5px; margin-bottom:2px; }
#headline    li.selected   { }
#headline    li.mainlevel  { display:block; letter-spacing: 0.01em; font-size:16px; width:145px; line-height:140%; }

#hauptmenue                { float:left; padding-top:0px; }

#hauptmenue                { padding-left:20px; }

#firmenlogo                { position:absolute; right:5px; z-index:1; }

#login                     { display:inline; position:absolute; right:5px; z-index:1; }
#login                     { padding-top:102px; padding-right:10px; padding-left:10px; padding-bottom:20px; }
#login                     { text-align:right; font-style:normal; font-weight:normal; }

#status                    { display:none; }

}

@media only screen and ( max-width: 800px ) {

.selecttable { width:100%; border:thin solid grey; border-collapse: collapse; background: #f9f9f9; }
.selecttable { font-size:2.0vw; }
.selecttable a  { font-size:2.0vw; }
.selecttable th { text-align:right; vertical-align: top; }
.selecttable td { border:thin solid grey; vertical-align: top; }
.selecttable input    { font-size:2.0vw; }
.selecttable select   { font-size:1.8vw; }
.selecttable textarea { font-size:1.2vw; }
.selecttable button   { font-size:1.8vw; }

}

@media only screen and ( min-width: 1451px ) {

/*
#inhalt                    { float:left; width:80%; min-width:80%; }

#inhalt                    { min-height:94%; }

#inhalt                    { margin-top:0px; margin-left:214px; }

#inhalt                    { padding-left:1%; padding-right:1%; padding-top:1%; padding-bottom:1%; }
*/

#inhalt                    { min-height:80%; width:min-content; min-width:95%; }

img.indexlogo              { padding:20px; width:50%; }

img.sheet                  { width:45%; box-shadow: 5px 5px 2.5px lightgrey; margin-bottom:20px; margin-left:10px; margin-right:10px; }

div.board                  { margin-top:20px; margin-bottom:20px; overflow:auto; }
div.first                  { float:right; width:33%; height:280px; padding-top:20px; padding-bottom:20px; }
div.bulletin               { float:right; width:30%;               padding-top:20px; padding-bottom:20px; border-left: 2px dashed lightgrey; border-right: 2px dashed lightgrey; }
div.second                 { float:left;  width:33%; height:280px; padding-top:20px; padding-bottom:20px; }

}

@media only screen and ( min-width: 1101px ) and ( max-width: 1450px ) {

#inhalt                    { float:left; width:78%; min-width:78%; }

#inhalt                    { min-height:94%; }

#inhalt                    { margin-top:0px; margin-left:214px; }

#inhalt                    { padding-left:1%; padding-right:1%; padding-top:1%; padding-bottom:1%; }

img.indexlogo              { padding:20px; width:50%; }

img.sheet                  { width:45%; box-shadow: 5px 5px 2.5px lightgrey; margin-bottom:20px; margin-left:10px; margin-right:10px; }

div.board                  { margin-top:20px; margin-bottom:20px; overflow:auto; }
div.first                  { float:right; width:48%; height:280px; padding-top:20px; padding-bottom:20px; border-left: 2px dashed lightgrey; }
div.bulletin               { display:none; }
div.second                 { float:left;  width:48%; height:280px; padding-top:20px; padding-bottom:20px; }

}

@media only screen and ( min-width: 801px ) and ( max-width: 1100px ) {

#inhalt                    { min-height:80%; width:min-content; min-width:95%; }

img.indexlogo              { padding:20px; width:50%; }

img.sheet                  { width:45%; box-shadow: 5px 5px 2.5px lightgrey; margin-bottom:20px; margin-left:10px; margin-right:10px; }

div.board                  { margin-top:20px; margin-bottom:20px; overflow:auto; }
div.first                  { float:right; width:48%; height:280px; padding-top:20px; padding-bottom:20px; border-left: 2px dashed lightgrey; }
div.bulletin               { display:none; }
div.second                 { float:left;  width:48%; height:280px; padding-top:20px; padding-bottom:20px; }

}

@media only screen and ( max-width: 800px ) {

#inhalt                    { min-height:80%; width:min-content; min-width:95%; }

img.indexlogo              { padding:0px; width:80%; }

img.sheet                  { width:95%; box-shadow: 5px 5px 2.5px lightgrey; margin-bottom:20px; }

div.board                  { overflow:auto; }
div.first                  { float:left;  width:100%; padding-top:20px; padding-bottom:20px; border-bottom: 2px dashed lightgrey; }
div.bulletin               { float:right; width:100%; padding-top:20px; padding-bottom:20px; border-bottom: 2px dashed lightgrey; }
div.second                 { float:left;  width:100%; padding-top:20px; padding-bottom:20px; }

}

#inhalt p        { text-align:justify; }
#inhalt a        { color:darkblue; }
#inhalt ul       { font-weight:normal; padding-top:0px; padding-bottom:10px; }
#inhalt li       { padding-top: 4pt; padding-bottom: 0pt; }
#inhalt table    { color:#505050; }
#inhalt input    { background-color:#ececec; color:black; }
#inhalt h1,h2,h3 { font-family:Garamond; }
#inhalt h1:first-letter { font-size:larger; }

#bottomline                { display:none; }

a { font-weight:bold; text-decoration: none; }

.infotable { border-spacing:0; border:thin solid grey; width:98%; border-collapse: collapse; }
.infotable { font-size:1.4vw; }
.infotable th { background:#e0e0e0; text-align:left; vertical-align: top; border:1.0px solid grey; padding:3px; }
.infotable td { text-align:center; vertical-align: top; border:thin solid grey; }

.texttable { width:95%; }
.texttable { font-size: 1.4vw; }
.texttable th { text-align:left; vertical-align: top; border-bottom: 1.0px dashed lightgrey; }
.texttable td { vertical-align: top; border-bottom: 1.0px dashed lightgrey; }

.width input{ width:100%; }