/*

Hemsida: Fšreningen SkogstrŠdsfšrŠdling
Fšrfattare: Colin Lewis 
Skapad: 2009-02-23


InnehŒll:

1. Reset default html styles, basic styles
2. Phark image replacement
3. LŠnkar
4. Logo
5. Struktur
6. Navigation
7. Typografi
8. z-index
9. Puffar
10. Clearfix
 */

/* .................................................................................................................... */
/* 1. Reset default html styles, basic styles */
ul,li,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,div,dl,dt,dd
{
	margin: 0;
	padding: 0;
	border: none;
	background-color: transparent;
	color: inherit;
	font: inherit;
	text-indent: 0;
}

html, body
{
	margin: 0;
	padding: 0;
	border: none;
	text-indent: 0;
}

ul { list-style-type: none; }

input
{
	margin: 0;
	padding: 0;
}

.right
{
	float: right;
	display: inline;
	padding: 0 0 0.5em 0.5em;
}

.clear { clear: both; }
.clearnone { clear: none; }
.hide { display: none; }
#skip { display: none; }

/* .................................................................................................................... */
/* 2. Phark image replacement */
.ir
{
	text-indent: -9999em;
	overflow: hidden;
}

/* .................................................................................................................... */
/* 3. LŠnkar */
a { outline: none; }

a,a:link,a:active
{
	color: #000;
	text-decoration: none;
}

a:visited
{
	text-decoration: none;
	color: #666;
}

a:hover
{
	color: #000;
	text-decoration: underline;
}

#breadcrumbs a:visited
{
	text-decoration: none;
	color: #000;
}

#breadcrumbs a:hover
{
	color: #000;
	text-decoration: underline;
}

#puffar a
{
	font-size: 2.5em;
	line-height: 1;
}

#puffar a,#puffar a:link,#puffar a:active,#puffar a:visited
{
	color: #66170C;
	text-decoration: none;
}

#puffar a:hover
{
	color: #66170C;
	text-decoration: underline;
}

/* .................................................................................................................... */
/* 4. Logo */


#logo a
{
	display: block;
	background-color: transparent;
	height: 88px;
	width: 955px;
	text-indent: -9999em;
	background-image: url('bg/header.jpg');
	background-repeat: no-repeat;
	background-position: left center;
}

#logo img{
    display: none
}


/* .................................................................................................................... */
/* Struktur */
body
{
	font-size: 76%;
	line-height: 1.6;
	font-family: "Trebuchet MS", Trebuchet, sans-serif;
	color: #000;
	background-color: #fff;
	text-align: center;
	margin-bottom: 5em;
}

#container
{
	text-align: center;
	width: 955px;
	margin: 0 auto;
	position: relative;
}

#header { position: relative; }

/* Position the content-wrapper absolutely to fix menu hover problem in IE7 */
#wrapper
{
	text-align: left;
	position: absolute;
	top: 126px;
	left: 0;
	width: 955px;
}

#content-wrapper
/* Skapar ett svart ram med fake column */
{
	border: 1px solid #000;
	margin-bottom: 5em;
	background-image: url('bg/divider.png');
	background-repeat: repeat-y;
	background-position: left top;
}

#content
{
	float: left;
	display: inline;
	width: 660px;
	padding: 20px;
	margin-top: -2px;
	text-align: left;
	position: relative;
}

#content #print
{
	background-image: url('bg/print.png');
	background-repeat: no-repeat;
	background-position: left center;
	position: absolute;
	width: auto;
	top: 5px;
	right: 20px;
}

#content #print a { margin-left: 20px; }

#content #bild
{
	width: 578px;
	overflow: hidden;
}

#breadcrumbs
{
	text-align: left;
	margin: 0 0 0.2em 1px;
	width: 100%;
}

#sidebar
{
	position: relative;
	display: inline;
	float: right;
	width: 252px;
	text-align: left;
	padding: 0 0 40px 0;
	margin-top: -1px;
}

#sidebar #contact { background: #DDE7DD; }

#sidebar #search, 
#sidebar #contact, 
#sidebar #links
{
	width: 228px;
	margin: 0 auto;
}

#sidebar #links ul { margin-left: 2px; }

#sidebar #links ul li
{
	padding-left: 17px;
	background-image: url('bg/linkBullet.png');
	background-repeat: no-repeat;
	background-position: left center;
}

#sidebar #links { margin-top: 1em; }

#sidebar #search
{
	width: 100%;
	border-bottom: 1px solid #000;
}

#sidebar #search form
{
	height: 1em;
	margin: 20px 13px 20px 13px;
}

#sidebar > #search form { margin: 20px 13px 30px 13px; }

.field
{
	float: left;
	display: inline;
}

.button
{
	float: right;
	display: inline;
}

#sidebar #search form #s
{
	width: 170px;
	border: 1px solid #ccc;
	padding: 2px;
}

#sidebar #search form #submit
{
	display: inline;
	float: right;
}

#sidebar #contact
{
	margin-top: 13px;
	line-height: 1.3;
}

#sidebar #contact h3, 
#sidebar #contact ul,
#sidebar #contact p
{
	width: 208px;
	margin: 0 auto;
}

#sidebar #contact h3 { padding: 10px 0 0 0; }
#sidebar #contact ul,
#sidebar #contact p { padding: 0 0 10px 0; }

#footer
{
	clear: both;
	width: 100%;
	text-align: left;
}

/* .................................................................................................................... */
/* Navigation */
#nav
{
	width: 953px;
	font-size: 1em;
	border: 1px solid #ddd;
	margin: 0 0 0.75em 0;
	background: #fff;
	text-align: left;
}

#nav li
{
	width: auto;
	text-align: left;
}

#nav li li
{
	width: 14em;
	text-align: left;
}

/* Dropdown menu positioning and structure*/
.sf-menu, .sf-menu *
{
	margin: 0;
	padding: 0;
	list-style: none;
}

.sf-menu { line-height: 1.0; }

.sf-menu ul
{
	position: absolute;
	top: -999em;
	width: 14em;
	/* Left offset of submenus need to match this width (see below) */
}

.sf-menu ul li { width: 100%; }

.sf-menu li:hover
{
	visibility: inherit;
	/* Fixes IE7 'sticky bug' */
}

.sf-menu li
{
	float: left;
	position: relative;
}

.sf-menu a
{
	display: block;
	position: relative;
}

.sf-menu li:hover ul,
.sf-menu li.sfHover ul
{
	left: 0;
	top: 2.5em;
	/* Match top ul list item height */
	z-index: 99;
}

ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul { top: -999em; }

ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul
{
	left: 14em;
	/* Match ul width */
	top: 0;
}

ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul { top: -999em; }

ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul
{
	left: 14em;
	/* Match ul width */
	top: 0;
}

/* Dropdown menu appearence */
.sf-menu
{
	float: left;
	display: inline;
	margin-bottom: 1em;
}

.sf-menu a
{
	padding: .75em 1em;
	text-decoration: none;
	text-align: left !important;
}

.sf-menu a, .sf-menu a:visited
{
	/* Visited pseudo selector so IE6 applies text colour. #fff to keep links white on mouseout when menu is still visible*/
	color: #fff;
}

/* Make the top links green */
ul#nav li a
{
	color: #007400;
	text-align: center;
}

/* Green links white on hover */
ul#nav li a:hover
{
	color: #fff !important;
	background: #77AB56 !important;
}

.sf-menu a:hover { color: #fff !important; }

.sf-menu li
{
	background: #fff;
	text-align: left;
}

.sf-menu li { border-right: 1px solid #ddd; }

.sf-menu li li
{
	background: #549D32;
	/* Red, no hover */
	color: #fff !important;
	border: 0;
	text-align: left;
}

.sf-menu li li li
{
	background: #549D32;
	/* Red, no hover */
	color: #fff !important;
	border: 0;
	text-align: left;
}

.sf-menu li.sfHover,
.sf-menu a:focus, 
.sf-menu a:active
{
	background: #549D32;
	outline: 0;
	color: #fff !important;
}

.sf-menu li:hover a { color: #fff !important; }

.sf-menu a:hover
{
	background: #77AB56;
	outline: 0;
	color: #fff !important;
}

.sf-menu li:hover
{
	background: #7A2101 !important;
	outline: 0;
}

/* Arrows */
.sf-sub-indicator
{
	position: absolute;
	display: block;
	right: .75em;
	top: 1.05em;
	/* IE6 only */
	width: 10px;
	height: 10px;
	text-indent: -999em;
	overflow: hidden;
	background: url('bg/arrows-ffffff.png') no-repeat 0 -999em;
	/* 8-bit indexed alpha png. IE6 gets solid image only */
}

a > .sf-sub-indicator
{
	/* Give all except IE6 the correct values */
	top: .8em;
	background-position: 0 -999em;
	/* Use translucent arrow for modern browsers*/
}

/* Apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator
{
	background-position: 0 -999em;
	/* Arrow hovers for modern browsers*/
}

/* Point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position: -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position: 0 0; }

/* Apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator
{
	background-position: -10px 0;
	/* Arrow hovers for modern browsers*/
}

/* Shadows for all but IE6  */
.sf-shadow ul { /*
	background: url('bg/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
*/ }
.sf-shadow ul.sf-shadow-off { background: transparent; }

/* .................................................................................................................... */
/* 7. Typografi */
#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6,
#content p,
#content ul,
#content ol,
#content table,
#content form,
#content fieldset,
#content div,
#content hr,
#content bq { width: 587px; }

#content h1
{
	font-size: 1.9em;
	line-height: 1.2;
	color: #7B1E05;
}

#content h1#hem-heading
{
	margin-top: 0;
	color: #398B35;
	font-size: 3em;
}

#content h2,
#content h3
{
	font-size: 1.6em;
	margin: 1em 0 -.25em 0;
}

#content p
{
	margin: 0.5em 0;
	font-size: 1.1em;
}

#content ol
{
	margin-left: 0;
	padding-left: 0;
}

#content ol li
{
	margin-left: 17px;
	padding: 0.5em 0 0.5em 0;
	list-style-type: decimal;
	list-style-position: outside;
}

#content ul li
{
	margin: 0.5em 0 0.5em 17px;
	list-style-type: disc;
	list-style-position: outside;
}

#sidebar h3 { font-size: 1.6em; }
.defaultText { width: auto; }
.defaultTextActive { color: #333; }

.search-results h3
{
	font-size: 1.6em;
	margin: 1em 0 0.5em 0;
}

.search-results h4
{
	font-size: 1em;
	margin-bottom: 1em;
}

.search-results
{
	border-bottom: 1px solid #ccc;
	padding-bottom: 1em;
}

#ingress { font-weight: bold; }
.pad { padding-top: 1em; }

/* .................................................................................................................... */
/* 8. z-index */
#wrapper { z-index: 10; }
#content-wrapper { z-index: 15; }
#sidebar { z-index: 20; }
#content { z-index: 30; }
#header { z-index: 40; }

/* .................................................................................................................... */
/* 9. Puffar */
#puffar
{
	width: 578px;
	height: auto;
	clear: both;
	margin-top: 2em;
	position: relative;
}

#puff1, 
#puff2
{
	width: 269px;
	height: auto;
	overflow: hidden;
}

#puff1
{
	display: inline;
	float: left;
}

#puff2
{
	position: absolute;
	top: 0;
	left: 309px;
}

#puff1 p,
#puff2 p
{
	background: #fff;
	width: 229px;
	height: auto;
	position: absolute;
	top: 0px;
	left: 0px;
	margin: 0;
	padding: 20px;
	/* Good browsers */
	opacity: .85;
	/* IE8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
	/*for IE5-7*/
	filter: alpha(opacity=85);
}

/* .................................................................................................................... */
/* 10. Clearfix */
/* slightly enhanced, universal clearfix hack */
.clearfix:after
{
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.clearfix { display: inline-block; }

/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/* close commented backslash hack */
/* .................................................................................................................... */