// Modular Showcase styling
.modular {
    .bottom {
        text-align: center;
        @include clearfix;
        padding-bottom: 4rem;

        h2 {
            padding-top: 3rem;
            margin: 0;
            line-height: 100%;
            color: $light-gray; 
        }

        p {
            margin: 1rem 0;

            @include breakpoint(mobile-only) {
                font-size: $core-font-size;
            }
        }

        .button {
            @extend .default-animation;
            background-color: $core-accent;
            color: $header-text;
            font-family: $font-family-header;
            border-radius: $border-radius;
            box-shadow: none;
            font-size: $core-font-size;
            border: 0 none;
            &:hover {
                background-color: darken($core-accent, 20%);
            }
        }
        &.borderbottom {
            hr {
                padding-top: 2rem;
            }
        }
    }

}
