body, html
{
	color: #000000;
	background-color: #FFFFFF;
	margin: 0px;
	padding: 0px;
	color: #1F4C6E;
	height: 100%;
}

body, td, th, div, span {
	font: 12px arial, helvetica, verdana, sans-serif; 
}

a {color: #1F4C6E;}
a:hover {color: #D72D64;}

#container {
	border: 0px;
	width: 753px;
	margin: 0 auto;
	position: relative;
	height: 100%;
	margin-left: expression((document.body.clientWidth - 753)/2 + "px");
	margin-right: expression((document.body.clientWidth - 753)/2 + "px");
}

#ongoing #bg {background: transparent url(../images/interface/bg-ongoing.jpg) no-repeat;}
#athos #bg {background: transparent url(../images/interface/bg-athos.jpg) no-repeat;}
#contactme #bg {background: transparent url(../images/interface/bg-contactme.jpg) no-repeat;}

#ongoing-peace #bg {background: transparent url(../images/interface/bg-ongoing-peace.jpg) no-repeat;}
#athos-peace #bg {background: transparent url(../images/interface/bg-athos-peace.jpg) no-repeat;}
#contactme-peace #bg {background: transparent url(../images/interface/bg-contactme-peace.jpg) no-repeat;}

#ongoing #container {
	background: transparent url(../images/interface/bgf-ongoing.jpg) repeat-y;
}

#athos #container {
	background: transparent url(../images/interface/bgf-athos.jpg) repeat-y;
}

#contactme #container {
	background: transparent url(../images/interface/bgf-contactme.jpg) repeat-y;
}

#ongoing-peace #container {
	background: transparent url(../images/interface/bgf-ongoing-peace.jpg) repeat-y;
}

#athos-peace #container {
	background: transparent url(../images/interface/bgf-athos-peace.jpg) repeat-y;
}

#contactme-peace #container {
	background: transparent url(../images/interface/bgf-contactme-peace.jpg) repeat-y;
}

#bg {
	height: 100%;
}

#header {
	height: 310px;
	width: 700px;
}

#title a
{
	display: block;
	width: 280px;
	height: 136px;
	position: absolute;
}

#head-image
{
	display: block;
	margin-left: 384px;
	width: 442px;
	height: 237px;
}

#title span, .navigation span, #siteby span, #getfirefox span, #up1 span, #down1 span, #up2 span, #down2 span
{
	display: none;
}

.linkdate {
	color: #5F8BAA;
}

#siteby a
{
	position: absolute;
	display: block;
	height: 99px;
	width: 22px;
	bottom: 0px;
	right: 0p;
	padding: 5px;
	background: transparent url(../images/interface/siteby.gif) no-repeat;
}

#navigation-main
{
	display: block;
	width: 753px;
	height: 40px;
	position: absolute;
	top: 237px;
}

#navigation-lang
{
	position: absolute;
	top: 237px;
	left: 350px;
}

#navigation-color
{
	position: absolute;
	top: 237px;
	left: 570px;
}

.navigation ul
{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	padding-left: 20px;
}

.navigation li
{
	display: block;
	height: 20px;
	float: left;
}

#maincontent
{
	position: absolute;
	top: 300px;
	display: block;
	width: 480px;
	text-align: justify;
	overflow: hidden;
	height: 340px;
	height:expression(document.body.clientHeight - 300 + "px");
}

#rightcontent
{
	display: block;
	position: absolute;
	left: 510px;
	top: 300px;
	width: 280px;
	overflow: hidden;
	height: 340px;
	height:expression(document.body.clientHeight - 300 + "px");
}

#rcpad {
	padding: 20px;
}

.softtrans
{
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	opacity: 0.8;
	 -khtml-opacity:0.8;
}

.play
{
	padding: 5px 5px 5px 30px;
	margin-right: 20px;
	background: transparent url(../images/interface/sound-icon.gif) no-repeat;
}

.navigation a
{
	display: block;
	height: 40px;
	width: 90px;
}

#nav-peace a
{
	width: 210px;
}


#nav-ongoing a {width: 95px; background: transparent url(../images/menu/ongoing.gif) no-repeat;}
#nav-athos a {width: 85px; background: transparent url(../images/menu/athos.gif) no-repeat;}
#nav-contactme a {width: 100px; background: transparent url(../images/menu/contactme.gif) no-repeat;}
#nav-deutsch a {background: transparent url(../images/menu/deutsch.gif) no-repeat;}
#nav-english a {background: transparent url(../images/menu/english.gif) no-repeat;}
#nav-peace a {background: transparent url(../images/menu/peace.gif) no-repeat;}

#nav-peace a:hover {background: transparent url(../images/menu/peace-hover.gif) no-repeat;}

#nav-ongoing a.down {background: transparent url(../images/menu/ongoing-down.gif) no-repeat;}
#nav-athos a.down {background: transparent url(../images/menu/athos-down.gif) no-repeat;}
#nav-contactme a.down {background: transparent url(../images/menu/contactme-down.gif) no-repeat;}
#nav-deutsch a.down {background: transparent url(../images/menu/deutsch-down.gif) no-repeat;}
#nav-english a.down {background: transparent url(../images/menu/english-down.gif) no-repeat;}
#nav-peace a.down {background: transparent url(../images/menu/peace-down.gif) no-repeat;}

#nav-ongoing a:hover {background: transparent url(../images/menu/ongoing-down.gif) no-repeat;}
#nav-athos a:hover {background: transparent url(../images/menu/athos-down.gif) no-repeat;}
#nav-contactme a:hover {background: transparent url(../images/menu/contactme-down.gif) no-repeat;}
#nav-deutsch a:hover {background: transparent url(../images/menu/deutsch-down.gif) no-repeat;}
#nav-english a:hover {background: transparent url(../images/menu/english-down.gif) no-repeat;}


input {
	font-size: 11px;
}

.smallinput
{
	width: 130px;
	display: block;
	margin: 2px 15px;
	clear: none;
}

.pinput
{
	width: 60px;
	display: block;
	margin: 2px 15px;
	clear: none;
}

.stdinput, .plz, .ort
{
	width: 200px;
	display: block;
	border: 1px solid #CCCCCC;
	background-color: #F9f9F9;
}

.plz {width: 50px;}
.ort {width: 144px;}

.clearer {
	clear: both;
}

.floatingpic {
	float: left;
	margin: 8px;
	margin-left: 0px;
}

.floatingpic-gallery {
	float: left;
	margin: 0px 8px 0px 0px;
}

.floatingpic img, .floatingpic-gallery img {
	border: 1px solid #666666;
}

#playercell {
	position: absolute;
	top: 0px;
	display: block;
	width: 753px;
	height: 30px;
	background: transparent url(/images/interface/bottom-background.jpg);
}

#playercell select {
	font-size: 11px;
	border: 1px solid #CCCCCC;
}

#player {
	position: absolute;
	top: 0px;
	margin-top: -1px;
	left: 170px;
	top: 0px;
}

#playerdings {
	padding: 5px;
	height: 22px;
}

#getfirefox a {
	position: absolute;
	right: 8px;
	top: 8px;
	display: block;
	width: 80px;
	height: 15px;
	background: transparent url(http://www.mozilla.org/products/firefox/buttons/firefox_80x15.png);
}

div#lyr1 { width:400px; padding: 20px;}
div#lyr2 { width:190px; padding: 20px;}
div.content { 
  position:absolute; visibility:hidden; 
  left:0; top:0; z-index:1 
  }  

/* Set small font-size or size/position of div's will be off in some browsers  */
div#scrollbar1,div#scrollbar2 { 
  position:absolute; visibility:visible;
  left:430px; top:0;
  width:30px; height:100%; 
  font-size:1px; z-index:2
  }
div#scrollbar2 { 
  left:200px;
}
  div#track1 {
	display: none;
  z-index:1
  }
div#dragBar1 {
	display: none;
  z-index:1
  }  
div#up1, div#up2 { position:absolute; top:30; z-index:2;}  
div#down1,div#down2 { position:absolute; bottom:0; z-index:3;} 
div#up1 a,div#up2 a {
	display: block;
	height: 30px;
	width: 30px; 
	background: transparent url("/images/interface/up.gif");
}
div#down1 a,div#down2 a {
	display: block;
	height: 30px;
	width: 30px; 
	background: transparent url("/images/interface/down.gif");
}
div#up1 a:hover,div#up2 a:hover {
	background: transparent url("/images/interface/up-over.gif");
}
div#down1 a:hover,div#down2 a:hover {
	background: transparent url("/images/interface/down-over.gif");
}

#lyricscell {
	padding: 20px;
}