/****************************************
 *	Site-wide base StyleSheet
 *	18 Jun 2007
 *	Safari + Firefox (Mac)
 *	NetSurf (RISCOS)
 ***************************************/

/* --- Overall page styling ------------------------------------------------- */

html, body { padding: 0; margin: 0; }

body {
	background:			#fff url(../img/bgnd2.gif) repeat;
	text-align:			left;
	font-family:		Arial, sans-serif;
	font-size:			100.01%;
	color:				#555;
}

#wrapper {
	min-width:			770px;
}

#content {
	font:				12px Verdana, Arial, sans-serif;
	margin:				20px 40px 20px 40px;
}

.section {
	clear:				both;
	border-top:			3px solid #f94;
	margin:				16px 0;
}
.subsection {
	clear:				both;
	border-top:			2px dashed #f94;
	margin:				16px 0;
}

/* --- Headings ------------------------------------------------------------- */

h1, h2, h3, h4 {
	color:				#d84;
	font-family:		Arial, sans-serif;
	font-weight:		bold;
}
h1 { font-size: 28px; }
h2 { font-size: 22px; }
h3 { font-size: 18px; }
h4 { font-size: 14px; margin-bottom: 6px; }
h4 + p { margin-top: 6px; }
h4 + table { margin-top: 12px; }

/* --- Links ---------------------------------------------------------------- */

a {
	color:				#95c;
	text-decoration:	none;
}
a:visited {
	color:				#95c;
}
a:hover {
	color:				#d50;
}
.afake {
	color:				#95c;
}

.upto {
	margin:				20px 0 0 -24px;
	font-family:		Arial, sans-serif;
	font-size:			11px;
}
.upto a:link, .upto a:visited {
	padding-left:		24px;
	background:			url("../img/up.png") left top no-repeat;
	text-decoration:	none;
}
.upto a:hover, .upto a:active {
	background-position:	0 -20px;
}

.ringtag {
	float:				right;
	width:				128px;
	height:				42px;
}
.item > .ringtag {
	margin-top:			8px;
}
.ringtag a:link, .ringtag a:visited {
	display:			block;
	padding:			12px 0 14px 18px;
	background:			url("../img/ringtagc.png") right top no-repeat;
}
.ringtag a:hover, .ringtag a:active {
	background-position:	right -53px;
}

/* --- Highlights ----------------------------------------------------------- */

.note {
	font-weight:		bold;
	color:				#d55;
}
.notabene {
	font-size:			1.5em;
	color:				#d55;
}
.copyright {
	color:				#777;
	font-size:			13px;
	font-style:			italic;
}
tt.hex {
	color:				#a40;
}
.highlight {
	color:				#35b;
}
.comment {
	color:				#779;
	font-style:			italic;
}
.red	{ color: #d30; }
.blue	{ color: #00e; }
.green	{ color: #090; }
.orange	{ color: #d70; }

/* --- Page header ---------------------------------------------------------- */

#header {
	border-bottom:		2px solid #f74;
}
#head img {
	margin:				0;
	padding:			14px 0 0 6px;
}
#head .areatitle {
	float:				right;
	margin:				36px 20px 0 0;
	color:				#e63;
	font-size:			32px;
	font-style:			italic;
	font-weight:		bold;
}

/* --- Navigation bars ------------------------------------------------------ */

.navbar {
	margin:				0;
	border-top:			2px solid #f74;
	padding:			4px 20px;
	background-color:	#ffc;
	font-size:			12px;
}
.navbar2 {
	margin:				0;
	border-top:			2px solid #f74;
	padding:			4px 20px;
	background-color:	#ffc;
	font-size:			11px;
}
.navbar ul, .navbar2 ul {
	padding:			0;
	margin:				0;
	list-style:			none;
}
#areanav, #sectnav {
	text-align:			left;
}
#areanav li, #sectnav li {
	display:			inline;
	margin:				0 10px 0 0;
}
#miscnav {
	text-align:			right;
}
#miscnav .pageupdated {
	float:				left;
	color:				#888;
	font-size:			11px;
	font-style:			italic;
}
#miscnav li {
	display:			inline;
	margin:				0 0 0 10px;
}
.thispage {
	color:				#c48;
}

/* --- Page footer ---------------------------------------------------------- */

.credit {
	padding:			6px 20px;
	text-align:			center;
	font-size:			12px;
	color:				#888;
	font-style:			italic;
}
#footer {
	clear:				both;
}
#foot {
	height:				40px;
	border-top:			2px solid #f74;
	border-bottom:		2px solid #f74;
	background-color:	#fea;
	padding:			0 20px;
}
.validator {
	float:				left;
	margin:				8px 8px 4px 0;
}
#footer p.copyright {
	margin:				0;
	padding:			12px 0;
	text-align:			right;
}

/* --- Page menu (contents) (list + table) ---------------------------------- */

ul.pagecontents, ol.pagecontents {
	font-size:			15px;
	color:				#e73;
}
ul.pagecontents ul {
	font-size:			14px;
}
ul.pagecontents ul ul {
	font-size:			13px;
}

/* cs.html only */
.subcontents {
	border-collapse:	collapse;
	margin:				6px 0 10px 50px;
}
.subcontents td {
	width:				140px;
	padding:			2px 0;
	font-size:			13px;
	text-align:			left;
}

/* --- Lists (/midi/help/qanda.html, /riscos/midi/sw.html, ESP SWI docs) ---- */

dl dl {
	margin:				0;
}
dt {
	font-weight:		bold;
	margin:				8px 0 4px 0;
}
dd p {
	margin:				6px 0 0 0;
}

/* --- Miscellaneous layout ------------------------------------------------- */

.indent {
	margin-left:		50px;
}

.firstitem {
	clear:				both;
	margin:				16px 0;
	padding-left:		50px;
}
.item {
	clear:				both;
	border-top:			2px dashed #f94;
	margin:				16px 0;
	padding-left:		50px;
}
.item > h3 {
	margin-left:		-50px;
}

.hangout {
	float:				left;
	margin-left:		-50px;
	width:				48px;
}
.firstitem h2.hangout {
	margin-top:			0;
}

.rightpane {
	float:				right;
	margin:				0 0 4px 20px;
}

.rightbox {
	float:				right;
	margin:				0 0 10px 20px;
	padding:			8px;
	border:				1px dashed #f94;
	text-align:			center;
	background-color:	#ffc;
}

/* --- Generic Tables ------------------------------------------------------- */

.unframed {
	border-collapse:	collapse;
	margin-left:		50px;
}
.unframed tr {
	vertical-align:		top;
}
.unframed th {
	padding-right:		30px;
	text-align:			left;
}
.unframed td.subhead {
	color:				#46c;
	font-size:			1.1em;
}
.unframed td {
	padding-right:		30px;
	text-align:			left;
}

.framed, .cframed {
	border-collapse:	collapse;
	border:				1px solid #888;
	width:				90%;
	margin:				0px auto;
	background-color:	#fff;
}
.framed th, .cframed th {
	padding:			4px;
	font-family:		Arial, sans-serif;
	font-size:			14px;
	text-align:			center;
	background-color:	#ddd;
}
.framed td.subhead {
	font-family:		Arial, sans-serif;
	font-size:			13px;
	color:				#46c;
	background-color:	#ffd;
}
.framed td.sidehead, .cframed td.sidehead {
	font-family:		Arial, sans-serif;
	font-size:			13px;
	font-weight:		bold;
	text-align:			center;
	background-color:	#e6e6e6;
}
.framed td {
	padding:			3px 4px;
}
.cframed td {
	padding:			3px 4px;
	text-align:			center;
	vertical-align:		top;
}
.cframed td.desc {
	text-align:			left;
}

.tablenotes {
	border-collapse:	collapse;
	width:				90%;
	margin:				16px auto 0px auto;
}
.tablenotes tr {
	vertical-align:		top;
}
.tablenotes th, .tablenotes td {
	padding:			2px;
	text-align:			left;
}
.tablenotes td:first-child {
	width:				60px;
	padding-right:		20px;
	text-align:			right;
}

/* ro4icons.html */
td.iconfilename {
	width:				100px;
	text-align:			center;
	vertical-align:		top;
	font-size:			1.1em;
}
.iconnames {
	border-collapse:	collapse;
	width:				100%;
}
.iconnames td {
	width:				25%;
	padding:			2px 0;
	text-align:			left;
	font-size:			0.9em;
}

/* --- Inset boxes ---------------------------------------------------------- */

.iteminfobox, .proginfobox {
	margin:				0 0 12px 0;
	padding:			8px;
	border:				1px dotted #4a4;
	background-color:	#ffc;
	font-size:			10px;
}
.iteminfobox {
	width:				190px;
}
.proginfobox {
	width:				250px
}
.iteminfobox h3, .proginfobox h3 {
	font-family:		Arial, sans-serif;
	font-size:			12px;
	color:				#d73;
	margin:				0px 0 4px 0;
}

table.iteminfo, table.proginfo {
	border-collapse:	collapse;
	width:				100%;
}
table.iteminfo td, table.proginfo td {
	font-family:		Arial, sans-serif;
	font-size:			11px;
	padding:			0;
	line-height:		1.4em;
}
table.iteminfo td:first-child {
	width:				40%;
	color:				#6a5;
	font-weight:		bold;
	text-align:			right;
	padding-right:		12px;
}
table.proginfo td:first-child {
	width:				48%;
	color:				#6a5;
	font-weight:		bold;
	text-align:			right;
	padding-right:		12px;
}
table.proginfo em {
	font-size:			1.1em;
	font-style:			normal;
	font-weight:		bold;
}

/* --- Area and Section index pages ----------------------------------------- */

#indextable {
	border-collapse:	collapse;
	margin:				20px auto;
	width:				700px;
}
		
#indextable tr {
	vertical-align:		top;
}

#indextable td {
	padding:			8px 5px;
	font-family:		Arial, sans-serif;
	color:				#888;
}
#indextable td.link {
	width:				190px;
	text-align:			left;
	font-size:			12px;
}
#indextable td.link a {
	font-family:		Verdana, sans-serif;
	font-size:			16px;
}
#indextable td.link a + p {
	margin:				2px 0 0 0;
	text-align:			left;
}
#indextable td.desc {
	color:				#c75;
	text-align:			left;
	font-size:			15px;
	font-weight:		normal;
	padding-right:		20px;
}
#indextable td.updated {
	width:				100px;
	text-align:			center;
	font-size:			12px;
	font-weight:		bold;
}
#indextable .date {
	color:				#555;
	font-size:			13px;
	font-weight:		normal;
}
#indextable td[colspan="3"] {
	font-size:			14px;
	text-align:			center;
}

/* --- Site History and Site Map tables ------------------------------------- */

#history, #sitemap {
	border-collapse:	collapse;
	border:				1px solid #888;
	width:				90%;
	margin:				0px auto;
	background-color:	#fff;
}
#history tr, #sitemap tr {
	vertical-align:		top;
}

#sitemap th {
	padding:			4px;
	background-color:	#ddd;
	font-family:		Arial, sans-serif;
	font-size:			14px;
	font-weight:		bold;
}
#history td, #sitemap td {
	padding:			2px 4px;
}
#history td.released {
	width:				100px;
	text-align:			center;
}

#history td.added, #history td.updated, #history td.moved, #history td.removed {
	width:				70px;
	text-align:			center;
}
#history td.added	{	color: #22aa22;	}
#history td.updated	{	color: #dd7700;	}
#history td.moved	{	color: #4444cc;	}
#history td.removed	{	color: #ee3355;	}

#history td.site, #history td.midi, #history td.riscos {
	width:				90px;
	text-align:			center;
}
#history td.site {
	background-color:	#fea;
}
#history td.midi, #sitemap td.midi {
	background-color:	#cef;
}
#history td.riscos, #sitemap td.riscos {
	background-color:	#cfb;
}

