@import url('slide.css');

/*--------------------------------------------------------------------------------------------------------------------------------- 	
	reset rules
-----------------------------------------------------------------------------------------------------------------------------------*/
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{font-size:100%;}
a, a:hover, a:visited{text-decoration:none;}



@font-face {
	font-family: 'AntipastoRegular';
	src: url('../fonts/antipasto-webfont.eot');
	src: local('local'), url('../fonts/antipasto-webfont.woff') format('woff'), url('../fonts/antipasto-webfont.ttf') format('truetype'), url('../fonts/antipasto-webfont.svg#webfontuMNcCBzg') format('svg');
	font-weight: normal;
	font-style: normal;
}
	
/*--------------------------------------------------------------------------------------------------------------------------------- 	
	container
-----------------------------------------------------------------------------------------------------------------------------------*/

body {
	margin: 0;
	padding: 0;
	border: 0;
	min-height: 1100px;
	font-family: AntipastoRegular, Arial, Helvetica, sans-serif;
	font-size: 0.7em; /* the font-size is now 0.625 x 16px = 10px */
	font-weight:normal;
	color: #f4f6f9;
	letter-spacing: 2px;
	background-color: #01c2df;
	background-image: url(../img/body-background.jpg);
	background-repeat:repeat-x;
}

img {border: none;}

#wrapper {
	width: 960px;
	min-height: 950px;
	margin: 0 auto;
	background: url(../img/wrapper-background.jpg);
	background-repeat: no-repeat;
}

#mask {	background-color:#000;
		opacity:1;
}

/*--------------------------------------------------------------------------------------------------------------------------------- 	
	main navigation
-----------------------------------------------------------------------------------------------------------------------------------*/

       .mainnav {
            position: relative;
            height: 58px;
            width: 960px;
            padding: 238px 0px 0px 0px;
            margin: 0px 0px 0px -40px;
        }
		
		
                .mainnav li {
                    float: left;
                    list-style: none;
					height: 58px;
					min-width: 140px;
					padding: 4px 0px 0px 0px;
					margin: 0px 20px 0px 20px;
                }
                    .mainnav li.back {
                        background: url("../img/mainnavactive.png") no-repeat right -58px;
                        width: 9px;
						height: 58px;
						padding: 0px;
						margin: 3px 0px 0px 19px;
                        z-index: 8;
                        position: absolute;
                    }
                        .mainnav li.back .left {
                            background: url("../img/mainnavactive.png") no-repeat top left;
                            height: 58px;
							min-width: 100px;
                            margin-right: 9px;
							padding: 0px;
                        }
                    .mainnav li a {          
                        text-decoration: none;
                        z-index: 10;
                        display: block;
                        float: left;
                        height: 58px;
                        position: relative;
						padding: 0px 0px 0px 0px;
						margin-left: 40px;
                    }
                        .mainnav li a:hover, .mainnav li a:active, .mainnav li a:visited {
                            border: none;
                        }




/*------------------------------------------------------------------------
	Menu Social Media
--------------------------------------------------------------------------*/


       #socialmedia {
            float: right;
			margin: -100px 9px 0 0;
            width: 300px;
			list-style-type: none;
			height: 32px;
        	}

	
		#socialmedia li a {
			position: relative;
			float: right;
			display: block;
			height: 32px;
			width: 32px;
			margin: 0px 28px 0px 0px;
			text-decoration: none;
			text-indent: -9999px;
			}

		
		#flickr a {background-image:url(../img/flickr-sprite.png);}
		#youtube a {background-image:url(../img/youtube-sprite.png);}
		#facebook a {background-image:url(../img/facebook-sprite.png);}
		#twitter a {background-image:url(../img/twitter-sprite.png);}
		#myspace a {background-image:url(../img/myspace-sprite.png);}
		#vimeo a {background-image:url(../img/vimeo-sprite.png);}
		
		#socialmedia li a:hover {background-position: 0px -32px;}
		
		
		
	.tooltip {
	display:none;
	background:transparent url(../img/tooltip.png);
	font-family: AntipastoRegular, Arial, Helvetica, sans-serif;
	font-size:1.1em;
	height:70px;
	width:160px;
	padding: 20px 25px 30px 25px;
	color:#fff;	
}


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

       .contentnav {
            position: relative;
            width: 574px;
			list-style-type: none;
			top: -34px;
			left: 1px;
			height: 41px;
        	}

	
		.contentnav li a {
			position: relative;
			float: left;
			display: block;
			height: 41px;
			font-size: 13px; 
			font-weight:normal;
			color: #aaaaba;
			text-decoration: none;
	
			}

		.contentnav li#montag a {
			width: 73px;
			height: 21px;
			padding: 10px 2px 0px 4px;
			background: url("../img/montag.png") no-repeat;
			}
			
		.contentnav li#montag span {display:block;margin:0px 0px 0px 9px;}			

			
		.contentnav li#dienstag a {
			width: 73px;
			height: 21px;
			padding: 10px 5px 0px 4px;
			background: url("../img/dienstag.png") no-repeat;
			}
		.contentnav li#dienstag span {display:block;margin:0px 0px 0px 5px;}	
			
			
		.contentnav li#mittwoch a {
			width: 77px;
			height: 21px;
			padding: 10px 5px 0px 4px;
			background: url("../img/mittwoch.png") no-repeat;
			}
		.contentnav li#mittwoch span {display:block;margin:0px 0px 0px 6px;}
			
		.contentnav li#donnerstag a {
			width: 94px;
			height: 21px;
			padding: 10px 4px 0px 5px;
			background: url("../img/donnerstag.png") no-repeat;
			}
		.contentnav li#donnerstag span {display:block;margin:0px 0px 0px 5px;}		
			
		.contentnav li#freitag a {
			width: 61px;
			height: 21px;
			padding: 10px 8px 0px 1px;
			background: url("../img/freitag.png") no-repeat;
			}
		.contentnav li#freitag span {display:block;margin:0px 0px 0px 6px;}
		
		.contentnav li#samstag a {
			width: 72px;
			height: 21px;
			padding: 10px 5px 0px 4px;
			background: url("../img/samstag.png") no-repeat;
			}
		.contentnav li#samstag span {display:block;margin:0px 0px 0px 5px;}
			
		.contentnav li#sonntag a {
			width: 72px;
			height: 21px;
			padding: 10px 0px 0px 1px;
			background: url("../img/sonntag.png") no-repeat;
			}
		.contentnav li#sonntag span {display:block;margin:0px 0px 0px 7px;}

		
		.contentnav li#anno2012 a {			
			width: 73px;
			height: 21px;
			padding: 10px 0px 0px 22px;
			background: url("../img/montag.png") no-repeat;
		}


		.contentnav li#anno2011 a {			
			width: 73px;
			height: 21px;
			padding: 10px 0px 0px 6px;
			background: url("../img/anno-background.png") no-repeat;
		}
		
		
		.contentnav li#anno2011 span {display:block;margin:0px 0px 0px 17px;}


		.contentnav li#anno2010 a {			
			width: 73px;
			height: 21px;
			padding: 10px 2px 0px 4px;
			background: url("../img/anno-background.png") no-repeat;
		}
		.contentnav li#anno2010 span {display:block;margin:0px 0px 0px 17px;}

		.contentnav li#anno2009 a {
			width: 73px;
			height: 21px;
			padding: 10px 6px 0px 3px;
			background: url("../img/2007.png") no-repeat;
			}
		.contentnav li#anno2009 span {display:block;margin:0px 0px 0px 17px;}
			
		.contentnav li#anno2008 a {
			width: 73px;
			height: 21px;
			padding: 10px 7px 0px 2px;
			background: url("../img/2007.png") no-repeat;
			}
		.contentnav li#anno2008 span {display:block;margin:0px 0px 0px 17px;}
			
		.contentnav li#anno2007 a {
			width: 73px;
			height: 21px;
			padding: 10px 6px 0px 3px;
			background: url("../img/2007.png") no-repeat;
			}
		.contentnav li#anno2007 span {display:block;margin:0px 0px 0px 17px;}

		.contentnav li#verein a {
			width: 73px;
			height: 21px;
			padding: 10px 3px 0px 3px;
			background: url("../img/montag.png") no-repeat;
			}
		.contentnav li#verein span {display:block;margin:0px 0px 0px 14px;}	
		
		.contentnav li#laden a {
			width: 73px;
			height: 21px;
			padding: 10px 6px 0px 3px;
			background: url("../img/dienstag.png") no-repeat;
			}
		.contentnav li#laden span {display:block;margin:0px 0px 0px 16px;}	
			
		.contentnav li#unterricht a {
			width: 77px;
			height: 21px;
			padding: 10px 0px 0px 9px;
			background: url("../img/mittwoch.png") no-repeat;
			}
		.contentnav li#unterricht span {display:block;margin:0px 0px 0px 12px;}
		
		
		.contentnav li#zeitschrift a {
			width: 94px;
			height: 21px;
			padding: 10px 4px 0px 5px;
			background: url("../img/donnerstag.png") no-repeat;
			}
		.contentnav li#zeitschrift span {display:block;margin:0px 0px 0px 8px;}		
		
		
ul.contentnav a.current, ul.contentnav a.current:hover, ul.content li.current a {
			height: 41px !important;
			width: 574px;
			color: #f4f6f9;
			text-decoration:none;
			padding: 10px 0px 0px 1px;
			background-position: 0px -41px!important;
}




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



#content-left {
	float: left;
	position: relative;
	width: 574px;
	min-height: 486px;
	margin: 100px 0px 0px 0px;
	background-image:url(../img/content-left-background.png);
	background-repeat:no-repeat;
}

#content-left h1 {padding: 20px 40px 10px 40px; font-size: 2.2em; font-weight:lighter;}
#content-left h2 {padding: 0px 40px 10px 40px; font-size: 1.3em;font-weight:lighter;}
#content-left p {padding: 0px 40px 25px 40px; font-size: 1.3em; font-weight:normal;}

.content-kurse {
	padding: 0;
	font-size: inherit;
}


#content-left table {margin: 10px 40px;}
#content-left a {display:inline-block;padding:0px 3px;text-decoration:none;color:#f4f6f9;background-color:#ca003a; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
#content-left td {padding: 4px 4px;font-size: 1.4em; font-weight:normal; vertical-align:top;min-width:150px;}
#content-left td span {font-weight:bold;}
#content-left td a > span {display:inline-block;padding:0px 2px;text-decoration:none;color:#f4f6f9;background-color:#ca003a;font-weight:normal;}
#content-left .links {display:inline-block;padding:0px 4px;margin: 0px 8px 0px 0px;text-decoration:none;color:#f4f6f9;background-color:#ca003a;font-weight:normal;}
#content-left td p {margin:0;padding:0;font-size:inherit;}

#content-right {
	width: 289px;
	margin: 100px 0px 0px 0px;	
	float: right;
}

#content-right-top {background: url(../img/background-content-right-to.png) top left no-repeat;height:11px;}
#content-right-bottom {background:url(../img/background-content-right-bo.png) bottom left no-repeat;height:11px;}

#content-right-content {
	background:url(../img/background-content-right-re.png) repeat-y;
	min-height: 267px;
}

#content-right-content h1 {padding: 10px 40px; font-size: 2.4em; font-weight:lighter;}
#content-right-content h2 {padding: 0px 40px 10px 40px; font-size: 2.4em; font-weight:lighter;}
#content-right-content p {padding: 0px 40px 20px 40px; font-size: 1.2em; font-weight:normal;}
#content-right-content img {padding: 0px 40px;}
#content-right-content span{display:inline-block;padding:0px 2px;text-decoration:none;color:#f4f6f9;background-color:#ca003a; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
#content-right-content p#googlecalendar {margin: 10px 0px 0px -40px;}

.clear {clear: both;}





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


#footer {
	width:100%;
	height: 300px;
	background: url(../img/background-footer.png) repeat-x;
}

#footer-wrapper {
	width: 960px;
	height: 270px;
	padding-top: 30px;
	margin: 0 auto;
}

#footer-left {
	float: left;
	position: relative;
	width: 671px;
	height: 270px;
}

#footer-left h1 {
	padding: 0px 0px 10px 15px; 
	margin: 0px;
	font-size: 2em; 
	font-weight:lighter;
	}
	
#footer-left a {
	padding:0px 2px;
	text-decoration:none;
	color:#f4f6f9;
	background-color:#ca003a;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}

#footer-right {	
	width: 289px;
	height: 270px;
	float: right;
}

#footer-right h1 {padding: 0px 0px 5px 40px; margin: 0px 0px 0px 0px; font-size: 2em; font-weight:lighter;}
#footer-right li {padding-left: 40px; font-size: 1.3em;}
#footer-right img {padding-top: 10px;}
#footer-right li#googlemaps {margin-top: 18px;}

#danke_anchor h2 {margin-left: 40px; !important}
#danke_anchor p {margin-left: 40px; !important}


/*---------------------------------------------------------------------------
	Form
-----------------------------------------------------------------------------*/

form {
	margin: 0px 0px 0px 2px;
	font-family: AntipastoRegular, Arial, Helvetica, sans-serif;
}


form legend {
	padding: 0px 0px 10px 15px; 
	font-size: 2em; 
	font-weight:lighter;
}



form input, form fieldset textarea, form fieldset p label {
	font-size: 1.3em;
	font-weight:normal;
}


form p { 
	position: relative; 
	width: 272px;
	height: 27px;
	margin: 2px 25px 13px 5px;
	background: url(../img/formular-field.png) no-repeat;
}
form p label { 
	position: absolute; 
	left: 7px; 
	font-size: 1.3em; 
	color:#1bb2bb;
	width: 268px;
	height: 27px;
	display: block;
	padding: 2px 24px 1px 9px;
}



.form-nobackground {
	background: none;
	margin: 0;
}


form #form-informationen-placer {position: absolute; top: 38px; left: 300px; width: 272px; height:147px; background:url(../img/formular-textarea.png) no-repeat;}
form #form-submit-placer {position: absolute;top: -33px;left: 494px;border: none;background: transparent;background-image: url(../img/input.png);background-repeat: no-repeat;height: 27px;width:80px;cursor: pointer;}


form input#name, 
form input#adresse, 
form input#email, 
form input#kurs
	{
	width:255px;
	height:18px;
	padding:4px 0px 2px 14px;
	background: transparent;
	border: none;
	color:#f4f6f9;
	letter-spacing:inherit;
}	

p.form-nobackground > label {padding:0 0 0 20px;}

p.form-nobackground > label + input {
	position: absolute;
	display:inline-block;
	height: 16px;
	width: 16px;
	margin: 2px 0 0 5px;
}


form #informationen {
	width: 254px;
	height: 140px;
	padding:5px 4px 0px 15px;
	border: none;
	background: transparent;
	font-size: 1.3em;
	color:#f4f6f9;
	overflow:hidden;
	letter-spacing:inherit;
}



/* error message */
.error {
	height:14px;
	background-color:#ca003a;
	font-size:1em;
	padding:5px 10px 4px 10px;
	margin: 3px 0px 0px 0px;
	color:#fff;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px; 	
	-moz-box-shadow: 0px 0px 6px #ddd;
	-webkit-box-shadow: 0px 0px 6px #ddd;
	display:none;	
}


.error p {
	margin:0;		
}

form fieldset p label.focus {border: 2px #fff; opacity: 0.35;}


/*------------------------------------------------------------------
AppleOverlay Effect
--------------------------------------------------------------------*/


#overlay { 
	background-image:url(../img/background-overlay.png);
    color:#efefef;
    height:506px; 
} 

#thankmessage { 
	background-image:url(../img/background-overlay.png);
    color:#efefef;
    height:506px; 
} 
 
/* container for external content. uses vertical scrollbar, if needed */ 
div.contentWrap {
	width:720px;
    height:520px; 
    overflow-y:auto;
	border: 1px #019eb8;
}

/* the overlayed element */
.apple_overlay {
	display:none;/* initially overlay is hidden */
	background-image:url(../img/background-overlay.png); /*growing background image */
	background-color: transparent;
	width:720px;	
	height: 520px;
	padding:25px; /*some padding to layout nested elements nicely */ 
	border:2px solid #666;
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;
}

/* default close button positioned on upper right corner */
.apple_overlay .close {
	background-image:url(../img/close.png);
	position:absolute; right:-15px; top:-15px;
	cursor:pointer;
	height:35px;
	width:35px;
}


/* the overlayed element */
.message_overlay {
	display:none;/* initially overlay is hidden */
	background-image:url(../img/background-overlay.png); /*growing background image */
	background-color: transparent;
	width:720px;	
	height: 520px;
	padding:25px; /*some padding to layout nested elements nicely */ 
	border:2px solid #666;
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;
}

/* default close button positioned on upper right corner */
.message_overlay .close {
	background-image:url(../img/close.png);
	position:absolute; right:-15px; top:-15px;
	cursor:pointer;
	height:35px;
	width:35px;
}

#thankmessage {
		background-image:url(http://static.flowplayer.org/img/commerce/box-512.png);
		width:512px;
		height:531px;
		padding:0px;
	}

/*-------------------------------------------------------------------------
Auftritte Vertical Scrollable Items
---------------------------------------------------------------------------*/

/* root element for scrollable */
.vertical {
	position:relative;
	overflow:hidden;

	/* vertical scrollables have typically larger height than width but not now */
	width: 574px;
	height: 486px;
}

/* root element for scrollable items */
.items {
	position:absolute;

	/* this time we have very large space for the height */
	height:20000em;
}

/* single scrollable item */
.item {
	margin:0;
	padding:0;
	height: 486px;
}


/* the action buttons above the scrollable */
.actions {
	width: 574px;
	margin:-11px 0 15px 0;	
}

.actions a {
	font-size:11px;	
	cursor:pointer;
	color: #f4f6f9;
	letter-spacing: 2px;
	background-color:#ca003a;
}

.actions a:hover {
	color: #f4f6f9;
	letter-spacing: 2px;
	background-color:#ca003a;
}

.disabled {
	visibility:hidden;		
}

.next {
	top: 477px;
	float:right;
	margin: 0 43px 0 0;
	padding: 2px 3px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}	

.prev {
	margin: 0 0 0 -440px;
	padding: 2px 3px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}