﻿/*------------------------------------------------------------------
[Master Stylesheet]

Project:	Meridium
Copyright:  2009 Meridium AB
-------------------------------------------------------------------*/
@import "reset.css";
@import "typography.css";
/*------------------------------------------------------------------
[Table of contents]

1. Body
2. Skip / #skip    
3. Masthead / #masthead
    3.1 Branding / .branding
	3.2 Navigation / #navigation
4. Wrap / #wrap
    4.1 Content / #content
		4.1.1 Main / .main
		4.1.2 Additonal / .additional
	4.2 Supplementary / #supplementary
5. Footer / #footer

[Order of properties]
body {
    {position,padding,margin etc}
    {background, border}    
    {typography, color}
}
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
1 Body
-------------------------------------------------------------------*/
body {
	margin: 0 auto;
	max-width: 82.182em;
	min-width: 760px;
	background-color: #ffffff;
}
.structural {
	left:-9999px;
	position:absolute;
}
.image-left { float:left; }
.image-right { float:right; }
.systeminfo {
	color: Green;
}
.systemwarning {
	color: Red;
}
form {
	overflow: hidden;
	padding: 0.727em 0 0 0;
	margin: 0 0 1.091em 0;
}
input, textarea, select {
	border-style: solid;
	border-width: 1px 1px 0px 1px;
	border-color: #dfdfdf;
	margin: 0 5px 0 0;
	padding: 1px 0 1px 0;
	background: url("/Templates/Images/9F9F9F.gif") repeat-x left top;
	background-color: white;
}
input.button {
	padding: 2px 12px 3px 1px;
	border-width: 0px 1px 0px 1px;
	border-color: #dfdfdf;
	background: url("/Templates/Images/report-button-background.gif") repeat-x right bottom;
	background-color: white;
	color: #d5542f;
	font-size: 1em;
}

/*------------------------------------------------------------------
2 Skip
-------------------------------------------------------------------*/
#skip ul { 
	position:absolute;
	top:0;
	right:0;
	width:100%; 
}
#skip li a {
	position:absolute;
    top:-100px;
    right:0px;
    display:inline;
}
#skip li a:focus,
#skip li a:active {
    display:block;
    position:absolute;
    top:5px !important;
    right:20px;
    background-color:#ffffff;
    padding:0;
    font-weight:bold;
    padding:.5em;
    border:solid 3px #000000;
    color:#000000;
}
/*------------------------------------------------------------------
3 Masthead
-------------------------------------------------------------------*/
#masthead {
	overflow: hidden;
	margin: 25px 0 0 0;
	padding: 0 2px 0 12px;
}
	/*------------------------------------------------------------------
	3.1 Branding
	-------------------------------------------------------------------*/
	#masthead .branding {
		float: left;
		margin: 0 0 0 2px;
	}
	/*------------------------------------------------------------------
	3.2 Navigation
	-------------------------------------------------------------------*/
	#navigation {
		float: right;
		width: 73.9%;
		margin: 18px 2.1% 0 0;
		font-size: 1.091em;
		border-style: solid;
		border-width: 0px 1px 1px 1px;
		border-color: #dfdfdf;
		background: #97be0d url("/Templates/Images/9F9F9F.gif") repeat-x left bottom;
	}
	#navigation ul {
		float: right;
		padding: 0 11px 0 0;
	}
	#navigation li {
		padding: 4px 0 4px 20px;
		float: left;
	}
	#navigation a {
		color: #d5e59e;
	}
	#navigation a.selected {
		color: #ffffff;
	}
/*------------------------------------------------------------------
4. Wrap
-------------------------------------------------------------------*/
	#wrap {
		overflow: hidden;
		margin: 8px 0 0 0;
		padding: 0;
	}
	/*------------------------------------------------------------------
	4.? Splash 
	-------------------------------------------------------------------*/
	#splash {
		overflow: hidden;
		float: right;
		padding: 0;
		margin: 0 2.3% 10px 0;
		width: 72.8%;
		border-style: solid;
		border-width: 0px 1px 0px 1px;
		border-color: #dfdfdf;
		background: url("/Templates/Images/box-border.gif") repeat-x left bottom;		
	}
	
	/*------------------------------------------------------------------
	4.1 Content
	-------------------------------------------------------------------*/
	#content {
		float: left;
		width: 73.05%;
		margin-bottom: 10px;
	}
	#content div.paginator {
		text-align: center;
	}
	#content div.paginator span,
	#content div.paginator a,
	#content div.paginator img {
		padding: 0 2px 0 2px;
	}
	#content div.paginator a img {
		padding: 0;
	}
	#content ul.articles li {
		padding: 5px 0;
	}
	#content ul.articles a {
		padding: 0 0 0 11px;
		background: url("/Templates/Images/arrow.gif") no-repeat 1px 3px;
	}
	#content ul.articles .file a {
		padding: 5px 0 5px 14px;
		background: url("/Templates/Images/download.gif") no-repeat 1px 5px;
	}
	#content div.inputGroup {
		float: left;
	}
	#content div.inputGroup label {
		margin: 0 5px 0 0;
	}
	body.default #content {
		float: none;
		width: 100%;
		overflow: hidden;
		margin: 0 0 7px 0;
	}
	body.newslist #content h1 span,
	body.genericlist #content h1 span {
		float: left;
		display: block;
		padding: 3px 10px 4px 8px;
		margin: 0;
		border-style: solid;
		border-width: 0px 1px 1px 0px;
		border-color: #dfdfdf;
		background: url("/Templates/Images/Additional/h2-border.gif") repeat-x left bottom;
	}
	body.newslist #content h2 a { color: #123972; }
	body.newslist #content h2 {
		color: #123972;
		font-size: 1em;
		font-weight: bold;
		margin: 0 10px 0 103px;
		padding: 0;
	}
	body.newslist #content div.external h2 {
		color: #333333;
		margin: 2px 10px 0 0;
	}
	body.newslist #content div.list {
		width: 49%;
		float: left;
		padding: 0 0 5px 0;
		border-style: solid;
		border-width: 0px 1px 1px 1px;
		border-color: #dfdfdf;
		background: url("/Templates/Images/9F9F9F.gif") repeat-x left bottom;
	}
	body.newslist #content div.external {
		margin: 0 0 0 8px;
	}
	body.newslist #content span.date {
		display: block;
		color:#6ca4d5;
		font-size: 0.909em;
		line-height: 1;
	}
	body.newslist #content ul {
		overflow: hidden;
		padding: 3px 10px 5px 10px;
	}
	body.newslist #content div.external ul {
		padding: 3px 10px 5px 12px;
	}
	body.newslist #content ul li {
		position: relative;
		padding: 0 0 11px 0;
		margin: 14px 0 0 0;
		border-bottom: solid 1px #dfdfdf;
		overflow: hidden;
	}
	body.newslist #content div.external ul li {
		padding: 0 0 6px 0;
		margin: 7px 0 0 0;
	}
	body.newslist #content ul img {
		position: absolute;
		top:0;
		left: 0;
		display: block;
		margin: 2px 9px 0 0;
		border-right: solid 1px #dfdfdf;
	}
	body.newslist #content ul li span.link {
		line-height: 1;
		margin: 0 0 0 103px;
		padding: 0 0 0 7px;
		font-size: 0.909em;
		background: url("/Templates/Images/Additional/red-arrow.gif") no-repeat left 3px;
	}
	body.newslist #content div.external ul li span.link {
		margin: 0;
	}
	/*body.newslist #content div.external ul li a[href^="http:"] {
		background: url("/Templates/Images/readmore.png") no-repeat right 1px;
		padding: 0 13px 0 0;
	}*/
	body.newslist #content p {
		padding: 0;
		margin: 0 0 0 103px;
		color:#6ca4d5;
	}
	body.newslist #content div.external p {
		color: #8e7f6f;
		margin: 0;
	}
	body.genericlist #content .inner {
		overflow: hidden;
		/*margin: 0 5px 0 0;*/
		padding: 0 0 5px 0;
		border-style: solid;
		border-width: 0px 1px 1px 1px;
		border-color: #dfdfdf;
		background: url("/Templates/Images/9F9F9F.gif") repeat-x left bottom;
	}
	body.genericlist #content h2 a { color: #123972; }
	body.genericlist #content h2 {
		color: #123972;
		font-size: 1em;
		font-weight: bold;
		margin: 2px 10px 0 0;
		padding: 0;
	}
	body.genericlist #content ul {
		padding: 0 0 5px 2px;
		overflow: hidden;
	}
	body.genericlist #content ul li {
		position: relative;
		float: left;
		width: 47.7%;
		padding: 10px 0 11px 0;
		margin: 8px 0 0 8px;
		border-style: solid;
		border-width: 0px 1px 1px 1px;
		border-color: #dfdfdf;
		background: url("/Templates/Images/9F9F9F.gif") repeat-x left bottom;
	}
	body.genericlist #content ul li p {
		color:#6ca4d5;	
		margin: 0 10px 0 0;
	}
	body.genericlist #content ul li img {
		float: left;
		display: block;
		margin: 0 10px 0 10px;
		padding: 0 11px 0 0;
		border-right: solid 1px #dfdfdf;
	}
	body.genericlist #content ul li span.link {
		position: absolute;
		bottom: 13px;
		left: 140px;
		padding: 0 0 0 7px;
		font-size: 0.909em;
		background: url("/Templates/Images/Additional/red-arrow.gif") no-repeat left 2px;
	}
	/*body.genericlist #content ul li a[href^="http:"] {
		background: url("/Templates/Images/readmore.png") no-repeat right 1px;
		padding: 0 13px 0 0;
	}*/
		/*------------------------------------------------------------------
		4.1.1 Main
		-------------------------------------------------------------------*/
		.main {
			float: right;
			width: 66.3%;
			overflow: hidden;
		}
		body.default .main {
			float: left;
			width: 61.65%;
		}
		body.default .main img {
			overflow: hidden;
			padding: 0 0 2px 0;
			border-style: solid;
			border-width: 0px 1px 0 1px;
			border-color: #dfdfdf;
			background: url("/Templates/Images/box-border.gif") repeat-x left bottom;
		}
		.main .inner {
			margin: 0 1.091em 0 1.091em;
		}
		body.newsarticle .main .inner {
			margin: 0 1em 0 1em;
		}
		.main ul {
			padding: 0.182em 0 0 0;
			margin: 0 0 0.727em 1.727em;
			list-style-type:disc;
		}
		.main ul.articles,
		body.newsarticle .main ul.articles {
			list-style-type: none;
			margin-left: 0;
		}
		body.newsarticle .main ul {
			padding: 0.167em 0 0 0;
			margin: 0 0 0.583em 1.667em;
		}
		.main ol {
			padding: 0.182em 0 0 0;
			margin: 0 0 0.727em 1.727em;
			list-style-type:decimal;
		}
		body.newsarticle .main ol {
			padding: 0.167em 0 0 0;
			margin: 0 0 0.583em 1.667em;
		}
		.main blockquote {
			padding: 0 1.727em;
		}
		body.newsarticle .main blockquote {
			padding: 0 1.667em;
		}
		.main .browse {
			overflow: hidden;
			padding: 10px 0 0 0;
			border-style: solid;
			border-width: 1px 0 0 0;
			border-color: #003772;
		}
		.main .browse a {
			font-weight: bold;
			margin: 1px 0 0 0;
			padding: 4px 5px 6px 9px;
			border-style: solid;
			border-width: 0px 1px 0px 1px;
			border-color: #dfdfdf;
			background: url("/Templates/Images/button-background.gif") repeat-x left bottom;
		}
		.main .browse a.prev {
			float: left;
		}
		.main .browse a.prev span {
			padding: 0 0 0 11px;
			background: url("/Templates/Images/big-prev.gif") no-repeat left 2px;
		}
		.main .browse a.next {
			float: right;
		}
		.main .browse a.next span {
			padding: 0 11px 0 0;
			background: url("/Templates/Images/big-next.gif") no-repeat right 2px;
		}
		/*		Contribution	*/
		body.contribution .main h1{
			font-weight:normal;
		}
		body.contribution .main h1 span{
			display:block;
		}
		body.contribution .main p.contributor span{
			color:#f762b6;
		}
		body.contribution .main p.message{
			font-weight:bold;
		}
		body.contribution .main .tools a{
			background: url("/Templates/Images/bg_btn.png") repeat-x left bottom;
			color:#f860b7;
		}
		body.contribution .main .tools a:hover
		{
			background-image: url("/Templates/Images/bg_btn_hover.png");
			border-color:#c3c3c3;
			background-color:#fa82cf;
			color:#fff;
		}
		body.contribution .main .tools a:active
		{
			background-image: url("/Templates/Images/bg_btn_active.png");
			border-color:#c3c3c3;
			background-color:#f63e9d;
			color:#fff;
		}
		body.contribution .main .browse a{
			color:#f860b7;
		}
		body.contribution .main .tools a.vote{
			background: url("/Templates/Images/vote_bg.png") repeat-x right bottom;
			padding-left:25px;
			padding-right:8px;
		}
		body.contribution .main .tools a.vote:hover
		{
			background-image: url("/Templates/Images/vote_bg_hover.png");
			background-color:#fa82cf;
		}
		body.contribution .main .tools a.vote:active
		{
			background-image: url("/Templates/Images/vote_bg_active.png");
			background-color:#f63e9d;
		}
		body.contribution .main .tools span.votes{
			background: #fd7cce url("/Templates/Images/pink_bg.png") repeat-x left bottom;
			color:#fff;
			margin-right:18px;
		}
		body.contribution .main .browse a.next span {
			background: url("/Templates/Images/pink_right_arrow.png") no-repeat right 2px;
		}
		body.contribution .main .browse a.prev span {
			background: url("/Templates/Images/pink_left_arrow.png") no-repeat left 2px;
		}
		body.contribution .tools{
			overflow:hidden;
			margin:1em 0;
		}
		
		body.contribution .tools a, body.contribution .tools span.votes{
			float:left;
			font-weight: bold;
			margin: 1px 0 0 0;
			padding: 5px 5px 8px 5px;
			border-style: solid;
			border-width: 0px 1px 0px 1px;
			border-color: #dfdfdf;
		}
		body.contribution .tools a.report{
			float:right;
			margin-left:11px;
		}
		
		/*register-contribution*/
		body.register-contribution label{
			float:left;
			width:28%; /*114px;*/
			padding-top:4px;
		}
		body.register-contribution label span, body.register-contribution form p span{
			color:#f661b3;
			padding:0 3px;
		}
		body.register-contribution input{
			font-size:0.917em;
			height:1.2em;
			margin-right:9px;
			width:13.6em;
		}
		body.register-contribution input.error, body.register-contribution textarea.error{
			border-color:#bf4b2a;
			border-top-color:#963b21;
			background:#d5542f url(/templates/Images/bf4b2a.png) repeat-x scroll left top;
			color:#fff;
		}
		body.register-contribution form div{
			display:block;
			margin-bottom:7px;
		}
		
		body.register-contribution div.submit
		{
			padding-left:28%; /*114px;*/
		}
		body.register-contribution div.submit span
		{
			background: #fd7cce url("/Templates/Images/pink_bg.png") repeat-x left bottom;
			width:218px;
			margin: 0;
			display:block;
			border-left:1px solid #dfdfdf;
			border-right:1px solid #dfdfdf;
		}
		body.register-contribution div.submit span:hover
		{
			background-image:url("/Templates/Images/submit_hover.png");
			background-color:#f973c5;
		}
		body.register-contribution div.submit span input{
			color:#fff;
			border:0;
			padding:0px 10px 2px 0;
			background: url("/Templates/Images/register_arrow.png") no-repeat 170px 7px;
			height:25px;
			width:218px;
			font-size:1em;
		}
		body.register-contribution #image{
			height:auto;
			width:auto;
		}
		body.register-contribution div.fakefile{
			position:absolute;
			top:0px;
			left:28%; /*114px;*/
		}
		body.register-contribution div.fakefile img{
			width:59px;
			height:18px;
			bottom:-2px;
			position:absolute;
			display:block;
			left:13.4em;
		}
		body.register-contribution textarea{
			width:218px;
		}
		
		body.register-contribution span.message{
			color:#dd0206;
		}
		/*contribution list*/
		body.contributionlist li h2 span{
			display:block;
		}
		body.contributionlist #content li span.votes{
			position:absolute;
			right:0;
			bottom:0;
			font-weight:bold;
			font-size:150%;
			margin:10px;
			color:#f860b7;
		}
		/*------------------------------------------------------------------
		4.1.2 Additional
		-------------------------------------------------------------------*/
		.additional {
			float: left;
			width: 33.3%;
			overflow: hidden;
			top: 0;
		}
		.additional .inner {
			padding: 0 0 0 12px;
		}
		.additional .indent {
			margin: 16px 0 0 15px;
		}
		.additional .back {
			overflow: hidden;
		}
		.additional .back a {
			font-size: 1.091em;
			float: left;
			margin: 1px 0 0 1px;
			padding: 5px 5px 6px 9px;
			border-style: solid;
			border-width: 0px 1px 0px 1px;
			border-color: #dfdfdf;
			background: url("/Templates/Images/button-background.gif") repeat-x left bottom;
		}
		.additional .back span {
			padding: 0 0 0 11px;
			background: url("/Templates/Images/Additional/back-arrow.gif") no-repeat left 3px;
		}
		.additional a.print {
			display: block;
			color: #000000;
			padding: 5px 0 3px 20px;
			font-size: 1.091em;
			background: url("/Templates/Images/Additional/print.gif") no-repeat left 8px;
		}
		.additional a.share {
			display: block;
			color: #000000;
			padding: 3px 0 5px 20px;
			font-size: 1.091em;
			background: url("/Templates/Images/Additional/share.gif") no-repeat left 6px;
		}
		.additional ul.share {
			overflow: hidden;
			margin: 4px 0 0 0;
		}
		.additional ul.share li {
			float: left;
			margin: 0 4px 4px 0;
		}
		body.default .additional {
			float: left;
			width: 36%;
		}
		body.default .additional div.list {
			position: relative;
			min-height: 191px;
			padding: 9px 0 0 0;
			border-style: solid;
			border-width: 0px 1px 0px 1px;
			border-color: #dfdfdf;
			background: url("/Templates/Images/box-border.gif") repeat-x left bottom;
		}
		body.default .additional div.external { 
			margin: 9px 0 0 0;
			min-height: 101px;
			
		}
		body.default .additional h2 span {
			float: left;
			display: block;
			padding: 4px 10px 6px 8px;
			margin: 0;
			border-style: solid;
			border-width: 0px 1px 1px 0px;
			border-color: #dfdfdf;
			background: url("/Templates/Images/Additional/h2-border.gif") repeat-x left bottom;
			word-spacing: -1px;
		}
		body.default .additional a.more {
			position: absolute;
			top: 0;
			right: 0;
			margin: 13px 10px 0 0;
			padding: 3px 7px 3px 0;
			font-size: 0.909em;
			background: url("/Templates/Images/Additional/red-arrow.gif") no-repeat right 5px;
		}
		body.default .additional h3 a { color: #123972; }		
		body.default .additional h3
		{
			color: #123972;
			font-size: 1em;
			font-weight: bold;
			margin: 0 10px 0 0;
			padding: 0;
		}
		body.default .additional ul {
			padding: 17px 10px 8px 10px;
		}
		body.default .additional .external ul {
			padding: 4px 10px 0 11px;
		}
		body.default .additional ul li {
			overflow: hidden;
		}
		body.default .additional ul li.first {
			padding: 0 0 11px 0;
			margin: 0 0 14px 0;
			border-bottom: solid 1px #dfdfdf;
		}
		body.default .additional ul li span.link {
			line-height: 1;
			padding: 0 0 0 7px;
			font-size: 0.909em;
			background: url("/Templates/Images/Additional/red-arrow.gif") no-repeat left 3px;
		}
		/*body.default .additional ul li a[href^="http:"] {
			background: url("/Templates/Images/readmore.png") no-repeat right 1px;
			padding: 0 13px 0 0;
		}*/
		body.default .additional span.date {
			display: block;
			color:#6ca4d5;
			font-size: 0.909em;
		}
		body.default .additional img {
			float: left;
			display: block;
			margin: 2px 9px 0 0;
			border-right: solid 1px #dfdfdf;
		}
		body.default .additional p {
			padding: 0;
			margin: 0;
			color:#6ca4d5;
		}
		body.default .additional .external p {
			color: #8e7f6f;
		}
	/*------------------------------------------------------------------
	4.2 Complementary
	-------------------------------------------------------------------*/
	#complementary {
		float: right;
		width: 25.995%;
	}
	body.default #complementary {
		float: none;
		width: 100%;
		overflow: hidden;
		margin-bottom: 10px;
	}
	#complementary div.teaser {
		overflow: hidden;
		float: left;
		padding: 0;
		margin: 0 0 10px 0;
		min-height: 182px;
		width: 19.273em;
		border-style: solid;
		border-width: 0px 1px 0px 1px;
		border-color: #dfdfdf;
		background: url("/Templates/Images/box-border.gif") repeat-x left bottom;
	}
	body.default #complementary div.teaser {
		margin: 0 9px 0 0;
	}
	#complementary .teaser img {
		display: block;
	}
	#complementary p {
		padding: 0.8em 1em;
	}
/*------------------------------------------------------------------
5 Footer 
-------------------------------------------------------------------*/
#footer {
	padding: 8px 0 0 0;
	font-size: 0.909em;
	width: 100%;
	position: relative;
	min-height: 5em;
}
#footer span {
	display: block;
	margin: 1em 0 0 0;
	padding: 0.5em 0 0.5em 10.4em;
	width: 77.5%;
	border-style: solid;
	border-width: 0px 1px 1px 1px;
	border-color: #dfdfdf;
	background: #97be0d url("/Templates/Images/9F9F9F.gif") repeat-x left bottom;
	color: #ffffff;
}
#footer img {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	margin: 0 43px 0 0;
}
#footer a {
	color: #ffffff;
}

/*------------------------------------------------------------------
5 PageExtended
-------------------------------------------------------------------*/

body.pageextended #wrap {
	position: relative;
}

body.pageextended #content .additional {
	position: absolute;
	top: 0;
}

