/*-------------------------+
 | Site: C82 v9            |
 | Part: Master stylesheet |
 +-------------------------*/


/* Imports
=====================================================================*/
@import "reset.css";  /* Reset styles */
@import "ie.css";  /* Internet Explorer */


/* Fonts
======================================================================*/
.action-btn, .metra .coming, .metra .placeholder { font-family: Arial, sans-serif; }
body { font-family: Georgia, "Times New Roman", Times, serif; }

.btn,
.call,
.call-l,
.call-r,
.insertLeft,
.insertRight,
#footer,
h1,
.mute,
.pages,
.slider-wrap,
.txt,
.txt-sm {
	font-family: "Lucida Grande", Verdana, Arial, sans-serif;
}

code, kbd, pre { font-family: Consolas, "Courier New", Courier, monospace; }


/* Basics
======================================================================*/
a { color: #36c; }
a:hover { text-decoration: none; }
acronym { border-bottom: 1px dotted #000; cursor: help; font-size: 0.85em; font-variant: small-caps; }
blockquote, embed, dl, object, ol, p, pre, ul { margin-bottom: 1.5em; }
blockquote { margin: 0 0 0 3em; }
blockquote cite { display: block; text-align: right; }
blockquote cite, blockquote cite a { color: #a5a8aa; }
body { color: #444; font-size: 90%; line-height: 1.5; padding: 0 3em 3em; }
cite, em, var { font-style: italic; }
dt { margin-top: 0.5em; }
dt, h2, h3, h4, strong { font-weight: bold; }
em, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, strong { color: #000; }
h1 { font-size: 0.733em; font-weight: normal; line-height: 2em; text-transform: uppercase; }
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.02em; }
h2 { font-size: 2em; line-height: 1.15em; margin-bottom: 0.45em; }
h2 a, h3 a { text-decoration: none; }
h3 { font-size: 1.46em; line-height: 1.2; }
hr { background: #e5e6e7; border: 0; clear: both; color: #e5e6e7; height: 1px; margin: 1em 0; }
iframe { width: 100%; }
input, select, textarea { font-size: 1em; }
li { margin-bottom: 0.25em; }
ol { list-style: decimal; margin-left: 2em; }

pre {
	margin-left: 2em;
	text-indent: -2em;
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap;  /* Mozilla */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

ul li { background: url(../images/bullet.gif) no-repeat 0 0.7em; padding-left: 1.1em; }

/*--- Stock ---*/
.r { float: right; }
ul.flat { list-style: none; }
ul.flat li { background: none; padding: 0; }


/* Core layout
======================================================================*/
.clear { clear: both; }
#page { margin: 0 auto; max-width: 62.8em; min-width: 600px; }

/*--- Baseline checker ----*/
.baseline { background: url(../images/baseline.gif) 0 6px; }

/*--- Content ----*/
#content-primary { float: left; width: 65.5%; }
#content-primary, #content-secondary { margin-bottom: 1.535em; }
#content-secondary { float: right; width: 31.1%; }

/*--- Home ---*/
#about #content-primary,
#about #content-secondary,
#home #content-primary,
#home #content-secondary,
#portfolio #content-primary,
#portfolio #content-secondary {
	width: 48.6%;
}

/* Content
======================================================================*/
/*--- Action buttons ---*/
.action-btn {
	background: #222 url(../images/action-overlay.png) repeat-x;
	border-bottom: 1px solid #222;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px #999;
	-webkit-box-shadow: 0 1px 3px #999;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-weight: bold;
	line-height: 1;
	margin-right: 1em;
	padding: 0.4em 1em 0.5em;
	position: relative;
	text-decoration: none;
	text-shadow: 0 -1px 1px #222;
}

.action-btn:hover { background-color: #111; color: #fff; }

/*--- Callouts ---*/
.call-l, .insertLeft { float: left; margin: 0.5em 2em 1em 0; }
.call-r, .insertRight { float: right; margin: 0.5em 0 1em 2em; }
.call, .call-l, .call-r, .insertLeft, .insertRight { font-size: 0.733em; line-height: 1.9em; }

.call, .call a,
.call-l, .call-l a,
.call-r, .call-r a,
.insertLeft, .insertLeft a,
.insertRight, .insertRight a {
	color: #777;
}

.call img, .call-l img, .call-r img {
	-moz-box-shadow: 0 1px 3px #999;
	-webkit-box-shadow: 0 1px 3px #999;
}

/*--- Comments ---*/
#comments { list-style: none; margin-left: 0; }

#comments li {
	background: #f5f5f6;
	clear: both;
	margin-bottom: 1.535em;
	padding: 1.7em 10em 2em 2em;
	position: relative;
}

.comment-number {
	color: #eaebec;
	font-size: 6em;
	font-weight: bold;
	line-height: 1.1;
	position: absolute;
	right: 0.25em;
	text-decoration: none;
	top: 0;
}

.comment-number:hover { color: #d0d1d3; }

/*--- Entries ---*/
#entry { clear: both; }
#entry h2 { font-size: 1.46em; line-height: 1.2; }
#entry h3 { margin-bottom: 0.2em; }

/*--- Feature ---*/
#feature { margin-bottom: 1em; }
#feature img { -moz-box-shadow: 0 1px 3px #aaa; -webkit-box-shadow: 0 1px 3px #aaa; }

/*--- Footer ---*/
#footer { border-top: 1px solid #e5e6e7; clear: both; font-size: 0.733em; line-height: 1.9em; padding-top: 1.9em; }
#footer, #footer a, #footer strong { color: #a5a8aa; }
#footer li { background: none; display: inline; margin-right: 1.5em; padding: 0; }
#footer .url { display: none; }

	/* Subfooter */
	#subfooter { border-top: 1px solid #ddd; font-size: 0.75em; padding-top: 1em; }
	#subfooter a { text-decoration: none; }
	#subfooter a:hover { text-decoration: underline; }
	#subfooter h3 { float: left; width: 12.5%; }
	#subfooter li { background: none; float: left; margin: 0 1.5% 0 0; padding: 0; width: 12.78%; }
	#subfooter ul { float: right; width: 87.5%; }

/*--- Forms ---*/
.form label { float: left; margin-right: 5%; text-align: right; width: 15%; }

	/* Alerts */
	.alert { color: #ff4200; }
	div.alert { border: 3px double #ff7575; margin-bottom: 1.535em; padding: 0.6em 1em 0; }
	div.alert li { background: none; padding: 0; }
	div.alert ul { list-style: disc; margin-left: 1.5em; }
	
	/* Buttons */
	.btn { overflow: visible; padding: 0.2em 0.5em; }
	.btns { margin-left: 20%; }
	
	/* Search */
	.search { font-size: 0.9em; position: absolute; right: 0; top: 0; text-align: right; white-space: nowrap; }
	.search p { margin: 0; }
	.search .txt { margin: 0; width: 13em; }
	
	/* Text boxes*/
	.txt { padding: 0.2em; width: 47.2%; }
	.txt, .txt-sm { margin-right: 0.7em; }
	.txt-sm { text-align: center; text-transform: uppercase; width: 3em; }

/*--- Full view ---*/
#full { text-align: center; }
#full img { border: 1px solid #e5e6e7; }

/*--- Galleries ---*/
.gallery img { display: block; margin-bottom: 0.25em; }
.gallery li { background: none; float: left; margin-bottom: 3em; padding: 0; }
.gallery li.alt { float: right; }
.gallery p { margin-bottom: 0.25em; }
.gallery .shim { height: 100%; vertical-align: middle; }

	/*--- Metra ---*/
	.metra img { vertical-align: middle; }
	.metra li { margin: 0 2px 1em 0; padding: 0; }
	.metra .coming a { color: #000; cursor: default; }
	.metra .placeholder { background: #f5f5f5; font-size: 0.75em; line-height: 1.2; text-align: center; }
	.metra .placeholder a:hover { text-decoration: underline; }
	.metra .thumb { display: table-cell; height: 106px; text-align: center; text-decoration: none; vertical-align: middle; width: 73px; }
	
	/* Portfolio */
	#home .portfolio li { float: none; width: 100%; }
	.portfolio { margin-top: 0.5em; }
	.portfolio a:hover img {  }
	.portfolio img { display: block; margin-bottom: 0.3em; }
	.portfolio li { width: 48.6%; }
	.portfolio .mute { margin-left: 0.7em; }
	
	/* Products */
	.products .price { color: #000; float: right; font-weight: bold; }
	.products li { width: 48%; }

/*--- Header ---*/
#header { border-bottom: 1px solid #e5e6e7; margin: 1.05em 0 1.9em; padding-bottom: 0.9em; position: relative; }
#home #header { margin-bottom: 0.8em; }
#tagline { color: #a5a8aa; font-style: italic; font-size: 1.1em; padding-top: 0.5em; }

	/* Logo */
	#logo a { display: block; }
	#logo img { border-right: 1px solid #e5e6e7; float: left; margin-right: 1.6em; padding-right: 1.6em; }
	#logo, #nav, #tagline { margin-bottom: 0; }
	#logo-mobile { display: none; }
	
	/* Navigation */
	#nav { font-size: 1.5em; }
	#nav a { color: #000; text-decoration: none; }
	#nav a:hover { text-decoration: underline; }
	#nav li { background: none; display: inline; margin-right: 0.8em; padding: 0; }
	#nav li.current { font-weight: bold; }

/*--- Home ---*/
#home h2 { margin: 0; }
#home hr { margin: 0 0 0.4em; }
#home #content-secondary a { text-decoration: underline; }

/*--- Icons ---*/
.icon { background-position: 0 70%; background-repeat: no-repeat; padding: 2px 0 2px 22px; }
.feed { background: url(../images/icon-feed.gif) no-repeat 0 0; padding-left: 18px; }
.i-feed { background-image: url(../images/icon-feed.png); }
.i-twitter { background-image: url(../images/icon-twitter.png); }
.i-facebook { background-image: url(../images/icon-facebook.png); }
.i-linkedin { background-image: url(../images/icon-linkedin.png); }
.i-flickr { background-image: url(../images/icon-flickr.png); }

/*--- Intro ---*/
#intro { font-size: 2em; line-height: 1.5; margin-bottom: 0.5em; }

/*--- Logo links ---*/
#logos { margin-top: 20px; }
#logos a { text-decoration: none; }
#logos a:hover { text-decoration: underline; }
#logos img { margin-right: 20px; vertical-align: middle; }
#logos li { background: none; margin-bottom: 1.535em; padding: 0; }

/*--- Muted text ---*/
.cite, .mute { font-size: 0.733em; line-height: 1.9em; }
.cite, .cite a, .mute, .mute a { color: #a5a8aa; }
dt .mute { margin-left: 0.5em; }
.mute { margin: 0; }

/*--- Secondary navigation ---*/
#nav-secondary li { background: none; border-bottom: 1px solid #e5e6e7; margin-bottom: 0.54em; padding: 0 0 0.54em; }
#nav-secondary .mute { margin-left: 0.5em; }

/*--- Skip links ---*/
.skip { left: -999em; position: absolute; top: -999em; }

/*--- Viewing options ---*/
#view { clear: both; font-size: 0.85em; margin-bottom: 1.535em; }
#view a, #view strong { margin: 0 0.3em; }
#view p { border-right: 1px solid #babcbe; display: inline; margin-right: 1em; padding-right: 1em; }
#view p.last { border: 0; margin: 0; padding: 0; }
#view strong a { margin: 0; }