/*============================================================
 Resets
============================================================*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	}
ol, ul { list-style:none; }

/* form field focus style */
:focus { outline:0; }
	
/* = HTML 5
----------------------------------------------- */
article,footer,header,section { margin:0; padding:0; display:block; }
aside,details { margin:0; padding:0; }

/*============================================================
 Generics
============================================================*/
html { height:100%;	}
body {
	height:100%;
	line-height:1;
	font:13px/18px "Lucida Grande", Arial, Verdana, sans-serif;
	color:#666;
	}

b, strong { font-weight:bold; line-height:1; }
i, em { font-style:italic; }

a:link { color:#69C8FF; text-decoration:none; }
a:visited { color:#69C8FF; text-decoration:none; }
a:hover { color:#A3DCFF; text-decoration:underline;}
a img { border:0; }

h1,h2,h3,h4,h5,h6,p {font-weight:normal;}
h1 {font-size:24px; letter-spacing:-0.04em;}
h2 {font-size:21px; letter-spacing:-0.02em;}
h3 {font-size:18px; letter-spacing:-0.01em;}
h4 {font-size:16px;}
p { }


.clear {
	clear:both;
	display:block;
	height:0;
	overflow:hidden;
	font-size:0;
	}
.clearfix:after {content: ".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* Layout */
/* ------------------------------------------------------- */
#wrap { height:100%; }
body > #wrap { height:auto; min-height:100%; }

#content {
	padding-bottom:160px; /* footer height */
	overflow:hidden; /* float clear */
	}
#content #inner {
	position:relative;
	width:990px;
	margin:0 auto;
	}
	
/*============================================================
 =General
============================================================*/

/* Header */
/* ------------------------------------------------------- */
#header {
	display:block;
	width:100%;
	margin-bottom:20px;
	}
#header .inner {
	display:block;
	position:relative;
	width:990px; height:115px;
	margin:0 auto;
	}
#header h1 {
	display:block;
	position:absolute;
	top:0; left:0;
	width:280px; height:147px;
	text-indent:-500px;
	overflow:hidden;
	z-index:10;
	cursor:pointer;
	}
.home #header h1 {
	background:url("../img/home/header_logo.png") center 5px no-repeat;
	}
.examples #header h1 {
	background:url("../img/examples/header_logo.png") center 5px no-repeat;
	}
.progress #header h1 {
	height:200px;
	background:url("../img/progress/header_logo.png") center 5px no-repeat;
	}
.about #header h1 {
	background:url("../img/about/header_logo.png") center 5px no-repeat;
	}
.signup #header h1 {
	background:url("../img/signup/header_logo.png") center 5px no-repeat;
	}
.help #header h1,
.terms #header h1,
.privacy #header h1 {
	background:url("../img/help/header_logo.png") center 5px no-repeat;
	}

/* Navigation
-------------------------------------------------------------------*/
#header ul.nav {
	display:block;
	position:absolute;
	bottom:0; left:290px;
	}
#header ul.nav li {
	float:left;
	}
#header ul.nav li a.home {
	display:block;
	width:96px; height:115px;
	margin-right:10px;
	text-indent:-200px;
	overflow:hidden;
	}
#header ul.nav li a.examples {
	display:block;
	width:108px; height:115px;
	margin-right:8px;
	text-indent:-200px;
	overflow:hidden;
	}
#header ul.nav li a.progress {
	display:block;
	width:102px; height:115px;
	margin-right:6px;
	text-indent:-200px;
	overflow:hidden;
	}
#header ul.nav li a.about {
	display:block;
	width:96px; height:115px;
	margin-right:6px;
	text-indent:-200px;
	overflow:hidden;
	}
#header a.signin {
	display:block;
	position:absolute;
	top:0; right:10px;
	width:76px; height:74px;
	background:url("../img/examples/header_nav-signin.png") no-repeat;
	text-indent:-200px;
	overflow:hidden;
	}
#header a.signup {
	display:block;
	position:absolute;
	top:0; right:76px;
	width:177px; height:117px;
	background:url("../img/examples/header_nav-signup.png") no-repeat;
	text-indent:-200px;
	overflow:hidden;
	}

/* NAV-HOME */
.home #header { margin-bottom:10px; }
.home #header ul.nav li a.home { background:url("../img/home/header_nav-home.png") no-repeat; }
.home #header ul.nav li a.examples { background:url("../img/home/header_nav-examples.png") no-repeat; }
.home #header ul.nav li a.progress { background:url("../img/home/header_nav-progress.png") no-repeat; }
.home #header ul.nav li a.about { background:url("../img/home/header_nav-about.png") no-repeat; }
.home #header a.signup { display:none; }
.home #header a.signin {
	display:block;
	position:absolute;
	top:10px; right:28px;
	width:218px; height:135px;
	background:url("../img/home/btn_signin.png") no-repeat;
	}
	
/* NAV-EXAMPLES */
.examples #header ul.nav li a.home { background:url("../img/examples/header_nav-home.png") no-repeat; }
.examples #header ul.nav li a.examples { background:url("../img/examples/header_nav-examples.png") no-repeat; }
.examples #header ul.nav li a.progress { background:url("../img/examples/header_nav-progress.png") no-repeat; }
.examples #header ul.nav li a.about { background:url("../img/examples/header_nav-about.png") no-repeat; }

/* NAV-PROGRESS */
.progress #header ul.nav li a.home { background:url("../img/progress/header_nav-home.png") no-repeat; }
.progress #header ul.nav li a.examples { background:url("../img/progress/header_nav-examples.png") no-repeat; }
.progress #header ul.nav li a.progress { background:url("../img/progress/header_nav-progress.png") no-repeat; }
.progress #header ul.nav li a.about { background:url("../img/progress/header_nav-about.png") no-repeat; }

/* NAV-ABOUT */
.about #header ul.nav li a.home { background:url("../img/about/header_nav-home.png") no-repeat; }
.about #header ul.nav li a.examples { background:url("../img/about/header_nav-examples.png") no-repeat; }
.about #header ul.nav li a.progress { background:url("../img/about/header_nav-progress.png") no-repeat; }
.about #header ul.nav li a.about { background:url("../img/about/header_nav-about.png") no-repeat; }
	
/* NAV-SIGNUP */
.signup #header ul.nav li a.home { background:url("../img/signup/header_nav-home.png") no-repeat; }
.signup #header ul.nav li a.examples { background:url("../img/signup/header_nav-examples.png") no-repeat; }
.signup #header ul.nav li a.progress { background:url("../img/signup/header_nav-progress.png") no-repeat; }
.signup #header ul.nav li a.about { background:url("../img/signup/header_nav-about.png") no-repeat; }
.signup #header a.signup { background:url("../img/signup/header_nav-signup.png") no-repeat; }
	
/* NAV-HELP, LEGAL */
.help #header ul.nav li a.home { background:url("../img/help/header_nav-home.png") no-repeat; }
.help #header ul.nav li a.examples { background:url("../img/help/header_nav-examples.png") no-repeat; }
.help #header ul.nav li a.progress { background:url("../img/help/header_nav-progress.png") no-repeat; }
.help #header ul.nav li a.about { background:url("../img/help/header_nav-about.png") no-repeat; }
.terms #header ul.nav li a.home { background:url("../img/help/header_nav-home.png") no-repeat; }
.terms #header ul.nav li a.examples { background:url("../img/help/header_nav-examples.png") no-repeat; }
.terms #header ul.nav li a.progress { background:url("../img/help/header_nav-progress.png") no-repeat; }
.terms #header ul.nav li a.about { background:url("../img/help/header_nav-about.png") no-repeat; }
.privacy #header ul.nav li a.home { background:url("../img/help/header_nav-home.png") no-repeat; }
.privacy #header ul.nav li a.examples { background:url("../img/help/header_nav-examples.png") no-repeat; }
.privacy #header ul.nav li a.progress { background:url("../img/help/header_nav-progress.png") no-repeat; }
.privacy #header ul.nav li a.about { background:url("../img/help/header_nav-about.png") no-repeat; }


#header ul.nav li a.home:active,
#header ul.nav li a.home:focus {
	background-position-x:-96px;
	}
#header ul.nav li a.examples:active,
#header ul.nav li a.examples:focus {
	background-position-x:-108px;
	}
#header ul.nav li a.progress:active,
#header ul.nav li a.progress:focus {
	background-position-x:-102px;
	}
#header ul.nav li a.about:active,
#header ul.nav li a.about:focus {
	background-position-x:-96px;
	}

.home #header ul.nav li a.home:active,
.home #header ul.nav li home:focus,
.examples #header ul.nav li a.examples:active,
.examples #header ul.nav li a.examples:focus,
.progress #header ul.nav li a.progress:active,
.progress #header ul.nav li a.progress:focus,
.about #header ul.nav li a.about:active,
.about #header ul.nav li a.about:focus {
	background-position-x:0;
	}


/* Footer */
/* ------------------------------------------------------- */
#footer {
	position:relative;
	height:160px;
	margin-top:-160px; /* negative value of footer height */
	clear:both;
	}
#footer .inner {
	position:relative;
	display:block;
	width:990px; height:60px;
	margin:0 auto;
	padding-top:100px;
	}
#footer .footerCon {
	display:block;
	padding:12px 0 25px 0;
	border-top:1px solid #B5D5E8;
	background:url("../img/home/footer_bg-lines.png") 0 16px no-repeat;
	}
#footer a.help {
	float:left;
	display:block;
	width:73px; height:66px;
	margin-right:18px;
	background:url("../img/home/footer_btn-help.png") no-repeat;
	text-indent:-200px;
	overflow:hidden;
	}
#footer a.logo {
	float:right;
	display:block;
	width:195px; height:66px;
	background:url("../img/home/footer_logo.png") no-repeat;
	text-indent:-200px;
	overflow:hidden;
	}
#footer p {
	color:#84BBD3;
	font-size:12px;
	line-height:21px;
	}
#footer p span {
	font-family:Georgia, Times New Roman, serif;
	font-style:italic;
	}
#footer p a { color:#4C83AE; }
	
/* FOOTER-EXAMPLES */
.examples #footer .footerCon {
	border-top:1px solid #333;
	background:url("../img/examples/footer_bg-lines.png") 0 16px no-repeat;
	}
.examples #footer a.help { background:url("../img/examples/footer_btn-help.png") no-repeat; }
.examples #footer p { color:#555; }
.examples #footer p a { color:#54788E; }

/* FOOTER-PROGRESS */
.progress #footer .footerCon {
	border-top:1px solid #759E4C;
	background:url("../img/progress/footer_bg-lines.png") 0 16px no-repeat;
	}
.progress #footer a.help { background:url("../img/progress/footer_btn-help.png") no-repeat; }
.progress #footer p { color:#668A42; }
.progress #footer p a { color:#E0FFA9; }

/* FOOTER-ABOUT */
.about #footer .footerCon {
	border-top:1px solid #80496E;
	background:url("../img/about/footer_bg-lines.png") 0 16px no-repeat;
	}
.about #footer a.help { background:url("../img/about/footer_btn-help.png") no-repeat; }
.about #footer p { color:#AD7B9E; }
.about #footer p a { color:#C69DBE; }
.about #footer a.logo {
	background:url("../img/about/footer_logo.png") no-repeat;
	}

/* FOOTER-SIGNUP */
.signup #footer .footerCon {
	border-top:1px solid #A1E9FF;
	background:url("../img/signup/footer_bg-lines.png") 0 16px no-repeat;
	}
.signup #footer a.help { background:url("../img/signup/footer_btn-help.png") no-repeat; }
.signup #footer p { color:#A1E9FF; }
.signup #footer p a { color:#BAF4FF; }
	
/* FOOTER-HELP */
.help #footer .footerCon,
.terms #footer .footerCon,
.privacy #footer .footerCon {
	border-top:1px solid #bbb;
	background:url("../img/help/footer_bg-lines.png") 0 16px no-repeat;
	}
.help #footer a.help,
.terms #footer a.help,
.privacy #footer a.help { background:url("../img/help/footer_btn-help.png") no-repeat; }
.help #footer p,
.terms #footer p,
.privacy #footer p { color:#666; }
.help #footer p a,
.terms #footer p a,
.privacy #footer p a { color:#54788E; }


#footer a.help:active,
#footer a.help:focus {
	background-position-x:-73px;
	}


/*============================================================
 =Home
============================================================*/
body {
	background:url("../img/home/bg_page.png") repeat-x #DEEFFF;
	}
.home #content #inner {
	height:1100px;
	background:url("../img/home/bg_mountain.png") -20px 22px no-repeat;
	}

.home #numbers {
	position:absolute;
	top:0; left:0;
	width:280px;
	padding-top:68px;
	text-align:center;
	}
.home #numbers .title {
	display:block;
	width:280px; height:52px;
	margin:15px 0 25px;
	background:url("../img/home/leftcol_title.png") center no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
	
.home #numbers .total {
	display:block;
	width:280px; height:118px;
	margin-bottom:12px;
	padding-top:62px;
	text-align:center;
	}
.home #numbers .total h2 {
	color:#609FC7;
	font-size:42px;
	font-weight:bold;
	line-height:1.0em;
	letter-spacing:-0.05em;
	}
.home #numbers .total h3 {
	padding:10px 0 6px;
	color:#84BCE0;
	font-size:26px;
	}
.home #numbers .total p {
	color:#84BCE0;
	font-size:14px;
	}
	
.home #numbers .projects {
	display:block;
	width:280px;
	margin-bottom:22px;
	text-align:center;
	}
.home #numbers .projects p {
	color:#98CCED;
	font-family:Georgia, Times New Roman, serif;
	font-style:italic;
	font-size:14px;
	}
.home #numbers .projects h2 {
	padding:8px 0 8px;
	color:#71A8C6;
	font-size:36px;
	font-weight:bold;
	line-height:1.0em;
	letter-spacing:-0.05em;
	}
.home #numbers .projects h3 {
	color:#90C6E0;
	font-size:22px;
	}
	
.home #numbers .images {
	display:block;
	width:280px;
	margin:12px 0 22px;
	text-align:center;
	}
.home #numbers .images p {
	color:#98CCED;
	font-family:Georgia, Times New Roman, serif;
	font-style:italic;
	font-size:14px;
	}
.home #numbers .images h2 {
	padding:8px 0 8px;
	color:#71A8C6;
	font-size:28px;
	font-weight:bold;
	line-height:1.0em;
	letter-spacing:-0.04em;
	}
.home #numbers .images h3 {
	color:#90C6E0;
	font-size:22px;
	}

#signupBubble {
	position:absolute;
	top:0; left:280px;
	width:707px; height:312px;
	background:url("../img/home/bubble_youronlineportfolio.png") no-repeat;
	}
#signupBubble h1 {
	position:absolute;
	top:0; left:0;
	width:400px;
	text-indent:-400px;
	overflow:hidden;
	}
#signupBubble a {
	display:block;
	width:289px; height:312px;
	margin-left:417px;
	background:url("../img/home/btn_signup.png") no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
#signupBubble .unicorn {
	display:block;
	position:absolute;
	bottom:-155px; right:230px;
	width:210px; height:204px;
	background:url("../img/home/img_unicorn.png") no-repeat;
	}

#demoBtn {
	display:block;
	position:absolute;
	top:265px; right:30px;
	width:181px; height:147px;
	}

#truefacts {
	position:absolute;
	top:490px; right:5px;
	width:390px; height:390px;
	}
#truefacts h2 {
	width:390px; height:30px;
	margin-bottom:15px;
	background:url("../img/home/truefacts_title.png") no-repeat;
	text-indent:-300px;
	overflow:hidden;
	}
#truefacts ul li {
	color:#84BCE0;
	font-size:22px;
	line-height:36px;
	text-align:center;
	}
	
/*============================================================
 =Examples
============================================================*/
body.examples {
	background:url("../img/examples/bg_page.png") repeat-x #111;
	}
	
/* Sift Column */
.examples .col2 {
	position:relative;
	width:280px; height:500px;
	padding-top:58px;
	background:url("../img/examples/leftcol_bg-main.png") 0 12px no-repeat;
	}

.examples .col2 .title {
	width:280px; height:52px;
	margin:15px 0 10px;
	background:url("../img/examples/leftcol_title.png") center no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
.examples .col2 .tagline {
	margin-bottom:47px;
	padding:0 20px;
	color:#777;
	line-height:1.4em;
	text-align:center;
	}

.examples .col2 ul {
	height:347px;
	margin:0 0 18px 0;
	padding:15px;
	background:#222;
	}
.examples .col2 ul li  {
	padding:2px 0;
	}
.examples .col2 ul li a {
	display:block;
	color:#ddd;
	font-size:18px;
	line-height:32px;
	}
.examples .col2 ul li a span {
	
	}
.examples .col2 ul li.all {
	margin-bottom:5px;
	padding-bottom:5px;
	border-bottom:1px solid #333;
	}
.examples .col2 ul li.current a {
	color:#FFD400;
	}

#oldlistingBtn {
	display:block;
	width:280px; height:179px;
	margin:20px 0 0 0;
	background:url("../img/examples/btn_oldlisting.png") no-repeat;
	}

/* List Column */
.examples .col1 {
	float:right;
	position:relative;
	width:690px;
	margin-bottom:80px;
	}

.examples .numbers {
	height:30px;
	margin-bottom:5px;
	padding:0 20px;
	line-height:30px;
	color:#666;
	}
.examples .showing {
	float:right;
	height:30px;
	padding:0 20px;
	margin-bottom:5px;
	line-height:30px;
	color:#666;
	}

.featuredCon {
	display:block;
	position:relative;
	width:690px; height:186px;
	margin-bottom:20px;
	cursor:pointer;
	}
.featuredCon img {
	width:674px; height:170px;
	padding:8px;
	}
.featuredCon .awesome {
	display:block;
	position:absolute;
	top:4px; left:4px;
	width:98px; height:98px;
	background:url("../img/examples/icn_awesome1.png") no-repeat;
	}
.featuredCon .date {
	display:block;
	position:absolute;
	top:8px; left:280px;
	width:60px; height:86px;
	padding:14px 0 0 0;
	text-align:center;
	background:#F4511E;
	}
.featuredCon .date .month {
	display:block;
	color:#fff;
	font-weight:bold;
	font-size:21px;
	}
.featuredCon .date .day {
	display:block;
	margin-top:4px;
	color:#fff;
	font-size:32px;
	font-weight:bold;
	line-height:28px;
	letter-spacing:-0.05em;
	}
.featuredCon .date .year {
	display:block;
	color:#eee;
	font-size:16px;
	}
	
.featuredCon .details {
	display:block;
	position:absolute;
	top:20px; right:0;
	width:310px;
	padding:10px;
	background:url("../img/bg_trans-bla60.png");
	}
.featuredCon .details .name {
	display:block;
	margin-bottom:2px;
	color:#fff;
	font-size:28px;
	line-height:30px;
	letter-spacing:-0.02em;
	}
.featuredCon .details .talent {
	display:block;
	color:#bbb;
	font-size:18px;
	line-height:28px;
	letter-spacing:-0.01em;
	}
	
/* Pagination */
ul.paging {
	padding-top:20px;
	}
ul.paging li {
	float:left;
	margin-right:10px;
	}
ul.paging li a {
	display:block;
	width:30px; height:30px;
	background:#222;
	color:#ccc;
	text-align:center;
	line-height:30px;	
	}
ul.paging li.text a {
	width:70px;
	}

/*============================================================
 =Progress
============================================================*/
body.progress {
	background:url("../img/progress/bg_page.png") repeat-x #97CC62;
	}

/* Title Column */
.progress .col2 {
	position:relative;
	width:280px; height:200px;
	padding-top:60px;
	background:url("../img/progress/leftcol_bg-main.png") 0 12px no-repeat;
	}

.progress .col2 .title {
	width:280px; height:60px;
	margin:15px 0 10px;
	background:url("../img/progress/leftcol_title.png") center no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
.progress .col2 .tagline {
	margin-bottom:30px;
	padding:0 20px;
	color:#759E4C;
	line-height:1.4em;
	text-align:center;
	}

/* Content Column */
.progress .col1 {
	float:right;
	position:relative;
	width:710px;
	}
	
#start {
	min-height:760px;
	background:url("../img/progress/profile_start-bg-mountain.png") top center no-repeat;
	}
#start .inner {
	position:relative;
	width:990px;
	margin:0 auto;
	}
	
.startContent {
	position:relative;
	padding-right:215px;
	padding-bottom:10px;
	}
.startContent .startSliver {
	display:block;
	position:absolute;
	top:-82px; left:0;
	width:294px; height:82px;
	background:url("../img/progress/profile_start-sliver.png") no-repeat;
	}
.startContent h2 {
	padding:5px 0 45px 290px;
	}
.startContent h3 {
	padding:0 0 35px 290px;
	color:#4F5F69;
	font-size:24px;
	line-height:32px;
	letter-spacing:-0.05em;
	}
.startContent p {
	margin-left:290px;
	font-size:13px; 
	padding-bottom:1.6em;
	line-height:1.6em;
	}
.startContent .teamPolaroid {
	display:block;
	position:absolute;
	top:-310px; right:16px;
	width:182px; height:408px;
	background:url("../img/progress/profile_start-polaroid-team.png") no-repeat;
	}
.startContent .updateLinks {
	display:block;
	position:absolute;
	top:130px; right:0;
	width:200px; height:250px;
	text-align:center;
	}
.startContent .updateLinks p {
	margin:12px 0 8px 0;
	padding:0;
	color:#97ADBA;
	font-size:13px;
	font-family:Georgia, Times New Roman, serif;
	font-style:italic;
	line-height:1.4em;
	}


/*============================================================
 =About
============================================================*/
body.about {
	background:url("../img/about/bg_page.png") repeat-x #613854;
	}
#who {
	position:relative;
	height:320px;
	background:url("../img/about/leftcol_bg-main.png") 0 12px no-repeat;
	}
#who .leftcol {
	position:relative;
	width:280px;
	padding-top:60px;
	}
#who .leftcol .title {
	width:280px; height:60px;
	margin:15px 0 10px;
	background:url("../img/about/leftcol_title.png") center no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
#who .leftcol .tagline {
	margin-bottom:30px;
	padding:0 20px;
	color:#613854;
	line-height:1.4em;
	text-align:center;
	}
	
#who .heads {
	float:right;
	position:relative;
	width:705px;
	}
#who .heads .spencer {
	display:block;
	position:absolute;
	top:0; left:1px;
	width:240px; height:271px;
	background:url("../img/about/heads_bg-spencer.png") no-repeat;
	}
#who .heads .dave {
	display:block;
	position:absolute;
	top:0; left:237px;
	width:232px; height:266px;
	background:url("../img/about/heads_bg-dave.png") no-repeat;
	}
#who .heads .jason {
	display:block;
	position:absolute;
	top:2px; right:1px;
	width:237px; height:266px;
	background:url("../img/about/heads_bg-jason.png") bottom no-repeat;
	}
	
.aboutBlock {
	position:relative;
	margin-bottom:50px;
	}
.aboutBlock .title {
	display:block;
	margin-left:290px;
	height:75px;
	background:#6E3F5F;
	color:#A3DCFF;
	overflow:hidden;
	text-indent:-990px;
	}
.aboutBlock .body {
	display:block;
	min-height:300px;
	padding:15px;
	padding-left:305px;
	background:url("../img/about/block_bg-body.png") repeat-x #613854;
	}
.aboutBlock .body p {
	padding-bottom:1.5em;
	color:#E0E0E0;
	}

.aboutBlock .floater {
	display:block;
	position:absolute;
	top:-44px; left:20px;
	width:242px; height:189px;
	background:url("../img/about/TEMP_block-floater.png") no-repeat;
	}
	
#story .title {
	background:url("../img/about/block_story-title.png") 2px no-repeat #6E3F5F;
	}
#story .floater {
	position:absolute;
	top:-100px; left:25px;
	width:225px; height:240px;
	background:url("../img/about/block_story-floater.png") no-repeat;
	}

#location .title {
	background:url("../img/about/block_location-title.png") 2px no-repeat #6E3F5F;
	}
#location .body {
	padding-left:15px;
	}
#location .address {
	display:block;
	position:absolute;
	bottom:256px; left:15px;
	width:255px; height:105px;
	padding-right:4px;
	color:#E3D5DF;
	background:url("../img/about/block_location-addressarrow.png") bottom right no-repeat;
	font-size:14px;
	line-height:20px;
	text-align:right;
	}
#location .address span {
	color:#C4B0BF;
	font-size:12px;
	}
	
#contact .title {
	background:url("../img/about/block_contact-title.png") 2px no-repeat #6E3F5F;
	}

#contact .body p {
	padding-bottom:3px;
	color:#C4B0BF;
	font-family:Georgia, Times New Roman, serif;
	font-style:italic;
	font-size:13px;
	}
#contact .body h3 {
	padding-bottom:1.2em;
	}

	
/*============================================================
 =Sign-up
============================================================*/
body.signup {
	background:url("../img/signup/bg_page.png") repeat-x #89d9f1;
	}
body.signup #header {
	margin-bottom:11px;
	}

.cephalopods {
	background:url("../img/signup/cephalopods_bg-main.png") top center no-repeat;
	}
	
/* Title Column */
.signup .col2 {
	position:relative;
	width:280px; min-height:587px;
	padding-top:60px;
	background:url("../img/signup/leftcol_bg-main.png") 0 20px no-repeat;
	}
.signup .col2 .title {
	width:280px; height:60px;
	margin:23px 0 12px;
	background:url("../img/signup/leftcol_title.png") center no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
.signup .col2 .tagline {
	margin-bottom:30px;
	padding:0 20px;
	color:#8ABEDB;
	line-height:1.4em;
	text-align:center;
	}
	
/* Matrix Column */
.signup .col1 {
	float:right;
	position:relative;
	width:710px;
	margin-bottom:40px;
	}
.signup .col1 #meh {
	display:block;
	position:absolute;
	top:0; left:0;
	width:335px; height:620px;
	text-align:center;
	}
.signup .col1 #meh a.signupCephalopod {
	display:block;
	width:335px; height:420px;
	background:url("../img/signup/btn_meh.png") no-repeat;
	}
/*  .signup .col1 #meh a.signupCephalopod:hover {
	background-position-x:-335px;
	} */
.signup .col1 #meh a.signupBtn {
	display:block;
	width:250px; height:75px;
	margin:10px auto;
	background:url("../img/signup/btn_meh-signup.png") no-repeat;
	overflow:hidden;
	text-indent:-400px;
	}
.signup .col1 #whoo {
	display:block;
	position:absolute;
	top:0; right:0;
	width:375px; height:620px;
	text-align:center;
	}
.signup .col1 #whoo a.signupCephalopod {
	display:block;
	width:375px; height:420px;
	background:url("../img/signup/btn_whoo.png") no-repeat;
	}
/* .signup .col1 #whoo a.signupCephalopod:hover {
	background-position-x:-375px; 
	}*/
.signup .col1 #whoo a.signupBtn {
	display:block;
	width:250px; height:75px;
	margin:10px auto;
	background:url("../img/signup/btn_whoo-signup.png") no-repeat;
	overflow:hidden;
	text-indent:-400px;
	}
.signup .col1 h3 {
	padding:12px 0 8px;
	color:#384044;
	font-weight:bold;
	font-size:18px;
	}
.signup .col1 p {
	color:#384044;
	font-size:16px;
	line-height:22px;
	}
	
	
/*============================================================
=Forms
============================================================*/
form textarea {
	padding:10px 5px 5px 10px;
	font-size:14px;
	line-height:20px;
	color:#222;
	font-family:Helvetica, Arial, sans-serif;
	}

form input.regular {
	font-size:14px;
	padding:2px;
	}	
form input.medium {
	height:26px;
	padding:3px 5px;
	font-size:21px;
	line-height:24px;
	color:#222;
	border:1px solid #ccc;
	}
form input.large {
	height:30px;
	padding:3px 5px;
	font-size:24px;
	line-height:30px;
	color:#222;
	border:1px solid #ccc;
	}
	
form span.fieldRow {
	display:block;
	margin-bottom:20px;
	}
form span.fieldRow label {
	display:block;
	float:left;
	width:160px;
	padding-right:20px;
	color:#555;
	font-size:14px;
	text-align:right;
	line-height:34px;
	}
form span.fieldRow .eg {
	display:block;
	margin-left:210px;
	color:#888;
	font-size:11px;
	line-height:22px;
	}
	
/* JN: Validation / Error Messages
------------------------------------------------------------*/

/* Default state (grey) */
span input.validated,
span textarea.validated {
	border-left: 5px solid #ccc;
	}

/* Error state (red) */
span.error input.validated,
span.error textarea.validated {
	border-left: 5px solid red;
	}

/* Ok state (green) */
span.ok input.validated,
span.ok textarea.validated { 
	border-left: 5px solid #97CC62; 
	}

span span.errorMessage {
	margin-left: 180px;
	padding-top: 3px;
	padding-bottom: 5px;
	color: red;
	font-weight: bold;
	font-size: 12px;
	display:none; /*hide by default*/
	}
	
span.error span.errorMessage {
	display:block;
	}

	
/* Sign-up Meh
------------------------------------------------------------*/
.signup .meh .col2 .title {
	background:url("../img/signup/leftcol_title-meh.png") center no-repeat;
	}
.formContainer {
	width:690px;
	margin:0 0 0 20px;
	padding:15px 0 5px 0;
	background:#FAFAFA;
	}
.formContainer h4 {
	margin:0 0 20px 180px;
	color:#999;
	font-family:Georgia, Times New Roman, serif;
	font-style:oblique;
	}
.meh .cephalopods {
	background:url("../img/signup/cephalopods_bg-main-meh.png") top center no-repeat;
	}
	
/*============================================================
 =Help
============================================================*/
body.help {
	background:url("../img/help/bg_page.png") repeat-x #DDD;
	}

/* List Column */
.help .col1 {
	float:right;
	position:relative;
	width:670px; min-height:700px;
	margin-bottom:80px;
	padding:20px;
	background:#fff;
	}
	
.helpTitle {
	margin:0 0 0 10px;
	padding-bottom:6px;
	color:#555;
	font-size:18px;
	line-height:1.4em;
	border-bottom:2px solid #ddd;
	}
.faqGroup {
	margin-bottom:20px;
	padding:15px 15px 5px 0;
	
	}
.faqGroup ul li {
	font-size:14px;
	line-height:24px;
	}
.faqGroup ul li a {
	color:#37627F;
	}
.faqGroup ul li.more {
	padding:4px 0 0 12px;
	}
.faqGroup ul li.more a {
	color:#4C83AE;
	font-weight:bold;
	text-decoration:underline;
	}

.topFaqs {
	margin-bottom:30px;
	background:#FFF7D6;
	border-top:2px solid #FFC84D;
	border-right:2px solid #FFC84D;
	}
.topFaqs ul {
	margin-left:10px;
	}
.topFaqs ul li {
	font-size:16px;
	line-height:28px;
	}
	
	
/* Help Links Column */
.help .col2 {
	position:relative;
	width:280px; height:500px;
	padding-top:58px;
	background:url("../img/help/leftcol_bg-main.png") 0 12px no-repeat;
	}

.help .col2 .title {
	width:280px; height:60px;
	margin:15px 0 50px;
	background:url("../img/help/leftcol_title.png") center no-repeat;
	text-indent:-400px;
	overflow:hidden;
	}
	
.help .col2 a {
	color:#4C83AE;
	}
.help .col2 ul {
	margin:0 0 18px 0px;
	padding:15px;
	background:#eee;
	}
.help .col2 ul li a {
	display:block;
	color:#4C83AE;
	font-size:16px;
	line-height:27px;
	}
.help .col2 ul li.all {
	margin-bottom:5px;
	padding-bottom:5px;
	border-bottom:1px solid #dadada;
	}
.help .col2 ul li.contact {
	margin-top:5px;
	padding-top:5px;
	border-top:1px solid #dadada;
	}	

.help .col2 p {
	margin-bottom: 6px;
	font-size: 12px;
	line-height: 22px;
	}
.help .col2 p, .help .col2 ol, .help .col1 ul {
	margin-bottom: 18px;
	font-size: 16px;
	line-height: 28px;
	}

.help .col2 p a, .help .col2 li a {
	color:#37627F;
	}
	
/*============================================================
 =Signin
============================================================*/
body.signin {
	background:url("../img/signin/bg_page.png") repeat-x #DEEFFF;
	}
#signinLogo {
	margin:10px 0;
	text-align:center;
	}
#signinBlock {
	padding-top:70px;
	height:700px;
	background:url("../img/signin/bg_form.png") top center no-repeat;
	}
#signinBlock .formContainer {
	display:block;
	width:330px; 
	margin:0 auto;
	padding:0 45px 0 35px;
	background:transparent;
	}
#signinBlock .formContainer .signinRow {
	display:block;
	margin-bottom:15px;
	}
#signinBlock .formContainer .signinRow label {
	display:block;
	padding-bottom:6px;
	font-size:18px;
	color:#888;
	}
#signinBlock .formContainer .signinRow .fillin {
	padding:4px;
	border:1px solid #ccc;
	font-size:18px;
	}
#signinBlock .formContainer .signinRow .errorMessage { margin-left:0px; }

/*============================================================
 =Reset
============================================================*/
.reset #signinBlock {
	padding-top:30px;
	height:700px;
	background:url("../img/signin/bg_form-blank.png") top center no-repeat;
	text-align:center;
	}
.reset #signinBlock h3 {
	margin-bottom:10px;
	padding-bottom:15px;
	border-bottom:1px solid #ddd;
	font-size:18px;
	text-align:center;
	color:#888;
	}
.reset #signinBlock p.description {
	margin-bottom:20px;
	color:#aaa; 
	font-size:12px;
	text-align:center;
	}


/*============================================================
 =Terms & Privacy
============================================================*/
body.terms,
body.privacy {
	background:url("../img/help/bg_page.png") repeat-x #DDD;
	}

/* Content Column */
.legalContentColumn {
	float:right;
	position:relative;
	width:670px; min-height:700px;
	margin-bottom:80px;
	padding:20px;
	background:#fff;
	color:#666;
	}
.legalContentColumn h1 {
	margin-bottom:12px;
	}
.legalContentColumn h2 {
	margin-bottom:12px;
	}
.legalContentColumn p {
	padding-bottom:1.5em;
	line-height:1.5em;
	}
	
.legalContentColumn ol {
	margin-bottom:15px;
	padding-left:2.5em;
	list-style:decimal;
	}
.legalContentColumn ol.alpha {
	list-style:lower-alpha;
	}
.legalContentColumn ol li {
	margin-bottom:6px;
	}
	
/* Title Column */
.legalTitleColumn {
	position:relative;
	width:280px; height:500px;
	padding-top:58px;
	background:url("../img/help/leftcol_bg-main.png") 0 12px no-repeat;
	}

.legalTitleColumn .title {
	width:280px; height:60px;
	margin:15px 0 50px;
	background:url("../img/legal/leftcol_title.png") center no-repeat;
	}