/* RESET v1.0, 2008-02-12 */
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;
	font-size: 62.5%;
}

ol,ul {
	list-style:none;
}

blockquote,q {
	quotes:none;
}

blockquote:before,blockquote:after,q:before,q:after {
	content:'';
	content:none;
}


	
/* remember to define focus styles! */
:focus {
	outline:0;
}


	
/* remember to highlight inserts somehow! */
ins {
	text-decoration:none;
}

del {
	text-decoration:line-through;
}


	
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse:collapse;
	border-spacing:0;
}


	
/* GENERAL */
html,body {
	font-family:Arial;
	font-size:85%;
	word-spacing:.1em;
	color:#000;
	text-decoration:none;
	text-align:center;
}

body {
	background:#e9e8e4;
}


	
/* TYPOGRAPHY */
h1,h2,h3,h4 {
	font-family:"Helvetica Neue", Helvetica, Arial;
	font-weight:700;
}

h1 {
	font-size: 4em;
	margin: .8em 0 .5em;
	line-height: 1.2em;
	letter-spacing: -2px;
}

.page h1 {
	background: url( 'gfx/header_bg.png' ) no-repeat bottom left;
	padding: 0 0 25px 30px;
	margin-top: 20px;
	width: 137px;
	text-align: right;
	}
	
	#content .page .container {
		border: none;
		margin: 0 60px 20px;
		overflow: hidden;
		zoom: 1;
		}
	
	#content .page .container h3 span, #content .page .container strong span {
		color: #cee271;
		}
	
	#content .page .container h3 {
		color: #000; 
		font-size: 1.5em;
		}
		
	#content .page .container p {
		width: auto;
		}

h2 {
	font-size: 4em;
	margin: 1em 0 0;
	line-height: 1em;
	letter-spacing: -2px;
}

h3 {
	font-size: 2em;
}

h4 {
	font-size: 1em;
}

ul,ol,dl,p {
	line-height:1.4em;
	padding:0 0 1em;
}

small {
	font-size:.8em;
	margin:-2em 0 1em;
	display:block;
}

li small {
	margin:0;
}

#heading {
	margin:0;
	padding:0;
	text-indent:-9999px;
	position:absolute;
}


	
/* Links */
a {
	text-decoration:none;
}

.box a,#subheader a {
	color:#ccc;
}

.box a:hover,#subheader a:hover {
	color:#fff;
}

h1 a,h2 a {
	color:#000;
}

h1 a:hover,h2 a:hover {
	color:#2d2d2d;
}

/*
.cap {
	font-size: 2em;
	font-weight: 700;
} */


	
/* IMAGES */
img.left,img.right {
	float:left;
	overflow:hidden;
	display:inline;
	margin:0 10px 0 0;
}

img.right {
	float:right;
	margin:0 0 10px;
}


	
/* LAYOUT */
#container {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:100;
	text-align:center;
}

#wrapper {
	margin:0 auto;
	width:960px;
	text-align:left;
}

#header h1#logo,#header p#logo {
	margin:0;
	padding:10px 0 0;
	line-height:0;
	float:left;
	display:inline;
	overflow:hidden;
}

#header h1#logo a,#header p#logo a {
	display:block;
	width:169px;
	height:71px;
	text-indent:-9999px;
	background:url(gfx/logo.jpg) no-repeat;
}

#header #search {
	position: relative;
	float: left;
	overflow: hidden;
	width: 779px;
	border: 6px solid #2d2d2d;
	border-width: 0 6px;
	background: #fff;
	text-align: center;
}

#header #search span#question {
	font-size: 40px;
	position: absolute;
	top: 6px;
	right: 13px;
	}
	
	#header #search span#question a {
		color: #cee271;
		font-family: "Helvetica Neue",Helvetica,Arial;
		font-weight: 900;
		}

#header #search p {
	width: 557px;
	margin: 0 auto;
	text-align: left;
	padding: 10px 0;
}

#header #search span#search-box {
	background: url( 'gfx/search_bg.png' ) no-repeat top left;
	width: 557px;
	height: 57px;
	display:block;
	margin: 0 auto 10px;
	}


#search label {
	font-family:"Helvetica Neue", Helvetica, Arial;
	font-weight:700;
	font-size:1.4em;
	display:block;
	margin:0 0 10px 5px;
	cursor:pointer;
}

#search input.text {
	padding: 0;
	font-family: "Helvetica Neue",Helvetica,Arial;
	background: #000;
	border: 7px solid #000;
	color: #fff;
	width: 460px;
	margin: 5px;
	float: left;
}


	
/* Only for IE: */
#search input.text {
	overflow: visible;
	padding: 0 2px;
}


	
/* Other Browsers: */
#search input.text {
	font-size: 1.6em;

	
/* What you want*/

	
/*\*/
	padding:0;

	
/* Hiding for IE5/Mac */
}

#search input.submit {
	float: right;
	width: 34px;
	height: 34px;
	margin: 5px 20px 0 0;
	background: url( 'gfx/search_btn.png' ) top center;
	text-indent: -10000em;
	border: none;
	cursor: pointer;	
}

#search span#search-box:hover input.submit {
	background-position: bottom center;
	}

#left,#article,#subheader {
	float:left;
	display:inline;
}

#left {
	width:154px;
	margin-right:15px;
}

.box {
	background:#000;
	color:#fff;
	margin-bottom:16px;
	padding-top:10px;
}

#left hr {
	margin:0 15px 10px;
	height:1px;
	background-color:#474747;
	color:#474747;
	border:0;
}

#left h4,#left p,#left ul {
	margin:0 12px;
	line-height:1.4em;
}

#left h4 {
	margin-bottom:.5em;
}

#left span {
	color:#cee271;
	font-weight:400;
}


p.taggar {
	margin: 0 0 0 25px;
	float: left;
	}

.social li {
	float:left;
	display:inline;
	overflow:hidden;
}

.social a {
	background:url(gfx/social_stripes.gif) no-repeat;
	display:block;
	width:16px;
	height:16px;
	text-indent:-9999px;
	margin-right:10px;
}

div.sociable {
	float: right;
	margin: 0px 25px 10px 0;
	}

a.spotify {
	background-position:0 0;
}

a:hover.spotify {
	background-position:0 -24px;
}

a.facebook {
	background-position:-20px 0;
}

a:hover.facebook {
	background-position:-20px -24px;
}

a.twitter {
	background-position:-39px 0;
}

a:hover.twitter {
	background-position:-39px -24px;
}

#article {
	width: 791px;
	background: #000;
}

#subheader {
	border: 6px solid #2d2d2d;
	background: #000;
	margin-bottom: 25px;
	width: 779px;
	line-height: 2em;
	position: relative;
}

#subheader span {
	position:absolute; 
	top: 0; 
	right: 10px;
	color: #cee271;
	}
	
	#subheader span a {
		color: #fff;
		}

#subheader li,#subheader h4 {
	float: left;
	color: #cee271;
	line-height: 2.5em;
}

#subheader ul {
	border-bottom: 1px solid #474747;
	margin: 0 15px;
	padding: 0;
	width: 525px;
	}

	#subheader ul.no-border {
		border: none;
		}

	#subheader li {
		margin-right:5px;
		}
	
	#subheader h4 {
		color:#fff;
		margin-left:15px;
		width:100px;
		}

#subheader hr {
	margin:0 15px;
	height:1px;
	background-color:#474747;
	color:#474747;
	border:0;
}

#content {
	float: left;
}

#aside {
	float: left;
	display: inline;
	overflow: hidden;
	background: #2D2D2D;
}

#content {
	width:540px;
	background:#fff;
	border:6px solid #000;
	}

	#content #more-posts {
		padding: 20px 0 0 20px;
		background: #000;
		color: #fff;
		font-size: 1.3em;
		}

#content .post h1,#content .post h2,#content .post p,#content .post ul,#content .post ol,#content .post small {

}


/* Ogillar hr, content är content och presentation is presentation. Om det är görbart.
#content hr {
	width:100%;
	margin:0;
	height:6px;
	background-color:#000;
	color:#000;
	border:0;
} */

#content .post img.cfi_align { /* Vi tvingar width och sätter height till auto, !important är väl kanske inte att föredra dock... */
	width: 540px !important;
	height: auto !important;
}

#content img.wp-smiley,#content img.alignleft,#content img.left,#content img.right {
	width:auto!important;
}

#content .column {
	float:left;
	overflow:hidden;
	display:inline;
	width:50%;
}

#content .follow-us {
	margin: 0 auto;
	width: 150px;
	text-align: center;
	overflow: hidden;
	}
	
	#content .follow-us strong {
		font-size: 1.5em;
		}

	#content .follow-us a#twitter {
		float: left;
		width: 43px;
		height: 48px;
		margin-bottom: 10px;
		text-indent: -10000em;
		background: url( 'gfx/twitterlogo_big.png' ) no-repeat;
		}
	
	#content .follow-us a#facebook {
		float: right;
		width: 43px;
		height: 48px;
		margin-bottom: 10px;
		text-indent: -10000em;
		background: url( 'gfx/facebooklogo_big.png' ) no-repeat;
		}
		
	#content .follow-us a#email {
		clear: both;
		display: block;
		background: #000 none repeat scroll 0 0;
		color: #cee271;
		}

	#content .follow-us a#email:hover {
		color: #000;
		background: #cee271;
		}

#content .narrow {
	float: left;
	width: 40%;
	margin: 40px 0;
	}
	
	#content .narrow div {
		height: 150px;	
		}
		
		#content .narrow div strong {
			font-size: 1.4em;
			margin: 0 0 5px;
			display: block;
			}
			
		#content .narrow div p {
			padding: 0 0 3px;
		}

#content .margin-left-20 {
	margin-left: 70px;
	}

#content .post {
	border-top: 6px solid #000; /* Lägger den svarta bottenranden här istället. Detta även för att undvika h2s margin collapse */
	position: relative; /* För att kunna flytta på datumet i relation till varje post */
	}

	#content .post h3 {
		font-family: "Helvetica Neue",Helvetica,Arial;
		font-size: 16px;
		color: #cee271;
		margin: 0 0 20px 0;
	}
	
	#content .post .container {
		margin: 0 23px 10px;
		padding-top: 1px;
		border-bottom: 5px solid #e8e8e8;
		position: relative;
		}

		#content .post p {
			width: 310px;
			font-size: 1.1em;
		}
		#content .post p.cufon {
			font-size: 1.4em;
			font-weight: 700;
			margin: 0;
			padding: 0;
			}
		
		
		#content .page p {
			font-size: 1.1em;
			}
		
				
			#content p a, ul.tweets p a,  #content .page .container a{
				color: #cee271;
				background: #000;
				}

			#content p a:hover, ul.tweets p a:hover, #content .page .container a:hover {
				color: #000;
				background: #cee271;
				}


		 span.cap span {
		    display: inline;
		    float: left;
		    font-size: 3em;
		    line-height: 0.75em;
		    margin: -1px 2px -5px 0;
		    font-weight: 900;
		    text-transform: uppercase;
			}
		
		#content .post blockquote {
			float: right;
			width: 150px;
			margin: 3px 0 1em 0;
			}
		
		#content .post blockquote p {
			width: auto;
			float: none;
			font-weight: 900;
			text-align: left;
			word-wrap: break-word;
			}
		
		#content .post blockquote p:before /*, #content .post blockquote p:after */  {
			content: "//";
			color: #cee271;
			font-size: 16px;
			display: inline;
		    float: left;
		    font-size: 5em;
		    line-height: 0.8em;
		    text-transform: uppercase;

		}
		
		#content .post blockquote p:before {
			margin: 0 10px 0 0;
		}
		
		#content .post blockquote p:after {
			margin: 0 0 0 10px;
		}

#content .post .date {
	background: #cee271;
	/* margin:10px 0 0 10px!important; */
	text-align:center;
	font-family:arial;
	font-size:14px;	
	position: absolute;
	top: -25px;
	left: -20px;
	/* Not needed right now
	left: 0; */
	z-index: 10;
}

#content .post .move-down {
	top: 10px;
}

#content h2.move-down {
	margin-top: 1.5em;
}

#content h3 span {
	color: #cee271;
}

#content .date p {
	width:47px;
	display:block;
	position:relative;
	background:#000;
	color:#fff;
	margin:-5px 5px 5px -5px;
	padding:3px 0 0;
	border:1px solid #000;
	font-size: 13px;
	font-weight: 900;
}

#content .date span {
	display:block;
	background:#fff;
	color:#000;
	font-size:12px;
	font-weight:900;
}

#aside {
	width:238px;
	}

	#aside h3, #aside h4 {
		color:#FFF;
		margin: 0 15px;
		padding: 10px 0 0;
		border-top: 1px solid #474747;		
		}

#aside img.twitter {
	margin:15px 10px;
}

.tweets li {
	background:#fff;
	margin:30px 12px 0 60px;
	padding-right:10px;
}

.tweets .shadow {
	float:left;
	background:#cee271;
	margin:-10px 0 0 -43px!important;
}

.tweets .shadow img {
	width:48px;
	height:48px;
	display:block;
	position:relative;
	background-color:#fff;
	margin:-5px 5px 5px -5px;
}

.tweets h5 {
	margin-left:15px;
	padding-top:8px;
}

.tweets h5 a {
	color:#000;
}

.tweets h3 {
	color:#FFF;
	margin-left:15px;
}

.tweets p {
	margin:0 0 0 15px;
	line-height:1.4em;
	word-wrap:break-word;
}

.tweets .meta {
	margin-left: 7px;
	border-top: 1px solid #cee271;
	font-style: italic;
	font-size: 10px;
}

	.tweets .meta .twitter-me {
		overflow: hidden;
		float: right;		
		text-indent: 10000em;
		background: url( 'gfx/tweet_me_black.png' ) no-repeat;
		height: 12px;
		width: 15px;
		margin-left: 5px;
	}
	.tweets .meta .follow-me {
		overflow: hidden;
		float: right;
		text-indent: 10000em;
		background: url( 'gfx/follow_me_black.png' ) no-repeat;
		height: 13px;
		width: 10px;
	}

hr {
	margin:0 15px;
	height:1px;
	background-color:#474747;
	color:#474747;
	border:0;
}

.cfi_alignleft {
	width:200px;
}

/* All # and . that needs a clear float fix should be added to one of these. */

#commentform p, #respond, #commentform, ol.commentlist li div.comment-body .meta, #subheader ul, #content .post .meta{
	overflow: hidden;
	zoom: 1; /* Check that this is correct*/
}

/*
#nothing-here-yet {
	overflow: scroll;
	zoom: 1;
}
*/

/* !Comment control */
#comments {
	background: #e8e8e8;
	padding: 20px;
	}

	#comments h3 {
		font-size: 24px;
	}


/* !Comment list control */
ol.commentlist {
	margin: 30px 0 0;
	padding: 0px;
	}

	ol.commentlist li {
		margin: 5px 0 20px;
		padding: 1px 5px 5px 27px;
		background: #cee271 url( gfx/comment_arrow.png ) no-repeat top left;
		}
		
		ol.commentlist li div.comment-body {
			margin: -10px 0 0 -10px;
			background: #fff;
			}

		ol.commentlist li div.comment-body .avatar_cont {
			float: left;
			margin: 6px 0 0 12px;
			}
			
		ol.commentlist li div.comment-body .meta {
			border-bottom: 4px solid #cee271;
			float: left;
			margin: 6px 0 0 5px;
			}

			ol.commentlist li div.comment-body .meta em {
				font-weight: 900;
				color: #000;
				}
			
			ol.commentlist li div.comment-body .meta em a {
				color: #000;
				}
				
			ol.commentlist li div.comment-body .meta small a {
				color: #000;
				}	
			
		ol.commentlist li div.comment-body .content {
			clear: both;
			padding-top: 10px;
			margin: 0 0 0 12px;
			}
		
		ol.commentlist li div.comment-body .content span {
			font-family: Helvetica,	Geneva, Arial;
			font-size: 40px;
			position: relative;
			top: 20px;
			margin: 0 10px;
			}


/* !Comment form control */

#respond {
}



#commentform {
	font-family: Arial;
	margin: 50px 0 30px;
}


#commentform p.comment-name, #commentform p.comment-email, #commentform p.comment-url, #commentform p.comment-submit {
	float: right;
	clear: right;
	width: 230px;
	margin: 0 0 5px 0;
	padding: 0;
	}
	
	#commentform p label {
		color: #999;
		font-size: 11px;
		font-weight: 900;
		}

	#commentform p input {
		border: 3px solid #cbcbcb;
		/*height: 22px; */
		font-size:16px;
		padding: 7px;
		width: 210px;
		/* I think both safari and mozilla support just border-radius */
		-moz-border-radius: 4px;
	    -webkit-border-radius: 4px;
		border-radius: 4px;
		}
		
	#commentform input#submit {
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		}

#commentform p.comment-textarea {
	margin: 0 200px 0 0;
	padding: 0 0 0 5px;
	float: none;
	width: 250px;
	}
	
	#commentform p.comment-textarea label {
		font-size: 20px;
		font-weight: 900;
		color: #000;
		margin-bottom: 20px;
		display: block;
	}
	
	#commentform p span {
		display: block;
		background: #cee271 url( gfx/comment_form_arrow.png ) no-repeat top right;
		padding: 5px 22px 5px 0;
		}
		
		#commentform p span span {
			display: block;
			background: #fff; 
			margin: -10px 0 0 -5px;
			padding: 10px;
		}
	
	#commentform p textarea {
		padding: 0;
		margin: 0;
		width: 100%;
		height: 170px;
		border: none;
		}


#commentform p.comment-name {
	margin-top: 15px;
}

#commentform p.comment-submit input {
	background: #000;
	border: medium none;
	color: #cee271;
	font-size: 18px;
	padding: 0;
	margin: 5px 0 0;
	width: auto;
	}
	
/* !ShareThis */

#sharethis_0 {
	display:block;
	margin: 5px 0 20px 30px;
}

	
/* TOOLS */
.clear {
	clear:both;
}