body{
   background-color: #ffffff;
}

#wrapper{
   max-width: 960px;
   height: 830px;
   margin: 0px auto;
   margin-top: 20px;
   padding: 5px;
   background-color: rgb(255,255,255);
   background-color: rgba(255,255,255,0.7);
}

#wrapper_clubs{
   max-width: 960px;
   height: 1700px;
   margin: 0px auto;
   margin-top: 20px;
   padding: 5px;
   background-color: rgb(255,255,255);
   background-color: rgba(255,255,255,0.7);
}


/*headerbereich*******************/

header{
   width: 100%;
   height: 180px;
   margin-bottom: -2px;
   background-color: rgb(255,255,255);
   background-color: rgba(255,255,255,0.7);
}
#header_oben{
   width: 100%;
   height: 50px;
}
#header_unten{
   width: 100%;
   height: 130px;
}

form#myform{
   position: relative;
   width: 10%;
   text-align: right;
   display: block;
   top: 0px;
   left: 80%;
}

form#myform fieldset{
   border: 0.1em solid #cc0000;
}

form#myform input#submit{
   background-color: #ffffff;
}

#gruss{
   position: relative;
   width: 20%;
   text-align: right;
   display: block;
   top: 3px;
   left: 75%;
}

/*headerbereich Ende**********/

#begruessung{
   width: 100%;
   height: 60px;
}

#begruessung1{
   height: 25px;
   width: 100%;
   font-size: 1.1em;
   text-align: center;
   background-color; #ffffcc: 
}
#begruessung2{ 
   height: 25px;
   width: 100%;
   font-size: 1.0em;
   text-align: center;
}

#content{
   width: 95%;
   height: 520px;
   background-color: #ffffff;
   padding-right: 15px;
   margin: 0 10px 10px 10px;
   border-width: 1px;
   border-color:#CC0000;
   border-style:solid;
   -webkit-border-radius: 0px 12px 0px 0px;
   border-radius: 0px 12px 0px 0px;
}

#content_clubs{
   width: 95%;
   height: 1390px;
   background-color: #ffffff;
   padding-right: 15px;
   margin: 0 10px 10px 10px;
   border-width: 1px;
   border-color:#CC0000;
   border-style:solid;
   -webkit-border-radius: 0px 12px 0px 0px;
   border-radius: 0px 12px 0px 0px;
}

div#article_index_1{
   position: relative;
   width: 100%;
   height: 100px;
   top: 10px;
}
#article_index_1 img{
float: left;
border: 1px solid #cc0000;
margin: 0px 2px 5px 5px;
height: 80px;
width: auto;
}
#article_bildbox{
float: left;
width: 120px;
height: 80px;
margin-right: 8px;
}

span.datum{
   font-size: 0.8em;
}
span.ueberschrift{
   font-size: 1.0em;
   font-weight: bold;
}

div#article_index_2{
   position: relative;
   width: 100%;
   height: 110px;
   top: 10px;
}
#article_index_2 img{
   float: left;
   border: 1px solid #cc0000;
   margin: 0px 2px 5px 5px;
}

div#article_index_3{
   position: relative;
   width: 100%;
   height: 18px;
   top: 5px;
   text-align: right;
   font-size: 0.9em;
}

div#text_mini{
   position: relative;
   font-size: 0.9em;
   left: 10px;
   margin-right: 10px;
   height: 105px;
}

div#article_veranstaltungen{
position: relative;
top: 10px;
width: 98%;
background: #cc00cc;
left: 5px;;
height: 1200px;
}
div#zeile_veranstaltungen{
position: relative;
width: 100%;
height: 45px;
border-bottom: 1px #cc0000 solid;
}
div#article_links{
position: relative;
height: 40px;
width: 245px;
float: left;
background: #ffffcc;
}
#fzm_art1{
position: relative;
left: 5px;
top: 2px;
width:90px;
height: 35px;
text-align: left;
float: left;
padding: 2px;
/*background: #ffcc66;*/

}

#fzm_art2{
position: relative;
float: left;
width: 140px;
height: 35px;
left: 5px;
top: 0px;
padding: 2px;
text-align: left;

}
div#article_rechts{
position: relative;
height: 40px;
width: 320px;
float: left;
background: #ff99cc;
}
#fzm_art3{
position: relative;
left: 10px;
top: 2px;
float: left;
width: 200px;
padding: 2px;
height: 35px;

}

#fzm_art4{
position: relative;
left: 25px;
top: 2px;
float: left;
width: 80px;
padding: 2px;
height: 35px;


}


/**fuer Clubs, Aufzaehlung in Tabelle**/

div#ueb_clubs{
position: relative;
left: 3px;
top: 2px;
width: 90%;
height: 30px;
margin: 1px;
color: #000000;
}

div#text_clubs{
position: relative;
left: 3px;
top: -5px;
width: 95%;
height: 85px;
margin: 1px;
color: #000000;
line-height: 20px;
}

div#text_galerien_ueb{
position: relative;
left: 3px;
top: 0px;
width: 95%;
height: 50px;
margin: 1px;
color: #000000;
line-height: 20px;
}
ul#galerien{
position: relative;
left: 30px;
top: 0px;
width: 95%;
height: 150px;
margin: 1px;
color: #000000;
line-height: 20px;
text-align: center;
list-style: none;
}

#mytable{
   margin: 5px;
   border: 1px solid #cc0000;
   width: 95%;
}
td#platz{
   vertical-align:top;
}
div#text_tabelle_ue{
/*float: left;*/
font-size: 1.0em;
font-weight: bold;
height: 20px;
margin-left: 3px;
}
div#text_tabelle_ue_zus{
/*float: left;*/
font-size: 1.0em;
height: 20px;
margin-left: 3px;
}

div#text_tabelle_inhalt{
font-size: 1.0em;
background: #efefef;
margin-left: 3px;
vertical-align: top;
}

/***content ende***/
   
footer{
   clear: both;
   width: 95%;
   height: 25px;
   background-color: #cccccc;
   text-align: right;
   margin: 5px 10px 0 10;
   font-size: 0.9em;
   padding: 10px 15px 0 0;
}

/****************************************************/

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

/***************************************************/

#wrapper_clubs{
   height: 2270px;
}


#content{
   height: 750px;
} 

#content_clubs{
   height: 1850px;
   
}

.button{
   background: #efefef;
   font-size: 1.2em;
}

#begruessung{
   width: 100%;
   height: 80px;
}
  
#begruessung1{
   height: 40px;
   width: 100%;
   font-size: 1.2em;
}

#begruessung2{ 
   
   height: 40px;
   width: 100%;
   font-size: 1.2em;
}

div#article_index_1{
   height: 150px;
   font-size: 1.2em;
}

div#article_index_2{
   height: 150px;
   font-size: 1.2em;
}

div#article_veranstaltungen{
position: relative;
top: 10px;
width: 98%;
background: #ccffcc;
left: 5px;;
height: 1200px;
}
div#zeile_veranstaltungen{
position: relative;
width: 100%;
height: 45px;
border-bottom: 1px #cc0000 solid;
}
div#article_links{
position: relative;
height: 40px;
width: 245px;
float: left;
/*background: #ffffcc;*/
}
div#fzm_art1{
   clear: left;
   height: 20px;
   font-size: 0.9em;
   font-weight: bold;
}
div#fzm_art2{
   clear: left;
   height: 20px;
   font-size: 0.9em;
}
div#article_rechts{
position: relative;
height: 40px;
width: 320px;
float: left;
/*background: #ccffcc;*/
}

div#text_clubs{
   font-size: 1.1em;
   height: 125px;
}

div#text_tabelle_ue{
   font-size: 1.2em;
   font-weight: bold;
   height: 20px;
   margin-left: 3px;
}
div#text_tabelle_ue_zus{
   font-size: 1.2em;
   height: 22px;
   margin-left: 3px;
}

div#text_tabelle_inhalt{
   font-size: 1.2em;
   background: #efefef;
   margin-left: 3px;
   vertical-align: top;
}

/***************************************************/

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

/**************************************************/   

#begruessung{
   height: 50px;
   font-size: 1.1em;
}
#begruessung2{ 
   height: 50px;
   width: 50%;
   font-size: 1.4em;
   visibility: hidden;
}

#content{
   height: 800px;
}

#content_clubs{
   height: 2000px;
}

div#article_index_1{
   position: relative;
   width: 100%;
   height: 200px;
   top: 10px;
}

div#article_index_2{
   position: relative;
   width: 100%;
   height: 180px;
   top: 10px;
}

div#text_clubs{
   height: 125px;
}

#wrapper{
   padding: 10px;
   }
 
div#article_veranstaltungen{
   background: #ffff00;
}

/*Formular fuer Login*/

form#myform{
   position: relative;
   width: 400px;
   text-align: right;
   display: flex;
   top: 0px;
   left: 10px;
}

}  /*Klammer von @media*/

/*******************************************/

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

/******************************************/   

#header_unten img{
   width: 100%;
   height: 120px;
}

#content{
   height: 980px;
}

#content_clubs{
   height: 2600px;
}

#begruessung{
   height: 60px;
}  

#begruessung1{
   height: 50px;
   width: 100%;
   font-size: 1.1em;
}

#begruessung2{ 
   height: 50px;
   width: 50%;
   font-size: 1.4em;
   visibility: hidden;
}

div#article_index_1{
   position: relative;
   width: 100%;
   height: 210px;
   top: 10px;
}

div#article_index_2{
   position: relative;
   width: 100%;
   height: 210px;
   top: 10px;
}

div#article_index_3{
   top: 50px;
}

div#article_veranstaltungen{
   background: #00ff00;
}

}