@charset "UTF-8";
/* CSS Document */
/*Stylesheet für www.pony-peppermint.de 
Name: pepper-basic.css
erstellt: Martina Bieringer - Mai 2011

Inhalt: 1. Kalibrierung
        2. Allgemeine Styles
        3. Layout
        4. Sonstige Styles 
--------------------------------------------------------------------------- */

/*---------1. Kalibrierung----------------- */

* { padding: 0; margin: 0; } 
 h2, h3, p, ul, ol { margin-bottom: 0.5em; }
li { margin-left: 2em; }    
   
/*---------2. Allgemeine Styles ------------ */   

html {
	height: 101%;
}    
   
body {
	color: #fffef5;
	background: #fffef5 url(_layoutpics/karo-muster.jpg) repeat center top;
	font: 12px/17px Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 0.1em;
}

h1 {
	color: #005079;
	font: bold 160%/25px Verdana, Arial, Helvetica, sans-serif;
	margin: 10px 0px 0px;
	padding-top: 15px;
	padding-bottom: 7px;
	background: url(_layoutpics/h1-hg-oben-re.gif) no-repeat right top;
	padding-right: 30px;
	width: 310px;
}
img {
	margin: 0px;
	padding: 0px;
	border-width: 0px;
}

#wrapper {
	background: url(_layoutpics/seiten-bg.png) repeat-x center 0px;
	width: 100%;
	margin: 0px;
	padding: 0px;
	left: 0px;
	top: 0px;
	right: 0px;
	height: 100%;
	text-align: center;
}

#wrapper #header {
	background: #fffef5 url(_layoutpics/header-bg.jpg) no-repeat center top;
	position: relative;
	height: 270px;
	width: 960px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	top: 62px;
	border-top: none;
	border-right: none;
	border-bottom: none;
	border-left: none;
	-moz-border-top-left-radius: 22px;
	-moz-border-top-right-radius: 22px;
	-webkit-border-top-left-radius: 22px;
	-webkit-border-top-right-radius: 22px;
	border-top-left-radius: 22px;
	border-top-right-radius: 22px;
	z-index: 50;
}

#wrapper #header #logo {
	position: absolute;
	height: 175px;
	width: 400px;
	top: 20px;
	right: 340px;
}

#wrapper #header #herz {
	position: absolute;
	height: 250px;
	width: 250px;
	top: -60px;
	left: -40px;
}
#wrapper #header #ponypost {
	position: absolute;
	height: 120px;
	width: 100px;
	top: 250px;
	left: -50px;
	z-index: 100;
}
#wrapper #content {
	text-align: left;
	position: relative;
	width: 960px;
	background: #FFFef5 url(_layoutpics/content-bg.jpg) repeat-y center 0px;
	top: 60px;
	margin: 0px auto;
	padding: 30px 0px 0px;
	-moz-border-bottom-left-radius: 22px;
	-webkit-border-bottom-right-radius: 22px;
	border-bottom-left-radius: 22px;
	-moz-border-bottom-right-radius: 22px;
	-webkit-border-bottom-left-radius: 22px;
	border-bottom-right-radius: 22px;
	color: #005079;
}

#wrapper #content #nav {
	width: 250px;
	top: 20px;
	z-index: 1;
	margin-left: 25px;
	left: 0px;
	float: left;
	padding-top: 20px;
}

#wrapper #content #right {
	width: 250px;
	top: 20px;
	z-index: 1;
	margin-right: 25px;
	left: 0px;
	float: right;
}

#wrapper #content #right .amazon {
	width: 200px;
	text-align: center;
	margin-top: 30px;
}

#right .amazon img { margin-bottom: 20px; }

#wrapper #content #nav ul {
	margin-top: 0px;
	background: url(_layoutpics/Nav-hg-oben-rechts.gif) no-repeat right top;
}

#wrapper #content #main {
	width: 350px;
	margin-left: 310px;
	margin-top: 0px;
	padding-top: 30px;
	z-index: 20;
}
#wrapper #content #main2 {
	width: 340px;
	margin-left: 310px;
	margin-top: 0px;
	padding-top: 0px;
	z-index: 20;
}
#wrapper #content #mainflash {
	width: 600px;
	margin-left: 310px;
	margin-top: 0px;
	padding-top: 30px;
	z-index: 20;
}
#wrapper #content #nav li {
	list-style: none;
	margin-left: 0px;
}
#main p {
	letter-spacing: 0.05em;
	width: 320px;
}

#wrapper #content #footer {
	clear: both;
	height: 90px;
	width: 960px;
	position: relative;
	bottom: 0px;
	margin: 0px;
	border-bottom-left-radius: 22px;
	border-bottom-right-radius: 22px;
	background: #fffef5 url(_layoutpics/footer-bg.png) no-repeat center bottom;
}
#wrapper #content #footer h4 {
	margin-top: 20px;
	font-style: italic;
	font-weight: normal;
	font-size: x-small;
	color: #660000;
	position: relative;
	height: 50px;
	width: 960px;
	top: 100px;
	text-align: center;
}
ul .nav-ebene1 a, ul .nav-ebene2 a,  ul .nav-ebene3 a, ul li.ueberschrift, ul li.nav-ebene1-act, ul li.nav-ebene2-act, ul li.nav-ebene3-act {
	color: #005079;
	list-style: none;
	padding-left: 15px;
	display: block;
}
ul .nav-ebene1 a, ul li.ueberschrift, ul li.nav-ebene1-act {
	font-weight: bold;
	font-size: 14px;
	line-height: 24px;
	padding-top: 10px;
}

ul .nav-ebene2 a, ul .nav-ebene3 a, ul li.nav-ebene2-act, ul li.nav-ebene3-act {
	background: url(_layoutpics/nav-li-hg.png) no-repeat left center;
	padding-left: 25px;
}
.nav-ebene2 a, #wrapper #content #nav ul li.nav-ebene2-act {
	margin-left: 15px;
}

.nav-ebene3 a, #wrapper #content #nav ul li.nav-ebene3-act {
	margin-left: 30px;
}
ul .nav-ebene1 a:hover, ul .nav-ebene2 a:hover,  ul .nav-ebene3 a:hover, ul li.nav-ebene1-act, ul li.nav-ebene2-act, ul li.nav-ebene3-act {
	color: #005079; 
}
.bild-rechts {
	border: 3px solid #34b4b5;
	background: #fffef5;
	float: right;
}
#wrapper #content #main .bild-oben {
	border: 3px solid #cccccc;
	background: #fffef5;
}
h2, h3 {
	font-size: 110%;
}

address {
	text-align: right;
	font-size: 80%;
	font-style: normal;
	letter-spacing: 2px;
	line-height: 1.5;
	color: #faf1f2;
}

blockquote {
	font-style: italic;
	font-weight: bold;
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 150%;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 0px;
}


/*------------------------ Hyperlinks---------------------------*/  

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

a:link, a:visited { color: #403245; }

a:hover, a:focus, a:active { color: #90719c; }



/*-------------------- Klassen----------------------------------*/

.skiplink {
  position: absolute; 
  top: -5000px; 
  left: -5000px; 
  width: 0;
  height: 0; 
  overflow: hidden; 
  display: inline; 
}

#wrapper #content #einbrenner {
	position: absolute;
	height: 250px;
	width: 160px;
	top: 10px;
	right: 0px;
	background: url(bilder/Einbrenner-Buecher.gif) no-repeat right top;
	z-index: 100;
}
#wrapper #content #einbrenner2 {
	position: absolute;
	height: 250px;
	width: 180px;
	top: 10px;
	right: 0px;
	background: url(bilder/Einbrenner-Spiel.gif) no-repeat right top;
	z-index: 100;
}

#bestellen {
	height: 60px;
	width: 180px;
	left: 0px;
	bottom: 0px;
	padding-top: 210px;
}

#bestellen h3 { padding-left: 10px; }

#wrapper #content #main .anmerkung {
	font-size: 10px;
	font-style: italic;
	padding-top: 5px;
	text-align: left;
	line-height: normal;
}

.amazon2 { padding: 50px 0px 0px 20px; }

#flash-puzzle {
	float: left;
	height: 450px;
	width: 750px;
	position: absolute;
	z-index: 100;
	left: 50px;
	top: 50px;
	border: 3px solid #34b4b5;
}

#main ul.marketing { 
	margin-left: 50px;
	margin-top: 140px;
	font-size: 10px;
	font-weight: bold;
}

h1.top {
	color: #005079;
	font: bold 160%/25px Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding-top: 0px;
	padding-bottom: 7px;
	background: url(_layoutpics/h1-hg-oben-re.gif) no-repeat right top;
	padding-right: 30px;
	width: 310px;
}

.right {float: right;}
.left {float: left;}
.clear { clear: both }

#facebook { 
	margin-left: 20px;
	margin-top: 20px;
}
#facebook span.connect_widget_not_connected_text { 
	color: #fffef5;
	font: 10px Verdana, Arial, Helvetica, sans-serif;
}

.monat {
	text-align: right;
	font-weight: bold;
	font-size: 90%;
	font-style: italic;
	padding-top: 20px;
}
h2 {
	color: #CC0066;
}

