/* Kleine & Jockers GmbH
CSS - Andreas Kleine
März 2010
*/

/* Farbschema
--------------------------------------------------------------------------------------- */

/*
Farbton (standard/grün): #aed477
Farbton (cosmetics/braun): #b0a390
Farbton (massage/grau): #92918d
Farbton (yoga/blau): #00a69c
Farbton (mutter-kind/hellblau): #00b5cc
Farbton (news/lila): #a29dc0
*/

/* Reset
--------------------------------------------------------------------------------------- */
* {
	padding: 0;
	margin: 0;
	border: 0;
}
/* Globals und Typo 
--------------------------------------------------------------------------------------- */

html {
/* Wahlweise Grid-Hintergrund
Rasterhintergrund, der die Breite bis 100 Pixel und eine Höhe bis 950 Pixel anzeigt. Die Breite von 960 Pixel ist markiert. Der Hintergrund ist transparent, muss also nicht nur mit #fff verwendet werden. Es wird eine Schriftgröße von 75% oder 12px festgelegt.
	background: #fff url(bilder/grid.png) top left no-repeat;
*/	
	background: #fff;
}

body {
/* Wahlweise Linienhintergrund
Linienhintergrund abgestimmt auf eine Schriftgröße von 12px.	
	background: transparent url(bilder/line-height.gif) top left;
	*/	
	background: #fff;
	font-size: 75%;
}

html>body {
	font-size: 12px;
}

a:link {
	color: #fff;
	text-decoration: none;
}

a:visited {
	color: #fff;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

/* Macht die gepunktete Linie um geklickte Links unsichtbar
--------------------------------------------------------------------------------------- */
a:focus {
    outline: none;
}


/* Vertikaler Rhythmus basierend auf 12px Basisgröße für den Fließtext
--------------------------------------------------------------------------------------- */
p {
	font: 1.6em/1.3em Arial, Tahoma, Verdana, sans-serif;
	margin-top: 0.5em;
	margin-bottom: 0.6em;
	color: #fff;
	text-align: center;
	font-weight: normal;
}

h1 {
	font: 1.67em/0.9em Arial, Tahoma, Verdana, sans-serif;;
	margin-top: 0.9em;
	margin-bottom: 0.9em;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 3.0em;
	font-weight:normal;
	color: #FFF;
	margin-top: 0.2em;
	margin-bottom: 0.5em;
	text-align: center;
}
.frame {
	margin-top: 120px;
	
	}
h3 {
	font: 1.33em/1.13em Georgia, "Times New Roman", Times, serif;
	margin-top: 1.13em;
	margin-bottom: 1.13em;
}

h4 {
	font: 1.17em/1.29em Georgia, "Times New Roman", Times, serif;
	margin-top: 1.29em;
	margin-bottom: 1.29em;
}

a[href$='.pdf'] { 
	padding: 5px 22px 5px 0;
	background: transparent url(/images/icon_pdf.png) no-repeat center right;
}

/* Bilder und verlinkte Bilder ohne Rahmen 
--------------------------------------------------------------------------------------- */
img, a img {
	border: 0;
}


/* Links- bzw. Rechtsausrichtung für Elemente
--------------------------------------------------------------------------------------- */
.links {
	float: left;
	margin: 0 0.5em 0.5em 0;
}

.rechts {
	float: right;
	margin: 0 0 0.5em 0.5em;
}



/* Layoutelemente
Verwenden Sie overflow: hidden; um nötige Foats aufzulösen.
--------------------------------------------------------------------------------------- */
#wrapper {
margin: 10px auto; 
width: 960px;
background: #fff;
border: 1px solid #ccc;
}


#content {
width: 960px;
background: #fff;
position: relative;
}


#footer {
	width: 960px;
	height: 35px;	
	background: #fff;
	position: relative;
}

#left {
	width: 250px;
	background: #aed477;
	height: 637px;
	float: left;
	margin: 8px 0 0 8px;
	}
#main {
	width: 689px;
	background: #fff;
	float: right;
	margin: 8px 8px 0 0;
	}
.fltclr {
	clear:both;
	}
	
h1 {
	position:absolute;
	top: 16px;
	padding: 24px 0 24px 15px;
	margin: 0;
	left: 18px;
	width: 213px;
	}

h1 span {
	position: absolute;
	top: -332px;
	left: -767px;
	width: 508px;
}

.text {
	position: absolute;
	left: 263px;
	top: 406px;
	width: 689px;
	height: 225px;
	background-image: url(../pix/transparent.png);
	background-repeat:repeat;
	}

.textUeber {
	position: absolute;
	left: 263px;
	top: 262px;
	width: 689px;
	height: 258px;
	background-image: url(../pix/transparent.png);
	background-repeat:repeat;
	}

.textStudio {
	position: absolute;
	left: 263px;
	top: 262px;
	width: 689px;
	height: 214px;
	background-image: url(../pix/transparent.png);
	background-repeat:repeat;
	}
	
.textTeam {
	position: absolute;
	left: 263px;
	top: 402px;
	width: 689px;
	height: 243px;
	background-image: url(../pix/transparent.png);
	background-repeat:repeat;
	}

.textJobs {
	position: absolute;
	left: 264px;
	top: 7px;
	width: 689px;
	height: 637px;
  background-color: #aed477;
	}
	
.textMedizinischeK {
	position: absolute;
	left: 263px;
	top: 294px;
	width: 689px;
	height: 210px;
	background-image: url(../pix/transparent-braun.png);
	background-repeat:repeat;
	}
.textMedizinischeBehandlungen {
	position: absolute;
	left: 263px;
	top: 8px;
	width: 689px;
	height: 637px;
	background-color: #b0a390;
	}

.textYogaPilates {
	position: absolute;
	left: 263px;
	top: 8px;
	width: 689px;
	height: 637px;
	background-color: #00a69c;
	}

.textNews {
	position: absolute;
	left: 263px;
	top: 8px;
	width: 689px;
	height: 637px;
	background-color: #a29dc0;
	}


.textMassagnePreise {
	position: absolute;
	left: 263px;
	top: 8px;
	width: 689px;
	height: 637px;
	background-color: #92918d;
	}
	
.textMutterPreise {
	position: absolute;
	left: 263px;
	top: 8px;
	width: 689px;
	height: 637px;
	background-color: #00b5cc;
	}
	
.textMassagen {
	position: absolute;
	left: 263px;
	top: 330px;
	width: 689px;
	height: 151px;
	background-image: url(../pix/transparent-grau.png);
	background-repeat:repeat;
	}
.textSpa {
	position: absolute;
	left: 263px;
	top: 330px;
	width: 689px;
	height: 201px;
	background-image: url(../pix/transparent-grau.png);
	background-repeat:repeat;
	}
.textYoga {
	position: absolute;
	left: 263px;
	top: 366px;
	width: 689px;
	height: 181px;
	background-image: url(../pix/transparent-blau.png);
	background-repeat:repeat;
	}

.textMutter {
	position: absolute;
	left: 263px;
	top: 402px;
	width: 689px;
	height: 180px;
	background-image: url(../pix/transparent-hellblau.png);
	background-repeat:repeat;
	}

.textSub {
	position: absolute;
	left: 263px;
	top: 8px;
	width: 689px;
	height: 637px;
	background-color: #aed477;
	}

.contentSub {
	position: absolute;
	left: 276px;
	top: 22px;
	width: 662px;
	height: 610px;
	background-color: #fff;
	}


.behandlungenIntensiv {
	position: absolute;
	left: 263px;
	top: 185px;
	width: 689px;
	height: 460px;
	background-color: #b0a390;
	}

.behandlungenYoga {
	position: absolute;
	left: 263px;
	top: 185px;
	width: 689px;
	height: 460px;
	background-color: #00a69c;
	}

.behandlungenNews {
	position: absolute;
	left: 263px;
	top: 185px;
	width: 689px;
	height: 459px;
	background-color: #a29dc0;
	}
.behandlungenMassagen {
	position: absolute;
	left: 263px;
	top: 185px;
	width: 689px;
	height: 460px;
	background-color: #92918d;
	}

.behandlungenMutter {
	position: absolute;
	left: 263px;
	top: 185px;
	width: 689px;
	height: 460px;
	background-color: #00b5cc;
	}
.absatz {
	color: #fff;
	text-align: left;
	padding: 10px 30px 10px 30px;
	font-size: 17px;
	line-height: 1.2em;
	}

.absatz strong {
	color: #693;
	}

.print {
	position: absolute;
	top: -300px;
	left: 100px;
	}
ul {
	margin: 250px 0 0 0px;
	}

li {
	font-size: 1.9em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #FFF;
	line-height: 1.6em;
	text-transform: uppercase;
	display: block;
	padding-left: 35px;
	}

li a {
	color: #FFF;
	display: block;
	}
li a:hover {
	color: #693;
	display: block;
	}	
.sub {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 1.6em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	}

.sub a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 15px;
	}

.sub a:hover {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #693;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 15px;
	}

.subC {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #693;
	line-height: 1.6em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	}

.subC a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #693;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 15px;
	}

.subC a:hover {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #693;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 15px;
	}


.current a {
	color: #693;
	}
	
.currentCosmetic{
	background-color: #b0a390;
	}


.currentCosmetic a {
	color: #7c7365;
	background-color: #b0a390;
	padding-top: 1px;
	}

.currentCosmetic a:hover {
	color: #7c7365;
	}
.subCosmetic {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #7c7365;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #b0a390;
	}

.subCosmetic a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #b0a390;
	padding: 0 0 0 10px;
	}

.subCosmetic a:hover {
	color: #7c7365;
	background-color: #b0a390;
	}

.subCosmeticC {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #7c7365;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #b0a390;
	}

.subCosmeticC a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #7c7365;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #b0a390;
	padding: 0 0 0 10px;
	}

.subCosmeticC a:hover {
	color: #7c7365;
	background-color: #b0a390;
	}
.letztesE a {
	padding-bottom: 10px;
	}

.behandlungen a {
	padding-left: 30px;
	padding-bottom: 6px;
	text-transform: none;
	}
	
.currentMassage {
	background-color: #92918d;
	}
	
.currentMassage a {
	color: #686764;
	background-color: #92918d;
	padding-top: 1px;
	}
.currentMassage a:hover {
	color: #686764;
	}

.subMassage{
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #7c7365;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #92918d;
	}

.subMassage a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #92918d;
	padding: 0px 0 0px 10px;
	}

.subMassage a:hover {
	color: #686764;
	background-color: #92918d;
	}

.subMassageC {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #686764;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #92918d;
	}

.subMassageC a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #686764;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #92918d;
	padding: 0px 0 0px 10px;
	}

.subMassageC a:hover {
	color: #686764;
	background-color: #92918d;
	}
	
.currentYoga{
	background-color: #00a69c;
	}


.currentYoga a {
	color: #016963;
	background-color: #00a69c;
	padding-top: 1px;
	}

.currentYoga a:hover {
	color: #016963;
	}

.subYoga {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #7c7365;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #00a69c;
	}

.subYoga a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #00a69c;
	padding: 0 0 0 10px;
	}

.subYoga a:hover {
	color: #016963;
	background-color: #00a69c;
	}
.letztesEYoga a {
	padding-bottom: 10px;
	}
.letztesEYogaC a {
	padding-bottom: 10px;
	color: #016963;
	}
.subYogaC {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #7c7365;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #00a69c;
	}

.subYogaC a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #016963;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #00a69c;
	padding: 0 0 0 10px;
	}

.subYogaC a:hover {
	color: #016963;
	background-color: #00a69c;
	}

	
.currentMutter{
	background-color: #00b5cc;
	}


.currentMutter a {
	color: #027483;
	background-color: #00b5cc;
	padding-top: 1px;
	}

.currentMutter a:hover {
	color: #027483;
	}

.subMutter {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #027483;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #00b5cc;
	}

.subMutter a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #00b5cc;
	padding: 0 0 0 10px;
	}

.subMutter a:hover {
	color: #027483;
	background-color: #00b5cc;
	}
.letztesEMutter a {
	padding-bottom: 10px;
	}

.letztesEMutterC a {
	padding-bottom: 10px;
	color: #027483;
	}
.subMutterC {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #027483;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	margin: 0 0 0 0px;
	background-color: #00b5cc;
	}

.subMutterC a {
	font-size: 1.1em;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	color: #027483;
	line-height: 1.4em;
	text-transform: uppercase;
	display: block;
	background-color: #00b5cc;
	padding: 0 0 0 10px;
	}

.subMutterC a:hover {
	color: #016963;
	background-color: #00b5cc;
	}

.currentNews{
	background-color: #a29dc0;
	}


.currentNews a {
	color: #7a7692;
	background-color: #a29dc0;
	padding-top: 1px;
	}
.currentNews a:hover {
	color: #7a7692;
	}

#footer ul {
	background: #ccc;
	margin: 0 0 0 305px;
	}

#footer li {
	float: left;
	width: 120px;
	font-size: 1.4em;
	text-align: center;
	line-height: 35px;
	color:#aed477;
	display: block;
	padding: 0;
	}

#footer li a {
	float: left;
	width: 120px;
	text-align: center;
	line-height: 35px;
	color:#aed477;
	display: block;
	}

#footer li a:visited {
	float: left;
	width: 120px;
	text-align: center;
	line-height: 35px;
	color:#aed477;
	display: block;
	}

#footer li a:hover {
	float: left;
	width: 120px;
	text-align: center;
	line-height: 35px;
	color:#693;
	display: block;
	background: #aed477;
	}

#footer #currentFooter {
	background-color: #aed477;
	color: #fff;
	}
	
#footer .currentFooter a{
	background-color: #aed477;
	color: #fff;
	}

#footer .currentFooter a:visited{
	background-color: #aed477;
	color: #fff;
	}


	
.printFooter {
	color: #ccc;
	position: absolute;
	top: 36px;
	left: -2px;
	font-size: 1.1em;
	width: 637px;
	text-align: left;
	} 

.printFooter a {
	color: #ccc;
	text-decoration: none;
	}
.printFooter a:hover {
	color: #ccc;
	text-decoration: none;
	}

.printFooter a:visited {
	color: #ccc;
	text-decoration: none;
	}
	
.share {
	position: absolute;
	top: 43px;
	left: 878px;
	width: 87px;
	height: 19px;
	}	
#fotogalerie {
	position:absolute;
	top: 213px;
	left: 806px;
	background-image: url(../pix/transparent.png);
	background-repeat:repeat;
	width: 126px;
	height: 17px;
	display: block;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	padding: 10px;
	text-align: center;
	font-weight: normal;
	}

#fotogalerie a{
	color: #fff;
	}

#fotogalerie a:hover{
	color: #693;
	}


.fotoNaviLinks {
	width: 37px;
	height: 38px;
	position: absolute;
	top: 32px;
	left: 0px;
	}
	
.fotoNaviLinks a {
	width: 37px;
	height: 38px;
	position: absolute;
	background-image: url(../pix/pfeil-links.png);
	background-repeat: no-repeat;
	display: block;
	top: 110px;
	left: 263px;
	}

.fotoNaviLinks a:hover {
	width: 37px;
	height: 38px;
	position: absolute;
	background-image: url(../pix/pfeil-links-hover.png);
	background-repeat: no-repeat;
	display: block;
	top: 110px;
	left: 263px;
	}

.fotoNaviLinks span {
	display: none;
	}

.fotoNaviRechts {
	width: 37px;
	height: 38px;
	position: absolute;
	top: 115px;
	left: 322px;
	}
.fotoNaviRechts a {
	width: 37px;
	height: 38px;
	position: absolute;
	background-image: url(../pix/pfeil-rechts.png);
	background-repeat: no-repeat;
	display: block;
	top: 25px;
	left: 593px;
	}

.fotoNaviRechts a:hover {
	width: 37px;
	height: 38px;
	position: absolute;
	background-image: url(../pix/pfeil-rechts-hover.png);
	background-repeat: no-repeat;
	display: block;
	top: 25px;
	left: 593px;
	}

.fotoNaviRechts span {
	display: none;
	}

.tabYoga {
	width: 620px;
	color: #FFF;
	margin: 0px 0px 0 40px;
	font: 17px/1.2em Arial, Tahoma, Verdana, sans-serif;
	}
.tabYoga table {
	border: 0px;
	}
.tabFett {
	font-weight: bold;
	padding-top: 5px;
	}	

#maps {
	width: 641px;
	height: 587px;
	position: absolute;
	top: 12px;
	left: 11px;
	}
#kontakt {
	width: 641px;
	height: 595px;
	top: 12px;
	left: 11px;
	}

#kontakt a{
	color: #aed477;
	text-decoration: underline;
	}

#kontakt a:hover{
	color: #aed477;
	text-decoration: none;
	}

#kontakt a:visited{
	color: #aed477;
	text-decoration: underline;
	}
	
.frameKontakt {
	margin-top: 120px;
	color: #686868;
	}
#anschrift {
	width: 302px;
	height: 314px;
	top: 227px;
	left: 175px;
	position: absolute;
	font: 1.4em/1.3em Arial, Tahoma, Verdana, sans-serif;
	color: #686868;
	}

#anschrift a{
	color: #686868;
	text-decoration: none;
	}

#anschrift a:hover{
	color: #aed477;
	text-decoration: none;
	}
#presse {
	width: 659px;
	height: 357px;
	top: 176px;
	left: 5px;
	position: absolute;
	font: 17px/1.2em Arial, Tahoma, Verdana, sans-serif;
	color: #686868;
	}
#presse table {
	border: 0px;
	}

#partner {
	width: 294px;

	top: 177px;
	left: 189px;
	position: absolute;
	font: 17px/1.2em Arial, Tahoma, Verdana, sans-serif;
	color: #686868;
	}
.pressekontakt {
	width: 604px;
	height: 39px;
	top: 561px;
	left: 32px;
	position: absolute;
	}
.pressekontakt p {
	color: #444;
	text-align: left;
	font: 17px/1.2em Arial, Tahoma, Verdana, sans-serif; 
	}
#impressum {
	width: 659px;
	height: 603px;
	top: 5px;
	left: 3px;
	position: absolute;
	font: 1.4em/1.3em Arial, Tahoma, Verdana, sans-serif;
	color: #686868;
	}
.namenGruen {
	color: #693;
	}
.mail a {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 17px;
	font-weight: normal;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
}

.mail a:hover {
	text-decoration: none;
	color: #7FA745;
}

.facebook {
	width: 287px;
	height: 59px;
	background: #fff;
	position: absolute;
	top: 37px;
	left: 691px;
	}
.specialBehandlung {
	margin-left: 15px;
	}
.behandlungenMassage a{
	padding-left: 30px;
	padding-bottom: 6px;
	text-transform: none;
	}