/***************
  * GENERAL     *
  ***************/
 *{
    padding: 0px;
    margin: 0px;
    font-family: Arial;
	font-size: 11px;
    color: #333;
}


body {
	background-color: #333333;
	height: 100%;
	font-size: 11px;
    behavior:url("/mysite/javascript/csshover.htc");	
}

img {
    display: block;
	border: none
}

a{
   text-decoration: none;
}

div#mainMenu ul li ul li a:hover, div#mainMenu ul#Navi2 li a:hover {
	color: #fe8300;
	text-decoration: underline;	
}

div#mainMenu ul#Navi2 li.section a, div#mainMenu ul#Navi2 li.current a{
	color: #fe8300;
}

div#mainMenu ul li ul li.section a, div#mainMenu ul li ul li.current a {
	color: #fe8300;
}

.clear {
	clear: both;
}


/******************
 * Holders		  *
 ******************/
div#main {
	margin: 20px auto;
	width: 700px;
	height: 700px;
	background-color: #fff;
}

div#logo {
	float: right;
	margin-right: 20px;
	margin-top: 20px;
	_margin-right: 10px;
	width: 94px;
	height: 103px;
	z-index: 3;
}

div#footer {
	padding-top: 5px;
	color: #fff;
	text-transform: lowercase;
	background-color: #333333;
}

div#footer * {
	color: #fff;
}
/******************
 * MainNavi		  *
 ******************/
div#mainMenuWrapper {
	position: absolute;
    z-index: 3;
	text-transform: lowercase;
}

div#menuOpener {
	padding: 20px;
	line-height: 13px;
	font-size: 14px;
	font-weight: bold;
}

div#mainMenu {
	position: absolute;
	display:none;
	top: 0px;
	left: 0px;
	height: 180px;
	width: 500px;
	padding:20px;
}

div#mainMenuBackground {
	position: absolute;
	display:none;
	top: 0px;
	left: 0px;
	height: 180px;
	width: 500px;
	background-color: #fff;
	padding:20px;
	opacity: 0.8;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
 }
	
div#mainMenu ul {
    position: relative;
	list-style: none;
	text-decoration: none;
	color: #333333;
}

div#black {
	position: absolute;
	bottom: 20px;
	width: 500px;
	height: 12px;
	background-color: #333333;
}

div#mainMenuWrapper:hover div#mainMenu, div#mainMenuWrapper:hover div#mainMenuBackground {
	display:block;
}

div#mainMenuWrapper:hover div#menuOpener {
	display:none;
}
	
div#mainMenu ul li{
	color: #fff;
	float: left;
}

div#mainMenu ul li div {
    background-color: #333;

    width: 100px;
    display: block;
	color: #fff;
	line-height: 13px;
	font-size: 16px;
    padding: 0px 0px 0px 10px;
    font-weight: bold;
}

div#mainMenu ul li div span {

    display: block;
    height: 13px;
    color: #fff;
	line-height: 13px;
	font-size: 16px;
    width: 100px;
    background-image: url(../images/arrowRight.gif);
    background-repeat: no-repeat;
    background-position: right;   
}

div#mainMenu ul li div span.last {

    background: none;
}

div#mainMenu ul li a.bottom {
	cursor: pointer;
    background: none;
}

div#mainMenu ul li ul {
	clear: both;
}

div#mainMenu ul li ul li a{
	cursor: pointer;
    background: none;
	color: #333;
	font-size: 11px;
    font-weight: normal;
}


div#mainMenu ul li ul li {
	background: none;
	clear: both;
}

ul.subMenu li{
	list-style: none;
	text-decoration: none;
	color: #333;
}

/**********************
 * second Navigation  *
 **********************/

div#mainMenu ul#Navi2 {
	text-transform: lowercase;
	float: none;
	position: absolute;
	bottom: 32px;
	color: #333;
    padding: 0px 0px 3px 0px;
}

div#mainMenu ul#Navi2 li {
	float: none;
}
div#mainMenu ul#Navi2 li a{
	cursor: pointer;
	color: #333;
	font-size: 11px;
    font-weight: normal;
}

div#language {
	position: absolute;
	bottom: 32px;
	right: 30px;
	float: right;
}

div#language a {
    font-weight: normal;
}

/******************
 * Content		  *
 ******************/

    
div#contentWrapper {
	padding: 268px 30px 10px 240px;
	height: 288px;
    position: relative;
    z-index: 2;
}



div#contentWrapper div#typographyWrapper {
	height: 224px;	
    overflow: hidden;
 }
 
div#typographyWrapper a{
	text-decoration: underline;
}
 
div.typographyBox {
	height:214px;
}
   
div#contentWrapper.eight div#typographyWrapper {
     height: 214px;
}
  
div#contentWrapper.big {
	padding: 0px 10px 10px 240px;
    height: 556px;

}

div#contentWrapper.big div#typographyWrapper {
	height: 428px;	
    overflow: hidden;
}

div#contentWrapper.news div.news {
	height: 70px;
	overflow: hidden;
}

div#contentWrapper.news div#typographyWrapper {
	margin-top: 14px;
	height: 168px;	
}

/* FLASH */
 
div#contentWrapper.smallFlash {
	padding: 60px 10px 10px 240px;
    height: 496px;
    background: none;
}

div#contentWrapper.smallFlash h1 {
	_margin-top: -240px;
}

div#smallFlash {
    position: absolute;
    left: 0px;
    width: 700px;
    height: 200px;
    background-color: #5c5c5c;
    margin-top: 10px;
}

div#contentWrapper.smallFlash div#typographyWrapper {
     position: relative;
     top: 220px;
     height: 214px;	
}

div#contentWrapper.bigFlash {
	padding: 0px 20px 10px 440px;
    height: 556px;
    background: none;
}

div#bigFlash {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 700px;
    height: 380px;
    background-color: #fff;
    margin-top: 0px;
}

div#contentWrapper.bigFlash div#typographyWrapper {
	position: absolute;
     top: 376px;
	 left:440px;
     height: 116px;	
	 width: 240px;
	 z-index: 3;
}

/* END_FLASH*/

div#newsSwitch{
 	position: absolute;
	left: 20px;
	bottom: 20px;
	height: 16px;
	width: 44px;
 }
 div#newsSwitch a{
	display: block;
    float: left;
    line-height: 8px;
    width: 16px;
	height: 16px;
    text-align: center;
}
	

div#lastNewsEntry a, div#nextNewsEntry a{
	float: left;
}
  
 div#lastNewsEntry a{
	background-image: url(../images/arrow_left_grey.png);
	margin-right: 3px;
 }
 
 div#nextNewsEntry a{
	background-image: url(../images/arrow_right_grey.png);
 }
 
  div#lastNewsEntry a:hover{
	background-image: url(../images/arrow_left_orange.png); 	
 }
 
 div#nextNewsEntry a:hover{
	background-image: url(../images/arrow_right_orange.png);
 }
 
div#contentWrapper div#newsSwitch span.spacer {
 	display: block;
    float: left;
    padding: 4px;
    line-height: 8px;
    width: 8px;
    margin-left: 3px;
 }
 
div#bigFlashSwitch {
 	position: absolute;
	left: 20px;
	top: 390px;
	height: 16px;
	width: 40px;
 }
 
 div#smallFlashSwitch {
 	position: absolute;
	left: 20px;
	top: 304px;
	_top: 275px;
	height: 16px;
	width: 40px;
 }
 
 div#smallFlashSwitch a{
    float: left;
    height: 16px;
    width: 16px;
    text-align: center;
}

div#bigFlashSwitch a{
    float: left;
    height: 16px;
    width: 16px;
    text-align: center;
}
 
div#switchToLast{
  	visibility: hidden;
}

div#switchToLast a{
	margin-right: 3px;
}

div#switchToLast a{
	background-image: url(../images/arrow_left_grey.png);
}

div#switchToNext a{
	background-image: url(../images/arrow_right_grey.png);
}

div#switchToLast a:hover{
	background-image: url(../images/arrow_left_orange.png);
}

div#switchToNext a:hover{
	background-image: url(../images/arrow_right_orange.png);
}

div#switchToLast, div#switchToNext{
 	font-family: Arial; 
	color: #000000;
 }
  
div#contentWrapper div#pageNavigator {
    position: absolute;
    bottom: 20px;
    right: 20px;

}

div#contentWrapper div#pageNavigator a{
    display: block;
    float: left;
    padding: 3px;
    border: 1px solid #ccc;
    line-height: 8px;
    width: 8px;
    text-align: center;
    margin-left: 3px;
}

div#contentWrapper div#pageNavigator a:hover, div#contentWrapper div#pageNavigator a.active{
    background-color: #ccc;
}



div#contentWrapper h1, div#contentWrapper h1 span {
	text-transform: lowercase;
	font-size: 15px;
}
div#headline {
    background-image: url(../images/blackBar.gif);
    background-repeat: no-repeat;
}

div#contentWrapper h1 {
    padding-left: 40px;
	padding-bottom: 6px;
}

div#contentWrapper h1 span {
	color: #fe8300;
	padding: 0px;
}


div#text1, div.typographyLeft {
	padding-right: 30px;
}
div#text1, div#text2, div.typographyLeft, div.typographyRight {
	width: 200px;
	float:left;
}

div#text1 p, div#text2 p {
	font-weight: normal; 
	font-size: 11px;	
} 

div#text1 a, div#text2 a{
	text-decoration: underline;
	font-size: 11px;	
	
}

div#text1 h2, div#text2 h2 {
	padding: 0px;
	text-transform: none;
	font-size: 11px;
	color: #fe8300;
}

div#text1 h3, div#text2 h3 {
	font-size: 11px;
	color: #333;
}

div#linkColumn {
	position: absolute;
	top: 306px;
	left: 240px;	
	padding-right: 30px;
	z-index: 3;
}

div#thingLink {
	position: absolute;
	left: 0px;	
	padding-right: 30px;
	z-index: 3;
}

div#thingLink a{
	text-decoration: none
}

div#thingLink a.current b {
	color: #fe8300;
}

div#thingLink a:hover b {
	color: #fe8300;
}

div#linkColumn, div#rightColumn {
	width: 200px;
	z-index: 2;
}

div#linkColumn a{
	text-decoration: none
}

div#linkColumn a.current b {
	color: #fe8300;
}

div#linkColumn a:hover b {
	color: #fe8300;
}

div#rightColumn h2{
	margin-bottom: -14px;
}

div#rightColumn {
	padding-left: 230px;
}

div#typography div#newsHolder{
}

div#typography div.news {
	width: 200px;
	height: 70px;
	margin-bottom: 14px;
	float: left;
}

div#typography span.newsDate{
	color: #fe8300;
	font-weight: bold;
}

div#typography div.news p {
	padding:0px;
}

div#typography div.news h2 {
	margin-top: -14px; 

}

div#typography div.news a {
	text-decoration: underline;
}

/************************************************************
 * ContentFormatting	                                    *
 * - every Line must be 14 Pixels high -> virtualScrollbar  *
 ************************************************************/
div#typography {
    line-height: 14px;
}

div#typography p {
    padding: 14px 0px 0px 0px;
}

div#typography h2 {
    padding: 14px 0px 0px 0px;
}

/**********************
 * FlashPages	  *
 *********************/
div.staffStatement {
    padding: 0px 0px 4px 0px;
}

div.staff {
    display: none;
}

div#staff_1 {
    display: block;
}

div.things {
    display: none;
}

div#things_1 {
    display: block;
}

div.mood {
    display: none;
}

div#mood_1 {
    display: block;
}

div#bigFlash {
    z-index: 1;
}

/******************
 * ImageBoxes	  *
 ******************/
div.imageBox {
    height: 94px;
    width: 94px;
    margin: 0px 5px 5px 0px;
    border: 1px solid #ccc;
    float: left;
    background-color: #fff;
    overflow: hidden;
    padding: 3px;
}

/******************
 * Forms     	  *
 ******************/
form fieldset {
	padding: 5px;
    border: 1px solid #ccc;
    margin: 0px 0px 10px 0px;
}

*+html form fieldset {
    margin-top: -10px ;
	padding-top: 0px;
}

form {
	padding: 0px;
	margin: 0px;
}

form label.left {
    float : left;
    width: 100px;
    margin: 0px 0px 5px 0px;
}



form input.text {
    border: 1px solid #ccc;
    margin: 0px 0px 5px 0px;
    width: 310px;
    clear: both;
	_clear: none;
}

*+html input.text {
	border: 1px solid #ccc;
    margin: 0px 0px 5px 0px;
    width: 310px;
	clear: none;
}

form input.action {
    border: 1px solid #ccc;
    font-weight: bold;
    cursor: pointer;
 }
 
 form input.action:hover {
    color: #fe8300;
 }

 p.message {
     margin-bottom: 10px;
     font-weight: bold;
 }