.g-newsletter-particle {
    // General
    @include breakpoint(mobile-only) {
        text-align: center;

        .title {
            text-align: center;
        }
    }

    .title {
        padding-bottom: 0;
        margin-bottom: 0;
        font-weight: $font-weight-medium;
        text-align: center;

        &:after {
            background: none;
        }
    }

    .g-newsletter {
        .g-newsletter-headtext {
            text-align: center;
            margin-bottom: $content-margin;
            padding-bottom: $content-padding;
            color: lighten($grey, 10%);
            font-size: $core-font-size - 0.1;

            .box1 & {
                color: $white;
            }

            .box2 & {
                color: $white;
            }

            .fa {
                color: $accent-color-1;
                font-size: $core-font-size + 2;
            }
        }

        .g-newsletter-inputbox {
            position: relative;
            border: none;

            input {
                color: #999;
                text-align: left;
                padding: ($content-margin + 0.1) ($content-margin * 2.5);
                font-weight: $font-weight-regular;
                border: 0 none;
                border-radius: 3px;
                margin-bottom: 0;

                &::-webkit-input-placeholder { /* Chrome/Opera/Safari */
                    color: #999;
                }

                &::-moz-placeholder { /* Firefox 19+ */
                    color: #999;
                }

                &:-ms-input-placeholder { /* IE 10+s */
                    color: #999;
                }

                &:-moz-placeholder { /* Firefox 18- */
                    color: #999;
                }

                @include breakpoint(mobile-only) {
                    margin-bottom: 5px;
                }

                .dir-rtl & {
                    text-align: right;
                }
            }
        }

        .g-newsletter-button {
            .g-newsletter-button-submit {
                white-space: nowrap;
                border-radius: $border-radius;
                background: $accent-color-1;
                color: $white;
                font-weight: $font-weight-regular;

                &:focus {
                    outline: none;
                }

                @include breakpoint(desktop-range) {
                    text-align: center;
                }

                @include breakpoint(tablet-range) {
                    text-align: center;
                }
            }

            .g-newsletter-button-text {
                vertical-align: middle;
            }
        }

        &.g-newsletter-stack {       
            .g-newsletter-form-wrapper {
                text-align: center;

                .g-newsletter-inputbox {
                    width: 100%;
                    margin-bottom: 10px;
                    margin-right: 0;
                    padding: 0;
                }

                .g-newsletter-button {
                    width: 100%;
                    input {
                        width: 100%;
                    }
                }
            }
        }

        &.g-newsletter-aside {
            .g-newsletter-form-wrapper {
                @include display(flex);
                @include flex-direction(row);
                @include justify-content(center);
                @include align-items(center);

                .g-newsletter-inputbox,
                .g-newsletter-button {
                    @include flex(0 1 auto);
                    min-width: 0;
                    min-height: 0;
                    margin: 0;

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

                    input,
                    .g-newsletter-button-submit {
                        margin: 0;
                    }
                }

                .g-newsletter-button {
                    width: auto;
                    margin-left: 15px;
                }

                .g-newsletter-inputbox {
                    width: 65%;

                    @include breakpoint(mobile-only) {
                        width: 80%;
                    }
                }

                @include breakpoint(mobile-only) {
                    @include flex-direction(column);
                }
            }
        }
    }
}

#mc_embed_signup { 
    &.g-newsletter-aside {
        div {
            &.mce_inline_error {
                position: absolute;
                top: 4.5rem;
                padding-left: 0 !important;
            }
        }
    }  
    div {
        &.mce_inline_error {
            background: none !important;
            font-size: 0.75rem;
        }
        &#mce-responses {
            margin-top: 10px;
        }
    } 
}
