/* JsonFormBuilder base rules */
.form h1, .form h2, .form h3, .form h4 {
  clear: both; }
.form .formSegWrap {
  padding-top: 5px;
  vertical-align: top;
  /* example extra classes */ }
  .form .formSegWrap > label {
    display: block;
    padding: 2px 0px 2px 0px;
    cursor: pointer;
    color: #666666; }
  .form .formSegWrap .mainLabel:after {
    content: ":"; }
  .form .formSegWrap .elWrap {
    padding: 2px 10px 2px 0px; }
    .form .formSegWrap .elWrap input[type="text"], .form .formSegWrap .elWrap textarea, .form .formSegWrap .elWrap select, .form .formSegWrap .elWrap input[type="password"] {
      width: 100%;
      border: 1px solid #BBBBBB;
      border-radius: 2px;
      padding: 8px;
      color: #555555;
      transition: all 0.3s ease-out;
      -webkit-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.08) inset;
      -moz-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.08) inset;
      box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.08) inset;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -o-box-sizing: border-box;
      -ms-box-sizing: border-box;
      box-sizing: border-box; }
      .form .formSegWrap .elWrap input[type="text"]:focus, .form .formSegWrap .elWrap textarea:focus, .form .formSegWrap .elWrap select:focus, .form .formSegWrap .elWrap input[type="password"]:focus {
        background-color: #f7f7f7;
        border-color: #838383; }
      .form .formSegWrap .elWrap input[type="text"].error, .form .formSegWrap .elWrap textarea.error, .form .formSegWrap .elWrap select.error, .form .formSegWrap .elWrap input[type="password"].error {
        background-color: #ffe8e8;
        border: 1px solid #c04242;
        color: #c04242; }
    .form .formSegWrap .elWrap input[type="radio"].error, .form .formSegWrap .elWrap input[type="checkbox"].error {
      box-shadow: 0 0 3px red;
      border: 1px solid red; }
    .form .formSegWrap .elWrap input[type="submit"], .form .formSegWrap .elWrap input[type="button"], .form .formSegWrap .elWrap input[type="reset"] {
      border: 1px solid #CCCCCC;
      padding: 8px;
      min-width: 110px;
      background-color: #f7f7f7;
      color: #555555;
      cursor: pointer;
      border-radius: 2px;
      transition: all 0.3s ease-out;
      -webkit-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.08) outset;
      -moz-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.08) outset;
      box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.08) outset;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -o-box-sizing: border-box;
      -ms-box-sizing: border-box;
      box-sizing: border-box; }
      .form .formSegWrap .elWrap input[type="submit"]:hover, .form .formSegWrap .elWrap input[type="button"]:hover, .form .formSegWrap .elWrap input[type="reset"]:hover {
        background-color: #eeeeee; }
  .form .formSegWrap table.matrix {
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    width: 100%; }
    .form .formSegWrap table.matrix th {
      background-color: #F7F7F7;
      font-size: 85%; }
    .form .formSegWrap table.matrix th, .form .formSegWrap table.matrix td {
      padding: 3px;
      border-bottom: 1px solid #dddddd;
      border-right: 1px solid #dddddd;
      font-size: 85%; }
    .form .formSegWrap table.matrix th.columnHead {
      text-align: center;
      border-top: 1px solid #dddddd; }
    .form .formSegWrap table.matrix th.rowHead {
      text-align: left;
      border-left: 1px solid #dddddd; }
    .form .formSegWrap table.matrix th.spaceCell {
      background-color: transparent; }
    .form .formSegWrap table.matrix .optionCell {
      text-align: center; }
  .form .formSegWrap.elementCheckbox .mainElLabel {
    display: inline-block;
    margin-left: 5px;
    vertical-align: middle; }
  .form .formSegWrap.elementCheckbox .elWrap {
    display: inline-block;
    vertical-align: middle; }
  .form .formSegWrap.elementCheckboxGroup .checkboxWrap .checkboxEl {
    display: inline-block;
    vertical-align: middle; }
  .form .formSegWrap.elementCheckboxGroup .checkboxWrap > label {
    display: inline-block;
    margin-left: 5px;
    vertical-align: middle; }
  .form .formSegWrap.required .mainElLabel:after {
    content: " *";
    color: red; }
  .form .formSegWrap.elementDate select {
    width: auto;
    margin-right: 5px; }
  .form .formSegWrap.half {
    width: 50%;
    float: left; }
  .form .formSegWrap.third {
    width: 33.3%;
    float: left; }
.form .formSegWrap_submit, .form .formSegWrap_reset {
  float: left;
  width: auto;
  margin: 10px 10px 10px 0px; }
.form label.mainLabelError {
  color: #990000; }
.form .errorContainer {
  display: block;
  /* for Non jQuery Validate form errors with multiple warnings */
  padding-top: 2px; }
  .form .errorContainer label {
    font-size: 85%;
    display: block;
    color: red;
    clear: both;
    cursor: pointer; }
    .form .errorContainer label span {
      display: block; }
.form .process_errors_wrap {
  color: red; }
.form .radioWrap {
  clear: both; }
  .form .radioWrap label {
    display: inline-block;
    width: 80%;
    padding: 2px;
    cursor: pointer; }
  .form .radioWrap .radioEl {
    float: left;
    clear: both; }
.form .tiny .elWrap span.after:after, .form .tiny .elWrap span.after:before {
  content: "*";
  padding-left: 2px; }