@charset "utf-8";

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size:52%/1.52em;
    background: url(/img/bg.png) #542B15;
}

/* ** ** Font faces ** ** */
@font-face {
  font-family: 'ChunkFive Regular';
  src: url('fonts/Chunkfive.eot');
  src: local('ChunkFive Regular'), local('ChunkFive'), url('fonts/Chunkfive.woff') format('woff'), url('fonts/Chunkfive.svg#ChunkFive') format('svg'), url('fonts/Chunkfive.otf') format('opentype');
}

/* ** ** Common Addative Classes ** ** */
.left  { float:left}
.right { float:right}
.clear { clear:both; display:block; overflow:hidden; visibility:hidden; width:0px; height:0px;}
.hide  { display:none}

.align_right    { text-align:right;}
.align_left     { text-align:left;}
.align_center   { text-align:center;}
.align_justify  { text-align:justify;}

a {	color:#525252;	}
a:hover, a:focus { text-decoration:underline;}
a:active, a:visited { }

blockquote {
		font-family: Georgia,"Times New Roman", Times, serif; 
		margin:5px; 
		padding:10px;
		font-size:1.52em; 
		color:#999; 
		font-style:italic; 
		line-height:1.3em; 
		width:100%; 
		quotes:none;
	}
	blockquote.left {border-right:1px dashed #ccc; width:35%;}
	blockquote.right {border-left:1px dashed #ccc; width:35%;}

/* ** ** Header Styles ** ** */
h1, h2, h3, h4, h5 {margin:0 0 0.5em; line-height:1.1em; font-family: "ChunkFive Regular", Arial, Times; }
h1 {	font-size:2.52em;} 
h2 {	font-size:1.952em;} 
h3 {	font-size:1.652em;} 
h4 {	font-size:1.452em;} 
h5 {	font-size:1.252em;} 
h6 {	font-size:1.52em;}

/* ** ** ul li's ** ** */
ul li
{
	margin-left:25px;
}

/* ** ** custom select color ** ** */
::selection {
	background: #525252;
	}
::-moz-selection {
	background: #525252;
	color:#fff;
}
/* ** ** paragraph styling ** ** */
p {margin:0 0 1.52em;}
	p img.left {float:left;margin:1.52em 1.52em 1.52em 0;padding:0;}
	p img.right {float:right;margin:1.52em 0 1.52em 1.52em;}

/* ** ** forms ** ** */
form fieldset {-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius:5px; padding-top:5px; padding-left:5px; border:1px solid #ccc; }
form fieldset legend {font-size:1.4em; padding:0 5px;}
form input[type=text], form input[type=email], form input[type=url] {-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; height:20px; margin-bottom:5px; border:1px solid #ccc; padding:4px 0 1px 5px;}
form textarea {-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; margin-bottom:5px; border:1px solid #ccc; background: #F4FFA8; padding:4px 0 1px 5px;}
form label {display:block; height:20px; font-size:1.3em; font-weight: 600; font-family: "ChunkFive Regular", Arial, Times;}

form textarea, form input {
	box-shadow: 1px 0 2px rgba(0,0,0,0.5);
	-moz-box-shadow: 1px 0 2px rgba(0,0,0,0.5);
	-webkit-box-shadow: 1px 0 2px rgba(0,0,0,0.5);
	
	background: -moz-linear-gradient(center top, rgb(255,255,255) 0%, rgb(241,241,241) 90%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.9, #F3F3F3));
}

strong   		{	font-weight:600;}
em, dfn  		{	font-style:italic;}
dfn 	 		{   font-weight:600;}
sup, sub 		{   line-height:0;}
abbr, acronym   {	border-bottom:1px dashed #ccc;}
address 		{	margin:0 0 1.5em;font-style:italic;}
del 			{	color:#666;}
pre, code, tt   {	font:1em 'andale mono', 'lucida console', monospace;line-height:1.5; display:block;}
code 			{	background-color:#d5d2d8; display:block; padding:0px 2px 4px 26px; background:#fff url(/img/code.jpg) no-repeat left top; line-height:1.67em;}
pre 			{	margin:1.5em 0;white-space:pre;}


/* Lennaert's Blog */

img[src*="icons"] { vertical-align: middle; } /* Yeah Baby! CSS3 Selectors! */

body { background: url(/img/bg_header.png) repeat-x, url(/img/bg.png) #542B15; }

header {
	height:60px;
	width: 99.7%;
	position:relative; 
	margin: 10px 5px 10px 2px; 
	background: #F3F3F3;
	
	-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius:6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	
	background: -moz-linear-gradient(center top, rgb(255,255,255) 0%, rgb(241,241,241) 90%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.9, #F3F3F3));
}

	header .logo { float: left; font-family: "ChunkFive Regular", Arial, Times; font-size:2.3em; height:42px; padding-top:14px; padding-left: 15px; font-weight:700; color:#585858;}
	header .logo a { text-decoration: none; }
	header nav { position: absolute; top: 0px; left: 200px;}

/* ===== Navigation ===== */
nav ul { height: 33px;    width: 680px; padding: 5px; margin: 10px 0 0 70px;  overflow: hidden;  position: relative; top:0; float:left;display:inline;  }
	nav ul li { float: left; list-style: none; margin-left:0; }

	nav ul li.backLava {
		background: -moz-linear-gradient(center top, rgb(255,255,255) 0%, rgb(233,233,233) 90%);
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.9, #FFFEE6));
		
		width: 15px; 
		height:43px; 
		position: absolute; 
		-moz-border-radius: 10px; 
		-webkit-border-radius: 10px;
		border-radius:10px; 
		z-index: 8; 
		box-shadow: 0 1px 3px rgba(0,0,0,0.5);
		-moz-box-shadow: 1px 1px 3px #D0D0D0;
		-webkit-box-shadow: 1px 1px 3px #D0D0D0; 
	}

	nav ul li a { font-weight: 600; color: #808080; text-align: center; top: 8px;text-transform: uppercase;z-index: 10;display: block; float: left;position: relative; overflow: hidden;margin: 0 15px; height:33px; text-decoration: none;}
		nav ul li a:hover { text-decoration: none; }


.row .myContent { 
	float:left;
	background: #fff; 
	padding-top: 10px; 
	margin: 0 5px 10px 2px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius:6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5); 
	width: 99.7%;
}

footer { font-size:.8em; color: #fff; text-shadow: 2px 2px 2px #000; }
	
#frontpagePhoto {
	height:191px;
	width: 99.7%;
	position:relative; 
	margin: 0px 5px 10px 2px; 
	background: #F3F3F3;
	-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius:6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	background: url(/img/potlood.jpg);
}

/* ===== Articles ===== */
article { border: 2px solid rgb(214,214,214); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius:5px; margin-bottom: 20px; padding: 10px;
	background: -moz-linear-gradient(center top, rgb(255,255,255) 0%, rgb(214,214,214) 90%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.9, #EAEAEA));
	box-shadow: 10px 10px 5px #F0F0F0; padding: 5px 5px 5px 15px;
	-moz-box-shadow:2px 1px 2px #F0F0F0;
}
	
	article .date { float:left; padding-top:16px; width:60px; text-align:center; text-shadow:1px 0px 1px #FFE2D5;  margin-right: 20px; margin-bottom: 10px;  }
		article .date .month, .date .year { color:#8B8B8B; font-size:12px; font-weight:bold; line-height:12px; text-transform:uppercase; }
		article .date .day { color:#797979; font-size:36px; font-weight:bold; letter-spacing:-0.15em; line-height:36px; }
	article h4 { color: #580058; margin-top: 5px; margin-bottom: 1px; }
	article p { text-align: justify; }
	article .articledetails { color: #FF6600; margin-bottom: 15px; margin-top: -10px; font-size:12px;}
	article time {  }
	article .readmore { float:right;  height: 100%; width: 60px; }
	article a { text-decoration: none;}

	article[class="small"] { 
		height: 120px;
		border: 2px solid #F2FED8;
		background: -moz-linear-gradient(center top, #fff 0%, #F2FED8 90%);
		background-image: 
		      -webkit-gradient(
		        linear,
		        left top,
		        left bottom,
		        color-stop(0, #fff),
		        color-stop(0.9, #F2FED8)); }
	article[class="small"] .date {  height: 120px; } 

	.miniArticles div { margin-left: 10px; line-height: 22px;}
.miniArticles div span { float: right; margin-right: 10px; background: #C0C0FF; width: 30px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius:5px; text-align: center; height: 19px; font-size: 10px; }


/* ===== Sidebars ===== */
.about_myself { 
	padding:10px;
	font-size:1.52em; 
	color:#999; 
	font-style:italic; 
	line-height:1.3em;
}
	
aside h2, aside h3, h2[class=heading], h3[class=heading], h1[class=heading] { 
	width: 96%;
	position:relative; 
	margin: 5px 1px 2px 1px; 
	padding: 10px;
	background: #F3F3F3;
	-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius:6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);	
	background: -moz-linear-gradient(center top, rgb(255,255,255) 0%, rgb(241,241,241) 90%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.9, #F3F3F3));		
}

	h1[class=heading] { font-size: 22px; }
	aside h3 { font-size: 17px; width: 90%; }

/* ===== Comments ===== */
.comments article { }
	.comments article .avatar { float: left; padding-top:6px; width:80px; height: 100%; text-align:center; text-shadow:1px 0px 1px #FFE2D5;  margin-right: 10px; margin-bottom: 10px; }
	.comments article .avatar img { float:left; border:1px solid #000; width:64px; height:64px; }

div .addcomment {
	float:left;
	background: #fff; 
	width: 99.2%; 
	margin-left: 1px; 
	margin-bottom: 30px; 
	padding-top: 6px;
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius:6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	background: -moz-linear-gradient(center top, rgb(255,255,255) 0%, rgb(241,241,241) 90%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.9, #F3F3F3));		
}
	.addcomment input { width: 90%; }

	
/* ===== Lists ===== */
aside ul { list-style-type: none; padding: 0px; margin: 0 -15px; }
	aside ul li	{ background-image: url(/img/icons/world_go.png); background-repeat: no-repeat; padding-left: 25px; }
	aside ul.rss li	{ background-image: url(/img/icons/feed.png); background-repeat: no-repeat; padding-left: 25px; }
	aside ul.categories li { background-image: url(/img/icons/report.png); background-repeat: no-repeat; padding-left: 25px; }
	aside ul { font-size: 11px; }
	aside ul a	{ font-size: 12px; font-weight: 600; }
aside p { margin-left: 10px; }

.iconText img { margin-left: 10px; margin-right: 9px;}



/* Whoot! My Alerts msgs are so nice I would almost make a mistake on purpose! */
.flash {
	width: 99.7%; 
	height: 50px; 
	background: #F3F3F3; 
	margin: 10px 5px 10px 2px;
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius:6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}	
	.flash img { position: relative; top: 15px; left: 20px; }
	.flash span { position: relative; top: 16px; color: #fff; font-weight: 600; left: 30px; }

	#alertMsg { 
		background: -moz-linear-gradient(center top, #800000 0%, #A80000 90%);
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #800000), color-stop(0.9, #A80000));
	}
	
	#infoMsg {
		background: -moz-linear-gradient(center top, #800000 0%, #A80000 90%);
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #008000), color-stop(0.9, #00B900));
	}