/*   
Theme Name: Sjoerd Westbroek's Theme
Theme URI: http://sjoerdwestbroek.nl
Description: For use on the site of Dutch artist Sjoerd Westbroek.
Author: Mark Lindhout
Author URI: http://langdradig.nl/
Version: 1.0
*/

/* @group Meyer Reset */

/* v1.0 | 20080212 */

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;
}

:focus {
	outline: 0;
}

ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* @end */

/* @group Font Base */

body {
	*font-size: small;
	*font: x-small;
}

select,input,button,textarea,button {
	font: 99% "Andale Mono", "Courier New", Courier, mono;
}

table {
	font-size: inherit;
	font: 100%;
}

pre,code,kbd,samp,tt {
	font-family: monospace;
	*font-size: 108%;
	line-height: 100%;
}

/* @end */

/* @group Theme */

/* @group Page Structure */

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

html, body {
	height: 100%;
}

body {
	line-height: 130%;
	font-size: 100%;
	font-family: Georgia, Times, 'Times New Roman', serif;
}

/* the bottom margin is the negative value of the footer's height */

#wrapper {
	text-align: left;
	min-height: 100%;
	margin: 0 auto -48px;
}

#main {
	float: left;
	background: #fff url(images/content-bg-top.png) repeat-x left top;
	color: #333;
	width: 100%;
}

#content {
	width: 864px;
	margin: 32px auto 16px;
	font-size: 14px;
}

/* @end */

/* @group Elements */

/* Hyperlinks */

a {
	color: #f26522;
	text-decoration: underline;
}

a:visited {
	color: #b87c5f;
}

a:hover {
	color: #000;
}

a:active {
	color: #000000;
}

/* Headers */

h1, h2, h3, h4, h5, h6 {
	line-height: 1.143em;
	margin: .7em 0 .5em 0;
	font-weight: normal;
	font-style: normal;
	color: #444;
	font-family: Anivers;
}

h1 {
	font-size: 30px;
}

h2 {
	font-size: 24px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 16px;
}

h5 {
	font-size: 14px;
}

h6 {
	font-size: 13px;
}

/* Text elements */

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

cite {
	font-style: italic;
	color: #444;
}

abbr {
	font-variant: small-caps;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}

acronym {
	font-variant: small-caps;
}

sup {
	font-size: .7em;
	vertical-align: 50%;
	line-height: 100%;
}

sub {
	font-size: .7em;
	vertical-align: -10%;
	line-height: 100%;
}

/* Start - WP-Typography */

.amp {
	font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro", serif;
	font-weight: normal;
	font-style: italic;
	font-size: 1.1em;
	line-height: 1em;
}

.caps {
	font-size: 90%;
	letter-spacing: .05em;
}

.dquo {
	margin-left: -.40em;
}

.quo {
	margin-left: -.2em;
}

.numbers {
	
}

/* End - WP-Typography */

address {
	
}

ins {
	
}

dfn {
	
}

del {
	
}

/* Paragraphs */

p {
	margin: .7em 0 .5em 0;
	text-align: left;
}

/* All lists */

#content ul, ol, dl {
	margin-left: 0em;
}

/* Unordered lists */

#content ul {
	
}

#content ul li {
	list-style-type: square;
	list-style-position: outside;
	margin: .5em 0;
	list-style-image: url(images/list-ornament.png);
}

/* Ordered lists */

#content ol {
	margin-left: 2em;
}

#content ol li {
	list-style-type: decimal;
	list-style-position: outside;
	margin: .5em 0;
}

/* Defition lists */

#content dl {
	
}

dt {
	
}

dd {
	
}

/* Blockquotes */

blockquote {
	margin-left: 0em;
	font-style: italic;
}

blockquote blockquote {
	
}

blockquote em {
	font-style: normal;
}

/* Object */

object {
	
}

/* Code */

code {
	padding: 4px;
	background-color: #edf5ff;
	border: 1px solid #cfddef;
}

pre {
	padding: 8px;
	background-color: #edf5ff;
	border: 1px solid #cfddef;
	margin: 8px 0;
	clear: both;
}

pre code {
	
}

/* Tables */

table {
	
}

caption {
	
}

tr {
	
}

th {
	
}

td {
	
}

/* Forms */

form {
	
}

textarea {
	
}

input {
	
}

label {
	
}

option {
	
}

/* Drop caps */

.drop-cap {
	
}

/* Notes */

.note {
	
}

/* Warnings/Alerts */

.warning, .alert {
	
}

/* Errors */

.error {
	
}

/* Downloads */

.download {
	
}

/* Alignment */

.left, .alignleft {
	
}

.right, .alignright {
	
}

.center, .aligncenter {
	
}

.block, .alignnone {
	
}

.clear {
	clear: both;
	display: block;
	height: 0%;
}

/**
* Images
************************************************/

/* Normal images */

img {
	
}

a img {
	
}

/* WP Smilies */

img.wp-smiley {
	
}

/* Thumbnails */

.thumbnail {
	
}

/* WP Captions [caption] */

.wp-caption {
	float: right;
	text-align: left;
	margin-left: 16px;
	margin-bottom: 16px;
}

.wp-caption img {
	display: block;
}

.wp-caption p,
.wp-caption .wp-caption-text {
	font-size: 0.7em;
	line-height: 1.3em;
	font-style: italic;
	color: #333;
	text-align: center;
}

/* Gallery [gallery] */

.gallery {
	
}

.gallery img {
	
}

/* Avatars */

.avatar {
	
}

/* @end */

/* @group Header */

#header {
	width: 100%;
	float: left;
	clear: both;
	background: #353D46 url(images/header-bg.png) repeat-x;
}

#header-wrapper {
	width: 864px;
	margin: 0 auto;
	padding-top: 16px;
}

#header a {
	margin: 0;
	padding: 0;
	text-decoration: none;
}

#header #logo {
	height: 64px;
	overflow: hidden;
}

#header .header-title,
#header .header-title a {
	font-size: 36px;
	color: #EEE;
	line-height: 32px;
	margin: 0;
	padding: 0;
}

#header .header-title a:hover {
	color: #f26522;
	border: none;
}

#header .header-description {
	font-size: 14px;
	color: #a3afbe;
	font-style: italic;
	margin: 0;
	padding: 0;
}

/* @group Category Menu */

#categorymenu {
	line-height: 40px;
	float: left;
}

#categorymenu ul {
	padding-top: 8px;
}

#categorymenu ul li {
	float: left;
	padding-right: 16px;
	background: url(images/menu-tab-bg.png) no-repeat right top;
	font-size: 16px;
}

#categorymenu ul li a {
	display: block;
	background: url(images/menu-tab-bg.png) no-repeat left top;
	padding-left: 16px;
	padding-right: 8px;
	color: #333;
}

#categorymenu ul li.hover,
#categorymenu ul li.current-cat {
	background: url(images/menu-tab-bg.png) no-repeat right -48px;
}

#categorymenu ul li.hover a,
#categorymenu ul li.current-cat a {
	background: url(images/menu-tab-bg.png) no-repeat left -48px;
	color: #f26522;
}

/* @end */

/* @group Page Menu */

#pagemenu {
	float: right;
	line-height: 32px;
	padding-top: 16px;
}

#pagemenu ul li {
	float: left;
	background: url(images/page-tab-bg.png) repeat-x left top;
	display: block;
	height: 32px;
	overflow: hidden;
	line-height: 32px;
	margin-right: 4px;
	font-size: 14px;
}

#pagemenu ul li a {
	display: block;
	padding: 0 8px;
	color: #b6c0cc;
}

#pagemenu ul li.hover,
#pagemenu ul li.current_page_item {
	background: url(images/page-tab-bg.png) repeat-x right -32px;
}

#pagemenu ul li.hover a,
#pagemenu ul li.current_page_item a {
	color: #333;
}

/* @end */

/* @end */

/* @group Front Page */


body.home .title {
	font-size: 32px;
	margin-top: 0;
	color: #707a86;
}


/* The front-page columns */

#front-column-left {
	display: block;
	width: 616px;
	overflow: hidden;
	float: left;
	margin-right: 32px;
	padding-bottom: 32px;
}

#front-column-left .post {
	cursor: pointer;
	padding: 16px;
	border: 2px solid transparent;
}

#front-column-left .hover {
	background-color: #ffe4d8;
	border-color: #ffc5aa;
}

#front-column-left .hover * {
	color: #5b4034;
}

#front-column-left .post .entry-title {
	font-size: 24px;
	line-height: 24px;
}

#front-column-right {
	display: block;
	width: 200px;
	overflow: hidden;
	float: right;
	padding-bottom: 32px;
}

.front {
	border-bottom: 1px solid #EEE;
	cursor: pointer;
	width: 164px;
	padding: 16px;
	border: 2px solid transparent;
	
}

#front-column-right .hover {
	background: #FFFFFF url(images/content-bg-top.png) repeat-x scroll left top;
	border-color: #DDD;
}

.front .entry-title {
	font-size: 18px;
	line-height: 19px;
	margin: 0;
	padding: 0;
	clear: both;
}

.front .entry-summary {
	color: #666;
	font-size: 12px;
	line-height: 16px;
	margin: 0;
	float: left;
}

.front .read-more {
	color: #666;
	font-size: 12px;
	line-height: 16px;
	margin: 0;
	float: right;
	font-style: italic;
}


/* @end */

/* @group Category Page */

body.category .post .entry-container {
	cursor: pointer;
	padding: 8px 16px;
	border: 2px solid transparent;
}

body.category .hover .entry-container {
	background-color: #ffe4d8;
	border-color: #ffc5aa;
}

/* @end */

/* @group Post Entry */

.post {
	margin-bottom: 16px;
	padding-bottom: 16px;
	float: left;
	width: 100%;
}

/* Left and Right columns in a post */

.post .left-column {
	border-right: 1px solid #aaa;
	padding-right: 16px;
	display: block;
	width: 648px;
	overflow: hidden;
	float: left;
	margin-right: 16px;
}

.post .right-column {
	display: block;
	width: 160px;
	overflow: hidden;
	float: right;
}

/* Category pages entry listings */

/* Left-column */

.entry-title {
	color: #222;
	margin: 0 0 16px 0;
	padding: 0;
}

.entry-title a {
	color: #222;
	text-decoration: none;
}



.entry-content {
	color: #222;
}

.entry-thumbnail {
	width: auto;
	overflow: hidden;
	float: right;
	text-align: left;
	vertical-align: middle;
	margin: 0 0 16px 16px;
}

.entry-thumbnail img {
	float: none;
	display: block;
	margin: 0;
}

/* The Entry's meta info, in the right column */

.entry-meta {
	font-size: 14px;
	color: #888;
	float: left;
	line-height: 24px;
}

.entry-meta abbr {
	font-size: 14px;
	color: #888;
	text-transform: none;
	border: none;
	font-variant: normal;
	font-style: italic;
}

.entry-meta a {
	color: #888;
}

.entry-meta a:hover {
	color: #f26522;
	background-color: #F3F3F3;
}

.entry-meta .label {
	float: left;
	overflow: hidden;
	height: 24px;
	width: 24px;
	clear: both;
}

.entry-meta .content {
	float: left;
	width: 240px;
	margin-bottom: 16px;
}

.entry-meta .date,
.entry-meta .categories,
.entry-meta .tags,
.entry-meta .comments {
	background-repeat: no-repeat;
	background-position: 0px 4px;
}

.entry-meta .date {
	background-image: url(images/icon-calendar.gif);
}

.entry-meta .categories {
	background-image: url(images/icon-book.gif);
}

.entry-meta .tags {
	background-image: url(images/icon-flag.gif);
}

.entry-meta .comments {
	background-image: url(images/icon-comment.gif);
}

.entry-meta .edit-link {
	display: block;
	clear: both;
	float: left;
	padding-top: 16px;
}

.archive-titles {
	margin-bottom: 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid #aaa;
}

.archive-titles p {
	color: #666;
	text-indent: 0;
	font-size: 16px;
	font-weight: normal;
	font-style: normal;
}

.archive-titles .pagetitle {
	margin: 0;
	padding: 0;
}

/* @end */

/* @group Post Gallery */

.post-gallery {
	padding: 16px 0;
}

.post-gallery .gallery-item {
	float: left;
	width: 631px;
	margin: 0;
	padding: 16px 0;
	border-bottom: 1px solid #eee;
}

.post-gallery .gallery-thumbnail {
	float: left;
	width: 300px;
	text-align: right;
	vertical-align: middle;
	margin-right: 16px;
}

.post-gallery .gallery-thumbnail a {
	display: block;
	margin: 0 auto;
}

.post-gallery .gallery-thumbnail a img {
	margin: 0 auto;
}

.post-gallery .gallery-text {
	float: left;
	width: 315px;
}

.post-gallery .gallery-text h3 {
	margin: 0 0 8px;
	font-size: 20px;
	color: #000;
}

.post-gallery .gallery-text .gallery-caption {
	margin: 0 0 8px;
	color: #666;
	font-style: italic;
}

/* @end */


/* @group Navigation */

.navigation {
	float: left;
	width: 100%;
	margin: 16px 0;
	background-color: #f0f3f7;
	padding: 4px;
}
/*
body.archive .navigation {
	width: 656px;
}
*/
.navigation a {
	color: #5b6d84;
	display: block;
	padding: 4px 8px;
}

.navigation a:hover {
	background-color: #dce0e5;
}

.navigation .left {
	float: left;
}

.navigation .right {
	float: right;
}

/* @end */


/* @group Comments */

#comments {
	font-size: 14px;
	float: left;
	width: 864px;
}

.comments-title {
	line-height: 24px;
}

.commentlist {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#comments .commentlist li {
	padding-bottom: 31px;
	margin-bottom: 32px;
	border-bottom: 1px solid #dfdfdf;
	list-style-type: none;
	float: left;
	width: 100%;
	list-style-image: none;
}

#comments .commentlist li .column-left {
	border-right: 1px solid #aaa;
	padding-right: 16px;
	display: block;
	width: 448px;
	overflow: hidden;
	float: left;
	margin-right: 16px;
}

#comments .commentlist li .column-right {
	display: block;
	width: 380px;
	overflow: hidden;
	float: left;
}

.commentlist li .comment-number {
	float: left;
	width: 32px;
	margin-right: 16px;
	font-size: 18px;
	font-weight: normal;
}

.commentlist li .comment-number a {
	color: #666;
	text-decoration: none;
	padding: 8px;
}

.commentlist li .comment-number a:hover {
	color: #f26522;
	background-color: #eee;
}

.commentlist li .comment-date {
	font-style: italic;
	color: #666;
	float: left;
	clear: both;
	margin-left: 2px;
}

.commentlist li .comment-author-info {
	float: left;
	clear: both;
}

.commentlist li .comment-author-info .avatar {
	display: block;
	border: 1px solid #888;
	float: left;
	margin-right: 16px;
}

.commentlist li .comment-author-info p {
	font-size: 14px;
	padding: 0;
	margin: 0;
}

.commentlist li .comment-message {
	float: left;
}

.commentlist li .comment-content {
	float: left;
	width: 380px;
	margin-right: 16px;
}

.commentlist li .comment-content p {
	margin-top: 0;
}

#comments .textarea-item textarea {
	width: 650px;
}

/* @end */

/* @group Forms */

.form-column-left {
	float: left;
	width: 100%;
}

.form-item {
	float: left;
	margin-right: 32px;
	height: 120px;
}

.form-item label {
	display: block;
	clear: both;
	min-height: 42px;
}

.form-item label.error {
	display: block;
	height: 16px;
	min-height: 0;
}

.form-item label span,
.textarea-item label span {
	display: block;
	clear: both;
	color: #888;
	font-size: 12px;
}

.form-item input {
	display: block;
	clear: both;
	border: 2px solid #888;
	padding: 3px;
	margin: 8px 0 8px 0;
}

.form-item input:focus,
.textarea-item textarea:focus {
	border-color: #3A414A;
	background-color: #feffed;
}

.submit-item {
	text-align: right;
	float: left;
	clear: both;
	margin-top: 16px;
}

.textarea-item {
	float: left;
	clear: both;
}

.textarea-item textarea {
	height: 206px;
	display: block;
	clear: both;
	border: 2px solid #888;
	padding: 8px;
	margin: 7px 0 16px 0;
	font-family: Georgia, "Times New Roman", Times, serif;
}

/* Comment validation error containers */

input.error, textarea.error {
	border-color: #a12020;
}

div.error, label.error {
	color: #c25252;
	padding-left: 24px;
	background: url(images/icon-error.gif) no-repeat left top;
	font-size: 12px;
}

div.errorlabels label {
	display: block;
}

/* @group Comment form */

#commentform {
	padding: 0 0 32px 0;
	clear: both;
	float: left;
}

#commentform .textarea-item {
	width: 864px;
}

/* @end */

/* @group Contact Form */

.wpcf7-form {
	padding: 0;
	margin: 0 0 32px;
	float: left;
}

.wpcf7-form .form-item {
	width: 192px;
	margin-right: 16px;
	height: 120px;
}

.wpcf7-form .form-item label {
	min-height: 16px;
}

.wpcf7-form .form-item input {
	width: 182px;
}

.wpcf7-form .textarea-item {
	min-height: 264px;
}

.wpcf7-form .textarea-item textarea {
 	width: 360px;
 	height: 160px;
 }
/* @end */

/* @group Search Form */

#searchform {
	padding: 16px;
	margin: 16px 0;
	background: #e1e8f1;
}

#searchform #s {
	border: 2px solid #597595;
	padding: 4px;
	margin-right: 8px;
	width: 192px;
}

/* @end */

/* @end */



/* @group Footer */

#footer {
	width: 100%;
	clear: both;
	float: left;
	background: #3C434C url(images/footer-bg.png) repeat-x;
	height: 48px;
}

#push {
	height: 48px;
	clear: both;
}

#footer-sidebar {
	margin: 0 16px;
	color: #888;
	font-size: 12px;
	float: left;
	line-height: 48px;
}

#footer-sidebar .widget {
	display: block;
}

#footer-sidebar .title {
	margin: 0;
	padding: 0;
	float: left;
	color: #999;
	font-size: 14px;
	line-height: 16px;
}

#footer-sidebar p {
	margin-top: 0;
}

#footer-sidebar a {
	color: #ddd;
}

#footer-sidebar a:hover {
	color: #eee;
}

/* @end */
