﻿/* Tabs */
#preplanning-container {
  width: 100%;
  float: left;
  border: none;
  background: none;
}

#preplanning-container.ui-tabs .ui-tabs-nav {
  border: none;
  background: none;
  padding: 0;
  clear: both;
  margin-top: 15px;
}

#preplanning-container .ui-tabs-panel {
  background-color: #f3f1f1;
  border: solid 1px #b2b2b2;
}

#preplanning-container.ui-tabs .ui-tabs-nav li {
  font: bold 14px Arial, Helvetica, sans-serif;
}

#preplanning-container.ui-tabs .ui-tabs-nav li a {
  color: #815420;
  padding: 7px 30px 7px 30px;
}

#preplanning-container.ui-tabs .ui-tabs-nav li.ui-state-active a {
  font-weight: bold;
}

#preplanning-container .ui-state-default,
#preplanning-container .ui-widget-content .ui-state-default,
#preplanning-container .ui-widget-header .ui-state-default {
  background: white none;
}

#preplanning-container .ui-state-active,
#preplanning-container .ui-widget-content .ui-state-active,
#preplanning-container .ui-widget-header .ui-state-active {
  background: #f3f1f1 none;
}

#preplanning-container .ui-button-icon-primary {
  display: none;
}

#preplanning-container .ui-button.ui-widget:hover {
  background-color: #956021;
}

#preplanning-container .ui-button-text-icon-primary,
#preplanning-container .ui-button-text,
#preplanning-container .ui-button-text-icons .ui-button-text {
  padding: 0;
}

#preplanning-container .ui-state-hover,
#preplanning-container .ui-widget-content .ui-state-hover,
#preplanning-container .ui-widget-header .ui-state-hover,
#preplanning-container .ui-state-focus,
#preplanning-container .ui-widget-content .ui-state-focus,
#preplanning-container .ui-widget-header .ui-state-focus,
#preplanning-container .ui-state-default,
#preplanning-container .ui-widget-content .ui-state-default,
#preplanning-container .ui-widget-header .ui-state-default {
  color: #ece7cd;
}

#preplanning-container .ui-button.ui-widget {
  background-color: #7d4809;
  border: 0 solid transparent;
  border-bottom: 2px solid #2f1f0b;
  border-radius: 3px 3px 3px 3px;
  border-top: 1.5px solid #c1ac93;
  font-family: Arial, Helvetica, sans-serif;
  padding: 5px 10px 4px;
  text-transform: uppercase;
  cursor: pointer;
  position: relative;
}

.dynamic-form .form-field li {
  margin: 0;
  list-style: none;
}

.dynamic-form .form-field * {
  vertical-align: Top;
}

.dynamic-form .ui-button.ui-widget {
  background: #7d4809 none 50% 50%;
  border: 0 solid transparent;
  border-bottom: 2px solid #2f1f0b;
  border-radius: 3px 3px 3px 3px;
  border-top: 1.5px solid #c1ac93;
  font-family: Arial, Helvetica, sans-serif;
  padding: 5px 10px 4px;
  text-transform: uppercase;
  cursor: pointer;
  color: White;
  position: relative;
}

.dynamic-form label {
  width: 200px;
  display: inline-block;
  zoom: 1;
  margin-top: 5px;
  margin-left: 10px;
  vertical-align: baseline !important;
}

.dynamic-form input[type="text"],
.dynamic-form textarea,
.dynamic-form input[type="password"] {
  width: 400px;
  margin: 0 0 15px;
  padding: 10px 7px;
  position: relative;
  z-index: 1;
  box-shadow: #d1d1d1 0 2px 2px inset;
  border-radius: 3px;
  border: 1px solid #d1d1d1;
  color: #454c52;
  font: normal 16px Arial, Helvetica, sans-serif;
}

.dynamic-form .form-field.small input[type="text"] {
  width: 33%;
}

.dynamic-form .form-field.medium input[type="text"] {
  width: 50%;
}

.dynamic-form .form-field textarea {
  resize: none;
}

.dynamic-form .form-field.small textarea {
  height: 50px;
}

.dynamic-form .form-field.medium textarea {
  height: 100px;
}

.dynamic-form .form-field.large textarea {
  height: 200px;
}

.dynamic-form input[type="submit"] {
  float: right;
}

.dynamic-form select {
  margin: 10px 0 0 4px;
  min-width: 80px;
}

.jqTransformSelectWrapper {
  margin-top: 6px;
  margin-bottom: 6px;
}

.jqTransformSelectWrapper ul a {
  min-height: 25px;
  vertical-align: middle;
}

/* Grouping into rows */
form.dynamic-form div.row,
form.dynamic-form div.options-row {
  clear: both;
  padding: 7px 0;
}

form.dynamic-form div.select-row {
  clear: both;
  padding: 30px 0 0;
}

form.dynamic-form div.options-row {
  margin-left: 10px;
}

form.dynamic-form div.row textarea {
  width: 95%;
}

form.dynamic-form ul.options-row.vertical-radio-list,
form.dynamic-form ul.radio-button-list {
  padding: 7px 0;
}

form.dynamic-form ul.radio-button-list {
  float: right;
  width: 54%;
  margin-left: 10px;
  margin-bottom: 10px;
}

form.dynamic-form ul.radio-button-list li {
  display: inline-block;
  padding-right: 20px;
  margin: 0;
}

form.dynamic-form div.options-row label.radio-button-list-label {
  display: block;
}

form.dynamic-form ul.options-row.vertical-radio-list li {
  list-style-type: none;
}

form.dynamic-form ul.options-row.vertical-radio-list li input,
form.dynamic-form ul.options-row.vertical-radio-list li label,
form.dynamic-form ul.radio-button-list li input,
form.dynamic-form ul.radio-button-list li label {
  display: inline;
}

form.dynamic-form ul.options-row.vertical-radio-list li input[type="text"] {
  width: 310px;
  margin: 0;
}

form.dynamic-form div.row label {
  float: left;
  width: 220px;
  margin-left: 20px;
}

form.dynamic-form div.row input[type="text"],
form.dynamic-form div.row input[type="password"] {
  float: right;
  width: 54%;
}

form.dynamic-form div.select-row h4 {
  float: left;
  width: 440px;
  padding-right: 10px;
}

form.dynamic-form div.select-row .jqTransformSelectWrapper {
  float: right;
}

/* --- VALIDATION STYLES --- */
.dynamic-form select.input-validation-error {
  border: 1px solid #d1d1d1;
}

.dynamic-form .error-summary {
  background-color: #be0d31;
  padding: 5px 7px;
  margin: 0 0 5px 0;
  display: none;
}

.dynamic-form .error-summary li {
  color: #fff;
  list-style: none;
}

.dynamic-form .field-validation-error {
  color: #be0d31;
  display: block;
  padding-left: 215px;
  clear: both;
}

.dynamic-form .row .field-validation-error {
  padding-left: 249px;
}

.dynamic-form .form-field .field-validation-error {
  padding-bottom: 7px;
}

.dynamic-form .field-validation-valid {
  display: none;
}

.dynamic-form .input-validation-error {
  background-color: #ffeeee !important;
}

.dynamic-form .validation-summary-errors {
  font-weight: bold;
  color: red;
}

.dynamic-form .validation-summary-valid {
  display: none;
}

.dynamic-form div.message {
  font: bold 14px Arial, Helvetica, sans-serif;
  margin: 10px 0;
  color: #8d9f37;
}

.dynamic-form .error-message {
  font: bold 14px Arial, Helvetica, sans-serif;
  margin: 10px 0;
  color: red;
}

.dynamic-form .form-field input[type="checkbox"],
.dynamic-form .form-field input[type="radio"] {
  margin-top: 15px;
  vertical-align: top;
}

.dynamic-form .multiple {
  width: 425px;
  display: inline-block;
  zoom: 1;
}

.dynamic-form label.choice {
  width: 90%;
}

.dynamic-form .sectionBreak .desc {
  margin-left: 0;
  width: 98%;
}

.dynamic-form #formDescVal {
  padding-bottom: 10px;
}

@media screen and (max-width: 480px) {
  .dynamic-form input[type="text"],
  .dynamic-form textarea,
  .dynamic-form input[type="password"] {
    width: 100%;
  }
}
