/* Notes

960px, 12 col, px based typography

body background color: #FAFAFA
highlight color: #
link color: #
----------------------------------------------------------------------------------------------------*/

/* Whitespace Reset
----------------------------------------------------------------------------------------------------*/
* {
	padding:0;
	margin:0;
	outline:none;
}

img { -ms-interpolation-mode: bicubic; }

.date-added { font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif; 
font-style: italic;}

.collectie a{
text-decoration: none;
color: #FFF;
}

.collectie a:hover{
text-decoration: none;
color: #ff8be8;
}

#gallery { margin-left: 20px; }

table td {
font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif;
}

.headerError {
display: block;
height: 50px;
border-top: 1px solid #ff0000;
border-bottom: 1px solid #ff0000;
color: #FFF;
font-weight: 900;
background: #ff6464 url('../img/error.png') center left no-repeat;
margin-bottom: 10px;
padding-left: 55px;
}

ul, ol, dl
{
	font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif;
	font-size: 12px;
	margin-bottom: 20px;
	padding-left: 25px;
	margin-top:-20px;
	
}

td.infoBoxHeading {
font-weight: 900;
}


.webshop a:hover {
text-decoration: none;
color: #333;
}

.webshop a {
text-decoration: none;
color: #cd39b3;
}


.col33 a:hover {
text-decoration: none;
color: #333;
}

.col33 a {
text-decoration: underline;
color: #cd39b3;
}

.content50 a:hover {
text-decoration: none;
color: #333;
}

.content50 a {
text-decoration: underline;
color: #cd39b3;
}

.product-listing {
background: #EEE url('../img/product-bg.gif');
width: 450px;
float: left;
margin-bottom:20px;
}

span.pro-price {
font-size:30px;
font-family: Georgia;
font-style: italic;
color: #f41d7e;
}

.test .product-listing .product-img .top-image img{
width: 100px;
height: 100px;
}

.product-listing .product-img {
width: 100px;
height: 120px;
float: left;
margin-right:20px;
background: #333;
}

.product-price {
font-size:20px;
font-weight:900;
color: #f41d7e;
font-style:italic;
text-align: right;
height:25px;
float: left;
width: 310px;
padding-bottom: 5px;
}

.product-desc {
padding-top:10px;
padding-right:20px;
height: 75px;
}

a.pro-page-pop {
background: #333;
display: block;
color: #FFF;
text-decoration: none;
font-family: "Trebuchet MS";
}

a.pro-page-pop:hover {
background: #f41d7e;
color: #FFF;
}



.product-desc h2 {
margin:0px;
padding:0px;
}

.content {
display: block;
width: 960px;
clear: both;
}

.content50 {
margin-top:20px;
padding-left:19px;
padding-right:19px;
width:442px;
float: left;
}


.webshop {
padding:20px;
width: 920px;
font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif;
	font-size: 12px;
}




.col33 {
width:682px;
float: left;
padding-left:19px;
padding-top:19px;
padding-right:19px;
}

.last {
margin-top:20px;
width:442px;
padding-right:19px;
padding-left:19px;
}

h2.title {
color: #fd0074;
display: block;
}

.SB-faq h3 {
margin: 0;
padding:0;
}

.rightnegativemargin
{
	float: right;
	margin-top: -30px;
	
}



/* Global Settings
----------------------------------------------------------------------------------------------------*/

body { 
	background: url('../img/html-bg.jpg') top center no-repeat;
	text-align: left;
}

html { 
	background: url('../img/html-bgg.gif') top left repeat-x;
}


#header {
	display: block;
	width:100%;
	height:100px;
	background: silver;
}

#content {
	background: silver;
}

#footer {
	display: block;
	width:100%;
	height:40px;
	text-align: right;

}



/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
	margin: 0px auto;
	width: 960px;
	background: url('../img/wrap-bg.gif') top center no-repeat;
	border-bottom: 1px solid #BFBFBF;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	display:inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .grid_1 {
	width:60px;
}

.container_12 .grid_2 {
	width:140px;
}

.container_12 .grid_3 {
	width:220px;
}

.container_12 .grid_4 {
	width:300px;
}

.container_12 .grid_5 {
	width:380px;
}

.container_12 .grid_6 {
	width:460px;
}

.container_12 .grid_7 {
	width:540px;
}

.container_12 .grid_8 {
	width:620px;
}

.container_12 .grid_9 {
	width:700px;
}

.container_12 .grid_10 {
	width:780px;
}

.container_12 .grid_11 {
	width:860px;
}

.container_12 .grid_12 {
	width:940px;
}



/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .prefix_1 {
	padding-left:80px;
}

.container_12 .prefix_2 {
	padding-left:160px;
}

.container_12 .prefix_3 {
	padding-left:240px;
}

.container_12 .prefix_4 {
	padding-left:320px;
}

.container_12 .prefix_5 {
	padding-left:400px;
}

.container_12 .prefix_6 {
	padding-left:480px;
}

.container_12 .prefix_7 {
	padding-left:560px;
}

.container_12 .prefix_8 {
	padding-left:640px;
}

.container_12 .prefix_9 {
	padding-left:720px;
}

.container_12 .prefix_10 {
	padding-left:800px;
}

.container_12 .prefix_11 {
	padding-left:880px;
}



/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .suffix_1 {
	padding-right:80px;
}

.container_12 .suffix_2 {
	padding-right:160px;
}

.container_12 .suffix_3 {
	padding-right:240px;
}

.container_12 .suffix_4 {
	padding-right:320px;
}

.container_12 .suffix_5 {
	padding-right:400px;
}

.container_12 .suffix_6 {
	padding-right:480px;
}

.container_12 .suffix_7 {
	padding-right:560px;
}

.container_12 .suffix_8 {
	padding-right:640px;
}

.container_12 .suffix_9 {
	padding-right:720px;
}

.container_12 .suffix_10 {
	padding-right:800px;
}

.container_12 .suffix_11 {
	padding-right:880px;
}


/* Logo
----------------------------------------------------------------------------------------------------*/

a.logo, h1.logo {
	display: block;
	width: 230px;
	height: 130px;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

h1.logo a {
	display: block;
	width: 100%;
	text-indent: -9999px;
	height: 100%;
	background: url('../img/springbuck-logo.png') no-repeat;
}

h1.logo a img {
	border: 0px;
	text-indent: 0;
}

.logo { float: left; }

/* Navigation
----------------------------------------------------------------------------------------------------*/

ul.navigation {
display: block;
float: left;
margin:0px;
padding:0px;
width:540px;
padding-left:190px;
padding-top:100px;
margin-bottom:25px;
}

ul.navigation li{
margin:0px;
padding:0px;
float: left;
list-style-type: none;
}

ul.navigation li a{
margin:0px;
padding:0px;
display: block;
padding: 5px;
width:80px;
height:20px;
text-align: center;
text-decoration: none;
font-family: "Trebuchet MS";
color: #FFF;
}

ul.navigation li a:hover{
color: #aae4ff;
}



/* Typography and vertical rhythm
----------------------------------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	font-family: "Cochin", "Baskerville", "palatino linotype", "Georgia", "Cambria", serif;
	font-weight: 100;
	line-height: 1;
	margin-bottom: 15px;
}

h1 {
	font-size: 36px; 
}

h2 {
	font-size: 28px; 
}

h3 {
	font-size: 24px; 
}

h4 {
	font-size: 21px; 
}

h5 { 
	font-size: 18px;
}

h6 { 
	font-size: 16px;
}

p { 
	font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica Neue", "Helvetica", "Verdana", arial, sans-serif;
	font-size:12px;
	line-height:20px;
	font-weight:400;
	margin-bottom: 20px;
}

ul, ol, dl
{
	font-size: 12px;
	margin-bottom: 20px;
}

ul li
{
	padding: 2px 0px 2px 2px;
}

ol li
{
	padding: 0.2em 0;
	list-style: decimal inside;
}

table
{

	font-size: 12px;

} 

/* Components
----------------------------------------------------------------------------------------------------*/

.media {
clear: both;
display: block;
width: 958px;
margin:0px auto;
background: #EEE;
}

.media-nav {
width: 958px;
height: 40px;
background: #333;
margin: 0px auto;
margin-bottom: 20px;
}

img.m3 {
background: url('../img/media1.jpg') top left no-repeat;
}

#next2 {
float: right;
padding-right:19px;
padding-top:10px;
}

#prev2 {
float: left;
padding-left:19px;
padding-top:10px;
}

#next2 a {
display: block;
width: 100px;
height: 20px;
background: url('../img/right.gif') center right no-repeat;
padding-right: 8px;
text-transform: uppercase;
text-decoration: none;
color: #FFF;
font-family: "Trebuchet MS";
}

#prev2 a {
display: block;
width: 100px;
height: 20px;
background: url('../img/left.gif') center left no-repeat;
padding-left: 30px;
text-transform: uppercase;
text-decoration: none;
color: #FFF;
font-family: "Trebuchet MS";
}

#prev2 a:hover {
color: #aae4ff;
}

#next2 a:hover {
color: #aae4ff;
}

.producten {
clear: both;
display: block;
width: 960px;
height: 188px;
}

.productenx {
clear: both;
display: block;
width: 960px;
height: 88px;
}

.product {
display: block;
width: 168px;
height: 168px;
background: #333;
float: left;
margin-left:20px;
}

.productx {
display: block;
width: 168px;
height: 88px;
background: #333;
float: left;
margin-left:20px;
}

.product img {
display: block;
background: #333;
margin:1px;
width: 166px;
height: 126px;
border: 0;
}

.productx img {
display: block;
background: #333;
margin:1px;
width: 166px;
height: 46px;
border: 0;
}

.product h2 {
display: block;
}

.product h2 a {
display: block;
padding-top:10px;
font-family: "Trebuchet MS";
color: #FFF;
text-decoration: none;
font-size: 18px;
text-align: center;
}

.productx h2 {
display: block;
}

.productx h2 a {
display: block;
padding-top:10px;
font-family: "Trebuchet MS";
color: #FFF;
text-decoration: none;
font-size: 18px;
text-align: center;
}

.footer {
background: #EEE;
width: 918px;
margin-left:1px;
padding: 10px 20px;
text-align: right;
font-family: "Trebuchet MS";
color: #b4b4b4;
font-weight: 900;
}

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

.footer a:hover {
color: #5493d5;
}

.footer a.shop-link {
color: #5493d5;
text-decoration: none;
}

.footer a.shop-link:hover {
color: #333;
}

.slide {
width: 920px;
display: block;
height: 178px;
padding:19px;
background: #FFF;
}

.slide img.prod-img {
float: left;
width: 357px;
height: 173px;
border:0;
}

.slide img {
border:0;
}

.slide img.read-more {
margin-top: 5px;
float: right;
}

.media-product {
float: left;
width: 307px;
height:135px;
padding:19px;
}

.media-product h3{
color: #fd0074;
}

.collectie {
background: #333;
height:135px;
float: left;
width:180px;
padding:19px;
color: #FFF;
}

/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* Little bits
----------------------------------------------------------------------------------------------------*/

.screenreader {
	text-indent:-9999px;
}

.zebra {
	background-color: #EEE;
}

hr {
	display: none;
}

label { display: block;
font-weight:900;
font-family: "Trebuchet MS";
padding-top:10px;
}

.contactright input {
width:300px;
height:25px;
font-family: Georgia;
font-style: italic;
padding:2px;
}

.contactright textarea {
width:400px;
height:300px;
font-family: Georgia;
font-style: italic;
padding:2px;
}

.SB-overons .collectie {
margin-top: 20px;
}


h2.inlineh {
width: 140px;
font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif;
font-size:18px;
display: inline;
}

h3.inlineh {
width: 140px;
font-family: "Nimbus Sans L", "Trebuchet MS", "Helvetica", "Verdana", arial, sans-serif;
font-size:18px;
display: inline;
}

a.cms {
color: #F00;
text-decoration: none;
font-family: "Trebuchet MS";
}
