.sign-up-form {
    :global(.has-error) {
        input:not(:placeholder-shown) {
            border: 1px solid #a94442;
        }

        :global(.help-block) {
            background-color: #e0ebf3;
        }
    }

    button,
    input,
    .help-block {
        z-index: 9;
        position: relative;
    }

    input {
        margin-bottom: 20px;
    }

    .tos-checkbox {
        margin-top: 20px;
    }

    @for $i from 0 through 5 {
        :global(.progress-bar-#{$i}.progress-bar-#{$i}) {
            width: #{$i * 20%};
        }
    }

    @each $class, $color in $progress-bar-bg-bright {
        :global(.progress-bar-#{$class}.progress-bar-#{$class}) {
            background-color: $color;
        }
    }

    a {
        color: $color-link-dark;
    }

    .progress {
        height: inherit;
    }

    .progress-bar {
        float: left;
        width: 0;
        height: 100%;
        font-size: 12px;
        line-height: 20px;
        color: #fff;
        text-align: center;
        background-color: #337ab7;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
        transition: width 0.6s ease;
    }

    .progress-bar-sm.progress-bar-sm {
        height: 10px;
    }

    .recaptcha-parent {
        z-index: 9;

        :global(.g-recaptcha) {
            display: inline-block;
            margin: 0 auto;
        }
    }

    .p-xs {
        padding: 5px; 
    }
}
