/* The form element is the main container for the entire page and is centered on the page by default. This width is dynamically calculated based on the maximum width of the rows within it. */
.color-blind-result-form form {
  padding: 20px 10px;
  background: #fff;
  border: 20px solid #f3f3f3;
  margin: 0 auto;
  /*float: left;*/
}
.color-blind-result-form .form-wrapper > form:after {
   content: '';
   clear: both;
   display: block;
 }

  /* This is the style for each individual row. */
  .color-blind-result-form form .section {
    clear: both;
    padding: 0 !important;
  }

    /* This is the style for each column within a row. */
    .color-blind-result-form form .section .container {
      float: left;
      box-sizing: border-box;
    }

/* This surrounds every field and caption area. */
.color-blind-result-form .field_block {
  display: block;
  padding: 0;
  margin: 0 0 15px 0; }

  /* A field's caption normally surrounds its label element. */
  .color-blind-result-form .field_block .caption {
    display: block;
    color: #333;
    padding: 0;
    margin: 0 0 4px 0; }

    /* The following are special styles for the layout of checkbox and radio fields */
    .color-blind-result-form .field_block .checkbox .caption {
      display: inline;
      margin: 0;
      padding: 5px 0;
    }

    .color-blind-result-form .field_block div.radio span {
      display: block;
      margin: 0 0 3px 0;
      padding: 0; }

      .color-blind-result-form .field_block div.radio span input.radio {
        display: inline;
        padding-right: 5px; }

      .color-blind-result-form .field_block div.radio span label {
        color: #333; }

  /* This is the individual field input. */
  .color-blind-result-form .field_block .field {
    padding: 0;
    margin: 0;
      height: 35px;
      width: 100%;
      max-width: 300px;
  }

    /* The style for field-level errors */
    .color-blind-result-form .field_block .field .field_error {
	  display: block;
	  padding-top: 3px;
	  padding-bottom: 5px;
	  font-size: 11px;
	  color: #f00;
	  font-weight: bold; }

    /* The styles for individual field types */
    .color-blind-result-form .field_block .field input.text, .field_block .field input.float,
    color-blind-result-form. .field_block .field input.password, .field_block .field input.integer,
    .color-blind-result-form .field_block .field input.currency, .field_block .field input.date {
      border: 1px solid #ccc;
      border-top-color: #444;
      border-left-color: #444;
      color: #333;
      padding: 3px;
      margin: 0;
      width: 190px; }

    .color-blind-result-form .field_block .field input.date {
      width: 102px; }

.color-blind-result-form .field_block .field input.phone {
      width: 250px;
      font-size: 12px;
      padding: 3px 12px 3px 44px; }

    /* The styles for textareas are slightly larger than by default with no CSS */
.color-blind-result-form .field_block .field textarea {
      width: 300px;
      height: 150px; }

    /* This can be applied to any field element to make it wider than the default above */
.color-blind-result-form .field_block .field input.wide {
      width: 300px; }

	/* This can be applied to any field element to make it narrower than the default above */
.color-blind-result-form .field_block .field input.narrow {
	  width: 100px; }

    /* A dropdown menu within a field is styled here. */
.color-blind-result-form .field_block .field select, .field_block .field select option {
      width: 200px; }

/* Required fields are red and bold by default. */
.color-blind-result-form .required {
  color: #f00;
  font-weight: bold; }