

html { /* needed for firefox. This stretches the table to the full 100% of the browser */
	height: 100%;
}

body {
	height: 100%; /* use the full view of the browser */
	width: 100%; /* use the full view of the browser */
	padding: 0px;
	margin: 0px;
	background-color: black;
	font-family: verdana, sans-serif;
	font-size: 0.75em;
	line-height: 142%; /*IE sees this as 140%, firefox as 142%. Gives approx the same size.*/
	color: white; /* text color */
}

table.body_positioner { /* position content horizontal center */
	position: relative;
	width: 980px; /* the main width for the page */
	height: 100%; /* to let the td know what space he has to vertical align himself */
	margin-left: auto;
	margin-right: auto; 
}

td.body_container { /* position content vertical center */
	vertical-align: middle;
}

div.logo { /* needed for resizing the browser. Keeps the logo relative to the other elements */
	position: relative;
}

div.main_title {
	margin-top: 20px;
	height: 40px; /* Make all titles the same height. Eg. "g" is bigger than "a" if height is not expressed */
}

div.square_container {
	position: relative;
	float: right;
	margin-top: 20px;
	padding-left: 10px;
	display: inline; /* needed for IE(6) so it pushes the text in the main text area to the left instead of shitfting the main text area down (because it doesn't fit?) */
	clear: both; /* needed for IE(6). I think because the scroll_side also uses a float */
	z-index: 1; /* fixes the not clickable link when the alternate content is shown in the flash area */
}

div.main_text_area {
	position: relative;
	height: 363px; /* needed for the scroll area so that it knows its maximum horizontal size */
	margin-top: 5px;
}

table.scroll_side { /* is a table so older browsers can align the bottom button to the bottom */
	position: relative;
	float: right;
	height: 100%; /* need for stretching table so vertical to bottom is possible */
	border-width: 0px;
	border-spacing: 0px;
	padding-left: 5px;
}

div.scroll_viewport {
	position: relative;
	height: 100%;
	overflow: hidden;
}

div.scroll_container {
	position: relative;
	overflow: hidden; /*need overflow: hidden here for firefox fix to get height of this element in javascript*/
}

img.scroll_button {
	display: block;
	cursor: pointer;
}

div.copyright_text {
	clear: both;
	padding-top: 10px;
	height: 1.4em;
	text-align: center;
	font-size: 0.75em;
	line-height: 1.4em;;
	color: rgb(60, 60, 60);
}

a {
	color: rgb(255, 255, 255);
}

a.adminLink {
	color: rgb(60, 60, 60);
}
