@charset "utf-8";
/* CSS Document */

/*==============================*/
/* Website masken-atelier.de	*/
/* Datum: Oktober 2009			*/
/* Autor: graugans-design		*/
/*==============================*/

/*==============================*/
/* Inhalt:						*/
/* I.	allgemeine Format.		*/
/* II.	body, wrapper			*/
/* III.	header					*/
/* IV. 	navi 					*/
/* V.	divs li					*/
/* VI.	content					*/
/* VII.	footer					*/
/*==============================*/



/*==============================*/
/* I. allgemeine Formatierung	*/
/*==============================*/

html {
	height:100.2%;
}

* {
	margin:0;
	padding:0;
}

img, a {
	border:none;
}

a {
	text-decoration:none;
	color:#4c3d31;
}

ul.termine li a {
	text-decoration:underline;
}

a:focus,
a:active {
	outline:none;
}

#navi_sub a:hover,
#navi_sub a:focus,
#navi_sub a:active,
#content_text a:hover {
	text-decoration:underline;
}

a:hover span,
a:focus span,
a:active span {
	text-decoration:none;
}


/*==============================*/
/* II.	body, wrapper, text		*/
/*==============================*/

body {
	font-size:small;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#4c3d31;	
}

h2 {
	font-size:medium;
	font-weight:bold;
	margin-bottom:1em;
}

h3 {
	font-size:small;
	font-weight:bold;
}


#wrapper {
	position:relative;
	width:980px;
	margin:0 auto;
}

#kurse #content ul,
#termine #content ul,
#vita #content ul {
	margin-left:20px;
}

/**+html #kurse #content ul,
*+html #termine #content ul {
	text-indent:20px;
	margin-left:0;
}*/

/*==============================*/
/* III.	header					*/
/*==============================*/

#header {
	width:980px;
	height:200px;
	background-image:url(_img/header.jpg);
}

h1 {
	text-indent:-2500px;
}	

/*==============================*/
/* IV.	navi allgemein			*/
/*==============================*/

#navi {
	z-index:100;
	position:absolute;
	top:173px;
	left:90px;
	width:870px;
}

#navi_main li.links {
	margin-right:6px;
}

*+html #navi_main li.links,
*html #navi_main li.links {
	margin-right:2px;
}	/*verrutscht sonst im ie*/

#navi_main li.rechts {
	margin-left:48px;
	margin-right:0;
}

*+html #navi_main li.rechts {
	margin-left:28px;
	margin-right:0;
} /*verrutscht sonst im ie7*/

*html #navi_main li.rechts {
	margin-left:28px;
	margin-right:0;
} /*verrutscht sonst im ie6 */


#navi li {
	display:inline;
}

#index #navi_sub,
#kurse #navi_sub,
#termine #navi_sub,
#vita #navi_sub,
#kontakt #navi_sub,
#impressum #navi_sub,
#danke #navi_sub,
#agb #navi_sub {
	visibility:hidden;
}

/*==============================*/
/* IVa. navi_main 				*/
/*==============================*/

#navi_main span {
	display:none;
}

.start img {
	background-image:url(_img/navi/navi.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.start a:hover img,
.start a:focus img,
.start a:active img {
	background-image:url(_img/navi/navi.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#index .start img{
	background-image:url(_img/navi/navi.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.masken img {
	background-image:url(_img/navi/navi-02.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.masken a:hover img,
.masken a:focus img,
.masken a:active img {
	background-image:url(_img/navi/navi-02.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#masken .masken img{
	background-image:url(_img/navi/navi-02.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

#astrologie .masken img, 
#comedia .masken img,
#fantasie .masken img,
#halloween .masken img,
#kinder .masken img,
#persoenlichkeiten .masken img,
#tiere .masken img,
#venedig .masken img {
	background-image:url(_img/navi/navi-02.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.objekte img {
	background-image:url(_img/navi/navi-08.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.objekte a:hover img,
.objekte a:focus img,
.objekte a:active img {
	background-image:url(_img/navi/navi-08.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#objekte .objekte img, 
#deko .objekte img,
#figuren .objekte img,
#nachbildungen .objekte img,
#schwellkoepfe .objekte img {
	background-image:url(_img/navi/navi-08.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.kurse img {
	background-image:url(_img/navi/navi-03.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.kurse a:hover img,
.kurse a:focus img,
.kurse a:active img {
	background-image:url(_img/navi/navi-03.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#kurse .kurse img{
	background-image:url(_img/navi/navi-03.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.termine img {
	background-image:url(_img/navi/navi-04.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.termine a:hover img,
.termine a:focus img,
.termine a:active img {
	background-image:url(_img/navi/navi-04.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#termine .termine img{
	background-image:url(_img/navi/navi-04.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.vita img {
	background-image:url(_img/navi/navi-07.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.vita a:hover img,
.vita a:focus img,
.vita a:active img {
	background-image:url(_img/navi/navi-07.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#vita .vita img{
	background-image:url(_img/navi/navi-07.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.agb img {
	background-image:url(_img/navi/navi-09.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.agb a:hover img,
.agb a:focus img,
.agb a:active img {
	background-image:url(_img/navi/navi-09.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#agb .agb img{
	background-image:url(_img/navi/navi-09.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/


.kontakt img {
	background-image:url(_img/navi/navi-05.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.kontakt a:hover img,
.kontakt a:focus img,
.kontakt a:active img {
	background-image:url(_img/navi/navi-05.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#kontakt .kontakt img {
	background-image:url(_img/navi/navi-05.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/	

.impressum img {
	background-image:url(_img/navi/navi-06.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.impressum a:hover img,
.impressum a:focus img,
.impressum a:active img {
	background-image:url(_img/navi/navi-06.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#impressum .impressum img{
	background-image:url(_img/navi/navi-06.gif);
	background-position:top;
	background-repeat:no-repeat;
} /*aktuelle Seite bleibt gehovert*/

.preisliste img {
	background-image:url(_img/navi/navi-10.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

.preisliste a:hover img,
.preisliste a:focus img,
.preisliste a:active img {
	background-image:url(_img/navi/navi-10.gif);
	background-position:top;
	background-repeat:no-repeat;
}

/*==============================*/
/* IVb. navi_sub 				*/
/*==============================*/

#navi_sub {
	margin-top:5px;
}

#astrologie .astrologie a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/
	
#comedia .comedia a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#deko .deko a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#fantasie .fantasie a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#figuren .figuren a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#halloween .halloween a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#kinder .kinder a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#nachbildungen .nachbildungen a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#persoenlichkeiten .persoenlichkeiten a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#schwellkoepfe .schwellkoepfe a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#tiere .tiere a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#venedig .venedig a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/

#verein .verein a {
	text-decoration:underline;
} /*aktuelle Seite bleibt gehovert*/


/*==============================*/
/* V.	div li.					*/
/*==============================*/

#div_links {
	width:30px;
	height:550px;
	background-image:url(_img/div_links.jpg);
}

#kontakt #div_links {
	width:30px;
	height:670px;
	background-image:url(_img/div_links_lang.jpg);
}	/*macht den Hintergrund länger*/

#kinder #div_links,
#tiere #div_links,
#fantasie #div_links,
#vita #div_links,
#impressum #div_links {
	width:30px;
	height:820px;
	background-image:url(_img/div_links_sehr_lang.jpg);
}	/*macht den Hintergrund vieel länger*/

/* HG noch vieeeeeeeeel länger */
#kinder #div_links {
	height:1000px;
	background-image:url(_img/div_links_sehr_lang2.jpg);
}

#schwellkoepfe #div_links {
	height:1300px;
	background-image:url(_img/div_links_sehr_lang3.jpg);
}

/*==============================*/
/* VI.	content					*/
/*==============================*/

#content {
	position:absolute;
	left:30px;
	top:200px;
	width:950px;
	height:550px;
	background-image:url(_img/div_rechts.jpg);
	background-position:right;	
	background-repeat:no-repeat;
	line-height:1.5em;
}

#kontakt #content {
	position:absolute;
	left:30px;
	top:200px;
	width:950px;
	height:670px;
	background-image:url(_img/div_rechts_lang.jpg);
	background-position:right;	
	background-repeat:no-repeat;
}	/*macht den Hintergrund länger*/

#kinder #content,
#tiere #content,
#fantasie #content,
#vita #content,
#impressum #content {
	position:absolute;
	left:30px;
	top:200px;
	width:950px;
	height:820px;
	background-image:url(_img/div_rechts_sehr_lang.jpg);
	background-position:right;	
	background-repeat:no-repeat;
}	/*macht den Hintergrund vieel länger*/

/* HG noch vieeeeeeeeel länger */
#kinder #content {
	height:1000px;
	background-image:url(_img/div_rechts_sehr_lang2.jpg);
	background-position:right;	
	background-repeat:no-repeat;
}

/* HG noch vieeeeeeeeel länger */
#schwellkoepfe #content {
	height:1300px;
	background-image:url(_img/div_rechts_sehr_lang3.jpg);
}

/*==============================*/
/* VIa.	content_text			*/
/*==============================*/

#content_text {
	margin-top:50px;
	margin-left:60px;
	width:500px;
	height:120px;
}

/* Text Schwellkopf-Seite schmaler */
#schwellkoepfe #content_text {
	height:120px;
}

#impressum #content_text,
#termine #content_text {
	width:700px;
}	/* div vieel breiter, da seehr viel text */

#agb #content_text {
	width:820px;
}	/* noch viel breiter...*/

#impressum #content_text h2, 
#impressum #content_text p {
	font-size:smaller;
	line-height:normal;
}

#vita #content_text,
#index #content_text,
#masken #content_text,
#kurse #content_text,
#kontakt #content_text {
	width:500px;
} /* div breiter, da sehr viel text */

#agb #content_text {
	font-size:smaller;
}

/*==============================*/
/* VIa1.	agb_scroll			*/
/* overflow mit scrollbalken	*/
/*==============================*/

#agb_scroll {
	height:400px;
	overflow:auto;
}


/*==============================*/
/* VIb.	content_foto			*/
/*==============================*/

#content_foto {
	position:absolute;
	top:50px;
	right:80px;
	width:235px;
	height:350px;
	line-height:normal;
}

#content_foto dd {
	margin-left:10px;
	margin-bottom:10px;
}

/*==============================*/
/* VIc.	content_thumbs			*/
/*==============================*/

#content_thumbs.astrologie {
	margin-left:60px;
	width:525px;
	height:150px;
	/*background-image:url(_img/content/hintergrund.gif);*/
}

#content_thumbs.schwellkoepfe {
	margin-left:60px;
	width:525px;
	height: 300px;
}

a.ansicht img {
	float:left;
}

a.ansicht span {
	position:absolute;
	top:170px;
	right:80px;
	width:230px;
	height:230px;
	visibility:hidden;
	text-align:center;
}

#schwellkoepfe a.ansicht span {
	top:150px;
}

/* Ansicht auf der Schwellköpfe-Seite höher */

a.ansicht span strong {
	color:#4c3d31;
	font-weight:normal;
	line-height:1.4em;
	}
	

a.ansicht:hover span,
a.ansicht:focus span,
a.ansicht:active span {
	visibility:visible;
	cursor:default;
}

*html a.ansicht:hover {
	visibility:visible;
	cursor:default;
}

/*==============================*/
/* VI.Herstellung Schwellköpfe  */
/*==============================*/

#herstellung_schwellkoepfe {
	margin: 60px 0 0 40px;
	padding-top: 10px;
}

#herstellung_schwellkoepfe h2 {
	margin-bottom: 10px;	
	margin-left: 20px;
}

#herstellung_schwellkoepfe dl {
	float: left;
	margin-bottom: 10px;
	font-size: 10px;
	line-height: 14px;
}

#herstellung_schwellkoepfe dd {
	padding-left: 20px;
}

/* Der linke Einzelschritt hat Abstand rechts */
.abstand_rechts {
	margin-right: 40px;	
}

/*==============================*/
/* VId.	kontaktformular			*/
/*==============================*/	

form {
	margin-top:10px;
}

form a {
	text-decoration:underline;
}

form a:hover, form a:focus {
	color:#666;
	cursor:auto;
}

#kontaktformular {
	width:430px;
}

legend {
	font-weight:bold;
	/*color:#c19978;*/
	margin-left:10px;
	padding-left:2px;
	padding-right:2px;
	padding-bottom:1px;
}

label {
	margin-left:5px;
}

#adresse label {
	display:block;
}

form p {
	padding:5px;
}

#name, #email {
	background:#fff2f2;
	margin-left:5px;
	width:400px;
}

#email {
	margin-bottom:5px;
}

fieldset {
	border:1px solid #4b3c30;
	margin-bottom:10px;
}

textarea {
	width:400px;
	height:120px;
	margin:5px 0 10px 10px;
	background:#fff2f2;
}

input {
	margin-bottom:5px;
}
	
/*==============================*/
/* VII.	footer					*/
/*==============================*/

#footer {
	position:absolute;
	top:750px;
	background-image:url(_img/footer.jpg);
	width:980px;
	height:30px;
}

#kontakt #footer {
	position:absolute;
	top:870px;
	background-image:url(_img/footer_sehr_lang.jpg);
	width:980px;
	height:30px;
}   /*macht den Hintergrund länger*/

#kinder #footer,
#tiere #footer,
#fantasie #footer,
#vita #footer,
#impressum #footer {
	position:absolute;
	top:1020px;
	background-image:url(_img/footer_sehr_lang.jpg);
	width:980px;
	height:30px;
}	/*macht den Hintergrund vieel länger*/

#kinder #footer {
	top: 1200px;
}

#schwellkoepfe #footer {
	top: 1500px;
}

/*==============================*/
/* Teil VIII.	 				*/
/* die graugans					*/
/*==============================*/

#graugans_logo {
	border:0;
	margin-bottom:-5px;
}

/*==============================*/
/* Ende main.css				*/
/* masken-atelier.de			*/
/*==============================*/