/*
Stylesheet für die Jungliberale Aktion (JuliA) ASZ                  ##########
--T--H-----H--O--M--E--P--A--G--E--S----S--Z--B-/--E--R--Z--           ##
Stand: 2008                                                            #######
Autor: Tobias Hertig                                                   ##   ##
Datum: 15. Oktober 2008
Aufbau: 1. Kalibrierung und allgemeine Styles
        2. Syles für Layoutbereiche
        3. Sonstiges Styles
____________________________________________________________ */
   
/* =====================================
   1. Kalibrierung und allgemeine Styles
   ===================================== */
   
/*=== Kalibrierung der wichtigen Abstände ===*/
* { padding: 0; margin: 0; }
h2, p, ul, ol { margin-bottom: 1em; } /* Abstand nach unten */
ul ul { margin-bottom: 0; } /* Verschachtelte Listen ohne Absatz */
li { margin-left: 1em; } /* Abstand von Links */

/*=== Allgemeine Selektoren ===*/

html { height: 101% } /* erzwingt Scrollbar im Firefox */
body { /*Gestalte das HTML- Element mit dem Namen Body */
  color: white; /* Schriftfarbe */
  background-color: white; /* Hintergrundfarbe */
  font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
  font-size: medium; /* Schriftgröße */
  background-image: url(img/head1oben.jpg);
  background-repeat: repeat-x; /* nur nebeneinander */
  background-position: left top;
  behavior:url("csshover.htc");
}

h1 { font-size: 180%; }
h2 { 
  font-size: 180%; 
  font-family: Cambria, Georgia, "Times New Roman", Helvetica, sans-serif;
  padding-bottom: 5px;
  border-bottom: 4px solid #214b83;

}
h3 {
  font-size: 150%;
  font-family: Cambria, Georgia, "Times New Roman", Helvetica, sans-serif;
}
h4 {
  font-size: 110%; 
  font-family: Cambria, Georgia, "Times New Roman", Helvetica, sans-serif;
  padding-bottom: 3px;
  border-bottom: 2px solid #8c8c8c;
  padding-left: 3px;
  border-left: 2px solid #8c8c8c;
  background-color: #f2f2f2;
  margin-bottom: 3px;
}
h5 {
  font-size: 70%;
  font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
    letter-spacing: 2px; /* Abstand zwischgen den Buchstaben */
  color: #214b83;
  padding-left: 3px;
  border-left: 2px solid #8c8c8c;
  background-color: #f2f2f2;
}
h6 {
  font-size: 100%; 
  color: #214b83;
  text-align: left; /* zentrieren */
  font-family: Cambria, Georgia, "Times New Roman", Helvetica, sans-serif;
  padding-bottom: 3px;
  border: 2px solid white; /*#8c8c8c*/
  padding-left: 3px;
  background-color: #c0c0c0;
  margin-bottom: 3px;
  margin-left: 2%;
  margin-right: 2%;
}
hr { border-top: 2px solid #214b83; }
h7 {   
  text-align: center; /* zentrieren */
  font-size: 100%; /* etw. kleiner */
  padding-bottom: 3px;
  margin-bottom: 3px;
  color: #214b83;
  letter-spacing: 2px;
  font-family: Cambria, Georgia, "Times New Roman", Helvetica, sans-serif; /* normale Schrift */
}

address {
  text-align: center; /* zentrieren */
  font-size: 80%; /* etw. kleiner */
  font-style: normal; /* normale Schrift, nicht kursiv */
  letter-spacing: 2px; /* Abstand zwischgen den Buchstaben */
  line-height: 1.5em; /* Zeilenabstand */
  background-image: url(julia-jot1.jpg);
  background-repeat: no-repeat;
  background-position: center right;
}

/*=== Hyperlinks allgemein ===*/
a { text-decoration: none; border-bottom: none; } /* Unterstreichung entfernen */

a:link, 
a:visited { color: #214b83; }
a:hover, 
a:focus { 
  border-bottom: 0px solid #899ab0;
}
a:active {
  color: white;
  background-color: #214b83;  
}

/*=== Allgemeine Klassen und IDs ===*/
.skiplink {
  position: absolute;
  top: -2000px;
  left: -300px;
  width: 0px;
  height: 0px;
  overflow: hidden;
  display: inline;
}
.bildlinks {
  float: left;
  padding: 3px;
  border: 3px solid #ccc;
  margin-right: 5px;
  margin-bottom: 1px;
}
.bildmitte {
   line-height:250%;
   width:auto;
   margin:1em 20%;
   text-align:center; 
}
.bildrechts {
  float: right;
  padding: 3px;
  border: 3px solid #ccc;
  margin-left: 7px;
  margin-bottom: 1px;
}
.clearing { clear: both; }

#logo { /* Gestalte das HTML- Element mit id="logo" */
  position: absolute;
  top: -2000px;
  left: -300px;
  width: 0px;
  height: 0px;
  overflow: hidden;
  display: inline;
}


/* ================================
   2. Styles für die Layoutbereiche
   ================================ */
   
#wrapper { /* Gestalte das HTML- Element mit id="wrapper" */
  color: black; /* Schriftfarbe */
  width: 1080px; /*Breite des Inhaltsbereiches */
  height: auto;
  background-image: url(img/head1navi.jpg);
  background-repeat: repeat-y; /* nur vertikal (untereinander) */
  background-position: left top;
}

#kopfbereich { /* Gestalte das HTML- Element mit id="kopfbereich" */
  position: relative; /* Positioniert, aber bleibt im Fluss */
  color: black;
  background-color: white;
  height: 211px;
  width: 938px;
  background-image: url(img/head3n.jpg);
  background-repeat: no-repeat; /* gar net */
  background-position: left;

}
  #kopfbereich p {
    position:absolute;
    top: 10px;
    right: 10px;
    font-weight: bold; /* fett */
    padding: 5px 0 5px 0;
    margin-bottom: 0; /* war 1em */
  }
  #kopfbereich p span {
    color: #900000; /* Schriftfarbe */
  }

#inhalt {
  position: relative; 
  width: 100%;
  top: px;
}
  
#navibereich { /* Gestalte das HTML- Element mit id="navibereich" */
  float: left;
  width: 186px;

  left: 10px;
  padding-left: 10px;
  padding-top: 20px;
  padding-bottom: 30px;
  font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
  background-image: url(img/head1navi.jpg);
  background-repeat: repeat-y; /* nur vertikal (untereinander) */
  background-position: left top;
  text-align: left; /* rechtsbündig */
  color: black;
}
#navibereich iframe {
  background-color: white;
  width: 150px;
  height: 330px;

}

.menutitle {
  cursor: pointer;
  margin-bottom: 5px;
  background-color: #ffffff;
  color: #214b83;
  margin-right: 10px;
  padding: 2px;
  padding-left: 10px;
  text-align: left;
  font-weight: bold;
  font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
}
  .menutitle a {
  border-bottom: 0;
  background-color: #eae8e9;
  color: black;
  }

.submenu {
  margin-bottom: 1em;
  background-color: #ffffff;
  color: #214b83;
  margin-right: 10px;
  margin-left: 5px;
  padding: 2px;
  padding-left: 10px;
}
.submenu a { text-decoration: none;} /* Unterstreichung entfernen */

  .submenu a:link { color: #214b83; }
  .submenu a:visited { color: #214b83;   }
  .submenu a:hover, 
  .submenu a:focus,
  .submenu a:active {
   color: white;
   background-color: #214b83;
  }



#textbereich { /* Gestalte das HTML- Element mit id="textbereich" */
  font-size: medium; /* Schriftgröße */
  position: relative;
  height: 100%;
  width: 650px;
  padding-top: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  margin-left: 240px;
}

#textbereich p {
  text-align:justify;
}

#fussbereich { /* Gestaltet das HTML- Element mit id="fussbereich" */
  width: 795px;
  padding-top: 10px; /* unterhalb Rahmenlinie */
  padding-right: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  border-top: 1px solid #8c8c8c; /* Rahmenlinie oben */
  margin-top: 20px; /* Außenabstand oben, oberhalb Linie */
  margin-left: 265px;
}


/* ==================
   3. Sonstige Styles
   ================== */
   



   
/* =====================================
   E N D E  D E S  S T Y L E S H E E T S
   ===================================== */