html, body {
    height: 100%;	/* necessary for orange bar to fill 100% */
}
body {
	margin: 0px 0px 0px 0px;	/* for some reason padding and margin need to be set explicitly to 0px; */
	padding: 0px 0px 0px 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-image: url(../images/Main/Faux_column.gif); /* the only way to get a truly 100% column in IE6, yuck */
/*	background: repeat-y;*/	/* this somehow blocks the column from repeating at all (in IE6 of course) */
	}
a {
	text-decoration: none;
	color: #000;
	outline: none;
	}
a:visited {
	}
a:hover {
	color: #ff6600;
	text-decoration: underline;
	}
a:active {
	color: #ff6600;
	}
strong, b {
	font-weight: bold;
	}
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: 18px;	/* slightly more spaced for legibility */
	font-weight: normal;
}
ul {
	margin: 0px;
	padding-left: 18px;
	list-style-image: url(../images/Main/bullet.gif);
}
.orange {
	margin: 0px;
	padding-left: 18px;
	list-style-image: url(../images/Main/bullet_orange.gif);
}
.tip {
	font:10px/12px
	Arial,Helvetica,sans-serif; 
	border:solid 1px #666666; 
	width:270px; 
	padding:1px;
	position:absolute; 
	z-index:100;
	visibility:hidden; 
	color:#333333; 
	top:20px;
	left:90px; 
	background-color:#ffffcc;
}
.hoepla {
	color: #FFFFFF; /*white*/
	font-size: 5px;
	cursor: default;
	}
.subtitle {
	font-weight: bold;
}
.condensed {
	line-height: normal;	/* to be used in orange bar */
}
.content_title {
	font-size: 16px;
	font-weight: bold;
}
.index {
	font-size: 11px;
	display: block;
	width: 130px;
	background-image: url(../images/Main/index_dots.gif);
	background-position: top left;
	background-repeat: no-repeat;
	margin-left: 12px;
	padding-top: 7px;
	padding-bottom: 7px;
	text-decoration: none;
}
.index:hover {
	text-decoration: none;
}
.sub_index {
	font-size: 10px;
	width: 110px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 5px;
}
.last_index_item {	/* could be used to end index with dotted line */
	background-image: url(../images/Main/index_dots_under_and_over.gif);
	background-position: top left;
	background-repeat: no-repeat;	
}
.navigation {
	font-weight: bold;
	height: 29px;
	display: block;
	float:left;
	background-image: url(../images/Main/nav_dots.png);
	background-position: right top;
	background-repeat: no-repeat;
	padding-top: 6px;
	padding-right: 8px;
	padding-left: 8px;
	text-decoration: none;
}
.navigation:hover {
	text-decoration: none;
}
.crosslink_normal {
	color: #FF6600; /*orange*/
}
.hot_topic {
	color: #FFFFFF; /*white*/
}
.crosslink_hot_topic {
	color: #000000; /*black*/
}
.crosslink_hot_topic:hover {
	color: #000000; /*black*/
	text-decoration: underline;
}
.crosslink_hot_topic:visited {
	color: #000000;
}
.hot_topic_title {
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF; /*white*/
}
.image_link {
	color: #ffffff; /*white*/
	text-decoration: none;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #FFFFFF;
	border-left-color: #FFFFFF;/*	border-style: solid;*/	/*show a line on hover over clickable images */
}
.image_link:hover {
	border-style: solid;	/*show a line on hover over clickable images */
	text-decoration: underline;
	border-color: #FF6600;	/*orange*/
}
.active:hover {
	text-decoration: none;
	}
.active {
	text-decoration: none;
	color: #FF6600;	/*orange*/
}
.index active:hover {
	text-decoration: none;
	}
.unavailable {
	color: #999999;	/*gray*/
	cursor: default;	/*no text cursor, but arrow*/
}	
#container {	/* container will have height of #content OR of body, whichever is the tallest */
	position: relative;
	height:auto !important;   /* for real browsers */
	height:100%; 			/* IE6: treats this as min-height*/
	min-height:100%; 		/* for real browsers */
	}						
#header {
	height: 5px;
	width: 1009px;
	background-image: url(../images/Main/header.png);
	background-repeat: no-repeat;	/*necessary for IE6*/
	}
#banner {
	height: 176px;
	width: 721px;
	background-image: url(../images/Main/banner.gif);
	background-repeat: no-repeat;	/*necessary for IE6*/
	}	
#nav_buttons {
/*	position: relative;	*/ /*Using normal flow and a left margin makes IE6 add 3px on top*/
	margin-left: 160px;	/* but using position: relative makes this div and #right not appear at first rendering (!?)*/ 
	margin-top: -3px;	/* so we're back at normal flow with a negative margin, just for IE6: yuck! */
	height: 29px;
	}	
#content {	/* #content height will follow #column_right (NOT #column_left) or #column_wide */
	width: 984px;
/*	background: #CCCCCC;*/	/* for testing purposes */
	}
#left {
	position: absolute;
	top: 181px;
	left: 0px;
	width: 150px;
	height: 400px;
	}
#middle {	/*it's important that this is in normal flow, so #content height will follow #middle's height*/
	width: 560px;
	padding-bottom: 89px;	/*to prevent bottom_image from blovking text*/
	margin-left: 160px;	/*equals width #left*/
	margin-right: 263px;	/*equals width #right*/
	background-image: url(../images/Main/title_dots.gif);
	background-repeat: no-repeat;
	}
#title {
	padding-top: 10px;
	left: 0px;
	width: 560px;
	}
#column_left {
	width: 260px;
	float: left;
	padding-top: 30px;
	}
#column_right {
	width: 260px;
	margin-left: 280px;
	padding-top: 30px;
	}
#column_wide {	/*with tables in #column_wide this may actually replace #Column_left and #column_right*/
	width: 540px;
	padding-top: 30px;
	}
#right {
	position: absolute;
	top: 0px;
	left: 721px;
	width: 263px;
	background: #ff6600;
	height:auto !important;   /* for real browsers */
	height:100%; 			/* IE6: treats this as min-height*/
	min-height:100%; 		/* for real browsers */
	}
#hot_topic_1 {	/*in orange bar*/
	width: 243px;
	padding: 10px;
	}	
#hot_topic_2 {
	width: 243px;
	padding: 10px;
	}
#hot_topic_3 {
	width: 243px;
	padding: 10px;
	}	
#orange_bar_texts {
	width: 243px;
	padding: 10px;
	}
#hot_topic_spacer_1 {
	height: 1px;
	width: 263px;
	background-image: url(../images/Main/hot_topic_spacer.png);
	background-repeat: no-repeat;	
	}
#hot_topic_spacer_2 {
	height: 1px;
	width: 263px;
	background-image: url(../images/Main/hot_topic_spacer.png);
	background-repeat: no-repeat;	
	}	
#adres {
	position: absolute;	/* will sit on bottom of #container */
	bottom: 0px;
	height: 89px;
	width: 95px;
	background-repeat: no-repeat;	
	margin-left: 12px;
}
#bottom_image {
	position: absolute;	/* will sit on bottom of #container */
	bottom: 0px;
	left: 161px;
	height: 89px;
	width: 560px;
	}
#extender_right {
	position:absolute;
	left:985px;
	top:0px;
	height:182px;
	z-index:1;
	background-image: url(../images/Main/extender.png);
	width: 24px;
}
#footer { /*no longer used */
	position: fixed; /* not supported by IE6 */
	bottom: 0;
	left: 0px;
	border: 0px;
	height: 6px;
	width: 1009px;
	background-image: url(../images/Main/footer.png);
	background-repeat: no-repeat;	
	z-index:0;
}