/* CSS Document */


/* body */
body  {
    background: url("../img/bg.png") no-repeat scroll  50% 0 rgba(0, 0, 0, 0) !important;
	 font-size: 0.875em;
   
}

a {
    color: #464C62;
}
a:hover { color: #464C62; }


p {    font-size: 0.875em; }
ul li {    font-size: 0.875em; }

div.productfiche img:hover { box-shadow: 0 0 10px #dadada;}

div.productfiche2 a { color:#999 !important; }
div.productfiche2 a:hover { color:#464C62 !important;}


.title { color:#464C62; border-left: 10px solid #464C62; padding-left:10px;}

[data-abide] .error small.error, [data-abide] span.error, [data-abide] small.error {
background: none;
color:#ff0000;
}

#map {
    background: none repeat scroll 0 0 #FFFFFF;
    height: 150px;
}


/* ============================================ navigatie ============================================ */
.top-bar {
    background: #464C62;
    /*overflow: visible;*/
}


/* algemeen */
.top-bar-section ul { background: #464C62; }

.top-bar-section li:not(.has-form) a:not(.button) {
    background: none repeat scroll 0 0 #464C62;
}

.top-bar-section li ul li:not(.has-form) a:not(.button) { line-height:30px;}
.top-bar-section li ul li.active:not(.has-form) a:not(.button) { line-height:30px;}
.top-bar-section li.active:not(.has-form) ul li a:not(.button) {line-height:30px;}

h1,h2,h3,h4,h5 { color:#464C62; }

.side-nav li a, .breadcrumbs li a  { color:#464C62; }
.side-nav li a:not(.button) { color:#464C62; }
.side-nav li a { color:#464C62; }
.side-nav li a:hover { color:#fff; }
.side-nav li a  { background:#f4f4f4; border-left:10px solid #464C62; padding-left:10px; color:#464C62;} 
.side-nav li.active a, .side-nav li a:hover   {color:#fff;}
.side-nav li.active a, .side-nav li a:hover  { background:#464C62; border-left:10px solid #464C62; padding-left:10px;}
.side-nav li.active > a:first-child:not(.button)  {color:#fff;}
.side-nav li a:not(.button):hover, .side-nav li a:not(.button):focus {color: #fff; }


.top-bar-section li.active:not(.has-form) a:not(.button) {
    background: none repeat scroll 0 0 #222;   

}
.top-bar-section li.active:not(.has-form) a:hover:not(.button) {
    background: none repeat scroll 0 0 #111;   
}


.sitemap  { background:#f4f4f4; color:#464C62; margin:0px; padding: 20px;} 
.sitemap ul li { font-size: 0.8em; font-weight:normal;}
.sitemap a {  color:#464C62;}
.sitemap a:hover { text-decoration:underline;}


/* ELEMENTEN KLEUREN */
#green h1,#green h2, #green h3, #green h4, #green h5 { color:#B2D234; }
#green h5 { border-bottom:2px solid #B2D234; font-size:1.1em; }
#green .breadcrumbs li a  { color:#B2D234; }
#green ul li { list-style:none;}
#green .side-nav li a { color:#B2D234; }
#green .side-nav li a:hover { color:#fff; }
#green .side-nav li a  { background:#f4f4f4; border-left:10px solid #B2D234; padding-left:10px; color:#B2D234;} 
#green .side-nav li.active a, #green .side-nav li a:hover   {color:#fff;}
#green .side-nav li.active a, #green .side-nav li a:hover  { background:#B2D234; border-left:10px solid #B2D234; padding-left:10px;}

#green .products { background:#B2D234;margin:0px; padding:0px;}
#green .products li {margin:0px; padding:0px; }
#green .products li a {margin:0px; padding:3px 15px; border:0px; }
#green .products h5{ color:#fff; font-size:0.9em; padding-left:15px; padding-bottom:0px; margin-bottom:0px; }
#green .products li a  { background:#B2D234;  color:#fff; font-size:0.9em;} 
#green .products li a:hover  { background:#97b32c; margin:0px; padding:3px 15px; border:0px;}
#green .products li.active a { background:#97b32c; margin:0px; padding:3px 15px; border:0px;}

#green .button { background: none repeat scroll 0 0 #B2D234; }
#green hr { border-color: #B2D234; background:#B2D234; color:#B2D234; height:2px; }
#green p a { color:#B2D234; }
#green p a:hover { text-decoration:underline;}



footer p { color:#464C62; font-size:0.8em; }
footer a { color:#464C62; font-size:0.8em; }
footer a:hover { color:#222; text-decoration:underline;}

#purple h1,#purple h2, #purple h3, #purple h4, #purple h5 { color:#7D5DA0; }
#purple h5 { border-bottom:2px solid #7D5DA0; font-size:1.1em; }
#purple .breadcrumbs li a  { color:#7D5DA0; }

#purple ul li { list-style:none;}
#purple .side-nav li a { color:#7D5DA0; }
#purple .side-nav li a:hover { color:#fff; }
#purple .side-nav li a  { background:#f4f4f4; border-left:10px solid #7D5DA0; padding-left:10px; color:#7D5DA0;} 
#purple .side-nav li.active a, #purple .side-nav li a:hover   {color:#fff;}
#purple .side-nav li.active a, #purple .side-nav li a:hover  { background:#7D5DA0; border-left:10px solid #7D5DA0; padding-left:10px;}

#purple .products { background:#7D5DA0; margin:0px; padding:0px;}
#purple .products li {margin:0px; padding:0px; }
#purple .products li a {margin:0px; padding:3px 15px; border:0px; }
#purple .products h5 { color:#fff; font-size:0.9em; padding-left:15px; padding-bottom:0px; margin-bottom:0px; }
#purple .products li a  { background:#7D5DA0;  color:#fff; font-size:0.9em;} 
#purple .products li a:hover  { background:#675392;margin:0px; padding:3px 15px; border:0px;}
#purple .products li.active a { background:#675392; margin:0px; padding:3px 15px; border:0px;}



#purple .button { background: none repeat scroll 0 0 #7D5DA0; }
#purple hr { border-color: #7D5DA0; background:#7D5DA0; color:#7D5DA0; height:2px; }
#purple p a { color:#7D5DA0; }
#purple p a:hover { text-decoration:underline;}



#brown h1, #browne h2, #brown h3, #brown h4, #brown h5 { color:#905B25; }
#brown h5 { border-bottom:2px solid #905B25; font-size:1.1em; }
#brown h4 { font-size:1.3em; }
#brown .breadcrumbs li a  { color:#905B25; }

#brown ul li { list-style:none;}
#brown .side-nav li a { color:#905B25; }
#brown .side-nav li a:hover { color:#fff; }
#brown .side-nav li a  { background:#f4f4f4; border-left:10px solid #905B25; padding-left:10px; color:#905B25;} 
#brown .side-nav li.active a, #brown .side-nav li a:hover   {color:#fff;}
#brown .side-nav li.active a, #brown .side-nav li a:hover  { background:#905B25; border-left:10px solid #905B25; padding-left:10px;}

#brown .products { background:#905B25; margin:0px; padding:0px;}
#brown .products li {margin:0px; padding:0px; }
#brown .products li a {margin:0px; padding:3px 15px; border:0px; }
#brown .products h5 { color:#fff; font-size:0.9em; padding-left:15px; padding-bottom:0px; margin-bottom:0px; }
#brown .products li a  { background:#905B25; color:#fff; font-size:0.9em;} 
#brown .products li a:hover  { background:#7b4d1f; margin:0px; padding:3px 15px; border:0px;}
#brown .products li.active a { background:#7b4d1f; margin:0px; padding:3px 15px; border:0px;}



#brown .button { background: none repeat scroll 0 0 #905B25; }
#brown hr { border-color: #905B25; background:#905B25; color:#905B25; height:2px; }
#brown p a { color:#905B25; }
#brown p a:hover { text-decoration:underline;}


/*===================  brown =================== */

.top-bar-section li:not(.has-form) a.brown:hover:not(.button) {
background: none repeat scroll 0 0 #905B25;  
/*border-top: 5px solid #905B25;  */
}
.top-bar-section li.active:not(.has-form) a.brown:not(.button) {
background: none repeat scroll 0 0 #905B25;
}

#largebanners .brown div.inner{ border: 2px solid #905B25; min-height:250px; padding:20px;}
#largebanners .brown h4 { color: #905B25;}
#largebanners .brown div.inner {position:relative;}
#largebanners .brown a.button {position:absolute;bottom:0px; width:100%; margin-left:-20px;margin-bottom:0px; background: none repeat scroll 0 0 #905B25;  font-size:2em; }




/*===================  purple ===================  */
.top-bar-section li:not(.has-form) a.purple:hover:not(.button) {
      background: none repeat scroll 0 0 #7D5DA0;
}
.top-bar-section li:not(.has-form) a.purple:not(.button):hover {
        background: #7D5DA0; }
.top-bar-section li.active:not(.has-form) a.purple:not(.button) {
	background: none repeat scroll 0 0 #7D5DA0;
}

#largebanners .purple div.inner{ border: 2px solid #7D5DA0;  min-height:250px; padding:20px;}
#largebanners .purple h4 { color: #7D5DA0;}
#largebanners .purple div.inner {position:relative;}
#largebanners .purple a.button {position:absolute;bottom:0px; width:100%;  margin-left:-20px;margin-bottom:0px; background: none repeat scroll 0 0 #7D5DA0;  font-size:2em; }




/*===================  green ===================  */
.top-bar-section li:not(.has-form) a.green:hover:not(.button) {
    background: none repeat scroll 0 0 #B2D234;
}

.top-bar-section li.active:not(.has-form) a.green:not(.button) {
	background: none repeat scroll 0 0 #B2D234;
}

#largebanners .green div.inner{ border: 2px solid #B2D234;  min-height:250px; padding:20px;}
#largebanners .green h4 { color: #B2D234;}
#largebanners .green div.inner {position:relative;}
#largebanners .green a.button {position:absolute;bottom:0px; width:100%;  margin-left:-20px;margin-bottom:0px; background: none repeat scroll 0 0 #B2D234; font-size:2em; }
/*#largebanners .green div.panel:hover{ background: none repeat scroll 0 0 #B2D234;}*/





/* ============================================ buttons ============================================ */
button, .button {
    background-color: #464C62;
    /*border-color: #CF2A0E;*/
    color: #FFFFFF;
}

button:hover, button:focus, .button:hover, .button:focus { background-color: #222; }


button.purple:hover, button.purple:focus, .button.purple:hover, .button.purple:focus {
    color: #FFFFFF;
	background-color: #7D5DA0; /*#5e3214;*/
}

button.brown:hover, button.brown:focus, .button.brown:hover, .button.brown:focus {
    color: #FFFFFF;
	background-color: #905B25; /*#5e3214;*/
}

button.green:hover, button.green:focus, .button.green:hover, .button.green:focus {
    color: #FFFFFF;
	/*background-color: #B2D234; /*#5e3214;*/*/
	background: #97b32c;
}


 
#green button:hover, button:focus,#green .button:hover,#green .button:focus { background: #97b32c; } /*15% donkerder*/
#brown button:hover, button:focus,#brown .button:hover,#brown .button:focus { background: #7b4d1f; } /*15% donkerder*/
#purple button:hover, button:focus,#purple .button:hover,#purple .button:focus { background: #675392; } /*15% donkerder*/
 
 
 
 
 
 
 
 
/* ============================================ clearing popup ============================================ */ 
 .clearing-blackout {
    background: none repeat scroll 0 0 #F4F4F4;     
	 
    position: fixed;   
    width: 80%;
	height: 80%;	
	top: 10%;
	left: 10%;

}



/* ============================================ zoeken ============================================ */ 
.search { float:right;}

.ui-helper-hidden-accessible{display:none}
#searchform input { width:200px; margin:0; margin-left:10px; paddin:0px; float:left;}
#searchform button { float:right;  padding:10px;}


#searchinput input:focus {
    border-color: #00CC33;
    box-shadow: 0 0 10px #D5D5D9;
    color: #676767;
}
.ui-autocomplete {
    cursor: default;
    position: absolute;
}
.ui-menu {
    background-color: #F9F9F9;
    border: 1px solid #EFEFEF;
    border-radius: 3px;
    display: block;
    float: left;
    list-style: none outside none;
    margin: 0;
    padding: 2px;
}
.ui-menu .ui-menu {
    margin-top: -3px;
}
.ui-menu .ui-menu-item {
    clear: left;
    float: left;
    font-family: arial;
    margin: 0;
    padding: 0;
    width: 100%;
}
.ui-menu .ui-menu-item a {
    display: block;
    line-height: 1.5;
    padding: 0.1em 0.3em;
    text-decoration: none;
}
.ui-menu .ui-menu-item a.ui-state-hover, .ui-menu .ui-menu-item a.ui-state-active {
    font-weight: bold;
}
.ui-helper-hidden-accessible {
    color: #FF0000;
    font-size: 10px;
    position: absolute;
    right: 0;
    top: -10px;
    visibility: hidden;
}
.highlight {
    background-color: #FFFF88;
}

.zoek {
    padding: 4px;
    position: absolute;
    right: 15px;
    text-align: right;
    top: 0;
    width: 350px;
}
.zoek form input {
    border-color: #27B6C3;
    width: 200px;
}
.zoek form button {
	float:right;
    background-color: #32B9C6;
    background-image: linear-gradient(to bottom, #32B9C6, #0093A1);
    background-repeat: repeat-x;
    border: 1px solid #26B5C3;
    border-radius: 2px;
    color: #FFFFFF !important;
    cursor: pointer;
    float: right;
    font-family: 'helvetica',Arial,Helvetica,sans-serif;
    font-size: 14px;
    font-weight: bold;
    margin-left: 2px;
    padding: 5px !important;
    text-decoration: none;
}