/* =========================================================
navigate.de - Stylesheet für Kliniken Landkreis Heidenheim gGmbH
Datei: style.css
Media: screen
Datum: 23. August 2006
Autor: Ulf Mayer
Mail: mayer@navigate.de
Web: http://kliniken-heidenheim.de
Aufbau:
1. Allgemeine Selektoren
2. Layoutbereich
- Wrapper
- Print-Elemente verstecken und durch normale ersetzen
- Navigation
- Content-Bereich
- Subnavigation
- Footer, Metanavigation

========================================================== */


/* ===============================
   =Allgemeine Selektoren 
=============================== */
* {
  margin: 0;
  padding: 0;
}
html, 
body {
  height: 100%;
}
body {
  font-size: 100.01%;
  text-align: center; /* Für IE zentrieren */
  font-family: Arial, Verdana, Tahoma, sans-serif;
  background: #fff url(/wLayout/design/img/bg-background.gif) repeat-x;
}
img {
  border: 0;
}
address {
  font-style: normal;
}
a {
  text-decoration: none;
}

.screenreader {
  display: none;
}

br.clearBoth {
  clear: both;
}

br.clearLeft {
  clear: left;
}

br.clearRight {
  clear: right;
}

img.floatRight {
  float: right;
}

img.floatLeft {
  float: left;
}

a:focus {
  outline: 0;  
}

h1 {
  font-size: 130%;
  color: #666;
  font-weight: bold;
}

/* ===============================
   =Layoutbereich 
=============================== */

div#container {
  text-align: center;
}

div#content,
div#footer {
  font-size: .8em;
}

div.middlecontainer {
  width: 800px;
  margin: 0 auto;
  text-align: left;
  position: relative;
}

h1.logo {
  display: block;
  background: url(/wLayout/design/img/kliniken-heidenheim.gif) no-repeat;
  width: 330px;
  height: 21px;
  margin: 0 auto;
  position: absolute;
  top: 86px;
  left: 234px;
  z-index: 80;
  text-indent: -5000px;
}

h2.heidenheim {

  width: 269px;
  height: 105px;

  position: absolute;
  right: 0;
  top: 150px;
  z-index: 20;
}

h2.giengen {

  width: 275px;
  height: 105px;

  position: absolute;
  left: 0;
  top: 150px;
  z-index: 20;    
}

div#footer {
  clear: both;
  margin-top: 19px;
  text-align: center;
  color: #666;
}

div#footer span {
  float: left;
  display: block;
  background: url(/wLayout/design/img/wappen.jpg) no-repeat;
  background-position: right 0;
  height: 36px;
  margin: 10px 0 0 148px;
  padding: 10px 43px 10px 0;
}

ul.footernav {
  float:right;
  display: block;
  list-style-type: none;
  margin-left: 4px;
  margin: 20px 170px 0 0;
}

ul.footernav li {
  display: inline;
}

ul.footernav li.dot {
  padding-left: 8px;
  background: url(/wLayout/design/img/dot.gif) no-repeat;
  background-position: 0px 7px;
}

ul.footernav a{
  color: #666;
  text-decoration: none;
}

div.startleft,
div.startright {
  margin-top: 150px;
}

div.startleft {
  float: left;
  width: 50%;
  background: url(/wLayout/design/img/fade-blue.gif) repeat-x;
  position: relative;
}

div.startleft address {
  float: right;
  text-align: right;
  padding-right: 20px;
}

div.startright {
  float: right;
  width: 50%;
  background: url(/wLayout/design/img/fade-green.gif) repeat-x;  
  position: relative;
}

div.startright address {
  padding-left: 20px;
}

div.startleft p,
div.startright p {
  background: url(/wLayout/design/img/linse.png);
  font-size: .85em;
  padding: 13px 34px;
  text-align: center;
  line-height: 1.5em;
  height: 104px;
  width: 314px;
  margin: 10px;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 50;
}

div.wraptext p a,
div.wraptext p a:hover {
  color: #000;
}

div#header {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  background: #DADADB;
  width: 100%;
}

div#header ul {
  display: block;
  width: 194px;
  height: 45px;
  position: absolute;
  right: -3px;
  top: 10px;
}

div#header ul li{
  display: inline;
}

div#header ul li a {
  border: 0;
  height: 20px;
  width: 20px;
  display: block;
  text-indent: -4000px;
  float: left;
  margin: 9px 10px 0 0;
}

div#header ul li a.first {
  background: url(/wLayout/design/img/icon-zeitung.gif) no-repeat;
  margin-left: 9px;
}

div#header ul li a.second {
  background: url(/wLayout/design/img/icon-photo.gif) no-repeat;
}

div#header ul li a.third {
  background: url(/wLayout/design/img/icon-anfahrt.gif) no-repeat;
}

div#header ul li a.fourth {
  background: url(/wLayout/design/img/icon-kontakt.gif) no-repeat;
}

div#header ul li a.fifth {
  background: url(/wLayout/design/img/icon-impressum.gif) no-repeat;
}

div#header ul li a.sixth {
  background: url(/wLayout/design/img/icon-notfall.gif) no-repeat;
  margin-right: 9px;
}

div#content address {
  display: block;
  margin: 70px 0 61px 0;
  color: #666;
  font-size: .9em;
  line-height: 1.7em;
}

div.bluefade {
  width: 50%;
  height: 551px;
  background: url(/wLayout/design/img/bg-background-blue.gif) repeat-x;
  position: absolute;
  top: 0;
  left: 0;
}

div.startleft h2 a {
  display: block;
  width: 269px;
  height: 105px;
  background: url(/wLayout/design/img/transparent.gif); /* Opera Fix: Link über ganze Fläche */
}

div.startright h2 a {
  display: block;
  width: 275px;
  height: 105px;
  background: url(/wLayout/design/img/transparent.gif); /* Opera Fix: Link über ganze Fläche */
}

div.wraptext p {
  display: none;
}

div.wraptext:hover p {
  display: block;
}

img.borderleft {
  border-left: 2px #fff solid;
}

img.backgroundimg {
  position: absolute;
  width: 194px;
  height: 45px;
  position: absolute;
  right: -3px;
  top: 10px;
}