/* Header styles */

body {
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 10px;
}

td {
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 10px;
}

DIV#header {
  display          : relative;
  width            : 90%;
  margin           : 10px 10px 10px 10px;
  font-family      : Verdana, Arial, Helvetica, sans-serif;
}
DIV#headerCaption {
  display          : relative;
  width            : 100%;
  padding-top      : 10px;
  font-size        : 24px;
}
DIV#headerDescription {
  display          : relative;
  width            : 100%;
  padding-top      : 10px;
  padding-bottom   : 10px;
  font-size        : 10px;
}

/* Content styles */
DIV#content {
  display          : relative;
  width            : 90%;
  margin           : 10px 10px 10px 10px;
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-size        : 10px;
}

  /* progressBar styles */
#progressBar {
  position: relative;
  height: 9px;
}

#progressGraphic {
  position: relative;
  height: 9px;
}
#progressCaption {
  position: relative;
  height: 9px;
}
.progressCaptionItem {
  float: left;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 0.8em;  
  color: #414B56;
  font-weight: bold;
  background-color: #FFFFFF;
  width: 20px;
  margin-left: 1px;  
  text-align: center;
}

.progressBegin {
  float: left;
  width: 1px;
  height: 9px;  
  background-image: url(/themes/zoekopdracht/2230/images/templates/progressBegin.gif);
  background-repeat: no-repeat;
  background-position: top left;
}

.progressPart {
  float: left;
  width: 20px;
  height: 9px;
  background-image: url(/themes/zoekopdracht/2230/images/templates/progressPart.gif);
  background-repeat: no-repeat;
  background-position: top left;
}

.progressPartSelected {
  float: left;
  width: 20px;
  height: 9px;
  background-image: url(/themes/zoekopdracht/2230/images/templates/progressPartSelected.gif);
  background-repeat: no-repeat;
  background-position: top left;
}

.progressPoint {
  float: left;
  width: 1px;
  height: 9px;
  background-image: url(/themes/zoekopdracht/2230/images/templates/progressPoint.gif);
  background-repeat: no-repeat;
  background-position: top left;
}

.progressEnd {
  float: left;
  width: 1px;
  height: 9px;  
  background-image: url(/themes/zoekopdracht/2230/images/templates/progressEnd.gif);
  background-repeat: no-repeat;
  background-position: top left;
}

  /* Button styles */
.buttonRow {
  position            : relative;
  width               : 50%;
  margin-left         : 10px;  
  margin-top          : 10px;
  height              : 30px;
  clear               : both;
}
.buttonColumn {
  position            : relative;
  float               : left;
  width               : 90px;
}

.buttonColumn input {
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: bold;
  width: 80px;
  height: 21px;
 background-color    : #414B56;
  color				  : #ffffff
}


  /* TabbedDisplay styles */

.tabbedDisplay {
  display             : relative;
  width               : 90%;
}
.tabHeader {
  display             : relative;
  margin-top          : 10px;
  width               : 100%;  
}
.startOn {
  position            : relative;
  float               : left;
  width               : 12px;
  height              : 24px;
  background-image    : url("/themes/zoekopdracht/2230/images/templates/start_on.gif");
  background-position : left top;
  background-repeat   : no-repeat;
}
.onTab {
  position            : relative;
  float               : left;
  width               : 150px;
  height              : 24px;
  background-image    : url("/themes/zoekopdracht/2230/images/templates/tab_on.gif");
  background-position : left top;
  background-repeat   : repeat;
}
.onTab p {
  font-weight         : bold;
  padding-top         : 5px;
  padding-left        : 5px;
  padding-bottom      : 0px;
  padding-right       : 0px;
  margin              : 0px 0px 0px 0px;  
}
.endOn {
  position            : relative;
  float               : left;
  width               : 23px;
  height              : 24px;
  background-image    : url("/themes/zoekopdracht/2230/images/templates/end_on.gif");
  background-position : left top;
  background-repeat   : no-repeat;
}
.tabBody {
  position            : relative;
  width               : 100%;  
  border              : 1px solid #000000;
  padding             : 10px 10px 10px 10px;
  clear               : both;
}
.tabBody p {
  padding-top         : 3px;
  padding-left        : 5px;
  padding-bottom      : 0px;
  padding-right       : 0px;
  margin              : 0px 0px 0px 0px;
}
.sectionHeader {
  position            : relative;
  width               : 100%;
  height              : 15px;
  padding-top         : 3px;
  padding-left        : 5px;
  border-bottom       : 1px solid #000000;
  background-color    : #C6C7C6;
  font-weight         : bold;
  color               : #FFFFFF;
  margin-top          : 10px;
  clear               : both;
}
.sectionBody {
  position            : relative;
  width               : 100%;
}
.column1 {
  position            : relative;
  float               : left;
  width               : 300px;
  padding-left        : 10px;
  padding-top         : 10px;
  padding-bottom      : 10px;
}
.column2 {
  position            : relative;
  float               : left;
  width               : 300px;
  padding             : 10px;
}
.inputBody {
  position            : relative;
  float               : left;
  margin-bottom       : 3px;
  width               : 100%;
  
}
.inputRequired {
  position            : relative;
  float               : left;
  width               : 20px;
  height              : 100%;
  background-image    : url("/themes/zoekopdracht/2230/images/templates/werkplaats/verplicht.gif");
  background-position : center;
  background-repeat   : no-repeat;
}
.inputNotRequired {
  position            : relative;
  float               : left;
  width               : 20px;
  height              : 100%;
}
.inputCaption {
  position            : relative;
  float               : left;
  width               : 80px;
  height              : 100%;
  padding-top         : 3px;
  font-weight         : bold;
}

.inputCaption a {
  font-weight         : bold;
  color               : #000000;
  text-decoration     : none;
 }

.inputCaptionInvalid {
  position            : relative;
  float               : left;
  width               : 100px;
  height              : 100%;
  padding-top         : 3px;
  color               : #FF0000;
  font-weight         : bold;  
}

.inputValue {
  position            : relative;
  float               : left;
  width               : 200px;
  padding-top         : 3px;
  padding-left        : 10px;
}

.inputValue input {
  width               : 130px;
  font-family         : Verdana, Arial, Helvetica, sans-serif;
  font-size           : 10px;
}

.inputValue textarea {
  font-family         : Verdana, Arial, Helvetica, sans-serif;
  font-size           : 10px;
  width               : 180px;
}

.inputValue select {
  width               : 137px;
  font-family         : Verdana, Arial, Helvetica, sans-serif;
  font-size           : 10px;
} 

.inputValue img {
  margin-left        : 10px;
  cursor              : pointer;
}

.columnOpties {
  position            : relative;
  float               : left;
  width               : 200px;
  padding-left        : 10px;
  padding-top         : 10px;
  padding-bottom      : 10px;
}

.inputBodyOpties {
  position            : relative;
  float               : left;
  margin-bottom       : 3px;
  width               : 100%;
  
}
.inputCaptionOpties {
  position            : relative;
  float               : left;
  width               : 130px;
  height              : 100%;
  padding-top         : 3px;
  font-weight         : bold;
}
.inputValueOpties {
  position            : relative;
  float               : left;
  width               : 30px;
  height              : 100%;
  padding-top         : 3px;
  padding-left        : 10px;
}

/* DROPDOWN STYLES */
.dropDownCaption {
  width              : 100%;
  height             : 18px;
  color              : #000000;
  border-right       : 1px solid #000000;  
  border-bottom      : 1px solid #000000;    
}
h4 {
  font-family        : Verdana, Arial, Helvetica, sans-serif;
  font-size          : 10px;
  margin             : 0px 0px 0px 0px;
  background-position: center right;
  background-repeat  : no-repeat;
  cursor             : pointer;
}

/* Footer styles */
DIV#footer {
  display          : relative;
  width            : 90%;
  margin           : 10px 10px 10px 10px;
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-size        : 10px;
}

.yellowbg {
  background-color          : #F8F8D1;
}

.lightgrayheader {
  font-family               : Verdana, Arial, Helvetica, sans-serif;
  font-size                 : 10px;
  font-weight               : bold;
  color                     : #FFFFFF;
  background-color          : #C6C7C6;
  padding                   : 3px;
}