/* Summerwinds 2010 */

/* Browser-Voreinstellungen zuruecksetzen ( siehe http://tantek.com/log/2004/09.html#d06t2354 )
-----------------------------------------------------------------------------*/
	h1,h2,h3,h4,h5,h6,pre,code,p,li,td {font-size:1em;}
	ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin:0;padding:0;}
	a img,:link img,:visited img,:hover img {border:none;}
	:link,:visited {text-decoration:none;}
	:focus {outline:none;}

/* HTML ELEMENTE
-----------------------------------------------------------------------------*/
	body { font: 16px/1.2em "Lucida Grande", "Lucida Sans", "Trebuchet MS", Trebuchet, Tahoma, Arial, sans-serif; color: #000; text-align: left; }
	
	/* Logo mit Link zur Startseite */ 
	h1 { width: 218px; height: 143px; background: url("css_imgs/summerwinds-muensterland-logo.gif") 0 0 no-repeat; }
		h1 a { display: block; width: 218px; height: 143px; }
			h1 a:hover { text-decoration: none; background: none; }

		h1 span { position: absolute; left: -9999px; }

	h2 { font-size: 18px; line-height: 1.4em; letter-spacing: 0.07em; color: #e2007a; }
	h3 { padding-bottom: 28px; font-size: 14px; line-height: 1.4em; letter-spacing: 0.07em; color: #000; }
	h4 { font-size: 14px; line-height: 24px; letter-spacing: 0.07em; color: #e2007a; }
	h5 { padding-top: 12px; font-size: 12px; line-height: 24px; }

	p, li, td { font-size: 12px; line-height: 24px; letter-spacing: 0.07em; color: #626c6e; }

	br { line-height: 24px; }

	a:link { text-decoration: none; color: #626d6e; }
	a:visited { text-decoration: none; color: #626d6e; }
	a:hover { text-decoration: none; color: #fff8b8; background: #626d6e; }
	a:active { text-decoration: none; color: #626d6e; }

	/* Logo und Menue links */ 
	#kopf { width: 218px; position: fixed; top: 0; left: 0; }

	/* Hauptinhalt Mitte */
	#inhalt { width: 522px; position: absolute; top: 0; left: 218px; }

	#ueberinhalt { position: relative; height: 143px; }
		#ueberinhalt h2 { float: left; padding: 47px 28px 0 28px; }

		.weiss h2 { color: #fff; }
		.schwarz h2, .milch h2 { color: #000; }
		#ueberinhalt.milch { background: url("css_imgs/milch_hg.png"); }

		#hauptinhalt { padding: 20px; background: #fff; overflow: hidden; }
		
		#hauptinhalt object { clear: both; }

		/* Detail Konzert */
			#hauptinhalt .bild { margin: -20px 0 0 -20px; position: relative; }
			.qnr { position: absolute; top: 0; left: 0; width: 30px; height: 22px; line-height: 22px; font-size: 12px; font-weight: bold; color: #000; text-align: center; }
			.rubrik { position: absolute; top: 0; left: 30px; height: 15px; line-height: 15px; padding: 0 10px; font-size: 12px; font-style: italic; color: #333; text-align: center; }
				.rubrik strong { font-style: normal; font-weight: bold; color: #fff; text-transform: uppercase; }

			#inhalt .beschreibung,
			#inhalt .infoleiste { padding: 30px 0; width: 218px; float: left; }
				#inhalt .infoleiste { margin-left: 28px; float: right; }
				
				#inhalt .beschreibung img { margin-left: -20px; }

				.besetzung { font-size: 10px; }

		#fusszeile { clear: both; padding: 3px 28px; background: #ffdd1d; }

	/* Kalender und Sponsoren rechts */ 
	#extras { width: 218px; position: absolute; top: 0; left: 740px; }
		#ueberextras { height: 143px; }

			.button_ort { float: left; margin: 60px 0 0 20px; padding: 0 10px; background: #626d6e; }
				.button_ort a:link, .button_ort a:visited { color: #fff; }
				.button_ort a:hover, .button_ort a:active { text-decoration: none; color: #fff8b8; background: #626d6e; }
				.button_ort span { color: #ffdd1d; }
					.button_ort a:hover span { color: #fff; }


/* table class="kalender" */
	.kalender { margin: 0 20px 20px 15px; border-spacing: 5px; }
		.kalender td { width: 20px; height: 20px; text-align: center; position: relative; color: #333; }

				.kalender td a, .kalender td span { padding: 0 1px; }

				/* Links im Kalender */
			.kalender td a { display: block; background: #fffef5; }
			
			/* Tage ohne Veranstaltung */
			.kalender td span { display: block; background: #e4e7e7; }

				/* Monate in weiss */
				.kalender td.monat { text-align: left; color: #fff; font-weight: bold; }
				/* Sonntage in rot */
				.kalender td.so { color: #f33; }
					.so, .so a:link, .so a:visited	{ color: #f00; }

				/* Hover */
				.kalender a:hover, .so a:hover { text-decoration: none; }

			.kalender ul { list-style: none; }
				.kalender ul li { position: relative; font-size: 1em; }
					.kalender ul li ul { display: none; position: absolute; top: -18px; left: -2px; width: 100px; height: 20px; }

						.kalender ul li:hover ul { display: block; z-index: 50; }
							.kalender ul li ul li { padding: 0 2px; font-size: 1em; width: auto; float: left; }
							.kalender ul li ul li a { /*background: #ff0;*/ }


		/* Farben Kalender-Links */
			.kalender li:hover a, .kalender a:hover, .so a:hover { color: #ffde1c; background: #626e6d; }
	
				.kalender li:hover a.k_zephyr, .kalender li:hover a.k_zephyr:hover { color: #666; background: #ffdd1d; }
				.kalender li:hover a.k_twister, .kalender li:hover a.k_twister:hover { color: #fff; background: #e2007a; }
				.kalender li:hover a.k_scirocco, .kalender li:hover a.k_scirocco:hover { color: #fff; background: #bdcd00; }
				.kalender li:hover a.k_nino, .kalender li:hover a.k_nino:hover { color: #fff; background: #009bb5; }
				.kalender li:hover a.k_inspiriert, .kalender li:hover a.k_inspiriert:hover { color: #666; background: #fdf281; }
				.kalender li:hover a.k_sings, .kalender li:hover a.k_sings:hover { color: #fff; background: #a469a5; }

/* Die Karte */
	#karte { position: relative; width: 280px; height: 202px; background: url("css_imgs/kartemit-punkten.png"); }
		#karte p { position: absolute; z-index: 10; width: auto; height: 10px; line-height: 10px; padding: 0 0 0 12px; }
/*			#karte p:hover, */
			#karte p.an { z-index: 20; background: url("css_imgs/punkte_neu.png") 0 -28px no-repeat; }

				#karte p span { visibility: hidden; color: #000; font-size: 10px; padding: 2px; white-space: nowrap; }
/*				#karte p:hover span, */
				#karte p.an span { visibility: visible; background: url("css_imgs/milch_hg.png"); }

		#ahaus { top: 72px; left: 72px; }
		#ahlen { top: 160px; left: 207px; }
		#asbeck { top: 85px; left: 112px; }
		#ascheberg { top: 149px; left: 166px; }
		#billerbeck { top: 108px; left: 124px; }
		#bocholt { top: 138px; left: 25px; }
		#borken_g { top: 135px; left: 62px; }
		#borken_h { top: 139px; left: 56px; }
		#coesfeld { top: 117px; left: 106px; }
		#greven { top: 83px; left: 169px; }
		#fmo { top: 74px; left: 181px; }
		#gronau { top: 54px; left: 91px; }
		#havixbeck { top: 112px; left: 140px; }
		#hoerstel { top: 36px; left: 167px; }
		#lengerich { top: 64px; left: 203px; }
		#lienen { top: 79px; left: 208px; }
		#luedinghausen { top: 157px; left: 143px; }
		#muenster { top: 115px; left: 171px; }
		#muenster_w { top: 125px; left: 184px; }
		#nordkirchen { top: 165px; left: 156px; }
		#oelde { top: 146px; left: 243px; }
		#oelde_s { top: 151px; left: 247px; }
		#rheine { top: 40px; left: 148px; }
		#sendenhorst { top: 141px; left: 199px; }
		#stadtlohn { top: 106px; left: 70px; }
		#steinfurt { top: 71px; left: 135px; }
		#tecklenburg { top: 56px; left: 198px; }
		#telgte { top: 110px; left: 192px; }
		#walstedde { top: 160px; left: 192px; }


	/* Tabelle Programmuebersicht */
	.programm { position: relative; left: -20px; top: -20px; width: 532px; border-collapse: collapse; background: #f1f1f1; }
			/* Breiten */
			.programm td.t-bild { width: 131px; height: 70px; }
			.t-bild a { display: block; }
				.programm td.t-bild a:hover { height: 70px; overflow: hidden; }

			.programm td.wann_wo { width: 131px; padding-left: 12px;  }
			.programm td.was_wer { width: 260px; padding-left: 12px; }

			/* Hintergrund-Farben */
			.programm td { background: #fffbec; }
				.programm td.was_wer { background: #868889; }
	
				.programm .ungerade td { background: #fff8da; }
				.programm .ungerade td.was_wer { background: #707173; }

			/* Link-Farben */
				.programm td.was_wer a { color: #fff8da; }
				.programm td.was_wer a strong { color: #fff8b8; }




/* FARBEN
-----------------------------------------------------------------------------*/
		/* Programm etc. */
				.klassik .qnr { background: #ffdd1d; }
				.klassik .rubrik { background: #ae9c3e; }
				.klassik .infoleiste h4 { color: #ae9c3e; }

				.jazz .qnr { background: #e2007a; }
				.jazz .rubrik { background: #a5004a; }
				.jazz .infoleiste h4 { color: #a5004a; }

				.welt .qnr { background: #bdcd00; }
				.welt .rubrik { background: #00935e; }
				.welt .infoleiste h4 { color: #00935e; }

				.kinder .qnr { background: #009bb5; }
				.kinder .rubrik { background: #c1e3e2; }
				.kinder .infoleiste h4 { color: #c1e3e2; }

				.wort .qnr { background: #fff9bf; }
				.wort .rubrik { background: #dbd15e; }
				.wort .infoleiste h4 { color: #dbd15e; }

				.offen .qnr { background: #f3eef6; }
				.offen .rubrik { background: #a469a5; }
				.offen .infoleiste h4 { color: #a469a5; }


/* HOME */
	.homecols p { padding: 20px 0 30px 0; }
	.homecols strong { color: #333; }
	
	#menue { list-style: none; padding: 15px 0 28px 0; width: 218px; float: left; background: url("css_imgs/menue_hg.png"); }
		#menue li { line-height: 28px; }
			#menue li a, .hitarea { display: block; padding-left: 35px; color: #333; }
			#menue li:hover a, #menue li.hier a, .hitarea.collapsable-hitarea, .hitarea:hover { cursor: pointer; text-decoration: none; color: #fff8b8; background: #626d6e; }

					#menue li .hitarea a { padding-left: 0; }
					#menue li .hitarea.collapsable-hitarea a { color: #fff8b8; }

			#menue ul { display: none; list-style: none; background: none; }	
			#menue li.hier ul { display: block; }
				#menue ul li { padding-left: 15px; }
				#menue ul li a:link,
				#menue ul li a:visited { color: #626d6e; background: none; }
				#menue ul li.hier a:link,
				#menue ul li.hier a:visited,
				#menue ul li a:hover,
				#menue ul li a:active { color: #000; background: url("css_imgs/menusub.gif") 0 50% no-repeat; }

	#seitenmenu { list-style: none; }
		#seitenmenu li a { margin-left: 20px; padding: 1px 3px; color: #ffdd1d; background: url("css_imgs/kaffee_hg.png"); }
		#seitenmenu li a:hover { text-decoration: none; color: #fff8b8; background: #707173; }
		#seitenmenu li span { position: absolute; left: -9999px; }
		#seitenmenu li.nrw a,
		#seitenmenu li.lwl a { display: block; width: 177px; height: 37px; background: none; }
		#seitenmenu li.nrw { margin-top: 18px; width: 177px; height: 37px; background: url("css_imgs/mp-nrw.png") 20px 0 no-repeat; }
		#seitenmenu li.lwl { margin-top: 18px; width: 177px; height: 37px; background: url("css_imgs/lwl-kultur.png") 20px 0 no-repeat; }


/* MISCELLANEA
-----------------------------------------------------------------------------*/
	.clear { clear: both; height: 0; }
	.hidden { display: none; }
	.mehr { padding: 0 3px 0 1px; }
		.mehr span { color: #ffdd1d; }


/* Schlankheitspille fuer Fonts in webkit */
	body { -webkit-text-stroke: 1px transparent; }
	/* aber nicht in mobile safari */
		@media only screen and (max-device-width:480px) {body{-webkit-text-stroke:0 black;}}