*{
margin: 0;
padding: 0;
font-size: 100%; /*entfernt auto style des browsers*/
}

body{
font-family: Arial, sans-serif; /*basis schrift-einstellungen, gelten erstmal überall*/
font-size: 15px;
line-height: 20px;
color: black;

background-color: #1a1a1a;
background-image: url(pics/back.png);
background-repeat: repeat-x;
}

#wrapper{
width: 880px;
margin: 0 auto; /*zentriert den wrapper 0=top und bottom*/
}

/*--------------------------Basis-Stylig-------------------------*/
#main{
width: 879px;/*ein Pixel weniger als der Wrapper damit das announces-element noch links hin passt*/
float: left;
}

#left-col{
width: 225px;
float: left;
clear: both; /*nötig wegen #navi li float left*/

}

#right-col{
width: 620px;
float: left;
}

#footer{
clear: both;
}

ul{
list-style: none; /*entfernt die bulletpoints aller ul lists*/
}

a:link,
a:visited{
color: #6f6f6f;
text-decoration: none;
}

a:active,
a:focus,
a:hover{
color: #cfeb00;
}

/*---------------------------------Header-------------------------*/

#wimpel{
position: absolute; /*h1 wimpel wird aus dem dokumentenfluss entfernt, alle anderen element verhalten sich als wäre h1 nicht da*/
top: 0; /*legt die position fest*/
left: 50;
/*float: left;
background-color: fuchsia;*/
}

/*-------------------------------Navi----------------------------*/

#navi{
font-size: 18px;
margin-left: 225px;
width: 700px;
margin-top: 14px; /*abstand nach oben*/
}

#navi li{
float: left; /*abstand der menu-punkte untereinander*/
margin-right: 6px;
background-color: black;
padding: 6px 10px 6px 10px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
/*-webkit-box-shadow:3px 3px 6px #6f6f6f;*/
}

#navi li.active a:link, /*gelb: farbe der activeb schrift*/
#navi li.active a:visited{
color: #cfeb00;
}

#navi li.active a:active,/*hellgrau: farbe der activen schrift beim überfahren*/
#navi li.active a:focus,
#navi li.active a:hover{
color: #6f6f6f;
}


/*---------------------Main(nur für index.html)-------------------*/

#main{
height: 340px; /*macht die höhe künstlich kleiner*/
margin-top: 145px; /*richtet das bild aus*/
}

#main img{ /*nimmt bild aus dem dokumentenfluss*/
position: relative;
}

#announces{
position: relative;
float: left;
height: 1px;
width: 1px;
top: 90px;/*Hier die Position des Bildes auf der y-Achse ändern*/
right: 80px;/*Hier die Position des Bildes auf der x-Achse ändern*/
}

/*----------------------------left-col----------------------------*/

#left-col{
margin-top: 200px;
font-size: 18px;
/*text-shadow: 1px 1px 5px #101010;*/
}

#left-col a:link,
#left-col a:visited{
color: #1a1a1a;
}

#left-col a:active,
#left-col a:focus,
#left-col a:hover{
color: #cfeb00;
}

#left-col li.active a:link,
#left-col li.active a:visited{
color: #cfeb00;
}

#left-col li.active a:active,
#left-col li.active a:focus,
#left-col li.active a:hover{
color: #1a1a1a;
}

#left-col li{ 
margin-bottom: 6px;
}

/*---------------------------right-col----------------------------*/

#right-col{
margin-top: 100px;
}

#right-col h1{
padding-bottom: 15px;
}

#right-col h2{
padding-bottom: 15px;
}

#right-col img{
padding-bottom: 15px;
padding-right: 15px;
}

#right-col p{
padding-bottom: 15px;
}

#right-col a:link,
#right-col a:visited{
color: #cfeb00;
text-decoration: none;
}

#right-col  a:active,
#right-col  a:focus,
#right-col  a:hover{
color: #cfeb00;
}

/*---------------------------------Footer-------------------------*/

#footer p{
text-align: right;
}

#footer{ /*für abstand nach unten*/
margin-bottom: 50px;
}

#footer img{ /*verschiebt die bilder*/
position: relative;
top: 25px;
}