/*   
Theme Name: TSFraunhofer60Jahre

Description: Design fuer Fraunhofer 60 Jahre Feier der drei Institute in Darmstadt
Author: Tobias Scholl
Author URI: http://tobias.scholl.biz
Version: 1.0
*/

*
{
	margin:0;
	padding:0;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: black;
}

html 
{
	background: #DDD url(./images/grau.png) repeat;
}

div{
	margin:0;
	padding:0;
}

p, a, span
{
	font-size: 9pt;
	line-height: 12pt;
}

h1
{
	font-size: 11pt;
	line-height: 15pt;
	margin-bottom: 10px;
}

h2
{
	font-size: 10pt;
	line-height: 13pt;
	margin-bottom: 5px;
}


a, a:visited
{
	text-decoration: underline;
}

a:hover, a:active, a:focus
{
	color: #666;
}

a.noDeco
{
	text-decoration: none;	
}

img
{
	border: 0;
}

.grau
{
	color: #666;
}

/*

	Design

*/

div#TSWrapper
{
	display: block;
	width: 910px;
	height: 713px;
	margin: 10px auto 0 auto;
	padding: 0;
}

div#TSTop
{
	display: block;
	float: left;
	width: 740px; /* P L U S    Innenabstand fuer Seiten */
	height: 625px; /* P L U S    Innenabstand fuer Oben/Unten */
	margin: 0;
	padding: 15px 30px 20px 30px; /* Innenabstaende oben und unten für Einrueckung */
	background: #FFF url(./images/topBG.png) no-repeat top center;
}

	div#TSHeader
	{
		display: block;
		width: 740px;
		height: 130px;
		margin: 0;
		padding: 0;
		background: #FFF url(./images/topKeyVisual.png) no-repeat top center;
	}

	div#TSTop  ul#TSMenu
	{
		display: block;
		width: 715px;
		height: 20px;
		margin-bottom: 20px;
		padding: 0 0 0 20px;
		background: #DDD url(./images/grau.png);
	} 


		div#TSTop ul#TSMenu li
		{
			display: block;
			float: left;
			width: 120px;
			height: 20px;
			margin: 0;
			padding: 0;
		}
		
		div#TSTop ul#TSMenu li#first-item
		{
			display: block;
			float: left;
			width: 100px;
			height: 20px;
			margin: 0;
			padding: 0;
		}
		
		div#TSTop ul#TSMenu li#first-item a, div#TSTop ul#TSMenu li#first-item a:visited
		{
			display: block;
			width: 89px;
			height: 20px;
			padding: 0 10px 0 0;
			border-right: 1px solid #FFF;
			font-size: 13px;
			line-height: 20px;
			text-decoration: none;
			text-align: center;
		}
		
		div#TSTop ul#TSMenu li a, div#TSTop ul#TSMenu li a:visited
		{
			display: block;
			width: 99px;
			height: 20px;
			padding: 0 10px;
			border-right: 1px solid #FFF;
			font-size: 13px;
			line-height: 20px;
			text-decoration: none;
			text-align: center;
		}
		
		div#TSTop ul#TSMenu li a:active.aktuelles, div#TSTop ul#TSMenu li a:focus.aktuelles, div#TSTop ul#TSMenu li.current-item a.aktuelles
		{
			background: #F4D400;
		}
		
		div#TSTop ul#TSMenu li a:active.veranstaltungen, div#TSTop ul#TSMenu li a:focus.veranstaltungen, div#TSTop ul#TSMenu li.current-item a.veranstaltungen
		{
			background: #DE004F;
		}
		
		div#TSTop ul#TSMenu li a:active.institute, div#TSTop ul#TSMenu li a:focus.institute, div#TSTop ul#TSMenu li.current-item a.institute
		{
			background: #65B17C;
		}
		
		div#TSTop ul#TSMenu li a:active.highlights, div#TSTop ul#TSMenu li a:focus.highlights, div#TSTop ul#TSMenu li.current-item a.highlights
		{
			background: #00B1E3;
		}
	
	div#TSTop div#TSContent
	{
		display: block;
		width: 668px; /* for IE*/
		height: 450px;
		background: #FFF;
		margin: 0 0 0 35px;
		overflow: hidden;
	}
	
	
		/* 
		
			S T A R T S E I T E 
			
		*/
		div#TSTop div#TSContent a.flipImage
		{
			display: block;
			float: left;
			width: 205px;
			height: 132px;
			background: url(./images/flipTruck.png) no-repeat top center;
			text-decoration: none;
		}
		
		/*	div#TSTop div#TSContent a[ ,:hover].[one,two,...nine] Hintergrundgrafiken in <flipImages.css> definieren */	

		div#TSTop div#TSContent a.one, div#TSTop div#TSContent a.two, div#TSTop div#TSContent a.four, div#TSTop div#TSContent a.five
		{
			margin: 0 25px 25px 0;
		}
		
		div#TSTop div#TSContent a.three, div#TSTop div#TSContent a.six
		{
			margin: 0 0 25px 0;
		}
		
		div#TSTop div#TSContent a.seven, div#TSTop div#TSContent a.eight
		{
			margin: 0 25px 0 0;
		}
		
		div#TSTop div#TSContent a.nine
		{
			margin: 0;
		}
		
		
		/*
		
			A K T U E L L E S
			
		*/
		
		div#TSTop div#TSContent div.TSPost
		{
			display: block;
			width: 660px;
			height: 120px;
			margin: 0 0 20px 0;
		}
		
		
		div#TSTop div#TSContent div.TSPost img
		{
			display: block;
			float: left;
			width: 205px;
			height: 120px;
			margin: 0 20px 0 0;
		}
		
		div#TSTop div#TSContent div.TSPost h2
		{
			display: block;
			float: left;
			width: 435px;
		}
		
		div#TSTop div#TSContent div.TSPost p
		{
			display: block;
			float: left;
			width: 435px;
			font-size: 9pt;
			line-height: 11pt;
		}
		
		
		
		/*
		
			V E R A N S T A L T U N G E N
		
		*/
		
		div#TSTop div#TSContent dl.veranstaltung
		{
			display: block;
		}
		
		div#TSTop div#TSContent dl.veranstaltung dt
		{
			display: block;
			float: left;
			width: 205px;
			margin: 0 20px 20px 0;
			font-size: 10pt;
			line-height: 13pt;
		}
		
		div#TSTop div#TSContent dl.veranstaltung dd
		{
			display: block;
			float: left;
			width: 420px;
			margin: 0 0 20px 0;
			font-size: 9pt;
			line-height: 11pt;
		}
		
		div#TSTop div#TSContent dl.veranstaltung dd.mehrere
		{
			margin-left: 225px;
		}
		
		
		
		
		
		
		
		/*
		
			3 - S P A L T E N  -- je 205px
		
		*/
		div.ContentLeft, div.ContentCenter, div.ContentRight
		{
			display: block;
			float: left;
			width: 205px;
			margin-right: 25px;
		}
		
		div.ContentRight
		{
			margin: 0;
		}
		
		
		/*
		
			R E C H T L I C H E   H I N W E I S E -- 2 Spalten
			
		*/
		
			
		div#TSTop div#TSContent div.RHLeft
		{
			display: block;
			float: left;
			width: 350px;
			height: 450px;
			margin-right: 65px;
		}
		
		div#TSTop div#TSContent div.RHRight
		{
			display: block;
			float: left;
			width: 250px;
			height: 450px;
		}
		
		/* 
		
			I N S T I T U T E 
		
		*/
		div#TSTop div#TSContentInstitute
		{
			position: relative;
			top:0;
			left: 0;
			width: 668px; /* for IE*/
			height: 450px;
			margin: 0 0 0 35px;
			background: #FFF url(./images/instituteLandkarte.png) no-repeat center;
			overflow: hidden;
		}
		
			div#TSTop div#TSContentInstitute div#instituteText
			{
				display: block;
				width: 205px;
				max-height: 200px;
			}
		
			div#TSTop div#TSContentInstitute div#institutSIT
			{
				display: block;
				position: absolute;
				top: 260px;
				left: 0;
				width: 155px;
				height: 230px;
			}
			
			div#TSTop div#TSContentInstitute div#institutIGD
			{
				display: block;
				position: absolute;
				top: 0;
				left: 510px;
				width: 155px;
				height: 230px;
			}
			
			div#TSTop div#TSContentInstitute div#institutLBF
			{
				display: block;
				position: absolute;
				top: 290px;
				left: 510px;
				width: 155px;
				height: 230px;
			}
			

			div#TSTop div#TSContentInstitute div#institutSIT a, div#TSTop div#TSContentInstitute div#institutIGD a, div#TSTop div#TSContentInstitute div#institutLBF a
			{
				text-decoration: none;
			}
			
		
		
		/* I N S T I T U T E -- Unterseiten	*/
		div#TSTop div#TSContent div#INTopContent
		{
			display: block;
			width: 668px;
			height: 290px;
			margin-bottom: 10px;
			overflow: hidden;
		}
					
		div#TSTop div#TSContent div#INBottomContent
		{
			display: block;
			width: 668px;
			height: 150px;
			overflow: hidden;
		}
		

		/*
		
			H I G H L I G H T S
		
		*/
		div#TSTop div#TSContent div a.highlightThumbs
		{
			display: block;
			float: left;
			width: 165px;
			height: 130px;
			margin: 0 20px 10px 0;
			text-align: center;
			text-decoration: none;
			font-size: 16px;
			line-height: 20px;
			color: white;
			background: #00B1E3;
		}
		
		div#TSTop div#TSContent div a:hover.highlightThumbs
		{
			color: white;
		}
		

		/*
		
			2 - S P A L T E N  -- 275px zu 370px (Highlights Unterseiten)
		
		*/
		div#TSTop div#TSContent div#HLDLeft
		{
			display: block;
			float: left;
			width: 275px;
			height: 450px;
			margin-right: 20px;
		}
		
		div#TSTop div#TSContent div#HLDRight
		{
			display: block;
			float: left;
			width: 370px;
			height: 450px;
		}
		
		
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie
			{
				display: block;
				position: relative;
				top: 0;
				left: 0;
				width: 370px;
				height: 130px;
				margin-top: 290px;
				list-style-type: none;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li
			{
				display: block;
				float: left;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a
			{
				display: block;
				width: 105px;
				height: 140px;
				text-decoration: none;
				z-index: 1;
				overflow: hidden;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li.center a 
			{
				margin: 0 27px;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a img, div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a span img
			{
				border:0;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a span
			{
				position: absolute;
				top: -288px;
				left: 0;
				width: 370px;
				height: 270px;
				margin: 0;
				padding: 0;
				border: 0;
				background: white;
				visibility: hidden;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a:hover, div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a:focus, div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a:active
			{
				background: #FFF; /* die Zuweisung braucht auch nur der IE .... */
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li.showPic span
			{
				position: absolute;
				top: -288px;
				left: 0;
				margin: 0;
				padding: 0;
				border: 0;
				visibility: visible;
				background: white;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a:focus span, div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a:active span
			{
				background: white;
				visibility: visible;
				z-index: 5;
			}
			
			div#TSTop div#TSContent div#HLDRight ul.hightlightsFotogalerie li a:hover span
			{
				background: white;
				visibility: visible;
				z-index: 10;
			}
		
		
		
div#TSFooter
{
	display: block;
	float: left;
	width: 800px;
	height: 53px;
	margin: 0;
	padding: 0;
	background: #FFF url(./images/footerBG.png) no-repeat bottom left;
	text-align: center;
}

	div#TSFooter ul#TSServiceMenu
	{
		display: block;
		width: 800px;
		height: 20px;
		background: #DDD url(./images/grau.png);
		line-height: 13px;
	} 

		div#TSFooter ul#TSServiceMenu li
		{
			display: inline;
			padding: 0 10px;
			text-align: center;
			font-size: 10px;
			border-right: 1px solid #FFF;
			line-height: 13px;
		}
	
		div#TSFooter ul#TSServiceMenu li.last
		{
			border-right: 0;
		}

		div#TSFooter ul#TSServiceMenu li a
		{
			text-decoration: none;
			font-size: 10px;
			line-height: 13px;
		}


div#TSSidebar
{
	display: block;
	float: right;
	width: 110px;
	height: 713px;
	margin: 0;
	padding: 0;
	background: #DDD url(./images/sidebarKeyVisual.png) no-repeat top left;	
}

div#WWWC
{
	display: block;
	width: 910px;
	margin: 20px auto 0 auto;
	text-align:center;
}

	div#WWWC p
	{
		width: 800px;
		margin-right:110px;
	}