/*
Theme Name: MDB
Theme URI: http://www.mikeball.us
Description: Portfolio, blog, and archive of projects.
Version: 1.1
Author: Mike Ball
Author URI: http://www.mikeball.us
*/

/* RESET */
table { border-collapse:collapse; border-spacing:0;}
fieldset,img { border:0;}
address,caption,cite,code,dfn,th,var {font-style:normal; font-weight:normal;}
code {font-family:courier; font-size:12px;}
ol,ul {list-style:none;}
li {list-style-type:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}

/*GLOBALS*/
* {margin:0; padding:0;}
body {background:#e3e3e3; color:#444; font-family:georgia, times, sans-serif; text-align:center;}
pre {display:block; background:#444; color:#fff; padding:10px; margin-bottom:15px; overflow:auto; font-size:12px;}
pre code {line-height:1.5em;}
ul, p, address, caption, cite, ol, dl {margin-bottom:15px; font-size:12px; line-height:1.5em;}
dl {font-size:14px;}
dl dt {font-weight:bold; display:block;}
h2 {color:#fff; float:left; font-size:20px; margin-bottom:30px; line-height:1.5em;}
h2 a {color:#fff; text-decoration:none;}
h2 a:hover {color:#000; text-decoration:underline;}
h2 a.view-all {color:#000; font-style:italic; font-size:11px; margin-left:5px;}
h3 {margin-bottom:15px; clear:both; color:#000; font-size:14px; line-height:1.5em;}
h3 a {text-decoration:none;}
h3 a:hover {text-decoration:underline;}
h4 {color:#fff; font-size:16px; margin-bottom:15px;}
h4 a {text-decoration:none;}
h5 {color:#000; font-size:14px; margin-bottom:15px;}
a {color:#000; outline:none;}
a:hover {color:#fff;}
small {color:#666; display:block; line-height:1.5em; font-size:11px;}
small.tags a {color:#666; text-decoration:none; font-style:italic;}
small.tags a:hover {color:#000; text-decoration:underline;}
small.date-posted {font-style:italic;}

/*UTILITY*/
.clear-left {clear:left;}
.clear-right {clear:right;}
.clear-both {clear:both;}
.clear {overflow:hidden;}
.break {margin-bottom:15px;}

/*FORMS*/
input, textarea, label {display:block;}
input[type=hidden] {display:none;} 
label {font-size:11px; margin-bottom:3px;}
input, textarea {font:inherit; color:#555; margin-bottom:3px; border:1px solid #fff; font-size:11px; width:380px; padding:5px;}
input.button {background:#000; cursor:pointer; font-family:inherit; font-size:11px; width:auto !important; color:#fff;}    

/*GLOBAL STRUCTURE*/
#header, #primary-content, #secondary-content, #footer {width:960px; margin:0 auto; text-align:left; overflow:hidden;}
#header-wrap {background:#fff;}
#header {height:125px;}
#primary-content-wrap {padding-bottom:30px; background:#cfcfcf;}
#primary-content {padding-top:30px;}
#secondary-content-wrap {background:#c5c5c5; padding-bottom:30px;}
#secondary-content {padding:30px 0 0 0;}
#footer-wrap {background:#555;}
#footer {padding:30px 0;}

/*COLUMN DIVS*/
.column {float:left; overflow:hidden; margin-bottom:15px;}
.column.double {width:49%; margin-right:1%;}
.column.quarter {width:25%;}

/*HEADER*/
h1 {}
h1 a {display:block; padding:30px 0 0 90px;; float:left; margin:30px 0; height:80px; line-height:1.3em; font-size:14px; text-decoration:none; background:url("images/mdb-circle.png") no-repeat top left;}
h1 a:hover {color:#000;}
h1 span {display:block; font-size:12px; font-weight:normal; color:#777;}
ul#global-nav {float:right;}
ul#global-nav li {float:left;}
ul#global-nav li a {display:block; float:left; text-decoration:none; padding:80px 8px 5px 8px; color:#777;}
ul#global-nav li a:hover {background:#000; color:#fff;}
ul#global-nav li.current-cat a {background:#CFCFCF; color:#fff;}

/*CATEGORY SELECTOR*/
.category-selector {float:right;}
h3.categorizer {font-size:11px; background: url("images/down-arrow.png") no-repeat scroll 102px 7px; cursor:pointer; font-weight:normal; height:20px; line-height:20px; margin:0 0 0 3px; padding-left:5px; border:1px solid #fff; width:115px;}
h3.categorizer:hover {background-color:#000; width:115px; color:#fff;}
.category-selector ul.categories {display:none; background:#aaa; position:absolute; z-index:5000; border:1px solid #fff; border-top:none; margin-left:3px; width:120px;}
.category-selector ul.categories li {color:#fff; font-size:11px;}
body.single #primary-content .column ul.categories li {list-style-type:none; margin:0;}
.category-selector ul.categories li a {color:#fff; padding:2px 5px; text-decoration:none; display:block;}
.category-selector ul.categories li a:hover {background:#000; color:#fff;}
.category-selector ul.categories li ul.children {margin-bottom:0;}
.category-selector ul.categories li ul.children li a {padding-left:15px;}

.sidebar .archive-controls {background:#bbb; padding:10px 10px 0 10px; overflow:hidden;}
.sidebar .archive-controls .category-selector {float:none; width:350px; margin-bottom:10px;}
body.single #primary-content .sidebar .archive-controls .category-selector h3.categorizer {background-color:#ccc; width:350px; background-position:330px 10px; height:25px; line-height:25px; font-size:12px;}
body.single #primary-content .sidebar .archive-controls .category-selector h3.categorizer:hover {background-color:#000;}
.sidebar .archive-controls .category-selector ul.categories {width:355px;}

/*GRID LISTS*/
ul.grid {clear:both;}
ul.grid li {float:left; width:223px; margin-right:17px; overflow:hidden; margin-bottom:30px;}
ul.grid li small.date-posted {font-style:normal; margin-bottom:5px;}
ul.grid li .thumb {border:1px solid #fff; display:block; width:220px; height:165px; margin-bottom:12px; background:url('images/loading-indicator.gif') no-repeat center;}
ul.grid li .thumb.loaded {background:none;}
ul.grid li .thumb:hover {border:1px solid #eee;}
ul.grid li .thumb img {width:220px; height:165px; display:none;}
/*commented out for now 'cause it breaks IE image loading
ul.grid li a .thumbnail[alt] {text-indent:-5000px;}
ul.grid li a .thumbnail.loaded[alt] {text-indent:none;}/*currently unused and un-applied*/
ul.grid li h3 {margin-bottom:3px;}

ul.grid.blog-posts li {height:385px; margin-bottom:0;}
body.home ul.grid.blog-posts li {height:400px;}/*account for "Read more" link*/
ul.grid.blog-posts li.shim {width:100%; clear:left; margin:0; height:1px;}/*injected via js to clear floats - currently unused in favor of li height*/
ul.grid.blog-posts li .thumb {}
ul.grid.blog-posts li a img {}
ul.grid.blog-posts li h3 {margin-bottom:10px;}
ul.grid.blog-posts li p {margin-bottom:10px; line-height:1.4em;}
ul.grid.blog-posts li a.read-more {color:#fff; font-style:italic;}
ul.grid.blog-posts li a.read-more:hover {color:#000;}
body.home ul.grid.blog-posts li small.tags {margin-top:10px;}

/*GLOBAL SINGLE*/
body.single #primary-content h2 {float:none; margin-bottom:15px;}
body.single #primary-content small.tags {margin-bottom:15px;}
body.single #primary-content h3 {font-size:18px;}
body.single #primary-content .column p, body.single #primary-content .column ol, body.single #primary-content .column ul {font-size:14px;}
body.single #primary-content .column ul li {list-style-type:disc; margin-bottom:3px; list-style-position:outside; margin-left:18px;}
body.single #primary-content .column ol li {margin:0 0 3px 25px; list-style-type:decimal; list-style-position:outside;}
body.single #primary-content .column ol li ol {margin-top:5px;}
body.single #primary-content .column ol li pre {margin:5px 0;}
body.single #primary-content .column ul.post-navigator {margin-top:30px;} 
body.single #primary-content .column ul.post-navigator li {float:left; list-style-type:none; margin-left:0; font-size:11px;}
body.single #primary-content .column ul.post-navigator li.prev {margin-right:10px; border-right:1px solid #eee; padding-right:10px;}

/*PORTFOLIO SINGLE*/
.column.work-images {width:500px; margin-right:15px;}
.column.work-images img {margin-bottom:10px;}
.column.work-description {width:400px;}

/*BLOG SINGLE*/
.column.post {width:500px; clear:left; margin-right:50px;}
.column.post small.date-posted {margin-bottom:15px;}
.column.post img {margin-bottom:15px;}
.column.sidebar {width:400px;}
.column.sidebar h2 {float:none; font-size:18px;}
body.single #primary-content .column ul.recent-posts {list-style-type:none; border-top:1px solid #fff;}
body.single #primary-content .column ul.recent-posts li {overflow:hidden; list-style-type:none; border-bottom:1px solid #fff; padding:7px 0 5px 0; margin-left:0;}
body.single #primary-content .column ul.recent-posts li img {width:50px; height:40px; border:1px solid #fff; margin-right:10px; float:left;}
body.single #primary-content .column ul.recent-posts li h4 {margin-bottom:0; font-size:14px; margin-left:60px;}
body.single #primary-content .column ul.recent-posts li h4 a {text-decoration:none;}
body.single #primary-content .column ul.recent-posts li h4 a:hover {text-decoration:underline;}
body.single #primary-content .column ul.recent-posts li small.date-posted {margin:0 0 10px 60px;}

/*FOOTER*/
#footer {color:#ccc;}
#footer a {color:#ddd;}
#footer h2 {float:none;}
#footer h3 {border-bottom:1px solid #999; color:#fff; padding-bottom:5px;}
#footer .column ul, #footer .column p, #footer .column h3 {width:90%;}
#footer .column .two-column li {float:left; width:49%; margin-right:1%;}
#footer ul#flickr {clear:left; width:100%;}
ul#flickr li {float:left; margin:0 10px 10px 0;}
ul#flickr li a img {border:1px solid #fff;}
ul#delicious li {margin-bottom:3px;}
ul#delicious li h4 {font-size:12px; margin-bottom:0;}
ul#delicious li h4 a:hover {text-decoration:underline;}
ul#delicious li small.date-posted {color:#999;}