/***************************************************************************

	Name:		sassi.css
    Site:		SASSI - http://www.sassi.dk
	Author:		Bjarni Olsen
	Date:		april 2009

	Table of Contents:
	=================

	1 - =GLOBAL SETTINGS
	2 - =GRID LAYOUT
		2.1 - =Framework
		2.2 - =Header
		2.3 - =Top Navigation
		2.4 - =Side Navigation
		2.5 - =bodyWrapper
			2.5.1 - =Produktvisning
		2.6 - =Footer

****************************************************************************/

/* *************************************************************************
1 - =GLOBAL SETTINGS
************************************************************************** */
html { text-align: center; }

body {
	padding: 0;
	color: #000;
	letter-spacing: 0px;
	font-family: Arial, Helvetica, sans-serif, Dina, "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
	font-size:11px;
	text-align: left; }

.wrapper {
	width: 970px;
	margin: 0 auto;
	border-right: 1px solid #999999;
	border-left: 1px solid #999999; }
	
.fcwrapper {
	width: 700px;
	margin: 0 auto;
	border-right: 0px solid #999999;
	border-left: 0px solid #999999; }
	
h1, h2, h3, h4 {
	font-family: Cambria, "Hoefler Text", Utopia, "Liberation Serif", "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;
	font-style: italic;
	font-family: Georgia,"Nimbus Roman No9 L",serif; }

h1 {
	margin: 0 0 15px;
	font-size: 3em;
	line-height: 1em;
	color: #253439; }

h2 { 
	margin: 0 0 15px;
	font-size: 1.8em;
	color: #253439; }

h3 { 
	margin: 0 0 5px;
	font-size: 1.4em;
	color: #253439; }

h4 { 
	margin: 0 0 10px;
	font-size: 1.2em;
	color: #253439; }

p, a, a:link, a:active, a:visited, a:hover, span, .description { font-size: 1.2em; }

.description p { font-size: 100%; }

p { margin: 0 0 10px 0; }

a.main:link {
  color : #c63;
  text-decoration : none;
  font-size:12px;
  font-weight: bold;
}
a.main:visited {
  color : #c63;
  text-decoration : none;
  font-size:12px;
  font-weight: bold;
}
a.main:hover {
  color : #999;
  text-decoration : none;
  font-size:12px;
  font-weight: bold;
}
a.main:active {
  color : #c63;
  text-decoration : none;
  font-size:12px;
  font-weight: bold;
}

a, a:link, a:active { color: #000; }
a:visited { color: #253439; }
a:hover { color: #253439; }

img { display: block; }

.HIDDEN { display: none; }
.clear { clear: both; }

/***************************************************************************
2 - =GRID LAYOUT
****************************************************************************/
/*
2.1 - =Framework
*****************************************/
.col {
    float: left;
    margin-bottom: 10px; }
.gutter {
    margin-right: 10px; }
.small {
    width: 200px; }
.medium {
    width: 385px; }
.large {
    width: 770px; }
.fblarge {
    width: 700px;
	height: 440px; }
.full {
    width: 970px; }
a.contentlink {
	font-weight: bold;
	color: #c63;
	text-decoration: none;
	font-size: 12px;
	outline:none; }

/*
2.2 - =Header
*****************************************/
#header h1 {
	height: 161px;
	margin: 0;
	padding: 0;
	outline: none;
	text-indent: -9999px;
	background: url(../_img/header.jpg) no-repeat; }

#header h1 a { 
	display: block;
	height: 100%; }
	
#fbheader h1 {
	height: 124px;
	margin: 0;
	padding: 0;
	outline: none;
	text-indent: -9999px;
	background: url(../_img/facebook_header.jpg) no-repeat; }

#fbheader h1 a { 
	display: block;
	height: 100%; }

/*
2.3 - =TopNavigation
*****************************************/
#navigation {
	height: 42px;
	width: 969px;
	margin-left: 1px;
	padding-top: 8px;
	padding-left: 0px; 
	text-align: center; }

#navigation li { display: inline; }

#navigation li a,
#navigation li a:link,
#navigation li a:visited {
	height: 24px;
	line-height: 24px;
	padding: 0 24px;
	outline: none;
	text-align: center;
	text-decoration: none;
	color: #999;
	font-weight: bold;
	text-transform: uppercase; }

#navigation li a:active { outline: none; }

#navigation li a:hover,
#navigation li.active a { 
	color: #c63;
	text-decoration: underline; }

/*

/*
2.3 - =TopNavigation
*****************************************/
#fbnavigation {
	height: 42px;
	width: 700;
	margin-left: 1px;
	padding-top: 8px;
	padding-left: 0px; 
	text-align: center; }

#fbnavigation li { display: inline; }

#fbnavigation li a,
#fbnavigation li a:link,
#fbnavigation li a:visited {
	height: 24px;
	line-height: 24px;
	padding: 0 7px;
	outline: none;
	text-align: center;
	text-decoration: none;
	color: #999;
	font-weight: bold;
	text-transform: uppercase; }

#fbnavigation li a:active { outline: none; }

#fbnavigation li a:hover,
#fbnavigation li.active a { 
	color: #c63;
	text-decoration: underline; }

/*

2.4 - =SideNavigation
*****************************************/
#sidenavigation {
	float: left;
	width: 145px;
	padding: 0 0 136px 50px;
	background: url(../_img/logo_hide.jpg) no-repeat 50px bottom; }

#sidenavigation a,
#sidenavigation a:link,
#sidenavigation a:visited,
#sidenavigation a:active {
	line-height: 20px;
	padding: 0;
	outline: none;
	text-align: center;
	text-decoration: none;
	letter-spacing: 0px;
	color: #999;
	font-weight:bold;
	text-transform: uppercase; }

#sidenavigation li.space { margin-bottom: 20px; }

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

#sidenavigation li.produkter {
	padding-left: 10px;
	border-left: 1px solid #c63; }

#sidenavigation li.active a { color: #c63; }

#sidenavigation .logo {	margin: 106px 0 40px 0; }

/*
2.4 - =bodyWrapper
*****************************************/
#body {
	float: left;
	width: 100%;
	text-align: left;
	padding-top: 20px;
	padding-bottom: 40px; }

.content img { float: left; }

.content p { padding: 0 20px 0 461px; }

.produkter .shop, .produkter .description, .produkter h2 { padding: 0 20px 0 461px; }
.produkter h2 {
	margin-bottom: 10px;
	line-height: 20px;
}

/* 2.5.1 - =Produktvisning */
.shop {
	position: relative;
	height: 30px;
}
.price {
	position: absolute;
	top: 10px;
	left: 461px;
}
.shopItem {
	position: absolute;
	top: 5px;
	left: 570px;
	display: block;
	width: 57px;
	height: 26px;
	text-indent: -9999px;
	outline: none;
	background: url(../_img/nkap_buy.jpg) no-repeat;
}
.produkter ol, .produkter li {
	float: left;
}
.produkter img {
	display: block;
	float: left;
}
.firstItemWrapper {
	height: 310px;
}
.fbfirstItemWrapper {
	height: 350px;
}
.scroller {
	width: 395px;
}
.scrollWrapper {
	position: relative;
}
#scrollContainer {
	width: 365px;
	clear: both;
	margin: 0 15px;
	overflow: hidden;
	padding: 0;
	position: relative;
	background-color: #fff;
}
#left, #right {
	position: absolute;
	top: 32px;
	display: block;
	width: 14px;
	height: 12px;
	text-indent: -9999px;
	outline: none;
}
#left { 
	left: 0; 
	background: url(../_img/pil_venstre.jpg) no-repeat;
}
#right { 
	right: 0; 
	background: url(../_img/pil_hoejre.jpg) no-repeat;
}
.scrollWrapper ol {
	position: relative;
	left: 0;
	width: 2500px;
	padding: 10px 0;
}
.scrollWrapper li {
	width: 95px;
}
.scrollWrapper .thumb a {
	display: block;
	outline: none;
}
.scrollWrapper .thumb h2,
.scrollWrapper .thumb .description,
.scrollWrapper .thumb .price,
.scrollWrapper .thumb .shopItem,
.scrollWrapper .thumb .originalImage {
	display: none;
}


/*
2.5 - =Footer
*****************************************/
#footer { 
	clear: both;
	height: 49px;
	background: url(../_img/footer.jpg) no-repeat; }

#footer p { 
	margin: 0;
	padding: 0;
	text-indent: -9999px; }