/*

	CSS for Rodeka website
	
	-- produced by Minus3 BV, Amsterdam - http://www.minus3.nl/ 
	-- author: Maarten Raaijmakers	

	The stylesheet is divided into 3 parts:

   1. colors, backgrounds, borders, link and emphasis indication
   2. font and text properties, exclusive of link indication, alignment, text-indent
   3. box properties (exclusive of borders), positioning, alignments, list types, text-indent 
*/

/* CONTAINERS */

body { 
	color: #333;
	font-size: 75%;
	font-family: trebuchet MS, arial, verdana; 
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	background-repeat: repeat-x;
	background-color: #eac38c;
}

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

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#backgroundElement {
	position: fixed;
	z-index : 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#contentContainer {
	z-index: 2;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	position: absolute;
}

#contentColumn {
	background-color: #fff;
	width: 760px;
	margin: 10px auto 0 auto;
	position: relative;
}

/* HEADER */

#header {
	background: #fff url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/header_bg.png) top left repeat-x;
	border-bottom: 1px solid #fff;
	height: 101px;
	margin: 0;
	padding: 0;
}

h1 {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/rodeka_logo.png) top left no-repeat;
	height: 101px;
	width: 116px;
	float: left;
	margin: 0;
	padding: 0;
}
h1 a {
	display: block;
	height: 101px;
	width: 116px;
	text-indent: -2000em;
}
a {
	color: #2f6e00;
}
#languageMenu {
	list-style-type: none;
	padding: 5px 5px 0 0;
	margin: 0;
}
#languageMenu li {
	font-size: 11px;
	float: right;
	margin-left: 10px;
}
#languageMenu li a, #adminMenu li a, #mainMenu ul li a  {
	color: #fff;
	text-decoration: none;
}
#languageMenu li a:hover, #adminMenu li a:hover, #mainMenu ul li a:hover  {
	text-decoration: underline;
}
#languageMenu li.active a, #adminMenu li.active a  {
	color: #000;
	text-decoration: none;
}

#adminMenu {
	list-style-type: none;
	padding: 55px 0 0 0;
	margin: 0;
}
#adminMenu li {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/header_ul_bg.png) center right no-repeat;
	font-size: 13px;
	float: right;
	padding: 0 8px;	
}
#adminMenu li.last {
	background: none;
}

/* MAIN MENU */

#mainMenu {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/mainmenu_bg.png) top left no-repeat;
	border-bottom: solid 2px #666;
	height: 28px;
	margin: 0;
	padding: 0;
}
#mainMenu ul {
	list-style-type: none;
	height: 28px;
	width: 745px;
	margin: 0;
	padding: 0;
}
#mainMenu ul li {
	font-size: 13px;
	float: left;
	padding: 0;
	margin: 0;
	height: 28px;
}
#mainMenu ul li a {
	padding: 5px 8px;	
	margin: 0;
	display: block;
}
#mainMenu ul li.last {
	margin-right: 0;
}
#mainMenu ul li.active a {
	background: #2f6e00 url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/mainmenu_ul_bg.png) 5px 13px no-repeat;
	padding: 5px 10px 5px 20px;
}

/*
	menu on top of flash animation
*/

#mainMenuOverFlash {
	height: 28px;
	margin: 0;
	padding: 0;
	z-index: 3;
	position: absolute;
	top: 103px;
	left: 10px;
}
#mainMenuOverFlash ul {
	list-style-type: none;
	height: 28px;
	width: 650px;
	margin: 0 auto;
	padding: 0;
}
#mainMenuOverFlash ul li {
	font-size: 13px;
	float: left;
	padding: 0;
	margin: 0;
	height: 28px;
}
#mainMenuOverFlash ul li a {
	padding: 5px 10px;	
	margin: 0;
	display: block;
	text-decoration: none;
	color: #000;
}
#mainMenuOverFlash ul li.last {
	margin-right: 0;
}

/* BRANDING BLOCK */

#branding {
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: top left;
	height: 125px;
}
#branding h2 {
	color: #fff;
	font-weight: normal;
	font-size: 24px;
	float: left;
	width: 300px;
	margin: 0;
	padding: 40px 0 0 20px;
}

/* BEGIN SIFR */

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash #branding h2 {
	visibility: hidden;
	letter-spacing: 0px;
	font-size: 24px;
}

/* END SIFR */

#branding p {
	color: #fff;
	font-size: 14px;
	float: right;
	width: 400px;
	margin-top: 45px;
}

/* CONTENT */

#content {
	margin: 0;
	line-height: 18px;
}
#content p {
	margin: 15px 0;
}
#content h3 {
	font-size: 13px;
	margin: 0;
}
#columnRight {
	float: right;
	width: 560px;
	margin: 0;
	padding: 0 10px 10px 10px;
}


#columnRight.noSubMenu {
	float: left;
	width: 725px;
}

#crumbpath {
	list-style-type: none;
	margin: 15px 0 50px 0;
	padding: 0;
}
.services#crumbpath, .sitemap#crumbpath {
	margin-left: 10px;
}

#crumbpath li {
	font-size: 10px;
	float: left;
}
#crumbpath li a {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/crumbpath_arrow.png) center right no-repeat;
	color: #333;
	padding-right: 6px;
	margin-right: 4px;
}
#columnRight p {
	clear: both;
}

#columnLeft {
	margin: 0;
	padding: 15px 0 0 10px;
}
#columnLeft h3 {
	color: #2f6e00;
	font-size: 13px;
	margin: 0;
	padding: 0 0 0 10px;
}
#columnLeft ul {
	list-style-type: none;
	width: 160px;
	margin: 10px 0;
	padding: 0;
}
#columnLeft ul ul {
	margin-top: 0;
	margin-bottom: 0;
	border-bottom: 1px solid #e5e5e5;
	background: #f8f8f8 url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/submenu_bg.png) 0 0 repeat-x;
}
#columnLeft ul li a {
	color: #000;
	border-bottom: 1px solid #e5e5e5;
	text-decoration: none;
	display: block;
	padding: 5px 0 5px 10px;
}
#columnLeft ul ul li a {
	border-bottom: 0;
	padding-left: 40px;
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/crumbpath_arrow.png) 30px 12px  no-repeat;
}

#columnLeft ul li a:hover {
	color: #2f6e00;
	font-weight: bold;
}
#columnLeft ul li a.active {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/sub_arrow.png) 10px 4px no-repeat;
	color: #2f6e00;
	font-weight: bold;
	padding-left: 35px;
}
#columnLeft ul ul li a.active {
	font-weight: normal;
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/crumbpath_arrow_active.png) 30px 12px  no-repeat;
	padding-left: 40px;
}

#contentBody {
	clear: both;
}

/* FOOTER */

#footer {
	border-top: 1px solid #e5e5e5;
	clear: both;
	padding: 5px 0 0 0;
	margin: 0;
}
#footer ul {
	list-style-type: none;
	clear: both;
	padding: 0;
}
#footerMainMenu {
	width: 670px;
	margin: 10px auto 0 auto;	
}
#footerAdminMenu {
	width: 610px;
	margin: 0 auto;	
}
#footer ul li {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/footer_ul_bg.png) center right no-repeat;
	float: left;
	padding: 0 10px;
}
#footer ul li.last {
	background: none;
}
#footer ul li a {
	color: #666;
	font-size: 11px;
	text-decoration: none;
}
#footer ul li a:hover {
	text-decoration: underline;
}
#footer ul li a.active {
	color: #2f6e00;
	font-weight: bold;
}

#bottom {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/footer_bg.png) top left no-repeat;
	width: 760px;
	margin: 0 auto;
	padding: 0 0 20px 0;
}

#credits {
	clear: both;
	text-align: right;
	margin-right: 10px;
}
#credits img {
	border: 0;
}

/* HOME */

#flash {
	height: 200px;
	width: 760px;
	z-index: 1;
}
.home {
	padding: 0 10px;
}
#newsColumns {
	border-top: 1px solid #e5e5e5;
	padding: 10px 0;
	margin: 0;
}
#newsColumns div {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/shade_bg.png) top right no-repeat;
	float: left;
	width: 365px;
	margin: 0;
	padding: 0;	
}
#newsColumns div.first {
	margin-right: 10px;
}
#newsColumns div h3 {
	font-size: 15px;
	font-weight: bold;
	margin: 0;
	padding: 0;
}
#content.home h2 {
	font-size: 18px;
	font-weight: normal;
	margin: 8px 0 0 0;
}
#content.home p {
	margin: 8px 0;
}

/* PRODUCT */

.product {
	float: left;
	margin-right: 8px;
}
.product a img {
	border: 1px solid #fff;
	cursor: default;
}
.product.cat a img {
	cursor: pointer;
}
.product a:hover img,
.product.active a img,
.product a img.hover {
	border: 1px solid #2f6e00;
}
.product a.popup img {
	cursor: url('/zoom.cur'), pointer;
}
.product .productDetail, .product .detail1foto, .product .detail2foto {
	display: none;
}

.product .productDetail {
	border: 1px solid red;
}

.specialOffer {
	padding-top: 15px;
	padding-left: 145px;
}

#faq {
	list-style-type: none;
	border-left: 1px solid #e5e5e5;
	padding: 0 0 0 10px;
	margin: 0 0 0 0;
	float: right;
	width: 100px;
}
#content p#intro {
	width: 420px;
	float: left;
	margin: 0 0 10px 0;
}


#samples {
	float: left;
	width: 370px;
	margin: 10px 0 0 0;
}

#moveLayer {
	position: absolute;
	top: 330px;
	left: 560px;
	width: 170px;
	margin: 0; padding: 0;
	z-index: 10;
}

#bigSample, #productHighlight {
	float: left;
	width: 170px;
	margin-left: 10px;
}

#bigSampleInfo {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/bg_description.png) top left no-repeat;
	padding: 10px 0;
	margin: 0;
}

#bigSampleInfo ul {
	margin: 0 0 0 25px;
	padding: 0;
	height: auto;
}

#bigSample img {
	border: 2px solid #2f6e00;
	margin: 15px 0 0 0;
	padding: 0;
}

#productHighlight {
	margin: 20px 10px 0 10px;
	padding: 0;
	position: relative;
	left: 0;
	height: 200px;
}

#productHighlight img {
	border: 1px solid green;
}


/* SERVICES */

.services {
	padding: 0 10px;
	margin-left: 10px;
}

/* NEWS & EVENTS */

#columnNews {
	float: left;
	width: 530px;
	margin: 0;
	padding: 0 10px;
}
#columnEvents {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/shade_bg.png) top right no-repeat;
	margin: 0 0 10px 0;
	padding: 15px 0 0 10px;
	width: 180px;
	float: left;
	border: 1px solid #e5e5e5;
}
#columnNews h4, #columnEvents h4 {
	margin-bottom: -10px;
}
hr {
	border-top: 1px solid #e5e5e5;
	border-bottom: 0;
	border-right: 0;
	border-left: 0;
}

/* FORM */

.select {
	font-family: "trebuchet ms";
	font-size: 11px;
}
.textbox {
	font-family: "trebuchet ms";
	font-size: 11px;
	width: 250px;
}
.input {
	font-family: "trebuchet ms";
	font-size: 11px;
	width: 250px;
}
.input2 {
	font-family: "trebuchet ms";
	font-size: 11px;
	width: 100px;
}
.button {
	font-family: "trebuchet ms";
	font-size: 12px;
	color: #FFFFFF;
	background-color: #2f6e00;
	margin-left: 150px;
}

.voegToe {
	margin: 1em 0;
}

label {
	float: left;
	width: 150px;
}
.label2 {
	display: block;
	float: none;
	width: auto;
}
.asterisk {
	font-style: normal;
	font-weight: bold;
	color: #2f6e00;
}
.productRow {
	padding: 5px;
	background-color: #efefef;
	margin-bottom: 2px;
}
.productRow p {
	float: left;
	width: auto;
}
.productRow .select {
	margin-right: 10px;
}

.productForm select {
	font-family: "Trebuchet MS", sans-serif;
	font-size: 1em;
	margin-right: 10px;
}

.subCatSel {
	width: 10em;
}

#products {
	background-color: #f8f8f8;
	clear: both;
	padding: 10px;
}

#products h4 {
	font-size: 12px;
	margin: 5px 0;
}

p.addProduct a {
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/add_icon.gif) center left no-repeat;
	padding-left: 15px;
}

.productRow {
	width: 100%;
}

span.delProduct {
	float: right;
	margin-top: -1.75em;
	background: url(http://www.rodeka.nl/frontend/templates/default/modules/pages/images/del_icon.gif) center left no-repeat;
	padding-left: 15px;
	color: #f00;
}

/* SITEMAP */

.sitemap {
	padding: 0 10px;
	margin-left: 10px;
}

ul.sitemaplist {
	list-style-type: none;
	width: 100%;
	margin: 10px 0 0 0;
	padding: 0;
}

ul.sitemaplist ul {
	list-style-type: none;
	margin: 0 0 10px 10px; padding: 0;
}

ul.sitemaplist li {
	height: auto;
	_height: 1em;
}

ul.sitemaplist li a {
	display: block;
	padding: 5px 0 5px 10px;
	_padding-top: 0;
	color: #000;
	border-bottom: 1px solid #e5e5e5;
	text-decoration: none;
	font-size: 1.1em;
}

ul.sitemaplist li li a {
	padding-top: 5px;
}

ul.sitemaplist ul a {
	border-bottom-color: none;
	background-image: none;
}

ul.sitemaplist li a:hover {
	color: #2f6e00;
}

.M3FormErrorField input {
	background-color: #ffeeee;
}
.M3FormErrorField .error {
	font-weight: bold;
	color: red;
	margin-left: 150px;
}