* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 14px;
 background-color:#2F4155;
}

#wrapper {
	width:90%;
	background-color:#FFFFFF;
    display: flex;
	flex-direction: column; 
	margin: 0 auto;
}

#topbar {
 padding-top:10px;
 padding-bottom:10px;
 width:auto;
 bottom: 0; 
 background-color:#2F4155;
 clear:both;
 white-space: nowrap;
 overflow: hidden;
 box-sizing: border-box;
}

.topmenuitem {
 padding-top:22px;
 padding-bottom:11px;
 display:inline-block;
 background-image: url("topbar.png");
 background-size: auto 50px;
 vertical-align:top;
 font-size: 18px;
 text-align:center;
 width:160px;
 color:#CBCBCB;
 text-transform: uppercase;
 font-weight: bold;
 font-style: italic;
 transition: 0.5s;
 a { text-decoration:none;color:#CBCBCB; }
 a:link { text-decoration:none;color:#CBCBCB; }
}

.topmenuitem:hover{
 background-image: url("topbarx.png");
 background-size: auto 50px;
 width:160px;
 transition: 0.5s;
 a:hover { text-decoration:none;color:#CBCBCB; }
 a:active { text-decoration:none;color:#CBCBCB; }
}

.topmenuitem2 {
 padding-top:5px;
 padding-right:5px;
 display:block;
 vertical-align:top;
 text-align:center;
 float:right;
 color:#2F4155;
}

.topmenuitem3 {
 display:inline-block;
 width:40px;
 height:40px;
 background-image: url("facebook.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
 transition: 0.3s;
 padding-right:5px;
}

.topmenuitem3:hover{
 background-image: url("facebookfade.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
}

.topmenuitem4 {
 display:inline-block;
 width:40px;
 height:40px;
 background-image: url("instagram.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
 transition: 0.3s;
 padding-right:5px;
}

.topmenuitem4:hover{
 background-image: url("instagramfade.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
}

.topmenuitem5 {
 display:inline-block;
 width:40px;
 height:40px;
 background-image: url("youtube.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
 transition: 0.3s;
 padding-right:5px;
}

.topmenuitem5:hover{
 background-image: url("youtubefade.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
}

.topmenuitem6 {
 display:inline-block;
 width:40px;
 height:40px;
 background-image: url("darkmode.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
 transition: 0.3s;
}

.topmenuitem6:hover{
 background-image: url("darkmodefade.png");
 background-repeat:no-repeat;
 background-size:40px 40px;
}

#content {
 width:auto;
 background-color:#CBCBCB;
 min-height:85vh;
 clear:both;
 box-sizing: border-box;
}

#footer {
 width:auto;
 clear:both;
 text-align:center;
 padding-top:2px;
 background-color:#E01D26;
 color:#CBCBCB;
 font-size: 12px;
 padding-top:5px;
 padding-bottom:5px;
 a { text-decoration:none;color:#CBCBCB; }
 a:link { text-decoration:none;color:#CBCBCB; }
 a:hover { text-decoration:underline;color:#CBCBCB; }
 a:active { text-decoration:none;color:#CBCBCB; }
}

input[name=suchen] {
  padding:2px 2px 2px 21px;
  font-size:18px;
  background-size: 18px 18px;
  background-position:3px 3px;
  background-image: url('suchen.png');
  background-repeat: no-repeat;
  border-radius:19px;
}