/* ---------------------------------------------------------
   Basics
   ---------------------------------------------------------*/

  *
  {
    padding: 0px;
  }

  /* Hintergrundfarbe bestimmen */
  html
  {
    background: #f7f5f6;            
  }


	body
	{
    /* Breite der Seite 1.170 mit 50 Rand */
    max-width: 1920px;		

		margin: 0 auto;
    text-align: center;       	 
    		
	}
	

  /* ---------------------------------------------------------
   Inhalt
   ---------------------------------------------------------*/
   
   #content
   {
    max-width: 1270px;
		margin: 0 auto;
    text-align: center;       	 
    margin-bottom: 20px;
   } 

   #header
   {
    margin-bottom: 50px;
   }
   
   #top
   {
      width: 92.125984251968503937007874015748%; /* 1170 zu 1270 */      
      _margin: 0 auto;
      text-align: left;
		  margin: 0 3.937007874015748031496062992126%;  /* 50 zu 1270 */    
  
      _border: 1px solid #000;     
   }   
   

   #linke_spalte   
   {
    float: left;
    width: 64.957264957264957264957264957265%; /* 760  zu 1170*/
    margin-right: 5.1282051282051282051282051282051%; /* 60 zu 1170 */
   }


  
   #rechte_spalte     
   {
    float: right;
    width: 29.91452991452991452991452991453%; /* 350  zu 1170 */
   }

   #rechte_spalte ul
   {
     margin-bottom: 100px;
     width: 100%;
     _border: 1px solid #000;
   }

   #category li
   {
      height: 70px;
      padding-left: 90px;
      display: table;

      _border: 1px solid #000;
   }
   
   #category li a
   {
    display: table-cell;
    vertical-align: middle;
   }  
  
    #archiv li
    {
      line-height: 2em;
      padding-left: 35px; /* die Hälfte von 70 Breite des Bildes über */    
    }
  
   .eintrag
   {
    background: #fff;
    text-align: center;        
    margin-bottom: 50px;
    
    _border: 1px solid #000;
   }
   
   .eintrag .startbild
   {
    border-top: 2px solid #ff00de;
    border-bottom: 2px solid #ff00de;
    margin-bottom: 25px;
   }
   
   .eintrag .textdetail
   {    
    text-align: left;
   }
   
   .eintrag .beschreibung,
   .eintrag .textdetail
   {
    line-height: 2em;
    padding: 3.2894736842105263157894736842105%;
    font-size: 1.0625rem;
   }
   
   .eintrag .beschreibung a,
   .eintrag .textdetail a
   {
    color: #ff00de;
    text-decoration: underline;
   }


   .eintrag .datum
   {
    margin-bottom: 25px;
    font-weight: bold;
    font-size: 1.25rem;
   }
   
   .eintrag .textdetail p
   {
    margin-bottom: 1.5em; 
   }
   
   .eintrag .textdetail strong
   {
    font-weight: italic;
    font-size: 1.75rem;
   }
   
   p.center a
   {
    margin: 0 5px;
   }

/* ---------------------------------------------------------
   Formular Startseite
   ---------------------------------------------------------*/
  
    #startseite
    {
      height: 100%;
    }
    
    #anmeldung
    {
      float: right;
      width: 50%;
      
      _border: 1px solid #000;
    }
    
    #pp
    {
      float: left;
      width: 50%;
    }

    form
    {
      _border: 1px solid #000;
      width: 100%;
      margin-top: 20%;
      padding: 0 5%;
    }

    input
    {
      width: 80%;
      padding: 5% 10%;
      border: 2px solid #a24768;
      margin-bottom: 25px;
    }
    
    input[type="button"]
    {
      background: #a24768;
      color: #fff;
    }


/* ---------------------------------------------------------
   Footer
   ---------------------------------------------------------*/
  
  
  
  footer[role="footer"] 
  {
    clear: both;
    background: #aaa url('/images/css/footer.png') top left no-repeat;
    min-height: 60px;
    padding-top: 10px;
    text-align: left;
    font-size: 1.125rem;
    width: 100%;
  }
  
  footer[role="footer"] #gruen
  {
    float: left;
    padding: 0 20px 0 60px;
    color: #00ab50;
    margin-bottom: 20px;
  }
  
  footer[role="footer"] #weiss,
  footer[role="footer"] #weiss a
  {
    color: #fff;
    text-decoration: none;    
  }
  
  footer[role="footer"] #weiss
  {
    float: left;
    margin-left: 60px;      
  }
  


@media only screen and (min-width:481px) and (max-width: 575px) 
{

   #category li
   {
      height: 125px;
      padding: 0;
      width: 100%;
      display: table;

      _border: 1px solid #000;
   }
   
   #category li a
   {
    display: table-cell;
    vertical-align: bottom;
    
   }  

   #archiv li
   {
    padding: 0;
   }


}