/*
Theme Name: Extricate
Theme URI: http://tomodoherty.ie/extricate/
Author: Tom O'Doherty
Author URI: http://tomodoherty.ie/
License URI: license.txt
Description: A grid-based, minimalist WordPress theme for bloggers
Version: 2.0
License: GNU General Public License
Tags: custom-menu, sticky-post, microformats
*/


/* To do:
=========================================================
- ie checks
- nav dropdowns
- iframe shite - youtube, google maps
- footer floats
- readme.txt
- image align checks
- apple-mobile-web-app-capable
- apple-mobile-web-app-status-bar-style
- redo screenshot.png
- verdana site title and description problems
- search bg gifs at double-res for iphone4?
- start promo page
- ipad screenshot
- option to remove date from pages
- check disqus and facebook comments

more:
- german version?
*/


/* Resets, HTML5 display fixes, general housekeeping
========================================================= */
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, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, u, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse; border-spacing: 0;}
em, i {font-style: oblique;}
strong, b {font-weight: bold;}

/* Basic setup
========================================================= */
/* Blahblah */
body {background: #eee; color: #333; font: 12px/21px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; text-align: center;}
#top, header#wrap-nav nav, #main, footer#colophon {vertical-align: middle; margin: 0 auto; text-align: left; clear: both;}
#wrap-main {background: #fff;}
#main {overflow: hidden;}

/* Blocks */
footer#colophon div.widget {float: left; padding: 10px 0 10px 0; margin: 0 10px 0 10px;}

/* A couple of WordPress defaults */
.aligncenter {display: block; margin-left: auto; margin-right: auto;}
.alignleft {float: left;}
.alignright {float: right;}

/* Typography
================================================== */
/* Typeface options */
body#helvetica {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
body#georgia {font-family: Georgia, "Times New Roman", Times, serif;}
body#verdana {font-family: Verdana, Helvetica, Arial, sans-serif;}
body#geneva {font-family: Geneva, Helvetica, Arial, sans-serif;}

/* Typography > Headers */
h1, h2, h3, h4, h5, h6 {font-weight: normal;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {font-weight: inherit;}
h1 {font-size: 20px; line-height: 30px;}
h2 {font-size: 18px; line-height: 30px;}
h3 {font-size: 16px; line-height: 30px;}
h4 {font-size: 14px; line-height: 30px;}
h5 {font-size: 13px; line-height: 24px;}
h6 {font-size: 12px; line-height: 21px;}
#main div#sidebar aside h1, footer#colophon h1, #main article.error404 div.widget h2 {margin: 0 0 10px 0; padding: 0 0 8px 0; border-bottom: 1px solid #666;}

/* Posts, Pages > Banner header (for archives, etc.) */
#main header.page-header h1.banner {font-size: 14px; line-height: 16px; padding: 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #eee; margin: 40px 10px 0 10px; text-align: center; font-weight: normal;}
#main article.error404 h1.banner {margin: 55px 5px 15px 5px;}

/* Typography > Paragraphs */
p {margin: 0 0 20px 0;}
p img {margin: 0;}
p.lead {font-size: 21px; line-height: 27px; color: #777;}

/* Typography > Blockquotes */
#main blockquote {padding: 18px 22px 1px 22px; margin: 0 0 20px 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
blockquote cite {display: block; font-size: 12px; color: #666;}
blockquote cite:before {content: "\2014 \0020";} /* em-dash and space */
blockquote cite a, blockquote cite a:visited, blockquote cite a:visited {color: #555;}
#main blockquote {background: #d0d0d0;}
#main ol.commentlist blockquote {background: #fff;}
#main blockquote blockquote {background: #fff;}
#main blockquote blockquote blockquote {background: #d0d0d0;}
#main ol.commentlist blockquote blockquote {background: #d0d0d0;}
#main ol.commentlist blockquote blockquote blockquote {background: #fff;}

/* Typography > Images, video */
#main img {border: 1px solid #666;}
#main a img {border: 1px solid #4064b6;}
#main article.post iframe {margin: 0;}
#main img, #main a img {vertical-align: bottom;}
#main img.wp-smiley {border: none;}
#main img.alignleft, #main img.alignright {margin: 4px 0 10px 0;}
#main img.alignleft {margin-right: 10px;}
#main img.alignright {margin-left: 10px;}

img.scale-with-grid {max-width: 100%; height: auto;}
#main article div.entry-content div.wp-caption {max-width: 100%;}
#main article div.entry-content .wp-caption-text, #main article div.entry-content .gallery-caption {color: #666;background: none; padding: 0;}
embed {width: 100%;!important height: auto;!important}

/* Typography > Other */
hr {border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0;}
small {font-size: 80%;}
#main table {background: #eee; width: 100%; border: 1px solid #d0d0d0; padding: 0; margin: 0 0 9px 0;}
#main table tr th {font-weight: bold; text-align: center; padding-top: 4px;}
#main table tr td {padding: 1px 2px 1px 2px; text-align: center;}
#main table tfoot tr td#prev {text-align: left; padding: 1px 2px 6px 12px; font-weight: bold;}
#main table tr td#next {text-align: right; padding: 1px 12px 6px 2px; font-weight: bold;}
#main code {background: #eee; font-weight: bold;}
#main ol.commentlist code {background: #eee; font-weight: bold;}
#main ol.commentlist pre {background: #fff;}
div#respond h3 {border: none;} /* Comment reply link text */
div#respond h3 small {text-align: right; float: right;} /* Comment reply link text */
#main address {padding-left: 10px;}
#main pre {background: #d0d0d0; padding: 10px; margin: 0 0 9px 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
div#respond h3 small {font-size: 11px;}
#main .page-link {background: #eee; font-weight: bold; border: 1px solid #ccc; margin: 0 0 20px 0; padding: 3px 7px 3px 7px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; clear: both;}
#main article .bypostauthor {color: #333;}
::selection {background: #1a3269; color: #fff;}
::-moz-selection {background: #1a3269; color: #fff;}

/* Links
================================================== */
a, a:link {color: #4064b6; text-decoration: underline; outline: 0;}
a:visited {color: #4064b6;}
a:hover, a:focus {color: #fff; background: #4064b6;}
a:active {color: #4064b6;}
p a, p a:visited {line-height: inherit;}

.more-link {background: #eee; padding: 5px 8px 5px 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
a.more-link {text-decoration: none;}

/* Lists
================================================== */
#main dl dt {font-weight: bold;}
#main article.post ol li, #main article.page ol li, #main ol.commentlist ol li {background: none; list-style-type: decimal;}
#main article.error404 div.widget ul {padding: 0;}
#main ul, #main ol {margin-bottom: 20px;}
#main ul li, #main dl dd, div#comments ol.commentlist li.comment div.comment-content ul li, footer#colophon ul li {background: url(assets/img/arrow.gif) left top no-repeat; padding-left: 10px;}
#main article.post ol, #main article.page ol, #main ol.commentlist ol, div#comments ol.commentlist li.comment div.comment-content ol { padding-left: 30px;}

/* Blocks
================================================== */
#primary {float: left;}
#sidebar {float: left; margin: 0 10px 0 10px;}
#main article.post, #main article.page, #main article.attachment {margin: 0 10px 0 10px;}
#main article.post, #main article.page, #main article.attachment {clear: both; float: left;}

/* Forms
================================================== */
input[type="text"], input[type="password"], input[type="email"], textarea, select {
		border: 1px solid #ccc;
		padding: 6px 4px;
		outline: none;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #777;
		margin: 0;
		width: 98%;
		max-width: 100%;
		display: block;
		margin-bottom: 5px;
		background: #fff;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus {
border: 1px solid #aaa; color: #444; -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); box-shadow:  0 0 3px rgba(0,0,0,.2);}
textarea {min-height: 60px;}
label, legend {font-weight: bold; font-size: 13px;}
input[type="checkbox"] {display: inline;}
form span.required {color: #f00; font-weight: bold;}

/* Buttons
================================================== */
a.button, button, input[type="submit"], input[type="reset"], input[type="button"] {		
		border: 1px solid #1a3269;
		border-top: 1px solid #193f97;
		border-left: 1px solid #193f97;
		padding: 4px 12px 4px 12px;
		-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
		display: inline-block;
		font-size: 12px;
		font-weight: bold;
		text-decoration: none;
		text-shadow: 0 1px rgba(0, 0, 0, .5);
		font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		cursor: pointer;
		line-height: 21px;
		color: #fff;
		background: #4064b6; /* Old browsers */
		background: #4064b6 -moz-linear-gradient(top, rgba(255,255,255,.2) 0%, rgba(0,0,0,.2) 100%); /* FF3.6+ */
		background: #4064b6 -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.2))); /* Chrome,Safari4+ */
		background: #4064b6 -webkit-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Chrome10+,Safari5.1+ */
		background: #4064b6 -o-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Opera11.10+ */
		background: #4064b6 -ms-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* IE10+ */
		background: #4064b6 linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* W3C */
}

a.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover {background: #1a3269;}
a.button:active, button:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active {background: #193f97;}
.button.full-width, button.full-width, input[type="submit"].full-width, input[type="reset"].full-width, input[type="button"].full-width, form#commentform input[type="submit"] 
{width: 100%; padding-left: 0 !important; padding-right: 0 !important; text-align: center;}

/* Top, main nav, search
================================================== */
/* Top */
#top {padding: 46px 0 43px 0; overflow: hidden;}
#top h1 a, #top h2 {float: left; line-height: 30px; font-size: 20px;}
#top h1 a {background: none; color: #000; text-decoration: none; margin-right: 20px;}
#top h2 {color: #666; font-weight: 300;}

/* Main nav */
.skip-link {position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px);}
#wrap-nav {border-top: 1px solid #333; border-bottom: 1px solid #333; clear: both; background: #fff;}
#no-nav {border-top: 1px solid #333;}
#wrap-nav nav {clear: both; overflow: hidden;}
#wrap-nav nav .menu ul li {float: left;}
#wrap-nav nav ul li a {display: block; text-decoration: none;}
#wrap-nav nav ul li ul {position: absolute; left: -999em; width: 200px;}
#wrap-nav nav .menu ul {margin: 0 0 0 -12px;}
#wrap-nav nav ul li a {height: 16px; line-height: 16px; font-size: 16px; padding: 13px 12px 10px 12px;}
#wrap-nav nav ul li a:hover {background: #fff url(assets/img/nav.gif) center bottom no-repeat; color: #3873f7;}
#wrap-nav nav ul li.current_page_item a, #wrap-nav nav ul li.current_page_item a:hover {background: url(assets/img/nav.gif) center bottom no-repeat; color: #000;}
#wrap-nav nav ul li:hover ul {left: auto;}
#wrap-nav nav ul ul, #wrap-nav nav ul ul ul, #top nav ul ul ul ul {margin: 0;} /* no minus-padding on dropdowns */
#wrap-nav nav ul li ul {margin: 0 0 0 12px; border-top: 1px solid #888;}
#wrap-nav nav ul li ul li {float: none;}
#wrap-nav nav ul li ul li a {background: #eee; font-size: 12px; display: block; padding: 7px 9px 7px 9px; float: left; width: 180px; height: auto; border: 1px solid #888; border-top: none;}
#wrap-nav nav ul li ul li a:hover {background: #bdc3d2; color: #fff;}

/* Search */
#wrap-nav nav div#search {float: right; padding: 0 0 8px 0;}
#wrap-nav nav form#searchform {float: right; position: relative;}
#wrap-nav nav form#searchform label {text-indent: -9999px; display: block; height: 8px;}
#wrap-nav nav form#searchform input {border: none; padding: 0; margin: 0;}
#wrap-nav nav form#searchform input#s {background: url(assets/img/search.gif) left top no-repeat; color: #888; padding: 5px 2px 3px 4px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 12px; width: 184px; height: 15px;}
#wrap-nav nav form#searchform input#s:focus {color: #000;}
#wrap-nav nav form#searchform input#searchsubmit {position: absolute; right: 0; top: 8px;}

/* Posts, Pages, Attachments
================================================== */
/* Posts, Pages > Basics */
#main article.post, #main article.page, #main article.attachment {margin-top: 55px;}
#main article.post div.entry-meta {float: left; margin: 2px 20px 20px 0;}
#main article.post div.entry-content {float: left;}

/* Posts > Sticky posts */
#main article.sticky header.entry-header h1, #main article.sticky header.entry-header p, #main article.sticky div.entry-meta 
{font-weight: bold;}

/* Posts, Pages, Attachments > Top */
#main header.entry-header {border-bottom: 1px solid #666; margin: 0 0 10px 0; overflow: hidden; /* floatmagic */}
#main header.entry-header h1 {float: left;}
#main header.entry-header h1 a {text-decoration: none; color: #000;}
#main header.entry-header h1 a:hover {color: #4064b6; background: none;}
#main p.hang-right {margin: 0; font-size: 20px; line-height: 30px; padding: 0 0 8px 0; float: right;}
#main p.hang-right a {color: #ccc; background: none; text-decoration: none;}

/* Posts, Pages, Attachments > Meta */
#main article.post div.entry-meta {color: #888;}
#main article.post div.entry-meta ul li {padding: 0 0 7px 0; margin: 0 0 6px 0; border-bottom: 1px solid #e0e0e0; line-height: 16px; background: none;}

/* Posts, Pages, Attachments > Footer */
#main article.post footer.entry-extras {background: #eee; color: #888; clear: both; padding: 4px 4px 4px 7px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 0 0 10px 0;}
#main article.post footer.entry-extras p {padding: 3px 0 4px 0; margin: 0; font-size: 11px; line-height: 11px;}
#main article.post footer.entry-extras ul.extras-social {padding: 0; float: right; font-size: 11px; line-height: 11px;}
#main article.post footer.entry-extras ul.extras-social li {background: none; float: left; padding: 0; margin: 0 0 0 2px;}
#main article.post footer.entry-extras ul.extras-social li a img {border: none; vertical-align: bottom; background: url(assets/img/social.png) left top no-repeat;}
#main article.post footer.entry-extras ul.extras-social li a:hover {background: none;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-twitter {background-position: -140px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-twitter {background-position: -140px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-reddit {background-position: -60px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-reddit {background-position: -60px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-facebook {background-position: -40px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-facebook {background-position: -40px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-tumblr {background-position: -120px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-tumblr {background-position: -120px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-vkontakte {background-position: -160px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-vkontakte {background-position: -160px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-stumbleupon {background-position: -100px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-stumbleupon {background-position: -100px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-digg {background-position: -20px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-digg {background-position: -20px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-delicious {background-position: 0px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-delicious {background-position: 0px -20px;}
#main article.post footer.entry-extras ul.extras-social li a img.meta-social-rss {background-position: -80px 0px;}
#main article.post footer.entry-extras ul.extras-social li a:hover img.meta-social-rss {background-position: -80px -20px;}

/* Comments
================================================== */
/* Comments > Basics */
div#comments {clear: both; margin: 0 10px 0 10px; padding: 10px 0 0 0;} /* push down comment block to create 20px gap at top */
div#comments h2#comments-header, div#comments ol.commentlist li {background: #d0d0d0;} /* background colour */
div#comments ol.commentlist li.comment div.comment-content ul li, div#comments ol.commentlist li.comment div.comment-content ol li {margin: 0; padding: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;} /* resets for comment list items */
div#comments ol.commentlist li {clear: both; margin: 0 0 20px 0; padding: 5px 10px 0 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} /* basic single comment styles */
div#comments ol.commentlist li:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clear floats */
div#comments ol.commentlist article.comment footer {margin: 5px 0 5px 0; width: auto; background: #fff; clear: both; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; overflow: hidden;} /* basic gravatar, author and date block */
div#comments ol.commentlist article.comment div.comment-author img {border: 1px solid #333; float: left; margin: 3px 5px 0 0;} /* gravatar */
div#comments ol.commentlist article.comment div.comment-author {float: left; margin: -3px 0 0 0;} /* pic and name */
div#comments ol.commentlist article.comment footer div.commentmetadata {font-size: 10px; line-height: 12px; float: right;} /* time */
div#comments ol.commentlist article.comment div.reply {text-align: right; margin: 0 0 10px 0; border-top: 1px solid #bbb; font-size: 11px;} /* reply link */
div#comments ol.commentlist li.pingback {margin: 0 0 20px 0; padding-bottom: 5px;} /* pingbacks */
div#comments ol.commentlist li.pingback p {margin: 0;} /* pingbacks */
/* Posts, Pages > Threaded comments */
div#comments ol.commentlist ul.children li.comment footer {background: #fff; padding: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
div#comments ol.commentlist ul.children li.comment footer img {width: 30px; height: 30px;}
/* Comments > Threaded comment backgrounds */
div#comments ol.commentlist ul.children li.comment {background: #fff;}
div#comments ol.commentlist ul.children li.comment ul.children li.comment, div#comments ol.commentlist ul.children li.comment ul.children li.comment footer {background: #d0d0d0;}
div#comments ol.commentlist ul.children li.comment ul.children li.comment ul.children li.comment, div#comments ol.commentlist ul.children li.comment ul.children li.comment ul.children li.comment footer {background: #fff;}
/* Comments > Comment form */
form#commentform {float: left; border: 1px solid #333; margin: 0 0 10px 0; /* TEMP */ padding: 10px; background: #eee;}
div#comments ol.commentlist form#commentform {margin: 0 0 10px 0;} /* styles for js-moved comment form when replying to individual comment */
#main h3#reply-title {/* margin: 0 0 0 -130px; */} /* TEMP */
div#comments ol.commentlist h3#reply-title {margin: 0;}
form#commentform p {padding: 0; margin: 0;}
form#commentform p.comment-notes, form#commentform p.form-allowed-tags {background: #d0d0d0; clear: both; font-size: 11px; border: 1px solid #333; padding: 3px 7px 2px 7px; margin: 0 0 10px 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
/* Comments > Other stuff */
div#comments h2#comments-header {margin: 0 0 20px 0; /* TEMP */ padding: 3px 10px 3px 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} /* neat header */
#main div#comments p.nocomments, #main div#comments .nopassword {clear: both; background: #eee; color: #000; text-align: center; font-size: 11px; line-height: 11px; padding: 6px 0 7px 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} /* notice for disabled or password-protected comments */

/* Base-of-page nav
================================================== */
nav#older-newer {border-top: 1px solid #666; margin: 10px 10px 0 10px; font-size: 11px; clear: both;}
nav#older-newer div.older {float: left;}
nav#older-newer div.newer {float: right;}
nav#older-newer div.older, nav#older-newer div.newer {margin: 10px 0 10px 0;}
nav#older-newer div.newer {text-align: right;}
nav#older-newer a {background: #eee; text-decoration: none; padding: 3px 8px 3px 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
nav#older-newer div.older a {float: left;}
nav#older-newer div.newer a {float: right;}
nav#older-newer a:hover {background: #4064b6;}

/* Sidebar
================================================== */
#main div#sidebar {margin-top: 45px;}
#main div#sidebar aside {margin-top: 10px; float: left; width: 100%;}

/* Footer
================================================== */
#wrap-main {border-bottom: 1px solid #333; padding: 0 0 35px 0;}
footer#colophon {padding: 45px 0 58px 0; overflow: hidden;} /* base-of-page gaps */

/* Stuff that doesn't fit anywhere else
================================================== */
#main article.error404 div.widget {float: left; width: 175px; margin: 5px; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #eee;}
div.entry-summary {padding: 10px 10px 0 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #d0d0d0;}

/* Media Queries
================================================== */

/* 4 cols (mobile portrait, 260px + 20px = 280px) */
@media only screen and (min-width: 1px) and (max-width: 440px) {
#top, header#wrap-nav nav {width: 260px;}
#main, footer#colophon {width: 280px;}
#primary {width: 280px;}
#sidebar {width: 260px;}
#wrap-nav nav form#searchform input#s {background: url(assets/img/search_wide.gif) left top no-repeat; width: 254px;}
#main article.post div.entry-meta, #main article.page div.entry-meta {width: 260px; margin: 0;}
#main article.post div.entry-content, #main article.page div.entry-content, #main article.attachment div.entry-content {width: 260px;}
#main article div.entry-content img {max-width: 258px; height: auto;}
#main article div.entry-content iframe {max-width: 260px;}
footer#colophon div.widget {width: 260px;}
}

/* 6 cols (mobile landscape, 400px + 20px = 420px) */
@media only screen and (min-width: 441px) and (max-width: 630px) {
#top, header#wrap-nav nav {width: 400px;}
#main, footer#colophon {width: 420px;}
#primary {width: 420px;}
#sidebar {width: 400px;}
#main article.post div.entry-meta, #main article.page div.entry-meta {width: 400px; margin: 0;}
#main article.post div.entry-content, #main article.page div.entry-content, #main article.attachment div.entry-content {width: 400px;}
#main article div.entry-content img {max-width: 398px; height: auto;}
#main article div.entry-content iframe {max-width: 400px;}
footer#colophon div.widget {width: 190px;}
}

/* 4 cols and 6 cols - shared styles */
@media only screen and (min-width: 1px) and (max-width: 630px) {
body {font-size: 14px;}
#top {padding: 15px 0 15px 0;}
#wrap-nav nav .menu ul {margin: 5px 0 0 0;}
#wrap-nav nav ul li ul {display: none; !important}
#wrap-nav nav .menu ul li a {background: #eee; margin: 3px 3px 0 0; padding: 6px 7px 6px 7px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#wrap-nav nav ul li.current_page_item a, #wrap-nav nav ul li.current_page_item a:hover {background: #d0d0d0 url(assets/img/nav.gif) center bottom no-repeat;}
#wrap-nav nav div#search {float: left; clear: both;}
#main p.hang-right {float: left; clear: both;}
}

/* 8 cols (540px + 20px = 560px) */
@media only screen and (min-width: 631px) and (max-width: 770px) {
#top, header#wrap-nav nav {width: 540px;}
#main, footer#colophon {width: 560px;}
#primary {width: 560px;}
#sidebar {width: 540px;}
#main article.post div.entry-meta, #main article.page div.entry-meta {width: 540px; margin: 0;}
#main article.post div.entry-content, #main article.page div.entry-content, #main article.attachment div.entry-content {width: 540px;}
#main article div.entry-content img {max-width: 538px; height: auto;}
#main article div.entry-content iframe {max-width: 540px;}
footer#colophon div.widget {width: 260px;}
}

/* 10 cols (680px + 20px = 700px) */
@media only screen and (min-width: 771px) and (max-width: 910px) {
#top, header#wrap-nav nav {width: 680px;}
#main, footer#colophon {width: 700px;}
#primary {width: 490px;}
#sidebar {width: 190px;}
#main article.post div.entry-meta {width: 470px; margin: 0;}
#main article.post div.entry-content, #main article.attachment div.entry-content {width: 470px;}
#main article div.entry-content img {max-width: 468px; height: auto;}
#main article div.entry-content iframe {max-width: 470px;}
footer#colophon div.widget {width: 325px;}
}

/* 12 cols (820px + 20px = 840px) */
@media only screen and (min-width: 911px) and (max-width: 1070px) {
#top, header#wrap-nav nav {width: 820px;}
#main, footer#colophon {width: 840px;}
#primary {width: 630px;}
#sidebar {width: 190px;}
#main article.post div.entry-meta, #main article.page div.entry-meta {width: 120px;}
#main article.post div.entry-content {width: 470px;}
#main article.page div.entry-content, #main article.attachment div.entry-content, #main article div.search-summary div.entry-content {width: 610px;}
#main article div.entry-content img {max-width: 468px; height: auto;}
#main article div.entry-content img.hang-left, #main article div.entry-content img.hang-left-big {max-width: 608px; margin: 0 0 0 -140px;}
#main article div.entry-content iframe.hang-left, #main article div.entry-content iframe.hang-left-big {max-width: 610px; margin: 0 0 0 -140px;}
footer#colophon div.widget {width: 190px;}
}

/* 14 cols (full-screen, 960px + 20px = 980px) */
@media only screen and (min-width: 1071px) {
#top, header#wrap-nav nav {width: 960px;}
#main, footer#colophon {width: 980px;}
#wrap-nav nav form#searchform input#s {background: url(assets/img/search_wide.gif) left top no-repeat; width: 254px;}
#primary {width: 700px;}
#sidebar {width: 260px;}
#main article.post div.entry-meta, #main article.page div.entry-meta {width: 190px;}
#main article.post div.entry-content {width: 470px;}
#main article.page div.entry-content, #main article.attachment div.entry-content, #main article div.search-summary div.entry-content {width: 680px;}
#main article div.entry-content img {max-width: 468px; height: auto;}
#main article div.entry-content img.hang-left {max-width: 608px; margin: 0 0 0 -140px;}
#main article div.entry-content iframe.hang-left {max-width: 610px; margin: 0 0 0 -140px;}
#main article div.entry-content img.hang-left-big {max-width: 678px; margin: 0 0 0 -210px;}
#main article div.entry-content iframe.hang-left-big {max-width: 680px; margin: 0 0 0 -210px;}
footer#colophon div.widget {width: 225px;}
}