/*################################################################################################################# */
/*#### BASIS  ##################################################################################################### */
/*################################################################################################################# */

* {padding:0px; margin:0px; font-size: 100%; }

object {outline: none;}

html {height:100%}

body {

	/*erzwingt im Firefox die Anwesenheit des vertikalen Scrollbalkens.
	Mit diesem kleinen Kniff wird verhindert, dass zentrierte Layouts plötzlich seitlich "springen",
	wenn die Höhe der Webseite größer als der sichtbare Bereich des Browserfensters wird.*/
    font-size: 100.01%; /*gleicht Rundungsfehler aus*/

    position: relative;/*damit positionierte Elemente (vermutlich im Internet Explorer) beim Verändern
	der Fenstergröße auch wirklich neu und korrekt positioniert werden. */
}

span.hidden {
	display: none
}

select, input, textarea {font-size: 99%} /*in älteren Safari-Versionen würden Schriften zu groß erscheinen*/

fieldset, img {border:0;}


/*################################################################################################################## */
/*#### ALLGEMEIN/ELEMENTE  ######################################################################################### */
/*################################################################################################################## */

body {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 11px;
	line-height:18px;
	color:#ffffff;
	background-color:#000000;
	/*background-image:url(images/kachel.gif);*/
	/*background-image:url('images/background.gif');*/
	background-repeat:repeat;
	background-attachment:fixed;
	margin: 0px;
	padding: 0px;
	height: 100%;
}

select, input, textarea {background-color:#EFEFEF;}
select:focus, input:focus, textarea:focus {background-color:#FFFFFF;}

strong {font-weight: 900; color: #ffffff}

p {
	padding: 1em 0em 0em 0em;
	margin: 0px;
}

h1 { font-weight:bold; color:#666666;}

h1.logo {
	position: absolute;
	left: 10px;
	top: 20px;
	width: 194px;
	height: 68px;

	background-image: url('images/medienbrueckeLogo.gif');
	background-repeat: no-repeat;
	text-indent: -999em; /* Angabe für Image Replacement */
	overflow: hidden;
	z-index: 1;

	padding: 0px;
	margin: 0px;
}
h2.logo {
	position: absolute;
	left: 10px;
	top: 540px;
	width: 96px;
	height: 64px;

	background-image: url('images/ivgLogo.gif');
	background-repeat: no-repeat;
	text-indent: -999em; /* Angabe für Image Replacement */
	overflow: hidden;
	z-index: 1;

	padding: 0px;
	margin: 0px;
}

h2#mediaWorksLogo {
	position: absolute;
	left:820px;
	top: 460px;

	width: 116px;
	height: 52px;

	background-image: url('images/lage/mediaWorksMunichLogo.jpg');
	background-repeat: no-repeat;
	text-indent: -999em; /* Angabe für Image Replacement */

	z-index: 10;

	padding: 0px;
	margin: 0px;
}

/*#### LINKS ############################################################## */

a, a:link, a:visited {
	font-size: 11px;
	font-weight: 100;
	text-transform:none;
	text-decoration: underline;
	color: #a0a0a0;
}

.aktiv, a:hover, a:active {
	font-size:11px;
	font-weight: 100;
	text-transform:none;
	color: #434343;
	text-decoration:none;
}

a.smallfont { font-size:10px;}
.smallfont { font-size:10px;}

/*################################################################################################################## */
/*#### CONTAINER / GRUNDLAYOUT  #################################################################################### */
/*################################################################################################################## */

#spacerTop {
	/* Diese Box verhindert, dass sich die linke obere Ecke von #container bei  *
	 * Verkleinerung aus dem sichtbaren Bereich herausschiebt					*/
	width: 1px;
	height: 50%;
	float: left;
	margin-bottom: -325px;	/* halbe Höhe von #container */
}

div#container {
	clear: left;

	margin: 0px auto;
	padding: 0px;

	position: relative;		/* als Bezugspunkt für enthaltene Elemente */

	width: 960px;
	height: 630px;

	border: 1px solid #9C9C9C;
	background-image:url(images/background_content_box.gif);

	background-color: #000000;

	background-repeat:no-repeat;
	overflow: visible;
}

div#backgroundImage {
	position:absolute;
	right: 0px;
	top: 0px;
	z-index: 0;
}

div#backgroundImageMiddle {
	position:absolute;
	left: 214px;
	top: 126px;
	z-index: 0;
}

div#orangeSpacerExtraLarge {
	position: absolute;
	left: 464px;
	top: 30px;
	width: 16px;
	height: 600px;
	background-color: #dc9425;
}

div#orangeSpacerLarge {
	position: absolute;
	left: 464px;
	top: 346px;
	width: 16px;
	height: 284px;
	background-color: #dc9425;
}

div#orangeSpacerSmall {
	position: absolute;
	left: 464px;
	top: 470px;
	width: 16px;
	height: 160px;
	background-color: #dc9425;
}

div#impressumField {
	position: absolute;
	left: 496px;
	top: 30px;
	width: 450px;
	height: 600px;
	font-size: 11px;
	line-height: 16px;
}

div#textField {
	position: absolute;
	top: 464px;
	left: 494px;
	width: 464px;
	margin: 0px;
	padding: 0px;
	z-index: 2;
}

div#videoLink {
	position: absolute;
	top: 415px;
	left: 845px;
	margin: 0px;
	padding: 0px;
	z-index: 2;
}

div#videoLink span {
	font-size: 12px;
	letter-spacing: 1px;
}

div#videoLink a, div#videoLink a:link, div#videoLink a:visited {
	font-size: 11px;
	font-weight: 900;
	text-transform:none;
	text-decoration: none;
	color: #CCCCCC;
}

div#videoLink a:hover, div#videoLink a:active {
	font-size:11px;
	font-weight: 900;
	text-transform:none;
	color: #636363;
	text-decoration:none;
}

div#videoField {
	position: absolute;
	top: 10px;
	left: 75px;
}

div#printPlan {
	position: absolute;
	top: 420px;
	left: 860px;
	margin: 0px;
	padding: 0px;
	z-index: 2;
}

div#printPlan a, div#printPlan a:link, div#printPlan a:visited {
	font-size: 10px;
	font-weight: 100;
	text-transform:none;
	text-decoration: none;
	color: #CCCCCC;
	letter-spacing: 1px;
}

div#printPlan a:hover, div#printPlan a:active {
	font-size:10px;
	font-weight: 100;
	text-transform:none;
	color: #636363;
	text-decoration:none;
	letter-spacing: 1px;
}



/*################################################################################################################## */
/*#### MAINMENU - links ############################################################################################ */
/*################################################################################################################## */

div#menu {
	position:absolute;
	left: 0px;
	top: 0px;

	width: 214px;
	height:100%;
	background-color: #FFFFFF;

	overflow: visible;

	z-index: 1;
}

div#menuShadow {
	position: absolute;
	top: 0px;
	left: 214px;
	width: 6px;
	background: url(images/menu/menuShadow.png) no-repeat;
	height: 100%;
	z-index: 1;
}

.menu {
	position:relative;
	left: 0px;
	top: 125px;
	width:214px;
	font-size:11px;
	margin: 0px;
	z-index: 10;
}

.menu ul li a {
	display:block;
	text-decoration:none;
	color:#686868;
	font-weight: 900;
	width:194px;
	height:23px;
	text-align: left;
	padding-left: 20px;
	background:#c9c9a7; line-height:19px; font-size:11px;
}

.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {float:left; margin-right:1px; position:relative;}
.menu ul li ul {display: none; opacity: 0.85; position:absolute; top:0; left:214px; width:214px;}

.menu ul li a, .menu ul li a:visited, .menu ul li a:active  {background-image: url('images/menuButton.gif');}

.menu ul li a:hover, .menu ul li a.active {background-position: 0px -23px; color:#0065A3;}

.menu ul li:hover ul {display:block;}
.menu ul li:hover ul li a.hide {background:#dfc184; color:#000;}

.menu ul li:hover ul li ul {display: none;}
.menu ul li ul li a, .menu ul li ul li a:visited, .menu ul li ul li a:active {background-image: url('images/menuButton.gif');}
.menu ul li ul li a:hover, .menu ul li ul li a.active {background-position: 0px -23px; color:#0065A3;}

/*################################################################################################################## */
/*#### VIDEO MENU       ############################################################################################ */
/*################################################################################################################## */

ul#videoMenu {
	position: absolute;
	top: 590px;
	left: 100px;
	list-style-type: none;

}

ul#videoMenu li {
	display: inline;
	padding: 0px 10px 0px 10px;
}

ul#videoMenu a, ul#videoMenu a:link, ul#videoMenu a:visited {
	font-size: 11px;
	font-weight: 900;
	text-transform:none;
	text-decoration: none;
	color: #CCCCCC;
}

ul#videoMenu a:hover, ul#videoMenu a:active {
	font-size:11px;
	font-weight: 900;
	text-transform:none;
	color: #636363;
	text-decoration:none;
}


/*################################################################################################################## */
/*#### CONTENT TABLE ############################################################################################### */
/*################################################################################################################## */

table#contentTable {
	position: absolute;
	top: 340px;
	left: 494px;
	width: 464px;
	margin: 0px;
	padding: 0px;
	z-index: 2;
}

table#contentTable td {
	vertical-align: top;
	padding-bottom: 15px;
	color: #a0a0a0;
}

/*################################################################################################################## */
/*#### NEWS TABLE    ############################################################################################### */
/*################################################################################################################## */

table#newsTable {
	position: absolute;
	top: 340px;
	left: 494px;
	width: 464px;
	margin: 0px;
	padding: 0px;
	text-align: left;
	z-index: 2;
}

table#newsTable td {
	vertical-align: top;
	padding: 0px 0px 4px 0px;
}

table#newsTable th {
	vertical-align: top;
	text-align: left;
	width: 218px;
	font-weight: 100;
}

div#newsInfo {
	position: absolute;
	top: 340px;
	left: 240px;
	width: 200px;
}

/*################################################################################################################## */
/*#### PLAN TABLE    ############################################################################################### */
/*################################################################################################################## */

table#planTable {
	position: absolute;
	top: 464px;
	left: 494px;
	width: 464px;
	margin: 0px;
	padding: 0px;
	text-align: left;

	z-index: 2;
}

table#planTable td {
	vertical-align: top;
	padding: 0px 0px 5px 0px;
}

table#planTable th {
	vertical-align: top;
	width: 150px;
	font-weight: 100;
}

/*################################################################################################################## */
/*#### RENT TABLE    ############################################################################################### */
/*################################################################################################################## */

table#rentTable {
	position: absolute;
	top: 464px;
	left: 494px;
	width: 464px;
	margin: 0px;
	padding: 0px;
	text-align: left;
	z-index: 2;
	line-height: 14px;
	border-collapse:collapse;
}

table#rentTable td {
	vertical-align: top;
	padding: 0px;
}

table#rentTable td.grey {
	color: #909090;
}

table#rentTable td.orange {
	color: #e5cb6f;
}

table#rentTable tr.spaceBottom td{
	padding: 0px 0px 10px 0px;
}

table#rentTable tr.spaceTop td{
	padding: 10px 0px 0px 0px;
}

table#rentTable th {
	vertical-align: top;
	width: 150px;
	font-weight: 900;
	padding-bottom: 10px;
}

/*################################################################################################################## */
/*#### CONTENT LIST  ############################################################################################### */
/*################################################################################################################## */

ul#contentList {
	position: absolute;
	top: 462px;
	left: 504px;
	width: 444px;
	margin: 0px;
	padding: 0px;
	text-align: left;

	z-index: 2;

	list-style-type: square;
}

ul#contentList.small {
	width: 280px;
}

ul#contentList li {
	color: #ffffff;
}

ul#contentList li.space {
	margin-top: 10px;
}

/*################################################################################################################## */
/*#### IMAGE SLIDE ################################################################################################# */
/*################################################################################################################## */

/*Allgemein*/
div.slide_container {
	position: absolute;
	left: 214px;
	top: 0px;
	z-index: 0;
}

div.slide_container div.image {
	border: 0px solid #000000;
	margin-right: 0px;
	margin-bottom: 8px;

	float: left;
}


ul#thumbnailContainer  {
	position: absolute;
	left: 770px;
	top: 420px;
	color: #909090;
	z-index: 1;
	list-style-type: none;
}

ul#thumbnailContainer li {
	display: inline;
	padding: 0px 2px 0px 2px;
	cursor: default;
}

ul#thumbnailContainer li a, ul#thumbnailContainer li a:visited {
	color: #ffffff;
	text-decoration:none;
	cursor: pointer;
	opacity: 0.3;
}

ul#thumbnailContainer li a:active , ul#thumbnailContainer li a:hover {
	color: #faba32;
	text-decoration:none;
}

img.slideImage {
	border: 1px solid #000000; float: left;
}