How to indent some checkboxes in a group of checkboxes

Site URL: https://www.1faith.church/experience

I am having some css syntax issues on the form, I think. I added css to Custom CSS section for this page https://www.1faith.church/experience. At the bottom of page is a form which ends with a checkboxes selection. I want it to appear as like below, 3 checkboxes indented under Currently a Student checkbox:

CHECK THE LIFE STAGES THAT APPLY:

 Currently a Student
     College
     High School
     Other

...

I used Firefox web developer tools to inspect this webpage. So I came up with the following css styling:

.form-block .field-element {
  background: #B5E1FF !important;
  border: none !important;
  border-bottom: 2px solid black !important;
}
.form-block .title {
  text-transform: uppercase;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: .05em;
}
.form-block .caption {
   color: #898989;
}
.form-block .option label {
  font-style: italic;
  margin-left: 15px;
}
.form-wrapper {
  background: #B5E1FF;
  padding: 30px;
  border-top: 2px solid black;
}
.form-block .option label .checkbox
#yui_3_17_2_1_1646563853790_169  {
    margin-left: 30px;
}

But the very last few lines of css to indent the desired checkbox is not working. The id for the checkbox "College" is "yui_3_17_2_1_1646563853790_169". Could anyone give me some pointers? Thank you in advance!

Hi. It looks like you fixed it?