/*
Theme Name: Sociala Gerillan
Theme URI: http://www.socialagerillan.se
Description: Ett wordpresstema som driver kommunikationsbloggen Sociala Gerillan.
Version: 0.2
Author: Linus Bohman
*/

/*
	Stylesheet:
	-----------

	Reset
	Layout
	- Structure (margins, paddings, borders etc)
	- Post
	- Smallpost
	- Misc
	Lifestream
	Lightbox
*/


/* 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,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	/* line-height: 1; */
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;}

a img, :link img, :visited img {
	border: 0;}

table {
	border-collapse: collapse;
	border-spacing: 0;}

ol, ul {
	list-style: none;}

q:before, q:after, blockquote:before, blockquote:after {
	content: "";}



/* LAYOUT -------------------*/

a:link,
a:visited {
	color: #999;
	text-decoration: none;}

a:hover {
	text-decoration: underline;}

body {
	color: #000000;
	font-size: 10pt;
	font-family: Helvetica, Arial, sans-serif;
	background: url(bilder/tapet.jpg);
	background-position: top left;
	background-color: #FFF;}

#wrap {
	width: 1015px;
	margin: auto;}

#header {
	margin-bottom: 20px;
	background: url(bilder/header.jpg) no-repeat;
	background-position: top left;
	height: 189px;
	position: relative;
	width: 967px;}

#topshadow {
	width: 968px;
	height: 24px;
	padding: 0 24px 0 24px;
	background: url(bilder/topshadow.png) no-repeat;
	background-position: bottom left;}
	
#transshadow {
	background: url(bilder/shadow.png) repeat-y;
	background-position: top left;
	padding: 0 24px 0 24px;}
	
#kolumner {
	height: auto;
	background: #fcfcf6 url(bilder/papper2.jpg) repeat-y;
	background-position: top left;}
	
#kolumn1 {
	float: left;
	height: auto;
	width: 500px;
	margin: 10px 20px 10px 20px;}

#kolumn2 {
	float: left;
	height: auto;
	width: 400px;
	margin: 10px 20px 10px 0;}

#footer {
	background: transparent url(bilder/bottomshadow.png) no-repeat;
	background-position: top left;
	clear: both;
	width: 968px;
	padding: 30px 24px 0 24px;
	height: auto;
	margin: auto;}
	
.enkolumn {
  width: 927px !important;
  margin: auto;}
	

/* HEADER -------------------*/
#primary-home-link a {
	display: block;
	height: 150px;
	width: 400px;
	position: absolute;
	top: 20px;
	left: 0px;}
	
#primary-links {
  width: 110px; 
	height: 140px;
  position: relative;
	top: 10px;
	left: 840px;}

#primary-links li {
    position: absolute;}

#primary-links li, 
#primary-links a {
	display: block;
	height: 35px; }
	
#nav-blogg {
	top: 10px;
	width: 70px;}
#nav-artiklar{
	top: 105px;
	width: 88px;}
#nav-upphittat {
	top: 54px;
	width: 110px;}

.frontpic a {
	width: 400px;
	height: 266px;
	background: url(bilder/gerillan.jpg) no-repeat;
	background-position: top left;
	margin-bottom: 40px;
	position: relative;
	top: -10px;
	text-indent: -999em;
	display: block;}
	
	
/* POSTS -------------------*/
.indexpost {
	height: auto;}
	
.singleindexpost a {
	color: #717171 !important;
	text-decoration: none;}
	
.singleindexpost a:hover {
	text-decoration: underline;}
	
.singleindexpost .post img{
	max-width: 460px;}

.avatar {
	float: left;
	width: 110px;
	margin-bottom: 10px;}

.singleindexpost .forfattarbild {
	margin: 0 20px 15px 0;
	float: left;
	border: solid #222 4px;}
	
.singleindexpost .forfattarbild,	
.avatar .forfattarfoto a {
	height: 100px;
	width: 66px;
	background-position: top left;
	display: block;
	border: #222 solid 3px;}
	
.avatar .triangle {
	height: 20px;
	width: 30px;
	background-position: top left;
	background: url(bilder/triangle.png) no-repeat;
	float: right;
	margin-top: 30px;}

.author-Linus .forfattarbild,
.Linus .avatar .forfattarfoto a {
	background: url(http://farm4.static.flickr.com/3364/3204153460_b5eea04fbd_t.jpg) no-repeat;}

.author-Alex .forfattarbild,	
.Alex .avatar .forfattarfoto a {
	background: url(http://farm4.static.flickr.com/3101/3203303987_181e2a873a_t.jpg) no-repeat;}

.author-Bjorn .forfattarbild,	
.Bjorn .avatar .forfattarfoto a {
	background: url(http://farm4.static.flickr.com/3115/3204153302_40a82e29dd_t.jpg) no-repeat;}

.author-admin .forfattarbild,	
.admin .avatar .forfattarfoto a {
	background: url(http://www.socialagerillan.se/wp-content/themes/socialagerillan/bilder/bumi-boll.png) no-repeat;}
	
.avatar li {}
	
.post {
	float: left;
	line-height: 1.3em;}

.blogg .post {
	width: 390px;
	background: #222222;
	color: #FFF;
	background-position: bottom left;
	margin-bottom: 30px;}

.blogg .bloggtop {
	width: 390px;
	height: 10px;
	background: url(bilder/bloggtop.png) no-repeat;
	background-position: top left;
	position: relative;
	top: -10px;
	left: -20px;}
	
.blogg .bloggbottom {
	background: url(bilder/bloggbottom.png) no-repeat;
	position: relative;
	top: 10px;
	width: 390px;
	height: 10px;
	left: -20px;}

.post h2,
.post div {
	margin: 0px 20px 0px 20px;
	padding: 0px;}

.clear {
	clear: both;
	height: 0px;}
	
h2.bloggtitle,
h2.artikeltitle {
	line-height: 25px;
	letter-spacing: -1px;
	font-weight: bold;}
	
h2.bloggtitle {
	font-size: 26px !important;
	padding-top: 0px !important;}
.singleindexpost h2.bloggtitle {
	font-size: 40px !important;
	line-height: 38px !important;
	letter-spacing: -2px !important;}

h2.bloggtitle a,
h2.bloggtitle a:hover,
h2.bloggtitle a:visited {
	color: #FFF;
	text-decoration: none;}

p.postmeta {
	color: #999;
	margin: 5px 20px 5px 20px !important;}
.singleindexpost p.postmeta {
	color: #333;
	margin: 5px 20px 20px 20px !important;
	font-size: 20px;}
	
ul.postlinks {
	margin: 10px 5px 0 20px !important;
	padding: 0 !important;}
	
ul.postlinks li {
	display: inline;
	margin-right: 30px;}
	
img.postthumb {}
	
.post p {
	margin-bottom: 1em;}
	
.post em {
	font-style: italic;}
	
.post strong {
	font-weight: bold;}
	
.post blockquote {
	margin-left: 40px;
	color: #999;}
	
.post ul,
.post ol {
	margin-bottom: 1em;
	margin-left: 40px;
	padding-left: 25px;
	list-style-position: inside;}

.post ul {
	list-style-type: circle;}

.post ol {
	list-style-type: decimal;}
	
.post h1 {
	font-size: 1.5em;
	font-weight: bold;}

.post h2 {
	font-size: 1.2em;
	font-weight: bold;}

.post h3 {
	font-weight: bold;}

.post img.alignleft {
	float: left;}

.post img.alignright {
	float: right;}
	
.upphittatarkiv embed,
.upphittatarkiv object,	
.upphittatarkiv img {
	max-width: 350px;}

.artikel .post {
	font-family: Courier, serif !important;}
	
#kolumn2 .first {
	padding-top: 40px;
	background: url(bilder/artiklar.png) no-repeat;
	background-position: top left;}

#kolumn2 .artikel {
	margin-bottom: 30px;
	clear: both;
	text-align: right;}
	
#kolumn2 .artikel p{
	font-size: 10pt;}
	
#kolumn2 .artikel img {
	float: right;
	margin: 0 0 0 8px;
	border: solid 3px #222;
	position: relative;
	top: -3px;}

#kolumn2 .artikel h2 a:hover {
	text-decoration: none;}
	
#kolumn2 .artikel h2 a {
	color: #000;
	width: 400px;
	border: 0 0 3px 0 solid #222;}

#kolumn2 .artikel h2 {
	width: 400px;
	border-bottom: 2px solid #222;
	margin-bottom: 3px;
	font-size: 18pt;
	padding-bottom: 3px;
	font-weight: normal;}
	
/* FOOTER -------------------*/
#presentation {
	padding-bottom: 20px;}

.pres { 
	float: left;
	width: 310px;}
	
.pres2 {
	margin: 0 19px 0 19px;}

.pres3 {
	width: 310px;}
	
.upphittat {
	background: #222;}

.upphittatarkiv .ingress,	
.upphittatbody {
	color: #FFF;
	padding: 0 10px 30px 10px;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1.05em;}
.upphittatarkiv .ingress {
	padding: 0px !important;}
.upphittatsingle .post p {
	margin-bottom: 0px !important;}
	
.upphittatbody .comments {
	font-size: 10pt !important;
	font-weight: normal !important;}

.upphittatbody embed,
.upphittatbody object {
		height: 250px;}
	
.upphittatbody embed,
.upphittatbody object,	
.upphittatbody img {
	max-width: 290px;}

.pres .topback {
	width: 310px;
	height: 16px;
	background: url(bilder/upphittattop.png) no-repeat;
	background-position: top left;
	position: relative;}
	
.pres .bottomback {
	width: 310px;
	height: 13px;
	background: url(bilder/upphittatbottom.png) no-repeat;
	background-position: top left;
	position: relative;}
	
.pres3 .first {
	padding-top: 50px;
	background: #222 url(bilder/upphittat.gif) no-repeat;
	background-position: top left;}


/* SIDEBAR ------------------------*/
#kolumn2 h2 {
	font-size: 13pt;}
	
#kolumn2 h2.rubrik {
	font-weight: bold;
	margin-bottom: 20px;
	font-size: 24pt;}
	
#kolumn2 li.widget {
	margin-bottom: 20px;}
	
	
/* KOMMENTARER -------------------*/
#replies {
	margin-top: -11px;}
	
#kolumn2 .commenttop,
#kolumn2 .commentbottom {
	height: 19px;
	width: 400px;
	background-repeat: no-repeat;
	background-position: top left;}
#kolumn2 .commenttop {
	background: url(bilder/kommentartopp.png);}
#kolumn2 .commentbottom {
	background: url(bilder/kommentarbottom.png);}
	
#kolumn2 .commentcontent {
	background-color: #222;
	padding: 0 20px 0 20px;}

#replies p {
	padding-bottom: 1em;
	color: #f3f3f3;
	font-size: 12px;}

#replies li {
	margin-bottom: 15px;}
	
#replies .commentmetadata {
	color: #CCC;
	font-size: 10px;
	font-weight: bold;}

#replies .commentmetadata a,
#replies .commentmetadata a:hover,
#replies .commentmetadata a:visited {
	color: #999 !important;}
	
#replies .commentmetadata a:hover {
	text-decoration: underline !important;}

#replies .alt {}

#reply {
	margin-top: 15px;}

#kontaktform input,
#reply input {
	width: 200px;
	margin-bottom: 10px;}

#kontaktform input#sendbutton,
#reply input#submit {
	width: 388px;
	border: 1px solid #333;
	margin-top: 3px;}

#kontaktform input#sendbutton {
	width: 362px;
	position: relative;
	top: -19px;}

#reply textarea {
	width: 375px;}
#kontaktform textarea {
	width: 350px;}

#reply label {
	color: #333;
	font-size: 10px;}

#kontaktform input,
#kontaktform textarea,	
#reply input,
#reply textarea {
	border: 1px solid #000;
	padding: 5px;
	color: #666;}
	
#kontaktform .linklove {
	display: none;}
	
#kontaktform h2 {
	margin: 0 0 5px 0;}
	
/* ARTCLE ARCHIVE ----------------------*/
.Artikel {
  float: none !important;
  width: 800px !important;
  margin: auto !important;}
  
.Artikel .post,
.Artikel .post .bloggtop,
.Artikel .post .bloggbottom {
  width: 690px;}
  
.Artikel .post .bloggtop {
	background: url(bilder/artikeltopp.png) no-repeat;
  height: 16px;}
.Artikel .post .bloggbottom {
	background: url(bilder/artikelbottom.png) no-repeat;
  height: 16px;}


/* LIFESTREAM & KONTAKTFORM -------------------*/
#kontaktform {}

#kontaktform,
#lifestream {
	position: relative;
	top: -20px;
	margin-top: 30px;
	color: #f3f3f3;}

.lifestream {
	margin-top: 12px;}
	
.lifestream h2 {
	font-weight: bold;}
	
	
/* UTILITY ----------------------------*/
.image-replacement {
  text-indent: -9999em;}
  
/* clearfix */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;}
.clearfix {
	display: inline-block;}
html[xmlns] .clearfix {
	display: block;}
* html .clearfix {
	height: 1%;}
  

/* SOCIALA GERILLANS WIKI ----------------------------*/
#wiki {
	margin: 0 !important;
	width: 900px;}

#wiki div.row {
	margin: 0;}

#wiki p {
	margin: 0;}

#wiki p.intro {
	width: 500px;
	margin-bottom: 1em;}
	
#wiki div.area {
	margin: 20px; 
	width: 280px; 
	float: left;}

#wiki ul {
	padding: 0px; 
	margin: 0 0 10px 0;}