// Contact Form Particle
.g-contactform {
    #contact-form {
        .form-message {
            margin-bottom: 15px;
            color: $light-grey;

            & + .control-group {
                margin-top: 15px;
            }
        }

        .control-group {
            margin-bottom: 1.5rem;

            .controls {
                margin-left: 100px;

                @include breakpoint(mobile-only) {
                    margin-left: 0;
                }

                input, textarea {
                    border: 0 none;
                    border: 2px solid lighten($light-grey, 5);
                    background: $off-white;
                    border-radius: 4px;

                    &:focus {
                        box-shadow: none;
                        background: $white;
                        border-color: $darkgrey;
                    }
                }

                textarea {
                    padding-top: 10px;
                }

                input[type="checkbox"] {
                    margin-top: 0.5rem;
                }
            }

            .control-label {
                float: left;
                padding-top: 5px;
                text-align: right;
                color: $light-grey;

                &.control-label-checkbox {
                    margin-left: 100px;
                    @include breakpoint(mobile-only) {
                        margin-left: 0;
                    }                   
                    margin-right: 0.75rem;
                    float: left;
                }
            }
        }

        .g-recaptcha {
            margin: 20px 0;
            padding-left: 100px;
            @include breakpoint(mobile-only) {
                padding-left: 0;
            }
        }

        .form-actions {
            margin-left: 100px;
            @include breakpoint(mobile-only) {
                margin-left: 0;
            }

            .button {
                @extend %g-button;
            }
        }
    }
}