@charset "UTF-8";
html,
body {
	font: 100% 'Arial Black', Arial, Veranda, Helvetica, sans-serif;
	background: #222222 url(media/gray_bg.gif) top center repeat-y;
	color: #999999;
	margin: 0;
	padding: 0;
	font-size:16px;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned later */
}
img,
a img {
	border:none;
}
#pg {
	position:relative;/* so we can use absolute positioning on sub-elements if desired, plus enables z-index */
	width: 950px;
	background: #666666;
	color:#333333;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#hdr {
	position:relative;
	display:block;
	width:950px;
	height:180px;
}
#hdr h1 {
	display:block;
	height:180px;
	width:520px;
	clear:none;
	font-size:48px;
	line-height:1.2em;
	margin:0;
	padding:0;
}
#hdr h1 img {
	margin-right:10px;
}
#hdr h1 a {
	text-decoration:none;
	color:#333333;
}
ul#hdr-nav {
	position:absolute;
	display:block;
	right:30px;
	top:26px;
	width:450px;
	clear:right;
	font-size:22px;
	line-height:100%;
	margin:0;
	padding:0;
	text-align:right;
}
ul#hdr-nav,
ul#hdr-nav li {
	list-style:none;
	list-style-type:none;
}
ul#hdr-nav li {
	display:inline;
	margin:0;
	padding:0 20px 0 0;
}
ul#hdr-nav a {
	text-decoration:none;
	color:#999999;
}
ul#hdr-nav a:hover {
	color:yellow;
}
ul#hdr-nav a:active {
	color:#333333;
}
#hdr {
	display:block;
	width:100%;
	height:180px;
}
#content {
	display:block;
	width:890px;
	margin:30px auto;
	clear:both;
}
#content a {
	color:#999;
	text-decoration:none;
	border-bottom:1px solid #525252;
}
#content a:hover {
	color:#FF0;
}
#content h2 {
	font-size:24px;
	line-height:100%;
	margin:3px 0 10px 40px;
	padding:0;
}
#content h2 .small {
	font-size:11px;
	font-style:italic;
}
#home-black-float-box,
#home-yellow-float-box {
	position:relative;
	display:block;
	width:401px;
	height:415px;
	float:left;
}
#home-black-float-box {
	background:url(media/dark_border.gif) bottom left no-repeat;
	margin-left:50px;
}
#home-yellow-float-box {
	background:url(media/yellow_border.gif) bottom left no-repeat;
	margin-left:24px;
	margin-top:68px;
	clear:right;
}
#home-black-float-box ul,
#home-black-float-box p,
#home-yellow-float-box h2,
#home-yellow-float-box h3 {
	color:yellow;
}
#home-black-float-box ul,
#home-yellow-float-box ul,
#home-black-float-box li,
#home-yellow-float-box li {
	list-style:none;
	list-style-type:none;
	margin:0;
	padding:0;
	line-height:150%;
	font-weight:bold;
}
#home-black-float-box p,
#home-yellow-float-box p {
	padding:14px 20px 0 40px;
	margin:0;
}
#home-black-float-box ul,
#home-yellow-float-box ul {
	margin:24px 20px 40px 40px;
}
#home-black-float-box a.buy,
#home-yellow-float-box a.buy {
	position:absolute;
	display:block;
	width:147px;
	height:72px;
	right:39px;
	bottom:39px;
}
#home-black-float-box a.tour,
#home-yellow-float-box a.tour {
	position:absolute;
	display:block;
	width:147px;
	height:72px;
	left:39px;
	bottom:39px;
}
/* sub-page */
#sub-black-float-box {
	position:relative;
	display:block;
	width:637px;
	height:990px;
	float:left;
}
#sub-black-float-box {
	background:url(media/bg-sub-page-rect-gray.gif) bottom left no-repeat;
	margin-left:50px;
}
#content #sub-black-float-box h2 {
	text-align:left;
	color:#FF0;
}
#sub-black-float-box a.buy {
	position:absolute;
	display:block;
	width:147px;
	height:72px;
	right:239px;
	bottom:78px;
}
#sub-black-float-box img {
	margin:0;
	padding:0;
}
#sub-black-float-box img#screenshot {
	margin:25px 0 0 0;
}
#sub-page-text {
	display:block;
	float:right;
	clear:right;
	width:190px;
	margin-top:39px;
}
#sub-page-text h3 {
	text-align:center;
	color:#FF0;
}
ul#features {
	margin:0;
}
ul#features li {
	margin:20px 0;
	padding:0;
}
/* sub-page 2 (online player) */
#sub-ylw-float-box {
	position:relative;
	display:block;
	width:560px;
	height:680px;
	float:left;
}
#sub-ylw-float-box {
	background:url(media/bg-sub-page-rect-yellow.gif) bottom left no-repeat;
	margin-left:50px;
}
#content #sub-ylw-float-box h2 {
	text-align:left;
}
iframe#online-demo-player {
	position:absolute;
	top:70px;
	left:41px;
}
#sub-ylw-float-box a.buy {
	position:absolute;
	display:block;
	width:147px;
	height:72px;
	right:208px;
	bottom:80px;
}
#sub-ylw-float-box img {
	margin:0;
	padding:0;
}
#sub-page-text.ylw {
	width:265px;
}



/* footer */
#ftr {
	display:block;
	width:100%;
	clear:both;
	color:#999999;
	font-size:9pt;
	text-align:center;
}
#ftr p {
	padding:30px 30px 0 30px;
	margin-bottom:10px;
}
#ftr a {
	color:#999999;
}
#ftr a:hover {
	color:#333333;;
}