dl,dt,dd,ul,ol,li,pre,form,fieldset,input,blockquote,img,h1,h2,h3,h4,h4,h5 {margin:0;padding:0;}

html {overflow-y: scroll;}

img { border:0; }

body {
	margin:0; padding:0;
	font:8pt tahoma, arial, verdana;
	background-color:#cccccc;
	background: url(../img/bg-koffiebonen.jpg) fixed;
}

.clear {
	clear:both;
}
h2 {color:#000000; font-size:8pt; margin-bottom:0; padding-bottom:0;}
h3 {color:#ff9900; font-size:8pt;}

ol {margin-left:25px;}
ol a {color:#333333; }

a {color:#000000;}

.container {
    width: 946px;
    margin: 0 auto; 
    position: relative; 
	text-align: left;
	margin-top:40px;
	background: url(../img/bg-container.png) -5px 0px;
	margin-bottom:20px;
}

.logo-deKoffieboer { position:absolute; float:left; margin: 21px 0 0 26px; }


.menu {
    width: 946px; height:103px;
	/*background: url(../img/header-koffieboer-2.png) -85px -6px;*/ 
}
.menu-content { margin:78px 0 0 27px; position:absolute; float:left;}
.menuli {text-transform: uppercase; }
.menuli li a { color:#616065; text-decoration:none; font-size:9pt;}
.menuli li a:hover { color:#ec3629; text-decoration:none;}
.footer {
    width: 946px; height:0px;
	/* background: url(../img/footer-koffieboer.png) -85px 0px; */
}
.footer-line {
    width: 946px;
	text-align:left;
}
.line {
	background:#4d4d4d; height:41px; width:889px;
	margin:0 0 20px 22px;
	/*position:absolute;*/
	/*float:left;*/
	text-align: left;
	color:#666666;
	line-height:28pt;
}

.line a {
	line-height:28pt;
	color:#999999;
	margin: 0 10px 0 10px;
	text-decoration:none;
}

.header {height:228px;}
.cat-menu {width:180px; position:absolute; z-index:3; margin: 4px 0 0 730px;}
.btn {width: 180px;height:37px;display:inline-block;background-image: url(../img/btn-categorie-2.png);
}
.btn.onderwijs {background-position: 0 0px;}
.btn.zorg-welzijn {background-position: 0 -37px;}
.btn.bedrijven {background-position: 0 -74px;}
.btn.sportclub-vrijetijd {background-position: 0 -111px;}
.btn.overig {background-position: 0 -148px;}
.btn.horeca {background-position: 0 -185px;}
.btn.onderwijs:hover {background-position: -180px 0px;}
.btn.zorg-welzijn:hover {background-position: -180px -37px;}
.btn.bedrijven:hover {background-position: -180px -74px;}
.btn.sportclub-vrijetijd:hover {background-position: -180px -111px;}
.btn.overig:hover {background-position: -180px -148px;}
.btn.horeca:hover {background-position: -180px -185px;}
.container.onderwijs .btn.onderwijs {background-position: -360px 0px;}
.container.zorg-welzijn .btn.zorg-welzijn {background-position: -360px -37px;}
.container.bedrijven .btn.bedrijven {background-position: -360px -74px;}
.container.vrijetijd .btn.sportclub-vrijetijd {background-position: -360px -111px;}
.container.overig .btn.overig {background-position: -360px -148px;}
.container.horeca .btn.horeca {background-position: -360px -185px;}

.image { position:absolute; z-index:1; margin: 0 0 0 414px; height:226px; width:412px; overflow: hidden;}
.text { position:absolute; z-index:1; margin: 0 0 0 210px; background:#808080; height:226px; width:206px;}
.text h1 {margin: 26px 0 0px 20px; color:#fff; font-size:9pt;}
.text h1 a{color:#ffffff; text-decoration:none;}
.text p {margin: 0 20px 0 20px; color:#fff; line-height:18px;}
.button-webshop {background:#e62526; width:188px; height:113px; position:absolute;  margin: 0 0 0 22px;}
.button-contact {background:#e62526; width:188px; height:113px; position:absolute;  margin: 113px 0 0 22px;}


.content {margin: 14px 0 0px 22px;}
/*nieuws */
.nieuws {width:188px; float:left;  margin: 0 0 18px 0px;}
.nieuws-header {background:#fe0000; height:37px;}
.container.onderwijs .content-header ,.container.onderwijs .modellen-header,.container.onderwijs .nieuws-header,.container.onderwijs .button-webshop{background-color: #006837;}
.container.zorg-welzijn .content-header ,.container.zorg-welzijn .modellen-header,.container.zorg-welzijn .nieuws-header,.container.zorg-welzijn .button-webshop {background-color: #00a99e;}
.container.bedrijven .content-header ,.container.bedrijven .modellen-header,.container.bedrijven .nieuws-header,.container.bedrijven .button-webshop {background-color: #ed1e79;}
.container.vrijetijd  .content-header ,.container.vrijetijd .modellen-header,.container.vrijetijd .nieuws-header,.container.vrijetijd .button-webshop {background-color: #603814;}
.container.overig .content-header ,.container.overig .modellen-header,.container.overig .nieuws-header,.container.overig .button-webshop {background-color: #8cc63e;}
.container.horeca .content-header ,.container.horeca .modellen-header,.container.horeca .nieuws-header,.container.horeca .button-webshop  {background-color: #fe7e00;}
.nieuws-item { /*height:52px;*/ margin-bottom:0px;}
.nieuws-item-foto {width:70px; float:left; margin-right:10px; }
.nieuws-item-text {width:105px; float:left; font-size:7pt; }
.nieuws-item-text p {margin:0; padding:0;}
.nieuws-item-text p a{text-decoration:none; color:#333333;}
.nieuws-item-text p a:hover{text-decoration:none; color:#999999;}
.nieuws-item-title-only {margin-top: 10px; width:175px; float:left; font-size:7pt;}
.nieuws-item-title-only p.title {margin:0; padding:0;}
.nieuws-item-title-only p.title a{text-decoration:none; font-weight: bold; color:#333333; margin: 0; padding: 0px;}
.nieuws-item-title-only p.title a:hover{text-decoration:none; color:#999999;}
.nieuws-item-title-only p.date {margin:0; padding:0; text-decoration:none; font-style: italic; color:#333333; margin: 0; padding: 0px;}
.nieuws-header h2 {text-align:center; position:absolute;width:188px; z-index:3; color:#ffffff; line-height:23px; text-transform: uppercase; font-size:10pt;}
.nieuws-header-bg {background: url(../img/arrow-white.png); width:188px; height:9px; position:absolute; float:left; margin: 28px 0 10px 0; z-index:1; font-size:1px; line-height:1px; }

.content-content { width:478px; float:left; margin: 0 0 18px 18px;}
.content-content-wide{ width:682px; float:left; margin: 0 0 18px 18px;}
.content-content-super-wide{ width:922px; float:left; }
.content-text {margin: 10px; line-height:16px;}

.prod_spec{float:left;margin:0 0 10px 50px;}
.prod_spec h3{float:left;margin-bottom:10px;}
.prod_spec ul{float:left;list-style:none;margin-left:7px;}
.prod_spec img{border:1px solid #999999;}

.content-text p {text-align:justify;}
.content-text-wide {line-height:16px; margin-top: 20px;}
.content-text-wide p {/*text-align:justify;*/}
.content-header {background:#fe0000; height:28px;}
.content-header h2 {text-align:center; position:absolute;width:478px; z-index:3; color:#ffffff; line-height:23px; text-transform: uppercase; font-size:10pt;}
.content-header-wide {background:#fe0000; height:28px;}
.content-header-wide h2 {text-align:center; position:absolute;width:682px; z-index:3; color:#ffffff; line-height:23px; text-transform: uppercase; font-size:10pt;}
.content-header-wide h2.header-titleOne {text-align:left; position:absolute;width:299px; z-index:3; color:#ffffff; line-height:25px; text-transform: uppercase; font-size:10pt; margin-left:10px;}
.content-header-wide h2.header-titleTwo {text-align:left; position:absolute;width:299px; z-index:3; color:#ffffff; line-height:25px; text-transform: uppercase; font-size:10pt; margin-left:280px;}

.content-super-header-wide {background:#fe0000; height:28px;}
.content-super-header-wide h2 {text-align:center; position:absolute;width:922px; z-index:3; color:#ffffff; line-height:23px; text-transform: uppercase; font-size:10pt;}
.content-super-header-wide h2.header-super-titleOne {text-align:center; position:absolute;width:250px; z-index:3; color:#ffffff; line-height:25px; text-transform: uppercase; font-size:10pt; margin-left:10px;}
.content-super-header-wide h2.header-super-titleTwo {text-align:center; position:absolute;width:450px; z-index:3; color:#ffffff; line-height:25px; text-transform: uppercase; font-size:10pt; margin-left:280px;}

.modellen {width:186px; float:left; margin: 0 0 18px 18px;}
.modellen-header {background:#fe0000; height:37px;}

.nieuws-item-foto {width:70px; float:left; margin-right:10px; }
.nieuws-item-text {width:105px; float:left; font-size:7pt; }
.nieuws-item-text p {margin:0; padding:0;}
.nieuws-item-text p a{text-decoration:none; color:#333333;}
.nieuws-item-text p a:hover{text-decoration:none; color:#999999;}
div.model-container{width: 295px; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 5px;}
div.model-container.left{float: left;}
div.model-container.right{float: right;}
div.model-image {width: 260px; float: left; margin-top:0px; margin-bottom:20px;}
div.model-image-thumb {width: 120px; float: left; margin-top:0px; margin-bottom:20px;}
div.model-image img{border: 1px solid #dcdcdc;}
div.model-shortinfo{width: 175px; float: right; margin-top:0px;}
div.model-name{width: 100%; height: 28px; background-color: #dddddd;}
div.model-name a{width: 175px; height: 28px; background-color: #dddddd; display: block; line-height: 28px; text-align: center; font-family: arial; font-size: 8pt; font-weight: bold; text-decoration: none; color: #a2a2a2;}
div.model-shorttext{width: 175px; height: 92px; overflow: hidden;}
div.model-shorttext a{color: #505050; font-size: 7pt; font-weight: bold; text-decoration: none;}
div.model-shorttext p{color: #808080; font-size: 7pt; margin: 0; padding: 10px;}
div.model-text {width: 275px; float: right; /*background-color: #dddddd;*/}
div.model-text-wide {width: 329px; float: right; /*background-color: #dddddd */;}
div.model-text-super-wide {width: 329px; float: left; margin-left:110px;}
div.model-text-margin {margin: 10px; margin-top:0px;line-height:16px;}
div.model-text-super-margin {margin: 10px; margin-top:0px;line-height:16px;}
div.model-text-margin ul {line-height:16px;margin-left:20px; }

div.model-product img{float:left; border:0px;}
div.model-product-titel { float:left; width:200px;}
div.model-product-titel p {padding-left:10px; padding-top:0px; margin-top:7px; }
div.model-product-titel p span {font-size:7pt; }
div.model-productlist-titel {font-weight:bold; margin:10px;}
div.model-contact {float:left; margin-left:20px; margin-top:20px;}
div.model-table { float:left; }
div.categorie-container {width: 395px; margin-top: 10px;}
div.categorie-item-listed1{width: 120px; float: left; margin-right: 15px;}
div.categorie-item-listed2{width: 120px; float: left; margin-right: 1px;}
div.categorie-item-listed-image{width: 120px; height: 115px; overflow: hidden; background-color: #cecece;}
div.categorie-item-listed-image img{border: none;}
div.categorie-item-listed-name{width: 120px; height: 28px; background-color: #808080;}
div.categorie-item-listed-name a{width: 120px; height: 28px; background-color: #808080; display: block; line-height: 28px; text-align: center; font-family: arial; font-size: 8pt; font-weight: bold; text-decoration: none; color: #a2a2a2;}
a.categorie-item-link{background: #e8e8e8; width: 186px; height: 35px; border: solid 1px #dcdcdc; margin-top: 10px; display: block; line-height: 35px; text-align: center; font-family: arial; font-size: 8pt; text-decoration: none; color: #9a9a9a;}
.modellen-header h2 {text-align:center; position:absolute;width:186px; z-index:3; color:#ffffff; line-height:23px; text-transform: uppercase; font-size:10pt;}
.modellen-header-bg {background-image: url(../img/arrow-white.png); width:186px; height:9px; position:absolute; float:left; margin: 28px 0 0 0; z-index:1; font-size:1px; line-height:1px;}
.modellen-content { background: #f2f2f2; }
.modellen-content p{padding:10px; margin:0px;text-align:center;}
.modellen-content a img { border: 1px solid #e7e7e7;}
.modellen-content a:hover img { border: 1px solid #cccccc;}
.grayText {color:#ccb3b3;}
.image-th-cat { margin-right:20px;}
.imga-th-cat img {border:1px solid #DCDCDC;}
.btn-home {width:36px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat 0 -16px; margin-right:3px;}
.btn-overons {width:56px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -39px -16px; margin-right:3px;}
.btn-duurzaamheid{width:93px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -98px -16px; margin-right:3px;}
.btn-automaten{width:71px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -192px -16px; margin-right:3px;}
.btn-koffie{width:121px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -268px -16px; margin-right:3px;}
.btn-onderhoud{width:72px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -393px -16px; margin-right:3px;}
.btn-proeven{width:54px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -467px -16px; margin-right:3px;}
.btn-home:hover {width:36px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat 0 0px;}
.btn-overons:hover{width:56px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -39px 0px;}
.btn-duurzaamheid:hover{width:93px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -98px 0px;}
.btn-automaten:hover{width:71px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -192px 0px;}
.btn-koffie:hover{width:121px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -268px 0px;}
.btn-onderhoud:hover{width:72px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -393px 0px;}
.btn-proeven:hover{width:54px;height:16px; display:inline-block; background: url(../img/btnTop.gif) no-repeat -467px 0px;}

/* example */
.example {
	width: 186px;
	height:600px;
}

.example .show {
	height: 600px;
	overflow: hidden;
}

.example .roundabout-holder {
	list-style: none;
	height: 600px;

}

.example .roundabout-moveable-item {
	cursor: pointer;
	width: 120px;
	height: 115px;
	background-color: #fff;
	text-align: center;
	line-height: 2.6em;
	font-size: 24px;
}

.example .roundabout-in-focus {
	cursor: auto;
}

.example .caption {
	font-size: 0.75em; 
	color: #555; 
	text-align: center;
	margin-left: 1em;
	padding-top: 1em;
}

.example .caption .footnote {
	font-size: 0.8em; 
	color: #888;
}

div.formmessage{
	width: 599px;
}

div.formmessage p{
	padding: 2px;
	font-weight: bold;
}

div.formmessage.ok p{
	color: #8cc63e;
}

div.formmessage.error p{
	color: #fe0000;
}

ul.socialNetworks li{float: left; margin: 2px; list-style: none;}
a.rss{display: inline-block; width: 20px; height: 20px; background: url(../img/rss.png);}
a.twitter{display: inline-block; width: 20px; height: 20px; background: url(../img/twitter.png);}
a.delicious{display: inline-block; width: 20px; height: 20px; background: url(../img/delicious.png);}
a.google{display: inline-block; width: 20px; height: 20px; background: url(../img/google.png);}
a.linkedin{display: inline-block; width: 20px; height: 20px; background: url(../img/linkedin.png);}

.menu-content li { float:left; list-style:none; margin-right:10px;}

.contactBtn {position:absolute; float:left; margin: -4px 0 0 679px;}


.footerCol1 {float:left; width:150px; color:#808080; line-height:18px; margin-left:40px;}
.footerCol1 a {color:#808080; text-decoration:none;}

.footerCol2 {float:left; width:170px; color:#808080; line-height:18px;}
.footerCol2 a {color:#808080; text-decoration:none;}

.footerCol3 {float:left; width:180px; color:#808080; line-height:18px;}
.footerCol3 a {color:#808080; text-decoration:none;}

.footerCol4 {float:left; width:150px; color:#808080; line-height:18px;}
.footerCol4 a {color:#808080; text-decoration:none;}

.footerCol1 ul {list-style:none;}
.footerCol2 ul {list-style:none;}
.footerCol3 ul {list-style:none;}
.footerCol4 ul {list-style:none;}

.footerCol2 ul li ul{margin-left:0px;}
.footerCol3 ul li ul{margin-left:0px;}

h4 {font-weight: normal; font-size:11pt; margin-bottom:10px;}

.btnNescafe {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) 0 -48px;}
.btnNescafe:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) 0 -0px;}

.btnEko {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -60px -48px;}
.btnEko:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -60px -0px;}

.btnNestea{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -120px -48px;}
.btnNestea:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -120px -0px;}

.btnDilmah{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -180px -48px;}
.btnDilmah:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -180px -0px;}

.btnFairTrade{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -240px -48px;}
.btnFairTrade:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -240px -0px;}

.btnCupASoup{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -300px -48px;}
.btnCupASoup:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -300px -0px;}

.btnIlly{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -360px -48px;}
.btnIlly:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -360px -0px;}

.btnCafeja{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -420px -48px;}
.btnCafeja:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -420px -0px;}

.btnJura{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -480px -48px;}
.btnJura:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -480px -0px;}

.btnAnimo{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -540px -48px;}
.btnAnimo:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -540px -0px;}

.btnHoppe{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -600px -48px;}
.btnHoppe:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -600px -0px;}

.btnWalkure{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -660px -48px;}
.btnWalkure:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -660px -0px;}

.btnWMF{display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -720px -48px;}
.btnWMF:hover {display:inline-block;width:60px; height:48px; background: url(../img/logos-bedrijven.png) -720px -0px;}

.footerLogos {height:50px; margin-top:10px; padding-bottom:10px;}
.footerLogos ul {list-style:none; margin-left:30px;}
.footerLogos ul li{float:left; margin-right:10px;}

.selecter{background-color:#E62526;color:white; margin-right:35px;}

.h2Select {padding:15px 0 10px 10px;text-align:center;} 
.bgSelect {background-color:#E62526;color:white; margin-right:35px;height:150px;} 
.itemSelect img {margin-top:5px; margin-bottom:5px;}
.btnBack {position:absolute; float:left; z-index:100;}
.pdfButton{width: 161px; height: 45px;}
.pdfButton:hover{background-color: #fe0000;}
.pdfDownload{display: inline-block; width: 33px; height: 40px; background-image: url(../img/pdf.png);}
.pdfButton a{line-height: 45px; float: left; font-weight: bold; margin: 2px; color: #5f6062; text-decoration: none;}
.pdfButton:hover a{color: #ffffff;}
.pdfButtonText{text-align: right;}
input.imgtxt{width: 282px;}
.itemSelect {border:1px #DCDCDC solid; width:164px; height:214px; float:left; text-align:center; background-color:#f2f2f2; margin:0 0 10px 10px;}