@font-face {
	font-family: 'TSTAR';
	src: url('fonts/tstar-medium-webfont.eot');
	src: local('☺'), url('fonts/tstar-medium-webfont.woff') format('woff'), url('fonts/tstar-medium-webfont.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}


html, body { overflow: hidden; padding: 0px; margin:0px;
	font-family: Arial, Helvetica,sans-serif;
	font-size:11px;
	}
body { background: #000000;}
a,a:visited { color:#ddd}
a:hover {color:#fff}


#river { height: 100%; width:100%;
	border: 0px solid #888; padding:0px; border:0px solid #000;margin-bottom:14px }

#real_map {
	position:absolute; bottom:25px; left:33.3%;; width:33.3%; height:33.3%;
	border: 1px solid #eee;z-index:4010;
	opacity : 0.8;filter: alpha(opacity=80);
}

#ol_map {
	position:absolute; bottom:25px; left:33.3%;width:33.3%; height:33.3%;
	border: 1px solid #000;z-index:4011;;
	opacity : 0.8;filter: alpha(opacity=80);
}
.OlControlPanZoom {opacity : 0.8;filter: alpha(opacity=80);}

#track_map {z-index:4012}
#track_map_head {position:absolute;top:-18px;left:-1px;padding-right:-1px;display:none}

#track_map, .window  {
	position:absolute; bottom:14%; left:24%;width:52%; height:72%;
	border: 1px solid #000;z-index:4013;
	opacity : 0.8;filter: alpha(opacity=80);
}
.window_head {
		text-transform:uppercase;z-index:2020;
		background:#333;padding:0px;
		position:absolute;top:-1px;left:-1px;padding-right:-1px;
		width:100%;height:18px;border:1px solid #000;}
.window_title {
	padding:2px 4px 2px 4px;
	font-size:10px;
	font-weight:bold;
	text-transform:uppercase;
	background:#333; color:#fff; float:left;}
.window_close {float:right;border:0px;position:relative;top:-1px;left:1px;width:5px;}
.window_content  {
	padding: 30px 20px 10px 20px;
	overflow:auto;
	background:#222;
	height:85%;
	font-size:13px;}

#about, #credits, #donate {display:none;background:#222;}


#track_list {
	position:absolute; bottom:14%; left:24%;width:52%; height:72%;
	border: 1px solid #000;z-index:4013;background:#222;
	opacity : 0.8;filter: alpha(opacity=80);
	display:none;
  overflow-y: scroll;
  overflow-x: hidden;
}

#track_list_data, .window_content {font-size:14px;font-family: Georgia;
	color:#d0d0d0;padding-top:20px}
#track_list_data a, #track_list_data a:visited { color:#eee}
#track_list_data a:hover {color:#fff;}
#track_list_data table {text-align:left;margin-top:20px}
#track_list_data .rivername {padding-right:10px}
#track_list_data .trackname {padding-right:10px}
#track_list_data .trackyear {padding-right:10px;}
#track_list_data .tracklength{text-align:right;padding-right:10px;}
#track_list_data p {margin-top:20px;font-size:11px;font-style:italic}
.window_content  {padding: 30px 20px 10px 20px;overflow:auto;background:#222;height:85%;font-size:13px;}

#content {
	font-size:14px;
	font-family: Georgia;
	overflow:auto;
	color:#c0c0c0;padding-top:10px;
	position:absolute; bottom:15%; left:5%;width:90%; height:70%;
	}
#content p {max-width: 640px; margin-bottom:10px; line-height: 1.4em}
#content ul, #credits_content ul {list-style-type:none;padding:0px;padding-left:15px}

#headinfo, #footer {
	z-index:2005;color:#aaa;
	font-size:10px;
	padding: 1px 8px 1px 8px}


#headinfo {
	position: absolute;left:0px;top:0px;
	height:16px; width:100%;
	border-bottom: 1px solid #666;
	background-color:#000;
	padding-top:4px;padding-bottom:0px;
}
#side_right {position:absolute;top:0px;right:10px;z-index:6000;padding-top:4px;padding-bottom:0px;}
#side_right a {margin-left:15px;color:#a0a0a0;}
#side_right a:hover {color:#000000;}

#footer {
	position: absolute;left:0px;bottom:0px;
	height:16px; width:100%;
	border-top:  1px solid #666;
	background-color:#000;
	padding-top:4px;
}
#footer a{color:#bbb;text-decoration:underline}
#footer a:hover{color:#ffffff;text-decoration:underline}

#footer.footer_overlay {
	background:none;
	font-size:9px;
	color:#888;}
#footer.footer_overlay a {color:#888;padding-left:2px;padding-right:2px}
#footer.footer_overlay a:hover{background:#888;color:#fff}

#share {z-index:2010;position:absolute;
	bottom:-1px;right:2px;
	color:#ddd;font-size:8px;
	background:#000;padding:0px;
	opacity : 0.5;filter: alpha(opacity=50);
	}
.flattrlnk {margin-right:2px}

#flattr {
	z-index:2015;position:absolute;
	right:150px;bottom:-1px}

#titlefield {
	position:absolute;top:25px;left:5px;z-index:2000;
	background:#333;color:#eeeeee;
	font-size:20px;font-weight:bold;
	font-family: Georgia;
	opacity : 0.8;filter: alpha(opacity=80);
	padding:3px;
}

#info { position:absolute;top:60px;left:5px;
	padding-top:6px;line-height:14px;
	font-size:10px;
	z-index:2000;background:#333;
	opacity : 0.8;filter: alpha(opacity=80);
}
#show_track {float:left;margin: 5px 10px 2px 0px;z-index:2003;}

#controls {position:absolute;right:10px;top:25px;z-index:2003;
	opacity : 0.8;filter: alpha(opacity=80);
	border:0px solid #666;background:#333;
	color:#eee;padding:1px 5px 1px 5px;text-align:right;
	}
#controls:hover {border:0px solid #c0c0c0;}

.play{background:url(/static/img/paused.png) no-repeat;}
.paused{background:url(/static/img/play.png) no-repeat;}
.rewind{background:url(/static/img/rewind.png) no-repeat;}
.plus{background:url(/static/img/plus.png) no-repeat;}
.minus{background:url(/static/img/minus.png) no-repeat;}
.forward {margin-right:25px;background:url(/static/img/forward.png) no-repeat;}

#forward {margin-right:25px;}
#slower{margin-right:25px}


.img_button {display:inline;float:left;width:18px;height:18px;margin:2px;border:0px solid #444;}
.img_button_label {display:inline;float:left;height:18px;font-size:10px;padding: 4px 2px 2px 2px;}
.img_button:hover {border:0px solid #ccc;cursor:pointer}

#log_left, #log_right, #log_center, #date_left, #date_right
  {font-size:9px;background:#333;}
#log_left { position:absolute;bottom:25px;left:5px;z-index:2001}
#log_right { position:absolute;bottom:25px;right:5px;z-index:2001;}
#log_center { position:absolute;bottom:25px;left:46%;width:8%;z-index:2012;text-align:center;padding:3px 5px 3px 5px;z-index:4013}
#date_right { position:absolute;bottom:46px;right:5px;z-index:2001;}
#date_left { position:absolute;bottom:46px;left:5px;z-index:2001;}
#debug { display:none;position:absolute;bottom:110px;right:5px;z-index:2000;overflow:scroll;width:300px;height:100px}
#map_button {position:absolute; bottom:25px; left:33.3%;z-index:5003;opacity : 0.8;filter: alpha(opacity=80);}



#status_msg {font-size:10px;position:absolute;bottom:2px;left:45%;text-align:center;width:10%;color:#c0c0c0;z-index:6000;}


.toplink a {padding:0px 2px 0px 2px}
.toplink a:hover {background:#c0c0c0;color:#000000;text-decoration:none}

#msg {position:absolute;top:30%;width:100%;text-align:center;z-index:2000;font-size:34px;
opacity: 0.8;filter: alpha(opacity=80);	}
#msg span {color:#eeeeee;background:#111;padding:0px 10px 0px 10px;font-size:46px;opacity: 0.8;filter: alpha(opacity=80);}
#msg a {color:#fff;background:#111;padding:0px 10px 0px 10px;font-size:32px;margin:3px;opacity: 0.8;filter: alpha(opacity=80);}


.overlay {background:#333;color:#eeeeee;
	padding:3px;
	opacity: 0.8;filter: alpha(opacity=80);}
.button {
	background:#333;color:#eeeeee;
	padding:3px 6px 3px 6px;
	text-transform:uppercase;
	border:1px solid #000;
	height:12px;
	line-height:12px;
	font-size:10px;
	font-weight:bold;
}
.button:hover {background:white;color:#111;border:1px solid #000;cursor:pointer}

a.link, a.extern, a.lnk, #show_all {
	padding: 1px 10px 1px 20px;
	background: url(/media/img/arr.gif) left no-repeat;
}
a.link:hover, a.lnk, a.extern:hover {}

.olControlMousePosition {color:#eee;margin-bottom:46px;z-index:2004;right:25%;bottom:50px;background:#333;}
.olControlAttribution {padding-left:5px;opacity: 0.6;filter: alpha(opacity=60);background:#666;}
.olControlAttribution a, .olControlAttribution a:visited {color:#d0d0d0;}
.olControlAttribution a:hover {color:#ffffff;}
.olPopupContent h2 {}

.smaller {font-size:10px}
input.submit {border:1px solid #fff;padding:1px 5px 1px 5px;cursor:pointer}