@charset "UTF-8";
@import "reset.css";

/********************************
_________________________________
1. Global 		
2. Aanpassingen voor design 			**> OPMERKING <**  Alleen in punt 2 aanpassen om de gehele opmaak te wijzigen
3. Header 				
4. Content 		 
5. Footer 		
6. Navigatie 		
7. Formulieren 	
_________________________________

********************************/

/***************************************************
1. Global ******************************************
***************************************************/
html { overflow: -moz-scrollbars-vertical; overflow-y: scroll; }
body { text-align: center; height: 100%; }

	
#container 		{ margin:0 auto; position: relative; text-align: left;}

#header, #content { position: relative; margin:0 auto;}

.clear_both 	{ clear: both; }
.clear_left		{ clear: left; }
.clear_right	{ clear: right;}

/***************************************************
2. Aanpassingen voor design	************************
***************************************************/

/*2.1 GLOBAL ********************************************************************************/		
				body							{ color: #434343; font-family: 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; background:#fff; }
					.insideFullWidth, 
					.insideFooter				{ width: 990px; margin:0 auto;}
					.insideContent				{ width: 970px; margin: 0 auto;}
				#container						{ } 
				
/*2.2 HEADER ********************************************************************************/			
				#header							{ background: none;}
					.logo						{ width: 180px; height:100px; min-height:100px; position:absolute; margin:5px 0px; background: url(../images/layout/logo.jpg) no-repeat;}
						.logo a					{ width: 180px; height: 100px; min-height: 100px; display:block; margin:-26px 0px;}
							.logo h1 a span		{ visibility: hidden;}
					.slogan						{ background: url(../images/layout/bg_slogan.jpg) no-repeat; width:406px; height:48px; min-height:48px; position:absolute; margin:82px 0 0 580px;}
						.slogan h1				{ visibility: hidden;}
					#search						{ background:url(../images/layout/bg_searchform.jpg) no-repeat; width:191px; height:28px; min-height:33px; margin:33px 0 0 798px;}
		      #toptab           { position: absolute; background:url(../images/layout/toptab.jpg) no-repeat; width: 246px; height: 34px; margin: 0 0 0 240px; }
		        #toptab p a          { font: normal 13px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; display: block;  padding: 8px;}
/*2.3 NAVIGATIE ******************************************************************************/		
				#navigatie						{ background: url(../images/layout/bg_navigatie.jpg) no-repeat; }
					#menu_hoofd li a,
					#menu_hoofd li a:visited 	{ color:#fff; font-family: 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-weight:normal; font-size:12px; text-transform: uppercase; padding:0 28px 0 12px;}
						#menu_hoofd li a:hover, #menu_hoofd li a.active	{ color:#000;}
											

/*2.4 BREADCRUMBS ****************************************************************************/
				#nav_top					{ background: #fff;; height:33px; min-height:33px;}
					#nav_top p				{ float: right; margin: 20px 0 0 0; color: #e29b0e; font-family: 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-size: 11px;}
						#nav_top p a		{ color:#e29b0e; font-family: 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-size: 11px;}
							#nav_top p a:hover	{ color: #000;}
						
				
							
				
/*2.5 BANNER ********************************************************************************/
				#banner							{ width:990px; height:203px; min-height:203px; }
					#insideBanner				{ position:absolute; margin: 0; width:990px;  min-height:360px; background: url(../images/layout/banner.jpg) no-repeat;}
				    #more_info          { position: absolute; width: 99px; height: 26px; margin: 102px 0 0 850px;}
		
/*2.6 CONTENT ********************************************************************************/		
				#content, #banner				{ background: #fff; }
				 #content               { border-bottom: 1px solid #d6d5d5; margin: 16px 0 2px 0; padding-bottom: 30px;}
					#contentFooter				{ background: #fff; border-top: 1px solid #d6d5d5!important; height: 56px; }
						#contentFooter p		{ float: left; margin-top: 15px; }
						  #contentFooter img		{ margin: -6px 0 0 30px;  }
				        .adr_footer { float: right; }
/*2.6.1 CONTENT BANNER LEFT ***************/

				#contentStartLeft a.linkright	{ color: #e29b0e; font-weight: bold; float: right; margin: 0 20px 0 0; }
				
		.listLeft {  }
      .listLeft li {  }
        .listLeft li a { font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; display: block; padding: 12px 0 12px 6px; width: 204px; border-bottom: 1px solid #e7e7e7; background:url(../images/layout/list_inactive.gif) 185px 12px no-repeat;}
          .listLeft li a:hover, .listLeft li a.active { color: #e29b0e; background:url(../images/layout/list_active.gif) 185px 12px no-repeat; }
					
/*2.6.2 CONTENT BANNER RIGHT ***************/
  #contentStartRight p { padding: 5px 14px 15px 14px; background: #fff; }
		#topRight { height: 268px;  }
      #topRight p { padding: 0 14px 14px 14px;background: #f0f0f0; }
    #bottomRight { height: 190px; width: 224px; margin: 36px 0 0 0; background: url(../images/layout/recenthouses_bg.gif) no-repeat; }
      .recentHouseImage { margin: 32px 0 0 16px; width: 189px; height: 142px;}
      .recentTekoopLabel { position: absolute; margin: 5px 0 0 -209px; width: 124px; height: 101px; z-index: 1000; }
      .recentTekoopLabel, x:-moz-any-link {  position: absolute; margin: 5px 0 0 -205px; width: 124px; height: 101px; z-index: 1000; }
     #bottomRight p { padding: 0 14px 0 14px; color: #666; }
		
/*2.7 FOOTER *********************************************************************************/		
				#footer, 
				.insideFooter					{ background: #353536; }
					
				#footer, .insideFooter			{ height:30px; min-height:30px; text-align:center; }
				
				
/*2.8 TEKST *********************************************************************************/		
				h1	{font-family:'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-weight:normal; font-size:21px; color:#4e84ba; padding: 30px 0 20px 0;}
				h2	{font-family:'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-weight:normal; font-size:18px; color:#e29b0e; padding: 10px 0 15px 0;}
				h3	{font-family:'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-weight:bold; font-size:11px; color:#e29b0e; padding: 10px 0 5px 0;}
				p	{ margin: 0 0 0 0; }
				a, a:visited	{ color:#000;}
					a:hover		{ color:#666;}
				
				#contentFooter	{ color:#666; font-family: 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; border-top: #e5e5e5;}
				
				.insideFooter     { color: #fff; }
				.insideFooter a,
				.insideFooter a:visited	{color:#fff; margin:20px 10px 0 10px;}
					.insideFooter a:hover	{color:#fff; }
				.insideFooter abbr { color:#e29b0e; }
				.maillink { margin: 0 0 0 0px!important; }
    #contentStartCenter p a, #contentNextCenter p a, #contentStartCenter table a, #contentNextCenter table a { color:#e29b0e; }
    #contentStartCenter p a:hover, #contentNextCenter p a:hover, #contentStartCenter table a:hover, #contentNextCenter table a:hover { text-decoration: underline; }
		#contentStartLeft h2,
		#contentStartRight h2	{font-family: 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; font-weight:normal; font-size:18px; color:#666; padding: 10px; background: #f0f0f0;}
	   #contentStartRight address { margin: 0 0 20px 15px; }
		#contentStartCenter ul, #contentNextCenter ul { list-style: square; margin: 0 0 0 20px; }
		#contentStartCenter ol, #contentNextCenter ol { margin: 0 0 0 20px; }
/***************************************************
3. Header	****************************************
***************************************************/
	
		#header	{ height:109px; min-height:109px;}
			#search	{ position:absolute;}

/***************************************************
4. Content	****************************************
***************************************************/
		#contentStartLeft	{ width:220px;  float:left; margin:0 28px 0 0px; display:inline; padding:0 0 0 0; border-right: 1px solid #e7e7e7; }
		#contentStartCenter	{ width:482px; float:left; margin:0 32px 0 -29px; display:inline; padding:0 0 0 32px; border-left: 1px solid #e7e7e7; }
		#contentStartRight	{ width:222px; float:left; margin:0 0 0 0px; display:inline; padding:0; }
		  .highlight_block { margin: 25px 0 14px 0; background: #f0f0f0; border-left: 6px solid #353536; padding: 12px;}
		    .highlight_block h3 { font: bold 14px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; margin-top: -5px;}
		    .highlight_block p { font: normal 14px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; line-height: 26px; }
		.contentFooter		{ clear: both;}
		
		#contentNextCenter	{ width:728px; float:left; margin:0 28px 0 10px; display:inline; padding:0; }
		
		#adresgegevens { background:url(../images/layout/adres_bg.gif) -1px 0 no-repeat; height: 224px; margin-bottom: 20px; padding: 5px; }
		  #adresgegevens h2 { color: #666; background: none; }
		  #adresgegevens p { color: #666; background: none; }
		  #adresgegevens address { color: #666; background: none; margin-bottom: 0;}
		  #adresgegevens abbr { color: #e29b0e; background: none; }
		
		#openingstijden { background:url(../images/layout/openingstijden_bg.gif) -1px 0 no-repeat; height: 150px; padding: 5px; }
		  #openingstijden h2 { color: #fff; background: none; }
		  #openingstijden p { color: #fff; background: none; }
		  
/***************************************************
5. Footer	****************************************
***************************************************/
		
		#footer	{ width:100%;padding: 10px 0 0 0; }	
		  #footer address, #footer p { float: left; }
		      #footer p { margin-left: 150px; }
		      #footer address { margin-right: -150px; }
/***************************************************
6. Navigatie	************************************
***************************************************/
		
		#navigatie	{ height:47px; min-height:47px; margin:0 auto;}
			#menu_hoofd	{ width:950px; height:30px; min-height:30px; margin:10px 17px 0 10px; position:absolute;}
				#menu_hoofd li	{ text-align:center; float:left; display:block; height:30px; margin:0 5px 0 5px; min-height:30px; }
					#menu_hoofd li a	{ display:block; height:30px; min-height:30px; }
	
/***************************************************
7. Formulieren	************************************
***************************************************/
	
		#searchstring	{ border:0px; position:absolute; margin:7px 0 0 10px; color:#666; width:150px;}
		#searchbutton	{ background:url(../images/layout/bg_searchbutton.gif) no-repeat; border:none; width:22px; height:22px; min-height:22px; position:absolute; margin:3px 0 0 166px; cursor:pointer;}
		
		img#form_top { margin-bottom: -6px; }
		img#form_bottom { margin-bottom: 8px!important; }
		
		img#form_big_top { margin-bottom: -6px; }
		img#form_big_bottom { margin-bottom: 8px!important; }
		
form  {
	background: #f0f0f0;
	font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana';
}

p.error_inlog {
	margin: 0 0 0 20px!important;
}

form ol li {
	list-style: none;
	padding: 6px 0 0 0;
}

form ol li label {
	width: 140px;
	float: left;
	font-weight: bold;
	color: #666;
	text-align: left;
	margin-right: 7px;
	padding-top: 4px;
	display: block;
}

form ol li input, form ol li input.small {
	width: 189px;
	height: 21px;
	color: #666;
	background:url(../images/layout/input_bg.gif) no-repeat;
	border: none;
	padding-top: 5px;
	margin-bottom: 5px;
}

/*
form ol li input.small {
	width: 50px;
}
*/

form ol li textarea {
	clear: both;
	color: #666;
	width: 270px;
	height: 150px;
	background:url(../images/layout/textarea_bg.gif) no-repeat;
	border: none;
	font: normal 11px 'Lucida sans unicode', 'Lucida Grande', 'Arial';
}

form ol li select {
	height: 22px;
	font: normal 11px 'Lucida sans unicode', 'Lucida Grande', 'Arial';
}

form#form-newsletter ol li {
	list-style: none;
	padding: 8px 0 0 0;
	margin: 0;
	border-left: none;
	float: left;
	height: 33px;
}

form#form-newsletter ol li label {
	clear: both;
	text-align: left;
	margin: 0;
	width: 186px;
}

form#form-newsletter ol li input {
	width: 190px;
	border: 0;
	padding-top: 3px;
	height: 22px;
}

form#form-newsletter li input.button-newsletter {
	width: 14px;
	height: 24px;
	border: 0;
  cursor: pointer;
}

form#form-newsletter li.submit-newsletter {
	float: left;
	padding: 0;
	margin: 0;
	width: 14px;
	height: 24px;
	padding: 8px 0 0 0;
}

input[type=checkbox]{
  clear: both;
  width: 15px;
  height: 15px;
  background: #f0f0f0;
  margin-right: 30px!important;
}

#form_col_left{ float: left; width: 420px; margin-bottom: 20px; }
  .col_label { float: left; width: 300px; }
  
li.error-newsletter {
	clear: both;
}

label.enl {
	margin: 0;
	padding: 2px;
	background: #f00;
	font: normal 11px 'Lucida sans unicode', 'Lucida Grande', 'Arial';
	color: #fff;
}

label.placeholder {
	width: 14px;
	height: 14px;
	float: left;
}

label.error {
	background: url('../images/layout/form-error.gif') no-repeat;
	width: 14px;
	height: 14px;
	margin-top: 6px;
	float: left;
}

label.valid {
	background: url('../images/layout/form-valid.gif') no-repeat;
	width: 14px;
	height: 14px;
	margin-top: 6px;
	float: left;
}

input.newsletter {
	float: left;
	width: 20px;
	margin: 5px 5px 0 0;
}

label.newsletter {
	width: 600px;
	text-align: left;
}

li.submit {
	clear: both;
	padding: 20px 0 10px 327px;
}

li.submit input {
	height: 26px;
	width: 83px;
	background: url('../images/layout/verzend_bg.png') right no-repeat;
	font: normal 14px 'Lucida sans unicode', 'Lucida Grande', 'Verdana';
	color: #fff;
	border: 0;
	margin: 0 0 0 28px;
	padding: 0 0px 3px 0;
	cursor: pointer;
}

ul.errors li {
	font: normal 11px 'Lucida sans unicode', 'Lucida Grande', 'Arial';
	color: #f00;
	background: url('/interactive/images/ff/form-error.gif') no-repeat 1px;
	padding: 0 0 0 25px;
	line-height: 2;
}
      
      
form#searchHouse { background: none; }
form#form_forward_residence ol li label { width: 200px; }
/***************************************************
8. Aanbod zoekfunctie	******************************
***************************************************/

    #searchHouses { height: 270px; background:url(../images/layout/searchhouse_bg.gif) 0 0 no-repeat; }
      #searchHousesContainer { width: 205px; overflow: hidden; }
      #searchHouses h2 { background: none; }
    
/***************************************************
9. Nieuws	******************************
***************************************************/

    .newsitem { margin: 10px 0 25px 0; width: 200px; }
      .newsdate{ color: #bbb; margin-top: 15px;}
      .newstitle a { font-weight: bold; color: #e29b0e; }
      .newsfeed a { color: #666; }
      
/***************************************************
10. Dropdowns	******************************
***************************************************/

dl.dropdown, dl.dropdown2, dl.dropdown3, dl.dropdown4 { margin: 9px 0 18px 15px; }
.dropdown dd, .dropdown dt, .dropdown ul,  .dropdown2 dd, .dropdown2 dt, .dropdown2 ul,  .dropdown3 dd, .dropdown3 dt, .dropdown3 ul, .dropdown4 dd, .dropdown4 dt, .dropdown4 ul { margin: 0; padding: 0; }
.dropdown dd, .dropdown2 dd, .dropdown3 dd, .dropdown4 dd { position: relative; }
.dropdown a, .dropdown a:visited, .dropdown2 a, .dropdown2 a:visited, .dropdown3 a, .dropdown3 a:visited, .dropdown4 a, .dropdown4 a:visited  { color: #e29b0e; text-decoration: none; font-weight: normal;}
.dropdown a:hover, .dropdown2 a:hover, .dropdown3 a:hover, .dropdown4 a:hover { color: #e29b0e;}
.dropdown dt a:hover, .dropdown2 dt a:hover, .dropdown3 dt a:hover, .dropdown4 dt a:hover { color: #e29b0e; }
.dropdown dt a, .dropdown2 dt a, .dropdown3 dt a, .dropdown4 dt a {background: url(../images/layout/dropdown_bg.png) no-repeat scroll right center; display: block;width: 189px; height: 24px; padding: 2px 0 0 0;}
.dropdown dt a span, .dropdown2 dt a span, .dropdown3 dt a span, .dropdown4 dt a span {font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; text-transform: uppercase; cursor: pointer; display: block;padding: 3px 0 3px 13px; }
.dropdown dd, .dropdown2 dd, .dropdown3 dd, .dropdown4 dd {  z-index: 9999; }
.dropdown dd ul, .dropdown2 dd ul, .dropdown3 dd ul, .dropdown4 dd ul { background: #fff none repeat scroll 0 0; left: 0; display: none; padding: 5px 0; height: 300px; overflow-y: scroll; overflow-x: hidden;position: absolute;z-index: 9999; top:1px; width: auto; min-width: 189px; list-style: none;}
.dropdown dd ul li a, .dropdown2 dd ul li a, .dropdown3 dd ul li a, .dropdown4 dd ul li a { padding: 3px 0 3px 13px; display: block;}
.dropdown dd ul li a:hover, .dropdown2 dd ul li a:hover, .dropdown3 dd ul li a:hover, .dropdown4 dd ul li a:hover { background-color: #e29b0e; color: #fff;}


.searchHouseSubmit { border: none; background: url(../images/layout/searchbutton_bg.png) no-repeat; width: 53px; height: 26px; float: right; padding: 0 0 0 0; margin: 0 5px 0 0; font: normal 14px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #fff; cursor: pointer; }


.dropdownselect { background: url(../images/layout/dropdown_bg.png) 0 0 no-repeat scroll; display: block;width: 220px; height: 26px; margin: 10px 0 15px 12px; padding: 2px 0 3px 10px; border: none; font: normal 14px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; }
  .dropdownselect option { color: #e29b0e; }
  .dropdownselect option:hover { background: #e29b0e; color: #fff; }
/***************************************************
10. Sitemap	******************************
***************************************************/

ul#sitemap li { border-bottom: 1px solid #e7e7e7; width : 250px; color: #e29b0e; }
ul#sitemap li ul li { border-bottom: none; width : 250px;}
  ul#sitemap li a { font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #e29b0e; display: block; padding: 8px 0 8px 6px; width: 204px; }
  ul#sitemap li a:hover { color: #e29b0e; }
  ul#sitemap li ul li a { font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666; display: block; padding: 8px 0 8px 6px; width: 204px; }
  ul#sitemap li ul li a:hover { color: #e29b0e; }

  
/***************************************************
11. Archief	******************************
***************************************************/

#form-newsarchive { padding: 5px; font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666;}
  #select-archiveyear { height: 22px; font: normal 12px 'Lucida sans unicode', 'Lucida Grande', 'Verdana'; color: #666;}
  #archcore li { margin: 3px 0 3px 0; }