body { background: #4f4c49; padding: 50px 0 0 50px; font-family: "lucida grande", tahoma, verdana, arial, sans-serif; font-size: 62.5%; text-align: center; }


.introShade { text-align: left; width: 675px; padding: 0 6px 6px 0; background: url('../images/shadow.gif') right; repeat transparent; margin: 0 auto 50px; }
	.introShade .intro { padding: 20px 35px 0; background: #353330; color: #eee; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: -6px 0 0 -6px; position: relative; }
		.introShade .intro h1 a { color: white; text-decoration: none; }
		.introShade .intro h1 a:hover { border-bottom: 1px dotted white; }	
		.introShade .intro .bigButton { margin: 20px 0 0 0; }
	
	.introShade .practical { background: #615e5c; border: 1px solid #72706d; border-right: none; border-left: none; padding: 5px; clear: both; margin: 10px -35px 0; position: relative; text-align: center; height: 52px; }

	/* prominent intro */
	.introShade .intro.prominent { padding: 50px 85px 0; }
	.introShade .intro.prominent .bigButton { margin: 0 0 10px 30px; }
	.introShade .intro.prominent .practical { margin: 50px -85px 0; }
	.introShade .intro.prominent h3 { font-size: 1.1em; padding: 0; }

		.practical .you { float: left; color: #fff; font-size: 1.1em; line-height: 50px; padding-left: 20px; }
		.practical .you a { color: #fff; }
			.practical .you img { border: 1px solid #747271; }
		.practical form.sherlock { float: right; margin: 10px 10px 0 0; }

ul.everybody { text-align: left; }
	/* the receptionist */
		li.unique div.receptionist { background: #353330; color: #eee; padding: 15px; float: left; }
			p, ul.toDo { line-height: 1.6em; font-size: 1.1em; }
				p { padding: 5px 0 10px; }
				ul.toDo { list-style: lower-alpha outside; padding-left: 30px; }
			li.unique div.receptionist a,
			li.unique div.receptionist a:visited { border-bottom: 1px dotted #ccc; text-decoration: none; color: #ddd; }
				li.unique div.receptionist a:hover { border-color: white; color: white; }
	
	/* the split */
		li.theSplit { clear: both; }
		
	/* one in a million */
		li.unique { float: left; padding: 0 6px 6px 0; background: url('../images/shadow.gif') repeat transparent; margin: 0 50px 50px 0; }
			li.unique div { background: white; width: 345px; padding: 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: -6px 0 0 -6px; position: relative; }
				li.unique div .name { background: #e5e5e5; display: block; padding: 15px 15px 0; font-size: 4em; color: #504c48; font-weight: 800; text-shadow: 0 1px 1px white; text-decoration: none; letter-spacing: -0.05em; position: relative; }
					li.unique div .name span { color: #e5e5e5; display: none; text-shadow: none; font-size: 0.5em; position: absolute; top: 5px; right: 10px; }
					li.unique div a.name:hover span { color: #900; display: block; }
				li.unique div em { background: #e5e5e5; display: block; padding: 0 15px 14px; line-height: 2em; float: left; width: 335px; max-width: 315px; }
					li.unique div em span { margin: 5px 5px 0 0; background: white; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 0 7px 0 1px; color: #ca7826; float: left; display: inline; white-space: nowrap; }
					li.unique div em span i { color: #bbb; padding: 0 2px; }

				ul.consume { border: 1px solid #e5e5e5; padding: 5px 20px 20px 15px; clear: both; }
					ul.consume li { background: url('../images/bullet.gif') 0 1.2em no-repeat; margin-top: 15px; padding: 0 0 0 15px; }
						ul.consume li strong { font-size: 2.8em; font-weight: 800; color: #7aab2c; text-overflow:ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; display: block; overflow: hidden; width: 100%; padding-bottom: 5px; }

				ul.consumers { }
					ul.consumers li { padding: 5px 0; }
						ul.consumers li a { font-size: 1.3em; font-weight: 800; color: #7aab2c; text-decoration: none; }
						ul.consumers li span.discreet { padding: 0 5px; }
	/* focus */
		#focus.everybody { width: 675px; margin: 0 auto; }
		#focus.everybody li.unique { width: 675px; margin: 0 0 50px; }
			#focus.everybody li.unique div { width: 671px; }
				#focus.everybody li.unique div em { max-width: 641px; width: 661px; }
			#focus.everybody li.unique .content { display: block; border: 1px solid #e5e5e5; padding: 15px; }
			#focus.everybody li.unique .secondaryContent { float: right; width: 275px; background: url('../images/cornerFromBack.gif') top right no-repeat; padding-top: 11px; margin: 0px -32px 0 0; }
				#focus.everybody li.unique .secondaryContent .base { background: #615e5c; color: #fff; border-right: 1px solid #71716d; float: left; width: 235px; padding: 0 25px 20px 15px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-top-left-radius: 5px; }
				
				.graph { }
				.graph li { border: 1px solid #757271; height: 35px; margin-bottom: 15px; line-height: 35px; }
					.graph li strong { float: right; padding-right: 15px; font-size: 2em; font-weight: lighter; color: #757271; }
					.graph li .value { height: 35px; display: block; text-indent: 10px; padding-bottom: 11px; }
						.graph li.bar_1 .value { background: url(../images/graph/one_bg.gif) top repeat-x; font-size: 1.65em; }
						.graph li.bar_2 .value { background: url(../images/graph/two_bg.gif) top repeat-x; font-size: 1.45em; }
						.graph li.bar_3 .value { background: url(../images/graph/three_bg.gif) top repeat-x; font-size: 1.25em; }
						.graph li.bar_4 .value { background: url(../images/graph/four_bg.gif) top repeat-x; font-size: 1.05em; }
						.graph li.bar_5 .value { background: url(../images/graph/five_bg.gif) top repeat-x; font-size: 0.85em; }
				
/* @group Layout */
.secondary { float: right; width: 280px; margin: 0 50px 50px 0; display: inline; }
	.secondary ul.everybody { padding: 0; }
	.secondary ul.everybody li.unique .receptionist { width: 250px; }
/* @end */
/* @group Type */
h1 { text-shadow: 0 1px 1px black; font-size: 4em; }
h2 { font-size: 2em; padding: 15px 0; color: #b6e56c; font-weight: normal; line-height: 1.2em; text-shadow: 0 1px 1px black; }
	h2 strong, h3 strong, h4 strong { font-style: italic; font-weight: 800; }

h3 { font-size: 1.6em; line-height: 1.5em; padding: 20px 0 5px; font-style: italic; font-weight: normal; }

.tag { font-style: italic; color: #ca7826; padding: 0; }
.discreet { color: #888; }

/* @end */
/* @group List */
ul.infoBits { float: left; color: #eee; }
	ul.infoBits li { background: #454340; padding: 15px; margin: 10px 20px 10px 0; float: left; font-size: 1.3em; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
		ul.infoBits li a { color: #fff; text-decoration: none; border-bottom: 1px dotted white; }
		ul.infoBits li .value { font-size: 1.3em; font-style: italic; color: #999; }
/* @end */
/* @group GUI elements */
	.bigButton { background: url('../images/button/gradient_bg.png') 50% 50%; color: #ddd; float: right; position: relative; font-size: 1.8em; padding: 0 5px; text-decoration: none; text-shadow: 0 1px 1px #cd5b10; border: 1px solid #282828; border-top: none; border-left: none; margin-top: 10px; display: inline; }
		.bigButton span { padding: 7px 55px 7px 15px; display: block; line-height: 2em;  }
		.bigButton .list { background: url('../images/button/listOnButton.png') no-repeat right 50%; }
	.bigButton:hover { color: #fff; text-shadow: 0 1px 1px #9b501f; border-color: #111; }
	
	html body .focusButton, html body .focusButton:visited { background: url('../images/button/gradient_bg.png') 50% 50%; color: #ddd; font-size: 1.7em; height: 3em; line-height: 3em; float: right; padding: 0 3ex; margin: 15px 0 0 20px; border: 1px solid #222; border-top: none; border-left: none; text-shadow: 0 1px 1px #cd5b10; text-decoration: none; }
		html body .focusButton span.list { background: url('../images/button/listOnButton.png') no-repeat right 50%; float: right; margin-right: -20px; padding-right: 50px; height: 3em; }
		html body .focusButton:hover { color: white; border-color: black; text-shadow: 0 1px 1px #9b501f; }
/* @end */
/* @group Form and Input */
	input.submit,
	input.text { font-size: 1.3em; }
	
	input.submit { background: url(../images/button/gradient_bg.gif) repeat-x 50% 50%; color: white; border: none; margin: 0; padding: 5px; }
	input.text { background-color: #1a1918; border: 1px solid #1a1918; color: white; margin: 0; padding: 5px; height: 2em; }
		input.text.blurred { color: #767574; }
		
	form.sherlock { width: 262px; height: 29px; background: url(../images/searchBg.gif) 50% 50% no-repeat; }
		form.sherlock input { background: transparent; border: none; height: 29px; line-height: 19px; }
		form.sherlock input.text { float: left; width: 200px; padding: 5px 10px; }
		form.sherlock input.submit { float: right; width: 60px; padding: 5px 0; }
/* @end */


/* added by Jake */
li.unique div.receptionist a {color: #eee; }

li.unique div.receptionist form.submit h2 { padding-bottom: 2px; margin-bottom: 2px; }
li.unique div.receptionist form.submit h3 { padding-top: 2px; margin-top: 2px; }
li.unique div.receptionist form.submit input { margin: 6px 6px 12px 0; padding: 2px; }

	/* no underline on Brands in lists */
	ul.consume li a,
	ul.consume li a.visited { text-decoration: none; }	

	/* no underline on user URLs */
	li.unique div em span a { color: #ca7826; text-decoration: none; }
	li.unique div em span a:hover { text-decoration: underline; }

/* general */
.clear { clear: both; }

/* for every rule... */
@media screen and (-webkit-min-device-pixel-ratio:0) {
}