/*
Theme Name: Spencehouse
Theme URI: http://www.spencehouse.com/
Description: My new theme for www.spencehouse.com
Version: 1.0
Author: Brent Tunney
Author URI: http://www.spencehouse.com/
Tags: white, custom header, fixed width, two columns, widgets

	Spencehouse v1.0
	http://spencehouse.com/

	This theme was designed and built by Brent Tunney,
	whose blog you will find at http://www.spencehouse.com/

	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/

/*
------------------------------------------------------------------------------------------------------------------------
RESET 
------------------------------------------------------------------------------------------------------------------------
*/

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;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* 
------------------------------------------------------------------------------------------------------------------------
Wordpress specific CSS
------------------------------------------------------------------------------------------------------------------------
*/

.aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.aligncenter img, .aligncenter p.wp-caption-text {
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.alignleft { float: left; }
.alignright { float: right; }
img.alignleft { display: inline; margin: 0 7px 2px 0; padding: 4px; }
img.alignright { display: inline; margin: 0 0 2px 7px; padding: 4px; }
.entry div.alignleft { float: left; margin: 0 8px 7px 0; }

/* Resizes the image to the maximum width of the content area */
.entry img {
  max-width: 560px;
  /* smooth image resizement in IE7+ */
  -ms-interpolation-mode: bicubic;
}

.wp-caption {
  background-color: #F0F0F0;
  border: 1px solid #E5E5E5;
  overflow: hidden;
  padding: 3px;
}

.wp-caption img { border: 0 none; margin: 0; padding: 0; }

.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
}

.more-link {
  background-color: #F8F7F6;
  border-bottom: 1px solid #ccc;
  font-size: 11px;
  padding: 5px 6px 3px;
  text-shadow: 0 1px 0 #fff;
}

.more-link:hover { background-color: #F8F7F6; border-bottom-color: #B3CDD8; color: #000; }

/* Tables and #wp-calendar */
table { color: #3E5867; width: 100%; }
caption { background-color: #F8F7F6; border-top: 1px solid #ccc; text-align: center; }
thead { background-color: #F8F7F6; text-align: center; }
tbody { background-color: #f7f7f7; text-align: center; }
tfoot { background-color: #fff; text-align: left; }
td#next { text-align: right; }


/* 
------------------------------------------------------------------------------------------------------------------------
LAYOUT 
------------------------------------------------------------------------------------------------------------------------
*/

/* HTML page container 
..............................*/
#page{
	width:980px;
	margin-left:auto;
	margin-right:auto;
}


/* Page content elements 
..............................*/
#header {
	width: 980px;
	height: 145px;
	background-color:#F8F7F6;
	margin-bottom: 60px;
}

#sidebar {
	float: left;
	width: 280px;
	background-color: #FFFFFF; /* #669999; */
	margin-left: 80px;
}

#content {
	float: left;
	width: 560px;
	background-color: #FFFFFF; /* #CCFFFF; */
	margin-left: 20px;
	margin-right: 20px;
}

#footer {
	width: 980px;
	height: 80px;
	margin-top: 80px;
	margin-left: 20px;
	border-top: 1px solid #999;
}

.flash_gallery {
	margin: 30px 0;
}

.cv_textblock {
	width: 560px;
	padding: 40px 0 40px 0;
}

.nocomments { padding: 0 28px; }
.nocomments { padding-bottom: 20px; }

/* 
------------------------------------------------------------------------------------------------------------------------
TEXT 
------------------------------------------------------------------------------------------------------------------------
*/

* { 
}
html {
	margin:0;
	padding:0;
	border:none;
	background: url('images/background-grey-145.gif') repeat-x top;

}
body {
	margin: 0;
	padding: 0;
	border:none;
	color: #666;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	font-size: 75%;					/* Font sizing in ems beyond this point. Original default 76%. 62.5% makes 1em=10px. 68.75% makes 1em=11px. 75% makes 1em-12px. */
	line-height: 1.4em; 			/* General line-height and also acts as IE 6 Peekaboo bug hack */
	text-align: left;				/* IE6> centering - reset to align left in page */
}
p {
	padding-top: 12px;
}

img {
	padding-top: 20px;
	}

a {
	color:#222;
	text-decoration: none;
}
a:hover {
	color:#222;
	text-decoration: underline;
}
h1 {
	color: #222;
	font-size: 1.8em;
	line-height: 1.8em;
	font-weight: normal;
	margin-bottom: 12px;
}
h2 {
	color: #222;
	font-size: 1.4em;
	line-height: 1.4em;
	font-weight: normal;
	margin-bottom: 8px;
}
h2 a {
	color: #222;
	text-decoration: none;
}
h2 a:hover {
	color:#FFF;
	background: #222222;
	text-decoration: none;
}

h3 {
	color: #222;
	font-size: 1em;
	line-height: 1em;
	font-weight: bold;
	margin-bottom: 0px;
	margin-top: 24px;
	letter-spacing: 1px;
}
h4, h5, h6 {
	color: #666;
	font-size: 1em;
	line-height: 1em;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 6px;
}
ul {
	list-style-type:disc;
	padding-left: 12px;
	margin-top: 12px;
	margin-left: 20px;
}
li {
	margin-top: 6px;
}

/* text for CV page
..............................*/

.cv_textblock h3 {
	font-size: 1.4em;
	line-height: 1.4em;
	color: #FF6400;
	margin-top: 12px;
	margin-bottom: 12px;
	border-top: solid 2px #FF6400;
	padding-top: 24px;
}

.cv_textblock h4 {
	font-size: 1.2em;
	line-height: 1.2em;
	color: #222;
	margin-top: 44px;
	letter-spacing: 1px;
}
.cv_textblock h5 {
	font-size: 1em;
	line-height: 1em;
	color: #222;
	margin-top: 24px;
	margin-bottom: 0px;
	margin-left: 40px;
}

.cv_textblock h5 a {
	text-decoration:none;
}

.cv_textblock h5 a:hover {
	background: #222;
	color: #FFF;
	text-decoration:none;
}

.cv_textblock p {
	margin-left: 40px;
	padding-top: 6px;
}

.cv_textblock ul {
	margin-left: 40px;
}

.cv_textblock .dates {
	color: #222;
	font-family: "Courier New", Courier, monospace;
	font-size: 100%;
	line-height: 1.4em;
	letter-spacing: 1px;
	padding-bottom: 10px;
	margin-left: 0px;
}


/* header logo
..............................*/
#header_logo {
	float: left;
	padding: 10px 0px 4px 0px;
	width:980px;
}


/* Global nav
..............................*/

#globalnav {
	float:left;
}

/* general settings */
ul#globalnav { 
	text-align: left; /* set to left, right or center */
	margin: 0em 0 1em 0; /* set margins as desired */
	font: 100% "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	font-weight: normal;
	/*border-bottom: 1px solid #464646; *//* set border COLOR as desired */
	list-style-type: none;
	padding: 44px 10px 5px 0px; /* THIRD number must change with respect to padding-top (X) below */
}

ul#globalnav li { /* do not change */
	display: inline;
}

/* settings for selected tab */
body#home li.tab1, 
body#experience li.tab2, 
body#my-work li.tab3, 
body#about-me li.tab4, 
body#ramble-on li.tab5,
body#contact li.tab6 { 
	border-bottom: 1px solid #fff; /* set border color to page background color */
	background-color: #fff; /* set background color to match above border color */
}

/* settings for selected tab link */
body#home li.tab1 a, 
body#experience li.tab2 a, 
body#my-work li.tab3 a, 
body#about-me li.tab4 a,
body#ramble-on li.tab5 a,
body#contact li.tab6 a { 
	background-color: #fff; /* set selected tab background color as desired */
	color: #666; /* set selected tab link color as desired */
	position: relative;
	top: 1px;
	padding-top: 6px; /* must change with respect to padding (X) above and below */
}

ul#globalnav li a { /* settings for all tab links */
	padding: 5px 20px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
	/*border: 1px solid #464646;*/ /* set border COLOR as desired; usually matches border color specified in #globalnav */
	background-color: #F8F7F6; /* set unselected tab background color as desired */
	color: #666; /* set unselected tab link color as desired */
	margin-right: 0px; /* set additional spacing between tabs as desired */
	text-decoration: none;
	border-bottom: none;
}

ul#globalnav a:hover { /* settings for hover effect */
	color: #222;
	background: #EAE9E8; /* set desired tab hover color */
}


/* sidebar
..............................*/
#sidebar h2 {
	font-weight: bold;
	color: #222;
	font-size: 1.0em;
	line-height: 1.0em;
	margin-top: 12px;
	letter-spacing: 1px;
}

#sidebar ul {
	color: #444;
	width: 100%;
	list-style:none;
	display: block;
	float: left;
	margin-bottom: 20px;
	padding-left: 0;
	margin-top: 0px;
	margin-left: 0px;
}

#sidebar li {
	margin-top: 0px;
}

#sidebar a {
	color:#444;
	text-decoration: none;
	margin-top: 10px;
}

#sidebar a:hover {
	color: #FFFFFF;
	background-color:#444;
	text-decoration: none;
}

/* sidebar - work
..............................*/
#sidebar.work h2 {
	font-weight: bold;
	color: #222;
	font-size: 1.0em;
	line-height: 1.0em;
	margin-top: 12px;
	letter-spacing: 1px;
}

#sidebar.work ul {
	color: #444;
	width: 100%;
	list-style:none;
	display: block;
	float: left;
	margin-bottom: 20px;
	padding-left: 0;
}

#sidebar.work li a:hover {
	color: #FFFFFF;
	background-color:#444;
	text-decoration: none;
}

#sidebar.work a {
	color:#666;
	text-decoration: none;
	margin-top: 10px;
}

#sidebar.work a:hover {
	color: #444;
	text-decoration: underline;
	background:#FFFFFF;
}


/* footer 
................................*/
#footer p {
	color:#999;
	font-size: 95%;
	padding-top: 8px;
}

#footer a {
	color: #999;
	text-decoration: underline;
}
#footer a:hover {
	color: #222;
	text-decoration: underline;
}

/* Post elements
................................*/
small {
	font-family: "Courier New", Courier, monospace;
	font-size: 100%;
	line-height: 1.4em;
	color: #999;
	letter-spacing: 1px;
	padding-bottom: 20px;
}

.postmetadata {
	margin: 24px 0 60px 0;
	padding: 6px 0 4px 0;
	font-size: 100%;
	line-height: 1.4em;
	color: #999;
	border-top: 1px solid #CCCCCC;
}

.postmetadata a {
	color: #444;
	text-decoration: none;
}
.postmetadata a:hover {
	color: #444;
	text-decoration: underline;
}

/* COMMENTS
------------------------------------------------------------------- */

h3#comments, h4#pings { float: left; }
h3#comments, #respond h3 { margin: 0 0 5px; font-size: 1.4em; }
#respond h3 { margin: 18px 0 5px 28px; }
h4#pings { line-height: 1.2; margin: 10px 0; width: 150px; }

/*
.comments-header,
.navigation { border-bottom: 1px solid #ccc; text-shadow: 0 1px 0 #fff; }
*/

.navigation {
  background-color: #F8F7F6;
  border-top: 1px solid #fff;
  font-size: 11px;
  height: auto;
  line-height: 28px;
  overflow: hidden;
  padding: 0 28px;
}

.comments-header { background-color: #F8F7F6; border-top: 1px solid #ccc; padding: 6px 28px; height:40px}
.comments-header-meta {
  float: right;
  font-size: 11px;
  font-weight: bold;
  line-height: 44px;
  padding: 4px 0 0 ;
}

.commentlist {
  background-color: #F8F7F6;
  border: 28px solid #F8F7F6;
  border-top: 0 none;
  font-size: 12px;
}
.pinglist { margin-top: 10px; width: 420px; float: right; }

li.pings {
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #fff;
  margin: 0;
  padding: 4px 10px;
  width: 400px;
}

.pings:first-child { border-top: none; }
.pings:last-child { border-bottom: none; }

.comment {
  background: transparent url(img/bg-comment.png) 10px 19px no-repeat;
  border-top: 28px solid #F8F7F6;
  border-left: 40px solid #F8F7F6;
}

.comment-body {
  background-color: #fff;
  color: #333;
  margin-left: 20px;  
  padding: 17px 20px 11px;
  position: relative;
}

.comment-body img.avatar {
  border: 1px solid #eee;
  padding: 2px;
  position: absolute;
  left: -60px;
}

ul.children { }
.comment ul.children li { border-top: 15px solid #ff00f6; }

.comment-meta {
  font-family: Georgia, serif;
  font-size: 11px;
  font-style: italic;
  position: absolute;
  right: 25px;
  top: 20px;
}
.comment-meta a { color: #999; }
.comment-author-admin { background-image: url(img/bg-comment-admin.png); }
.comment-author-admin > .comment-body { background-color: #F8F7F6; }
.comment p, .comment blockquote { padding: 0 0 7px; }
.comment blockquote p, .comment blockquote blockquote, .comment blockquote blockquote p { margin: 5px; padding: 7px; }
.commentlist cite, .commentlist cite a { }
.commentlist cite a { }

/* Not used */
li.thread-alt { }
.comment-author { }
.commentlist .thread-even { }
.commentlist .depth-1 { }
.commentlist .odd { }
.commentlist .even,
.commentlist .alt { }
.comment-author cite {
  background-color: #fff;
  border-bottom: 1px dotted #ccc;
  color: #666;
  display: block;
  font-family: Georgia, serif;
  font-style: italic;
  line-height: 16px;
  margin: 0 -7px 20px;
  padding: 3px 7px;
}
.comment-author-admin .comment-author cite { background-color: #F8F7F6; border-bottom-color: #ccc; }

.says { display: none; }
.comment div em { } /* comments awaiting moderation. */

.reply { font-size: 10px; font-weight: bold; overflow: hidden; }

a.comment-reply-link { 
  color: #666;
  display: block;
  float: right;
  padding: 2px 6px;
}
.comment-reply-link:hover { background-color: #fff; color: #333; }

#respond {
  background-color: #F8F7F6;
  margin-top: 100px;
  overflow: hidden;
  padding: 0 0 18px;
  width: 100%;
}

#commentform { padding: 18px 28px 0; }

.cancel-comment-reply,
.you-must-be-logged-in { padding: 0 0 0 28px; }

.respond-left { float: left; width: 42%; }
.respond-right { float: left; width: 58%; }

#respond label { display: block; font-size: 11px; height: 20px; margin: 3px 0 9px; width: 85%; }

input#author, input#email, input#url {
  border: 1px solid #ddd;
  color: #999;
  display: block;
  height: 15px;
  line-height: 15px;
  padding: 5px 3px;
  width: 85%;
}

textarea#comment {
  border: 1px solid #ddd;
  font-family: inherit;
  height: 150px;
  margin: 0 0 9px;
  padding: 5px 3px;
  width: 100%;
}

#respond input:focus,
textarea#comment:focus {
  color: #000;
  border-color: #aaa;
  -moz-box-shadow: 3px 3px 0px rgba(238,238,238,1);
  -webkit-box-shadow: 3px 3px #eee;
}

input#submit {
  background: #444 url(img/button-style.png) center left repeat-x;
  border: 1px solid #222;
  border-radius: 3px 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  height: 24px;
  line-height: 24px;
  padding: 0 10px;
}
