/* 



…ster om Śn stylesheet
Last changed: 2008-01-29 
Author: Colin Lewis



--------------------------------------------------------------------

Contents:

1. Import Boilerplate stylesheets
2. Basic styles
3. Links
4. Structure - index
5. Structure - subpages
6. Header image replacement
7. Footer image replacement
8. Typography & misc. styles
9. Image gallery


--------------------------------------------------------------------



*/



/* 1. Import Boilerplate */
/* -------------------------------------------------------------------- */

@import "lib/reset.css";
@import "lib/typography.css";
@import "lib/forms.css";


/* 2. Basic styles */
/* -------------------------------------------------------------------- */

ul { list-style-type: none; }

/* 3. Links */
/* -------------------------------------------------------------------- */

a,a:link,a:hover,a:active,a:visited
{
	text-decoration: none;
	font-weight: bold;
}

a,a:link { color: #f36; }
a:hover { color: #f36; text-decoration:underline; }
a:active { color: #555; }

#navigation a { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
#navigation a,#navigation a:link { color: #000; }
#navigation a:hover { color: #f36; text-decoration:none; }
#navigation a:active { color: #333; }

#mem-link a:link,
#mem-link a:visited { color: #f36; }
#mem-link a:hover { color: #666; text-decoration:none; }
#mem-link a:active { color: #333; }

#mat-link a:link,
#mat-link a:visited { color: #f36; }
#mat-link a:hover { color: #666; text-decoration:none; }
#mat-link a:active { color: #333; }

a img,:link img,:visited img { border: none; }
h4 a { color: #000; }


/* 4. Structure - index */
/* -------------------------------------------------------------------- */

body#start
{
	margin: 0;
	text-align: center;
	background-image: url('images/start-bg.jpg');
	background-position: center top;
	background-repeat: no-repeat;
}

#start-header
{
	width: 455px;
	text-align: right;
}

#start #header h1
{
	margin-top: 210px;
	margin-left: 125px;
	margin-bottom: 4px;
}

#start #header p
{
	text-align: right;
	width: 327px;
	margin-left: 128px;
	margin-top: 0px;
	padding-top: 4px;
	border-top: 2px solid #333;
	font-family: Futura, Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-size: 1.1em;
}

#start #content
{
	width: 340px;
	margin: 15px 100px 0px 495px;
	text-align: left;
}

#start #navigation
{
	float: left;
	width: 455px;
	margin-left: -960px;
	margin-top: 20px;
	text-align: right;
	background-image: url('images/nav/nav-top.jpg');
	background-repeat: no-repeat;
	background-position: right top;
}

#start #navigation #nav-wrap ul#main { margin: 20px 10px 10px 285px; }
#start #content,
#start #navigation { margin-bottom: 40px; }

#start #footer
{
	clear: none;
	width: 340px;
	background-image: url('images/start-footer2.jpg');
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 30px;
	margin-top: 120px;
	background-color: transparent;
}

#start #footer p
{
	width: 340px;
	text-align: left;
	margin: 0 auto 70px 0px;
	color: #333;
	font-weight: bold;
}



/* 5. Structure - subpages */
/* -------------------------------------------------------------------- */

body
{
	margin: 0;
	text-align: center;
	background-image: url('images/random/rotate.php');
	background-position: center top;
	background-repeat: no-repeat;
}

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

#header
{
	/*height:293px;*/
	width: 301px;
	text-align: right;
	margin-bottom:50px;
}

#header h1
{
	width: 301px;
	text-align: right;
	margin-top: 165px;
	margin-left: 5px;
	margin-bottom: 4px;
	text-align: right;
}

#content-wrap
{
	float: left;
	width: 100%;
}

#content
{
	margin-left: 338px;
	padding-top: 1em;
	text-align: left;
	width: 247px;
}

#content #member-info img
{
	float: right;
	margin-top: 2px;
	padding: 0 0 5px 5px;
}

#gallery-wrapper
{
	float: left;
	width: 330px;
	height:400px;
	margin: 7.9em 0px 0px -335px;
	text-align: center;
	color: #999;
	position: relative;
}

#gallery-wrapper-single
{
	float: left;
	width: 330px;
	height:330px;
	margin: 4.3em 0px 0px -335px;
	text-align: center;
	color: #999;
	position: relative;
}

#medlem-thumbs
{
	float: left;
	width: 330px;
	margin-top: 35px;
	margin-left: -335px;
	text-align: center;
}

#medlem-thumbs h2 { text-align:left; }

#medlem-thumbs .thumbnail
{
	float: left;
	width: 100px;
	height:120px;
	overflow:visible;
	margin: 0px 6px 6px 0;
}

#material { margin-top:-100px;}
#medlem-thumbs .cats { clear:left; border-bottom:1px solid #ccc; padding-top:10px; }
#medlem-thumbs .cat-heading { text-align:left; margin-left: 11px; }
#medlem-thumbs #material { margin-top:-30px; }

#navigation
{
	float: left;
	width:293px;
	margin-left: -960px;
	text-align: right;
	background-image: url('images/nav/nav-top.jpg');
	background-repeat: no-repeat;
	background-position: right top;
}

#nav-wrap
{
	height: 100%;
	padding-bottom: 38px;
	background-image: url('images/nav/nav-bot.jpg');
	background-repeat: no-repeat;
	background-position: right bottom;
}

#navigation #nav-wrap ul#main
{
	margin: 20px 15px 10px 123px;
	width: 157px;
	font-size: 1.4em;
	line-height: 1.2;
}

#navigation #nav-wrap ul#main li
{
	margin-bottom: 0.2em;
}

#navigation #nav-wrap ul#main li ul
{
	margin: 0 0 0.5em 0;
	width: auto;
	font-size: 0.8em;
}

#nav-medlemmar
{
	background:white;
	margin-top: 0px;
	position:relative;
}

#pink
{
	margin:0 13px 0 0;
}

#medlemmar-rubrik
{
	margin-top: 0;
	font-weight:bold;
	font-size:1.3em;
}

#content,
#gallery-wrapper,
#gallery-wrapper-single,
#medlem-thumbs,
#navigation { margin-bottom: 120px; }

#footer
{
	clear: left;
	width: 100%;
	background-image: url('images/footer2.jpg');
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 100px;
	margin-top: 0px;
	background-color: transparent;
	font-size: 1.1em;
}



/* 6. Header image replacement */
/* -------------------------------------------------------------------- */

#header h1
{
	height: 46px;
	width: 285px;
	position: relative;
	padding: 0;
	overflow: hidden;
}

#header h1 em
{
	display: block;
	height: 46px;
	width: 285px;
	position: absolute;
	top: 0;
	right: 0;
	background-image: url(images/logga.gif);
}

h1#start-header
{
	height: 54px;
	width: 330px;
	position: relative;
	padding: 0;
	overflow: hidden;
}

h1#start-header em
{
	display: block;
	height: 54px;
	width: 330px;
	position: absolute;
	top: 0;
	right: 0;
	background-image: url(images/logga-stor.gif);
}


/* 7. Footer image replacement */
/* -------------------------------------------------------------------- */

/* also need styles for replacing e-mail address */

/*
#footer #kontakt
{
	height: 47px;
	width: 261px;
	position: relative;
	padding: 0;
	overflow: hidden;
}

#footer #kontakt em
{
	display: block;
	height: 47px;
	width: 261px;
	position: absolute;
	top: 0;
	left: 0;
	background-image: url(images/footer-kontakt.gif);
}
*/


/* 8. Typography & misc. styles */
/* -------------------------------------------------------------------- */

#header p
{
	text-align: right;
	width: 283px;
	margin-left: 8px;
	margin-top: 0px;
	padding-top: 4px;
	border-top: 2px solid #333;
	font-family: Futura, "Hevetica Neue", Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-size: 1.1em;
}

#content h2
{
	margin: 0 0 0 0;
	letter-spacing: -1px;
}

#content h3
{
	letter-spacing: -1px;
	margin: -0.2em 0 0.8em 0;
}

#content h4
{
	letter-spacing: -1px;
	margin: 1em 0 0 0;
}

#content ul.horizontal-nav { border-bottom: 1px solid #ccc; text-align:left; }
#content ul.horizontal-nav { margin: 0 0 0.5em 0; }
#content ul.horizontal-nav li { display: inline; }

#content ul.horizontal-nav li#first
{
	padding-right: 5px;
	border-right: 1px solid #ccc;
}

#content  ul.horizontal-nav li#second { padding-left: 5px; }


#medlem-thumbs .horizontal-nav-wrap { margin-bottom:20px; text-align:left; }
#medlem-thumbs ul.horizontal-nav { border-bottom: 1px solid #ccc; text-align:left; }
#medlem-thumbs ul.horizontal-nav { margin: 0; }
#medlem-thumbs ul.horizontal-nav li { display: inline; }
#medlem-thumbs h4 { margin-top:0; }
#medlem-thumbs ul.horizontal-nav li#first
{
	padding-right: 5px;
	border-right: 1px solid #ccc;
}

#medlem-thumbs ul.horizontal-nav li#second { padding-left: 5px; }


#member-domtab
{
	border-bottom: 1px solid #ccc;
	padding-right: 3px;
	text-align: right;
position:absolute;
padding:0 3px;
top:25px;
right:13px;
}
#member-domtab { margin: 0; }
#member-domtab li { display: inline; }
#member-domtab li#one
{
	padding-right: 5px;
	border-right: 1px solid #ccc;
}

#member-domtab li#two { padding-left: 5px; }

#mat-link .cat-title { padding-top:1em; font-weight:bold; }

p#bildtext { margin: 10px; }

#footer p
{
	width: 340px;
	padding-top: 10px;
	text-align: left;
	margin: 0 auto 30px 635px;
	color: #333;
	font-weight: normal;
}

#footer p .bullet { color: #888; }


/*9. Image gallery */
/* -------------------------------------------------------------------- */

#gallery, .gallery-container
{
	width: 330px;
	height: 330px;
}

/* Absolute positioning for IE6 */
.gallery-container img
{
position:absolute;
top:0;
}

.gallery-container .gallery-images
{
	width: 330px;
	height: 330px;
	position: relative;
}

.gallery-container .gallery-images .gallery-loader
{
	width: 330px;
	height: 330px;
	margin:0;
	padding:0;
	display: none;
	/*	background-image: url(images/loader.gif);*/
	background-repeat: no-repeat;
	background-position: center center;
}

.gallery-container .gallery-nav
{
margin-top:20px;
}

.gallery-container .gallery-nav .gallery-nav-item
{
	float: left;
	width: 50px;
	height: 50px;
	margin: 0px 5px 0px 5px;
	position: relative;
	overflow: hidden;
}

.gallery-container .gallery-nav .gallery-nav-item img
{
	width: 50px;
	height: 50px;
}

.gallery-container .gallery-nav .gallery-nav-item .gvIIFlash
{

	background: transparent;
	position: absolute;
	top: 0;
	left: 0;
	height: 50px;
	width: 50px;
	cursor: pointer;
}

.gallery-container .gallery-nav .gallery-nav-item img
{

	position: absolute;
	top: 0;
	left: 0;
	padding: 0;
	margin: 0;
	margin-left: 0;
	margin-top: 0;
	border: none;
	cursor: pointer;
}

.xouter
{
	position: relative;
	left: 50%;
	float: left;
	clear: both;
	text-align: left;
}

.xinner
{
	position: relative;
	left: -50%;
	text-align: left;
}