* {
margin:0;
padding:0;
}

/* html + body */

html,
body {
background-image:url(../images/navi.png);
background-repeat:repeat-y;
background-position:left;
background-color:#eff6f9;
font-family:Arial,sans-serif;
}

/* inline global */

img {
border:none;
max-width: 100%; /* Anpassung */
height: auto; /* Anpassung */
}
a {
text-decoration:underline;
color:#00f;
}
a:hover,
a:focus {
text-decoration:none;
}
a:visited {
color:#006;
}
strong {
color:#333;
}
strong a {
color:#44f;
}
strong a:visited {
color:#55a;
}
.center {
text-align:center;
}
.clear {
clear:both;
}

/* content container */

#content {
padding:20px;
text-align:center;
}
.innen {
margin-bottom:20px;
padding:20px;
border:1px solid #77c;
background-color:#f9ffff;
text-align:left;
}
.innen > :last-child,
.innen > :last-child > :last-child {
margin-bottom:0;
}
.message {
margin-bottom:20px;
padding:30px;
border:1px solid #77c;
background-color:#f9ffff;
text-align:center;
}
.message p {
margin-bottom:0;
}
.infobox {
max-height:160px;
overflow:auto;
margin-bottom:20px;
padding:10px;
border:1px solid #77c;
background-color:#fff;
font-size:85%;
}

/* headings + paragraphs */

h1 {
margin-bottom:20px;
font-size:100%;
letter-spacing:0.25em;
color:#555;
}
.start h1 {
font-size:130%;
color:#666;
}
h2 {
margin:25px 0 10px;
font-size:95%;
letter-spacing:0.25em;
color:#555;
}
h1 a,
h2 a {
text-decoration:none;
color:#55f;
}
h1 a:visited,
h2 a:visited {
color:#66b;
}
h1 a:hover,
h1 a:focus,
h2 a:hover,
h2 a:focus {
text-decoration:underline;
}
h3 {
margin:20px 0 10px;
font-size:90%;
color:#555;
}
h2:first-child,
h3:first-child {
margin-top:0;
}
p {
margin-bottom:15px;
font-size:90%;
}

/* lists */

ol {
margin-bottom:15px;
padding-left:20px;
}
ul {
margin-bottom:15px;
text-indent:0;
list-style-type:none;
}
li {
margin-bottom:15px;
font-size:90%;
}
.sitemap ul ul {
margin:5px 0;
}
.sitemap li {
font-weight:bold;
color:#666;
}
.sitemap li li {
display:inline;
padding-right:15px;
line-height:180%;
font-weight:normal;
}

/* tables */

table {
margin-bottom:20px;
width:100%;
border:1px solid #77c;
text-align:left;
}
td,
th {
border-right:1px solid #77c;
border-bottom:1px solid #77c;
background-color:#f9ffff;
padding:5px;
font-size:90%;
}
th {
font-size:75%;
color:#555;
}
caption {
padding:5px;
border:1px solid #77c;
border-bottom:none;
background-color:#e6ecf3;
font-size:90%;
font-weight:bold;
letter-spacing:0.25em;
color:#555;
}
.col-forum {
width:18%;
}
.col-user {
width:18%;
}
.col-status {
width:18%;
text-align:center;
}
.col-zahl {
width:7%;
text-align:center;
}
.col-datum {
width:17%;
text-align:right;
}

/* forms */

.form,
form .innen {
margin:0 auto 20px;
width:507px;
}
input,
textarea,
select {
padding:3px;
border:1px solid #88a;
font-family:Arial,sans-serif;
font-size:100%;
}
button {
margin-bottom:5px;
padding:2px;
font-size:100%;
}
button img {
display:block;
}
textarea {
width:500px;
}
input {
max-width:500px;
}
.readonly {
border-style:dotted;
background-color:#fcffff;
}
.radio {
border:none;
}
.checkbox {
border:none;
}
.submitgroup {
width:100%;
font-size:90%;
}
.submit {
float:right;
margin-left:10px;
}
#bbcodebuttons {
width:300px;
}

/* submenus */

.submenu {
font-weight:bold;
color:#666;
}
.submenu a {
text-decoration:none;
color:#66f;
}
.submenu a:visited {
color:#77c;
}
.submenu a:hover,
.submenu a:focus {
text-decoration:underline;
}
p#top {
margin-top:5px;
padding:5px;
border:1px solid #77c;
background-color:#e6ecf3;
}
#bottomsubmenu {
margin:0 auto 20px;
width:320px;
border:1px solid #77c;
background-color:#f9ffff;
text-align:center;
}
#bottomsubmenu p {
margin:10px;
}
#bottomsubmenu a {
white-space:nowrap;
}

/* postings */

.innen .beitrag {
font-size:90%;
margin-bottom:15px;
}
.innen * .beitrag {
font-size:100%;
margin-bottom:0;
}
.name {
padding:5px;
border:1px solid #99d;
background-color:#eff6f9;
font-size:95%;
}
.name .anker {
float:right;
}
blockquote {
padding:20px;
border:1px dotted #77c;
background-color:#f3f9f9;
}
blockquote .name {
padding:5px;
border-style:dashed;
border-width:0 0 1px;
background-color:#f3f9f9;
}
pre {
overflow:auto;
padding:10px;
max-height:320px;
border:1px dashed #999;
background-color:#f9f9f6;
font-family:'Courier New',monospace;
font-size:100%;
}
code strong {
border:1px dotted #ccc;
background-color:#f3f3f9;
color:#422;
}
.video {
width:425px;
height:350px;
}
.signatur {
padding-top:10px;
border-top:1px dashed #77c;
}
.datum {
padding-top:5px;
border-top:1px solid #999;
text-align:right;
font-size:80%;
font-weight:bold;
color:#666;
}
.plus {
text-align:right;
}

/* user profiles */

.profile {
margin:0 auto 20px;
width:507px;
}
.profile img {
float:right;
max-width:120px;
max-height:120px;
}
.profile h2 {
margin-top:0;
}
.profile h3 {
clear:both;
}

/* navigation */

#header,
#content,
#footer {
margin-left:350px; /* Anpassung, war: margin-left:180px;*/
}

#navi {
position:absolute; /* Anpassung, war: position:fixed;*/
top:0;
left:0;
padding:20px 25px;
width:400px; /* Anpassung, war: width:130px;*/
/* Anpassung font-weight:bold;*/
}
h2#header_nav {
display:none;
}
#navi ul {
font-size:95%;
color:#555;
}
#navi ul ul {
margin-left:16px;
}
#navi li {
margin:10px 0;
font-size:100%;
}
#navi a {
text-decoration:none;
color:#44f;
}
#navi a:visited {
color:#55a;
}
#navi a:hover,
#navi a:focus {
text-decoration:underline;
}
#navi span.logo {                                                               
display:none;                                                                   
}

/* footer */

#footer {
padding:0 20px;
text-align:center;
font-size:90%;
}

/* RESPONSIVE */

@media (max-width:867px) { /* Anpassung, war: max-width:767px */
    html, body {
    background-image:none;
    }
    #content {
    padding:10px;
    }

    /* navigation */

    #header,
    #content,
    #footer {
    margin-left:0;
    }
    #navi {
	display:none; /* Anpassung */
     /*position:absolute;
    top:45px;
    padding:0 10px;
    width:100%;
    box-sizing:border-box;
    text-align:center;*/
    }
    #top { /* margin for #navi */
    margin-bottom:80px;
    }
    .start #navi {
    top:70px;
    }
    .start #description { /* margin for #navi */
    margin-bottom:95px;
    }
    #navinnen {
	display:none; /* Anpassung */
    /* margin:20px auto 0;
    padding:10px 10px 0;
    width:160px;
    border:1px solid #999;
    background-color:#f3f9fc; */
    }
    h2#header_nav {
    display:block;
    }
    ul#nav {
    display:none;
    }
    #navi ul {
    text-align:left;
    }
    #navi li {
    margin:16px 0;
    }
    #navi img.logo {                                                            
    display:none;                                                               
    }                                                                           
    #navi span.logo {                                                           
    display:inline;                                                             
    }
    #naviende {
    clear:left;
    line-height:0;
    }

    /* footer */

    #footer {
    margin-top:20px;
    padding:0 10px;
    }
}

@media (max-width:599px) {

    /* forms  */

    .form,
    form .innen, 
    .submitgroup,
    #bbcodebuttons {
    width:auto;
    }
    textarea {
    width:90%;
    }
    input {
    max-width:100%;
    }

    #bottomsubmenu {
    width:auto;
    }
    .video {
    max-width:100%;
    }
    .profile {
    width:auto;
    }
    .profile img {
    float:none;
    }

    /* tables */

    th {
    display:none;
    }
    td {
    display:block;
    }
    td br {                                                                     
    display:none;                                                               
    }
    td:first-child {                                                            
    background-color:#eff6fc;                                                   
    }
    td.col-datum,                                                               
    td.col-user,                                                                
    td.col-forum {                                                              
    width:auto;                                                                 
    text-align:left;                                                            
    }                                                                           
    td.col-datum:before,                                                        
    td.col-user:before,                                                         
    td.col-forum:before {                                                       
    content:'Forum: ';                                                          
    font-size:90%;                                                              
    color:#333;                                                                 
    }                                                                           
    td.col-datum:before {                                                       
    content:'Letzter Beitrag: '                                                 
    }                                                                           
    td.col-user:before {                                                        
    content:'Autor: '                                                              
    }                                                                              
    td.col-forum:before {                                                          
    content:'Forum: '                                                              
    }
    td.col-zahl,                                                                
    td.col-status {                                                             
    display:none;                                                               
    }
}