body {
	width: auto;
	min-height: 400px;

  margin: 0px;
  overflow: hidden;
	background-color: #FFFFFF;
}
#main {
  top: 25%; position: absolute;
	width: 100%;
	bottom: 25%;
}

#wasser {
 top: 0px; left: 0px; height:25%; min-height:100px; width: 100%; position:absolute;
 background-image: url(static/title/wasser.jpg);
  background-repeat: no-repeat; background-position:top;
}
#sanitaer {
 height: 100%;
 width: 100%;
 vertical-align:middle;
 position:absolute;
 background-image: url(static/title/sanitaer.gif);
 background-position: center;
 background-repeat: no-repeat;
 z-index: 1;
 line-height: 192px;
}
#sonne {
 bottom: 0px;
 left: 0px; height: 25%; min-height:100px; width: 100%; position:absolute;
 background-image: url(static/title/sonne.jpg);
  background-repeat: no-repeat; background-position:bottom;
}
#heizung {
 height: 100%;
 width: 100%;
 vertical-align:middle;
 position:absolute;
 background-image: url(static/title/heizung.gif);
 background-position: center;
 background-repeat: no-repeat;
 z-index: 1;
 line-height: 192px;
}

/*
 create wuermli.png (mit zwei requests für die beiden schriften):
  http://sampler.linotype.com/mls?fg_r=0&fg_g=153&fg_b=255&bg_r=255&bg_g=255&bg_b=255&ID=12701&fontsize=100&text=W%DCRMLI&&sizex=800
  http://sampler.linotype.com/mls?fg_r=0&fg_g=153&fg_b=255&bg_r=255&bg_g=255&bg_b=255&ID=12563&fontsize=31&text=H+A+U+S+T+E+C+H+N+I+K++A+G&&sizex=800
 */

#wuermli {
 height: 100%; width: 100%;
  margin-top: -40px;
  top: 40%;
  position:relative;

 z-index: 2;
 text-align:center;
}
img {
 z-index: 3;
 border: 0px;
}