@import url("global.css");

html, body	{ background: #841 url("images/page_bkg_flipped.jpg") 100% 0 no-repeat; margin: 0; min-width: 900px; }
body		{ padding: 0; }

body#about	{ padding-bottom: 0; }	/* Content is short enough that I don't want it scrolling needlessly */

#content
{
	min-width: 446px;
	min-height: 188px;
	padding: 184px 128px 32px 336px;
	/* border-right: 6px solid #952; */
}

#site-title
{
	position: absolute;
	top: 32px;
	left: 32px;
	margin: 0;
	width: 256px;
	height: 160px;
	background: url("images/title.png");
	text-indent: -600em;
}

#navigation
{
	position: absolute;
	top: 232px;
	left: 32px;
	width: 248px;
	margin: 0;
	padding: 0;
	list-style: none;
}
html>body #navigation,
html>body #site-title	{ position: fixed; }

#navigation a
{
	display: block;
	height: 32px;
	width: 100%;
	margin-bottom: 8px;
	text-indent: -600em;
	overflow: hidden;	/* Fixes huge-outline problem in Gecko */
	background: 100% 0 no-repeat;
}

* html #navigation li	{ height: 1px; /* Fixes redraw bug in IE 6 */ }

#navigation a:hover,
#navigation a:focus,
#navigation a:active,
#navigation .selected a	{ background-position: 100% -32px; }


#nav_about a	{ background-image: url("images/navigation/about.png");		}
#nav_web a		{ background-image: url("images/navigation/web.png");		}
#nav_branding a	{ background-image: url("images/navigation/branding.png");	}
#nav_software a	{ background-image: url("images/navigation/software.png");	}
#nav_graphics a	{ background-image: url("images/navigation/graphics.png");	}
#nav_contact a	{ background-image: url("images/navigation/contact.png");	}

#page-title
{
	margin: 0 0 8px;
	height: 40px;
	background: 100% 0 no-repeat;
	text-indent: -600em;
}
#about		#page-title	{ background-image: url("images/headings/about.png"); }
#web		#page-title	{ background-image: url("images/headings/web.png"); }
#branding	#page-title	{ background-image: url("images/headings/branding.png"); }
#software	#page-title	{ background-image: url("images/headings/software.png"); }
#graphics	#page-title	{ background-image: url("images/headings/graphics.png"); }
#contact	#page-title	{ background-image: url("images/headings/contact.png"); }

@media print
{
	body, html	{ padding: 0; background: white; }
	#content	{ padding: 0; border: 0; width: auto; }
	#navigation	{ display: none; }

	#page-title,
	#site-title
	{
		position: static !important;
		background: transparent !important;
		text-indent: 0;
		width: auto;
		height: auto;
	}
	#site-title	{ text-align: right; margin: 0; font-size: large; }
	#site-title	strong	{ font-size: x-large; display: block; }
	#page-title	{ text-align: left; margin: 0 0 0.25em; }
}