/* - - - - - - - - - - - - - - - - - - - - -

Title : Portfolio Stylesheet
Author : Arjen Scherff
URL : http://www.aratramba.nl
Description : Blog Screen CSS

- - - - - - - - - - - - - - - - - - - - - */

a{
	color: white;
	text-decoration: none;
}

#blogContainer{
	position: relative;
	z-index: 10;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Navigation
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#navigation{
	width: 632px;
	font-size: 1.8em;
	line-height: 1.8em;
	margin: 30px 0 0 144px;
	padding: .7em;
	background: #63DCFE;
}

#navigation a{
	border-bottom: 1px dotted white;
}

#navigation em{
	color: #aeedfe;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Blogposts
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#blog{
	margin: 40px 0 0 144px;
	width: 660px;
}
.post{
	font-size: 1.3em;
	line-height: 1.8em;
	background: url(../img/blog_post_background.gif) repeat-y ;
	margin-bottom: 20px;
	padding-left: 10px;
}

.post h2{
	display: block;
	font-size: 2.4em;
	line-height: 1em;
	font-weight: normal;
	margin: 20px 0;
	line-height: .9em;
	background: #33BDE2;
	padding: 5px 10px 5px 10px;
	font-family: "Baskerville","Adobe Garamond",Garamond, serif;
}

.post h2 a{
	display: block;
	width: 100%;
	height: 100%;
}

.post p.details{
	font-size: 1.8em;
	line-height: 1.2em;
	font-family: "Adobe Garamond", Garamond, Georgia, serif;
	width: 205px;
	float: left;
	color: #9BE5FD;
	margin: 11px .5em 0 -100px;
	padding: .4em;
	background: #57D7F9;
	border: 1px dotted white;
	position: relative;
}

	.post p.details span{
		width: 99px;
		height: 11px;
		background: url('/img/shadow.gif') no-repeat top left;
		display: block;
		position: absolute;
		left: 0;
		bottom: -12px;
	}

	.post p.details img{
		border: 6px solid #C1ECFC;
		margin-bottom: .5em;
		width: 94%;
		margin-top: 0;
	}

	.post p.details a{
		color: white;
		font-style: normal;
		border-bottom: 1px dotted white;
	}
	
	.post p.details a:hover{
		color: #333;
	}

	.post p.details em{
		color: white;
		font-style: normal;
	}

.post p{
	font-family: "lucida grande", "lucida sans unicode", verdana, helvetica, sans-serif;
	margin: .5em 0 0 0;
	padding: .5em;
	color: #fff;
	background: #33BDE2;
}

.post p.foot{
	border-top: 1px dotted white;
	clear: left;
}

.post p.foot a{
	color: #333;
	border: none;
}
.post p.foot a:hover{
	border-bottom: 1px dotted #333;
}


#blog .blog_divider{
	margin: 20px 0 20px 300px;
}

/* in text */

.post h3{
	font-size: 1.4em;
	font-weight: normal;
	margin: 5px 0 0 0;
	line-height: .9em;
	background: #33BDE2;
	padding: 5px;
}

.post h4{
	font-size: 1.2em;
	font-weight: normal;
	margin: 5px 0 0 0;
	line-height: .9em;
	background: #33BDE2;
	padding: 5px;
}

.post h5{
	font-size: 1em;
	font-weight: normal;
	margin: 5px 0 0 0;
	line-height: .9em;
	background: #33BDE2;
	padding: 5px;
}

.post img{
	border: 5px solid #c1ecfc;
	margin: .5em .5em 0 0;
	width: 98%;
}

.post img.small{
	float: none;
	border: 5px solid #c1ecfc;
	margin: .5em 0;
	width: auto;
	}

.post img.noborder{
	float: left;
	margin: .5em;
}

.post p a{
	color: #fff;
	border-bottom: 1px dotted #fff;
}

.post blockquote{
	margin: .5em 0;
}

.post blockquote {
	font-size: 1em;
	line-height: 2em;
	font-family: "Adobe Garamond", Garamond, Georgia, "Times New Roman", serif;
	font-style: italic;
	padding: 0 0 0 2em;
	text-align: justify;
}

.post ul,
.post ol{
	font-family: "lucida grande", "lucida sans unicode", verdana, helvetica, sans-serif;
	color: #fff;
	background: #33BDE2;
	list-style-type: disc;
	list-style-position: inside;
	margin: 0;
	padding: .5em;
}

.post ol{
	list-style-type: decimal;
}

.post .abc{
	list-style-type: upper-alpha;
}

.post abbr{
	cursor: help;
}

.post ins{
	text-decoration: none;
	font-style: italic;
}

.post q{
	font-style: italic;	
}

.post .bold{
	text-decoration: none;
	font-weight: bold;	
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Archief
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#archive{

}

#archive h3{
	text-transform: uppercase;
	font-size: 2em;
	font-weight: normal;
	margin: 20px 0 0 0;
	line-height: .9em;
	background: #33BDE2;
	padding: 5px;
}

#archive table{
	margin: 0;
	padding: 0;
	font-family: "lucida grande", "lucida sans unicode", verdana, helvetica, sans-serif;
	padding: .5em;
	color: #fff;
	font-size: 1.3em;
}

#archive table th{
	visibility: hidden;
}

#archive table td{
	margin: 0;
	padding: .7em 0;
	border-bottom: 1px dotted white;
}

#archive table td a:hover{
	color: #333;
}

#archive table td.date em{
	margin-left: 1px;
	padding: 0 .2em;
	background: #33BDE2;
	font-style: normal;
}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Comments
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#comments h4{
	text-transform: uppercase;
	font-size: 2em;
	font-weight: normal;
	margin: 20px 0 0 0;
	line-height: .9em;
	background: #33BDE2;
	padding: 5px;
}

#comments p.details{
	font-size: 1.8em;
	line-height: 34px;
	font-family: "Adobe Garamond", Garamond, Georgia, "Times New Roman", serif;
	color: #9BE5FD;
	margin: 20px 0 0 0;
	padding: 0 15px;
	background: url(../img/header_background.gif) repeat-x;
	border: none;
	border-top: 1px dotted white;
	height: 37px;
}

#comments p.details a{
	color: #fff;
	font-style: normal;
	border-bottom: 1px dotted white;
}


#comments p.details a:hover{
	color: #333;
}

#comments p.details em{
	color: #fff;
	font-style: normal;
}

#comments  blockquote.comment_item{
	font-size: 1.5em;
	line-height: 1.8em;
	margin: 0;
	padding: .7em;
	background: #57D7F9;
	border: 1px dotted white;
	border-top: none;
}

#comments  blockquote.comment_item p{
	margin: 0;
}

#comments  blockquote.comment_item a{
	border-bottom: 1px dotted white;
}

#comments  blockquote.comment_item em{
	color: #aeedfe;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Comment form
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


#commentForm h4{
	font-size: 1.8em;
	line-height: 34px;
	font-family: "Adobe Garamond", Garamond, Georgia, "Times New Roman", serif;
	font-weight: normal;
	color: white;
	margin: 20px 0 0 0;
	padding: 0 15px;
	background: url(../img/header_background.gif) repeat-x;
	border: none;
	border-top: 1px dotted white;
	height: 37px;
}

#commentForm fieldset{
	padding: 0;
	list-style-type: none;
	font-size: 1em;
	width: 400px;
	margin: 30px 0 0 0;
	border: none;
	padding: 5px 5px 100px 5px;
}

#commentForm label{
	font-family: Tahoma, Arial, "Microsoft Sans Serif", verdana, sans-serif;
	display: block;
	padding-bottom: 5px;
	color: #17515F;
}

#commentForm fieldset p{
	text-align: left;
	font-size: 1.2em;
	margin: 0 0 15px 0;
	float: none;
}

#commentForm fieldset input{
	border: 3px solid #B4EEFE;
	font-size: 1em;
	width: 250px;
	font-family: Tahoma, Arial, "Microsoft Sans Serif", verdana, sans-serif;
	padding: 8px;
	color: #17515F;
}

#commentForm fieldset textarea{
	overflow: auto;
	height: 200px;
	width: 382px;
	line-height: 1.5em;
	font-size: 1em;
	font-family: Tahoma, Arial, "Microsoft Sans Serif", verdana, sans-serif;
	overflow: auto;
	border: 3px solid #B4EEFE;
	padding: 8px;
	color: #17515F;
}

#commentForm fieldset .button{
	margin: 0 0 0 0;
	padding: 0;
	background: transparent;
	border: none;
	font-size: 1.1em;
	width: auto;
	color: white;
	font-weight: bold;
}