/*

/*  
Theme Name: Builing Block Design
Description: Builing Block Design's First Theme.
Version: 1.0
Author: TaylorMadeCreative
Author URI: http://www.taylormadecreative.com/

ToC
	0. *Global reset*
	1. defaults
	2. structure
	  2a. WordPress Structure - WP
	3. links and navigation
	4. fonts
	5. images
	6. tables
	7. forms
	8. Comments - WP
	9. Calendar - WP
	
Notes

*/

/* Global reset */
	/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
	
	*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
	table { border-collapse:collapse; border-spacing:0 }
	fieldset, img { border:0 }
	address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
	ol, ul, li { list-style:none }
	caption, th { text-align:left }
	h1, h2, h3, h5, h5, h6 { font-size:100% }
	q:before, q:after { content:''}





	/* Global reset-RESET */
	/* The below restores some sensible defaults */
	
	strong { font-weight: bold }
	em { font-style: italic }
	ol, ul, li { list-style:none }
	* a { position:relative } /* Gets links displaying over a PNG background */
	a { outline:none } /* Gets rid of Firefox's dotted borders */
	a img { border:none } /* Gets rid of IE's blue borders */


/* --------- 1. defaults  --------- */

* { margin: 0; padding: 0; }

body { text-align:center; background:#E6E6E6 url(images/bkg_tile.gif) top center repeat; }
		
/*  --------- 2. structure  --------- */

#wrapper { text-align: left; width: 760px; margin: 0 auto; height: auto; }
	
#mastheadtop { background:url(images/header_01.gif) no-repeat; width:760px; height:30px; }
#masthead { background:url(images/header_02.jpg) no-repeat; width:760px; height:81px; }

#logo { height:0px; width:0px; display:none; text-indent:-9999px; }
#navContainer { float:right; padding:12px 28px 0 0; }

#content { background:url(images/wraper_tile.jpg) repeat-y; padding:25px 0 0 0; min-height: 400px; }
#content2 { background:url(images/wraper_tile.jpg) repeat-y; padding:25px 0 50px 0; min-height: 400px; }
#content3 { background:url(images/wraper_tile.jpg) repeat-y; padding:25px 25px 50px; min-height: 400px; }
#contnetPad { padding:25px 25px 0 25px; }

.sidePad { padding:0 25px; }
.line { background:url(images/line_01.jpg) repeat-x; height: 3px; width: 100%; }
#hometop { height:280px; padding: 10px 25px 30px 25px; }
#worktop { padding: 10px 50px 50px 50px; }
.hometopalignleft { float:left; padding-right:5px; }

#bar { background:url(images/tile_bar.jpg) repeat-y; width: 760px; height:180px; }
#barContainer { padding:10px 25px 10px 25px; }
#barContainer2 { padding:25px 50px 25px 50px; }
#bar img { padding:0 3px 0 3px; }
/*#bar img { border:3px solid #EBF0F5; }*/

#homethreecol { padding:25px 25px 0 25px; }
.threeCol { width:710px; padding:25px; }

/* Modular Blocks */
.colContainer { width:710px; padding:25px; }
.colContainer2 { width:710px; padding:25px 0 0; }

.col2span { float:left; width:345px; padding:0 10px 0 0; }
.col3span { float:left; width:206px; padding:0 10px 0 0; }
.col4span { float:left; width:137px; padding:0 10px 0 0; }

div.col1 { width:230px; float:left; padding:0 5px 25px 0; }
div.col2 { width:230px; float:left; padding:0 5px 25px 5px; }
div.col3 { width:230px; float:left; padding:0 0 25px 5px; }
img.col1 { width:224px; float:left; margin:0 5px 25px 0; }
img.col2 { width:224px; float:left; margin:0 5px 25px 5px; }
img.col3 { width:224px; float:left; margin:0 0 25px 5px; }
div.col1big { width: 340px; padding: 25px 10px 50px 30px; float:left; }
div.col2big { width: 340px; padding: 25px 30px 50px 10px; float:left; }

#portfoliopad { padding:25px 20px 50px 20px; }
.portfoliopost { width: 340px; height: 380px; display:block; overflow:hidden; float:left; padding:10px 10px 25px 10px; }

p.readmoreWhite a { background:transparent url(images/readmore_white.gif) no-repeat scroll 40% 3pt; display:block; outline:none; }
p.readmoreWhite a:hover { border-bottom: 0px; }
p.readmoreYellow a { background:transparent url(images/readmore_yellow.gif) no-repeat scroll 100% 50%; padding-right:54px; line-height:20px; }
p.readmoreYellow a:hover { border-bottom: 0px; }

#homebot { padding:25px; }
#stickynote { background:url(images/stickynote.gif) no-repeat; width:230px; height:241px; float:left;padding:0 5px 25px 0; }
#stickynote h3 { color:#993333; font-size:14px; }
#stickynote a { color:#993333; font-size:11px; }
#stickynote a:hover { color:#993333; font-size:11px; text-decoration:none; border:none; }
#stickynote p { font: 78% Verdana, Arial, Helvetica, sans-serif; color:#000000; line-height: 11px; margin-top: -8px; }
.stickynotepad { padding:60px 28px 0 36px; }
#blueprint { background:url(images/blueprint.gif) no-repeat; width:230px; height:232px; float:left; padding:0 0 25px 5px; }

/* Side Bar */
/* #sidebar { padding: 20px 0 10px 0; margin-left: 545px; width: 190px; } */
#sidebar { width: 200px; float: right; padding: 0 25px 0 5px; }
#sidebar form { margin: 0; }

/* Footer */
#footer {
		background: url(images/footer.gif) no-repeat;
		width:760px;
		height:329px;
		}
.footerContainer { padding:7px 0 0 25px; }

.separator { clear: both; }
.separatorInvisible { clear: both; height: 1px; }
.clearFix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.break { display: none; height: 0px; }


/* -- 2a. WordPress Structures -- */

.narrowcolumn { float: left; width: 465px; padding:0 5px 0 25px; }
.widecolumn { float: left; width: 465px; padding:0 5px 0 25px; }

.post { margin:0 0 20px; padding:20px 0 20px; background:url(images/line_01.jpg) no-repeat bottom; width:100%; text-align: none; }

.post hr { display: block; }

.widecolumn .post { margin: 0; }

.narrowcolumn .postmetadata { padding-top: 5px; }

.widecolumn .postmetadata { margin: 30px 0; }

.widecolumn .smallattachment { text-align: center; float: left; width: 128px; margin: 5px 5px 5px 0px; }

.widecolumn .attachment { text-align: center; margin: 5px 0px; }

.postmetadata { /*clear: left;*/ padding:10px; margin:20px 0; border:1px solid #a5c6de; } 

/* ---------- 3. links and navigation ---------- */

a { color:#FFFF99; text-decoration:underline; }
		
a:hover { color:#FFFF99; text-decoration:none; /* border-bottom:1px solid #993333; */ }

#navigation { height:24px; display:block; float:right; }
#navigation ul { list-style-type: none; }
#navigation li { display: inline; font-size: 14px; padding-left: 10px; }
#navigation a { color:#EBF0F5; text-decoration:none; border-bottom:2px solid #993333; /* for IE /filter:alpha(opacity=100); /* CSS3 standard /opacity:1.0; /* for Mozilla / -moz-opacity:1.0; */}
#navigation a:hover { color:#FFFF99; text-decoration:none; /* for IE /filter:alpha(opacity=100); /* CSS3 standard /opacity:1.0; /* for Mozilla / -moz-opacity:1.0; */}

#subnavigation { height:24px; display:block; padding:4px 0 0; float:right; }
#subnavigation ul { list-style-type: none; }
#subnavigation li { display: inline; font-size: 11px; padding-left: 10px; }
#subnavigation a { color:#EBF0F5; text-decoration:none; border-bottom:2px solid #993333; /* for IE /filter:alpha(opacity=100); /* CSS3 standard /opacity:1.0; /* for Mozilla / -moz-opacity:1.0; */}
#subnavigation a:hover { color:#FFFF99; text-decoration:none; /* for IE /filter:alpha(opacity=100); /* CSS3 standard /opacity:1.0; /* for Mozilla / -moz-opacity:1.0; */}

/* Automation */
.home #navigation .current_page_item a, .work #navigation .current_page_item a, .blog #navigation .page-item-5 a, .clients #navigation .current_page_item a, .contact #navigation .current_page_item a {color:#FFFF99; text-decoration:none; }
.graphic-design #subnavigation .current_page_item a, .sculpture #subnavigation .current_page_item a, .photography #subnavigation .current_page_item a {color:#FFFF99; text-decoration:none; }
.graphic-design #navigation .current_page_parent a, .sculpture #navigation .current_page_parent a, .photography #navigation .current_page_parent a {color:#FFFF99; text-decoration:none; }
 
.navigationPost { width:710px; height:auto; display:block; margin-bottom:20px; }

.arrowLeft a { background:url(images/arrow.gif) no-repeat left; width:auto; height:20px; padding:4px 12px 0 24px; /*border-right:1px solid #4c4c2e;*/ color:#000; display:block; }
.arrowRight a { background:url(images/arrow.gif) no-repeat right; width:auto; height:20px; padding:4px 24px 0 12px; /*border-left:1px solid #4c4c2e;*/ color:#000; display:block; }

h1 a, h2 a, h3 a { text-decoration:none; }
h1 a:hover, h2 a:hover, h3 a:hover { text-decoration:underline; }

#footer ul { list-style-type: none; }

#footer li { display: inline; font-size: 14px; padding-left: 10px; }

#footer a { color:#EBF0F5; text-decoration:none; border-bottom:2px solid #993333; /* for IE /filter:alpha(opacity=100); /* CSS3 standard /opacity:1.0; /* for Mozilla / -moz-opacity:1.0; */}

#footer a:hover { color:#FFFF99; text-decoration:none; /* for IE /filter:alpha(opacity=100); /* CSS3 standard /opacity:1.0; /* for Mozilla / -moz-opacity:1.0; */}


/* ---------- 4. fonts ---------- */
    
html { font-size: 100%; }

body { font: 80%/110% Verdana, Arial, Helvetica, sans-serif; color:#EBF0F5; }

h1, h2, h3, h4, p, ul { }

h1 { font: 18px "Courier New", Courier, mono; text-transform:uppercase; color:#FFFF99; }
h2 { font: 16px "Courier New", Courier, mono; text-transform:uppercase; color:#FFFF99; }
h3 { font: 14px "Courier New", Courier, mono; text-transform:uppercase; color:#FFFF99; }
h4 { font: 12px "Courier New", Courier, mono; text-transform:uppercase; color:#FFFF99; }

p { font-family: Verdana, Arial, Helvetica, sans-serif; padding: 14px 0 0 0; }
ul { }
acronym, abbr, span.caps { cursor: help; }
acronym, abbr { border-bottom: 1px dashed #999; }
blockquote { margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid #ddd; }
blockquote cite { margin: 5px 0 0; display: block; }
.center { text-align: center; }
hr { display: none; }


/* ---------- 5. images ---------- */

a img {
		border: 0;
		}
		
img.thumbhorz { margin:25px 0 0 0; border:3px solid #EBF0F5; }
.thumbhorz a:hover { border:3px solid #FFFF99; }

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
.alignright { float: right; }
.alignleft { float: left }
		
/* ---------- 6. tables ---------- */

table { }
		
caption { }
		
tr { }

th, td { }
		
th { }
		
td { }

/* ---------- 7. forms ---------- */	
		
form { }

#searchform {
	margin: 10px auto;
	padding: 5px 3px; 
	text-align: center;
	}

#sidebar #searchform #s {
	width: 108px;
	padding: 2px;
	}

#sidebar #searchsubmit {
	padding: 1px;
	}

.entry form { /* This is mainly for password protected posts, makes them look better. */
	text-align:center;
	}

select {
	width: 130px;
	}
	
#respond {}
#commentform { width:80%; }

#commentform input {
	width: 170px;
	padding: 2px;
	margin: 5px 5px 1px 0;
	}

#commentform textarea {
	width: 100%;
	padding: 2px;
	}

#commentform #submit {
	margin: 0;
	float: right;
	border:1px solid #000;
	background-color:#fff;
	}


/* ---------- 8. Comments ---------- */	

.alt {
	width:400px;
	margin: 0;
	padding: 10px;
	}

.commentlist {
	padding: 0;
	text-align: justify;
	}

.commentlist li {
	margin: 15px 0 3px;
	padding: 5px 10px 3px;
	list-style: none;
	}

.commentlist p {
	margin: 10px 5px 10px 0;
	}

#commentform p {
	margin: 5px 0;
	}

.nocomments {
	text-align: center;
	margin: 0;
	padding: 0;
	}

.commentmetadata {
	margin: 0;
	display: block;
	}
/* ---------- 9. Calendar ---------- */	

#wp-calendar {
	empty-cells: show;
	margin: 10px auto 0;
	width: 155px;
	}

#wp-calendar #next a {
	padding-right: 10px;
	text-align: right;
	}

#wp-calendar #prev a {
	padding-left: 10px;
	text-align: left;
	}

#wp-calendar a {
	display: block;
	}

#wp-calendar caption {
	text-align: center;
	width: 100%;
	}

#wp-calendar td {
	padding: 3px 0;
	text-align: center;
	}

#wp-calendar td.pad:hover { /* Doesn't work in IE */
	background-color: #fff; }