/* Default stylesheet */
body {
  padding: 1em 0;
  margin: 0;
  background-color: white;
}

/* Tekstvelden en area's lettertypes */
body, p {
  font-weight: normal;
  font-family: arial, tahoma, sans-serif;
}

/* Multiselect box font zelfde grootte als input fields */
input, option, select, textarea {
  font-weight: normal;
  font-family: arial, tahoma, sans-serif;
  font-size: 100%;
}

#header {
  width: 5096%;
  border: 0;
  text-align: center;
  max-width: 1024px;

}
#header-content {
  padding-bottom: 0px;
}

/* Wrapper om menu en main */
#content {
  width: 96%;
  text-align:left;
  max-width: 1024px;
  background: white url(../images/back200pxblue.gif) repeat-y scroll 0 top;
}

#menu {
  float: left;
  width: 198px;
  
background: #E10000 url(../media/logomenu.jpg) center top no-repeat;
padding-top:25px;




}
#menu-content {
}
#menu a {
  color: white;
  text-decoration: none;

}
#menu a:hover, #menu li:hover {
  background-color: #E10004;
}
#menu ul {
  margin: 100px 0 0 0;
  padding: 0;
  list-style-type: none;   
  border-bottom: 1px solid #E10000;

}
#menu .active {
  background-color: #E10008;
}

#menu li {
  padding: 1px 0 1px 28px;
  background: transparent url(../images/menu_arrow.gif) no-repeat scroll 4px center;
  border-top: 1px solid #E10020;
}

#main {
  margin:0 0 0 200px;
  min-height: 430px;
  background: url(../images/backskyline.jpg) no-repeat scroll right bottom;
  border: 1px solid #283c83;
  border: 0;
}
#main-content {
  padding: 0.5em 1em 2em 2em;
}

#footer {
  width: 96%;
  max-width: 1024px;
}
#footer-content {
  text-align: right;
  padding: .5em 0 .5em 0;
}

hr.cleaner {
  clear: both;
  height: 1px;
  margin: -1px 0 0 0;
  padding: 0;
  border: none;
  visibility: hidden;
}

p {
    color: black;
    margin: 0;
    padding: 0 0 .5em 0;
}

/* Standaard verwijzingen. */
a {
  color: #283c83; /* blue; */
  text-decoration: underline;
  white-space: nowrap;
}

h1 {
  color: #283c83;
  font-weight: bold;
  font-size: 120%;
  padding: 0 0 .5em 0;
}

h2 {
  color: #283c83;
  font-weight: normal;
  font-size: 120%;
  padding: .5em 0;
}

img {
  border: 0;
}

/* Titel van de website */
#header h1 {
  display: block;
  float: left;
  padding: 1em 1em 0 1em;
  margin: 0;
  font-size: 50px;
  color: white;
background: white url(../media/logomenu.jpg) no-repeat scroll 0 top;
display:none;
}

.verplicht {
    color: red;
    font-weight: bold;
}

/* Een woord waarvoor een help tooltip beschikbaar is */
.helplink {
    cursor: help;
    text-decoration: none;
    background: url(../images/underline_animatie.gif) bottom left repeat-x;
}
.helptekst {
	width: 200px;
    font-size: 80%;
	background-color: #feffb3;
	border: 1px solid #808090;
	padding: 10px 5px 4px 5px;
	background: #eff0af url(../images/achtergrond_geel.gif) top left;
}
.helpshadow {
	width: 200px;
	font-size: 80%;
	background-color: #feffb3;
	border: 1px solid #808090;
	padding: 10px 5px 4px 5px;
}

/* Een error blok (meestal bovenaan in het venster) */
.error {
  color: white;
  font-weight: bold;
  text-align: center;
  padding: .5em;
  background-color: red;
}

/* Errormessage evt afgedrukt naast een textfield */
.errormessage {
  color: red;
  font-weight: bold;
  margin-left: 1em;
}

/* Een actie is succesvol uitgevoerd */
.success {
  color: #009865;
  font-weight: bold;
}



/**
 * Stylen voor HTML formulieren.
 */
form {
  border: none;
  margin: 0;
  padding: 0;
}
select, option {
  padding-left: 2px;
}
select {
  min-width: 10em;
}
input.text, textarea, select {
  margin: 0.1em 0 0.2em 0;
  border: 1px solid;
  border-color: #283c83; /* blue; */
  /* background-color: #e8e8e7; */
  background-color: white;
  padding: 1px;
  margin-left: 10em; /* maak ruimte voor een label */
  display: block;
}

/* Instellingenvan hierboven resetten voor select in selectdummy */
.fieldcontainer select, .fieldcontainer input, .fieldcontainer textarea {
  margin: 0;
  padding: 0;
  display: inline;
}
.fieldcontainer {
  margin: 0.1em 0 0.2em 0;
  padding: 1px;
  margin-left: 10em; /* maak ruimte voor een label */
  display: block;
}
textarea:focus, input.text:focus {
  background-color: white;
}
label {
  display: block;
  font-weight: normal;
  white-space: nowrap;
  float: left;
}
/* Form buttons */
.buttons {
  border-width: 1px;
  border-style: solid;
  text-decoration: none;
  text-align: center;
  background-image: url(../images/bgcolor.gif);
  border-color: #99a black black #99a;
  font-weight: normal;
  font-size: 14px;
  font-family: arial,tahoma,sans-serif;
  margin: 2px 5px 2px 0;
}
fieldset {
  text-align: left;
  padding: 10px 20px 15px 20px;
  margin: 0 0 20px 0;
}
legend {
  color: #283c83;
  font-weight: normal;
  margin: 0;
  padding: .5em .5em 1em 0;
}
input.middel, textarea.middel, select.middel, div.middel {
  width: 18em;
}
input.klein, div.klein {
  width: 6em;
}
select.klein {
  width: 8em;
  min-width: 8em;
}

/* Default definitionlist. */
dl {
  margin: 0.4em 0 0 0;
  padding: 0 0 0.1em 0;
  display: block;
  font-size: 100%;
}
dt {
  font-weight: normal;
  font-size: 100%;
  white-space: nowrap;
  float: left;
  width: 12em;
  padding: 0;
  line-height: 1.3em;
}
dd {
  font-weight: normal;
  font-size: 100%;
  margin-left: 12em;
  line-height: 1.3em;
}


/* Styles voor op de foto's pagina. */
#fotopagina {
  background-color: #e6e9ef;
  padding: 2px;
  text-align: center;
}
#fotos-adres {
  text-align: center;
  font-weight: bold;
  padding: .5em 0;
}
#fotos-groot {
  width: 602px;
  height: 460px;
  border: 0;
  overflow: auto;
  margin: 0 auto;
}
#fotos-groot img {
  border: 1px solid #283c83;
}
#fotos-caption {
  font-style: italic;
  width: 602px;
  padding: .5em;
  margin: 0 auto;
  background-color: #ccc;
  min-height: 1.5em;
}
#fotos-previews {
  text-align: center;
}
#fotos-previewfotos {

  width: 650px;
  height: 144px;
  overflow: auto;
  border: 0;
  margin: 0 auto;
}
#fotos-previewfotos img {
  border:1px solid #283c83;
}


/* De navigatorbar voor het overichtzscherm. */
.navigatorbar {
  background-color: #E10000;
  border: 0;
  padding: 2px;
  margin: 0 0 10px 0;
  text-align: center;
  color: white;
  font-weight: bold;
}
.navprevious {
  margin-right: 10px;
  margin-left: 0;
}
.navnext {
  margin-left: 10px;
  margin-right: 0;
}
.navcurrentpage {
  border: 1px solid white;
  margin-left: 2px;
  margin-right: 2px;
  padding-left: 1px;
  padding-right: 1px;
}
.navlink {
  color: white;
  font-weight: bold;
  text-decoration: underline;
}
.navpage {
  margin-left: 3px;
  margin-right: 3px;
}


/* Stijlen voor de overzichtspagina. */
.object-overzicht {
  margin: 0;
  clear: right;
}
.object-overzicht-odd {
  background-color: #e6e9ef;
  padding: 5px 10px 0 10px;
  border-bottom: 1px solid #a0a0a0;
}
.object-overzicht-even {
  background-color: transparent;
  padding: 5px 10px 0 10px;
  border-bottom: 1px solid #a0a0a0;
}
.object-overzicht .aandachtstrekker {
  background-color: yellow;
  color: #283c83;
  text-align: center;
  padding: 1px;
  margin: 0 0 3px 0;
  border: 1px solid darkkhaki;
}
.object-overzicht .status {
  display: inline;
  font-weight: bold;
}
.object-overzicht .objectoptie {
  display: inline;
  font-weight: bold;
  font-size: 80%;
  color: red;
}
.object-overzicht .adres {
  display: inline;
  font-weight: bold;
}
.object-overzicht dl.beschrijving-details {
  padding: .5em 0 0 0;
  border: 0;
  margin-left: 142px;
  padding-bottom: 1.5em;
}
.object-overzicht dl.beschrijving-details dt {
  font-weight: normal;
  font-size: 80%;
  color: #a0a0a0;
  white-space: nowrap;
  width: auto;
  display: inline;
  margin: 0;
  padding: 0;
}
.object-overzicht dl.beschrijving-details dd {
  font-weight: normal;
  font-size: 80%;
  padding: 0;
  margin: 0 0 0 8.5em;
}
/* Details van enkel object (boven reactiepagina, e-mailpagina, statistiekenpagina enz.) */
.object-overzicht-single {
  background-color: #e6e9ef;
  padding: 5px 10px 0 10px;
  border-bottom: 1px solid #283c83;
  border-top: 1px solid #283c83;
  margin-bottom: 25px;
  margin-top: 15px;
}
.object-overzicht-single .object-overzicht {
  margin: 0;
  clear: right;
  min-height: 134px;
}
/* Vraagprijs op overzichtspagina. */
.vraagprijs {
  font-weight: bold;
}

/* Stijlen voor de detailpagina. */
#object-details {
  background-color: #e6e9ef;
  border-top: 1px solid #283c83;
  border-bottom: 1px solid #a0a0a0;
  padding: 10px 0 10px 0;
}
#object-details-adres {
  font-weight: bold;
  margin-bottom: 3px;
}
#object-details .aandachtstrekker {
  background-color: yellow;
  text-align: center;
  padding: 0 10px;
  color: black;
}
#object-details .statusverkocht {
  color:white;
  background-color: red;
  font-weight: bold;
  padding: 0 1em;
}
#object-details .objectoptie {
  display: inline;
  font-weight: bold;
  font-size: 80%;
  color: red;
}
#object-details .buttons-details {
  margin: 0.4em 0 0 0;
  float: right;
  padding-right: 20px;
}
#object-details dl.beschrijving-details {
  margin: 0.4em 0 0 0;
  padding: 0 0 0.1em 0;
  display: block;
}
#object-details dl.beschrijving-details dt {
  font-weight: normal;
  font-size: 100%;
  color: #a0a0a0;
  white-space: nowrap;
  float: left;
  width: 13em;
  padding-left: 1em;
}
#object-details dl.beschrijving-details dd {
  font-weight: normal;
  font-size: 100%;
  margin-left: 14em;
  padding-right: 1em;
}
#object-details-extra {
  background-color: #e6e9ef;
  border-bottom: 1px solid #283c83;
  padding: 10px 0;
}
#object-details-extra dl.beschrijving-details {
  margin: 0.4em 0 0 0;
  padding: 0 0 0.1em 0;
  display: block;
}
#object-details-extra dl.beschrijving-details dt {
  font-weight: normal;
  font-size: 100%;
  color: #a0a0a0;
  white-space: nowrap;
  float: left;
  width: 13em;
  padding-left: 1em;
}
#object-details-extra dl.beschrijving-details dd {
  font-weight: normal;
  font-size: 100%;
  margin-left: 14em;
  padding-right: 1em;
}
#object-details-extra ul {
  margin: 0 0 0 1em;;
  padding: 0;
}
#object-details-extra li {
  list-style-type: circle;
  margin: 0;
  padding: 0;
}
#toggle-and-back-button {
  padding: 10px 0 0 0;
}
#toggle-button {
  float: right;
}
#object-details-fotos {
  float: left;
  width: 300px;
}
#object-details-omschrijving {
  margin-left: 320px;
}


/**
 * Instellingen persoonlijke pagina klant van makelaar.
 */
.logboek {
  margin: 0.1em 0 0.2em 0;
  border: 1px solid;
  border-color: #283c83; /* blue; */
  background-color: #e8e8e7;
  padding: .5em;
}
#statistieken {
  width: 630px;
  height: 260px;
  border-width: 0px;
  background-color: transparent;
}
dl#persoonlijkegegevens {
  margin: 1em;
}
/* selectbuttons en submitbutton statistiekenpagina makelaar */
fieldset.statistieken-monthyearbutton {
  padding: 0;
  margin: 1em 0;
  border: 0;
}
fieldset.statistieken-monthyearbutton select, fieldset.statistieken-monthyearbutton select input {
  display: inline;
  margin: 0;
}


/**
 * De knoppen op detail en overzichtspagina.
 */
div.beschrijving-buttons {
  margin-top: 2em;
  float: right;
}
a.button-kaart:hover {
  background: url(../images/knop_kaart_over.gif) no-repeat left 3px;
  padding-left: 22px;
}
a.button-kaart {
  background: url(../images/knop_kaart.gif) no-repeat left 3px;
  padding-left: 22px;
  display: block;
}
a.button-email:hover {
  background: url(../images/knop_email_over.gif) no-repeat left 3px;
  padding-left: 22px;
}
a.button-email {
  background: url(../images/knop_email.gif) no-repeat left 3px;
  padding-left: 22px;
  display: block;
}
a.button-bel:hover {
  background: url(../images/knop_bel_over.gif) no-repeat left 3px;
  padding-left: 22px;
}
a.button-bel {
  background: url(../images/knop_bel.gif) no-repeat left 3px;
  padding-left: 22px;
  display: block;
}
a.button-print:hover {
  background: url(../images/knop_print_over.gif) no-repeat left 3px;
  padding-left: 22px;
}
a.button-print {
  background: url(../images/knop_print.gif) no-repeat left 3px;
  padding-left: 22px;
  display: block;
}

/* Een element in het algemeen rechts uitlijnen. */
.right {
  float: right;
}

/* Schaduwrand: Zie http://www.alistapart.com/articles/cssdrop2 */
/* De schaduw op een (standaard) lichtblauwe achtergrond */
.previewimage {
  float: left;
  background: url(../images/shadow.gif) no-repeat bottom right;
  margin: 6px 0 0 0;
}

/* Fuzzy of massieve bedekkende rand */
.previewimage div {
  background: url(../images/shadow2.png) no-repeat left top !important;
  background: url(../images/shadow2.gif) no-repeat left top;
  padding: 0 5px 2px 0;
}

/* De schaduw op een _WITTE_ achtergrond */
.object-overzicht-even .previewimage {
  float: left;
  background: url(../images/shadow_wit.gif) no-repeat bottom right;
}

/* Fuzzy of massieve bedekkende rand */
.object-overzicht-even .previewimage div {
  background: url(../images/shadow2_wit.png) no-repeat left top !important;
  background: url(../images/shadow2_wit.gif) no-repeat left top;
  padding: 0 5px 2px 0;
}

/* De schaduw op een witte achtergrond */
.previewimage-wit {
  float: left;
  background: url(../images/shadow_wit.gif) no-repeat bottom right;
}

/* Fuzzy of massieve bedekkende rand */
.previewimage-wit div {
  background: url(../images/shadow2_wit.png) no-repeat left top !important;
  background: url(../images/shadow2_wit.gif) no-repeat left top;
  padding: 0 5px 2px 0;
}

/* De foto met 4 pixels padding */
.previewimage img {
  position: relative;
  background-color: white;
  border: 1px solid #a9a9a9;
  padding: 4px;
}

/* De foto met 4 pixels padding */
.previewimage-wit img {
  position: relative;
  background-color: white;
  border: 1px solid #a9a9a9;
  padding: 4px;
}

/* Ruimte om de kleinste versies van de foto's op de detailpagina. */
.previewimage-padding {
  float: left;
  padding: 2px 0px 2px 8px;
  min-width: 135px;
}

/* Javascript enabled multiselectbox. */
.multiselect label {
  float: none;
}
.multiselect {
  min-height: 5em;
}
.unimportant {
	color: #888;
	font-weight: bold;
}

/* Uitlogknop op klantenpagina */
#logout {
	float: right;
}


/*
 * Opmaak van tabellen tbv statistieken.
 * Zie http://veerle.duoh.com/comments.php?id=315_0_2_0_C 
 */
table {
  font: normal 12pt "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
  border-collapse: collapse; /* removes the cellspacing */
  border: 0;
  margin-bottom: 1em;
}
caption {
  padding: 0 0 5px 0;
  font-style: italic;
  caption-side: bottom;
  color: #4f6b72;
  margin-top: -1em;
  text-align: left;
}
th {
  background: #95c0ef url(../images/makelaar/bg_header.gif) no-repeat;
  padding: 2px .5em 2px 12px;
  font-weight: bold;
  border-right: 1px solid #c1dad7;
  border-bottom: 1px solid #c1dad7;
  border-top: 1px solid #c1dad7;
  letter-spacing: 2px;
  text-align: left;
  color: #4f6b72;
}
th.nobg {
  border-top: 0;
  border-left: 0;
  border-right: 1px solid #c1dad7;
  background: none;
}
/* Table header voor sorteren */
/* Sortable tables */
table.sortable a.sortheader {
  text-decoration: none;
  display: block;
}
table.sortable span.sortarrow {
  color: black;
  text-decoration: none;
}
.uparrow {
  background: url(../images/makelaar/uparrow.png) no-repeat right center;
}
.downarrow {
  background: url(../images/makelaar/downarrow.png) no-repeat right center;
}
td {
  border-right: 1px solid #c1dad7;
  border-bottom: 1px solid #c1dad7;
  background: white;
  color: black;
  padding: 2px .5em 2px 12px;
}
tr.alt td {
  background: #f5fafa;
  color: black;
}
th.spec {
  border-left: 1px solid #c1dad7;
  border-top: 0;
  background-color: #fff;
  font-size: 11px;
  background-image: none;
  background: #fff url(../images/makelaar/bullet1.gif) no-repeat;
}
th.specalt {
  border-left: 1px solid #c1dad7;
  border-top: 0;
  background-color: #f5fafa;
  font-size: 11px;
  color: #797268;
}
/* Getallen in een cel rechts uitlijnen */
td.number {
  text-align: right;
}
/* Groene balk voor stats aantal hits/visits. */
.statbar-green {
  background: url(../images/makelaar/green.gif) no-repeat;
  width: 100px;
  padding-left: 2px;
}
/* Datum in niet proprtioneel lettertype, zodat onder elkaar uitgelijnd */
.datum-kort {
	font-family: Courier New, Courier, monospace;
	white-space: nowrap;
}
.hidden {
  display: none;
}
/* Minimale breedte van een tabel. */
table.mintablewidth {
  width: 300px;
}

/* Fix om form velden in tabellen mogelijk te maken */
.formtable {
	border: 0;
}
.formtable td, .formtable table {
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
}

.formtable input, .formtable .text, .formtable select, .formtable textarea {
	min-width: 0;
	margin: 2px;
}

.formtable label {
	display: inline;
	float: none;
	margin-right: .5em;
	font-family: arial, tahoma, sans-serif;
}