/* global style reset */
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, dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { 
	margin: 0 auto; 
	padding: 0 auto;
}
html,
body {
	font-size:small;
	line-height:1.35;
	font-family:Arial,sans-serif;
	background: #000000;
}
h1 {
	margin:0 0 0.3em 0;
	font-size:2.4em;
	line-height:1;
	font-weight:normal;
	color:#ED1C24;
}
h2 {
	margin:0 0 0.4em 0;
	font-size:1.7em;
	font-weight:bold;
	line-height:1;
}
h3 {
	font-size:1.2em;
	margin:1em 0 0.6em 0;
}
h4 { margin:1em 0 0.5em 0; }
h5 { margin:1em 0 0.5em 0; }
p { margin:0 0 0.8em 0; }
ul {
	margin:0.4em 0 0.8em 0;
	list-style:none outside;
}
	ul li {
		margin:0 0 0.3em 0;
		padding:0 0 0 13px;
	}
ol { margin:0.4em 0 0.8em 3.4em; }
blockquote {
	margin:1em 0;
	padding:0 1em;
	border-left:3px solid #D3E0E0;
	color:#7f8485;
	font-style:italic;
}
blockquote.amazing {
	border:0;
	font-size:1.25em;
	font-style:italic;
	line-height:1.4;
	color:#ED1C24;
}
	blockquote.amazing p { margin:0.4em 0; }
	blockquote.amazing cite {
		display:block;
		font-size:0.8em;
		font-style:normal;
		color:#AAA;
	}
hr { margin:1.4em 0; }

/* inline/textual elements */

a {
	color:#cc0000;
	text-decoration:none;
	cursor:pointer;
}
a:hover {
	color:#ED1C24;
}
#canvas a:hover img { border-color:#0073FF !important; /* #ED1C24 */ }
a.more {
	position:relative;
	float:left;
	margin:0.6em 0.6em 0.6em 0;
	padding:0 0 0 13px;
	font-size:0.86em;
	line-height:1.25;
	white-space:nowrap;
}
a.more:hover { background-position:2px -96px; }
a.back {
	padding:0 0 0 13px;
}
a.back:hover { background-position:2px -96px; }
a.external {
	padding:0 11px 0 0;
}
a.external:hover { background-position:100% -96px; }
a.dimmed {
	padding:0 11px 0 0;
	color:#7F8485;
	line-height:1.15;
}
a.dimmed:hover { background-position:100% -96px; color:#0073FF; }
a.icon {
	position:relative;
	left:-2px;
	float:left;
	margin:0.6em 0.6em 0.6em 0;
	padding-left:17px;
	background-repeat:no-repeat;
	background-position:1px 0 !important;	
	font-size:0.86em;
	line-height:1.25;
	white-space:nowrap;
}
address {
	font-style:normal;
	border:0;
	display:block;
	margin:0.5em 0 1em 0;	
}
img {
	border:2px solid #D3E0E0;
	vertical-align:middle;
}
img.left {
	clear:left;
	float:left;
	margin:0 10px 10px 0 !important;
}
img.right {
	clear:right;
	float:right;
	margin:0 0 10px 10px !important;
}

/* tables */

table {
	margin:0.5em 0 1em 0;
	border:0;
}
	td,
	th {
		vertical-align:top;
		text-align:left;
		font-weight:normal;
	}

.user-thumb {
	position:relative;
	float:left;
	margin:0 0 1px -60px;
}
img.press-release {
	border:0 !important;
	padding:2px;
}

.mbf-item { display:none; }
a.piclens {
	clear:both;
	float:left;
	padding-left:20px;
}

/* sIFR */
.sifr { font-family:Arial, sans-serif; 
	text-indent:-100em;
}
.sIFR-flash {
	visibility:visible !important;
	margin:0;
	padding:0;
}
.sIFR-replaced, 
.sIFR-ignore { 
	visibility:visible !important;
	margin-bottom:-0.1em !important;
}
#canvas #sub-content .sIFR-replaced,
#canvas #extras .sIFR-replaced { margin-bottom:-0.4em !important; }
.sIFR-alternate {
	position:absolute;
	left:0;
	top:0;
	width:0;
	height:0;
	display:block;
	overflow:hidden;
} 

html,
body {
	height:100%;
	color:#000;
	background:#D3E0E0;
}
#canvas {
	position:relative;
	z-index:2;
}
	#header {
		width:100%;
		min-width:1002px;
		position:relative;
		z-index:100;
	}
	#content {
		position:relative;
		width:968px;
		margin:0 auto;
		padding:3.8em 13px 18em 13px;
		background:#FFF;
		color:#0c151b;
	}
	#content:after {	
		content:".";
		height:0;
		display:block;
		clear:both;
		visibility:hidden;
	}		

	#footer {
		position:absolute;
		z-index:100;
		bottom:0;
		width:100%;
		min-width:1002px;
	}
		#footer .body {
			position:relative;
			width:968px;
			margin:0 auto !important;
			padding:1em 13px 0.4em 13px;
			border-top:3px solid #D3E0E0;
			color:#FFF;
			font-size:0.846em !important;
			line-height:1.7em;
		}
		
body.articles #main-content h1,
body.events #main-content h1 { margin-top:-0.2em; } 
body.articles #main-content h1,
#extras h1 {
	position:absolute;
	left:-10000em;
}
/* articles */
	
div.article {
	clear:both;
	margin:-8px -12px 1em -12px;
	padding:8px 12px 8px 72px;
	overflow:hidden;
}
#articles div.article {
	margin-top:0;
}

code {
	clear:both;
	font-family:monospace;
	white-space:pre;
	margin:1px;
}
.article-body code {
  width: 400px;
  overflow-x: auto;
  display: block;
  height: auto;
}

	div.article h2 {
		margin-left:-60px;
		margin-bottom:0.2em;
	}
	em.press-release { 
		text-transform:uppercase;
		font-style:normal;
		font-size:0.88em;
	}	
	.article-meta {
		margin:0 0 0.4em 0;
		color:#7f8485;
		font-size:0.86em;
	}	
		.article-meta a { color:#3f4445; }
		.article-meta a:hover { color:#0073FF; }			
		.by-author { background:#fff7d6; }		
			.by-author .user-thumb img { border-color:#FFF; } 			
	body.articles .article-intro { 
		font-weight:bold; 
		margin:0 0 2em 0;
	}	
	body.articles #articles .article-intro { 
		font-weight:normal; 
		margin:0;
	}
	/* article list (tiny version) */
	
	#canvas .article-list {
		line-height:1.25em;
		margin:0.4em 0 -0.4em 0;
	}	
		#canvas .article-list li {
			margin:0 0 0.4em 0;
			padding-left:62px;
			background:none;
			overflow:hidden;
		}	
			#canvas .article-list li .user-thumb { margin:0 0 0.2em -62px; }
			#canvas .article-list li strong { font-weight:normal; }
				#canvas .article-list li strong a { display:block; }
			#canvas .article-list li .article-meta { margin-bottom:0; }	
	

/* error page */
		

#logo {
	position:relative;
	width:994px;
	margin:0 auto;
	z-index:1;
	font-size:23px;
	font-weight:bold;
}
#logo a {
	display:block;
	width:119px;
	height:24px;
	position:absolute;
	top:0.45em;
	left:20px;
	background:url("../images/logo-screen.gif");
	outline:0;
}
	#logo a img {
		position:absolute;
		left:-10000em;
	}	
		
/* header search field */

#header form {
	margin:0;
	padding:0.65em 26px 0.5em 12px;
	float:right;
}
	#header form fieldset { float:left; }
	#header input.text {
		width:171px;		
		margin:-0.6em -2px -0.4em 0;
		color:#AAA;
	}	
	#header input.active { color:#000; }
	#header input.submit {
		width:20px;
		margin:-0.6em 0 -0.4em 0;
		padding:0;
		border:2px solid #D3E0E0;
		background:url("http://lbi.lostboys.nl/images/icons/arrow-right.gif") #FFF 50% 5px no-repeat;
		text-indent:-1000em;
		overflow:hidden;
	}
	
	/* safari */
	body:last-child:not(:root:root) #header input.submit { 
		text-indent:0;
		width:auto;
		margin-left:0.4em;
	}

/* page footer */

#footer .column { margin-bottom:1em !important; }
	#footer h2 {
		margin:0 0 0.3em 12px;
		font-size:1em;
		font-weight:bold;
		line-height:1.5em;
		color:#FFF;
	}
	#footer ul { margin:0; }
		#footer li {
			padding:0;
			background:none;
			margin:0;
			line-height:1.35em;
		}
		#footer a { 
			float:none;
			margin:0;
			display:block;
			margin:0 0 0.3em 0;
			color:#FFF;
		}
		#footer #footer-feeds a { 
			margin-left:12px; 
			background-position:0 0 !important;
			font-size:1em;
		}
		#footer a:hover,
		#footer a.current { 
			color:#000;
			text-decoration:none;
		} 
		#footer em.lbi {
			clear:both;
			display:block;
			padding:0 12px;
			font-style:normal;
			text-align:right;
			background:url('../images/lbi-logo.gif') 12px 50% no-repeat;
		}
			#footer em.lbi a {
				position:static;
				z-index:0;
				display:inline;
				padding:0;
				background:none;
			}
		#footer #footer-navigation a,
		#footer #footer-jobs a,
		#footer #footer-other a { 
			padding:0 0 0 13px; 
			background:url("http://lbi.lostboys.nl/images/icons/arrow-right-dark.gif") 2px 104px no-repeat;
		}
		#footer #footer-navigation a:hover,
		#footer #footer-jobs a:hover,
		#footer #footer-other a:hover { background-position:2px 4px; }
		#footer #footer-other li.basecamp { margin-top:1.2em; }


h1 { 
	position:absolute;
	left:-10000em;
}
html, 
body { 
	height:100%;
	background:#000;
}
#canvas { height:100%; 
	z-index:100;
	position:absolute;
	top:0px;
}	
	#header {
		padding-bottom:1em;
		background:url("../images/backgrounds/navigation.png") 0 100% repeat-x;
		color:#ED1C24;
	}
	#content {
		width:968px;
		min-height:100%;
		margin-top:-4.1em;
		padding:0 13px;
		background:transparent;
		overflow:visible;
	}
#oer-badge {
	position:absolute;
	top:60px;
	right:30px;
	width:80px;
	height:80px;
	display:block;
	background:#000000 no-repeat;
	text-indent:-1000em;
	z-index:-10000;
	overflow:hidden;
}

/* lists (minimized version) */

	#canvas .article-list li { padding-left:32px; }	
		#canvas .article-list li .user-thumb { margin-left:-32px; }
	
body.jsready #jumpstations .item.opened .body { display:block; }
#jumpstations .item h2 { margin:0 0 0.2em 0; }
#jumpstations .item .head p { margin:0; }				
#jumpstations .item h2  {
	display:block;
	height:31px;
	overflow:hidden;
	text-indent:-10000em;
	background-repeat:no-repeat;
}
#jumpstations #bedrijf h2 a { background-image:url("http://lbi.lostboys.nl/images/boxes/jmpst-bedrijf.gif"); }
#jumpstations #vak h2 a { background-image:url("http://lbi.lostboys.nl/images/boxes/jmpst-blog.gif"); }
#jumpstations #werk h2 a { background-image:url("http://lbi.lostboys.nl/images/boxes/jmpst-werk.gif"); }
#jumpstations #contact h2 a { background-image:url("http://lbi.lostboys.nl/images/boxes/jmpst-contact.gif"); }		
#jumpstations .item .body h3 {
	margin-top:0;
	font-size:1em;
}			
#jumpstations .item .body h3 a { text-decoration:none; }

/* footer (miniature version) */

#footer {
	position:absolute;
	bottom:0;
	left:0;
	padding-top:13px;
	background:url("../images/backgrounds/navigation.png") repeat-x;
	color:#FFF;
}
	#footer .body {
		padding-top:0.5em;
		padding-bottom:0.3em;
		background:none transparent;
		border:0;
		overflow:hidden;
	}
		#footer h2 {
			position:absolute;
			left:-10000em;
		}
		#footer ul {
			margin:0;
			padding:0 12px;
			float:right;
			overflow:hidden;
		}
			#footer li {
				float:left;
				margin:0 0 0 20px;
			}
				#footer a {
					display:inline;
					line-height:1.7;
					padding:0 0 0 13px; 
					background: url("../images/icons/arrow-right-dark.gif") 2px 103px no-repeat;
					color:#FFF;
				}
				#footer a:hover { 
					background-position:2px 3px;
					color:#000;
					text-decoration:none;
				}
				#footer a.external { background:none; }