@charset "UTF-8";
/* ========================================
Stylesheet der K-o-Q.de Homepage

Datei: screen.css
Datum: 13. März 2009
Autor: Pathor (techn. Admin)

Aufbau: 1. Kalibrierung
        2. Allgemeine Styles
        3. Styles für Layoutbereiche
        4. Sonstige Styles
======================================== */

/* ==================================
   1. Kalibrierung
   =============================== */

* {
 padding: 0;
 margin: 0;
 border: none;
}

ul { margin-bottom: 0; }

li { margin-left: 2em; }

/* ==================================
   2. Allgemeine Styles
   =============================== */

body {
 color: #000;
 background-color: #4E7A3E;
 background-image: url(/images/bg_darkgreen.gif);
 font-family: Tahoma, Arial, Helvetica, sans-serif;
 font-size: 11px;
}

p {
 margin: 10px 0;
}

h1 { font-size:18px; padding: 20px 0; text-align: center; }
h2 { font-size:16px; padding: 20px 0; text-align: center; }
h3 { font-size:14px; padding: 15px 0; }

abbr { border-bottom: 1px dotted #000; }

/* ================
   Hyperlinks    */

a {
 outline: none;
 text-decoration: none;
 font-weight: 700;
}

a:link, a:visited, a:active {
 color: #900;
 background-color: transparent;
}

a:hover, a:focus {
 color: #900;
 background-color: transparent;
 text-decoration: underline;
}

/* =====================
   Klassen und IDs    */

.bold_bordeaux {
 color: #900;
 background-color: transparent;
 font-weight: 700;
}

.smallfont {
 font-size: 10px;
 font-weight: 700;
}

.bigfont {
 font-size: 16px;
 font-weight: 700;
}

.skiplink {
 position: absolute;
 top: -5000px;
 left: -5000px;
 width: 0;
 height: 0;
 overflow: hidden;
 display: inline;
}

.werbung_links,
.zweitenavigation {
 text-align: center;
}
  .werbung_links p {
   margin: 0 5px 10px;
  }

.rahmenbox {
 margin: 10px;
 border: 1px solid #fff;
 padding: 5px;
 text-shadow: #333 3px 3px 3px;
}
  .rahmenbox .smallfont {
   color: #fff;
   background-color: transparent;
  }

.werbetext {
 color: #fff;
 background-color: #4e7a3e;
}

.tabhead {
 color: #000;
 background-color: #dde5da;
 font-size: 2em;
 font-weight: 400;
 text-shadow: #333 2px 2px 5px;
 margin: 10px 0;
 padding: 2px;
 text-align: center;
}

.button {
 text-align: right;
}

.bildrechts {
 float: right;
 margin: 0 0 10px 10px;
}

.clearing {
 clear: both;
}

.center {
 text-align: center;
}

/* ==================================
   3. Styles für Layoutbereiche
   =============================== */

#wrapper {
 width: 900px;
 margin: 10px auto;
 background-image: url(/images/bg_wrapper.gif);
 background-repeat: repeat-y;
 border: 1px solid #fff;
}

.logo {
 display:block;
 border-bottom: 1px solid #fff;
 width: 900px;
 height: 150px;
}

#navigation {
 float: left;
 width: 150px;
}
  #navigation ul {
   padding: 10px 0;
  }
  #navigation li {
   list-style-type: none;
   padding: 0;
   margin: 0;
  }
  #navigation li a {
   display: block;
   padding: 2px 2px 2px 6px;
   font-size: 14px;
   text-decoration: none;
   text-shadow: #333 3px 3px 3px;
  }
  
  #navigation li a:link, #navigation li a:visited    {
   color: #fff;
   background-color: transparent;
  }
  #navigation li a:hover   {
   color: #fff;
   background-color: #4e7a3e;
   text-decoration: none;
  }
  #navigation li a:active  {
   color: #000;
   background-color: #fff;
  }
  /* ============================================
   "Wo bin ich" in der Navi erkenntlich machen */
   
  #index #navi01,
  #news #navi02,
  #darsteller #navi03,
  #episodenguide #navi04,
  #listen #navi05,
  #faqs #navi06,
  #webcomic #navi07,
  #exklusiv #navi08,
  #multimedia #navi09,
  #forum #navi10,
  #guestbook #navi11,
  #links #navi12,
  #sitemap #navi13,
  #impressum #navi14 {
   color: #fff;
   background-color: #4e7a3e;
   border:3px solid #cb1827;
   border-top:1px solid #fff;
   border-bottom:1px solid #fff;
  }

#rechte_spalte {
 float: right;
 width: 150px;
 text-align: center;
}

#content {
 color: #000;
 background-color: #fff;
 margin: 0 150px;
 padding: 10px;

}
  #content ul {
   padding: 5px 0;
  }
  #autogramme #content,
  #impressum #content {
   height: 3300px;
  }
  
#contentfloat {
 float: left;
 width: 578px;
}

#footer {
  color: #000;
  background-color: #6fad59;
  clear: both;
  font-size: 9px;
  margin: 0;
  padding: 5px;
  border-top: 1px solid #fff;
  text-align: center;
}

/* ==================================
   4. Sonstige Styles
   =============================== */
   
/* ==============================
   Formatierung der Startseite */

#index h1 {
 background-color:#dde5da;
 font-size:2em;
 font-weight:400;
 padding: 2px;
 margin-bottom: 15px;
}

/* ========================
   Formatierung der News */

.newsbox {
 border: 1px solid #000;
 margin: 12px 0;
}

.newsheader {
 color: #000;
 background-color: transparent;
 background-image: url(/images/cellpic.gif);
 padding: 1px 3px 2px;
 border-bottom: 1px solid #000;
}
  .newsheader h2 {
   font-size: 1.6em;
   font-weight: 700;
   letter-spacing: 1px;
   margin: 0 0 2px 0;
   padding: 0;
   text-align: left;
  }
  .newsheader span {
   font-size: .8em;
   font-weight: 700;
  }

.newscontent {
 color: #000;
 background-color: #dde5da;
 padding: 3px;
}
  .newscontent img {
   padding: 2px 5px 5px 2px;
  }

.newslink {
 text-align: right;
}

.newsfooter {
 color: #000;
 background-color: #6fad59;
 padding: 3px;
 border-top: 1px solid #000;
}

/* ===============================
   Formatierungen des Formulars */

textarea,
input[type="text"],
input[type="button"] {
 background-color: #fff;
 border: 1px solid #000;
 overflow: auto;
}

textarea:focus,
input[type="text"]:focus {
 background-color: #dde5da;
 border: 1px solid #000;
 overflow: auto;
}

.formularfloat {
 float: left;
 width: 200px;
 padding: 5px 10px;
}
  .formularfloat input,
  .formularfloat textarea{
   margin: 4px 0;
   padding-left: 3px;
  }

.formularfloat_footer {
 clear: both;
 text-align: center;
}

.formular {
 margin: 10px 0;
 border: 1px solid #fff;
 padding: 5px;
}
  .formular h2 {
   padding: 2px;
  }
  
/* ======================
   Darstellerübersicht */

.darsteller_box {
 overflow: hidden;
 margin-bottom: 10px;
 border: 1px solid #000;
 border: 2px solid #bdbdbd;
 border-right: 2px solid #676767;
 border-bottom: 2px solid #676767;
 padding: 5px;
}
  .darsteller_box img {
   float: left;
   border: 2px solid #bdbdbd;
   border-right: 2px solid #676767;
   border-bottom: 2px solid #676767;
   margin-right: 5px;
  }

/* ===============================================
   Box in den Guides und Bilder in den Episoden */
   
#episodenguide #content li {
 list-style-type: none;
}

.ep_linkespalte {
 float: left;
 width: 289px;
}

.ep_rechtespalte {
 float: right;
 width: 289px;
}

.rahmenbox2 {
 color: #000;
 background-color: #e7f5e2;
 margin: 5px 170px;
 border: 1px solid #000;
 padding: 5px;
 text-align: center;
}
  
.pics {
 text-align: center;
}
  .pics img {
   border: 3px outset #dde5da;
   margin-top: -2px;
  }

/* =================================
   Listenbox für die Listen-Seite */

.listenbox {
 color: #000;
 background-color: #dde5da;
 font-size: 11px;
 margin-bottom: 10px;
 border: double 3px #4f4f4f;
 padding: 10px;
 text-align: center;
}

/* =========================================
   Webcomics Bildmarkierung und Folgenboxen */

.webcomics_wrapper_links {
 float: left;
 width: 389px;
 margin-top: 10px;
}

.webcomics_wrapper_rechts {
 float: right;
 width: 189px;
 margin: 10px 0;
 text-align: center;
}

.webcomics_box {
 overflow: hidden;
 padding: 2px;
 margin-bottom: 10px;
}
  .webcomics_box img {
   float: left;
   margin-right: 10px;
  }
  .webcomics_box p {
   margin-top: 0;
  }

.webcomics_fabian {
 color: #000;
 background-color: #f8f4aa;
 margin: 18px;
 border:1px dashed #000;
 padding: 5px;
 text-align: left;
}

/* =======================
   Multimedia-Abteilung */

.multimedia img {
 margin: 10px 13px 10px 0;
}

/* ================================
   Positionierung der Forumboxen */
   
.forum {
 margin: 20px;
 border: 2px solid #bdbdbd;
 border-right: 2px solid #676767;
 border-bottom: 2px solid #676767;
 text-align: center;
} 

/* ===============================
   Formatierungen im Gästebuch */

/* siehe /burningbook/guestbook.css

/* ==============
   Linkbereich */

.linkbox1 {
 float: left;
 width: 378px;
}

.linkbox2 {
 float: right;
 width: 200px;
}

.linkbox3 {
 clear: both;
 padding-top: 30px;
}

.linkbox1 p,
.linkbox2 p,
.linkbox3 p {
 font-weight: 700;
}

.linkusrahmen {
 color: #000;
 background-color: #e7f5e2;
 border: 1px solid #000;
 padding: 2px;
}

/* ==================================
   ENDE DES STYLESHEETS
   =============================== */
