body {
  font-family: 'OpenSans Light', Arial, sans-serif;
  font-size: 15px;
  color: #fff;
  background: url(../images/background.gif) top left;
  height: 100%;
  min-height: 100%;
}

.hydrated { /* You can use the theme's colors to define a standard look and feel. */
  --primary-color: var(--classic-primary-color);
  --primary-light-color: var(--classic-primary-light-color);
  --primary-dark-color: var(--classic-primary-dark-color);
  --secondary-color: var(--classic-secondary-color);
  --secondary-light-color: var(--classic-secondary-color-light);
  --secondary-dark-color: var(--classic-secondary-color-dark);
  --tertiary-7-color: var(--classic-tertiary-7-color);
  --tertiary-6-color: var(--classic-tertiary-6-color);
  --tertiary-5-color: var(--classic-tertiary-5-color);
  --tertiary-4-color: var(--classic-tertiary-4-color);
  --tertiary-3-color: var(--classic-tertiary-3-color);
  --tertiary-2-color: var(--classic-tertiary-2-color);
  --tertiary-1-color: white; /* font family definition */
  --font-light: var(--classic-font-latin-light), var(--classic-font-greek-light), var(--classic-font-cyrillic-light), sans-serif;
  --font-semi-bold: var(--classic-font-latin-semi-bold), var(--classic-font-greek-semi-bold), var(--classic-font-cyrillic-semi-bold), sans-serif; /* heading theme definition */
  --heading-font-family: var(--font-semi-bold);
  --heading-color: var(--tertiary-7-color);
  --heading-lead-color: var(--tertiary-7-color);
  --heading-font-weight: 600; /* button theme definition */
  --button-font-family: var(--font-light);
  --button-primary-color: var(--tertiary-1-color);
  --button-primary-background: var(--primary-color);
  --button-primary-background-hover: var(--primary-light-color);
  --button-primary-border-focus: var(--tertiary-1-color); /* text theme definition */
  --text-font-family: var(--font-light);
  --text-strong-font-family: var(--font-semi-bold);
  --text-color: var(--tertiary-7-color);
  --text-error: #D08280;
  --text-success: #077844;
  --text-required: #D08280; /* link theme definition */
  --link-font-family: var(--font-light);
  --link-strong-font-family: var(--font-semi-bold);
  --text-link-color: var(--primary-color);
  --text-link-alt-color: var(--tertiary-1-color);
  --text-link-icon-alt-color: var(--secondary-color);
  --text-link-focus-color: var(--primary-dark-color);
  --text-link-focus-outline-color: var(--tertiary-7-color); /* form field theme definition */
  --form-input-font-family: var(--font-light);
  --form-input-color: var(--tertiary-7-color);
  --form-input-focus-color: var(--primary-color);
  --form-input-border-color: var(--tertiary-5-color);
  --form-input-border-focus-color: var(--tertiary-7-color);
  --form-input-outline-focus-color: var(--primary-color);
  --form-input-placeholder-color: var(--tertiary-5-color); /* radio button and checkbox group button background */
  --radio-background: var(--tertiary-1-color);
  --radio-border-focus-color: var(--tertiary-7-color);
  --checkbox-background: var(--primary-color);
}

.hydrated .vs-main-form { /* set background color of the form here */
}

.hydrated .vs-container h1.vs-h2 { /* set form heading customisation here */
}

.hydrated .vs-container p.vs-description { /* set form description customisation here*/
}

/* form label configuration */
.hydrated .vs-form .vs-text, .hydrated .vs-form .vs-label {
  font-size: 17px;
  color: white;
}

/* form field style configuration by default */
.hydrated .vs-form .vs-form-group .vs-form-control, .hydrated .vs-form .vs-form-group .form-control, .hydrated .vs-form .vs-input-group .vs-input {
  border: 1px solid gray;
  border: 1px solid var(--form-input-border-color);
  border-radius: 0;
  color: var(--form-input-color);
  font-family: sans-serif;
  font-family: var(--form-input-font-family);
  font-size: 17px;
  font-weight: 100;
  width: 100%;
}

/* form field style configuration when on focus */
.hydrated .vs-form .vs-form-group .form-control:hover, .hydrated .vs-form .vs-form-group .form-control:focus, .hydrated .vs-form .vs-input:hover, .hydrated .vs-form .vs-input:focus {
  border: 1px solid var(--form-input-border-focus-color);
  outline: 1px dashed var(--form-input-outline-focus-color);
  outline-offset: 4px;
}

/* form error message configuration */
.hydrated .vs-form .vs-alert {
  color: var(--text-error);
}

/* form field style configuration when on error */
.hydrated .vs-form .vs-form-group .form-control.has-error, .hydrated .vs-form .vs-input.vs-error {
  -webkit-box-shadow: 0 0 2px 0 var(--text-error);
  box-shadow: 0 0 2px 0 var(--text-error);
  border: 1px solid var(--text-error);
}

/* Main error message summary table customisation */
#errorFormMessage {
  background: var(--tertiary-2-color);
  padding: 2px;
}

.hydrated .vs-form .vs-text a.error-link {
  color: #C90000 !important;
}

/* radio button configurations */
.hydrated .vs-form input.vs-input-radio:after {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  top: 0px !important;
  left: -4px !important;
  position: relative;
  background-color: var(--radio-background);
  content: "";
  display: inline-block;
  visibility: visible;
  border: 1px solid #fcc015;
  border: 1px solid var(--radio-border-focus-color);
}

.hydrated .vs-form input.vs-input-radio:focus, .hydrated .vs-form input.vs-input-radio:hover {
  border: 1px solid var(--radio-border-focus-color);
}

.hydrated .vs-form .vs-input-group .vs-input {
  border: 1px solid gray;
  border: 1px solid var(--form-input-border-color);
  border-radius: 0;
  color: #ffffff;
  font-family: sans-serif;
  font-family: var(--form-input-font-family);
  font-size: 17px;
  font-weight: 100;
  width: 100%;
  background: transparent !important;
}

.hydrated .vs-form .vs-input-group select.vs-input option {
  background-color: #333333;
  color: #ffffff;
}

.hydrated .vs-form input.vs-input:hover,
.hydrated .vs-form select.vs-input:hover,
.hydrated .vs-form textarea.vs-input:hover{
  border: 1px solid #686767;
}

.hydrated .vs-form .vs-input-group .vs-input,
.hydrated .vs-form .vs-input-group select,
.hydrated .vs-form .vs-input-group textarea {
  outline: none;
}

.hydrated .vs-form input.vs-input-radio:checked:after {
  background-color: var(--radio-border-focus-color);
  border: 1px solid var(--radio-border-focus-color);
  box-shadow: inset 0 0 0 5px var(--tertiary-1-color);
}

.hydrated .vs-form input.vs-input-radio.has-error:after {
  border: 3px solid red;
  border-radius: 50px;
}

/* checkbox group configurations */
.hydrated .vs-form input.vs-checkbox {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  height: 24px;
  width: 24px;
  margin: 0;
  background-color: var(--tertiary-1-color);
  border: 1px solid gray;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
  padding: 9px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
}

.hydrated .vs-form input.vs-checkbox:focus, .hydrated .vs-form input.vs-checkbox:hover {
  border: 1px solid var(--tertiary-7-color);
  outline: 1px dashed var(--tertiary-7-color);;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}

.hydrated .vs-form input.vs-checkbox:checked {
  background-color: var(--checkbox-background);
}

.hydrated .vs-form input.vs-checkbox.has-error {
  border: 3px solid var(--text-error);
  border-radius: 3px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.hydrated .vs-form input.vs-checkbox + label {
  display: inline;
  margin: 0;
  padding-left: 14px;
  position: relative;
  top: 2px;
}

/* Reset button customisation */
.hydrated .vs-form .vs-btn {
}

.hydrated .vs-form .vs-btn:hover {
}

/* Submit button customisation */
.hydrated .vs-form .vs-btn.vs-btn-primary {
  background-color: var(--classic-secondary-color);
  color: var(--classic-tertiary-7-color);
  font-family: var(--button-font-family);
  font-size: 17px;
  padding: 15px 30px;
  width: 116px;
  height: 60px;
}

.hydrated .vs-form .vs-btn.vs-btn-primary:hover {
  background-color: var(--classic-secondary-color-light);
}

/* Required text css customisation */
.hydrate .vs-form .required {
  color: var(--text-required);
  font-size: 12px;
  padding: 0;
}

/* Tooltip customisation */
.hydrated .vs-form .vs-tooltip-dialog {
}

.hydrated .vs-sr-only {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px
}

.mid-title {
  color: #eeca64;
}

.max-986 {
  max-width: 784px;
  margin: -8px auto -8px auto;
  background: rgba(0, 0, 0, .9);
  padding: 0px 0px 1px;
}

.vs-p-4 {
    padding: 40px !important;
    color: white;
}