Custom font doesn't display properly in forms

Hi! 

I've tried to apply custom fonts to my contact form, which is working except from the "Caption" which displays differently. I want everything to be in the same font. 

URL: https://okra-synthesizer-r6lk.squarespace.com/kontakt
PW: LeneSchmidt 

Here's the code I've added to customize the form: 

.form-wrapper .field-list .title {
  font-family: 'apercu-regular-pro';
  font-size: 10px;
  text-transform: uppercase;
}

.form-wrapper .field-list .field .caption {
  font-family: 'apercu-regular-pro';
  font-size: 10px;
}

.form-wrapper .react-form-contents .field-list .title .required, .form-wrapper .react-form-contents .field-list .fields .description.required {
  visibility: hidden;  
}
.form-wrapper .react-form-contents .field-list .title .required:before, .form-wrapper .react-form-contents .field-list .fields .description.required:before {
  visibility: visible;  
  content: "*"; 
  font-family: "apercu-regular-pro";
  font-size: 1.5em;
  line-height: 1em;
}
.form-wrapper .react-form-contents--submitted .required:before {
  visibility: hidden!important;
}