body {
    font-family: tahoma, helvetica, arial, sans-serif;
    font-size: 10px;
    text-align: center;
    background: #FFF;
    color: #FFFFF;
/*  This sets up the marging for all objects on the screen altogether */
    padding-top: 8px;
    line-height: 2;
}
td, th {
    font-size: 9px;
    text-align: left;
    line-height: 2;
}

/* This control seems to work in conjunction with the '#body' control.
   It seems to wrap the image around the screen horizontally */
#wrapper {
    margin: auto;
    text-align: left;
    width: 813px;
    position: relative;
/*  This sets up the top marging for the main frame ONLY */
    padding-top: 55px;
}

/* Sets up the main frame */
#body {
     background: url(images/mango_body.png) repeat-y;
     width: 813px;
}
#bodyi {
     background: url(images/mango_body_top.png) no-repeat;
     width: 813px;
}
#bodyj {
     background: url(images/mango_body_bottom.png) bottom no-repeat;
     width: 813px;
/*     padding: 1px 0;  */
}

h1, h2, h3, #nav, #nav li {
    margin: 0; padding: 0;
}

#sidebar {
    float: left;
    width: 240px;
    padding-top: 20px;
}
#sidebar .content {
    padding-left: 34px;
}
#sidebar .content img {
    float: left;
    clear: left;
    margin: 5px 5px 5px 0;
}
#sidebar .divider {
    background: url(images/horiz_splitter.PNG) center no-repeat;
    height: 5px;
    width: 240px;
}

#content {
    float: right;
    width: 562px;
    padding-top: 20px;
}
#content .content {
/*  margin: top, left, bottom, right */
    margin: 7px 35px 7px 17px;
}
#content .content table {
    width: 520px;
    margin-right: 0px;
}
#content .content table td,
#content .content table th {
/*    padding-right: 10px; */
    padding-right: 10px;
}
#content .content table td.download {
    text-align: right;
/*    padding-right: 40px; */
    padding-right: 40px;
}
#content .divider {
    background: url(images/horiz_splitter.PNG) repeat-x;
    height: 5px;
}


h1 {
    position: absolute;
    left: 0;
    top: 0px;
}
h2 {
    font-size: 11px;
    color: #cf9118;
    margin: 1em 0;
}
h3 {
    font-size: 10px;
    margin: 1em 0;
}
p {
    margin: 1em 0;
}
img {
    border: 0;
}
img.left  { float: left; margin-right: 14px; }
img.right { float: right; margin-left: 14px; }
.readmore {
    text-align: right;
}
.hidden {
    visibility: hidden;
}
.clear {
    clear: both;
}
a {
    color: #f0b33c;
    font-weight: bold;
    text-decoration: none;
}
a:visited {
    color: #cf9118;
}
a:hover {
    text-decoration: underline;
}
table a {
    text-decoration: underline;
    font-weight: normal;
    color: #7f7c79;
}
#power {color:#fff;text-align:center;}
#power a {color:#fff;}

#tabs {
    font-size: 11px;
    position: absolute;
    right: 0;
    top: 0px;
    line-height: 1.2;
    padding-left: 120px;
/*  This sets up the top marging for the navigation bar ONLY */
    padding-top: 30px;
	}
#tabs ul {
	margin:0;
	padding:10px 10px 0 50px;
	list-style:none;
	}
#tabs li {
	display:inline;
	margin:0;
	padding:0;
	}
#tabs a {
	float:left;
	background:url("images/tableft.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
	}
#tabs a span {
	float:left;
	display:block;
	background:url("images/tabright.gif") no-repeat right top;
	padding:5px 15px 4px 6px;
	color:#666;
	}
#tabs a:hover span {
	color:#cf9118;
	}

#tabs a:hover {
	background-position:0% -42px;
	}

#tabs a:hover span {
	background-position:100% -42px;
	}