/*Main elements*/

div.mpform {width:90%;}
div.mpform table {border-collapse:collapse; width:90%;}
div.mpform td {vertical-align:top; text-align:left; padding:10px 0 10px 2px;}

div.mpform a img { border:0;}


/*columns width*/
div.mpform .mpform_title {width:20%;}
div.mpform .mpform_help {width:20px;}
div.mpform .mpform_field {width:76%;}

/* all fields:*/
div.mpform input, div.mpform textarea,  div.mpform select {
	width:98%;
	background-color:#eee;
	border: 1px solid #bbb;
	padding:2px;
}

div.mpform input:hover, div.mpform input:focus,div.mpform textarea:hover, div.mpform textarea:focus,div.mpform select:hover, div.mpform select:focus {
	background-color:#fff;
	border: 1px solid #000;
}

/*required*/
div.mpform .mpform_required input, div.mpform .mpform_required textarea, div.mpform .mpform_required select {
border: 2px solid;
}

 .mpform_title span {	
	color:red;
}


/*Error*/
div.mpform .mpform_error {
	background-color:#FFCCCC; 
	border: 2px solid red;
}

div.mpform .mpform_error .mpform_title {
	color:red;
	font-weight: bold;
	padding-left:5px;
}


/*Exceptions / special fields:*/

/*heading*/
div.mpform .mpform_heading {}

/*checkbox*/
div.mpform .mpform_checkbox input {
	margin:0;
	padding:0;
	width:20px;
	background-color:transparent;
	border: none;
}
div.mpform .mpform_checkbox label {	
	padding:0 30px 0 2px;	
}



/*radiobuttons*/
div.mpform .mpform_radio input {
	width:20px;
	background-color:transparent;
	border: none;
}
div.mpform .mpform_radio label {	
	padding:0 20px 0 2px;	
}


/*integer*/
div.mpform .mpform_integer input {}

/*float*/
div.mpform .mpform_float input {}

/*captcha*/
div.mpform .mpform_captcha input {}

/*Submit*/
div.mpform .mpform_submit {
	width:200px;
	float: right;
	cursor: pointer;
	border: 2px solid #999;	
	color:#000;
}

div.mpform .mpform_submit input:hover {
	border: 2px solid #333;
}


/*Fieldset*/
div.mpform fieldset {width:99%;}

div.mpform legend {
	padding:2px 10px 0 10px;	
	border-left: 1px solid #666;
	border-top: 1px  solid #666;
	border-right: 1px  solid #666;
	font-weight: bold;
}



/*help*/

.mpform_help_box_td {
	border:1px solid #336699;
	background-color:#ECF3F7;
	color:#003366;
	padding:0 ! important;
	width:70%;
}

.mpform_help_box_div {
	color:#003366;
	background-color:#ECF3F7;
	XXwidth:78%;
}

.mpform_help_box_hr { 
	color:#336699; 
	margin:0 ! important;
	padding:0 ! important;
	line-height:1px;
}

div.mpform p.help_txt { color:#600; }


h5.mpform_help_box_h5 {
	color:#036;
	background-color:transparent; 
	font-size:0.8em;
	font-weight:normal;
	line-height:100%;
	margin: 4px 0 0 4px;
	padding:0;
}

.mpform_help_box_h6 {
	color:#036;
	background-color:transparent; 
	font-size:0.7em;
	font-weight:normal;
	line-height:100%;
	margin:0 0 4px 4px;
	padding:0;
}


/* styles when using divs instead of tables */
div.mpform div.questionbox {
  clear: left;
  float:left;
  width:180px;
  height:auto;
  background:#ffd;
  padding: 4px;
  margin: 2px 0px 2px 2px;
  border-width: 1px 0px 1px 1px;
  border-style: solid;
  border-color: #aa3;
  text-align: right;
}

div.mpform fieldset div.questionbox {
  clear: left;
  float:left;
  width: 172px;
  height:auto;
  background:#ffd;
  padding: 4px;
  margin: 2px 0px 2px 2px;
  border-width: 1px 0px 1px 1px;
  border-style: solid;
  border-color: #aa3;
  text-align: right;
}

div.mpform div.answerbox {
  float:left;
  width: 412px;
  height:auto;
  background:#ffd;
  padding: 4px;
  margin: 2px 2px 2px 0;
  border: 1px solid #aa3;
}

div.mpform fieldset div.answerbox {
  float:left;
  width: 412px;
  height:auto;
  background:#ffd;
  padding: 4px;
  margin: 2px 2px 2px 0;
  border: 1px solid #aa3;
}

div.mpform div.submitbox {
  clear: both;
  float: left;
  width: 602px;
  height: 26px;
  padding: 8px;
  margin: 2px;
  text-align: center;
}

.mpform_submit {
    cursor: pointer;
    border: 2px solid #999;	
    color:#000;
    text-align: center;
    width: 200px;
    margin: 2px 2px 2px 180px;
}


/* >>> Start Calendar */
.calendar {
  position: relative;
  display: none;
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
  font-size: 11px;
  cursor: default;
  background: Window;
  color: WindowText;
  font-family: tahoma,verdana,sans-serif;
}

.calendar table {
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
  font-size: 11px;
  cursor: default;
  background: Window;
  color: WindowText;
  font-family: tahoma,verdana,sans-serif;
}

/* Header part -- contains navigation buttons and day names. */

.calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
  text-align: center;
  padding: 1px;
  border: 1px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
  background: ButtonFace;
}

.calendar .nav {
  background: ButtonFace url(http://orthointern/include/jscalendar/menuarrow.gif) no-repeat 100% 100%;
}

.calendar thead .title { /* This holds the current "month, year" */
  font-weight: bold;
  padding: 1px;
  border: 1px solid #000;
  background: ActiveCaption;
  color: CaptionText;
  text-align: center;
}

.calendar thead .headrow { /* Row <TR> containing navigation buttons */
}

.calendar thead .daynames { /* Row <TR> containing the day names */
}

.calendar thead .name { /* Cells <TD> containing the day names */
  border-bottom: 1px solid ButtonShadow;
  padding: 2px;
  text-align: center;
  background: ButtonFace;
  color: ButtonText;
}

.calendar thead .weekend { /* How a weekend day name shows in header */
  color: #f00;
}

.calendar thead .hilite { /* How do the buttons in header appear when hover */
  border: 2px solid;
  padding: 0px;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
}

.calendar thead .active { /* Active (pressed) buttons in header */
  border-width: 1px;
  padding: 2px 0px 0px 2px;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
}

/* The body part -- contains all the days in month. */

.calendar tbody .day { /* Cells <TD> containing month days dates */
  width: 2em;
  text-align: right;
  padding: 2px 4px 2px 2px;
}
.calendar tbody .day.othermonth {
  font-size: 80%;
  color: #aaa;
}
.calendar tbody .day.othermonth.oweekend {
  color: #faa;
}

.calendar table .wn {
  padding: 2px 3px 2px 2px;
  border-right: 1px solid ButtonShadow;
  background: ButtonFace;
  color: ButtonText;
}

.calendar tbody .rowhilite td {
  background: Highlight;
  color: HighlightText;
}

.calendar tbody td.hilite { /* Hovered cells <TD> */
  padding: 1px 3px 1px 1px;
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
}

.calendar tbody td.active { /* Active (pressed) cells <TD> */
  padding: 2px 2px 0px 2px;
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
}

.calendar tbody td.selected { /* Cell showing selected date */
  font-weight: bold;
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
  padding: 2px 2px 0px 2px;
  background: ButtonFace;
  color: ButtonText;
}

.calendar tbody td.weekend { /* Cells showing weekend days */
  color: #f00;
}

.calendar tbody td.today { /* Cell showing today date */
  font-weight: bold;
  color: #00f;
}

.calendar tbody td.disabled { color: GrayText; }

.calendar tbody .emptycell { /* Empty cells (the best is to hide them) */
  visibility: hidden;
}

.calendar tbody .emptyrow { /* Empty row (some months need less than 6 rows) */
  display: none;
}

/* The footer part -- status bar and "Close" button */

.calendar tfoot .footrow { /* The <TR> in footer (only one right now) */
}

.calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
  background: ButtonFace;
  padding: 1px;
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
  color: ButtonText;
  text-align: center;
}

.calendar tfoot .hilite { /* Hover style for buttons in footer */
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
  padding: 1px;
  background: #e4e0d8;
}

.calendar tfoot .active { /* Active (pressed) style for buttons in footer */
  padding: 2px 0px 0px 2px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
}

/* Combo boxes (menus that display months/years for direct selection) */

.calendar .combo {
  position: absolute; 
  display: none;
  width: 4em;
  top: 0px;
  left: 0px;
  cursor: default;
  border: 1px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
  background: Menu;
  color: MenuText;
  font-size: 90%;
  padding: 1px;
  z-index: 99; 
}

.calendar .combo .label,
.calendar .combo .label-IEfix {
  text-align: center;
  padding: 1px;
}

.calendar .combo .label-IEfix {
  width: 4em;
}

.calendar .combo .active {
  padding: 0px;
  border: 1px solid #000;
}

.calendar .combo .hilite {
  background: Highlight;
  color: HighlightText;
}

.calendar td.time {
  border-top: 1px solid ButtonShadow;
  padding: 1px 0px;
  text-align: center;
  background-color: ButtonFace;
}

.calendar td.time .hour,
.calendar td.time .minute,
.calendar td.time .ampm {
  padding: 0px 3px 0px 4px;
  border: 1px solid #889;
  font-weight: bold;
  background-color: Menu;
}

.calendar td.time .ampm {
  text-align: center;
}

.calendar td.time .colon {
  padding: 0px 2px 0px 3px;
  font-weight: bold;
}

.calendar td.time span.hilite {
  border-color: #000;
  background-color: Highlight;
  color: HighlightText;
}

.calendar td.time span.active {
  border-color: #f00;
  background-color: #000;
  color: #0f0;
}
/* <<< End Calendar */

/*** Don't remove the class nixhier, this is required for ASP ***/
.nixhier {
	display:none;
}

/*  deprecated definitions, only for forms created with mpform < 0.3.0
	mpform_td_help is now called mpform_help
*/	

.mpform_td_help {
width:16px;
vertical-align:top;
}
