/*

* Font-sizes and margins
* Building blocks
* Areas
* Navigation
* boxes
* Forms
* Ads
* Rows and 
umns
* General rules

*/


/*

base font size is set to 63% => 1em = 10px, combine with setting
font-size to 1em to enable browser text-resizing in IE.
*/
html, body, form, fieldset {
	margin:0; padding:0;	
}

p, pre, blockquote, ul, ol, dl, address {
	margin:1em 0; padding:0;
}

p, pre, blockquote, label, ul, ol, dl, fieldset, address, table, td, th {
	font-size: 1em;
}

blockquote {
	float:left;
	width: 435px;
	padding-top: 12px;
}

h1 {
	margin:0.5em 0 10px; 
	font-size:2.4em;
	line-height:1;
	letter-spacing:-0.05em;
}

h2 {
	margin:0.5em 0 10px; 
	font-size:1.6em;
	line-height:1em;
}

h3 {
	margin:0.5em 0 10px; 
	font-size:1.3em;
	line-height:1em;
}

h4 {
	margin-top:0.4em;
	text-transform:uppercase; 
}

li, dd, blockquote {
	margin-left: 1.5em;
}

fieldset {
	border: none;
}

p.intro {
	font-size:1.2em;
}

/* remove default border for linked images */
a img, a:visited img { border:	0; }

h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited 
{
	text-decoration: none;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
	text-decoration: underline;
}

/*

=Building blocks, in order of appearence
------------------------------------------------ */

body {text-align: center;} /* center the layout */

#page {
	margin:0 auto;
	width:975px;
	text-align:left;
}

#logo h1 {margin:0;}

#logo a {
	position:absolute;
	width:100%; height:100%;
	background:transparent;
	text-indent:-5000px;
	border:none;	
}

#leaderboard { /* the top banner */
	position:absolute;
	right:10px;
	top:10px;
}

#searchbox {
	margin:4px;
	height:20px;
	float:left;
	display:inline;
}

#searchbar {
	background:#fff;
	padding:10px 10px 5px 10px;
	margin:10px 0 1px;
	text-align:right;
	line-height:30px;
	}
	/* IE needs a height or width \*/ 
	* html #searchbar {height:30px;} 
	/* clear floats for other browsers */
	#searchbar:after {content:"."; clear:both; display:block; visibility:hidden; height:0;}

#searchbar ul {
	margin:0; padding:0;
	list-style:none;
	display:inline;
}

#searchbar ul.util {
	margin-right:-10px;
	padding:1px 0;
}

#searchbar ul li {
	display:inline;
	border-left:1px solid #000;
	margin:0; padding:0;
}

#searchbar ul li a {
	padding:4px 2px;
	margin:0 10px 0 10px;
	border:none;
}
#searchbar ul li.help, 
#searchbar ul li.advanced {border:none;}

#searchstring {width:135px; margin-right:5px;}

#breadcrumb {
	padding:3px 0;
	margin-bottom:10px;
}
#breadcrumb p {margin:0;}

/*

=Areas
------------------------------------------------ */

#colophon p {margin:0; padding:0;}
#colophon .links {float:left;}
#colophon img {margin-bottom:-2px;vertical-align:baseline}

#footer .linktop {float:right;}


#navbar {
	width:135px;
	float:left;
	margin-right:5px;
	display:inline;
}

#main {
	float:left;
	width:468px;
	margin:0 0 0 5px;
	display:inline;
}

#related {
	width:320px;
	float:right;
	display:inline;
}

/* NOTE: #sidecolumn and #adcolumn are contained within the #related div,
	to enable the main sponsor banner spanning both columns.
 */

#sidecolumn {
	width:140px;
	float:left;
	margin:0;
	display:inline;
}

#adcolumn {
	float:right;
	width:160px;
	background:#FFF;
	display:inline;
}

/* clear float for IE \*/
* html #footer {height:1%;} 
/* */

#footer p {margin:0;}

/*

=Boxes (news / newsletter / etc)
------------------------------------------------ */

dl.col, dl.news, dl.box {
	clear:both;
	margin:0 0 20px;
	color:#000;
}

dl.col dt, dl.box dt {
	padding:2px 5px 2px 10px;
	margin-bottom:1px;
	color:#fff;
	padding:2px 5px 2px 10px;	
}

dl.col dd {
	margin:1px 0; padding:2px 0;
}
dl.box dd {
	margin:1px 0; padding:2px 0;
}

dl.col dd p {margin-top:0;}

/* rounded corners for the title bars */

#sidecolumn dl.col dt {
	background-image:url(/hg/resource.nsf/css/images/corner140.gif);
	background-repeat:no-repeat;
	background-position:0 0;
}

#main dl.box dt {
	background-image:url(/hg/resource.nsf/css/images/corner468.gif);
	background-repeat:no-repeat;
	background-position:0 0;
}

/* now set bottom rounded corners... */

#sidecolumn dl.col dd {
	margin-top:-2px;
	padding-top:2px;
	background-image:url(/hg/resource.nsf/css/images/corner140.gif);
	background-repeat:no-repeat;
	background-position:0 0;
	background-color:transparent;
}

#main dl.box dd {
	margin-top:-2px;
	padding-top:2px;
	background-image:url(/hg/resource.nsf/css/images/corner468.gif);
	background-repeat:no-repeat;
	background-position:0 0;
	background-color:transparent;
}

#main dl.box dd .pad {
	padding:2px 10px;
	background:#e7e6e2;
}

/* end rounded corners */

/* ul.articles is for links to articles, used in the boxes mentioned earlier */

ul.articles {
	margin:0; padding:0;
	list-style:none;
}

ul.articles li {
	margin:5px 0;
	padding:0;
}

ul.articles li a {
	display:block; 
	border:none;
}

/* For IE: \*/ 
* html ul.articles li a {height:1px;} 
/* */

ul.articles .timestamp {
	color:#666;
}

/* no display:block when article lists are in the #main area */
#main dl.articles ul.articles li a {
	display:inline; margin-right:5px;
}

/*

=Forms and forms elements
------------------------------------------------ */

.newsletter input.text.full {
	/* newsletter email text field */
	width:120px;
}

.newsletter input.btn {
	font-size:10px;
	font-weight:bold;
}

.buttonrow {
	margin:5px 0;
	text-align:right;
}

.buttonrow .first {float:left;}

/*

=Ads, advertisments. (make it either a [div] or a [p])
------------------------------------------------ */

.ad {
	margin:0 0 10px;
}

#main .ad, #related .ad {background:#FFF; padding:0 0 0px;}

#navbar .ad {text-align:center;}

#adcolumn .ad {text-align:right; margin-top:-10px;}

#sponsors h5 {text-align:right; margin-right:5px;}

/*

=Rows and column for the main section
------------------------------------------------ */

div.row {
	margin-top:1px;
	width:100%;
	background:repeat-y url(/hg/resource.nsf/css/images/vsep.gif) 311px 0;
	}
	/* Clear the floats for IE \*/
	* html div.row {height:1%;}
	/* ... and for other browsers: */
	div.row:after {content:"."; height:0px; display:block; clear:both; visibility:hidden;}

.row .col1 {
	float:left;
	width:300px;
	overflow:hidden;
}

.row .col2 {
	float:right;
	width:147px;
	overflow:hidden;
}

div.rowhalves {
	margin-top:1px;
	width:100%;
	background:repeat-y url(/hg/resource.nsf/css/images/vsep.gif) 233px 0;
	}
	/* Clear the floats for IE \*/
	* html div.row {height:1%;}
	/* ... and for other browsers: */
	div.row:after {content:"."; height:0px; display:block; clear:both; visibility:hidden;}

.rowhalves .col1 {
	float:left;
	width:222px;
	overflow:hidden;
}

.rowhalves .col2 {
	float:right;
	width:222px;
	overflow:hidden;
}

/*

=General rules
------------------------------------------------ */

.sep {color:#999;}

.clear {clear:both;}

.right {
	float:right;
	margin-left:10px;
	margin-bottom:5px;
	text-align:right;
}

.left {
	float:left;
	margin-right:10px;
	margin-bottom:5px;
}

.center {
	margin-left:80px;
	margin-bottom:5px;
}