/***************
Editor:			Patrick Edqvist
Created: 		03.01.2010
Edit:			
Revision:		1.0
Tested in:		IE6-8, Firefox (Mac/PC), Safari(Mac)
****************/


/* RESET */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{font-size:100%;}legend{color:#000;}

html {
	font-size:125%;
	background:#f0f0f0;
	height:100%;

	}
body {
	color:#000;
    font:400 50%/1 Arial, Helvetica, Tahoma, sans-serif;
   	width: 980px;
   	margin: 0 auto;
   	height: 100%;
	}


/* 
	Typography
-------------------------------------*/

#header a {
	color: #ec1c2c;
	font-size: 12px;
	text-decoration: none;
}

#header a:hover {
	text-decoration: underline;
}

/* 
	Global
-------------------------------------*/
#site-wrap {
	width: 960px;
	margin: 0 auto;
	background-color: #fff;
	padding: 20px 30px 0 30px;
}

#content {
	margin-top: 9px;
	padding-top: 2px;
	border-top: 1px solid #000;
	width: 960px;
}

#footer {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid #000;
	padding-bottom: 20px;
}

#footer p {
	font-size: 1.25em;
	color: #000;
}

#footer a {
	color: #EC1C2C;
	text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
}

#footer span {
	margin: 0 10px 0 10px;
}

/* 
	Header
-------------------------------------*/

#logotype {
	display: block;
	float: left;
	margin-left: 10px; /* Check for IE6 double margin bug */
}

#other-site-nav {
	float: right;
}
#other-site-nav ul li {
	display: inline;
}
#other-site-nav ul li#far-akademi {
	border-right: 1px solid #000;
	padding-right: 10px;
	margin-right: 10px;
}

#search-bar {
	float: right;
	margin-right: -145px;
	margin-top: 22px;
}
#site-nav {
	float: left;
	margin-top: 44px;
	width: 960px;
}
#site-nav ul {
	width: 800px;
	display: block;
	float: left;
	display: inline;
}
#site-nav ul li {
	margin-right: 3px;
	float: left;
	width: 20px;
	width: auto;
	_width: 0;
	_white-space: nowrap;
}
#site-nav ul li a {
	font-size: 18px;
	margin: 0 auto;
	float: left;
	height: 1%;
	width: auto;

}
#site-nav ul li a span {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 3px; 
	height: 35px;
	display: block;
	color: #000;
	width: auto;
} 
#site-nav ul li a.active span {
	background: url('http://www.far.se/fs/gui/lib/img/nav-arrow.gif') no-repeat top left;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 3px; 
	height: 35px;
	display: block;
	color: #fff;
}
#site-nav ul li a.active {
	background: url('http://www.far.se/fs/gui/lib/img/nav-active.gif') repeat-x top center;
}
#site-nav ul li a:hover {
	background: url('http://www.far.se/fs/gui/lib/img/nav-rollover.gif') repeat-x top center;
	text-decoration: none;
}
#site-nav ul li a:hover span{
	background: url('http://www.far.se/fs/gui/lib/img/nav-roll-arrow.gif') no-repeat top left;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 3px; 
	height: 35px;
	display: block;
	color: #000;
}
#site-nav a#language-select {
	float: right;
	font-size: 18px;
	color: #000;
	margin-top: 3px;
	margin-right: 10px; /* Check for IE6 bug */
	display: inline;
}

#search-bar form#searchform {
	width: 301px;
	height: 30px;
}
#search-bar input#s {
	border: 1px solid #000;
	background-color: #fff;
	height: 28px;
	width: 260px;
	float: left;
	color: #000;
	padding-left: 6px;
	font-size: 1.2em;
	line-height: 28px;
}
#search-bar input#searchsubmit {
	background-color:#919191;
	border:0 none;
	color:#FFFFFF;
	display:block;
	/* float:right; --this doesn't seem right and messes up IE7 in some versions */
	float: left;
	font-size:1.8em;
	margin-top:0;
	padding-bottom:5px;
	width:30px;
	height: 30px;
} 


/* 
	Content
-------------------------------------*/

#page-info-area {
	height: 20px;
	line-height: 20px;
	margin-bottom: 2px;
}

#page-info-area breadcrumb {
	float: left;
}

#page-info-area #sitemap {
	float: right;
}

#page-info-area #sitemap a {
	color: #a4248f;
	margin-left: 2px;
	text-decoration: none;
	font: 1.2em/20px Arial;
	padding-left: 2px;
}

#page-info-area #sitemap a:hover {
	text-decoration: underline;
}

.main-content {
	float: left;
}

	/* Banner's */
	
	#banner-area {
		width: 960px;
		float: left;
		margin-top: 21px;
	}

	#banner-area .banner-column {
		background-color: #ebeded;
	}
	
	#banner-area h2 { color: #000; }
	#banner-area p { color: #000; }
	
	#banner-area .banner-wide-text { padding: 20px; width: 670px; height: 165px; }
	#banner-area .banner-wide-text h2 { font: 4.6em/57px "Arial Black"; }
	#banner-area .banner-wide-text p { font: 2.1em/25px "Arial Black";}
	#banner-area .banner-small-text { padding: 20px; width: 190px; height: 165px; }
	#banner-area .banner-small-text p { font: 2.1em/25px "Arial Black";}
	#banner-area .banner-medium-flash {height:255px; width:470px;}

/* 
	Sidebar
-------------------------------------*/

.sidebar {
	width: 230px;
}

.sidebar h3 {
	text-transform: uppercase;
	font-size: 12px;
	font-family: "Arial Black";
	margin-bottom: 9px;
	color: #fff;
}

.sidebar h3#login-name {
	color:#FFFFFF;
	font-family:"Arial Black";
	font-size:12px;
	margin-bottom:2px;
	text-transform:uppercase;
}

.sidebar h3#login-company {
	margin-bottom: 17px;
}

.sidebar a {
	font-family: Arial;
	font-size: 12px;
	color: #fff;
	text-decoration: none;
	display: block;
}

.sidebar a:hover {
	text-decoration: underline;
}

.sidebar a.active {
	font-weight: 700;
}

.widget {
	width: 190px;
	padding: 20px 20px 10px 20px;
	background: url(http://www.far.se/fs/gui/lib/img/sidebar-flik.gif) no-repeat bottom right #a3248f;
	margin-bottom: 20px;
}

.widget input {
	width: 185px;
	height: 20px;
	font-family: Arial;
	line-height: 20px;
	font-size: 1.2em;
	margin-bottom: 10px;
	letter-spacing: 0.02em;
	padding-left: 5px;
	background-color: #fff;
	border: 0 none;
}

.widget button {
	font: 1.2em/2em "Arial Black";
	text-transform: uppercase;
	padding: 0;
	width: 105px;
	text-align: center;
	background-color: #641d79;
	border: 0 none;
	color: #fff;
	margin-bottom: 10px;
}

.widget button:active { /* Userfriendly action so the button acts like a real button */
	position: relative;
	top: 1px;
}

.widget .selection-options {
	width: 191px;
	margin-bottom: 10px;
	height: 20px;
	font-size: 12px;
	color: #000;
}


/* 
	Pages
-------------------------------------*/

	/* Landing site */

#land-site-content {
	width: 710px;
}

#puff-wrap {
	width: 710px;
	padding: 20px 0 0 0;
	margin-top: 20px;
	border-bottom: 1px solid #000;
	border-top: 1px solid #000;
	float: left;
}

#puff-wrap h2 a {
	font: 1.8em/30px "Arial Black";
	color: #000;
	text-decoration: none;
}

#puff-wrap p {
	font: 1.4em/16px Arial;
	margin-bottom: 15px;
}

#puff-wrap p a.read-more {
	color: #a3248f;
	text-decoration: none;
}

#puff-wrap h2 a:hover, #puff-wrap p a.read-more:hover {
	text-decoration: underline;
}

#puff-wrap .puff-column {
	width: 220px;
	margin-right: 25px;
}

#puff-wrap #last-puff{
	width: 220px;
	margin-right: 0;
}

.puff-column img, #last-puff img {
	float: left;
	margin: 0 10px 0 0;
}

	/* Underpage */
	
	#breadcrumb {
		width: 500px;
		float: left;
	}
	
	#breadcrumb p, #breadcrumb a, #breadcrumb span {
		float: left;
		margin-right: 4px;
		color: #787878;
		font: 1.0em/20px Arial;
		text-decoration: none;
	}
	
	#breadcrumb a:hover {
		text-decoration: underline;
	}
	
	ul#menu, ul#menu ul {
 		 list-style-type:none;
		  margin: 0;
		  padding: 0;
		  width: 230px;
	}

	ul#menu a {
		  display: block;
		  text-decoration: none;	
		  font-size: 12px;
		  font-family: Arial;
	}

	ul#menu li {
		  margin-bottom: 3px;
	}

	ul#menu li a {
		  background: #641d79;
		  color: #fff;	
		  padding: 0.7em;
	}
	
	ul#menu li a.closed {
		background: url(http://www.far.se/fs/gui/lib/img/plus.png) no-repeat;
		background-position: 215px 12px;
		background-color: #641d79;
	}
	
	ul#menu li a.opened {
		background: url(http://www.far.se/fs/gui/lib/img/minus.png) no-repeat;
		background-position: 215px 12px;
		background-color: #641d79;
	}

	ul#menu li ul a.parent {background-color: #A3248F;}
	ul#menu li ul a {
		padding-left: 20px;
		color: #fff;
		background-color: #A3248F;
		margin-top: 3px;
	}

	ul#menu li a:hover {
	}

	ul#menu li ul li a {
		  background: #a3248f;
		  color: #fff;
		  padding-left: 20px;
	}
	
	ul#menu li ul li ul a {
		background: #e5b3e6;
		color: #fff;
		padding-left: 30px;
	}
	
	ul#menu li ul ul.level-three li a {
		display: block !important;
		padding-left: 30px;
		background-color: #e5b3e6; 
	}
	
	#underpage-content {
		float: left;
		width: 460px;
		padding-left: 20px;
	}
	
	#underpage-content h2 {
		font: 2.4em/24px "Arial Black";
		margin-bottom: 15px;
		margin-top: -4px;
	}
	
	#underpage-content p.ingress {
		font: 1.5em/17px Arial;
		color: #000;
		float: left;
		font-weight: 700;
	}

	#underpage-content p.ingress span.date {
		color: #777;
	}
	
	#underpage-content p {
		font: 1.2em/19px Arial;
		color: #000;
		margin-bottom: 1em;
		font-weight: 400;
		float: left;
	}
	
	#underpage-content a {
		color: #A4248F;
		text-decoration: none;
	}
	
	#underpage-content a:hover {
		text-decoration: underline;
	}
	
	/* Medlems formulär */
	
	#underpage-content h3 {
		font: 1.5em/17px Arial;
		font-weight: 700;
		margin: 0.5em 0;
		width: 460px;
		float: left;
	}
	
	#underpage-content label {
		display: block;
		width: 220px;
		font: 400 1.2em/12px Arial;
		margin-bottom: 2px;
	}
	
	#underpage-content input {
		display: block;
		border: 1px solid #000;
		background-color: #fff;
		width: 218px;
		height: 20px;
		margin-bottom: 15px;
		line-height: 20px;
	}
	
	#underpage-content select#hemsida {
		height: 20px;
		font-size: 12px;
		margin-top: 2px;
		width: 218px;
	}
	
	#underpage-content input.locked {
		background-color: #e3e3e3;
	}
	
	#underpage-content .input-wrap {
		float: left;
	}
	
	#underpage-content .left-side {
		margin-right: 20px;
	}
	
	#underpage-content .small {
		width: 105px;
	}
	
	#underpage-content div .left-s-side {
		margin-right: 5px;
	}
	
	#underpage-content #formular-button {
		background-color:#641D79;
		border:0 none;
		color:#FFFFFF;
		font:1.2em/2em "Arial Black";
		margin-bottom:10px;
		padding:0;
		text-align:center;
		text-transform:uppercase;
		width:105px;
	}
	
	#underpage-content #formular-button:active {
		position: relative;
		top: 1px;
	}
	
	/* Medlems sida */
	
	#medlem-sida {
		width: 460px;
		padding-left: 20px;
	}
	
	#medlem-sida h2 {font:2.4em/24px "Arial Black"; margin-bottom:15px; margin-top:-4px;}
	#medlem-sida h3 {margin: 10px 0 0 0; color: #641d79;}
	#medlem-sida h3 a { font: 700 1.5em/17px Arial; text-decoration: none; color: #641d79; }
	#medlem-sida h3 a:hover { text-decoration: underline;}
	#medlem-sida p.ingress {color:#000000; font:700 1.5em/17px Arial;}
	#medlem-sida p { font: 400 1.2em/19px Arial; color: #000;}
	#medlem-sida caption { font: 400 1.6em/20px Arial; color: #000; margin-top: 2px;}
	#medlem-sida table { width: 460px;}
	#medlem-sida thead tr th { border-right: 1px solid #fff; background-color: #000; color: #fff; height: 18px; font: 400 12px/18px Arial; text-align: center;}
	#medlem-sida col {}
	#medlem-sida tbody tr td { width: 59px; padding-top: 3px; padding-bottom: 14px; background-color: #eceded; color: #000; text-align: right; border: 1px solid #fff; padding-right:5px; }
	#medlem-sida tbody tr td.aktivitet {background-color: #f7d1d5; }
	#medlem-sida tbody tr td#today { background-color: #eb3c2d; }
	
	/* Search Results */
	#search-content h2 { font: 400 2.4em/24px "Arial Black"; margin-bottom:15px; margin-top:-4px;}
	#search-content { padding-left: 20px; width: 460px; }
	#search-content a {color: #000; text-decoration: none;}
	#search-content .sr-wrap { width: 456px; background-color: #e2e2e2; padding: 6px 0 4px 6px;}
	#search-content .odd { background-color: #c6c6c6;}
	#search-content .sr-name { font: 700 1.2em/19px Arial; display: block;}
	#search-content .sr-info { font: 400 1.2em/19px Arial; display: block;}
	
	 

/* 
	Utilities
-------------------------------------*/


	/* Slider */

.news-slider {}
.wrapper ul li .textSlide img.thumbnail {margin-right: 18px; margin-top: 5px;}	
.wrapper ul li .textSlide h2 {width: 565px;}
.wrapper ul li .textSlide h2	 a { font: 2.4em/24px "Arial Black"; margin-bottom: 10px; margin-top: 0px;  color: #000; text-decoration: none; }
.wrapper ul li .textSlide h2	 a:hover { text-decoration: underline;}
.wrapper ul li .textSlide p.ingress	{ font: 400 1.6em/20px Arial; color: #000; margin-top: 10px;}
.wrapper ul li .textSlide p.ingress span.date {color: #777;}
.wrapper ul li .textSlide p.ingress a.read-more {color: #A3248F; text-decoration: none; }

.border-top { border-top: 1px solid #000; padding-top: 20px;}
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.sidebar .last { margin-bottom: 0; }
.clearFieldBlurred { color: #000; font-style: normal; }
.clearFieldActive { color: #000; }
.thumbnail { float: left; }
.group:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}