/* -- VIEWPORT & DEFAULTS -------------------------------------------------------------------------------------------------------------------------------------- */
body {
	font-size: 100%;
	background: #dcdcdc url(images/ie_bg.png) no-repeat fixed center center;
	margin: 0;
	padding: 0;
}
body * {
	margin: 0;
	padding: 0;
	list-style: none;
}

img { border: none; }

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------- PORTFOLIO SPECIFIC ---------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------ positioning ------------------------------------------------------------------------------------------------------------------------------ */

.portfolio #logo {
	position: fixed;
	top: 0px;
	right: 0px;
	z-index: 10;
}
.portfolio #header {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 6;
}
.portfolio #footer {
	position: fixed;
	bottom: 0px;
	left: 0px;
	width: 100%;
	z-index: 5;
}


/* -- LOGO ----------------------------------------------------------------------------------------------------------------------------------------------------- */
#logo {
	position: absolute;
	top: 0;
	right: 0;
	background: url(images/wordmark4.png) no-repeat scroll;
	width: 150px;
	height: 150px;
	z-index: 10;
}


/* -- HEADER --------------------------------------------------------------------------------------------------------------------------------------------------- */
#header {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 6;
	border-top: .5em solid #333;
	font: bold 1em "Trebuchet MS", sans-serif;
	color: #fff;
}
#header ul {
	float: left;
	padding-left: 1em;
}
#header ul li { float: left; }
#header a {
	font: bold .9em "Trebuchet MS", sans-serif;
	text-decoration: none;
	color: #333;
	padding: .175em .75em .375em;
	display: block;
}
#header a:hover { color: #eee; }

#header a.portfolio { background: url(images/bg_tab-1-off.gif) repeat-x bottom right scroll; }
#header a:hover.portfolio { background: url(images/bg_tab-1-on.gif) repeat-x bottom right scroll; }

#header a.fun { background: url(images/bg_tab-2-off.gif) repeat-x bottom right scroll; }
#header a:hover.fun { background: url(images/bg_tab-2-on.gif) repeat-x bottom right scroll; }

#header a.about { background: url(images/bg_tab-3-off.gif) repeat-x bottom right scroll; }
#header a:hover.about { background: url(images/bg_tab-3-on.gif) repeat-x bottom right scroll; }

#header a.resume { background: url(images/bg_tab-4-off.gif) repeat-x bottom right scroll; }
#header a:hover.resume { background: url(images/bg_tab-4-on.gif) repeat-x bottom right scroll; }

#header a.home { background: url(images/bg_tab-5-off.gif) repeat-x bottom right scroll; }
#header a:hover.home { background: url(images/bg_tab-5-on.gif) repeat-x bottom right scroll; }

.portfolio #header a.portfolio,
.fun #header a.fun,
.about #header a.about,
.resume #header a.resume,
.home #header a.home {
	color: #fff;
	background: url(images/bg_tab-current.gif) repeat-x bottom right scroll;
	font-size: 1.02em;
}


/* -- FAKE LOADER OVERLAY -------------------------------------------------------------------------------------------------------------------------------------- */
.portfolio #fakeloader {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 2;
	background: url(images/ajax-loader.gif) no-repeat center center fixed;
}


/* -- IMAGE OVERLAY ---------------------------------------------------------------------------------------------------------------------------------------------- */
.portfolio #imgbox {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 3;
}
.portfolio #mainImg { display: none; }

.portfolio #splashbox {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 3;	
}
.portfolio #splashbox a {
	display: block;
	width: 100%;
	height: 50px;
	position: absolute;
	top: 50%;
	text-align: center;
}

/* --- NAV ------------------------------------------------------------------------------------------------------------------------------------------------ */
.portfolio #nav {
	position: absolute;
	top: 3em;
	left: 1em;
	z-index: 4;
	text-align: left;
	color: #666;
}
.portfolio #nav ul {
	font: .7em "Trebuchet MS", sans-serif;
	vertical-align: top;
}
.portfolio #nav li {
	margin: .125em 0;
	display: inline;
}
.portfolio #nav a {
	text-decoration: none;
	color: #333;
	padding: 0 .35em;
	font-weight: bold;
}
.portfolio #nav a:hover {
	background: url(images/bg_nav-ltgray.gif) no-repeat top right scroll;
	color: #333;
}
.portfolio #nav li.current a {
	background: url(images/bg_nav-current.gif) no-repeat top right scroll;
	color: #eee;
}
.portfolio #nav.reverse { color: #fff; }
.portfolio #nav.reverse a {
	background: url(images/bg_nav.gif) no-repeat top right scroll;
	color: #eee;
}
.portfolio #nav.reverse a:hover {
	background: url(images/bg_nav-dkgray.gif) no-repeat top right scroll;
	color: #fff;
}
.portfolio #nav.reverse li.current a {
	background: url(images/bg_nav-current.gif) no-repeat top right scroll;
	color: #fff;
}

/* --- INFO ------------------------------------------------------------------------------------------------------------------------------------------------ */
.jswarning { background-color: white; border: 2px solid red; padding: .25em .5em; color: black; font: bold .7em/1.3em Verdana, Arial, Helvetica, sans-serif; }

.portfolio #info {
	position: fixed;
	bottom: .5em;
	left: 1em;
	z-index: 10;
	text-align: left;
	color: #666;
}
.portfolio #info .infotab {
	font: .8em/1.3em "Trebuchet MS", Verdana, sans-serif;
	padding: .2em 0 0 .75em;
	display: block;
	width: 3.5em;
	background: url(images/bg_infotab.gif) no-repeat top right scroll;
	color:#fff;
	text-decoration: none;
	font-weight: bold;
	cursor: pointer;
}
.portfolio #info .infotab span.updownarrow { background: url(images/arrow_updown.gif) no-repeat center .5em scroll; }
.portfolio #info #mydiv {
	background: url(images/bg_infobox.gif) no-repeat top right scroll;
	width: 40em;
	overflow: hidden;
	height: 15em;
}
.portfolio #infobox {
	position: relative;
	width: 38em;
	height: 12em;
	overflow: auto;
	top: 1em;
	left: 1em;
}
.portfolio #infobox h2 {
	color: #eee;
	font: bold 1.2em "Trebuchet MS", Futura, sans-serif;
}
.portfolio #infobox p {
	margin: 1em 0;
	padding-right: 1em;
	color: #ccc;
	font: .7em/1.3em Arial, Helvetica, sans-serif;
}
.portfolio #infobox a { color: #fff; text-decoration: none; }
.portfolio #infobox a:hover { text-decoration: underline; }
.portfolio #infobox dl {
	color: #666;
	font: .7em/1.3em Arial, Helvetica, sans-serif;
	border: 1px solid #666;
	float: right;
	margin-left: 1em;
	margin-bottom: .5em;
	padding: .5em 1em;
}
.portfolio #infobox dt { margin: .25em 0; }
.portfolio #infobox dd {
	color: #ccc;
	margin-bottom: .5em;
}
.portfolio #infonote {
	position: relative;
	top: 2.9em;
	left: 1.3em;
	font: bold .7em/1.3em Arial, Helvetica, sans-serif;
	color: #aaa;
}

/* --- SUBNAV ------------------------------------------------------------------------------------------------------------------------------------------------ */
.portfolio #subnav {
	position: fixed;
	bottom: .5em;
	left: 6.5em;
	z-index: 10;
	text-align: left;
	color: #666;
}
.portfolio #subnav ul {
	display: inline;
	vertical-align: bottom;
}
.portfolio #subnav li { display: inline; }
.portfolio #subnav a {
	font: .8em/1.3em "Trebuchet MS", Verdana, sans-serif;
	background: url(images/bg_nav.gif) no-repeat top right scroll;
	color: #ddd;
	text-decoration: none;
	font-weight: bold;
	float: left;
	padding: .2em .5em 0 .5em;
}
.portfolio #subnav a:hover {
	background: url(images/bg_nav-dkgray.gif) no-repeat top right scroll;
	color: #fff;
}
.portfolio #subnav li.current a {
	background: url(images/bg_nav-current.gif) no-repeat top right scroll;
	color: #eee;
}
.portfolio #subnav li.live a {
	position: relative;
	left: 1em;
	background: transparent url(images/bg_infotab.gif) no-repeat top right scroll;
	padding-right: .75em;
	color: #eee;
}
.portfolio #subnav li.live a:hover { color: #fff; }
.portfolio #subnav li a span.livearrow { background: url(images/arrow_live.gif) no-repeat center center scroll; }




/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------- JOURNAL SPECIFIC ------------------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.strikethrough {
	text-decoration: line-through;
}

#sweet_bg {
	position: absolute;
	top: 0;
	left: 0;
	/* background: url(images/tree1.png) no-repeat top left scroll; */
	width: 600px;
	height: 600px;
	z-index: 2;
}

/* --- SIDEBAR ------------------------------------------------------------------------------------------------------------------------------------------------ */
#sidebar {
	position: absolute;
	top: 3.5em;
	left: 2em;
	width: 16em;
	z-index: 2;
	text-align: right;
}
#sidebar #welcome {
	height: 4.5em;
	position: relative;
}
body.journal #sidebar #welcome h1 {
	display: block;
	width: 280px;
	height: 40px;
	position: absolute;
	bottom: 0px;
	background:url(images/johnmears_280x40.gif) no-repeat left bottom scroll;
}
body.journal #sidebar #welcome h1 span {
	display: none;
}

#sidebar #welcome p {
	font: .7em/1.3em Helvetica, Arial, sans-serif;
	color: #666;
	text-align: left;
	position: absolute;
	bottom: .25em;
	left: 1px;
}
#sidebar #wp_box { text-align: left; }
#sidebar #wp_box p.browsingnote {
	font: .7em/1.3em Helvetica, Arial, sans-serif;
	color: #666;
	text-align: left;
	margin: .5em 0;
}
#sidebar #wp_box p.browsingnote a {
	text-decoration: none;
	color: #07e;
}
#sidebar #wp_box p.browsingnote a:hover { text-decoration: underline; }
#sidebar #wp_box form#searchform {
	margin-top: .5em;
}
#sidebar #wp_box form#searchform input#s {
	border: 1px solid #666;
	padding: 1px;
	width: 8em;
	font: .7em "Trebuchet MS", Verdana, sans-serif;
}
#sidebar #wp_box form#searchform input#searchsubmit {
	background: url(images/bg_nav-current.gif) no-repeat top right scroll;
	padding: 1px;
	color: #eee;
	font: bold .7em "Trebuchet MS", Verdana, sans-serif;
	border: none;
}
#sidebar #wp_box ul {
	float: left;
	margin: .5em 1.5em .5em 0;
}
#sidebar #wp_box li h3 {
	font: bold 1.1em/1.3em "Trebuchet MS", Verdana, sans-serif;
	color: #555;
}
#sidebar #wp_box li { font: .7em/1.5em Helvetica, Verdana, Arial, sans-serif; }
#sidebar #wp_box li a {
	text-decoration: none;
	color: #07e;
}
#sidebar #wp_box li a:hover { text-decoration: underline; }
#sidebar #lastfm_box {
	clear: left;
	text-align: center;
	padding: 1em 0;
	margin-top: .5em;
	border-top: 1px solid #ccc;
}

/* --- journal and resume -------------------------------------------------------------------------------------------------------------------------------------- */
#container {
	margin: 5.6em 0px 5em 21em;
	position: relative;
	z-index: 3;
}

/* --- POSTS --------------------------------------------------------------------------------------------------------------------------------------------------- */
#container .navigation {
	width: 28em;
	position: absolute;
	top: -2em;
	left: 0;
}
#container .navigation .alignleft {
	display: inline;
	margin-left: .125em;
}
#container .navigation .alignright {
	display: inline;
	padding-left: .125em;
}
#container .navigation .alignleft,
#container .navigation .alignright {
	font: .7em/1.6em Helvetica, Verdana, Arial, sans-serif;
	color: #555;
}
#container .navigation .alignleft a,
#container .navigation .alignright a {
	color: #07e;
	text-decoration: none;
}
#container .navigation .alignleft a:hover,
#container .navigation .alignright a:hover { text-decoration: underline; }
#container h2.pagetitle {
	position: absolute;
	top: -1.9em;
	left: 0;
	font: bold 1.5em/1.5em "Trebuchet MS", Futura, sans-serif;
	color: #888;
}
#container .post {
	margin-bottom: 2em;
	position: relative;
	clear: both;
}
#container .post a {
	color: #07e;
	text-decoration: none;
}
#container .post a:hover { text-decoration: underline; }
#container .post a.more-link {
	font: bold 1em/1.7em Helvetica, Verdana, Arial, sans-serif;
	margin: 1em 0;
}
#container .post p {
	font: .7em/1.6em Helvetica, Verdana, Arial, sans-serif;
	color: #444;
	margin: 1em 0;
}
#container .post p.date {
	width: 3.2em;
	padding: .5em 0;
	margin: 0 1em 1em 0;
	background: url(images/bg_datebox.gif) no-repeat top left scroll;
	text-align: center;
	float: left;
	position: relative;
	z-index: 3;
}
#container .post p.date span {
	display: block;
	color: #efefef;
	text-transform: uppercase;
	line-height:.8em;
}
#container .post p.date span.bigdate { font: 2em/1.1em "Trebuchet MS", Verdana, sans-serif; }
#container .post h2 {
	font: bold 2em/.9em "Trebuchet MS", Futura, sans-serif;
	color: #333;
	padding: .5em 2em 0 0;
	border-bottom: 1px solid #aaa;
	margin-bottom: .5em;
}
#container .post h2 span { position: relative; top: .1em; }
#container .post h2 span a { color: #08d; }
#container .post h2 span a:hover {
	text-decoration: none;
	color: #09f;
}
#container .post h2 + * { clear: both; } /* clears the float of the datebox for the first element after h2 */

#container .post h3 { font: 1.25em/1.1em "Trebuchet MS", Verdana, sans-serif; color: #889; margin: .5em 0 0; }

#container .post .postcontent {
	width: 28em;
	overflow: visible;
	position: relative;
	clear: both;
} /* check ie_overrides for clear:left; */

#container .post .extras {
	border-top: 1px solid #cdcdcd;
	border-bottom: 1px solid #cdcdcd;
	clear: both;
	padding: .125em 0;
	margin-top: 1em;
}
#container .post .extras p {
	margin: 0 5em 0 0;
	color: #888;
}

#container .post ul {
	margin: -.25em 0 1em 0;
}
#container .post ul li {
	font: .7em "Trebuchet MS", Futura, sans-serif;
	width: 36em;
	color: #333;
	margin: .25em 0;
	padding-left: 2em;
	background: url(images/bg_list-resume-dot.gif) no-repeat .5em .5em scroll;
}

#container .post .postpic { 
	padding: 15px;
	position: relative;
	left: -10px;
	clear: both;
}
#container .post .postpic.floatleft {
	float: left;
}
#container .post .postpic.floatright {
	float: right;
	left: 10px;
}
#container .post .postpic.pp450x300 {
	width: 450px;
	height: 300px;
	background: url(images/bg_postpic450x300.png);
}
#container .post .postpic.pp200x300 {
	width: 200px;
	height: 300px;
	background: url(images/bg_postpic200x300.png);
}
#container .post .postpic.pp200x133 {
	width: 200px;
	height: 133px;
	background: url(images/bg_postpic200x133.png);
}
#container .post .postpic.pp133x89 {
	width: 133px;
	height: 89px;
	background: url(images/bg_postpic133x89.png);
}

#container .post .picnote {
	margin-top: 0px;
}
#container .post .vidnote {
	margin-top: .25em;
}





/* --- COMMENTS ----------------------------------------------------------------------------------------------------------------------------------------------- */

#commentsbox { }
#commentsbox a {
	color: #07e;
	text-decoration: none;
}
#commentsbox a:hover { text-decoration: underline; }
#commentsbox .bubble1,
#commentsbox .bubble2 {
	width: 30px;
	height: 30px;
	margin-right: .5em;
	margin-top: .1em;
	float: left;
	position: relative;
	z-index: 3;
}
#commentsbox .bubble1 { background: url(images/bubble1.png) no-repeat top left scroll; }
#commentsbox .bubble2 { background: url(images/bubble2.png) no-repeat top left scroll; }
#commentsbox h3#comments {
	font: bold 1.5em/1em "Trebuchet MS", Futura, sans-serif;
	color: #333;
	padding: 0;
	border-bottom: 1px solid #aaa;
	margin-bottom: 1em;
}
#commentsbox h3#comments span {
	position: relative;
	bottom: -.155em;
}
#commentsbox h3 + * { clear: left; }
#commentsbox ol.commentlist { margin-bottom: 2em; }
#commentsbox ol.commentlist li { }
#commentsbox ol.commentlist li p {
	font: .7em/1.6em Helvetica, Verdana, Arial, sans-serif;
	color: #444;
	margin: 1em 0;
}
#commentsbox ol.commentlist li p.commentor { }
#commentsbox ol.commentlist li p.commentor img.avatar {
	margin-right: .5em;
	margin-bottom: -.75em;
	vertical-align: baseline;
}
#commentsbox ol.commentlist li p.commentmetadata { margin: 0; }
#commentsbox ol.commentlist li p cite { font: bold 1.5em/1em "Trebuchet MS", Futura, sans-serif; }
#commentsbox ol li .extras {
	border-top: 1px solid #cdcdcd;
	border-bottom: 1px solid #cdcdcd;
	clear: left;
	padding: .125em 0;
}
#commentsbox ol li .extras p {
	margin: 0;
	color: #888;
}
#commentsbox h3#respond {
	font: bold 1.5em/1em "Trebuchet MS", Futura, sans-serif;
	color: #333;
	padding: 0;
	border-bottom: 1px solid #aaa;
}
#commentsbox h3#respond span {
	position: relative;
	bottom: -.155em;
}
#commentsbox form p {
	font: .7em "Trebuchet MS", Verdana, sans-serif;
	margin: .5em 0;
}
#commentsbox form p input {
	border: 1px solid #666;
	padding: 1px;
	width: 8em;
}
#commentsbox form p input:focus { border-color: #09f; }
#commentsbox form div#commentstextarea { }
#commentsbox form div#commentstextarea p textarea {
	border: 1px solid #666;
	padding: 1px;
}
#commentsbox form div#commentstextarea p textarea:focus { border-color: #09f; }
#commentsbox form input#submit {
	background: url(images/bg_nav-current.gif) no-repeat top right scroll;
	padding: 1px;
	color: #eee;
	font: bold .7em "Trebuchet MS", Verdana, sans-serif;
	border: none;
}



/* --- RESUME / ABOUT / FUN -- COMMON -------------------------------------------------------------------------------------------------------------------------- */

body.resume #sidebar,
body.about #sidebar,
body.fun #sidebar {
	text-align: left;
	top: 3.5em;
	left: 2em;
	width: 15.5em;
}

body.resume #sidebar h2,
body.about #sidebar h2,
body.fun #sidebar h2 {
	font: bold .8em/1.4em "Trebuchet MS", Verdana, sans-serif;
	color: #444;
	margin: .5em 0 .25em 0;
}
body.resume #sidebar p,
body.about #sidebar p,
body.fun #sidebar p {
	font: .7em/1.3em Helvetica, Arial, sans-serif;
	color: #666;
	padding-right: .25em;
	margin: .25em 0 .75em 0;
}

body.resume #sidebar a,
body.about #sidebar a,
body.fun #sidebar a {
	font: bold 1em/2em "Trebuchet MS", Verdana, sans-serif;
	color: #07f;
	text-decoration: none;
	padding-left: 25px;
}

body.resume #sidebar a:hover,
body.about #sidebar a:hover,
body.fun #sidebar a:hover { text-decoration: underline; }


#resume div.star,
#about div.star,
#fun div.star {
	width: 40px;
	height: 40px;
	margin-top: 1.15em;
	background: url(images/starshape.png) no-repeat top left scroll;
	float: left;
	position: relative;
	z-index: 3;
	left: -.5em;
}
#resume div.star.edu { background: url(images/star_edu.png) no-repeat top left scroll; }
#resume div.star.exp { background: url(images/star_exp.png) no-repeat top left scroll; }
#resume div.star.aaa { background: url(images/star_aaa.png) no-repeat top left scroll; }
#resume div.star.tec { background: url(images/star_tec.png) no-repeat top left scroll; }
#fun div.star.mix { background: url(images/star_mix.png) no-repeat top left scroll; }
#fun div.star.mod { background: url(images/star_mod.png) no-repeat top left scroll; }
#fun div.star.abr { background: url(images/star_abr.png) no-repeat top left scroll; }
#about div.star.bio { background: url(images/star_bio.png) no-repeat top left scroll; }
#about div.star.hey { background: url(images/star_hey.png) no-repeat top left scroll; }

#resume h2,
#about h2,
#fun h2 { font: bold 2em/1.5em "Trebuchet MS", Futura, sans-serif; color: #333; padding: 0; border-bottom: 1px solid #aaa; padding-right: 2em; }

#resume h2 span,
#about h2 span,
#fun h2 span { position: relative; bottom: -.4em; }

#resume .section,
#about .section,
#fun .section { margin: 1em 0 2em 1em; padding-right: 2em; }

#resume .section h3,
#about .section h3,
#fun .section h3 { font: bold 1.1em "Trebuchet MS", Futura, sans-serif; color: #333; margin: .5em 0 0; }

#resume .section h3 span,
#about .section h3 span,
#fun .section h3 span { display: block; font-size: .7em; color: #777; }

#resume .section p,
#about .section p,
#fun .section p { color: #555; font: .7em "Trebuchet MS", Futura, sans-serif; margin: .25em 0; }



/* --- RESUME ------------------------------------------------------------------------------------------------------------------------------------------------- */

body.resume #sidebar #welcome { border-bottom: 1px solid #aaa; height: 5.125em; position: relative; }
body.resume #sidebar #welcome h1 { display: block; width: 280px; height: 40px; position: absolute; bottom: 0px; background:url(images/johnmears_280x40.gif) no-repeat left bottom scroll; }
body.resume #sidebar #welcome h1 span { display: none; }

body.resume #sidebar a.downloadpdf { background:url(images/pdf_icon.gif) no-repeat left center scroll; }

#resume .section span.dates { color: #999; font: .7em "Trebuchet MS", Futura, sans-serif; margin: .25em 0; }

#resume .section p.position { font: bold .8em "Trebuchet MS", Futura, sans-serif; color: #555; margin: .5em 0 0; }

#resume .section li {
	font: .7em "Trebuchet MS", Futura, sans-serif;
	width: 36em;
	color: #333;
	margin: .25em 0;
	padding-left: 2em;
	background: url(images/bg_list-resume-dot.gif) no-repeat .5em .5em scroll;
}
#resume .section .hr { width: 26em; border-bottom: 1px solid #ccc; margin: 1em 0; }
#resume .section .hr hr { display: none; }


/* --- ABOUT ------------------------------------------------------------------------------------------------------------------------------------------------ */

body.about #sidebar #welcome { border-bottom: 1px solid #aaa; height: 5.125em; position: relative; }
body.about #sidebar #welcome h1 { display: block; width: 280px; height: 40px; position: absolute; bottom: 0px; background:url(images/johnmears_280x40.gif) no-repeat left bottom scroll; }
body.about #sidebar #welcome h1 span { display: none; }

body.about #sidebar a.offsite { background:url(images/offsite_icon.gif) no-repeat left center scroll; }

body.about #sidebar #modellink { border-top: 1px solid #ccc; margin-top: 1em; padding-top: .75em; }
body.about #sidebar #modellink p { margin: 0; }
body.about #sidebar #modellink a { padding: 0; }
body.about #sidebar #modellink img {
	width: 200px;
	height: 133px;
	background: url(images/bg_postpic200x133.png);
	padding: 15px;
	position: relative;
	left: -10px;
}

#about .section .cheesepic {
	width: 200px;
	height: 133px;
	background: url(images/bg_postpic200x133.png);
	padding: 15px;
	position: relative;
	top: -5px;
	left: -10px;
	/* important */
	float: left;
}

#about .section p { width: 38em; }
#about .section p.mybio { 
	line-height: 2em;
	font-size: .75em;
}

#about .section #contactform { width: 38em; }
#about .section #contactform fieldset { border: none; }
#about .section #contactform legend { display: none; }
#about .section #contactform ol {  }
#about .section #contactform ol li { margin: .25em 0; }
#about .section #contactform ol li label { display: block; color: #333; font: .7em/1.5em "Trebuchet MS", Verdana, sans-serif;  }
#about .section #contactform ol li input,
#about .section #contactform ol li textarea { border: 1px solid #666; }
#about .section #contactform ol li input#submit {
	background: url(images/bg_nav-current.gif) no-repeat top right scroll;
	padding: 1px;
	color: #eee;
	font: bold .7em "Trebuchet MS", Verdana, sans-serif;
	border: none;
}
#about .section #contactform ol li input:focus,
#about .section #contactform ol li textarea:focus { border-color: #09f; }
/* --- FUN ------------------------------------------------------------------------------------------------------------------------------------------------ */

body.fun #sidebar #welcome { border-bottom: 1px solid #aaa; height: 5.125em; position: relative; }
body.fun #sidebar #welcome h1 { display: block; width: 280px; height: 40px; position: absolute; bottom: 0px; background:url(images/funstuff_280x40.gif) no-repeat left bottom scroll; }
body.fun #sidebar #welcome h1 span { display: none; }

#fun .section p.model { font: bold .8em "Trebuchet MS", Futura, sans-serif; color: #555; margin: .5em 0 0; }
#fun .section p.status { color: #999; font: .7em "Trebuchet MS", Futura, sans-serif; margin: .25em 0; }
#fun .section .modelpic {
 	width: 450px;
	height: 300px;
	background: url(images/bg_postpic450x300.png);
	padding: 15px;
	position: relative;
	top: -5px;
	left: -10px;
}

#fun .tracklist {
	color: #333;
	font: .7em/1.5em "Trebuchet MS", Futura, sans-serif;
	margin: .5em 0;
	padding-left: 1em;
	border-left: 5px solid #ccc;
	width: 40em;
}
#fun .tracklist li {
	list-style-type: decimal;
	list-style-position: inside;
}




/* --- FOOTER ------------------------------------------------------------------------------------------------------------------------------------------------ */
#footer {
	width: 100%;
	border-bottom: .5em solid #333;
	color: #ccc;
	clear: both;
}
#footer p {
	font: .7em "Trebuchet MS", Futura, sans-serif;
	text-align: right;
	margin: .5em 1em;
}
#footer p span { color: #888; }
#footer p a {
	color: #07e;
	text-decoration: none;
}
#footer p a:hover { text-decoration: underline; }



/* --- DEBUGGLING ------------------------------------------------------------------------------------------------------------------------------------------------ */
#debugging {
	position: fixed;
	z-index: 10;
	top: 40%;
	right: 5%;
	background: #f00;
	color: #fff;
	border: 1px solid #fff;
	padding: 1em;
	text-align: left;
}