/* ------- fonts  */
body {
	background-color: #FFFFFF;
}
html {
	font-family: Arial, Helvetica, sans-serif;	
}
/* ------- css reset defaults BS2014 */
body,html,
h1,h2,h3,h4,h5,
div,li,ul,img,p {
margin:0px; border:0px; padding:0px;
}



/* ------- header  */
.header {
background: url(images/headerbackground5.jpg);
background-repeat:no-repeat;
background-position: left top;
background-color: #FFFFFF;
border-bottom:0px;
height: 190px;
}
.header img {
padding-left:200px;
}

.header h1 {
padding: 60px 50px;
color: #C3E3D3;  	
font-weight: bold;
font-size: 3.7em;
}

@media only screen and (min-width:1000px) {
.header {
margin-left:100px;
}
}

@media only screen and (min-width:1600px) {
.header {
margin-left:300px;
}
}

@media only screen and (max-width:500px) {
.header {
background: url(images/headerbackground400.jpg);
background-repeat:no-repeat;
background-position: left top;
background-color: #FFFFFF;
border-bottom:0px;
height: 190px;
}
.header h1 {
font-size: 1.7em;
}
}
 
/* ------- top promo  */

.topPromo h2 {
margin:0px;
color: white;
background-color: #224033;	/* -- donkergroen  */
border-bottom: 0px solid #000000;

}
.topPromo h2 {
padding: .2em 0px .2em 20px;
padding-right:200px;
color: white;
font-weight: normal;
font-size: 1.2em;
}
/* ------- hyperlink, reset defaults  */
h2 a:link, h2 a:visited {
color:white;
font-weight: bold;
text-decoration: none;
}
h2 a:hover, h2 a:active {
color:white;
text-decoration: underline;
}

.topPromo img {
border: 0px solid #AAAAAA;	
float:right;
margin-top:-60px;
margin-left:50px;
margin-right:10px;
border-bottom:0px solid #AAAAAA;

}

/* ------- list Box without li  */
.listBox {
display: block;
padding-left:0px;
padding-top: 6px;
background-color: #ffffff;
}

.listBox ul{
padding-left: 20px;
}

.listBox h3{
padding: 20px;
padding-left: 0px;
padding-right: 0px;
font-weight: bold;
font-size: 1.6em;
text-align:center;

border: 1px solid #FFFFFF;
background-color: #C3EADF;
/* webkit */
-webkit-border-radius: 10px 10px 0px 0px;	
background: -webkit-gradient(linear, left top, right bottom, from(#C3EADF), to(#8FBFAF));
-webkit-box-shadow: 0px 5px 5px #C0C0C0;
/* moz */
-moz-border-radius: 10px 10px 0px 0px;
background: -moz-linear-gradient(left top, #C3EADF, #8FBFAF);
-moz-box-shadow: 0px 5px 5px #C0C0C0;
/* css3 */
border-radius: 10px 10px 0px 0px;
background: linear-gradient(to bottom right, #C3EADF, #8FBFAF);
box-shadow: 0px 5px 5px #C0C0C0;
}

/* product list box*/
.prodlist {
	border: 2px solid #AAAAAA;	
	/* webkit */
	-webkit-border-radius:10px;	 
	-webkit-box-shadow: 5px 5px 5px #C0C0C0;
	/* moz */
	-moz-border-radius:10px;	 
	-moz-box-shadow: 5px 5px 5px #C0C0C0;
	/* css3 */
	border-radius: 10px;	
	box-shadow: 5px 5px 5px #C0C0C0;
margin:6px;
float:left;
background-color: white;
max-width:350px;
}


/* ------- list  */

.linkList ul {
border-bottom: 0px solid #c1c0c0;
list-style-type: none;

}
/* .linkList li {  */
.catbox {
padding: 0px;
margin: 0px;
border: 0px solid #ADADFF;
clear:both;
display:block;
margin-bottom:10px;
margin-right:20px;
margin-top:6px;
}


/* ---- text  */
.linkText {
padding: 10px;
vertical-align: top;
background: url(images/linkTextbackgroundimageklein.jpg);
background-repeat: no-repeat;
background-position: right bottom;
background-color: #F0F0F0;	/* background afdeling */
/* webkit */
background: url(images/linkTextbackgroundimageklein.jpg) right bottom no-repeat, -webkit-gradient(linear, left top, right top, from(#FFFFFF), to(#FFFFFF));

}

.linkText  span {
display:inline-block;
/* border: 2px solid #FF0000;  red */
vertical-align: top;
margin: 0px;
padding-left: 0px;
padding-top: 0px;
padding-bottom: 10px;
/* min-width:250px; */
color: black;
font-size: 1em;
}


.linkText  h4{
margin: 0px;
padding: 0px;
color: black;
font-size: 1.1em;
padding-left:20px;
}

.linkText  img{
margin: 10px;
margin-top: 6px;
margin-bottom: 0px;
margin-left: 6px;
margin-right: 0px;
color: black;
font-size: 1em;
vertical-align: top;
}



.listMore  a{
margin-left: 120px;
}



/* ---- linkList2  */

.linkList2 ul {
border-bottom: 4px solid #c1c0c0;
list-style-type: none;
padding-left:20px;
}
.linkList2 li {
	display:inline;	
	padding: 0px;
	margin: 0px;
	/*border: 1px solid #00FFF0;  groen */
	vertical-align: top;
	clear:both;
	background-color: transparant;
}
/* picbox, items with image and texts  */
.linkList2 .picbox {
	display:inline;
	border: 0px solid #5500FF;
	vertical-align: top;
	height:200px;
	text-align:center;
	
}
.picbox a{
	border: 2px solid #DDDDDD;
	/*webkit*/
	 -webkit-border-radius:10px;	 
	-webkit-box-shadow: 5px 5px 5px #DDDDDD;*/
	/* css3 */
	border-radius: 10px;	
	box-shadow: 5px 5px 5px #DDDDDD;
	background-color: #F0F0F0;
	display:inline-block;
	width:112px;
	vertical-align: top;
	text-align:center;
	color: black;
	font-size: .8em;
	text-decoration:none;
	margin-bottom:10px;
}
/* ------- hyperlink, reset defaults  */
.picbox a:link, .picbox a:visited {
color:black;
font-weight: bold;
text-decoration: none;
border: 2px solid #DDDDDD;
}
 
.picbox a:hover, .picbox a:active {
color:grey;
text-decoration: underline;
border: 2px solid #000000;
background-color: #DFDFDF;
	/*webkit*/
	 -webkit-border-radius:10px;	 
	-webkit-box-shadow: 5px 5px 5px #BBBBBB;*/
	/* css3 */
	border-radius: 10px;	
	box-shadow: 5px 5px 5px #BBBBBB;
}

.picbox img{
	border: 0px solid #FF0000;
	display:block;
	vertical-align: top;
	margin-bottom:4px;
}
.picbox span{
	border: 0px solid #FF0000;
	display:block;
	margin-top:0px;
	margin-bottom:0px;
	height:30px;
	margin-left:2px;
	margin-right:2px;
}

/* head, first item of picbox  */
.picboxhead img{
	/*border: 0px solid #00FF00;  groen */
	margin-bottom:10px;
	vertical-align: top;
}
.picboxhead span{	/*title*/
	/*border: 0px solid #00FF00;  groen */
	margin-right:0px;
	max-width:90%;
	display:inline-block;
	margin-top:6px;
	margin-bottom:0px;
	vertical-align: top;
	font-size: .96em;
}
/* - footer */
.footer {
clear:both;
}

.footer  span{
color:black;
text-decoration: none;
font-size: .6em;
float:right;
margin-right:20px;
margin-bottom:4px;
}
.footer  hr{
margin:0px;
height:1px;
border:0;
color:white;
}
/* ------- hyperlink, reset defaults  */
.footer a:link, .footer a:visited , .footer a:hover, .footer a:active {
color:black;
font-weight: bold;
text-decoration: none;
}