/*	-------------------------------------------------------------
		Habraken
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
		Description:	Base stylesheet
		Filename:			base.css
		Version:			1.0
		Date:					Oct 31 2007 
		-------------------------------------------------------------	*/
	
/*	-------------------------------------------------------------
		Base HTML Styles
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

			html {
				height: 100%; }
					
			body {
				height: 100%;
				padding: 0;
				margin: 0;
				font-size: 1em;
				font-family: Verdana;
				text-align: center;
				position: relative;
				background: url(../img/body-bg.jpg) top left repeat-x; }
			
			img {
				border: none; }
				
			a {
				color: #3766ff;				
				-moz-outline: none; }
			
			h1, h2, h3, h4, h5 {
				font-size: 11px; }

			/* Download module style */
			#mod10 ul li{
				margin-bottom:12px;
				padding:0px;
			}
			#mod10 a{
				margin-bottom:2px;
			}
			#mod10 ul p{
				margin:0px;
				padding:0px;
			}
/*	-------------------------------------------------------------
		Container
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
			#container {
				width: 1024px;
				min-height: 100%;
				margin: 0 auto;
				position: relative;
				text-align: left; }
		
			* html #container {
				height: 100%;	}
								
/*	-------------------------------------------------------------
		Logo + language selection
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

		#header {
			width: 100%;
			height: 104px;
			position: relative;
			background: url(media/img/header-bg.jpg)	top left no-repeat;	}

/*	Logo
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#header h1 {
			width: 262px;
			height: 77px;
			margin: 0;
			padding: 0;
			position: absolute;
			top: 27px;
			left: 0;
			text-indent: -10000em;
			background: url(../img/logo.jpg) top left no-repeat; }
			
/*	Language selection
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
		
		#header ul {
			height: 22px;
			line-height: 22px;
			margin: 0;
			padding: 0;
			list-style: none;
			position: absolute;
			left: 78px;	}
			
		#header li {
			color: #fff;
			font-size: 11px;
			margin: 0 0 0 15px;			
			float: left; }
			
		#header li a {
			padding: 0 0 0 10px;
			color: #fff;
			text-decoration: none;
			background: url(../img/language-selection-list.gif) center left no-repeat;}
			
/*	Search
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/			
		
		#header form, #header fieldset {
			height: 22px;
			padding: 0;
			margin: 0;
			font-size: 11px;
			color: #fff;
			border: none;	}
			
		#header fieldset {
			position: absolute;
			top: 0;
			right: 17px; }

		#header fieldset span{
			float:left;
			margin-top:5px;
			margin-right:15px; }

		#header input {
			margin: 1px 0 0 0;
			font-size: 11px; }
			
		#header input#search-submit {
			border: none;
			color: #fff;
			background: #59637b; }

		#header a {
			color:#fff;	}
				
/*	-------------------------------------------------------------
		Main menu
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
		
		#main-menu {
			width: 100%;
			height: 75px;
			background: url(../img/main-menu-bg.jpg) top left no-repeat; }
			
		#main-menu ul {
			margin: 0;
			padding: 0;
			list-style: none;	}
			
		#main-menu li {
			height: 25px;
			margin: 0 0 0 50px;
			line-height: 25px;
			float: left; }
			
		#main-menu li ul {
			width: 1024px;
			height: 25px;
			position: absolute;
			margin: 0 0 0 -33px;
			left: -999%; }

/*		#main-menu li:hover ul ul, #main-menu li li:hover ul ul {
			left: -999%;	}
			
		#main-menu li:hover ul,	#main-menu li li:hover ul {
			left: 50px; }*/
			
		#main-menu li a {
			display: block;
			color: #3e3e3e;
			font-size: 11px;
			padding: 0 0 0 17px;
			text-decoration: none; }

		#main-menu li a:hover, #main-menu li a.selected {
			background: url(../img/crumb-seperator.gif) center left no-repeat;
			color: #000; }
			
/*	-------------------------------------------------------------
		Breadcrumbs
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#crumbs {
			width: 100%;
			height: 45px;
			line-height: 45px;
			font-size: 11px;		
			text-indent: 36px; }
		
		#crumbs .crumb {
			padding: 0 0 0 17px;
			background: url(../img/crumb-seperator.gif) center left no-repeat; 
			color: #3766ff;	}
		
		#crumbs span {
			padding: 0 0 0 17px;			
			background: url(../img/crumb-seperator.gif) center left no-repeat; 
			color: #3766ff;	}
			
		#crumbs .c-sep {
			display: none; }
			
/*	-------------------------------------------------------------
		Content
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
		
		#content-container {
			width: 968px;
			font-family: Verdana;
			font-size: 11px;
			padding: 0 30px 0 36px;
			/*margin: 0 0 30px 0;*/ }

    #content {
      position: relative; }
      
/*	Header (blue with red dot)
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/			
						
		#content-container h2 {
			color: #fff;
			line-height: 24px;
			font-size: 12px;
			margin: 0 0 10px -10px;
			padding: 0 15px 0 0;
			text-indent: 14px;
			background: #03163b url(../img/content-header-corner.gif) top right no-repeat; }
			
		#content-container h2 span {
			padding: 0 0 0 12px;
			background: #03163b url(../img/content-header-red-dot.gif) center left no-repeat; }
			
/*	Content
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/			
			
		.small #content {
			width: 475px;	}
			
		#content {
			margin: 0 0 70px 0;
			float: left; }

/*	Portal items
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/			

		#portal-items {
			width: 468px;
			padding: 0 10px;
			margin: 0 0 50px 0;
			float: right; }

		.portal-item {
			width: 212px;
			height: 250px;
			margin: 0 5px 20px 5px;
			max-height: 97px;
			padding: 0 0 0 10px;
			overflow: hidden;
			float: left; }

/*	Search result
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

		.q-result div {
			color: green; }
			
/*	-------------------------------------------------------------
	Selectie tool
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
  	input#reset-button {
  	  height: 24px;
      width: 130px;
  	  position: absolute;
      right: 0;
      bottom: -24px;
      border: none;
      padding: 0;
      margin: 0;      
      color: #fff;
      background: #17274a;
      z-index: 100000; }
      
		div#selectie-tool-header {
			width: 984px;
			height: 24px;
			background: url(../img/selectie-tool-header.gif) top left no-repeat; }
			
		div#selectie-body {
			width: 977px;
			height: 331px;
			margin: 3px 0 0 0;
			padding: 0 0 0 5px;
			background: #f3f3f3;
			min-height: 200px;
			color: #5f6366;
			border: 1px solid #b9b9b9; }
			
		#selectie-body div {
			width: 221px;
			height: 316px;
			float: left;
			margin: 0 9px 0 0;
			padding: 0 0 3px 0;
			position: relative;
			border-bottom: 2px solid #17274a; }
			
		* html #selectie-body div {
			margin: 0 2px 0 0; }
			
		#selectie-body div div {
			height: 276px;
			border: none; 
			overflow: hidden;
			position: relative;
			background: #fff url(../img/list-bg.jpg) 0px 31px no-repeat; }
					
		#selectie-body a.arrow {
			width: 203px;
			height: 32px;
			display: block;
			position: absolute;
			z-index: 10;
			text-indent: -10000em; }
		
		.arrow.up {
			top: 0;
			background: url(../img/up-arrow.jpg) top left no-repeat; }
			
		.arrow.down {
			bottom: 0px;
			background: url(../img/down-arrow.jpg) top left no-repeat; }

		* html .arrow.down {
			bottom: -1px;	}
			
		#selectie-body div ul {
			margin: 0;
			padding: 0;
			position: absolute;
			top: 104px;
			z-index: 1;
			list-style: none; }

		#selectie-body div ul.selected {
			opacity: 1; }
			
		#selectie-body div ul li {
			margin: 0 7px;
			padding: 3px 0; }
			
		#selectie-body div li a {
			height: 56px;
			width: 178px;
			font-size: 11px;
			font-weight: 700;
			text-decoration: none;
			padding: 5px 5px;
			color: #000;
			display: block;
			background: url(../img/item-bg.jpg) top left no-repeat; }

    #selectie-body div li a span {
      width: 120px;
      display: block;
      float: left; }
    
		#selectie-body div li a img {
			width: 52px;
			height: 44px;
      float: right; }
		
		h2#kies-product, h2#kies-materiaal, h2#kies-machine, h2#meer-informatie {
			height: 23px;
			text-indent: 22px;
			font-size: 12px;
			margin: 3px 0px 5px 0; }
							
		div#informatie-text {
			width: 286px;
			padding: 5px;
			border: 1px solid #b7bbbc;
			background: #f3f3f3; }
		
		* html #selectie-informatie {
			width: 266px;	}
			
		#selectie-product h2 {
			border: none;
			background: url(../img/header1.gif) top left no-repeat; }
				
		#selectie-materiaal h2 {
			background: url(../img/header2.gif) top left no-repeat;	}
			
		#selectie-machine h2 {
			background: url(../img/header3.gif) top left no-repeat;	}
			
		h2#meer-informatie {
			width: 271px;
			margin: 3px 0 3px 0;
			background: url(../img/header4.gif) top left no-repeat; }
						
		#selectie-body div#selectie-informatie div#text {
			width: 271px;
			height: 270px;
			overflow-y: auto;
			background: none;
			padding: 5px;	
			background: url(../img/text-background.jpg) top left no-repeat; }
			
		* html #selectie-body div#selectie-informatie div#text {
			width: 261px; }
			
		#selectie-body div#selectie-informatie div#text div {
			background: none; }

		.blurred {
			zoom: 1;
		  filter: alpha(opacity=60);
			opacity: 0.6; }
		
/*	Scrollbars
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
	#selectie-body div.scrollbar {
		width: 17px;
		height: 215px;
		position: absolute;
		top: 62px;
		right: -8px;
		background: #eee; }

	* html #selectie-body div.scrollbar {
		right: 2px; }
		
	#selectie-body div.ui-slider-handle {
		width: 15px;
		height: 18px;
		position: relative;
		border: 1px solid #aaa;
		background: #ccc; }
	
/*	-------------------------------------------------------------
		Sitemap
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

		#sitemap ul {
			margin: 0 0 0 10px;
			padding: 0 0 0 10px;
			line-height: 20px; }
		
		#sitemap li {
				list-style: url(../img/content-header-red-dot.gif);	}
					
/*	-------------------------------------------------------------
		Footer
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
		
		#footer {
			width: 944px;
			height: 54px;
			color: #fff;
			font-size: 9px;
			line-height: 27px;
			padding: 0 0 0 80px;
			position: absolute;
			bottom: 0;
			left: 0;			
			letter-spacing: -0.08em;
			z-index: 20;
			background: url(../img/footer-bg.gif) top left no-repeat; }
			
		#footer-left, #footer-right {
			width: 500px;
			height: 54px;
			margin: -54px 0 0 0;
			z-index: 0;
			background: #03163b; }
			
		#footer-left {
			float: left; }
			
		#footer-right {
			float: right; }