/*

	Name: hjertström.info
	Date: 2010-01-31
	Description: My portfolio
	Version: 1.0
	Author: Michael Hjertström
	Author URL: http://www.hjertstrom.info
	
*/

/* Imports */
@import url("reset.css");

/***** Global *****/
/* Body */
	body {
		background: #d7d7d7 url('../img/back.jpg');
		background-position: center;
		background-repeat: repeat-y;
		color: #000305;
		font-size: 87.5%;
		font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
		line-height: 1.429;
		margin: 0 auto -142px;
		padding: 0;
		text-align: left;
	}

	
	
/* Headings */
h2 {font-size: 1.571em}	/* 22px */
h3 {font-size: 1.429em}	/* 20px */
h4 {font-size: 1.286em}	/* 18px */
h5 {font-size: 1.143em}	/* 16px */
h6 {font-size: 1em}		/* 14px */

h2, h3, h4, h5, h6 {
	font-weight: 400;
	line-height: 1.1;
	margin-bottom: .8em;
}

/* Anchors */
a {outline: 0;}
a img {border: 0px; text-decoration: none;}
a:link, a:visited {
	color: #fff;
	padding: 0 1px;
	text-decoration: underline;
}
a:hover, a:active {
	color: #000;
	text-decoration: none;
	text-shadow: 1px 1px 1px #333;
}

/* Paragraphs */
p {margin-bottom: 1.143em;}
* p:last-child {margin-bottom: 0;}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

::-moz-selection {background: #F6CF74; color: #fff;}
::selection {background: #F6CF74; color: #fff;}

/* Lists */
ul {
	list-style: outside disc;
	margin: 1em 0 1.5em 1.5em;
}

ol {
	list-style: outside decimal;
	margin: 1em 0 1.5em 1.5em;
}

dl {margin: 0 0 1.5em 0;}
dt {font-weight: bold;}
dd {margin-left: 1.5em;}

/* Quotes */
	blockquote {font-style: italic;}
	cite {}
	q {}

	
/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}

/***** Layout *****/
.body {clear: both; margin: 0 auto; width: 900px;}
img.right figure.right {float: right; margin: 0 0 0 0;}
img.left, figure.left {float: right; margin: 0 0 0 0;}
img.header, figure.header {margin: 0 0 0 0;}


/*
	Header
*****************/
#banner {
	margin: 0 auto;
	padding: 0;
	background: #777; /* samma som bakgrunden i menyn! */
}
	
	/* Main Nav */
	#banner nav {
		background: #777;
		font-size: 1.5em;
		height: 50px;
		line-height: 45px;
		margin: 0 auto;
		padding: 0;
		text-align: center;
		width: 900px;
		
	}
	
	#banner nav ul {list-style: none; margin: 0 auto; width: 800px;}
	#banner nav li {float: left; display: inline; margin: 0;}
	
	#banner nav a:link, #banner nav a:visited {
		color: #fff;
		display: inline-block;
		height: 50px;
		margin: 0 1em 0 0;
	}
	#banner nav a:hover, #banner nav a:active,
	#banner nav .active a:link, #banner nav .active a:visited {
		/* background: ; */
		color: #333;
		text-shadow: 1px 1px 1px #555;
	}



/*
	Aside
******************/


	
/*
	Body
*****************/
#content nav {
	background: #ddd;
	font-size: 1em;
	height: 30px;
	line-height: 25px;
	margin: 0 auto;
	padding: 0;
	margin-bottom: 20px;
	text-align: center;
	width: 850px;
	
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#content nav ul {list-style: none; margin: 0 auto; width: 800px;}
#content nav li {float: left; display: inline; margin: 0;}

#content nav a:link, #content nav a:visited {
		color: #000;
		display: inline-block;
		height: 50px;
		margin: 0 1em 0 0;
}
#content nav a:hover, #content nav a:active,
#content nav .active2 a:link, #content nav .active2 a:visited {
		/* background: ; */
		color: #292;
		text-shadow: 1px 1px 1px #555;
}


#content {
	background: #fff url('../img/contentback.jpg');
	background-repeat: no-repeat;
	background-position: top;
	margin-bottom: 3em;
	overflow: hidden;
	padding: 20px 20px;
	padding-bottom: 100px;
	width: 860px;
}

#content aside {
	background: #b31212;
	float: right;
	padding: 10px;
	margin: 0 auto 3em auto;
	overflow: hidden;
	
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#content aside figure img {padding-top: .5em; padding-left: 5px; display: block;}
/* #content aside p:first-child {text-align: center; color: #fff; text-shadow: 1px 1px 1px #555; font-size: 1.5em;} */
#content aside p {text-align: center; margin: 0; padding: 0; line-height: 1.1em; color: #fff; font-size: 1em;}
#content aside a:link, #content aside a:visited {color: #fff; line-height: 1.1em; margin: 0;}
#content aside a:hover, #content aside a:active {color: #232; text-shadow: none;}

#content aside ul {list-style: none; margin: 0;}
#content aside li {color: #fff; font-size: 1em; width: 200px;}
/* #content aside li:last-child {width: 200px;} EN HEL RAD */
#content .oppet {float: left; width: 200px;}
#content .oppet li {float: left; margin: 0; width: 100px;}
#content .kartlink {float: left; width: 200px; padding-top: 105px;}
#content .kartlink li {float: left; width: 200px; padding-top: 1px; height: 1em;}

#content h3{text-align: center;}
#content h5 {text-align: center; color: #a31500; font-style: italic;}
#content h6 {padding-left: 3.5em; color: #a31500; font-style: italic;}

#content a:link, #content a:visited {
		color: #000;
		display: inline-block;
		height: 50px;
		margin: 0 1em 0 0;
}

#content a:hover, #content a:active {
		color: #a31500;
		text-shadow: none;
}

#content ul.link {list-style: square; margin: 0 auto; width: 800px; position: relative;}

/*
	About
*****************/
#about {
	background: #fff;
	font-style: normal;
	overflow: hidden;
	padding-left: 20px;
	text-align: left;
	width: 500px;
	position: absolute;
	bottom: 0px;
}


#about ul {list-style: none; margin: 0 auto; width: 800px;}
#about li {float: left; display: inline; margin: 0;}

#about li a:link, #about li a:visited {
	color: #000;
	display: inline-block;
	height: 30px;
	margin: 0 1em 0 0;
}
#about li a:hover, #about li a:active,
#about li .active a:link, #about li .active a:visited {
	color: #333;
	text-shadow: 1px 1px 1px #555;
}

/*
	Footer
*****************/
#contentinfo {text-align: right; position: relative;}

hr {height: 1px; text-align: left;}
/*
	Gallery
*****************/
.navi { background-color: #ddd; border-top: 1px solid #999; padding: 5px;}
.gallery {margin: 10px 0;}
#gallery {
		background-color: #b31212;
		width: 835px;	
		display: block;
		padding-top: 5px;
		padding-bottom: 1em;
		padding-left: 1.2em;
		margin-left: 5px;
			
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		
}
#gallery .page1 {display: block; height: 105px; position: relative; text-align: center;}
#gallery .hidden-page {display: none; height: 105px; position: relative;}
#gallery .navi {background-color: #ddd; padding: 5px; position: absolute; top: 5px;}
#navi {
		background-color: #ddd; 
		height: 20px; 
		text-align: center;
		width: 820px;
		
		boder-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
}

#gallery2 { 
	background-color: #232; 
	width: 835px;
	display: inline-block; 
	padding-bottom: 2em; 
	padding-left: 1.2em; 
	margin-left: 5px; 
	
	border-radius: 10px; 
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
}
#gallery2 .page1 {display: block; height: 105px; position: relative; text-align: center;}
#gallery2 .hidden-page {display: none; height: 105px; position: relative;}
#gallery2 .navi {background-color: #ddd; padding: 5px; position: absolute; top: 5px;}

#gallery img { border: 5px solid #777; display: block; }
#gallery img:hover { border: 5px solid #ddd; display: block; }
#gallery2 img { border: 5px solid #777; display: block; }
#gallery2 img:hover { border: 5px solid #ddd; display: block; }

.COUNT {display: none;}