/*
Theme Name: 24o-2012
Theme URI: http://abeleto.nl/
Description: Based on the original WordPress theme that graced versions 1.2.x and prior.
Version: 0.1
Author: Branko Collin
*/

/* Wordpress core classes. */

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #eee;
	clip: auto !important;
	clip-path: none;
	color: #000;
	display: block;
	font-size: 1em;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

.sticky.post {
	border: 1px solid #f60;
	padding: .5em;
}
.sticky .sticky-message {
	background: #f60;
	color: #fff;
	margin: -.5em -.5em .75em -.5em;
	padding: 0em .5em;
}

.bypostauthor {}

.gallery-caption { font-size: small; }

/* Generics and resets. */

a {
	color: #f60;
}

a img {
	border: none;
}

h1.storytitle {
	margin-top: .7em;
}

h1 { font-size: 1.6em; }

#content img {
	max-width: 100%;
	height: auto;
}
#content iframe 
{
	max-width: 100%;
}


#content img, 
#content div.wp-caption {
	padding: 2px;
	border: 1px solid #ccc;
}
#sidebar img,
#content .sociable img 
{
	border: none;
	padding: 0px;
}
#content div.wp-caption img {
	border: none;
}
#content img.avatar {
	border: none;
	padding: 0px;
	vertical-align: middle;
	margin-right: .5em;
}

img.alignleft,
img.alignright,
img.aligncenter 
{
	margin: 0px auto 8px auto;
	display: block;
}

#content div.alignleft, 
#content div.alignright,
#content div.aligncenter {
	padding: 0px;
}

#content .navigation div.alignleft, 
#content .navigation div.older, 
#content .navigation div.alignright, 
#content .navigation div.newer
{
	margin-bottom: 1em;
}



#content .wp-caption-text {
	margin: 0px;
	padding: 2px;
	font-size: smaller;
}

a:hover {
	color: #999;
}

acronym, abbr {
	border-bottom: 1px dashed #333;
}

acronym, abbr, span.caps {
	cursor: help;
	font-size: 90%;
	letter-spacing: .07em;
}

blockquote {
	border-left: 5px solid #f60;
	margin-left: 1.5em;
	padding-left: 5px;
}
blockquote ul {
}

body {
	background: #fff;
	color: #000;
	font-family: arial;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

cite {
	font-size: 90%;
	font-style: normal;
}

div {
	margin: 0px;
	padding: 0px;
}

h2 {
	border-bottom: 1px dotted #CCC;
	font-family: arial;
	font-size: 1em;
	letter-spacing: 0.2em;
	margin: 1em 0 .75em 0;
	padding-bottom: 2px;
	font-weight: normal;
}

h3 {
	border-bottom: dotted 1px #ccc;
	font-family: arial;
	font-size: 0.94em;
	letter-spacing: 0.25em;
	margin-top: 15px;
	font-weight: normal;
}

h3.storytitle {
	font-size: 22px;
	font-weight: bold;
	margin-top: 0;
	margin-bottom: .75em;
	letter-spacing: normal;
}

ol#comments li p {
	font-size: 100%;
}

p, li, .feedback {
	font-family: arial;
}

/* classes used by the_meta() */
ul.post-meta {
	list-style: none;
}

ul.post-meta span.post-meta-key {
	font-weight: bold;
}

div.feedback {
	margin: 0px;
	padding: 0px;
	color: #f60;
	text-align: left;
	clear: both;
	font-size: 90%;
}

.meta {
	font-size: .75em;
	padding: 2px 0px;
}

.meta li, 
ul.post-meta li 
{
	display: inline;
}

.meta ul {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}

.meta, 
.meta a 
{
	color: #f60;
	font-weight: normal;
	letter-spacing: 0;
}

div.post {
	margin-bottom: 32px;
	clear: both;
	max-width: 38em;
}

.post p, 
.post li 
{
	line-height: 135%;
}

.storytitle {
	margin: 0;
}

.storytitle a {
	text-decoration: none;
}

p.thedate, p.theauthor {
	color: #000;
	font-size: 90%;
	/* letter-spacing: 3px; */
	font-weight: bold;
}
p.theauthor {
	font-size: 75%;
}
p.thedate {
	padding: 0px;
	margin: 0px;
	height: 32px;
}

label {
	display: block;
}
.comment-form-cookies-consent label {
	display: inline;
}

input[type="text"] {
	display: block;
	box-sizing: border-box;
	width: 100%;
	padding: .75em;
}

.clear {
	clear: both;
}
.clearfix::after {
	display: block;
	content: "";
	clear: both;
}

.low {
	font-size: 0px;
	line-height: 0px;
	height: 0px;
}

#commentform #name, 
#commentform #email, 
#commentform #url, 
#commentform textarea 
{
	background: #fff;
	border: 1px solid #333;
}

#commentform textarea {
	width: 100%;
}

#commentlist li ul {
	border-left: 1px solid #ddd;
	font-size: 110%;
	list-style-type: none;
}

#inter-post-navigator-1 {
	display: none;
}

#content .posts_navigator,
#content .inter-post-navigator 
{
	margin-bottom: 1em;
	max-width: 38em;
}

#content .posts_navigator:last-child {
	margin-bottom: 2em;
	padding: 1em 0em;
	border-top: 1px solid #f60;
	border-bottom: 1px solid #f60;
	text-align: center;
}

#page {
	padding: 16px 8px 0px 8px;
	text-align: left;
	position: relative;
}

#content {
	margin: 0px;
}

div#header {
	position: relative;
	max-width: 905px;
	background: #fff;
	color: #000;
	margin: 0;
	padding: 0px;
}

#header a {
	color: #f60;
}

#header #logo_and_title {
	margin-bottom: 1.5em;
	padding-right: 2.5em;
}

div#logo_img {
	display: none;
}

div#site_title {
	font-size: 2.25em;
	font-weight: bold;
}

div#site_title a {
	text-decoration: none;
}

div#description {
	font-size: 1.125em;
	color: #f60;
}

#header #header_items {
	margin: 0px; /* #header_items is an ul. */
	padding: 7px 0px 0px 0px;
	border: none;
}

#header_items h2 {
	margin: 0px;
	padding: 0px;
	border: none;
	font-size: 1em; /* resets */
	letter-spacing: inherit;
}

#header_items ul {
	margin: 0px; 
	padding: 0px;
	border: none;
}

#header_items li {
	list-style-type: none;
	min-height: 32px;
	text-align: right;
}
#header_items li ul,
#header_items li li,
#header_items li h2 {
	display: inline;
}
#header_items li li {
	padding-left: 7px;
	margin-left: 9px;
	height: auto;
}
#header_items a {
	color: #000;
}
#header_items a:hover {
	color: #f60;
}

#header_items input[type="submit"] {
	margin-right: 0px;
}

#header_items .blogroll img {
	vertical-align: middle;
}

#header_items li .blogroll li {
	padding: .4em;
	margin-left: 0px;
} 

#search-3 {
	height: auto;
}

#searchsubmit {
	margin: .25em;
	padding: .5em;
}

#links, 
#categories, 
#search, 
#archives, 
#other, 
#meta, 
#linkcat-2, 
#buttons 
{
}

#menu {
	background: #fff;
	max-width: 38em;
}

#menu form {
	margin: 0 0 0 13px;
}

#menu input#s {
	width: 80%;
	background: #EEEEEE;
	color: #000;
}


#menu ul {
	color: #000;
	font-weight: bold;
	list-style-type: none;
	margin: 0;
	padding-left: 3px;
	text-transform: lowercase;
}

#menu ul li {
	font: normal 110% arial;
	letter-spacing: 0.1em;
	margin-bottom: 16px;
	padding-bottom: 2px; /*border-bottom: dotted 1px #ccc;*/
}

#menu ul ul {
	font-variant: normal;
	font-weight: normal;
	line-height: 100%;
	list-style-type: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

#menu ul ul li, 
.bol 
{
	border: 0;
	font-family: arial, sans-serif;
	font-size: 90.91%;
	letter-spacing: 0;
	margin-bottom: .75em;
	padding: 0;
}

#menu ul ul ul li {
	font-size: 1em;
} 

#menu ul ul li a, .bol a {
	color: #33c;
	text-decoration: none;
}

#menu ul ul li a:hover, 
.bol a:hover 
{
	color: #fff;
	text-decoration: none;
}

#menu ul ul li a:hover, 
.bol a:hover 
{
	color: #669;
	text-decoration: none;
}

#menu ul ul ul.children {
	font-size: 142%;
	padding-left: 4px;
}

#menu label {
	font-size: 70%;
}

#menu .widget_categories li {
	display: inline-block;
}
#menu .widget_categories li::after {
	content: " - ";
}
#menu .widget_categories li:last-child::after {
	content: "";
}

#sidebar2 {
}

ul#sidebar2,
ul#sidebar2 li 
{
	margin: 0px;
	padding: 0px;
	border: none; 
}
ul#sidebar2 {
	padding: 31px 0px 0px 16px;
}
ul#sidebar2 li {
	list-style-type: none;
}

#nav_to_bottom a {
	text-decoration: underline;
}

#footer {
	clear: both;
	float: none;
	padding: 4px;
	background: #f60;
	color: #fff;
	font-size: 0.72em;
}

#footer a:link, 
#footer a:hover, 
#footer a:visited
{
	color: #fff;
}

#footer .menu-footer-container,
#footer #menu-footer 
{
	display: inline-block;
	margin: 0px;
}

#menu-footer li {
	list-style: none;
	display: inline;
}

#footer .credit {
	display: inline-block;
	margin: 0px;
	padding: 0px;
}

#wp-calendar {
	border: 1px solid #ddd;
	empty-cells: show;
	font-size: 14px;
	margin: 0;
	width: 90%;
}

#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;
	text-decoration: none;
}

#wp-calendar a:hover {
	background: #e0e6e0;
	color: #333;
}

#wp-calendar caption {
	color: #999;
	font-size: 16px;
	text-align: left;
}

#wp-calendar td {
	color: #ccc;
	font: normal 12px arial;
	letter-spacing: normal;
	padding: 2px 0;
	text-align: center;
}

#wp-calendar td.pad:hover {
	background: #fff;
}

#wp-calendar td:hover, 
#wp-calendar #today 
{
	background: #eee;
	color: #bbb;
}

#wp-calendar th {
	font-style: normal;
	text-transform: capitalize;
}

div#tagcloud {
	line-height: 30px;
	text-align: center;
}

/* suggestions form */

div.storyform th {
	text-align: left;
	font-weight: normal;
}
div.storyform th.topheading {
	font-weight: bold;
}
div.storyform input.text {
	width: 100%;
}
div.storyform textarea {
	width: 100%;
}

/* Advertisements. */
.ad_label {
	font-size: .75em;
	font-family: Times, "Times New Roman", serif;
	border: none; /* resets for the widget */
	letter-spacing: 1px;
	margin: 0px;
	padding: 0px;
}

.ad_inner {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 2px 0px;
}

#header2 .ad {
}
#header2 .ad_inner {
	width: inherit;
	height: 90px;
	overflow: hidden;
}
#sidebar2 .ad {
	width: 120px;
}
#sidebar2 .ad_inner {
	width: inherit;
	height: 600px;
	overflow: hidden;
}

/* Youtube videos. */

.videowrapper 
{
	display: block;
	position: relative;
	height: 0; /* Gives IE 5 and IE 6 'lay-out'. */
	padding-bottom: 56.25%; /* Default to 16:9 aspect ratio. */
}

.videowrapper iframe {
	border: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.videowrapper.aspect_ratio_500 { padding-bottom: 50%;    /* 2:1 */ }
.videowrapper.aspect_ratio_541 { padding-bottom: 54.05%; /* 1.85:1 */ }
.videowrapper.aspect_ratio_562 { padding-bottom: 56.25%; /* 16:9 */ }
.videowrapper.aspect_ratio_563 { padding-bottom: 56.25%; /* 16:9 */ }
.videowrapper.aspect_ratio_750 { padding-bottom: 75%;    /* 4:3 */ }

/* Hamburger menu. */

.menu-hamburger > .icon { cursor: pointer; }
.menu-hamburger > .icon .icon-show { display: none; }
.menu-hamburger > .icon .icon-hide { display: inline-block; }

.menu-hamburger.menu-hamburger-hidden > .content { display: none; }
.menu-hamburger.menu-hamburger-hidden > .icon .icon-show { display: inline-block; }
.menu-hamburger.menu-hamburger-hidden > .icon .icon-hide { display: none; }

@media (min-width: 560px) {
	/* - To force the hamburger menu on all displays, remove this 
	     media query and the rules it contains. 
	   - Don't forget to adapt the breakpoint to your own settings. */
	.menu-hamburger > .icon { display: none; }
	.menu-hamburger.menu-hamburger-hidden > .content { display: block; }
}

.menu-hamburger {
	background: #eee;
	margin: 1em;
	border: 5px solid #000;
	float: none;
	padding: 1em;
}

.menu-hamburger.menu-hamburger-hidden {
	float: right; 
	padding: 0px;
}

.menu-hamburger > .icon {
	border: 0px;
	padding: 0px;
	background: transparent;
	float: none; /* was: right; */
	position: absolute; 
	top: .5em;
	right: 1em;
	width: 3em; /* was: 3em; */
	height: 3em; /* was: 3em; */
}
.menu-hamburger-hidden > .icon {
	top: 0em;
	right: 0em;
}

#header #header_items.menu-hamburger {
	position: relative;
	background: #ffe9e0;
	border: 2px solid #f60;
	margin: 0em -1em 3em -1em;
	padding: 1em;
}
#header #header_items.menu-hamburger-hidden {
	position: initial;
	border: 0px;
	background: #fff;
	margin: 0em;
	padding: 0em;
}

#header_items.menu-hamburger li {
	text-align: left;
	margin-bottom: 1em;
}
#header_items.menu-hamburger li li:first-child {
	margin-left: 0px;
	padding-left: 0px;
	margin-bottom: 0em;
}

@media (min-width: 560px) {
	.menu-hamburger,
	.menu-hamburger.menu-hamburger-hidden {
		background: transparent;
		margin: 0;
		border: 5px dashed #000;
		padding: .5em;
		float: none; 
	}

	.menu-hamburger .content > ul {
		list-type: none; 
		display: block;
	}

	.menu-hamburger .content > ul > li {
		display: inline-block;
		vertical-align: top;
		background: #fff;
		border: 5px solid #000;
		padding: .5em;
		margin-right: 1em;
	}

	#header #header_items.menu-hamburger {
		background: #fff;
		margin: 0;
		padding: 0;
	}

	#header_items.menu-hamburger li {
		text-align: right;
		margin-bottom: 0em;
	}
}