/* ============================
Allgemeines Stylesheet für die Themenbereiche auf biologiedidaktik.at
Stand: mit Datum aktualisiert
Datei: biodid_allgemein.css
Datum: 28. November 2008
Autor: Andrea B. Zocher-Machart

Aufbau: 1. Kalibrierung und allgemeine Styles
        2. Styles für Layoutbereiche
        3. Sonstige Styles
=============================== */



/* ==========================================
   1. Kalibrierung und allgemeine Styles
============================================= */

/* Kalibrierung der wichtigsten Abstände */

/* Allgemeine Selektoren */

* { padding: 0; margin: 0; }
html { height: 101%; } /* erzwingt Scrollbar im Firefox */
body {
   color: black;
   background: white;
   font-family: Arial, Helvetica, sans-serif;
   font-size: small;
}
h1 { font-size: 200%; }
h2 { font-size: 170%; }
h3 {
   font-size: 120%;
   margin-top: 2em;
   }
h4 {
   font-size: 110%;
   text-decoration: none;
}
p, li { font-size: 105%; }
img { border: 0; }
h2, h3, p, ul, ol, table, dl { margin-bottom: 1em; }
h4, dd { margin-bottom: 0.5em; }
h2, h3, h4 { margin-top: 1.5em; }
li { margin-left: 3em; }
hr { color: #8c8c8c; }


/* Hyperlinks */

/* Allgemeine Klassen und IDs */

.skiplink {
   position: absolute;
   left: -3000px;
   top: -2000px;
   width: 0px;
   height: 0px;
   overflow: hidden;
   display: inline;
}
#logo {
   color: black;
   background-color: white;
}
.inarbeit { margin: 40px 70px; }
.bildlinks {
   float:left;
   border: 2px solid #ccc;
   margin-right: 10px;
   margin-bottom: 10px;
}
.bildrechts {
   float:right;
   border: 2px solid #ccc;
   margin-bottom: 10px;
   margin-left: 10px;
}
dl.bildlinks {
   width: 570px; /* maximale Breite */
   float: left;
   margin-right: 10px;
   margin-bottom: 10px;
   border: none;
}
dl.bildrechts {
   width: 570px; /* maximale Breite */
   float: right;
   margin-left: 10px;
   margin-bottom: 10px;
   border: none;
}
.bildunterschrift {
   font-size: 90%;
   font-style: italic;
   text-align: center;
}
.clearing { clear: both; }
.bildautor {
   clear: both;
   color: #595959;
   font-size: 80%;
   margin-top: 5px;
}
.grid { /* für den Linkraster auf den jeweiligen Übersichtsseiten */
   position: relative;
   width: 175px;
   height: 175px;
   margin: 0;
   padding: 0;
   text-align: center;
}
.grid h4 { /* grid Beschriftung */
   margin: 0;
   padding-top: 10px;
}
.grid a { /* entfernt Unterstreichung beim grid bei IEx, FFox und Opera */
   text-decoration: none;
}
.unterstrich { text-decoration: underline; }
.fett { font-weight: bold; }
.kursiv { font-style: italic; }
.mittig { text-align: center; }
.rechts { text-align: right; }
.invisible { /* für unsichtbare horizontal rows bei Anleitungen; verhindert, dass die Bilder zu weit floaten */
   clear: both;
   margin: 0px;
   color: #fff;
   height: 0;
   border: 0;
}

/* ==========================================
   2. Styles für Layoutbereiche
============================================= */

#wrapper { /* Das HTML-Element mit dem Attribut id="wrapper" */
   position: absolute;
   left: 0px;
   top: 0px;
   color: black;
   background-color: white;
   width: 770px; /* Breite des Inhaltsbereiches */
   margin: 0px auto;
}

#kopfbereich {
   position: relative;
   color: black;
   margin: 20px 0px 0px 0px;
   padding: 0px 0px 0px 45px;
}
   #kopfbereich p {
      position: absolute;
      top: 20px;
      right: 130px;
      font-size: 90%;
      font-weight: bold;
      font-family: Arial, Helvetica, sans-serif;
      padding: 10px;
      margin: 0;
   }
   #kopfbereich p span {
      color: #808080;
      font-weight: normal;
   }
   #unilogo {
      position: absolute;
      top: 20px;
      right: 0px;
      padding: 10px;
      margin: 0;
   }

#navibereich {
   position: fixed;
   top: 180px;
   left: 15px;
   text-align: left;
   color: black;
   padding: 0px;
   margin: 0px;
   width: 155px;
}
   #navibereich img {
      float: left;
      margin: 0;
      padding: 0;
   }
   #navibereich #aktiv { margin-bottom: 5px; }
   #navibereich p {
      margin: 0;
      padding: 10px 15px 0px 0px;
      font-size: 80%;
      text-align: right;
   }

#textbereich {
   position: relative;
   margin: 0px 0px 0px 170px;
   padding: 10px 10px 20px 20px;
}

#fussbereich {
   margin: 20px 0px 0px 170px;
   padding: 10px 0px 20px 20px;;
   border-top: 1px solid #8c8c8c;
}
   #datum {
      margin: 3px 0px;
      font-size: 80%;
      text-align: right;
   }
   #pageup {
      padding-left: 10px;
      float:right;
   }
   #impressumlink {
      position: relative;
      margin-left: -20px;
      margin-top: -20px;
      text-align: left;
   }
      #impressumlink a {
         text-decoration: none;
         outline: none;
      }
      #impressumlink a:link,
      #impressumlink a:visited {
         color: #404040;
      }
      #impressumlink a:hover,
      #impressumlink a:focus {
         border-bottom: 1px solid;
      }


/* ==========================================
   3. Sonstige Styles
============================================= */

/* =======================================
   E N D E   D E S   S T Y L E S H E E T S
   ======================================= */