/* -------------------------------------------------------------------

	Boondoggle - Hans Dreesen
	Tiense Suiker
	
	1. Structure
	2. Header
	3. Navigation
	4. Column01
	5. VebicPage01
	6. Column02
	7. Column03
	8. Footer
	9. Miscellaneous
	10. Page Industrie Chocolaterie
	11. Page Candico Fairtrade (innovations)
	
	always include reset.css, it will reset your style
	for all browers, it includes the clearfix
	
	typography specs must be specified in typography.css
	form specs must be specified in forms.css
	
	ID en class naming => use capitals for seperation: navHome

------------------------------------------------------------------- */



/* ----- imports -------------------------------------------------- */

@import url(typography.css);
@import url(forms.css);



/* -------------------------------------------------------------------------------------  1. Structure -------------------------------------------- */

body		{  height: 100%; }
#wrapper	{background: url(/img/industry/css_backgrounds/bg-gradient.gif) center top repeat-y; margin:0 auto; width:763px}
#container	{ margin: 0 auto; width: 735px;}

#header		{
	background: url(/img/industry/css_backgrounds/bg-header.jpg) left top no-repeat;
	height: 211px;
	position: relative;
}
#navigation	{ margin: 0; }
#content	{  }
#column01	{ float: left; padding: 30px 0 0 45px; width: 495px;}
#column02	{ float: right; padding: 31px 8px 0 0; width: 160px;}
#column03	{  }
#footer		{ background:url(/img/industry/css_backgrounds/bg-footer.gif) no-repeat left bottom; clear: left; height: 48px; margin:0 auto; padding: 30px 0 17px 0; width:763px;}



.left	{ float: left; }
.right	{ float: right; }
.clear	{ clear: both; }
.hide	{ display: none; }
.first	{ margin-top: 0; padding-top: 0; }
.last	{ margin-bottom: 0; padding-bottom: 0; }
p img.left	{ float: left; margin: 0 10px 10px 0; }
p img.right	{ float: right; margin: 0 0 10px 10px; }

hr {display:none;}

/* flash alternative styles */
.block	   { background: #efefef; margin: 25px 0; padding: 25px; border:4px solid #dfdfdf; clear:both; }
ul#alternativeNav {list-style:none; padding:10px 0 10px 5px; margin:0 0 20px 0; border-bottom:2px solid #333; border-top:2px solid #333}
ul#alternativeNav li {float:left; margin:0 10px 0 0;}


/* -------------------------------------------------------------------------------------  2. Header ----------------------------------------------- */

/* skip links */
#skipLinks { left: 0; margin: 0; position: absolute; top: 0; width: auto; }
#skipLinks a { background: #efaa00; display: block; left: 10px; padding: 4px; position: absolute; top: -9999px; width: 100px; }
#skipLinks a:focus,
#skipLinks a:hover,
#skipLinks a:active { top: 10px; }

/* language choice links */
#languageChoice { background: url(/img/industry/css_backgrounds/bg-language-choice.png) no-repeat; float: right; height: 29px; list-style: none; margin: 0 30px 0 0; padding: 6px 0 0 13px; width: 86px; }
#languageChoice li { float: left; }
#languageChoice a { background: url(/img/industry/css_backgrounds/bg-sprite-language-choice.gif) no-repeat; height: 10px; }
#languageChoice #nl			{ background-position: 0		0; width: 17px; }
#languageChoice #fr			{ background-position: -20px	0; margin: 0 6px 0 3px; width: 14px; }
#languageChoice #uk			{ background-position: -40px	0; width: 20px; }
#languageChoice #nl:hover,
#languageChoice #nl.active	{ background-position: 0		-15px; }
#languageChoice #fr:hover,
#languageChoice #fr.active	{ background-position: -20px	-15px; }
#languageChoice #uk:hover,
#languageChoice #uk.active	{ background-position: -40px	-15px; }

/* logo */
#logo { background: url(/img/industry/css_backgrounds/bg-logo.gif) 0px 25px no-repeat; height: 117px; padding-top: 25px; margin: 0; width: 318px; }
#logo br { display: none; }



/* -------------------------------------------------------------------------------------  3. Navigation ------------------------------------------- */

#navigation { bottom: 2px; left: 20px; list-style: none; position: absolute;}
#navigation li { float: left; position: relative; }
#navigation a {
	background: url(/img/industry/css_backgrounds/bg-sprite-navigation.png) no-repeat;
	display: block;
	float: left;
	height: 41px;
	margin-right: 5px;
	outline: none;
	text-indent: -9999px;
}

#navigation #home			{ background-position:	0px		0px; width: 76px; }
#navigation #products		{ background-position:	-80px	0px; width: 114px; }
#navigation #newProducts	{ background-position:	-200px	0px; width: 189px; }
#navigation #links			{ background-position:	-390px	0px; width: 141px; }
#navigation #sweetSolutions { background-position:	-530px	0px; width: 141px; }


#navigation #home:hover,
#navigation #home.active		{ background-position:	0px		-50px; }
#navigation #products:hover,
#navigation #products.active	{ background-position:	-80px	-50px; }
#navigation #newProducts:hover,
#navigation #newProducts.active	{ background-position:	-200px	-50px; }
#navigation #links:hover,
#navigation #links.active		{ background-position:	-390px	-50px; }
#navigation #sweetSolutions:hover,
#navigation #sweetSolutions.active		{ background-position:	-530px	-50px; }

#navigation li:hover ul { display: block; }
#navigation li:hover #products { background-position: -80px -50px; }


/* sub navigation products */
#navigation ul {
	background: url(/img/industry/css_backgrounds/bg-subnav-top.png) no-repeat;
	display: none;
	list-style: none;
	margin: 38px 0 0 0;
	padding-top: 15px;
	position: absolute;
	width: 180px;
	z-index: 100;
}
#navigation ul li { float: none; }
#navigation ul li:last-child { background: url(/img/industry/css_backgrounds/bg-subnav-bottom.png) left bottom no-repeat; padding-bottom: 15px; }
#navigation ul a {
	background: url(/img/industry/css_backgrounds/bg-sprite-subnavigation.png) no-repeat;
	float: none;
	height: 23px;
	margin: 0;
	position: relative;
	width: 180;
}
#navigation ul #DrySugar			{ background-position:	0px		0px; }
#navigation ul #Fondant				{ background-position:	0px		-23px; }
#navigation ul #LiquidSugar			{ background-position:	0px		-46px; }
#navigation ul #PasteSugar			{ background-position:	0px		-69px; }
#navigation ul #CoatedSugar			{ background-position:	0px		-92px; }
#navigation ul #Nibs				{ background-position:	0px		-115px; }
#navigation ul #BrownCandySugar		{ background-position:	0px		-138px; }
#navigation ul #Caramels			{ background-position:	0px		-161px; }
#navigation ul #Molasses			{ background-position:	0px		-184px; }
#navigation ul #Beefeed				{ background-position:	0px		-207px; }
#navigation ul #OutofquotaSugar		{ background-position:	0px		-230px; }
#navigation ul #OrganicFairTrade	{ background-position:	0px		-253px; }

#navigation ul #DrySugar:hover			{ background-position:	-180px		0px; }
#navigation ul #Fondant:hover			{ background-position:	-180px		-23px; }
#navigation ul #LiquidSugar:hover		{ background-position:	-180px		-46px; }
#navigation ul #PasteSugar:hover		{ background-position:	-180px		-69px; }
#navigation ul #CoatedSugar:hover		{ background-position:	-180px		-92px; }
#navigation ul #Nibs:hover				{ background-position:	-180px		-115px; }
#navigation ul #BrownCandySugar:hover	{ background-position:	-180px		-138px; }
#navigation ul #Caramels:hover			{ background-position:	-180px		-161px; }
#navigation ul #Molasses:hover			{ background-position:	-180px		-184px; }
#navigation ul #Beefeed:hover			{ background-position:	-180px		-207px; }
#navigation ul #OutofquotaSugar:hover	{ background-position:	-180px		-230px; }
#navigation ul #OrganicFairTrade:hover	{ background-position:	-180px		-253px; }

/* new products submenu */

#navigation #newproducts a {
	background: url(/img/industry/css_backgrounds/bg-sprite-subnavigation-new.png) no-repeat;
	float: none;
	height: 23px;
	margin: 0;
	position: relative;
	width: 180;
}

#navigation li:hover #newProducts {
	background-position:-200px	-50px;
}

#newproducts a#Innovations	{ background-position:	0px		0px; 	}
#newproducts a#Productslebbe	{ background-position:	0px		-23px; 	}
#newproducts a#Servicebenelux	{ background-position:	0px		-46px; 	}

#newproducts #Innovations:hover		{ background-position:	-180px	0px; 	}
#newproducts #Productslebbe:hover	{ background-position:	-180px	-23px; 	}
#newproducts #Servicebenelux:hover	{ background-position:	-180px	-46px; 	}

/* -------------------------------------------------------------------------------------  4. Column01 --------------------------------------------- */

#column01 h2 { margin-top: 0.5em; }

#map { background: url(/img/industry/css_backgrounds/bg-map.jpg) no-repeat; height: 342px; margin:0 0 0 -35px; }
#mapInner {position:relative;}

#map .branch	{ position: absolute; width: 266px; }
#tienseSuiker	{ left: 77px; top: 170px; }
#lebbe			{ left: 0; top: 131px; }
#rafti			{ left: 210px; top: 91px; }

#map h3 { cursor:pointer; height: 44px; margin: 0; }

.roundedBox { margin-bottom: 5px; }
.roundedBoxContent { background: url(/img/industry/css_backgrounds/bg-rounded-box.gif) no-repeat left bottom; padding: 0 15px 15px; } 
#column01 .roundedBox h2 { background: url(/img/industry/css_backgrounds/bg-rounded-box.gif) no-repeat left top; margin: 0; padding: 15px 15px 0; }
.roundedBox h4 { color: #454545; font-size: 1em; font-weight: bold; }
.roundedBox .last { margin-bottom: 0; } 
.roundedBox h3.candico { background: url(/img/industry/general/logo-candico.gif) no-repeat left top; line-height: 18px; }
.roundedBox h3.rafti { background: url(/img/industry/general/ttl-rafti.gif) no-repeat left top; line-height: 18px; }
.roundedBox h3.lebbe { background: url(/img/industry/general/ttl-lebbe.gif) no-repeat left top; line-height: 18px; }

.contactDetails { color: #000; font-size: 0.9em; margin: -9px 0 0 30px; }
#tienseSuiker .contactDetails { margin: -9px 0 0 30px; }
#lebbe .contactDetails { margin: -6px 0 0 30px; }
#rafti .contactDetails { margin: -7px 0 0 30px; }
.contactDetails p { background: url(/img/industry/css_backgrounds/bg-contact-details.png) left bottom no-repeat; margin: 0; padding: 0 7px 0 9px; }
.contactDetails p.intro {
	background: url(/img/industry/css_backgrounds/bg-contact-details.png) left top no-repeat;
	color: #636363;
	padding-bottom: 7px;
	padding-top: 12px;
}
.contactDetails h4 { display: none; }

.contactDetails .routeDescription {
	background: url(/img/industry/css_backgrounds/bg-route-description-bottom.png) left bottom no-repeat;
	color: #004b96;
	padding-bottom: 10px;
}
.contactDetails .routeDescription h4 {
	background: url(/img/industry/css_backgrounds/divider-contact-details.png) no-repeat;
	color: #004b96;
	display: block;
	font-size: 1.1em;
	font-weight: bold;
	margin: 0;
	padding: 24px 7px 3px 9px;
}
.contactDetails .routeDescription label { color: #636363; display: block; margin-bottom: 5px; }
.contactDetails .routeDescription .txtField { border: 1px solid #4c81b5; }
.contactDetails .routeDescription button {
	background: #FFF url(/img/industry/buttons/btn-form-arrow.gif) no-repeat;
	cursor: pointer;
	border: none;
	height: 17px;
	padding: 0;
	text-indent: -9999px;
	width: 26px;
}

/* unsubscribe */
input#txtEmailUnsubscribe {border:1px solid #d6d6d6; margin:0 0 0 8px; width:250px;}

/* -------------------------------------------------------------------------------------  5. vebicPage01 ----------------------------------------------- */
#column01VebicPage {
padding:25px 190px 0 85px;
}
#column01VebicPage li.spaced {
margin-bottom:5px;
}
#recept01{
padding:5px 0 10px 150px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
height: 133px;
}
#pageVebic #recept01 { background: url(/img/industry/css_backgrounds/recept-zachte-vulling-paas.jpg) no-repeat; }
ul.recept01 {
margin-top: -12px; 
margin-bottom: 15px;
list-style-image: url(/img/industry/general/arrow-blue.gif);
line-height:1.4em; 
/*margin: 0 1.5em 1.5em 1.5em; */
}
#footerVebic{
background: url(/img/industry/css_backgrounds/bg-footer-vebic.gif) no-repeat;
height:12px;
margin-left: 85px;
padding-bottom:20px;
}
ul.werkwijze {
list-style-image:url(/img/industry/general/circle-blue.gif); 
 }
#column02VebicPage{
padding:0 190px 20px 85px;
}
#column02VebicPage li.spaced {
margin-bottom:5px;
}
#recept02{
padding:5px 0 0 150px;
height: 175px;
}
#pageVebic #recept02 { background: url(/img/industry/css_backgrounds/recept-zwarte-woud-taart.jpg) no-repeat; }
ul.recept02 {
margin-top: -12px; 
margin-bottom: 15px;
list-style-image: url(/img/industry/general/arrow-blue.gif);
line-height:1.5em; 
}
#recept02Left, .receptLeft{
float:left;
width:50%;
padding-top:10px;
padding-bottom:15px;
}
#recept02Right, .receptRight{
float:right;
width:50%;
padding-top:10px;
}
ul.receptO2{
list-style-image: url(/img/industry/general/arrow-white.gif);
}




/* -------------------------------------------------------------------------------------  5. vebicPage02 ----------------------------------------------- */

#pageVebic2 #recept01 { background: url(/img/industry/css_backgrounds/bg-recept-fondant-aardbeien.jpg) no-repeat; height: 171px; }
#pageVebic2 #recept02 { background: url(/img/industry/css_backgrounds/bg-recept-assortiment-mini-bavarois.jpg) no-repeat; height: 171px; }
#pageVebic2 h1 { margin-bottom: 0; }
#pageVebic2 a { font-weight: bold; }
#pageVebic2 .subRecipes { margin-bottom: 2em; }
#pageVebic2 .subRecipes p, #pageVebic2 .subRecipes ul { margin-bottom: 0.7em; }
#pageVebic2 .receptLeft, #pageVebic2 .receptRight { padding-bottom: 0; width: 49%; }
#pageVebic2 .receptLeft { clear: left; }



/* -------------------------------------------------------------------------------------  6. Column02 --------------------------------------------- */

#column02 { font-size: 0.95em; }
#column02 h2 { color: #30b214; font-size: 1.7em; }

#loginBox { margin-bottom: 40px; }
#loginBox label { display: block; margin-bottom: 2px; }
#loginBox p,
#loginBox input { margin-bottom: 8px; }
#loginBox input:last-child { margin-bottom: 0; }
#loginBox p:last-child,
#loginBox a { color: #898989; }

.newsItem { margin-bottom: 3em;}


/* -------------------------------------------------------------------------------------  7. Column03 --------------------------------------------- */

/* item description */
#column03 #itemName {  }



/* -------------------------------------------------------------------------------------  8. Footer ----------------------------------------------- */

#footer {color: #454545; }
#footer p { padding-left: 70px; } 
#footer a { color: #454545; } 


/* -------------------------------------------------------------------------------------  9. Miscellaneous ---------------------------------------- */

/* clearfix */
.clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }

/* image replace class */
.imgReplaced { display: block; outline: none; text-indent: -9999px; }

/* ul with blue arrow (standard = green arrow)*/
ul.blue	{ list-style-image: url(/img/industry/general/arrow-blue.gif); }
/* blue textcolour */
h2.blue, strong.blue, span.blue { color:#003399; }

/* button more news */
.moreNews { background: url(/img/industry/buttons/en/btn-more-news.gif) no-repeat; height: 28px; width: 88px; }

/* Rafti choice page */
#raftiChoicePage { background: none; }
#raftiChoicePage #header,
#raftiChoicePage h1 { display: none; }
#raftiChoicePage #column01 { padding: 90px 0 0 0; width: 100%; }
#raftiChoicePage #column01 ul { list-style: none; margin: 0; }
#raftiChoicePage #column01 a { float: left; height: 319px; width: 347px; }
#raftiChoicePage #raftiLiquidSugars { background: url(/img/industry/buttons/en/btn-rafti-liquid-sugars.jpg) no-repeat; margin-right: 65px; }
#raftiChoicePage #beneo { background: #CCC url(/img/industry/buttons/btn-beneo.jpg) no-repeat; }
#raftiChoicePage #footer { padding-top: 75px; }


/* BioFach */
#bioFachForm {padding:15px 0 100px 0}
#bioFachForm label {clear:both; float:left; width:110px;}
#bioFachForm input {border:1px solid #d6d6d6; float:left; margin:0 0 4px 0; width:250px;}
#bioFachForm label.dateSelect {font-weight:bold; margin:25px 0 0 0; width:250px; }
#bioFachForm select {border:1px solid #d6d6d6; float:left; font-size:11px; margin:8px 0; width:250px; }
#bioFachForm span {display:block; float:left; padding:0 0 0 3px; width:15px;}
#bioFachForm .formImgBtn {clear:both; margin:5px 0 0 0; width:auto;}

#valSummary ul {list-style-image:none!important;}

/* -------------------------------------------------------------------------------------  10. Industrie Chocolaterie --------------------------------- */
#column01chocolaterie {
padding:25px 190px 0 85px;
}

#korrel{
background: url(/img/industry/css_backgrounds/korrel-gezeefd-k1-k2.jpg) no-repeat; padding: 0 0 9px 9px; height: 360px;}

#korrel-FR{
background: url(/img/industry/css_backgrounds/fr/korrel-gezeefd-k1-k2_FR.jpg) no-repeat; padding: 0 0 9px 9px; height: 360px;}

#korrel .blue, #korrel-FR .blue { color:#003399 }

#korrel #k1, #korrel-FR #k1 { float:left; width:190px; padding-top: 80px }
#korrel #k2, #korrel-FR #k2 { float:left; width:225px; padding-left: 29px; padding-top: 80px }

#controles{
background: url(/img/industry/css_backgrounds/bg-controles.gif) no-repeat; padding:14px 0 0 18px ; height: 165px; }

#controles-FR{
background: url(/img/industry/css_backgrounds/fr/bg-controles_FR.gif) no-repeat; padding:14px 0 0 18px ; height: 165px; }

.img-silopolis { float:left; margin-right: 15px }

.introBlue { color:#004b96; font-size:14px !important; }
.introNormal { font-size:14px !important; }
.introGreen { color:#62bb46; font-size:14px !important; }
.titleDarkBlue { color:#003399; font-size:13px !important; padding-bottom:25px;}

#choco{ display:inline-block; float:left; width:455px; font-size:11px !important;}
#choco table td{ border-bottom:none; padding:0px; margin:0px; vertical-align:top !important; padding:0px 5px 5px 0px; font-size:12px !important; }
#choco #c1 table td, #choco #c1FR table td{ border-bottom:none; padding:0px; margin:0px; vertical-align:top !important; padding:0px; font-size:12px !important; }
#choco #c1 table, #choco #c1FR table{ padding:0px 10px !important; margin:0px 10px !important; font-size:12px !important; }
#choco h3{ padding:5px 10px 10px 10px; margin:0px; color:#003399; font-size:13px !important;}

#c1{ background: url(/img/industry/css_backgrounds/bg-blauw.gif) no-repeat; background-position:bottom left; width:225px; background-color:#ddedfe;}
#c1FR{ background: url(/img/industry/css_backgrounds/bg-blauw.gif) no-repeat; background-position:bottom left; width:225px; background-color:#ddedfe;}

#c1 p, #c1FR p{ padding:0px 10px 0px 10px; margin:0px; font-size:12px !important; }
#c1 ul, #c1FR ul{ list-style-image:none; list-style-type:disc; padding-left:10px; font-size:12px !important;}
#c1 li, #c1FR li{ padding:0px; margin:0px; font-size:12px !important;}

/* -------------------------------------------------------------------------------------  11. Candico Fairtrade --------------------------------- */
.product {
	height: 69px;
	background: url(/img/industry/css_backgrounds/graph-boog.gif) no-repeat left top;
	margin-bottom: 10px;
	clear:both;
}
.product p {
	padding-top: 15px;
	padding-left: 40px;
	width:340px;
	display:inline-block;
	float:left;
}
.product img { float:right; }