﻿html {
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: aliased;
}

body {
	font-family: Arial, Verdana, Helvetica, sans-serif;

	margin: 0;
	padding: 0;
	font-size: 0.85em;
}

#wrapper {
	position: relative;
	margin: 0 auto;
	padding: 0;
	max-width: 850px;
	background: #fff; 
	text-align: left;
}

#inner-wrapper { 
	padding: 0 40px 20px 40px;
}

#taal {
	background: transparent;
	padding: 0;
	margin: 0;
}
#taal ul {
	position: relative;
	margin: 0;
	padding: 10px 0 10px 0;
	list-style-type: none;
}
#taal li {
	float: right;
	margin: 0;
	padding: 0;
}
#taal a {
	color: #006E00;
	background: transparent;
	text-decoration: none;
	text-align: right;
	margin: 0 0 0 20px;
	padding: 0 0 0 20px;
}
#taal a:hover {
	color: #82BF22;
	background: transparent;
}
#taal a.nl {
	background: transparent url(../template/nl.jpg) center left no-repeat;
}
#taal a.de {
	background: transparent url(../template/de.jpg) center left no-repeat;
}
#taal a.en {
	background: transparent url(../template/en.jpg) center left no-repeat;
}
#taal a.fr {
	background: transparent url(../template/fr.jpg) center left no-repeat;
}
#taal a.sp {
	background: transparent url(../template/sp.jpg) center left no-repeat;
}

a#logo {
	float: left;
	border: none;
	padding: 0;
	margin: 0 0 20px 0;
	width: 219px;
	height: 112px;
	background: url(../template/logo.png) top left no-repeat;
}

a#logo:hover {
	background: url(../template/logo.png) 0 -114px no-repeat;
}

.shop {
	display: block;
	width: 100%;
	height: 70px;
}
.shop div {
	float: right;
	clear: right;
}
a.cart {
	color: #156E33;
	text-decoration: none;
	padding: 10px 0 10px 50px;
	line-height: 40px;
	background: url(../template/cart.jpg) top left no-repeat;
}

header nav {
	text-align: right;
	background: transparent;
}
header nav ul {
	margin: 0;
	padding: 1em;
	list-style-type: none;
}
header nav ul li {
	display: inline;
	margin-left: 1em;
}
header nav ul li:first-child {
	margin-left: 0;
}
header nav ul li ul {
	display: none;
}
header nav a{
	color: #156E33;
	background: transparent;
	font-weight: bold;
	font-variant: small-caps;
	font-size: 16px;
	text-decoration: none;
	padding: 5px 9px 5px 9px !important;
}
header nav a:hover {
	color: #156E33;
	background: #82BF22;
	border-radius: 8px;
}
header nav a.active {
	color: #FFF;
	background: #82BF22;
	border-radius: 8px;
}



#top #topinner {
    width: 100%;
    display: inline-block;
    vertical-align: middle;
    font: 0/0 serif;
    text-shadow: none;
    color: transparent;
    background-size: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
	background-image: url(../images/slideshow/garden-harvest.jpg);
}
#top #topinner span {
    padding-top: 45.45%; /* height/width of image */
    display: block;
    height: 0;
}

body#agricultuur #topinner {
	background: url(../images/slideshow/agricultuur.jpg);
}
body#tuinieren #topinner {
	background: url(../images/slideshow/home-gardening.jpg);
}
body#hydrocultuur #topinner {
	background: url(../images/slideshow/hydroponics.jpg);
}
body#cadeauset #topinner {
	background: url(../images/halloween-header.jpg);
}

section, article, header {
	display: block;
	float: left;
	width: 100%;
}
article {
	clear: both;
}

#content {
	margin-top: 40px;
	padding: 0 0 2em 0;
	background: transparent;
}

#inhoud {
	padding: 0 0 1em 0;
	color: #1C1500;
	background: transparent;
	position: relative;
}

* html #inhoud {
    height: 0.1%;
}


#content h1 { font-size: 1.6em; color: #006E00; margin-bottom: 0.5em; }
#content h2 { font-size: 1.35em; color: #82BF22; }
#content h2.rider { color: #fff; }

#content h3 { font-size: 1.15em; color: #A7551B; font-weight: bold; margin-bottom: 0; }

#content h3#overzicht { margin-top: 2em; }

#content h4 { color: #1C1500; margin-bottom: 0;	padding-bottom: 0; }
#content h5 { color: #1C1500; margin-bottom: 0; }

#content h5.textlink { text-align: right; font-size: 1em; }
#content h5.textlink a { color: #82BF22; margin-bottom: 0; }
#content h5.textlink a:hover { color: #A7551B; margin-bottom: 0; }

#content h6 { color: #1C1500; margin-top: 1.5em; font-size: 1em; }

#content p.koptekst { color: #DF7124;  }

#content a { 
	color: #82BF22;
	font-weight: bold;
	text-decoration: none;
	border-bottom: 1px dotted; 
}
#content a:visited {
	color: #645A54;
}

#content a:hover { 
	color: #DF7124;
}

.topblocks {
	float: left;
	max-width: 850px;
	margin-bottom: 2em;
}

.blockmiddle {
	float: left;
	max-width: 300px;
	margin: 0 23px;
	background: #fff;
}

.blockmiddleright {
	margin-left: 250px;
}

.blockmiddleright img {
	float: left;
	margin: 10px 10px 20px 0;
}

.blockmiddleright h2 { 
	font-size: 1em;
	color: #000;
	padding: 0;
	margin: 0 0 2px 4px;
}

.blockmiddleright h2.slogan {
	font-size: 2em !important;
	color: red;
	margin-top: 2em;
}

.blockmiddleright h2 span {
	background: #82BF22; 
	padding: 3px 8px 3px 8px;
	border-radius: 7px 7px 0 0;
}
.blockmiddleright p,
.blockmiddleright h6 {
	margin: 10px;
}

.blockleft {
	float: left;
	width: 230px;
	margin-right: 20px;
	background: #EDF3E3;
	border-radius: 6px;
	border-top: 1px solid #E9EAE0;
	border-right: 1px solid #E9EAE0;
}
.blockleft div {
	padding: 1em;
}
.blockleft div a {
	font-weight: bold;
	text-decoration: none;
	border-bottom: none;
}

.blockleft div a.submenuopen,
.blockleft div a.submenuopenactive {
	font-variant: small-caps;
	font-size: 15px;
}


.blockleft div ul{
	list-style-type: none;
	margin-left: 0;
}
.blockleft div ul li{
	margin-left: 0;
}
.blockleft div ul ul{
	margin: 0 0 1em 1em;
}

.blockright {
	float: right;
	max-width: 300px;
}
.blockright div {
	padding: 0 0 0 1em;
}
.blockright img {
	float: left;
	width: 125px;
	margin: 0 17px 17px 0;

}

.bottomblocks {
	clear: both;
	margin-top: 3em;
	padding-top: 3em;
	border-top: 6px solid #EAF0E7;
}
.bottomblocks div {
	float: left;
	max-width: 237px;
	min-width: 180px;
	background: #fff;
}
.bottomblocks div h3 {
	color: #A7551B;
}
.bottomblocks a {
	border: none !important;
}

.bottomblocks div.middle {
	margin: 0 23px;
}

.bottomblocks div img {
	max-width: 237px;
	height: 138px;
}
.bottomblocks div a img{
	border: 6px solid #EAF0E7;
}
.bottomblocks div a img:hover{
	border: 6px solid #719C4C;
}

div.productoverview {
	float: left;
	width: 245px;
	margin: 0 0 8px 8px;
	padding: 0;
	border: 1px solid #B2D2AA;
	border-radius: 6px;
}

div.productoverview img {
	float: left;
	width: 120px;
	padding: 0 10px 0 0!important;
	margin: 0 !important;
	border-radius: 6px 0 0 6px;
}
div.productoverview h6 {
	padding: 0;
	margin: 20px 0 0 0;
}

div.productoverview h6.button {
	text-align: right;
	margin: 25px 10px 0 0;
}

h6.button a {
	font-size: 14px;
	text-decoration: none !important;
	border-bottom: none !important;
	padding: 5px 9px 5px 9px !important;
	color: #fff !important;
	background: #82BF22;
	border-radius: 8px;
	box-shadow: 2px 2px 2px #888;
	white-space: nowrap;
}
h6.button a:visited {
	color: #645A54;
}
h6.button a:hover {
	color: #000 !important;
	box-shadow: none;
}

h6.hoofdpagina {
	float: right;
}

h6.reviewshop {
	float: right;
	margin-top: 370px;
}

h6.remark {
	font-size: 10px !important;
	text-align: right;
	padding: 1em 0 !important;
}
.news h6.button {
	float: right;
	margin: 0 !important;
}

div.product {
	float: left;
	width: 99%;
	border: 1px solid #B2D2AA;
	border-radius: 6px;
}
div.product img {
	padding: 0 10px 0 0!important;
	margin: 0 !important;
	border-radius: 6px 0 0 6px;
}
div.product h2 {
	padding-top: 0.5em;
	font-size: 1.35em; 
	color: #82BF22;
}
div.product h3 {
	margin-top: 1em;
	font-size: 1em !important;
	margin-bottom: 0;
	padding-bottom: 0;
}
div.product h4 {
	margin-left: 1em;
}
div.product h4.price {
	font-size: 1.6em; color: #006E00; margin-bottom: 0;
}
div.product h5 {
	margin: 0 0 2em 0;
}
div.product p.lieferzeit {
	margin: 0;
	color: #000;
	text-align: center;
}
div.product p.lieferzeit a {
	color: #000;
}

div.kwart {
	float: left;
	width: 48%;
	display: block;
	border-radius: 6px;
	text-align: center;
	margin-right: 1%;
}
div.kwart img {
	margin-left: 10px;
}
div.kwart h6.button {
	margin: 1em 0;
}
div.kwart h6.button a {
	font-size: 12px;
	margin: 1em 0;
	padding: 4px 8px 4px 8px !important;
}

#content ul {
	margin: 0 0 2em 0;
	padding: 0;
}

#content ul li {
	line-height: 1.35em;
	margin-left: 1em;
}

#content ul li ul {
	line-height: 1.3em;
	margin: 0 0 0 0.7em;
	font-size: 0.95em;
}

#content ul.linkoverzicht {
	margin-bottom: 2em;
}
#content ul.linkoverzicht li {
	list-style-type: none;	
}
#content ul.linkoverzicht h2{
	font-variant: small-caps;
	margin-bottom: 0;
}
#content ul.linkoverzicht p {
	margin-left: 1em;
}

#content ul.inline li {
	list-style-type: none;
	display: inline;
}

#content ul.imagelinks {
	text-align: center;
	margin: 0.5em auto 3em auto;
}
#content ul.imagelinks li {
	margin: 0 0.01em;
}
#content ul.imagelinks a, a img {
	border: none;
}

#content ul.imagelinks a:hover {
	border-bottom: 2px dotted #5F8183 !important;
}

#content ul.imagelinks a.open {
	border-bottom: 2px solid #6D7D8C !important;
}

#content ul.notype {
	margin: 1em 0;
	list-style-type: none;
}
#content ul.indent {
	margin-left: 1em;
}
#content ul.indent li{
	margin-bottom: 0.5em;
}
#content ul.indent li p{

}

#content ul.opsomming li{
	list-style-type: none;
	margin-left: 0.8em;
}
#content ul.opsomming li ul li{
	list-style-type: disc;
	margin-left: 1em;
}

ol#bronvermelding {
	color: #40889A;
	margin: 3em 0 0 0;
	padding: 0;
	font-size: 0.85em;
}
ol#bronvermelding li {
	margin-left: 1.6em;
}

#content ol.lijst {
	list-style-type: upper-alpha;
}
#content ol.lijst h4{
	color: rgb(254,254,255);
	background: rgb(0,51,102);
}
#content ol.lijst h4 span{
	font-style: italic;
}

#content li {
	margin: 0.4em 0; 
}
#content li p, #content ol.abclijst li p, #content ol.cijferlijst li p {
	margin-top: 0;
}

.news {
	float: right;
	width: 220px;
	padding: 5px;
	margin-left: 1em;
	background: #EDF3E3;
	border-radius: 6px;
	border-top: 1px solid #E9EAE0;
	border-right: 1px solid #E9EAE0;
}
.news h2,
.news h3,
.news h4 {
	margin: 0;
	padding: 0;
}
.news h2 a{
	text-decoration: none !important;
	border-bottom: none !important;
	color: #82BF22 !important;	
}
.news h3 {
	padding-top: 5px;
	font-size: 0.85em !important;
}
.news h4 {
	text-align: right;
	font-size: 0.80em !important;
}
.red {
	color: #BE0606 !important;
	font-size: 1.5em !important;
}

.linkblok {
	float: left;
	border: 1px solid #617E8C;
	padding: 0.5em;
	margin: 0 18px 1em 0;
	position: relative;
	width: 99%;
	background: #184066;
}
.linkblok a, .linkblok a:visited {
	color: rgb(192,202,214) !important;
	font-weight: bold;
}
.linkblok a:hover { 
	color: rgb(96,129,132) !important;
}

a.googlemaps, a.googlemaps:visited {
	border: none !important;
}
a.googlemaps img {
	height: 98px;
	width: 153px;
	position: relative;
	border: 1px dotted;
	margin-bottom: 1em;
}

abbr {
	font-style: italic;
	cursor: help;
}

p + form {
	margin-top: 3em;
}

form#verzendform {
	margin-top: 1em;
	background: transparent;
}

form#shopform input {
	margin-top: 0;
	margin-bottom: 1em;
}

.bestelknop,
.bestelknophover {
	padding: 5px 9px 5px 9px !important;
	color: #000;
	background: #82BF22;
	margin-left: 50px;
	border: 1px solid #006E00;
	border-radius: 6px;
	box-shadow: 2px 2px 2px #888;
}
.bestelknophover {
	color: #fff;
	box-shadow: none;
	cursor:pointer;
}


form table {
	padding: 1em;
	font: 99% Arial, Helvetica, sans-serif;
	background: #EDF3E3;
	border-radius: 6px;
	border-top: 1px solid #E9EAE0;
	border-right: 1px solid #E9EAE0;
}

form table h3 {
	padding-top: 1em;
}


legend {
	font-weight: bold;
}

.bestelblok {
	margin: 3em 0;
}

div.checkboxblock {
	margin-left: 180px !important;
}

fieldset {
	border: 1px solid #E9EAE0;
	border-radius: 6px;
	margin-top: 2em;
}

fieldset div {
	background: #EDF3E3;
	padding: 1em;
	border-radius: 6px;
}

label {
	margin-right: 1em;
}

span.form_error {
	color: red;
}

.image-right {
	float: right !important;
	margin: 0 0 1em 1.5em !important;
}
.image-left {
	float: left;
	margin: 0 1.5em 1em 0;
}

.imageblock-right {
	float: right !important;
	margin: 0.5em 0.5em 1em 1.5em !important;
	width: 200px;
	height: 200px;
	text-align: center;
	font-style: italic;
}

.image-right, .image-left, .imageblock-right {
	position: relative;
	background: transparent;
}

a img.image-right, a img.image-left, a img.imageblock-right {
	border: none;
}

.rechts {
	float: right;
	position: relative;
	margin: 0 0 1em 1em;
	clear: right;
}
.links {
	float: left;
	position: relative;
	margin: 0 1em 1em 0;
}
.center {
	text-align: center;
}

.small {
	font-size: 0.85em;
}

div.review {
  background: #FAFCF8;
  border: 1px solid #EDF3E3;
  margin: 5px 0;
}


footer {
	margin: 0 auto 2em auto;
	max-width: 850px;
	padding: 0;
	background: transparent;
	clear: both;
}

footer div {
	color: #000;
	text-align: center;
	padding: 0 0 0.5em 0;
	height: 0.1%;
}

footer ul {
	width: 33%;
	min-width: 200px;
	float: right;
	margin: 0;
	padding: 2.2em 0 0 0;
}
footer ul li {
	text-align: left;
	margin: 0;
	padding: 0.2em 1.5em 0.2em 0;
	list-style-type: none;
}

footer a { 
	color: #49520E; 
	margin: 0; 
	text-decoration: none; 
	border-bottom: 1px dotted; 
}
footer a:visited { color: #6C5D3D; }
footer a:hover { color: #B6B1A5; }

footer p {
	clear: both;
	padding-top: 2em;
}

footer li.webdesign {
	margin-top: 2em;
}

footer ul.social a{
	text-decoration: none !important;
	border: none;
}


a.webdesign {
	display: block;
	padding-top: 1em;
	color: #728CAB;
	font-variant: small-caps;
	text-decoration: none !important;
	border: none !important;
}

.vulblok {
	height: 10em;
}

.vulblokgroot {
	height: 20em;
}

p.blind {
	clear: both;
}
p.clearright {
	width: 100%;
	height: 1em;
	display: block;
	clear: right;
}

/* #Media Queries
================================================== */
/* Large desktops and laptops */
@media (min-width: 1200px) {
	body { background: #F9F9F9 url(../template/bg-body.jpg) center top no-repeat; }
}

/* Portrait tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1199px) {
	body { background: #F9F9F9 url(../template/bg-body.jpg) center top no-repeat; }
}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
	body { background: #DAE4C9;  }
	footer a { line-height: 2em; }
}

@media (max-width: 870px) {
	.remark { clear: both !important; }
	.product img { width: 49%; }
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
	footer a { line-height: 2em; }
	footer ul { float: left; }
	#menudown { display: table; }
	.blockmiddleright { display: table-header-group; }
	.blockleft { display: table-footer-group; float: none; width: 100%; }
	.blockleft ul { float: left; width: 280px; }
	.blockleft ul li a { line-height: 2.2em; font-size: 1.1em; }
}

@media (max-width: 650px) {
	.news { display: block;	width: 100%; padding: 0; margin: 1em 0 3em 0;}
	.news div { padding: 1em; }
}

@media (max-width: 600px) {
	.bottomblocks div { float: none; max-width: 100%; border-bottom: 2px solid #EAF0E7; margin-bottom: 2em;}
	.bottomblocks div img {	clear: both;}
	.bottomblocks div.middle { margin: 0 0 2em 0; }	
}

@media (max-width: 520px) {
	.product img { clear: right; } 
}


