﻿html, body, #all 
{
	min-height: 100%;
	width: 100%;
	height: 100%; /* old IE hack */
	margin: 0;
	padding: 0;
}
html>body, html>body #all 
{
	height: auto; /* undo IE hack on other browsers */
}
body
{
	font: 14px  Verdana, Arial, Helvetica, sans-serif;
	background: #ffffff;
	margin: 0;

    background-image:url(../ui/left.png);
    background-position:left top;
    background-repeat:repeat-y;
}
h1, h2, h3, h4
{
	font-weight: normal;
	letter-spacing:-.06em;
	margin: 0;
}
h1
{
	font-size:32px;
	color:#888888;
	margin-bottom: 15px;
}
h2
{
	font-size: 24px;
	margin-top: 15px;
	margin-bottom: 10px;
}
h3
{
	font-size: 18px;
	margin-bottom: 10px;
}
h4
{
	font-size: 16px;
	margin-bottom: 10px;
}
p
{
	margin: 5px 0 15px 15px;
}
ul
{
	margin-top: 5px;
	margin-bottom: 15px;
}
ul li
{
	padding-left: 0px;
	margin-top: 5px;
}
ol
{
	margin-top: 5px;
	margin-bottom: 15px;
}
ol li
{
	margin-left: 0px;
}
dl dt
{
	font-weight: bold;
	margin-bottom:5px;
}
dl dd
{
	margin-bottom:10px;
}
/* ----- MAIN LAYOUT PARTS ----- */

#all
{
	position: absolute;
	top: 0;
	left: 0;
}

#main
{
	margin-left: 75px;
	margin-bottom: 30px;
	height: auto;
	padding: .5em;
	width: 900px;
}

#main_header
{
	margin: 0 auto;
	margin-top: 10px;
}

#main_body
{
	clear: both;
	margin: 0 auto;
	padding: 25px;
	height: auto;
}

#footer
{
	position: absolute;
	bottom: 0;
	width: 100%;
	text-align: center;
	font-size: smaller;
	color: #bbbbbb;
	margin-bottom:10px;
}

#silverlight_install
{
	margin:50px;
}

/* ----- MAIN MENU ----- */

#main_menu
{
	font: 12px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
}

#main_menu a
{
	text-decoration: none;
	
	padding: 5px 10px;
	height: 15px;
	display: block;
	
	color: #FFFFFF;
	background: transparent url(../ui/menu.png) no-repeat;
	background-position: -10px 0px;
}
#main_menu a:hover, #main_menu a.current:hover
{
	color: #000000;
	background: transparent url(../ui/menu.png) no-repeat;
	background-position: -10px -50px;
}
#main_menu a.current
{
	color: #000000;
	background: transparent url(../ui/menu.png) no-repeat;
	background-position: -10px -25px;
}

#main_menu ul
{
}

#main_menu ul li
{
	display:block;
	float:left;
	list-style-type:none;

	height: 25px;
}

#main_menu ul li.menu_left
{
	width:10px;
	background: transparent url(../ui/menu.png) no-repeat top left;
}

#main_menu ul li.menu_right
{
	width:10px;
	background: transparent url(../ui/menu.png) no-repeat top right;
}

/* ----- INFO BOX ----- */

.infobox
{
	position: relative;
	margin: 0px auto;
	min-width: 8em;
	max-width: 380px; /* based on image dimensions - not quite consistent with drip styles yet */
	z-index: 1;
	margin-left: 10px; /* default, width of left corner */
	margin-bottom: 0.5em; /* spacing under infobox */
}

.infobox .content, .infobox .t, .infobox .b, .infobox .b div
{
	background: transparent url(../ui/infobox.png) no-repeat top right;
	_background-image: url(infobox2-blue.gif);
}

.infobox .content
{
	position: relative;
	zoom: 1;
	_overflow-y: hidden;
	padding: 10px 10px 1px 0px;
}

.infobox .t
{
	/* top+left vertical slice */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 10px; /* top slice width */
	margin-left: -10px;
	height: 100%;
	_height: 1600px; /* arbitrary long height, IE 6 */
	background-position: top left;
}

.infobox .b
{
	/* bottom */
	position: relative;
	width: 100%;
}

.infobox .b, .infobox .b div
{
	height: 10px; /* height of bottom cap/shade */
	font-size: 1px;
}

.infobox .b
{
	background-position: bottom right;
}

.infobox .b div
{
	position: relative;
	width: 10px; /* bottom corner width */
	margin-left: -10px;
	background-position: bottom left;
}

.infobox .hd, .infobox .bd, .infobox .ft
{
	position: relative;
}

.infobox .wrapper
{
	/* extra content protector - preventing vertical overflow (past background) */
	position: static;
	max-height: 1000px;
	overflow: auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */
}

.infobox h1, .infobox p
{
	margin: 0px; /* margins will blow out backgrounds, leaving whitespace. */
	padding: 0.5em 0px 0.5em 0px;
}

.infobox h1
{
	padding-bottom: 0px;
}

/* ----- TRY IT NOW BUTTON ----- */

a.trybutton {
	display: block;
	background-color: transparent;
	background-image: url(../ui/tryit.png);
	background-repeat: no-repeat;
	width: 195px;
	height: 50px;
	line-height: 50px;
	
	color: White;
	font-family: Tahoma, Verdana, Arial, Helvetica, Sans-Serif;
	font-size:24px;
	text-decoration: none;
	text-align: center;
}
a.trybutton:hover {
	color: Black;
	background-position: 0 -50px;
}
a.trybutton:active {
	color: Black;
	background-position: 0 -100px;
	padding-left: 3px;
	line-height: 56px;
}

/* ----- SIGN UP BUTTON ----- */

a.signupbutton {
	display: block;
	background-color: transparent;
	background-image: url(../ui/signup.png);
	background-repeat: no-repeat;
	width: 195px;
	height: 50px;
	line-height: 50px;
	
	color: White;
	font-family: Tahoma, Verdana, Arial, Helvetica, Sans-Serif;
	font-size:13px;
	text-decoration: none;
	text-align: center;
}
a.signupbutton:hover 
{
	color: Black;
	background-position: 0 -50px;
}
a.signupbutton:active {
	color: Black;
	background-position: 0 -100px;
	padding-left: 3px;
	line-height: 56px;
}

/* ----- FEATURE BUTTON ----- */

a.featurebutton {
	display: inline-block;
	background-color: transparent;
	background-image: url(../ui/feature.png);
	background-repeat: no-repeat;
	width: 32px;
	height: 32px;
	line-height: 32px;
	
	color: White;
	font-family: Tahoma, Verdana, Arial, Helvetica, Sans-Serif;
	font-size:14px;
	text-decoration: none;
	text-align: center;
}
a.featurebutton:hover 
{
	color: Black;
	background-position: 0 -32px;
}

/* ----- NICE TABLE ----- */

.niceTable
{
	border-bottom: solid 2px #888888;
}

.niceTable th
{
	font-size:12px;
	color: #D00000;
	border-bottom: solid 2px #888888;
	padding: 5px;
}

.niceTable td
{
	font-size:12px;
	vertical-align: top;
	padding: 5px;
}

.niceTable td th
{
	padding: 0;
	border: 0;
}

.niceTable td td
{
	padding: 0;
}

.niceTable td.subhead
{
	color: #888888;
	font-weight:bold;
}

.niceTable tr.odd
{
	background-color: #fff7f7;
}

.niceTable tr.even
{
	background-color: #ffffff;
}

/* ----- CLIPPED IMAGE VIEWER ----- */

div.viewport
{
	overflow: hidden;
	position: relative;
}
img.clipped
{
	display: block;
	position: absolute;
}