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

	Copyright © 2010 by Landstra & de Groot webdesign
    
    Landstra & de Groot webdesign
    Wijkstaat 69
    9901 AH Appingedam
    info@landstradegroot.nl
    http://landstradegroot.nl/
    
    Webdevelopment by Landstra & de Groot webdesign
    HTML/CSS & Webdesign by Rudolf Bos

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

/* Standard Tags */

* { margin: 0; }
html { height: 100%; }

body {
 	height: 100%;
 	background: #c8d7dc;
	font: 11px Arial, Helvetica, sans-serif;
	color: #688a96;
	}

a { color: #688a96; text-decoration: none; }
a:hover { color: #3e5d68; text-decoration: underline; }
a img { border: 0; }
h1, h2, h3 { font-weight: normal; line-height: normal; }
h1 { padding: 0 0 10px; margin: 10px 0; color: #ad5cb0; font-size: 28px; border-bottom: 4px solid #e8eeef; clear: both; }
h2 { margin: 0 0 10px; font-size: 18px; }
h3 { margin: 0 0 5px; color: #ad5cb0; font-size: 14px; font-weight: bold; }
p, address { margin: 0 0 20px; font-style: normal; }
input, textarea, select { padding: 0; border: 0; font: 11px Arial, Helvetica, sans-serif; color: #688a96; }
input:focus, textarea:focus, select:focus { outline: 0; }

.crosssell_kop{display:none;}
.optie_kiezen select{margin:4px 0px 5px 18px;padding:4px;border:1px solid;}
.productomschrijving {font-size:12px;}

#main-content input{border:1px solid;padding:5px;}
#main-content select{border:1px solid;padding:5px;}

/* Elements */

#container {
	width: 970px;
    min-height: 100%;
    height: auto !important;
    height: 100%;
	margin: 0 auto;
 	line-height: 24px;
	}

#header {
	width: 970px;
 	height: 110px;
  	background: url(../img/bg/header.jpg);
	text-shadow: 1px 1px 0 #e4ebee;
	}
    #header ul { padding: 37px 5px 0 0; list-style: none; float: right; }
    #header ul li { margin: 0 0 0 20px; float: left; }
    #header ul li a { padding: 0 0 0 20px; background: url(../img/bg/header-icons.gif) no-repeat; float: left; }
    #header ul li.hom a { background-position: 0 6px; }
    #header ul li.lev a { background-position: 0 -18px; }
    #header ul li.bet a { background-position: 0 -42px; }
    #header ul li.con a { background-position: 0 -66px; }
    #header a.logo { width: 122px; height: 61px; margin: 20px 0 0 65px; background: url(../img/bg/logo.gif); text-indent: -9999px; float: left; }
    #header blockquote { width: 220px; height: 59px; padding: 7px 0 0; margin: 18px 0 0 215px; background: url(../img/bg/balloon.gif); font-size: 14px; font-weight: bold; font-style: italic; text-align: center; text-shadow: 1px 1px 0 #fff; float: left; }

#content {
	width: 940px;
 	padding: 10px 25px 0 5px;
 	background: url(../img/bg/content.gif);
  	overflow: hidden;
	}

#main-content {
	width: 680px;
 	text-align: justify;
	float: right;
 	position: relative;
	}
    #main-content a.cart { width: 160px; height: 47px; padding: 0 0 0 83px; background: url(../img/bg/cart.gif); color: #fff; font-size: 14px; font-weight: bold; line-height: 45px; text-shadow: 1px 1px 0 #4e6770; position: absolute; top: 57px; right: 0; }
    #main-content a:hover.cart { background-position: bottom; text-shadow: 1px 1px 0 #1b272b; }
    
    #main-content .box { width: 145px; height: 184px; padding: 5px; margin: 0 20px 20px 0; color: #fff; text-align: center; float: left; position: relative; }
	#main-content .box img { max-width: 145px; max-height: 145px; }
    #main-content .box .info { width: 135px; height: 40px; padding: 0 10px; text-align: left; line-height: 40px; position: absolute; bottom: 0; left: 0;  }
    #main-content .box a.meer-info { width: 17px; height: 17px; margin: 10px 0 0; display: block; background: url(../img/bg/meer-info-icons.gif); text-indent: -9999px; overflow: hidden; float: right; }
	#main-content .box span del { font-size: 12px; font-weight: bold; }
    #main-content .box span { font-size: 17px; font-weight: bold; }
    #main-content .box.boy { background: url(../img/bg/box-boy-girl.gif); text-shadow: 1px 1px 0 #4e6770; }
    #main-content .box.girl { background: url(../img/bg/box-boy-girl.gif) top right; text-shadow: 1px 1px 0 #824584; }
    #main-content .box.girl a.meer-info { background-position: -17px 0; }
    #main-content .box.fourth { margin: 0 0 20px; }
	
	#main-content .box-large { width: 320px; height: 145px; padding: 5px; margin: 0 20px 20px 0; background: url(../img/bg/box-large.gif); text-shadow: 1px 1px 0 #e4ebee; float: left; position: relative; }
    #main-content .box-large img { float: left; margin: 0 14px 0 0; }
    #main-content .box-large a.btn { height: 17px; padding: 0 0 0 25px; background: url(../img/bg/meer-info-icons.gif) no-repeat -34px 0; line-height: 17px; float: left; position: absolute; bottom: 15px; left: 165px; }
    #main-content .box-large.alt { margin: 0 0 20px; }
    
    #main-content .box-photo { width: 145px; padding: 5px 5px 0; margin: 0 20px 10px 0; background: url(../img/bg/box-photo.gif); color: #fff; text-align: center; text-shadow: 1px 1px 0 #4e6770; }
	#main-content .box-photo .info { width: 135px; height: 42px; padding: 2px 10px 0; margin: 0 -5px; background: url(../img/bg/box-photo.gif) top right; text-align: left; line-height: 40px; }
    #main-content .box-photo a.meer-info { width: 17px; height: 17px; margin: 10px 0 0; display: block; background: url(../img/bg/meer-info-icons.gif); text-indent: -9999px; overflow: hidden; float: right; }
    #main-content .box-photo span { font-size: 17px; font-weight: bold; }
    
    ul#mainmenu { width: 680px; height: 40px; padding: 0; margin: 0 0 37px; background: url(../img/bg/mainmenu.gif); list-style: none; font-size: 14px; font-weight: bold; line-height: 40px; text-shadow: 1px 1px 0 #fff; }
    ul#mainmenu li { padding: 0 2px 0 0; background: url(../img/bg/mainmenu-split.gif) no-repeat right; float: left; }
    ul#mainmenu li a { padding: 0 30px; float: left; }
    ul#mainmenu li a:hover { text-decoration: none; }
    ul#mainmenu li.active a { background: url(../img/bg/mainmenu-active.gif) no-repeat bottom; color: #3e5d68; }
    ul#mainmenu li.last { padding: 0; background: none; }
    
    #left {
     	width: 175px;
      	float: left;
    	}
        #left a.add-to-cart { width: 115px; height: 40px; padding: 0 0 0 40px; margin: 0 0 20px; background: url(../img/bg/add-to-cart.gif); color: #fff; font-size: 14px; font-weight: bold; line-height: 40px; text-shadow: 1px 1px 0 #824584; float: left; }
        #left a:hover.add-to-cart { background-position: bottom; text-shadow: 1px 1px 0 #3c173d; }
    
    #right {
     	width: 505px;
     	float: left;
    	}
    
    #browse {
     	width: 660px;
      	height: 40px;
       	padding: 0 10px;
       	margin: 0 0 20px;
       	background: url(../img/bg/browser.gif);
        line-height: 19px;
        text-align: center;
        overflow: hidden;
	    }
        #browse ul { padding: 10px 0 0; list-style: none; }
        #browse ul li { margin: 0 1px; display: inline; }
        #browse ul li a { width: 21px; height: 21px; display: inline-block; }
        #browse li.prev a { width: 19px; height: 17px; margin: 1px 0 0; background: url(../img/bg/browser-arrows.gif); text-indent: -9999px; float: left; }
        #browse li.next a { width: 19px; height: 17px; margin: 1px 0 0; background: url(../img/bg/browser-arrows.gif) -19px 0; text-indent: -9999px; float: right; }
        #browse li.active a { background: url(../img/bg/browser-active.gif); font-weight: bold; }
    
    #gallery {
     	width: 660px;
      	padding: 0 0 0 20px;
       	background: url(../img/bg/gallery.gif) right;
	    }
        #gallery a img { margin: 0 10px 10px 0; border: 4px solid #fff; float: left; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; }
        #gallery a:hover img { border: 4px solid #3e5d68; }
        #gallery span.top { width: 680px; height: 6px; margin: 0 0 14px -20px; display: block; background: url(../img/bg/gallery.gif); overflow: hidden; }
        #gallery span.bottom { width: 680px; height: 6px; margin: 0 0 0 -20px; display: block; background: url(../img/bg/gallery.gif) -680px 0; overflow: hidden; clear: both; }

#side-bar {
	width: 200px;
 	padding: 0 20px;
 	margin: 0 20px 0 0;
  	overflow: hidden;
	float: right;
	}
    #side-bar h2 { width: 180px; height: 44px; padding: 0 10px; margin: 0 0 6px; background: url(../img/bg/side-bar-header.gif); line-height: 40px; clear: both; }
    #side-bar h2 img { margin: 14px 0 0 5px; float: right; }
    #side-bar h3 { padding: 5px 0 10px; background: url(../img/bg/toogle-arrow.gif) no-repeat right 6px; border-bottom: 3px solid #e8eeef; cursor: pointer; }
    
    #side-bar form .field { width: 184px; height: 30px; padding: 0 8px; margin: 0 0 5px; background: url(../img/bg/input-field.gif); line-height: 30px; text-shadow: 1px 1px 0 #e4ebee; }
    #side-bar form .btn { width: 70px; height: 30px; margin: 0 0 9px; background: url(../img/bg/input-btn.gif); color: #fff; text-shadow: -1px -1px 0 #824584; float: right; cursor: pointer; }
    #side-bar form#search { width: 190px; height: 30px; padding: 5px; margin: 0 0 20px; background: url(../img/bg/search.gif); }
    #side-bar form#search .field { width: 149px; height: 30px; padding: 0 8px; background: url(../img/bg/search-field.gif); line-height: 30px; text-shadow: none; float: left; }
    #side-bar form#search .btn { width: 14px; height: 15px; margin: 8px 0 0 7px; background: url(../img/bg/search-btn.gif); text-shadow: none; float: left; cursor: pointer; }
    
    #side-bar ul { padding: 0 0 8px; list-style: none; line-height: 22px; clear: both; }
    #side-bar ul li a { padding: 0 10px; height: 22px; margin: 0 0 2px; display: block; }
    #side-bar ul li.jon a { background: url(../img/bg/side-bar-list.gif); color: #fff; }
    #side-bar ul li.jon.active a { width: 184px; margin: 0 -4px 2px 0; background: url(../img/bg/side-bar-list.gif) 0 -22px; color: #fff; font-weight: bold; }
    #side-bar ul li.mei a { background: url(../img/bg/side-bar-list.gif) 0 -44px; color: #fff; }
    #side-bar ul li.mei.active a { width: 184px; margin: 0 -4px 2px 0; background: url(../img/bg/side-bar-list.gif) 0 -66px; color: #fff; font-weight: bold; }
    #side-bar ul#lang { padding: 0 0 20px; line-height: 24px; }
    #side-bar ul#lang li.nl a { padding: 0 0 0 25px; background: url(../img/bg/lang.gif) no-repeat 0 6px; }
    #side-bar ul#lang li.en a { padding: 0 0 0 25px; background: url(../img/bg/lang.gif) no-repeat 0 -18px; }
    
    #side-bar .box { width: 180px; padding: 5px 10px 0; margin: 0 0 10px; background: url(../img/bg/side-bar-box.gif) no-repeat #fff; }
    #side-bar .box ul li a { width: 200px; padding: 0; }
    #side-bar .box ul li.active a { width: 184px; padding: 0 15px; margin: 0 -9px 2px -15px; background: url(../img/bg/side-bar-list.gif) 0 -88px; color: #3e5d68; font-weight: bold; text-shadow: 1px 1px 0 #e4ebee; }
    #side-bar .box span.bottom { width: 200px; height: 5px; margin: 0 -10px; display: block; background: url(../img/bg/side-bar-box.gif) top right; clear: both; overflow: hidden; }

#footer {
	width: 970px;
 	padding: 44px 0 20px;
 	background: url(../img/bg/footer.gif) no-repeat;
 	text-align: center;
  	text-shadow: 1px 1px 0 #e4ebee;
  	clear: both;
	}

/*jqZoom */
.jqZoomPup { overflow: hidden; background: #fff; opacity: 0.6; filter: alpha(opacity=60); z-index: 10; border: 3px solid #666; cursor: crosshair; }
.preload { opacity: 0.8; filter: alpha(opacity = 80); color: #555; border: 1px solid #ddd; background: url(../images/zoomloader.gif) center #fff; z-index: 10; position: absolute; top: 0; left: 0; }
.jqZoomWindow { border: 1px solid #c8d7dc; }

/* Fancy Box */

#fancybox-loading { position: fixed; top: 50%; left: 50%; height: 40px; width: 40px; margin-top: -20px; margin-left: -20px; cursor: pointer; overflow: hidden; z-index: 1104; display: none; }
* html #fancybox-loading { position: absolute; margin-top: 0; }
#fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url('../img/fancybox/fancybox.png'); }
#fancybox-overlay { position: fixed; top: 0; left: 0; bottom: 0; right: 0; background: #000; z-index: 1100; display: none; }
* html #fancybox-overlay { position: absolute; width: 100%; }
#fancybox-tmp { padding: 0; margin: 0; border: 0; overflow: auto; display: none; }
#fancybox-wrap { position: absolute; top: 0; left: 0; margin: 0; padding: 20px; z-index: 1101; display: none; }
#fancybox-outer { position: relative; width: 100%; height: 100%; background: #fff; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; }
#fancybox-inner { position: absolute; top: 0; left: 0; width: 1px; height: 1px; padding: 0; margin: 0; outline: none; overflow: hidden; }
#fancybox-hide-sel-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; }
#fancybox-close { position: absolute; top: -13px; right: -13px; width: 30px; height: 30px; background-image: url('../img/fancybox/fancybox.png'); background-position: -40px 0px; cursor: pointer; z-index: 1103; display: none; }
#fancybox_error { color: #444; font: normal 12px/20px Arial; padding: 7px; margin: 0; }
#fancybox-content { height: auto; width: auto; padding: 0; margin: 0; }
#fancybox-img { width: 100%; height: 100%; padding: 0; margin: 0; border: none; outline: none; line-height: 0; vertical-align: top; -ms-interpolation-mode: bicubic; }
#fancybox-frame { position: relative; width: 100%; height: 100%; border: none; display: block; }
#fancybox-title { position: absolute; bottom: 0; left: 0; font-family: Arial; font-size: 12px; z-index: 1102; }
.fancybox-title-inside { padding: 10px 0; text-align: center; color: #333; }
.fancybox-title-outside { padding-top: 5px; color: #FFF; text-align: center; font-weight: bold; }
.fancybox-title-over { color: #FFF; text-align: left; }
#fancybox-title-over { padding: 10px; background-image: url('../img/fancybox/fancy_title_over.png'); display: block; }
#fancybox-title-wrap { display: inline-block; }
#fancybox-title-wrap span { height: 32px; float: left; }
#fancybox-title-left { padding-left: 15px; background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -90px; background-repeat: no-repeat; }
#fancybox-title-main { font-weight: bold; line-height: 29px; background-image: url('../img/fancybox/fancybox-x.png'); background-position: 0px -40px; color: #FFF; }
#fancybox-title-right { padding-left: 15px; background-image: url('../img/fancybox/fancybox.png'); background-position: -55px -90px; background-repeat: no-repeat; }
#fancybox-left, #fancybox-right { position: absolute; bottom: 0px; height: 100%; width: 35%; cursor: pointer; outline: none; background-image: url('blank.gif'); z-index: 1102; display: none; }
#fancybox-left { left: 0px; }
#fancybox-right { right: 0px; }
#fancybox-left-ico, #fancybox-right-ico { position: absolute; top: 50%; left: -9999px; width: 30px; height: 30px; margin-top: -15px; cursor: pointer; z-index: 1102; display: block; }
#fancybox-left-ico { background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -30px; }
#fancybox-right-ico { background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -60px; }
#fancybox-left:hover, #fancybox-right:hover { visibility: visible; }
#fancybox-left:hover span { left: 20px; }
#fancybox-right:hover span { left: auto; right: 20px; }
.fancy-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; }
#fancy-bg-n { top: -20px; left: 0; width: 100%; background-image: url('../img/fancybox/fancybox-x.png'); }
#fancy-bg-ne { top: -20px; right: -20px; background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -162px; }
#fancy-bg-e { top: 0; right: -20px; height: 100%; background-image: url('../img/fancybox/fancybox-y.png'); background-position: -20px 0px; }
#fancy-bg-se { bottom: -20px; right: -20px; background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -182px; }
#fancy-bg-s { bottom: -20px; left: 0; width: 100%; background-image: url('../img/fancybox/fancybox-x.png'); background-position: 0px -20px; }
#fancy-bg-sw { bottom: -20px; left: -20px; background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -142px; }
#fancy-bg-w { top: 0; left: -20px; height: 100%; background-image: url('../img/fancybox/fancybox-y.png'); }
#fancy-bg-nw { top: -20px; left: -20px; background-image: url('../img/fancybox/fancybox.png'); background-position: -40px -122px; }