/* 
code by mondfabrikdotde # last changed 25-06-2008  
*/

body {
font-family: arial, sans-serif; 
font-size:12px; 
color:#000; 
padding:0; 
margin:30px 0 0 0;
text-align:center;
background:  #ccc url("/img/bg.jpg") top left;
}

a:link, a:visited, a:active {
color: #FF4761;
font-weight: bold;
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

code {
color: #009933;
font-weight: bold;
text-align: left;
}

code u {
color: #ff0000;
}

ul {
list-style: none;
margin: 0;
padding: 0;
}

img, a img {
border: 0;
margin: 0;
padding: 0;
}

/* --------------header------------- */

#header {
/*border:1px solid #000;*/
height:61px;
margin: 0;
padding: 0;
text-align:left;
background:  url("/img/logo.gif") no-repeat bottom right;
z-index: 50;
width: 100%;
}

#header a.home {
display					: 	block;
width					: 	200px;
height					: 	60px;
float: right;
z-index: 100;
}

#header span {
display					: 	none;
}

/* --------------wrap/container------------- */

#container {
color:#000;
margin:0 auto;
padding:0;
text-align:left;
background: #ccc url("/img/bg_box.png") top left;
width: 800px;
height: 600px;
border: 1px solid #666;
}

#kinder #container {
background: #ccc url("/img/bg_box_kinder.png") top left;
}

#kueche #container {
background: #ccc url("/img/bg_box_kueche.png") top left;
}

#kinkerlitzchen #container {
background: #ccc url("/img/bg_box_kinkerlitzchen.png") top left;
}

#wrap {
width: 800px;
height: 600px;
padding:0;
margin:0;
background: transparent url("/img/bg_stage.png") no-repeat top right;
}


/* --------------horizontal mainmenu------------- */


#menu {
position: relative;
top: 15px;
left: 84px;
width: 490px;
margin: 0;
height: 38px;
list-style-type: none;
overflow: hidden;
}

#menu a {
position: absolute;
top: 0;
width: 84px;
text-indent: -9000px;
text-decoration: none;
padding: 35px 0 0 0;
overflow: hidden;
height: 0px !important; 
background: transparent url("/img/menu.png") no-repeat 0 0;
}

#menu a:hover,
#menu a:active {
outline: none;
}

#menu li#mkinder a {
left: 0;
width: 84px;
background-position: 0 0;
}

#menu li#mkinder a:hover,
#kinder #menu li#mkinder a {
background-position: 0 -40px;
}

#menu li#mkueche a {
left: 100px;
width: 84px;
background-position: -100px 0;
}

#menu li#mkueche a:hover,
#kueche #menu li#mkueche a {
background-position: -100px -40px;
}

#menu li#mkinkerlitzchen a {
left: 200px;
width: 180px;
background-position: -200px 0;
}

#menu li#mkinkerlitzchen a:hover,
#kinkerlitzchen #menu li#mkinkerlitzchen a {
background-position: -200px -40px;
}

#menu li#mkontakt a {
left: 380px;
width: 100px;
background-position: -380px 0;
}

#menu li#mkontakt a:hover,
#kontakt #menu li#mkontakt a {
background-position: -380px -40px;
}

/* --------------content------------- */

#content {
padding: 0 20px;
margin: 0 0 0 64px;
height: 510px;
width: 640px;
/*border: 1px solid #999; */
}

/* --------------footer------------- */

#footer {
clear:both;
margin:0;
padding:0;
height:20px;
}

#footer p {
font-weight:normal;
text-align:center;
padding: 7px 0 0 0;
margin:0;
font-size: 11px;
color:#000; 
text-transform: uppercase;
}

#footer a {
font-weight:normal;
color:#000;
text-decoration: underline;
}

.vali {
font-size: 0.9em; 
background: #fff url(/img/check.jpg) 0 50% no-repeat; 
padding: .1em 5px .1em 20px; 
border: 1px solid #999; 
}


.vali a, .vali a:visited {  
color: #999; 
font-weight:bold;
text-decoration: none;
}

/* --------------various tags------------- */

.imgleft, .imgright {
padding:10px;
background: #fff;
float: left;
margin: 5px 15px 0 0;
}

.imgright {
float: right;
margin: 5px 0 0 15px;
}

.clear {
clear:both;
height:1px;
width:1px;
display: block;
}

.hide {
display:none;
}

/* --------------text format------------- */

#start #content   {
background: transparent url("/img/filzschuessel.jpg") no-repeat center center;
}

#content p { 
text-align:left; 
line-height:1.8em; 
margin-top:0;
}

#start #content h1 { 
font-size:40px; 
color:#fff; 
margin: 0;
padding: 24px 0 0 2px;
width: 320px;
float: left;
}

#kontakt #content p.left { 
line-height:1.4em; 
margin-top: 40px;
padding: 0 40px 0 0;
width: 270px;
float: left;
color:#333; 
border-right: 1px solid #ccc;
}

#start #content p,
#kontakt #content p { 
padding: 40px 0 0 40px;
width: 280px;
float: left;
}

h1, h2, #box strong {
text-align:left; 
font-weight:bold;
font-family:Arial Narrow, Arial, Helvetica, Sans Serif;
font-size:1.6em; 
letter-spacing:0.2em;
text-transform: uppercase;
}

h2, #box strong { 
text-transform: uppercase;
font-size:1.4em; 
margin:0 0 5px 0; 
padding-top:10px; 
border-bottom: 1px solid #ccc;
}

#box p {
clear:both; 
margin:0; 
padding:40px 0 0 0; 
width:640px;
}

#box p.left,
#box p.leftbottom,
#box p.right,
#box p.rightbottom { 
margin:0; 
padding:0 10px 10px 10px; 
width:295px;
color: #000;
background: #fff;
opacity: .6;
}

#box p.right,
#box p.rightbottom { 
margin:0 0 0 317px;
width: 293px; 
}

#box p.leftbottom { 
margin: 300px 0 0 0;
}

#box p.rightbottom { 
margin: 300px 0 0 317px;
}

#kinder #box .sub7 p.leftbottom { 
margin: 310px 0 0 0;
}

#kinkerlitzchen #box .sub3 p.leftbottom { 
margin: 300px 0 0 0;
}

#kinkerlitzchen #box p.rightbottom { 
margin: 350px 0 0 317px;
}


#impressum .small {
font-size: .95em;
text-align: left;
line-height:1.2em; 
padding-top: 5px;
}

#impressum h2 {
padding-top: 20px;
}

p.pics {
float: left;
width: 280px;
margin: 0 20px 20px 0;
}


/* -------------- BOXEN -------------*/

#box a {
background: transparent url("/img/submenu.png") no-repeat;
outline-width: 0;
}

#box a:hover,
#box a:active {
outline: none;
}

#kinder #box a {
background-color: #EF9BA5;
}

#kinder #box a:hover,
#kinder #box a:active {
background-color: #D83A4F;
}

#kueche #box a {
background-color: #85C2E0;
}

#kueche #box a:hover,
#kueche #box a:active {
background-color: #55AAD4;
}

#kinkerlitzchen #box a {
background-color: #B7CF9D;
}

#kinkerlitzchen #box a:hover,
#kinkerlitzchen #box a:active {
background-color: #86AE5B;
}

a.box, 
a.box:visited {
display:block; 
color:#000; 
text-decoration:none;  
width:40px; 
height:30px; 
float:left; 
margin: 0; 
z-index:50;
}

#box a.sub2 {
background-position: -40px 0;
}

#box a.sub3 {
background-position: -80px 0;
}

#box a.sub4 {
background-position: -120px 0;
}

#box a.sub5 {
background-position: -160px 0;
}

#box a.sub6 {
background-position: -200px 0;
}

#box a.sub7 {
background-position: -240px 0;
}

#box a.sub8 {
background-position: -280px 0;
}

#box a.sub9 {
background-position: -320px 0;
}

#kinder #box a.sub1 span   {
background: transparent url("/img/unterwaesche.jpg") no-repeat 0 0;
}

#kinder #box a.sub2 span   {
background: transparent url("/img/girlanderitis.jpg") no-repeat 0 0;
}

#kinder #box a.sub3 span   {
background: transparent url("/img/bilderbuch.jpg") no-repeat 0 0;
}

#kinder #box a.sub4 span   {
background: transparent url("/img/schnullerketten.jpg") no-repeat 0 0;
}

#kinder #box a.sub5 span   {
background: transparent url("/img/tshirts.jpg") no-repeat 0 0;
}

#kinder #box a.sub6 span   {
background: transparent url("/img/spangen.jpg") no-repeat 0 0;
}

#kinder #box a.sub7 span   {
background: transparent url("/img/brottaschen.jpg") no-repeat 0 0;
}

#kueche #box a.sub1 span   {
background: transparent url("/img/untersetzer.jpg") no-repeat 0 0;
}

#kueche #box a.sub2 span   {
background: transparent url("/img/ei.jpg") no-repeat 0 0;
}

#kueche #box a.sub3 span   {
background: transparent url("/img/kueche_f03.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub1 span   {
background: transparent url("/img/flaschengeist.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub2 span   {
background: transparent url("/img/vasen.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub3 span   {
background: transparent url("/img/haengetasche.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub4 span   {
background: transparent url("/img/hilfe.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub5 span   {
background: transparent url("/img/taschentuch.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub6 span   {
background: transparent url("/img/ketten.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub7 span   {
background: transparent url("/img/pilze.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub8 span   {
background: transparent url("/img/kissen.jpg") no-repeat 0 0;
}

#kinkerlitzchen #box a.sub9 span   {
background: transparent url("/img/schluesselanhaenger.jpg") no-repeat 0 0;
}


a.box span   {
display:none;
}

a.box:hover, 
a.box:focus {
background-color: #000;
}

#box {
position:relative;
width:640px; 
height:340px; 
margin:0;
}

/*#box img {
padding:10px;
background: #fff;
float:right;
margin: 0 0 10px 20px;
}
*/

#box strong {
display:block;
}

#box #thumbs {
width:640px; 
position:absolute; 
left:0;
top:0;
}

#box a.sub1 span,
#box a.box:hover span, 
#box a.box:focus span {
font-size:10px;
font-weight: normal; 
display:block; 
position:absolute; 
width:640px; 
height:460px; 
left:0; 
top:40px; 
padding: 0;  
z-index:100; 
color:#333;
text-align:left; 
line-height:1.8em; 
margin:0;
background-color: #fff;
/*opacity: .8;*/
}

#box a.box:active span {
z-index:50;
}