body{
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    background-image: url(../images/hintergrund.jpg);
    background-size: cover;
    background-attachment: fixed;
}
/* Kopfzeile */
header{
    -ms-user-select: None;
    -moz-user-select: None;
    -webkit-user-select: None;
    user-select: None;
}
header div.logo{
    text-align: center;
}
img.logo{
    max-width: 550px;
    width: 40%;
    padding: 8px;
    margin-top: 8px;
}
div.sitelogo{
    text-align: left;
    padding-left: 4px;
    padding-top: 4px;
    background-color: rgba(255, 255, 255, 0.541);
    line-height: 30px;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    visibility: hidden;
}
img.sitelogo{
    max-height: 25px;
}
/* Headerfixierung */
.fixed-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%; 
}
.visible-title {
    visibility: visible !important;
}
/* Navigation */
nav{
    -ms-user-select: None;
    -moz-user-select: None;
    -webkit-user-select: None;
    user-select: None;
    text-align: center;
    font-weight: bold;
    font-variant: small-caps;
}
div.navi{
    margin: auto;
    width: 100%;
    max-width: 600px;   /* Breite Abhängig von Anzahl Spalten x 150px */
}
ul#navigation, ul#navigation ul {
 margin: 0;
 padding: 0;
 list-style-type: None;
 height: 32px;
}
ul#navigation li {
 float: Left;
 width: 150px;   /* Breite Abhängig für Anzahl Spalten */
 position: Relative;
}
ul#navigation li a {
 display: Block;
 width: 149px;
 line-height: 30px;
 text-align: Center;
 color: #FFFFFF;
 text-decoration: None;
 background-color: #F50000;
 border: 1px Solid #FF0000;
 border-bottom: 0;
 transition: background-color 0.5s;
 box-shadow: 1px 1px 3px 1px #C0C0C0;
}
ul#navigation li a:hover,
 ul#navigation li a:active {
 background-color: #000000;
 cursor: Pointer;
}
ul#navigation li ul {
 opacity: 0.0;
 visibility: Hidden;
 position: Absolute;
 left: 0px;
 top: 31px;
 z-index: 100;
 transition: Opacity 1s;
}
ul#navigation li:hover > ul,
 ul#navigation li:active > ul {
 opacity: 1.0;
 visibility: Visible;
}
ul#navigation li ul a {
 background-color: rgba(255, 123, 0, 0.81);
}
ul#navigation li ul li ul {
 display: None;
 position: Absolute;
 left: 149px;
 top: 0px;
 z-index: 100;
}
ul#navigation li ul li:hover > ul {
 display: Block;
}

/* Smartphone Menu */
#burger {
 display: None;
}
@media screen and (max-width: 580px) {
  ul#navigation li,
  ul#navigation li a {
  width: 100%;
 }
 #burger {
  display: Block;
  margin-right: 25px;
  -moz-appearance: None;
  -webkit-appearance: None;
  width: 25px;
  height: 25px;
  background-image: url("../images/menu.png");
  background-size: 25px 25px;
  background-position: Center Center;
  background-color: #F50000;
  vertical-align: Middle;
  border: None;
  outline: None;
  cursor: Pointer;
 }
 #burger:checked ~ ul#navigation {
  animation: fadeIn 1.2s;
  display: Block;
  margin-top: 5px;
 }
 #burger:not(:checked) ~ ul#navigation {
  display: None;
 }
 @keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
 }
}
/* Artikelbereich */
main{
    margin: auto;
    max-width: 900px;
}
section{
    color: white;
    background: linear-gradient(rgba(255, 161, 20, 0.7), rgba(12,10,255,0.6)); 
    padding: 15px;
    margin-bottom: 12px;
}
section h2{
    text-shadow: 2px 2px 2px #ff9900;
    text-decoration: underline solid rgb(68, 68, 68);
    font-variant: small-caps;
}
article{
    background-color: white;
    padding: 15px;
    margin-bottom: 12px;
}
article.blog{
    
    color: red;
}
aside{
    -ms-user-select: None;
    -moz-user-select: None;
    -webkit-user-select: None;
    user-select: None;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.541);
    padding: 2px;
    margin-bottom: 12px;
    font-variant: small-caps;
}
aside a{
    text-decoration: none;
    padding: 8px;
    border: 0;
    color: white;
    background-color: red;
    cursor: default;
    border: 1px Solid #FF0000;
    border-bottom: 0;
    transition: background-color 0.5s;
    box-shadow: 1px 1px 3px 1px #C0C0C0;
    font-weight: bold;
}
aside a:hover{
    background-color: black;
}aside a.aktiv{
    background-color: black;
}
/* Fussbereich */
footer{
    -ms-user-select: None;
    -moz-user-select: None;
    -webkit-user-select: None;
    user-select: None;
    margin: auto;
    text-align: center;
    line-height: 35px;
    max-width: 900px;
    height: 35px;
    background:red;
    color: white;
    font-weight: bold;
}
/* Anpassung für den Druck */
@media print {
    nav {
        display: none !important;
    }
    aside{
        display: none;
    }
    footer {
        display: none;
    }
    img.logo{
        max-width: 150px;
    }
    main section{
        color: black;
    }
 }