/* allgemeine Formatierungen */
html {
	overflow-y: scroll;
	}

* {
	margin:0px;
	padding:0px;
}

body {
	font-family:Verdana, Helvetica, sans-serif;
	font-size:12px;
	}

a {
	outline:none;
	text-decoration:none;
}

/* vertikale zentrierung */
#wrapper {
	margin-left:0px;
	margin-top:-255px;
	border:0px solid green;
	width:925px;
	height:500px;
	position:absolute;
	top:50%;
	}
	
/* logo positionieren */
#logo {
	margin-left:78px;
	margin-top:28px;
	border:0px solid red;
	width:310px;
	float:left;
	}
	
/* navigationswrapper */
#navi {
	border: 0px solid blue;
	position:absolute;
	left:595px;
	top:83px;
	}
	
/* unterer teil der navigation */
#navi ul {
	border:0px solid yellow;
	font-size:13px;
	}

/* horizontale listenansicht */
#navi ul li{
	float:left;
	margin-right:25px;
	list-style-type:none;
	}
	
/* letzter listenpunkt braucht kein margin-right */
#navi ul li:last-child{
	float:left;
	margin-right:0px;
	list-style-type:none;
	}
	
#navi ul li:first-child{
	height:40px;
	}

/* hyperlinks in der unteren navigatio */
#navi ul li a:link,
#navi ul li a:visited {
	padding-top:20px;
	text-decoration:none;
	color:#58595b;
	}
	
#navi ul li a:hover,
#navi ul li a:active {
	text-decoration:none;
	color:#7b2f62;
	}

/* aktiver menupunkt */
a.navi-active {
	color:#7b2f62 !important;
	}

/* versteckt die subnavigation, bei hover sichtbar als dropdownmenu nach oben */	
#navi li ul{
	display:none;
	}
	
#navi li:hover ul{
	display:block;
	position:absolute;
	top:-68px;
	}
	
#navi li:hover ul li{
	float:left;
	display:block;
	margin-left:0px;
	width:300px;
	height:20px;
	font-size:12px;
	border:1px solid white;
	}
	
/* hyperlinks in der subavigation */
#navi li:hover ul li a:link,
#navi li:hover ul li a:visited{
	text-decoration:none;
	padding-top:0px;
	color:#808285;
	border:1px solid white;
	}
	
#navi li:hover ul li a:hover,
#navi li:hover ul li a:active {
	text-decoration:none;
	padding-top:0px;
	color:#732661;
	border:1px solid white;
	}
	
	
/* klasse zur float aufhebung */
.no-float {
	clear:both;
	}

/* wrapper für den textbereich */
#main {
	margin-top:15px;
	padding-top:0px;
	height:380px;
	width:570px;
	background-color:#eb90bd;
	border-top:0px solid #eb90bd;
	float:left;
	z-index:1;
	}
	
/* textbereich bei domizil und hippotherapie breiter; das bild wird als hintergrund der section eingefügt */
#main-domizil,
#main-hippo,
#main-portrait {
	margin-top:15px;
	padding-top:0px;
	height:380px;
	width:925px;
	background-color:#eb90bd;
	border-top:0px solid #eb90bd; 
	float:left;
	z-index:1;
	}

/* textteil */
#text {
	width:490px;
	height:380px;
	float:left;
	border:0px solid green;
	color:black;
	padding-left:80px;
	padding-top:0px;
	overflow:hidden;
	}
	
#text-domizil,
#text-hippo,
#text-portrait {
	width:845px;
	height:380px;
	float:left;
	border:0px solid green;
	color:black;
	padding-left:80px;
	padding-top:0px;
	overflow:hidden;
	}
	
/* sections für alle seiten, höhe des textteiles definieren */
section.textbereiche {
	float:left;
	width:490px;
	height:380px;
}

section.domizil1 {
	float:left;
	width:845px;
	height:380px;
	background-image: url(../images/domizilbehandlung.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}

section.domizil2 {
	float:left;
	width:845px;
	height:380px;
	background-image: url(../images/tandem-im-raum.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}

section.hippo1 {
	float:left;
	width:845px;
	height:380px;
	background-image: url(../images/angebot-hippo-bild1.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}

section.hippo2 {
	float:left;
	width:845px;
	height:380px;
	background-image: url(../images/angebot-hippo-bild2.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}


section.portrait1 {
	float:left;
	width:845px;
	height:380px;
	background-image: url(../images/Portrait-Bild-1.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}

section.portrait2 {
	float:left;
	width:845px;
	height:380px;
	background-image: url(../images/rahel-weber-gisler.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}

/* fixe höhe für den textbereich, um den button für die sprungmarke darunter zu platzieren */
div.texte1 {
	height:262px;
	margin-top:93px;
	}
	
div.texte2 {
	height:262px;
	margin-top:78px;
	margin-bottom:15px;
	}
	
div.spungmarke-down  {
	height:25px;
}


/* titelzeile als eigenes div mit fixer höhe, damit der text auch ohne titel am gleichen ort einsetzt */
div.texte1 h1,
div.texte2 h1 {
	font-size:15px;
	font-weight:normal;
	height:28px;
	width:440px;
	}
	
#text-kontakt h1 {
	font-size:15px;
	font-weight:normal;
	margin-top:93px;
	height:28px;
	width:440px;
	}
	
/* inhalt des textteils */
div.texte1 h2,
div.texte2 h2 {
	font-size:12px;
	font-weight:bold;
	margin-top:20px;
	width:440px;
	}
	
#text-kontakt h2 {
	font-size:12px;
	font-weight:bold;
	line-height:100%;
	margin-bottom:15px;
	margin-top:15px;
	width:440px;
	}
	
div.texte1 h3,
div.texte2 h3 {
	font-size:12px;
	font-weight:normal;
	margin-bottom:4px;
	width:440px;
	}
	
div.texte1 p,
div.texte2 p {
	font-size:12px;
	line-height:150%;
	margin-bottom:10px;
	width:440px;
	}
	
#text p.hippo {
	margin-top:20px;
	margin-bottom:21px;
	}
	
#text-kontakt p {
	margin-top:0px;
	margin-bottom:0px;
	}

#text ul,
#text-domizil ul,
#text-portrait ul {
	list-style-type:none;
	line-height:150%;
	width:440px;
	}

@-moz-document url-prefix() {	
#text ul,
#liste-portrait li {
	line-height:150% !important;
	}
}

/* will be red only in google chrome */
@media screen and (-webkit-min-device-pixel-ratio:0)
	{
		#liste-portrait li {
			line-height:140% !important;
		}
	}
	
#liste-portrait li {
	line-height:140%;
	}
	
#text ul.list-image,
#text-domizil ul.list-image,
#text-portrait ul.list-image {
	list-style-image:url(../images/list-image.png);
	}
	
#text ul.list-image li,
#text-domizil ul.list-image li,
#text-portrait ul.list-image li {
	margin-left:15px;
	}
	
#text a:link,
#text a:visited,
#text-domizil a:link,
#text-domizil a:visited {
	text-decoration:none;
	font-size:12px;
	color:#58595b;
	}
	
#text a:hover,
#text a:active,
#text-domizil a:hover,
#text-domizil a:active {
	text-decoration:none;
	font-size:12px;
	color:#732661;
	}
	
#text-kontakt a:link,
#text-kontakt a:visited {
	text-decoration:none;
	font-size:12px;
	color:#58595b;
	}
	
#text-kontakt a:hover,
#text-kontakt a:active {
	text-decoration:none;
	font-size:12px;
	color:#732661;
	}
	
/* zeichen für registrierte marke - ohne line-height zeigt edge eine falsche zeilenhöhe */
sup {
	line-height:100%;
	}
	
/* abdeckung, wenn der text lang ist */
#abdeckung-oben {
	position:absolute;
	width:570px;
	height:93px;
	left:0px;
	top:124px;
	background-color:#eb90bd;
	}

/* sprungmarke nach unten, bild und hover */
a.anker {
	height:0px;
	margin:0px 0px 0px 0px;
	padding:0px;
	font-size:0px;
	}

a.sprungmarke-down {
	display:block;
	width:15px;
	height:15px;
	border:0px solid white;
	margin-left:460px;
	margin-top:0px;
	}
	
a.sprungmarke-down:link,
a.sprungmarke-down:visited {
	background-image:url(../images/pfeil.png);
	background-repeat:no-repeat;
	}
	
a.sprungmarke-down:hover,
a.sprungmarke-down:active {
	background-image:url(../images/pfeil-hover.png);
	background-repeat:no-repeat;
	}
	

/* sprungmarke nach oben, bild und hover */	
a.sprungmarke-up {
	display:block;
	width:15px;
	height:15px;
	border:0px solid white;
	margin-left:460px;
	margin-top:0px;
	}
	
a.sprungmarke-up:link,
a.sprungmarke-up:visited {
	background-image:url(../images/pfeil-back.png);
	background-repeat:no-repeat;
	}
	
a.sprungmarke-up:hover,
a.sprungmarke-up:active {
	background-image:url(../images/pfeil-back-hover.png);
	background-repeat:no-repeat;
	}
	

	
/* positionierung des bildes */
#bild {
	float:left;
	margin-top:15px;
	}
	
/* gestaltung des kontaktformulars */
.buttons {
	margin-right: 0px;
}

.formular-format {
	color: black;
	width: 250px;
	border: 1px solid #7b2f62;
}