/*
--------------------------------------------------
DerScutt.com GLOBAL STYLES
Last revised 24 April 2008
--------------------------------------------------
*/
/*
--------------------------------------------------
Color palette:
--------------------------------------------------
Red #FF0000
Red 50% #FF8080

Very dark grey #444
DimGray #696969
DarkGray #A9A9A9
Silver #C0C0C0
Gainsboro #DCDCDC
WhiteSmoke #F5F5F5

White #FFF

*/
/*
--------------------------------------------------
GLOBAL RESET
--------------------------------------------------
undohtml.css (CC) 2004 Tantek Celik. Some Rights Reserved.
*/
:link, :visited { text-decoration: none }
ul, ol	{ list-style: none }
h1, h2, h3, h4, h5, h6, pre, code { font-size: 1em }
body, html, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, p, blockquote, img { margin: 0; padding: 0; }
a img, :link img, :visited img { border: none }
address { font-style: normal }

/*
--------------------------------------------------
DEFAULT HTML STYLES
--------------------------------------------------
This section concerns generalizations and common elements
*/
body	{
		color: #444; /* Very dark grey */
		font-size: 12px;
		font-family: "Gill Sans", "Gill Sans MT", Arial, sans-serif;
		text-align: center;	/* horizontal centering in Win IE */
		min-width: 80em; /* 960px -- < Win IE7 ignores this */
		background: #FFF;
		}

/* Links */
a		{
		text-decoration: none;
		}
a:link, a:visited {
		color: #FF0000; /* Red */
		border-bottom: 1px solid #FF8080; /* Red 50% */
		}
a:focus {
		outline: none; /* most browsers do not support yet support this property */
		-moz-outline: none; /* remove focus outline in Mozilla browsers */
		}
a:hover {
		color: #444; /* Very dark grey */
		border-bottom: none;
		background: #FF8080; /* Red 50% */
		}
a:active {
		color: #FFF; /* White */
		}
a[name] { /* remove dotted underline from document links */
		border-bottom: none;
		}

/* Headings */
h1, h2, h3, h4, h5, h6 {
		color: #696969; /* DimGray */
		font-family: "Gill Sans", "Gill Sans MT", Arial, sans-serif;
		line-height: 1.5;
		margin: 1.5em 0 0;
		background: transparent;
		}
h1		{
		color: #FF0000; /* Red */
		font-weight: normal;
		font-size: 15px;
		line-height: 1.2;
		margin: 0 0 2.4em;
		}
h2		{
		color: #444; /* Very dark grey */
		font-weight: normal;
		text-transform: uppercase;
		letter-spacing: .1em;
		margin: 1.5em 0;
		}
h4, h5	{
		text-transform: uppercase;
		letter-spacing: .1em;
		}

p		{
		margin-bottom: 1.5em;
		}
blockquote {
		margin: 1.5em;
		}

/* Lists */
ul ul, ol ol, ul ol { /* nested list indent */
		margin-left: 1.5em;
		}

/* Tables */
table td {
		padding-right: 1.5em;
		}

abbr, acronym {
		font-size: 11px;
		letter-spacing: .1em;
		border-bottom: none;
		cursor: help;
		}
h1 abbr, h1 acronym {
		font-size: 13px;
		}
dfn		{
		border-bottom: 1px solid #DCDCDC; /* Gainsboro */
		cursor: help;
		}

/*
--------------------------------------------------
PAGE STRUCTURE
--------------------------------------------------
This section defines layout elements and respective environmental formatting
*/
#wrapper {
		text-align: left; /* reset Win IE workaround */
		width: 80em; /* 960px */
		position: relative;
		margin: 0 auto; /* standard CSS horizontal centering */
		background: transparent;
		}

/* Banner -- identity + navigation */
#banner {
		height: 3em;
		position: relative;
		padding: 1.5em 0;
		background: transparent;
		}
#banner .logo {
		color: #FF0000; /* Red */
		height: 16px;
		width: 205px;
		float: right;
		margin-top: .375em;
		background: transparent url(../images/logos/logo-derscutt.gif) no-repeat right;
		}
#banner .logo a {
		border-bottom: none;
		}
#banner .logo a:hover {
		background: none;
		}
#banner .logo span {
		display: none;
		}

#container { /* grouping for content + sidebar */
		line-height: 1.5;
		margin-bottom: 3em;
		background: transparent;
		}
/* Apply paragraph styles to main container */
#container p {
		text-align: justify;
		}

/* Main content */
#content {
		background: transparent;
		}

/* Heading styles */
#content .section {
		color: #A9A9A9; /* DarkGray */
		font: bold 11px/1.63636 "Gill Sans", "Gill Sans MT", Arial, sans-serif;
		text-transform: uppercase;
		letter-spacing: .1em;
		margin-bottom: .40909em;
		}
#content h1 {
		width: 100%;
		}
#content h1 span {
		color: #696969; /* DimGray */
		font-style: italic;
		font-size: 13px;
		line-height: 1.384615;
		float: right;
		}
#content h2 span {
		color: #FFF; /* White */
		font-weight: normal;
		font-size: 12px;
		text-transform: uppercase;
		letter-spacing: .1em;
		padding: .1875em .375em;
		background: #FF0000; /* Red */
		}

/* Image inset */
#content .inset {
		background: transparent;
		}
#content .inset.left {
		float: left;
		margin-right: .75em;
		}
#content .inset.right {
		float: right;
		margin-left: .75em;
		}
#content .inset img { /* placeholder background color */
		background-color: #F5F5F5; /* WhiteSmoke */
		}

/* Gallery */
#content .gallery {
		margin-bottom: 1.5em;
		}
#content .gallery h2, #content .gallery h3 {
		display: none;
		}
#content .gallery li {
		max-width: 200px;
		float: left;
		margin: 0 4px 1.5em 0; /* .375em -- express as px to avoid rounding problems */
		}
#content .gallery li.last {
		margin-right: 0;
		}
#content .gallery li img {
		/* 200px W x 157px H */
		height: 154px;
		}
#content .gallery li span {
		display: block;
		}
#content .gallery li a {
		border-bottom: none;
		background: none;
		}

/* Thumbnail gallery */
#content .thumbnails {
		width: 39.25em;
		position: absolute;
		bottom: 1.5em;
		left: 0;
		border-top: 1px solid #C0C0C0; /* Silver */
		margin-top: 3em;
		padding-top: 1.5em;
		}
#content .thumbnails li {
		margin: 0;
		padding: 0;
		}
#content .thumbnails li a {
		float: left;
		margin-right: 1px;
		margin-bottom: .375em;
		border-bottom: none;
		}
#content .thumbnails li a:hover {
		background: none;
		}
#content .thumbnails li img {
		height: 36px;
		opacity: .5; /* CSS3 property not widely supported */
		-moz-opacity: .5; /* Required for Mozilla browsers */
		filter:alpha(opacity=50); /* Required for IE browsers */
		}
#content .thumbnails li img:hover { /* IE 6 does not accept :hover on this tag; use inline Javascript */
		opacity: 1;
		-moz-opacity: 1;
		filter:alpha(opacity=100);
		}
#content .thumbnails .link {
		font: 10px/1.8 "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "Courier New", Courier, monospace;
		text-transform: uppercase;
		letter-spacing: .1em;
		position: absolute;
		top: -1.5em;
		}
#content .thumbnails .link.bck {
		left: 0;
		}
#content .thumbnails .link.fwd {
		right: 0;
		}
#content .thumbnails .link a {
		border-bottom: none;
		}


/* Text-swap box */
#hold	{
		display: none;
		}

/* Slideshow */
#photodiv {
		width: 471px;
		height: 600px;
		background-repeat: no-repeat;
		background-position: center center;
		}
#photoimg {
		}
a#photoanchor {
		border-bottom: none;
		background: none;
		}

/* Columns */
/* 2-column layout */
#content .column {
		width: 39.25em;
		float: left;
		margin-right: 1.5em;
		background: transparent;
		}
#content .column.right { /* rightmost column -- matches selectors with both class .column and .right */
		margin-right: 0;
		}
/* 3-column layout */
#content .column3 {
		width:  326px;
		float: left;
		margin: 0 1.5em 0 0;
		}
#content .column3.right { /* rightmost column -- matches selectors with both class .column and .right */
		margin-right: 0;
		}
/* 4-column layout */
#content .column4 {
		width: 226px; /* @18.875em -- use px to avoid rounding discrepancies */
		float: left;
		margin-right: 1.5em;
		}
#content .column4.right { /* rightmost column -- matches selectors with both class .column and .right */
		margin-right: 0;
		}

/* Footer */
#footer {
		color: #999; /* Medium grey */
		font-family: "Gill Sans", "Gill Sans MT", Arial, sans-serif;
		margin-bottom: 1.5em;
		position: relative;
		clear: both;
		list-style: none;
		}
#footer li {
		padding: 0 .5em;
		display: inline;
		background: url(../images/utility/pipe.gif) no-repeat right;
		}
#footer li.first {
		padding-left: 0;
		}
#footer li.last {
		background: none;
		}
#footer li.byline { /* use for site-design credit */
		color: #A9A9A9; /* DarkGray */
		font-size: 10px;
		line-height: 1.8;
		text-transform: uppercase;
		letter-spacing: .1em;
		position: absolute;
		top: 0;
		right: 0;
		margin-right: -.5em;
		background: none;
		}
#footer li.byline span {
		font-weight: bold;
		}

/*
--------------------------------------------------
NAVIGATION
--------------------------------------------------
*/
/* Main navigation */
#nav	{
		font: 12px/1.5 "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "Courier New", Courier, monospace;
		text-transform: uppercase;
		letter-spacing: .1em;
		float: left;
		margin: .75em 0 0 0;
		list-style: none;
		}
#nav li {
		display: inline;
		}
#nav a	{
		margin-right: 1em;
		border-bottom: none;
		background: none;
		}
#nav a:link, #nav a:visited {
		color: #C0C0C0; /* Silver */
		}
#nav a:hover {
		color: #444; /* Very dark grey */
		}
#nav a:active {
		color: #FF0000; /* Red */
		}
#nav a.selected {
		color: #F20017 !important; /* overwrites preceding :hover + :active properties */ /* Pantone 186 */
		border-bottom: 1px solid #FF8080; /* Red 50% */
		}

/* Subnavigation */
#subnav {
		clear: left;
		}
#subnav li {
		display: inline;
		}
#subnav a {
		color: #C0C0C0; /* Silver */
		font: 12px/1.5 "Andale Mono", Arial, sans-serif;
		text-align: center;
		letter-spacing: .1em;
		margin-right: 1em;
		border-bottom: none;
		}
#subnav a:hover {
		color: #444; /* Very dark grey */
		background: none;
		}
#subnav a:active {
		color: #FF0000; /* Red */
		}
#subnav a.selected {
		color: #FF0000 !important; /* overwrites preceding :hover + :active properties */ /* Red */
		border-bottom: 1px solid #FF8080; /* Red 50% */
		}


/*	Utility elements */
.hidden { /* completely remove from layout */
		display: none !important;
		}
.display	{
		display: block !important;
		}
.invisible { /* does not display but remains in layout flow */
		visibility: hidden;
		}
.clip	{
		overflow: hidden;
		}
.clearance {
		height: 0;
		clear: both;
		}
.clear	{
		clear: both;
		}

/*
--------------------------------------------------
FORMATTING STYLES
--------------------------------------------------
Positional, text, font, and miscellaneous formatting not defined in environmental contexts
*/
/* Positioning elements */
.center {
		text-align: center;
		}
.flush-right {
		text-align: right;
		}
.justify {
		text-align: justify;
		}		
.inline {
		display: inline;
		}
.float-left {
		float: left;
		}
.float-right {
		float: right;
		}
.all-pad {
		padding: .75em;
		}
.top-pad { /* also use to provide paragraph spacing in IE Win */
		padding-top: 1.5em;
		}
.left-pad {
		padding: 0 0 .75em 1.5em;
		}
.right-pad {
		padding: 0 1.5em .75em 0;
		}
.bottom-pad { /* also use to provide paragraph spacing in IE Win */
		padding-bottom: 1.5em;
		}
.trim	{
		margin: 0;
		padding: 0;
		}

/* Fonts */
.italic {
		font-style: italic;
		}
.bold	{
		font-weight: bold;
		}
.normal {
		font-variant: normal !important;
		font-style: normal !important;
		font-weight: normal !important;
		text-transform: none !important;
		letter-spacing: normal !important;
		}

/* Typography */
#content h1 + p span:first-child, #content h2 + p span:first-child, #content h3 + p span:first-child {
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: .1em;
		}

/* Links */
a.img:link, a.img:visited, a.img:hover, a.img:active,
#sidebar a.img:link, #sidebar a.img:visited, #sidebar a.img:hover, #sidebar a.img:active {
		/* remove any decoration for linked images */
		border-bottom: none !important;
		background: none !important;
		}
.info	{
		cursor: help;
		}
.link	{
		margin-top: -1.5em;
		}

/* Lists */
/* N.B. May need to declare float value to make lists indent properly */
.square {
		margin: auto 0 .75em 1.5em;
		list-style: square;
		}
.decimal {
		list-style-type: decimal;
		margin-left: 1.5em;
		}
.inline li {
		margin-left: 1em;
		display: inline;
		}
.inline li:first-child {
		margin-left: 0;
		}
.inline li.first {
		margin-left: 0;
		}