@charset "utf-8";
/* CSS Document */

/*
Used colors:
	Black				: #98C908
	Darkgrey			: #4D4D4D
	Grey				: #808080
	Lightgrey			: #F2F2F2
	Blue				: #00ABBF
*/

/* ------------------------------------------------ // main */

html {
	height				: 100%;
	overflow-y			: scroll;	
}
body {
	color				: black;
	font-size			: 1.0em;
	text-align			: center;
	background-color	: white;
	cursor				: default;
	height				: 100%;
}
div, span, p, a, h1, h2, h3, h4, h5, h6, label, td, tr, li {
	font-family			: Arial, Helvetica, sans-serif;
}
h1 {
	font-size			: 1.3em;
	font-weight			: bold;
	line-height			: 1.3em;
	margin-bottom		: 1.0em;
}
h2 {
	font-size			: 1.0em;
	line-height			: 1.2em;
	font-weight			: bold;
	margin-bottom		: 1.0em;
}
h3 {
	font-size			: 0.9em;
	line-height			: 1.2em;
	font-weight			: normal;
	margin-bottom		: 0.5em;
}
h4,h5,h6 {
	font-size			: 0.8em;
	font-weight			: bold;
}
p {
	font-size			: 0.8em;
	line-height			: 1.5em;
	margin-bottom		: 1.3em;
}
a {
	color				: black;
	text-decoration		: underline;
	outline				: none;
	line-height			: 1.5em;
}
a:hover {
	color				: #00ABBF;
}
table {
	margin-bottom		: 1.3em;
	width				: 100%;
}
td, th {
	font-size			: 0.8em;
	line-height			: 1.5em;
	padding				: 3px;
	vertical-align		: top;
}
th {
	background-color	: #4D4D4D;
	color				: white;
}
th a {
	color				: white;
}
th a:hover {
	color				: #00ABBF;
}
td p {
	font-size			: 1.0em;
}
td h3 {
	margin				: 0;
}
.hidden {
	display				: none;
}
b, strong {
	font-weight			: bold;
}
i, em {
	line-height			: 1.9em;
	font-style			: italic;
}

ul {
	margin-bottom		: 1.3em;
	list-style			: disc;
	padding-left		: 16px;
}
ol {
	margin-bottom		: 1.3em;
	padding-left		: 24px;
	list-style			: decimal;
}
li {
	font-size			: 0.8em;
	line-height			: 1.5em;
}
li p {
	font-size			: 1.0em;
}
li li {
	font-size			: 1.0em;
}
ol ul, ul ol, ol ol {
	margin-bottom		: 0;
}
span.small {
	font-size			: 0.8em;
}

/* ------------------------------------------------ // container */

div#container {
	position			: relative;
	width				: 980px;
	margin-left			: auto;
	margin-right		: auto;
	text-align			: left;
	padding-top			: 3px;
}

/* ------------------------------------------------ // header */

div#header {
	position			: relative;
	width				: 980px;
	height				: 110px;
	margin-bottom		: 4px;
	background-color	: #CCC;
	background-image	: url(../images/bg-header.jpg);
	border-top			: 1px solid white;
}
div#header h1 a {
	position			: absolute;
	top					: 13px;
	left				: 16px;
	font-size			: 49px;
	text-decoration		: none;
	color				: black;
	background-image	: url(../images/logo-Hefra.jpg);
	background-repeat	: no-repeat;
	width				: 320px;
	height				: 64px;
	text-indent			: -999em;
}
div#header p {
	position			: absolute;
	top					: 75px;
	left				: 20px;
	font-size			: 18px;
	font-weight			: bold;
}
div#headerimages {
	position			: absolute;
	top					: 22px;
	left				: 622px;
	background-image	: url(../images/headerimages.png);
	height				: 66px;
	width				: 336px;
}

/* ------------------------------------------------ // navigation */

div#navigation {
	position			: relative;
	background-color	: black;
	width				: 100%;
	height				: 30px;
	margin-bottom		: 4px;
	overflow			: hidden;
}
div#navigation ul {
	position			: relative;
	list-style			: none;
	margin-bottom		: 0;
	padding				: 0;
	margin-top			: 9px;
	left				: -11px;
}
div#navigation ul li {
	line-height			: 14px;
	float				: left;
}
div#navigation ul li a {
	display				: block;
	text-decoration		: none;
	color				: white;
	margin-left			: 10px;
	border-left			: 1px solid white;
	padding-left		: 10px;
	line-height			: 1.1em;
	font-size			: 0.9em;
}
div#navigation ul li.active a {
	font-weight			: bold;
	text-decoration		: underline;
	font-size			: 1.0em;
	margin-top			: -1px;
	color				: #00ABBF;
}
div#navigation ul li a:hover, div#navigation ul li.active a:hover {
	text-decoration		: underline;
	color				: #00ABBF;
}

/* ------------------------------------------------ // language */

div#language {
	position			: absolute;
	right				: 4px;
	top					: 5px;
}
div#language select#lang {
	height				: 20px;
}

/* ------------------------------------------------ // content */

div#content {
	position			: relative;
	width				: 980px;
}
div#left {
	position			: relative;
	width				: 200px;
	float				: left;
	margin-right		: 10px;
}
div#middle {
	position			: relative;
	width				: 560px;
	float				: left;
}
div#right {
	position			: relative;
	width				: 200px;
	float				: right;
	margin-top			: 0px;
}
div.clearer {
	clear				: both;
	height				: 10px;
}

/* ------------------------------------------------ // kruimelpad */

div#breadcrumb {
	position			: relative;
	font-size			: 0.6em;
	height				: 20px;
	width				: 980px;
	line-height			: 14px;
	margin-left			: 3px;
}
div#breadcrumb span.breadcrumbs {
	font-weight			: normal;
}

/* ------------------------------------------------ // left */

div#left div.block {
	width				: 180px;
	padding				: 10px;
	padding-bottom		: 0;
}
div#left div.block h3 {
	background-color	: #808080;
	color				: white;
	height				: 30px;
	line-height			: 30px;
	margin				: -10px;
	margin-bottom		: 2px;
	padding-left		: 10px;
}
div#left ul {
	padding				: 0;
	margin				: 0;
	margin-left			: -10px;
	margin-right		: -10px;
	list-style			: none;
}
div#left ul li {
	padding-left		: 10px;
}
div#left ul li.Odd {
	background-color	: #F2F2F2;
}

div#left ul li a {
	width				: 200px;
	display				: block;
	line-height			: 24px;
}

div#left ul li.Sel {
	font-weight			: bold;
}

div#left ul li.Sel a {
	text-decoration		: none;
}
/* ------------------------------------------------ // middle */

div#middle div#fullblock {
	padding:0; margin:0; overflow: hidden; /* voor de jQuery cycle plugin */
	
	width				: 560px;
	background-color	: #F2F2F2;
	height				: 360px;
	margin-bottom		: 10px;
	text-align			: center;
}

div#middle div#fullblock img { height: 360px; width: 560px; border: 0; }

div#middle div.block {
	width				: 255px;
	padding				: 10px;
	background-color	: #F2F2F2;
	float				: left;
	margin-right		: 10px;
	min-height			: 175px;
}
div#middle div.last {
	margin-right		: 0;
}
div#middle div.block h3 {
	background-color	: #4D4D4D;
	color				: white;
	height				: 30px;
	line-height			: 30px;
	margin				: -10px;
	margin-bottom		: 5px;
	padding-left		: 10px;
}
div#middle .odd {
	background-color	: #F2F2F2;
}
a.readmore {
	font-size			: 0.8em;
}

/* ------------------------------------------------ // item */

div.image {
	max-width			: 290px;
	float				: left;
}
div.image img {
	max-width			: 280px;
	margin-right		: 10px;
}
div.itemdetail {
	width				: 270px;
	float				: left;
}
table.itemdetail {
	width				: 100%;
	padding				: 0px;
}
table.itemdetail td {
	font-weight			: bold;
}
table.itemdetail td.field {
	font-weight			: normal;
}

a.pdf {
	background-image	: url(../images/pdf-small.png);
	background-repeat	: no-repeat;
	padding-left		: 22px;
}

ul.applications {
	padding				: 0px;
	margin				: 0px;
	list-style			: none;
	margin-bottom		: 16px;
}
ul.applications li {
	float				: left;
	margin-right		: 10px;
}

div.assortment-text img {
	float				: left;
	margin-right		: 10px;	
}


/* ------------------------------------------------ // item - shopblock */

div#shopblock {
	font-size			: 0.8em;
	line-height			: 25px;
	margin-bottom		: 1.3em;
}
div#shopblock div.favorite {
	float				: left;
	width				: 50px;
	line-height			: 25px;
	height				: 25px;
}
div#shopblock div.favorite img {
	margin-top			: 2px;
}
div#shopblock div.price {
	float				: left;
	width				: 200px;
	line-height			: 25px;	
}

div#shopblock table.price  {
	width				: 150px;
}

div#shopblock table.price  td {
	font-size			: 14px;
	line-height			: 25px;	
}



div#shopblock div.amount {
	float				: left;
}
div#shopblock div.amount table {
	margin				: 0px;
}
div#shopblock div.amount table td {
	padding				: 2px;
}


/* ------------------------------------------------ // content styling */

a.file {
	display				: block;
	padding-left		: 22px;
	background-image	: url(../images/pdf-small.png);
	background-repeat	: no-repeat;
	line-height			: 20px;
	float				: left;
}
span.filesize {
	line-height			: 20px;
	margin-left			: 5px;
	font-size			: 0.8em;
}
p.message {
	color				: red;
}
button {
	font-size			: 12px;
	line-height			: 16px;
	padding-left		: 5px;
	padding-right		: 5px
}
button.update {
	width				: 18px;
	height				: 18px;
	border				: none;
	background-color	: white;
	background-image	: url(../images/update.png);
	background-repeat	: no-repeat;
	background-position	: bottom;
	cursor				: pointer;
}
button.delete {
	width				: 18px;
	height				: 18px;
	border				: none;
	background-color	: white;
	background-image	: url(../images/delete.png);
	cursor				: pointer;
}

table.border td {
	border				: 1px solid black;
}

/* ------------------------------------------------ // news */

div.newsitem {
	margin-bottom		: 20px;
	clear				: both;
}
span.date {
	display				: block;
	font-size			: 0.8em;
	font-style			: italic;
}
div.pagination {
	display				: block;
	text-align			: center;
	font-size			: 0.8em;
	line-height			: 1.5em;
}

/* ------------------------------------------------ // right */

div#right h2 {
	line-height			: 28px;
	margin				: 0;
}
div#right div.block {
	position			: relative;
	width				: 180px;
	padding				: 10px;
	background-color	: #F2F2F2;
	margin-bottom		: 10px;
}
div#right div.block h3 {
	background-color	: #808080;
	color				: white;
	height				: 30px;
	line-height			: 30px;
	margin				: -10px;
	margin-bottom		: 5px;
	padding-left		: 30px;
	background-image	: url(../images/lookingglass-icon.png);
	background-repeat	: no-repeat;
}
div#right input {
/* MWEI: verwijderd omdat IE5 geen input[type="checkbox"] ondersteunt
	width				: 174px;
*/	
	margin-bottom		: 2px;
}
div#right input[type="checkbox"] {
	width				: 15px;
	margin-bottom		: 2px;
	margin-top			: 2px;
}
div#right label {
	font-size			: 0.8em;
	line-height			: 1.3em;	
}
div#right select {
	width				: 180px;
	margin-bottom		: 2px;
}
div#right button {
	margin-bottom		: 2px;
	font-size			: 12px;
	line-height			: 15px;
}
div#right input.password {
	width				: 80px;
}
div#progress {
	font-size			: 11px;
	position			: absolute;
}

/* ------------------------------------------------ // adres tabel */

table.address {
	width				: 280px;
	float				: left;
	margin-bottom		: 50px;
}
table.address td.label {
	width				: 80px;
	font-weight			: bold;
}

/* ------------------------------------------------ // contactperson */

div.contactperson {
	position			: relative;
	background-color	: #F2F2F2;
	padding				: 10px;
	margin-bottom		: 10px;
	clear				: both;
	min-height			: 75px;
}
div.contactperson div.image {
	height				: 90px;
	width				: 70px;
	float				: left;
}
div.contactperson p {
	margin-bottom		: 0px;
}
div.contactperson p.function {
	font-style			: italic;
	font-size			: 11px;
	margin-bottom		: 10px;
	line-height			: 15px;
}

/* ------------------------------------------------ // kolommen */

div.kolom1 {
	position			: relative;
	width				: 200px;
	float				: left;
	margin-right		: 10px;
}
div.kolom2 {
	position			: relative;
	width				: 560px;
	float				: left;
}
div.kolom3 {
	position			: relative;
	width				: 200px;
	float				: right;
}

/* ------------------------------------------------ // left menu - wordt in kolom1 geladen */

ul.leftmenu {
	padding				: 0;
	margin				: 0;
	list-style			: none;
}
ul.leftmenu li {
	padding-left		: 10px;
}
ul.leftmenu li.Odd {
	background-color	: #F2F2F2;
}
ul.leftmenu li a {
	width				: 200px;
	display				: block;
	line-height			: 24px;
}

/* ------------------------------------------------ // footer */

div#footer {
	width				: 980px;
	height				: 30px;
	position			: relative;
	overflow			: hidden;
	background-color	: black;
	border-bottom		: 4px solid white;
}
div#footer p {
	font-size			: 0.7em;
	color				: white;
	float				: left;
	margin-left			: 10px;
	margin-top			: 7px;
}
div#footer p strong {
	margin-left			: 12px;
	margin-right		: 2px;
}
div#footer a {
	color				: white;
	line-height			: 1.1em;
}
div#footer a:hover {
	color				: #00ABBF;
}
div#footer ul {
	list-style			: none;
	margin				: 0;
	padding				: 0;
	float				: right;
	margin-top			: 8px;
	margin-right		: -1px;
}
div#footer ul li {
	float				: left;
	font-size			: 0.7em;
	border-right		: 1px solid white;
	padding-right		: 10px;
	margin-left			: 10px;
	color				: black;
	line-height			: 1.0em;
}

/*
	WEBSHOP
*/
input.cartaddinput
{
	text-align:right;
	vertical-align: middle;
}

button.cartaddpic
{
	background-image: url(../img/addtocart.png);
	background-repeat: no-repeat;
	border: inset 0px #000000;
	cursor: hand;
	color: white;
	font-family: Verdana;
	font-size: 8pt;
	font-weight:bold;
	width: 21px;
	height: 22px;
}

table.catalog
{
	border-collapse: collapse;
}

table.catalog td
{
	vertical-align		: top;
}

/* ------------------------------------------------ // google maps */

#map_canvas {
	font-family			: Arial,Helvetica,sans-serif;
	font-size			: 12px;
	margin-bottom		: 20px;
}
#map_canvas .info {
	width				: 300px;
	height				: 200px;
}
#map_canvas .info .columns2 .column1 {
	width				: 150px;
}
#map_canvas .info .columns2 .column2 {
	width				: 130px;
	margin-top			: 10px;
	line-height			: 16px;	
}

/* ------------------------------------------------ // downloads */

ul.downloads {
	list-style			: none;
	width				: 770px;
}
ul.downloads li {
	float				: left;
	width				: 240px;
	height				: 300px;
}
ul.downloads.artwork li {
	width				: 250px;
	height				: 160px;
}
ul.downloads li a {
	float				: left;
	display				: block;
	width				: 180px;
	height				: 240px;
	text-align			: center;
	border				: 1px solid #999;
}
ul.downloads.artwork li a {
	float				: left;
	display				: block;
	width				: 240px;
	height				: 80px;
	text-align			: center;
	border				: 1px solid #999;
}
ul.downloads li a.pdf {
	text-align			: left;
	width				: auto;
	height				: auto;
	border				: 0;
	margin-top			: 10px;
	display				: block;
	min-width			: 100px;
}

.prijslijstcol1{
	float				: left;
	width				: 180px;
	height				: 70px;
	padding-bottom		: 28px;
	background-color	: #F2F2F2;
}
.prijslijstcol1 .heading{
	font-size			: 0.8em;
	padding-top			: 7px;
	padding-bottom		: 6px;
	color				: #FFFFFF;
	background-color	: #4D4D4D;

	padding-left		: 15px;
}
.prijslijstcol1 img{
	float				: left;
	margin-left			: 7px;
	border				: none;
	margin-top			: 15px;
}
.prijslijstcol1 span{
	float				: left;
	margin-left			: 7px;
	display				: block;
	width				: 130px;
	margin-top			: 15px;
	font-size			: 0.7em;
	margin-bottom		:
}
.prijslijstcol1 a{
	font-weight			: bold;
}
.prijslijstcol2{
	margin-left			: 22px;
	float				: left;
	width				: 760px;
}	
.prijslijstcol2 div.label{
	width				: 100px;
	float				: left;
	display				: block;
	line-height			: 1.6em;
	clear				: left;	
	font-size			: 0.8em;
}
.prijslijstcol2 div.info{
	display				: block;
	float				: left;
	width				: 300px;
	font-size			: 0.8em;
	line-height			: 1.6em;
	margin-bottom		: 20px;
	font-weight			: bold; 
}
.prijslijstcol2 li{
	margin-bottom		: 13px;
}