@charset "ISO-8859-1";
/*-------------------------------------------------------------------

STANDARD STYLESHEET TAP

-------------------------------------------------------------------*/

/*
Author:    Sebastian Dubbel
Website:   www.beckerspaeth.de
E-Mail:    dubbel@beckerspaeth.de
Encoding:  ISO-8859-1
*/


/*-------------------------------------------------------------------

RESET DEFAULT STYLES

-------------------------------------------------------------------*/

/* Reset margin and padding of all HTMl elements */
/* CSS Reset, Eric Meyer. URL: http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
	color: #000;
	background: #fff url(../img/holz_hintergrund.jpg) 50% 0%;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 100.01%;
	text-align: center;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/*
Safari doesn't support the quotes attribute, so we do this instead.
*/
blockquote:before, blockquote:after, q:before, q:after {
	/*
	CSS 2; used to remove quotes in case "none" fails below.
	*/
	content: "";
	/*
	CSS 2.1; will remove quotes if supported, and override the above.
	User-agents that don't understand "none" should ignore it, and
	keep the above value. This is here for future compatibility,
	though I'm not 100% convinced that it's a good idea...
	*/
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*-------------------------------------------------------------------

GLOBAL BLOCK ELEMENTS

-------------------------------------------------------------------*/

#container {
	font-size: 62.5%; /* set font-size to reasonable size so that 10px = 1em */
	width: 870px;
	margin: 10px auto 0 auto;
	text-align: left;
}

#header {
	position: relative;
	height: 380px;
}

#img_abendprogramm {
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	border: none;
}

#img_kinderprogramm {
	z-index: 10;
	position: absolute;
	top: 3px;
	right: 0;
	border: none;
}

#content {
	margin-top: 5px;
}

#col_abendprogramm {
	float: left;
	width: 430px;
}

#col_kinderprogramm {
	float: right;
	width: 430px;
}

#footer {
	margin-top: 20px;
	text-align: center;
}

#logo_50jahre {
	position: absolute;
	top: -36px;
	right: -80px;
	display: block;
	width: 245px;
	height: 168px;
	overflow: hidden;
	background: url(../img/logo_50-jahre-tap.png) 0 0 no-repeat;
	z-index: 20;
}

#info {
	margin: 15px 0 35px 0;
	background-color: #fff03f;
	padding: 15px;
}



/*-------------------------------------------------------------------

GLOBAL CLASSES AND DEFINITIONS

-------------------------------------------------------------------*/

.margin-top_0 {
	margin-top: 0 !important;
}

.clearfix:after,
dl dd:after {
	content: "."; 
    display: block; 
    height: 0;
	line-height: 0;
    clear: both; 
    visibility: hidden;
}

/* class to hide html elements from screen, but leave them readable for screenreaders */
.invisible,
#logo_50jahre span {
	position: absolute;
	left: -1000px;
	width: 0px;
	height: 0px;
	overflow: hidden;
	display: inline;
	background-image: none;
}  


/*-------------------------------------------------------------------

TYPOGRAPHY

-------------------------------------------------------------------*/

/* define font-colors here */
h3, h4, strong, p.hint em {
	color: #af1020;
}


h1, h2 {
	text-indent: -999em;
}

#highlightTeaser h2 {
	text-indent: 0;
	font-size: 18px;
	line-height: 20px;
	color: #af1020;
	margin-top: 0;
}

h3,
#highlightTeaser h2 {
	font-size: 20px;
	font-weight: bold;
	line-height: 25px;
}

h3 .untertitel {
	display: block;
	margin-top: 5px;
	font-size: 15px;
	line-height: 17px;
	font-weight: normal;
	color: #000;
}

h4 {
	margin-top: 10px;
	font-size: 15px;
	font-weight: bold;
	line-height: 15px;
}

p,
ul {
	margin-top: 10px;
	font-size: 13px;
	line-height: 15px;
}

strong {
	font-weight: normal;
}

em {
	font-style: italic;
}

p.hint em {
	font-style: normal;
}

/*-------------------------------------------------------------------

TYPOGRAPHIC CLASSES

-------------------------------------------------------------------*/

.important {
	font-size: 15px;
	font-weight: bold;
	line-height: 18px;
}


/*-------------------------------------------------------------------

IMAGES

-------------------------------------------------------------------*/
img {
	line-height: 0;
}

img.foto_abendprogramm {
	position: relative;
	margin: 0 0 -55px 5px;
	z-index: 1;
}


/*-------------------------------------------------------------------

LINKS

-------------------------------------------------------------------*/

a,
a:link,
a:visited {
	text-decoration: none;
	color: #af1020;
	border-bottom: 1px solid #af1020;
}

a:hover, 
a:active,
a:focus {
	color: #0064ae;
	border-bottom-color: #0064ae;
}

h3 a,
h3 a:link,
h3 a:visited {
	border-bottom-width: 2px;
}

a img {
	border: none;
}

/* link to external website that is opened in a new window */
a.external_link {
}


/*-------------------------------------------------------------------

BLATT MIT STÜCK INFO

-------------------------------------------------------------------*/

.blatt {
	width: 426px;
	margin-top: 10px;
}

.bt {
	height: 17px;
	background: url(../img/blatt_oben.png) 100% 0 no-repeat;
}

.bc {
	padding: 10px 25px;
	background: transparent url(../img/blatt_bg.png) 0 0 repeat-y;
}

.bb {
	height: 21px;
	background: url(../img/blatt_unten.png) 100% 100% no-repeat;
}

/* teaser */
.teaser,
.teaser_regular {
	position: relative;
	z-index: 10;
}

.teaser .bt {
	height: 20px;
	background-image: url(../img/blatt_teaser_oben.png);
}

.teaser .bc {
	background-image: url(../img/blatt_teaser_bg.png);
}

.teaser .bb {
	background-image: url(../img/blatt_teaser_unten.png);
}

/* info */
.info .bt {
	background-image: url(../img/blatt_info_oben.png);
}

.info .bc {
	background-image: url(../img/blatt_info_bg.png);
}

.info .bb {
	background-image: url(../img/blatt_info_unten.png);
}

/* footer */
.footer {
	width: 870px;
}

.footer .bt {
	background-image: url(../img/blatt_footer_oben.png);
}

.footer .bc {
	background-image: url(../img/blatt_footer_bg.png);
}

.footer .bb {
	background-image: url(../img/blatt_footer_unten.png);
}


/*-------------------------------------------------------------------

NAVIGATION

-------------------------------------------------------------------*/

ul#navigation {
	margin: 0;
	list-style: none;
	font-size: 12px;
}

ul#navigation li {
	margin:  0 20px 0 0;
	float: left;
}


/*-------------------------------------------------------------------

HIGHLIGHT TEASER

-------------------------------------------------------------------*/
#highlightTeaser {
	position: absolute;
	z-index: 100;
	top: 0;
	right: 10px;
	padding: 5px 30px 25px 30px;
	width: 245px;
	height: 135px;
	background: url(../img/blattHighlightTeaser.png) no-repeat;
}