html{ overflow-y: scroll; }
html.popup{ overflow-y:auto; }

/* ##################################################################### */
/* #### HTML5 display definitions ###################################### */

	article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }


/* ############################################################ */
/* #### Allgemeine Formatierungen (Schriften, Listen,... ) #### */

	html, body, table, th, td, div, li{
		font-size:13px;
		line-height:1.3em;
		font-family: arial, helvetica, lucida, sans-serif;
	}
	body.layout_5 div.top-left,
	body.layout_8 div.top-left { font-size:15px; }


	h1{
		font-size:18px;
		line-height:1.2em;
		margin-top:0;
		font-weight:bold;
	}
	body.layout_5 div.top-left h1,
	body.layout_8 div.top-left h1{ font-size:24px; }
	/* Headlines auf Veranstaltungsseite-Mobil rot */
	#page_60.mobile h1{ color:#ff0000; }

	h2{
		font-size:16px;
		line-height:1.2em;
		margin:0;
		font-weight:bold;
		color:#787c82;
	}

	h3{
		font-size:13px;
		line-height:1.3em;
		margin-top:1em;
		margin-bottom:0;
		color:#787c82;
	}

	p{
		margin-top:1em;
		margin-bottom:1em;
	}

	p.act{ color:#ff0000; }


	a{
		color:#ff0000;
		text-decoration:none;
		outline:0;
	}
	div.icons a.print { margin-right:16px; }


	.csc-textpic-caption,
	.news-single-imgcaption{
		margin:0;
		padding: 4px 0 0 0;
		font-size:12px;
		line-height:1.3em;
	}
	.csc-textpic-caption{ margin-top:-20px; }
	.news-single-imgcaption{ padding: 4px 0 16px 0; }
	.video-caption p{
		margin:0 0 16px 0;
		padding: 4px 0 0 0;
		font-size:12px;
		line-height:1.3em;
	}


	img{ border:none; }

	table{ border-collapse:collapse; }
	td{
		vertical-align:top;
		padding-right:7px;
	}
	/* Preis-Tabellen */
	table.contenttable-1{ margin-top:1em; }
	table.contenttable-1 td.td-1{ text-align:right; }


	/* IE7 / IE8-compatibility-view Bildabstands-Bug beheben */
	div.csc-textpic div.csc-textpic-imagewrap dl.csc-textpic-image {
		margin-bottom:0px;
		padding-bottom:16px;
	}
	/* Abstand unter Einzelbild ohne BU: */
	div.csc-textpic img{ margin-bottom:20px; }
	div.csc-textpic dl img{ margin-bottom:0; }


	div.news-latest-item img,
	div.news-list-item img{
		float:left;
		margin: 0 0 1.5em 0;
	}

	div.news-latest-item p,
	div.news-list-item p{
		display:block;
		margin:0;
		padding: 0 0 1.5em 0;
		width:220px;
		overflow:hidden;
		float:right;
	}
	body.mobile div.news-latest-item p,
	body.mobile div.news-list-item p{ width:190px; }


/* ############################################################ */
/* #### allg. Raster / Seitenaufteilung ####################### */

	html{ background-color:#ffffff; }
	html, body{
		margin:0;
		padding:0;
		color:#000000;
		text-align:center;
	}
	body{ overflow:hidden; min-width:960px; background-repeat:no-repeat; background-position:center 32px; }
	body.mobile{ min-width:0; background-image:none !important; }
	.popup body{ min-width:0; }

		div#popup-website{
			position: relative;
			margin: 0 auto 0 auto;
			padding: 20px 0 20px 0;
			width:542px;
			text-align: left;
			background-color:#ffffff;
		}
		div#popup-website a.print{ float:left; }
		div#popup-website a.close{ float:right; }
		div#popup-website a.print img,
		div#popup-website a.close img{ vertical-align: middle; }
		a.openlnk{
			float:right;
			width:17px;
			height:17px;
			background-repeat: no-repeat;
			background-position: left top;
			background-image: url(img/open.gif);
		}

		div#website{
			position: relative;
			margin: 0 auto 0 auto;
			padding: 0;
			width:960px;
			text-align: left;
		}
		body.mobile div#website{
			width:320px;
			overflow:hidden;
		}

			div#langswitch{
				padding-top:8px;
				color:#787c82;
				text-align:right;
				font-size:12px;
				line-height:2em;
			}
			body.mobile div#langswitch{ padding-right:10px; }
			div#langswitch a{ color:#787c82; }
			div#langswitch a.act,
			div#langswitch a:hover{ color:#ff0000; }


			div#header{
				height:203px;
				background-repeat: no-repeat;
				background-position: left bottom;
			}
			body.mobile div#header{ height:100px; padding-left:10px; }
			body.layout_5 div#header, body.layout_8 div#header{ height:400px; }
			body.mobile.layout_5 div#header{ height:165px; }
			body.mobile.layout_8 div#header{ height:230px; }


			div#navigation{
				border-top:42px solid #d9dadc;
				background: #fff; /* IE6-8 Fallback – hex + shorthand needed for IE6/7 */ background: rgba(255, 255, 255, 0.85);
				height:42px;
				overflow:hidden;
				/* background-repeat: repeat-y; background-position: left top; background-image: url(img/bg_nav.gif); */
				margin-bottom:24px;
			}
			body.layout_8 div#navigation{ margin-bottom:0; }
				#udm li a{ font-size:16px; line-height:34px; }
				#udm li li a{ line-height:26px; }
				
				p#breadcrumb{
					margin:0;
					padding:0 0 0 10px;
					font-size:16px; line-height:42px;
				}
				p#breadcrumb a{ color:#000000; }
				p#breadcrumb a:hover, p#breadcrumb a.cur{ color:#ff0000; }


	div#contentcolumns{ padding:0 10px 0 10px; }
	body.layout_5 div#contentcolumns{
		min-height: 422px;
		height: auto !important;
		height: 422px;
	}
	body.mobile div#contentcolumns{ padding-top:20px; }

	.intro{ padding:10px 10px 0 10px; margin: 0 -10px 20px -10px; background: #fff; /* IE6-8 Fallback – hex + shorthand needed for IE6/7 */ background: rgba(255, 255, 255, 0.85); }

	.float-left{ float:left; }
	.float-right{ float:right; }
	body.mobile .content-float.float-left, body.mobile .content-float.float-right{ float:none; }

	.size-s{ width:220px; overflow:hidden; }
	.size-m{ width:340px; overflow:hidden; }
	.size-l{ width:460px; overflow:hidden; }
	.size-xl{ width:700px; overflow:hidden; }

	body.mobile .size-s,
	body.mobile .size-m,
	body.mobile .size-l,
	body.mobile .size-xl{ width:auto; overflow:visible; }

	div.banner{ padding-bottom:20px; }
	/*body.mobile div.banner{ margin: 0 40px 0 40px; width:220px; }*/


	div.clearer,
	div.clearfloat{ clear:both; }

	/* Contain floats: h5bp.com/q */
	.clearfix:before, .clearfix:after{ content:""; display:table; }
	.clearfix:after{ clear:both; }
	.clearfix{ *zoom:1; }



/* ############################################################ */
/* #### Startseiten-Absperrband ############################### */

	div#barrier-tapes{
		position:absolute; left:0; top:0; z-index:30000;
		width:100%;
		min-width:960px;
		overflow:hidden;
		height:100%;
		cursor:pointer;
		text-align:left;
	}
		div#barrier-tapes div{ width:0; overflow:hidden; position:absolute; }
		div#barrier-tape-1-wrapper{ top:120px; }
		div#barrier-tape-2-wrapper{ top:240px; }

			div#barrier-tapes img{ width:100%; }


/* ############################################################## */
/* #### Flexslider ############################################## */

	div.flexslider{ position:relative; z-index:1; } /* kein Flackern des restlichen Contents bei animation:slide */
	/* div.flexslider{ position:relative; overflow:hidden; } */
	/* DEBUG: div.flexslider, div.flex-viewport{ overflow:visible !important; } */
		
	/*###
	//# Base Styles
	###*/
	
	.slides, slides > li, .flex-control-nav, .flex-direction-nav{ margin:0; padding:0; list-style:none; }
	.flexslider .slides > li{ display:none; -webkit-backface-visibility:hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */
	.flexslider .slides img{ width:100%; display:block; }
	.slides:after{ content:"\0020"; display:block; clear:both; visibility:hidden; line-height:0; height:0; } /* Clearfix for the .slides element */
	html[xmlns] .slides{ display: block; }
	* html .slides {height: 1%;}
	.no-js .slides > li:first-child { display: block; }


/* ############################################################ */
/* #### Hintergrundbild ####################################### */
	
	div#bgimg{ position:absolute; left:0; top:32px; width:100%; min-width:960px; height:950px; z-index:-1; }
	.mobile div#bgimg{ min-width:320px; top:64px; height:228px; }
		div#bgimg li{ height:950px; background-repeat:no-repeat; background-position:center top; }
		.mobile div#bgimg li{ height:228px; }


/* ############################################################ */
/* #### Footer ################################################ */

	div#footer{
		height:50px;
		position:relative;
		margin-top:40px;
	}
	body.layout_5 div#footer{ height:78px; }
	body.mobile div#footer{
		height:auto;
		top:0;
		padding:10px;
		overflow:visible;
	}

		div#footer div#infotel{
			position:absolute;
			left:10px;
			bottom:29px;
			height:17px;
			line-height:17px;
			color:#ff0000;
			padding-left:21px;
			background-repeat: no-repeat;
			background-position: left bottom;
			background-image: url(img/info-i.gif);
		}
		body.mobile div#footer div#infotel{	position:static; font-size:18px; margin-left:11px; }

		div#footer div#metanav{
			position:absolute;
			left:10px;
			bottom:9px;
			height:16px;
			font-size:12px;
			line-height:16px;
			color:#666699;
		}
		body.mobile div#footer div#metanav{ position:static; padding: 15px 0 15px 0px; text-align:center; }

			div#footer div#metanav a{
				color:#000;
				margin-right:25px;
			}
			div#footer div#metanav a.last{ margin-right:0; }
		
			div#footer div#metanav a:hover,
			div#footer div#metanav a.act{
				color:#ff0000;
			}

		div#socialbookmarks{
			position:absolute;
			left:10px;
			bottom:52px;
		}
		body.mobile div#socialbookmarks{ position:static; padding:15px 0 25px 0; text-align:center; }


		img#logo-bw{
			position:absolute;
			left:577px;
			bottom:7px;
		}
		body.mobile img#logo-bw{ position:static; width:110px; height:44px; margin-right:30px; }

		img#logo-mannheim{
			position:absolute;
			left:774px;
			bottom:25px;
		}
		body.mobile img#logo-mannheim{ position:static; width:155px; height:31px; }


/* ############################################################ */
/* #### MP4-Video ############################################# */

	div.video-js-box{ margin-bottom:10px; }

/* ############################################################ */
/* #### Formulare ############################################# */

	/*
	fieldset{
		border:none;
		margin:0.5em 0 0 0;
		padding:0;
	}

	label{ display:block; }
	.checkbox label{ display:inline; }

	div.csc-mailform-field{
		padding-bottom:3px;
	}
	.csc-mailform-field textarea,
	input.csc-mailform-input,
	.tx-guestbook-field textarea{
		width:300px;
	}
	*/
	
	/*
	NEU sysext:form
	*/
	.csc-mailform ol{ margin:0; padding:0; list-style:none; }
		.csc-mailform li.csc-form-element{ margin: 0 0 4px 0; padding:0; }
		.csc-mailform li.csc-form-element-submit{ margin-bottom:2em; }
		
			.csc-mailform label{ display:block; }
			/*
			.csc-form-element-textline label,
			.csc-form-element-textarea label{ width:150px; float:left;  }
			*/
			.csc-mailform .csc-form-element-checkbox label,
			.csc-mailform .csc-form-element-radio label{ display:inline; }
			.csc-form-element-checkbox p{ margin:0; }
			
				.csc-mailform label strong{ display:block; }
				
			.csc-mailform input[type="text"],
			.csc-mailform input[type="email"],
			.csc-mailform textarea{ padding:2px; border:1px solid #999; width:294px; /* Width - 6px */ }


/* ############################################################ */
/* #### Boxen ################################################# */

	div.box{ margin-bottom:20px; }
	div.grey-box{ background-color:#d9dadc; /* background-color:#eeeeee; background-repeat: repeat-x; background-position: left top; background-image: url(img/bg_grey-box.gif); */ }
	div.red-box{ background-color:#ff0000; color:#ffffff; /* background-repeat: repeat-x; background-position: left top; background-image: url(img/bg_red-box.gif); */ }
	div.white-box{ background: #fff; /* IE6-8 Fallback – hex + shorthand needed for IE6/7 */ background: rgba(255, 255, 255, 0.85); }


	div.box h2{ color:#000; border-bottom: 1px solid #fff; padding-top:10px; padding-bottom:9px; background-color:#d9dadc; }
	body.mobile div.box h2 { padding-top:4px; padding-bottom:3px; }
	div.red-box a{ color:#000000; }
	div.red-box h2{ color:#ffffff; background-color:#ff0000; }


	div.box p,
	div.box h1,
	div.box h2{ padding-left:10px; padding-right:5px; }

	div.box .csc-textpic-text p,
	div.box .csc-textpic-text h1,
	div.box .csc-textpic-text h2,
	div.marginalia div.box p,
	div.marginalia div.box .csc-textpic-text p,
	div.marginalia div.box h2,
	div.marginalia div.box .csc-textpic-text h2{ padding-left:10px; padding-right:5px; }


	div.height-174{
		height:174px;
		overflow:hidden;
	}
	div.height-213{
		height:213px;
		overflow:hidden;
	}
	body.mobile div.height-174,
	body.mobile div.height-213{
		height:auto;
		overflow:visible;
		padding-bottom:2px;
	}
	div.height-variable{
		padding-bottom:10px;
	}


/* ############################################################ */
/* #### Navigation (mobile) ################################### */

	ul.navigationmobile{
		margin:0 0 20px 0;
		padding:0;
		list-style:none;
		background-repeat: repeat-y;
		background-position: left top;
		background-image: url(img/bg_nav.gif);
	}
	/* kein Abstand auf Versanstaltunsseite */
	/* #page_60 ul.navigationmobile{ margin-bottom:0; } */

		ul.navigationmobile ul{
			margin:0;
			padding:0;
			list-style:none;
		}
		ul.navigationmobile li{
			margin:0;
			padding:0;
			list-style:none;
			font-size:13px;
			line-height:30px;
		}
		ul.navigationmobile a{
			color:#000;
			display:block;
			padding: 0 30px 0 10px;
			background-repeat: no-repeat;
			background-position: right center;
			background-image: url(img/bg_nav_a_mobile.png);
		}
		ul.navigationmobile a.act,
		ul.navigationmobile a.cur{ 
			color:#ff0000;
			background-image: url(img/bg_nav_a_mobile_act.png);
		}
	
		ul.navigationmobile ul a{ padding-left: 20px }
		ul.navigationmobile ul ul a{ padding-left: 30px }
		ul.navigationmobile ul ul ul a{ padding-left: 40px }
		ul.navigationmobile ul ul ul ul a{ padding-left: 50px }


	div.subnavhome{
		font-size:18px;
		margin-bottom:10px;
	}

/* ############################################################ */
/* #### Fancybox ############################################## */
	
	.fancybox-overlay { z-index: 28010 !important; }
	.fancybox-wrap { z-index: 28020 !important; }
	.fancybox-opened { z-index: 28030 !important; }
	.fancybox-close,  .fancybox-nav, .fancybox-nav span { z-index: 28040 !important; }
	.fancybox-title, .fancybox-title-float-wrap { z-index: 28050 !important; }
	#fancybox-loading { z-index: 28060 !important; }

/* ############################################################ */
/* #### Veranstaltungskalender ################################ */

	#page_60 p.more_events {display:none;}
	.tx-technoseumvss-pi1 .veranstaltungsliste { margin-bottom: 20px; }
	.tx-technoseumvss-pi1 #veranstaltungsliste .extracted {background:orange;}

	.tx-technoseumvss-pi2 ul.month_list{
		margin:0 0 20px 0;
		padding:0;
		list-style:none;
	}
		.tx-technoseumvss-pi2 ul.month_list li{
			margin:0;
			padding:0;
			list-style:none;
			font-size:13px;
			line-height:30px;
			background-repeat: repeat-y;
			background-position: left top;
			background-image: url(img/bg_nav.gif);
		}
			.tx-technoseumvss-pi2 ul.month_list a.monthlist_link{
				color:#000;
				display:block;
				padding: 0 30px 0 10px;
				background-repeat: no-repeat;
				background-position: right center;
				background-image: url(img/bg_nav_a_mobile.png);
			}
			/* body.mobile .tx-technoseumvss-pi2 ul.month_list a.monthlist_link{ padding-left:30px; } */
		
			.tx-technoseumvss-pi2 ul.month_list a.monthlist_link:hover,
			.tx-technoseumvss-pi2 ul.month_list li.active a.monthlist_link{
				color:#ff0000;
				background-image: url(img/bg_nav_a_act.png);
			}
			body.mobile .tx-technoseumvss-pi2 ul.month_list a.monthlist_link:hover,
			body.mobile .tx-technoseumvss-pi2 ul.month_list li.active a.monthlist_link{ background-image: url(img/bg_nav_a_mobile_act.png); }


			/*###
			//# Eintraege
			###*/
	
			.technoseumvss_events_of_month_ajax_inlist{	background-color:#fff; }
		
				/* body.mobile */ .tx-technoseumvss-pi2 .noresult{ padding:10px; }
			
				/* body.mobile */ .tx-technoseumvss-pi2 div.browseBoxWrap{ padding:2em 0 1em 10px; }
					/* body.mobile */ .tx-technoseumvss-pi1 div.showResultsWrap{ padding:0; }
			
				/* .tx-technoseumvss-pi1 div.date{ padding: 10px 0 1em 0; } */
				/* body.mobile */ .tx-technoseumvss-pi1 div.date{ padding: 10px 0 0 0; }


				/* .tx-technoseumvss-pi1 div.listeneintrag{ margin-bottom:1em; } */
				/* body.mobile */ .tx-technoseumvss-pi1 div.listeneintrag{ padding: 0 10px 0 10px; }
				.tx-technoseumvss-pi1  div.listeneintrag.active{ padding: 10px; background-color:#e5e5e5; }
			
					.tx-technoseumvss-pi1 div.listeneintrag p{ margin:0; }
			
				/* "neue Suche"-Button auslenden */	
				.technoseumvss_events_of_month_ajax_inlist form{ display:none; }

			/*###
			//# Suche
			###*/
		
			form#suchformular div.label{ float:left; width:90px; }
			form#suchformular div.value{ float:left; }
		
			form#suchformular{ padding-right:10px; }
			form#suchformular div.label{ font-weight:bold; }
		
			form#suchformular .col-left{ float:left; padding-right:5px; }
				form#suchformular .cal-container{ float:left; width:82px; }
			
			form#suchformular .col-right{ float:left; text-align:right; width:80px; }

			form#suchformular input.startdatum,
			form#suchformular input.enddatum{ width:70px; }

			form#suchformular div.second,
			form#suchformular div.third,
			form#suchformular div.fourth{ padding-top:15px; }