.userForm {
    padding-top: 1em;
  }
  
  .userForm > div:not(:first-of-type) {
    padding-top: 3em;
  }
  
  .userForm div h3 {
    padding-bottom: 0.5em;
    margin-bottom: 1em;
    
    border-bottom: 0.05em solid #e0e0e0;
  }
  
  .userForm > div > * {
    margin-bottom: 1em;
  }

  .userForm > div .phoneNumbers {
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    justify-content: flex-start;
    
    position: relative;
    margin-top: 1rem;
    padding-top: 0em;
  }
  
  .userForm .phoneNumbers label {
    flex: 1;
  }
  
  .userForm .phoneNumbersCont {
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    justify-content: flex-start;
  }
  
  .userForm .phoneNumbersCont > div:not(:first-of-type) {
    margin-top: 0.5em;
  }
  
  .userForm .phoneNumbersCont > div:not(:first-of-type) {
    padding-top: 0em;
  }
  
  .userForm .phoneNumbersCont > div > div {
    flex: 1;
    flex-flow: column nowrap;
  }
  
  .userForm .phoneNumbersCont > div > div > input {
    width: 100%;
  }
  
  .userForm .phoneNumbersCont > input {
    margin-top: 0.5em;
  }
  
  .userForm .phoneNumbersCont > .singlePhoneNumber:not(:first-of-type) {
    margin-top: 0.5em;
  }
  
  .singlePhoneNumber {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: stretch;
  }
  
  .singlePhoneNumber .removeButton {
    margin: auto;
    padding: 0.3em 1em;
    background: transparent;
  }
  
  .addPhoneNumberBtn {
    margin: auto;
    padding: 0.3em 1em;
  }

  .emailsCont {
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    justify-content: flex-start;
  }
  
  .emailsCont > .addEmailBtn {
    margin-top: 0.5em;
    align-self: flex-start;
  }
  
  .singleEmail {
    padding: 0.3em 0em;
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    
    position: relative;
  }
  
  .singleEmail.newEmail {
    align-items: flex-start;
  }
  
  .singleEmail.newEmail .emailAddressContainer > input + span {
    font-size: 0.9em;
  }
  
  .singleEmail > .emailAddressContainer {
    flex: 1;
  }
  
  .singleEmail > .emailAddressContainer > input {
    width: 100%;
  }
  
  .singleEmail > .help-tip {
    position: initial;
    flex: 0 1 auto;
  }
  
  .singleEmail > .help-tip input[type=radio] {
    width: auto;
  }
  
  .singleEmail > .emailAddressActions > button {
    height: 100%;
    padding: 0.4em 0.6em;
    align-self: flex-start;
    background: transparent;
  }
  
  .singleEmail > .emailAddressActions > .saveButton {
    color: #3f72af;
  }
  
  .addEmailBtn {
    font-size: 0.9em;
    color: #3f72af;
  }

  .userForm .addressesTitle {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    
    padding-bottom: 0.5em;
    border-bottom: 0.05em solid #e0e0e0;
  }
  
  .userForm .addressesTitle > h3 {
    border: none;
    margin-bottom: 0em;
    padding-bottom: 0em;
  }
  
  .userForm .addressesTitle > .addAddressBtn {
    flex: 0 0 8em;
  }
  
  .userForm > div.addressesContainer {
    padding-top: 0em;
  }
  
  .newPhoneNumber .removeButton {
    padding: 0.4em 1em;
    background: transparent;
  }
  
  .addressContainer .removeButton {
    background: transparent;
  }
  
  .userForm .addressContainer {
    align-items: flex-end;
    
    padding: 0.5em;
    background: #f3f5f8;
  }
  
  .userForm .addressContainer:not(:first-of-type) {
    padding-top: 0.5em;
    margin-top: 1em;
  }

  .userForm .genderCont {
    flex-flow: column nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    
    margin-top: 1rem;
  }
  
  #gender {
    margin-top: auto;
  }
  
  #gender > label {
    display: inline-block;
    flex: none;
  }
  
  #gender > label:first-of-type {
    margin-right: 1em;
  }

  #userPhotoCont {
    flex-flow: column nowrap;
    padding-top: 0em;
  }
  
  .userForm #userPhotoCont > label {
    flex: none;
  }
  
  .userForm #userPhotoCont > label:last-of-type {
    flex-flow: row nowrap;
    align-items: center;
  }
  
  #userPhotoCont .imageContainer {
    max-width: 5em;
    margin: 0.5em 0em;
  }
  
  #userPhoto {
    width: 100%;
  }
  
  #uploadedImage {
    max-width: 5em;
  }
  
  #userPhotoCont > p:first-of-type {
    margin: 0.5em 0em;
  }
  
  #userPhotoCont > p:last-of-type {
    margin: 0.5em 0em 0em;
  }

  .userForm > div > .nuisCont {
    margin-top: 1rem;
  }
  
  .userForm > div > .nuisCont,
  .userForm > div > .displayNameCont {
    position: relative;
    padding-top: 0em;
  }
  
  .userForm > div .nuisCont > label,
  .userForm > div .displayNameCont > label {
    flex: 1;
  }
  
  .nuisCont .help-tip {
    left: 3em;
  }
  
  .displayNameCont .help-tip {
    left: 9.5em;
  }
  
  .passwordLabel {
    position: relative;
  }
  
  .eyeIcon {
    position: absolute;
    right: 0.5em;
    top: 2em;
    padding: 0em;
  }
  
  #eyeIcon::after {
    content: "";
  }

  @media screen and (min-width: 768px) {
    .userForm > div,
    .userForm > div > .addressContainer {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
      flex-flow: row wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch;
    }
    
    .userForm > div > div,
    .userForm > div > label,
    .userForm > div > .addressContainer > label {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% / 2 - 1em / 2);
      flex: 0 0 calc(100% / 2 - 1em / 2);
    }
    
    .userForm > div > .addressContainer {
      flex: 1 0 100%;
    }
    
    .userForm > div h3 {
      -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
    }
    
    .userForm > div label:nth-of-type(2) {
      margin-top: 0em;
    }
    
    .userForm button[type="submit"] {
      -ms-flex-item-align: start;
      align-self: flex-start;
    }
  }