/*
 * DESCRIPTION
 * CSS styles used by the lay-out of the website of Sprank   
 * Alter these styles to let the site have a custom look.
 *
 * CONTENT
 *     - Layout styles
 *     - Background colors
 *     - Breadcrumbs
 *     - Home styles
 *     - Form styles
 *     - Tooltip styles
 */


/* Layout styles 
-------------------------------------------------------------------------------------------------*/
html,
body {
    margin: 0;
    padding: 0;
}

.pdmenu {
	width:665px;
	
}
.zoekdiv {
	position:absolute;
	top:0;
	z-index:100;
	width:100%;
}
.zoekdivform {
	width:620px;
	margin:0 auto;
	position:relative;
	display:block;
	text-align:right;
	top:135px;
	font-family:Trebuchet MS,Arial,Verdana,sans-serif;
	font-size:0.8em;
	color:white;
}
.searchinput {
	-moz-opacity:.50; filter:alpha(opacity=50); opacity:.50;
	height:14px;
	width:125px;
	font-family:Trebuchet MS,Arial,Verdana,sans-serif;
	font-size:0.9em;
}
.resulttable td {
	font-family:Trebuchet MS,Arial,Verdana,sans-serif;
	font-size:0.9em;
}

    #maincontainer {
        width: 100%;
    }
    
        #topsection {
            height: 160px;
            text-align: center;
        }
            #topsection .logo {
                margin-top: 28px;
            
			}
			#topsection .logo_iso {
				padding: 3px;
				padding-top: 6px;
				position: absolute;
				right: 0;
			}
        
		
		.wielaatjijsprankelen_logo {
			 position: absolute;
			 width: 200px;
			 height: 135px;
			 top: 5px;
			 left: 5px;
		}
        #menubar {
            height: 20px;
            border-bottom: 1px solid #FFF;
            border-top: 1px solid #FFF;
        }
        
        #contentwrapper {
            width: 100%;
            white-space: nowrap;
        }
        
        .leftcolumn {
            width: 30%;
        }
            
            .leftcolumn .innercontent {
                text-align: right;
                padding-top: 42px;
                width: 200px;
                padding-right: 22px;
            }
            
            .leftcolumn h3 {
                text-align: left;
                width: 177px;
            }
        
            ul.submenu {
                padding: 0;
                margin: 0;
                list-style: none;
                text-align: left;
                width: 200px;
            }
            
                ul.submenu li,
                ul.submenu li.active {
                    padding-left: 23px;
                    font: bold 0.8em/20px Trebuchet MS,Arial,Verdana,sans-serif;
                    color: #E61E1E;
                }
                
                ul.submenu li.active {
                    background: url(../images/submenu_bullet.gif) no-repeat left;
                }
                
                    ul.submenu li a {
                        text-decoration: none;
                        line-height: 20px;
                        color: #000;
                    }
                    
                    ul.submenu li a:hover {
                        color: #E61E1E;
                    }
        
        #contentcolumn {
            width: 500px;
            white-space: nowrap;
            display: block;
            padding: 0;
            margin: 0;
        }
        
        .contentcolumn_home {
            width: 630px;
            white-space: nowrap;
        }
        
        #contentcolumn_sub {
            white-space: normal;
            min-width: 500px;
            height: 350px;
            padding: 0;
            margin: 0;
        }
        
        #contentcolumn_sub p,
        #contentcolumn_sub div,
        #contentcolumn_sub td,
        #contentcolumn_sub a {
            white-space: normal;
        }
        
            .intro_menutext {
                font: 0.8em/20px Trebuchet MS,Arial,Verdana,sans-serif;
                text-transform: uppercase;
                color: #FFF;
                text-decoration: none;
                text-align: left;
                width: 630px;
                display: block;
            }
            
            #intro_text {
                margin-top: 20px;
                font: 1.3em/130% Trebuchet MS,Arial,Verdana,sans-serif;
                color: #E61E1E;
                text-decoration: none;
                width: 630px;
                white-space: normal;
                background: #FFF;
                height: 200px;
            }
            
            a.intro_skip,
            a.intro_skip:link,
            a.intro_skip:visited,
            a.intro_skip:active,
            a.intro_skip:hover {
                font: 0.7em/110% Trebuchet MS,Arial,Verdana,sans-serif;
                color: #E61E1E;
                text-decoration: none;
            }
            
            #breadcrumbs_wrapper {
                float: left;
            }
            
            #text_size {
                float: right;
                font-size: 0;
            }
            
            #print_logo {
            	display: none;
			} 
            
            #content {
                display: block;
                float: left;
                clear: both;
                position: relative;
            }
        
        .rightcolumn {
            width: 30%;
        }
        
            .rightMenuItem {
                border-bottom: 1px solid #FFF;
                padding-left: 16px;
				width: 225px;
				white-space: normal;
            }
			
				.rightMenuItem  .info a {
					color: #2998B6;
					padding-left: 0;
					text-transform:none;
				}
			
				
            
				.rightMenuItem .aqua_blue {
                    background-image: url(../images/rightmenu_arrow_out_aqua.gif);
                    background-repeat: no-repeat;
                    background-position: 0 0;
                }
                
                .rightMenuItem .jaffa_orange {
                    background-image: url(../images/rightmenu_arrow_out_jaffa.gif);
                    background-repeat: no-repeat;
                    background-position: 0 0;
                }
            
                    .rightMenuItem a {
                        text-decoration: none;
                        color: #FFF;
                        height: 20px;
                        font: 0.8em/20px Trebuchet MS,Arial,Verdana,sans-serif;
                        text-transform: uppercase;
                        padding-left: 22px;
                    }
            
        .vacs_quickmenu {
            padding: 0;
            margin: 0;
            list-style: none;
        }
        
            .vacs_quickmenu li {
                margin: 0 12px 6px 0;
                padding-left: 24px;
                font: normal 0.9em/120% Trebuchet MS,Arial,Verdana,sans-serif;
                white-space: normal;
                background: url(../images/red_bullet.gif) no-repeat 12px 5px;
            }
            
                .vacs_quickmenu li a {
                    color: #E61E1E;
                    padding: 0;
                    text-decoration: none;
                    text-transform: lowercase;
                    font-size: 100%;
                    white-space: normal;
                    font-weight: bold;
                }    
        
/* Background colors 
-------------------------------------------------------------------------------------------------*/
.olive_green {
    background-color: #A6D200;
}

.rose_red {
    background-color: #E61E1E;
}

.jaffa_orange {
    background-color: #FF9000;
}

.aqua_blue {
    background-color: #2998B6;
}

.slate_gray {
    background-color: #666;
}

.redcolorbg {
	background-color:#999;
}
.redcolor {
color:#999;
}

/* Breadcrumbs 
-------------------------------------------------------------------------------------------------*/
#breadcrumbs { 
    height: 20px; 
    margin: 0;
    padding: 4px 0 0 0; 
    color: #999; 
}
 
#breadcrumbs li { 
    float: left; 
    display: inline; 
    margin-right: 4px;
    font: 0.7em/110% Trebuchet MS,Arial,Verdana,sans-serif;
} 

#breadcrumbs a { 
    color: #999;
    background: url(../images/breadcrumb.gif) right no-repeat; 
    padding-right: 11px; 
    text-decoration: none; 
}
 
#breadcrumbs a:hover { 
    color: #333; 
    background:url(../images/breadcrumb.gif) right no-repeat; 
}

/* Home styles 
-------------------------------------------------------------------------------------------------*/
#living_menu,
#staying_menu,
#support_menu,
#development_menu,
#dagbesteding_menu,
#living_menu_active,
#staying_menu_active,
#support_menu_active,
#development_menu_active,
#dagbesteding_menu_active {
    
    padding: 9px 78px;
    font: bold 1.0em/110% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #666;
    display: block;
    margin: 10px 0;
}

#living_menu_active,
#staying_menu_active,
#support_menu_active,
#development_menu_active,
#dagbesteding_menu_active {
    color: #2998B6;
}

#living_menu a,
#staying_menu a,
#support_menu a,
#development_menu a,
#dagbesteding_menu a,
#living_menu_active a,
#staying_menu_active a,
#support_menu_active a,
#development_menu_active a,
#dagbesteding_menu_active a {
	display: block;
    font: bold 0.7em/145% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #666;
    text-decoration: none;
    padding-left: 11px;
    background: url(../images/link_bullet_out.gif) no-repeat left 3px;
    text-align: left;
    width: 140px;
}

#living_menu_active a.active,
#staying_menu_active a.active,
#support_menu_active a.active,
#development_menu_active a.active,
#dagbesteding_menu_active a.active {
    color: #2998B6;
    background: url(../images/link_bullet_on.gif) no-repeat left 3px;
}

#living_menu {
    background: url(../images/living_out.gif) no-repeat left;
}

#living_menu_active {
    background: url(../images/living_on.gif) no-repeat left;
}

#staying_menu {
    background: url(../images/staying_out.gif) no-repeat left;
}

#staying_menu_active {
    background: url(../images/staying_on.gif) no-repeat left;
}

#support_menu {
    background: url(../images/support_out.gif) no-repeat left;
}

#support_menu_active {
    background: url(../images/support_on.gif) no-repeat left;
}

#development_menu {
    background: url(../images/development_out.gif) no-repeat left;
}

#development_menu_active {
    background: url(../images/development_on.gif) no-repeat left;
}

#dagbesteding_menu {
    background: url(../images/dagbesteding_out.gif) no-repeat left;
}

#dagbesteding_menu_active {
    background: url(../images/dagbesteding_on.gif) no-repeat left;
}

.header_green {
    font: bold 1.3em/145% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #2998B6;
    background: url(../images/green_arrow.gif) no-repeat left;
    padding-left: 25px;
}

.header_green_smaller {
    font: bold 1.2em/145% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #2998B6;
    background: url(../images/green_arrow.gif) no-repeat left;
    padding-left: 25px;
}

#producttext {
    float: right;
    width: 250px;
    display: none;
    font: normal 0.8em/120% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #2998B6;
    white-space: normal;
    position: absolute;
}

.item_desc {
    display: none;
}

.home_carrousel {
    cursor: pointer;
}

a.more_link {
    font: bold 0.7em/120% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #000;
    text-decoration: none;
    text-transform: lowercase;
    margin-bottom: 12px;
}

.news_on_home {
    padding: 0;
    margin: 0;
    list-style: none;
}

    .news_on_home li {
        margin: 0 12px 12px 0;
        padding-left: 24px;
        font: normal 0.7em/120% Trebuchet MS,Arial,Verdana,sans-serif;
        white-space: normal;
        background: url(../images/blue_bullet.gif) no-repeat 12px 25px;
    }
    
        .news_on_home li a {
            color: #2998B6;
            padding: 0;
            text-transform: lowercase;
            font-size: 100%;
            white-space: normal;
        }

.vacs_on_home {
    padding: 0;
    margin: 0;
    list-style: none;
}

    .vacs_on_home li {
        margin: 0 12px 6px 0;
        padding-left: 24px;
        font: normal 0.7em/120% Trebuchet MS,Arial,Verdana,sans-serif;
        white-space: normal;
        background: url(../images/blue_bullet.gif) no-repeat 12px 8px;
    }
    
        .vacs_on_home li a {
            color: #000;
            padding: 0;
            text-transform: lowercase;
            font-size: 100%;
            white-space: normal;
            font-weight: bold;
        }

/* Form styles 
-------------------------------------------------------------------------------------------------*/

.text_input,
textarea {
    border: 1px solid #FF9000;
}

.button_input {
    border: none;
    background: none;
    font: bold 0.8em/120% Trebuchet MS,Arial,Verdana,sans-serif;
    color: #FF9000;
    text-transform: uppercase;
    padding: 3px 0;
    margin: 10px 0 0 0;
    text-align: left;
}

/* Tooltip styles 
-------------------------------------------------------------------------------------------------*/
#dhtmltooltip {
	position: absolute;
	border: 1px solid #E61E1E;
	background-color: #FFF;
	padding: 3px;
	font-size: .7em;
	color: #E61E1E;
	visibility: hidden;
	z-index: 100;
	width: 200px;
}



#divleft {
	
	display:block;
	overflow-x:auto;
   overflow-y:hidden;
	height:auto;
	text-align:left;
	min-height:300px;
	width:200px;
	white-space: normal;
	word-wrap: break-word;
}