edx-platform/lms/static/sass/views/_support.scss

// lms - views - support
// These styles are included on admin pages used by the support team.
// ===================================================================

.certificates-search, .enrollment-search {
  margin: 40px 0;

  input[name="query"] {
    width: 350px;
  }

  .certificates-form {
    max-width: 850px;
    margin: 0 auto;
  }
}


.certificates-results {
  table {
    margin: 0 auto;
  }

  th {
    text-align: center;
    text-decoration: underline;
  }

  th, td {
    padding: 10px 10px;
    vertical-align: middle;
  }
}

.btn-cert-regenerate {
  font-size: 12px;
}

.btn-cert-generate {
  font-size: 12px;
}

.enrollment-modal-wrapper.is-shown {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;

  .enrollment-modal {
    width: 600px;
    position: relative;
    margin: 10% auto;
    padding: $baseline;
    border: 4px solid $gray;
    border-radius: 4px;
    background-color: $white;

    .enrollment-change-title {
      @extend %t-title6;
      @extend %t-strong;

      @include text-align(left);

      margin-bottom: 0;
      text-transform: none;
    }

    .enrollment-change-field {
      margin: 0;
      padding: ($baseline/4) 0;
      border-bottom: 1px solid $gray-l1;

      p, label, select, input {
        @extend %t-copy-sub1;

        display: inline;
        font-style: normal;
      }
    }

    .enrollment-change-errors {
      @extend %t-copy-sub1;
      @extend %t-light;

      color: $red;
    }

    .enrollment-info {
      padding: 0;
      margin: 0;
      list-style: none;
    }

    .enrollment-change-submit, .enrollment-change-cancel {
      @extend %t-action4;

      margin: ($baseline/4) auto;
      text-transform: none;
      background-image: none;
      border: none;
      box-shadow: none;
      text-shadow: none;
    }

    .enrollment-change-cancel {
      background-color: $gray-l3;
    }
  }
}

.enrollment-modal-wrapper.is-hidden {
  display: none;
}

.enrollment-results {
  @extend %t-copy-sub2;

  .enrollment-table {
    display: inline-block;
  }

  th {
    @extend %t-title7;
  }

  .change-enrollment-btn, .change-enrollment-btn:hover {
    @extend %t-action4;

    margin: ($baseline/4) auto;
    padding: ($baseline/4) 1px;
    letter-spacing: normal;
    text-transform: none;
    background-image: none;
    border: none;
    box-shadow: none;
    text-shadow: none;
  }
}

.contact-us-wrapper {
  min-width: auto;

  .form-group {
    font-family: inherit;
  }

  h2 {
    font-size: $support-form-base-font-size + 8;
    font-weight: bold;
  }

  p {
    font-size:$support-form-base-font-size + 4;
    font-weight:$font-regular;
  }

  label {
    font-family: inherit;
    font-size: $support-form-base-font-size + 2;
    font-style: normal;
    font-weight: $font-regular;
  }

  .help-button {
    margin-bottom: $baseline;
    height: $baseline * 2;
    font-weight: $font-regular;
    font-size: $support-form-base-font-size + 2;
    border:1px solid $blue;
    border-radius:3px;
    color:$blue;

    &:hover,
    &:focus
      {
      color: $blue;
      background-color: $mediumGrey !important;
    }
  }

  .label-course {
    margin-bottom: $baseline - 5;
  }

  .message-desc {
    color:$dark-gray1;
    font-size: $support-form-base-font-size - 2;
    margin-bottom:$baseline - 16;
  }

  .select-course {
    font-size: $support-form-base-font-size;
    height: $baseline * 2;
    margin-bottom: $baseline;
  }

  .progress {
    padding: 0;
    margin-top: $baseline - 10;

    .progress-bar {
      background-color: $blue;
    }

    .zero-width {
      width: 0;
    }
  }

  .btn-primary {
    background-color: $blue;
    width: 100%;
    height: $baseline * 2;
    font-size: $support-form-base-font-size + 2;

    &:hover,
    &:focus
    {
      background-image: none;
      background-color: $m-blue-d6;
      border-color: $m-blue-d6;
    }
  }

  .file-loading, .file-name {
    font-size: $support-form-base-font-size + 2;
  }

  .file-action {
    @include float(right);

    font-size: $support-form-base-font-size + 2;
    margin-bottom: $baseline - 10;

    button {
      padding: 0;
    }
  }

  .btn-signin {
    width: $baseline * 8;
    color: $white;
    margin-bottom: ($baseline * 2) + 10;

    &:hover,
    &:focus
    {
      color: $white;
    }
  }

  input[type='text'] {
    font-size: $support-form-base-font-size - 2;
    font-family: $sans-serif;
    font-style: normal;
    font-weight: $font-regular;
    }

  .alert-danger {
    color: $palette-error-text !important;
    font-size: $support-form-base-font-size;
  }

  .has-error{
    label{
      color: $danger-red;
    }
  }
  @media only screen and (min-width: 768px) {
    .row {
      max-width: $baseline * 25;
    }
  }
}