.g-contentcubes {

    .cube-items-wrapper {
        background: linear-gradient(45deg, $accent-color-2, $accent-color-1);
        color: $white;

        // Images Position
        .cube-row {
            &.g-grid {
                &.image-position-right {
                    flex-flow: row-reverse wrap;
                }
            }
        }

        // Images
        .cube-image-wrapper {
            position: relative;
            z-index: 1;
            overflow: hidden;

            img {
                display: block;
                height: auto;

                transform: scale3d(1.8, 1.8, 1);
                transition: transform 0.5s cubic-bezier(0.7, 0, 0.3, 1);
            }

            &:hover {
                img {
                    transform: scale3d(1, 1, 1);
                }
            }

            &:after {
                position: absolute;
                top: 0;
                right: 0;
                z-index: 1;
                width: 100%;
                height: 100%;
                content: "";
                background-color: fade-out($white, 0.25);
                opacity: 0.6;
                transition: opacity 0.3s;
            }

            &:hover {
                &:after {
                    opacity: 0;
                }
            }
        }

        // Content
        .cube-content-wrapper {
            max-width: 22.5rem;
            padding: 6.5rem 0;
            margin: 0 auto;

            @include breakpoint(desktop-range) {
                padding: 4.6rem 0;
            }

            @include breakpoint(tablet-range) {
                max-width: 18.5rem;
                padding: 2.6rem 0;
            }

            @include breakpoint(mobile-only) {
                padding: 3rem 0;
            }

            @include breakpoint(small-mobile-range) {
                max-width: 14.5rem;
            }

            // Label
            .item-label {
                display: inline-block;
                background: $accent-color-1;
                padding: 0.35em 0.85em;
                margin-bottom: 0.5rem;
                font-size: $core-font-size - 0.1875;
                line-height: 1.1538;
                font-weight: $font-weight-semibold;
                border-radius: 2.5rem;
                text-align: center;
            }

            // Title
            .item-title {
                font-size: $core-font-size + 0.125;
                font-weight: $font-weight-semibold;
                line-height: $core-line-height - 0.22;
                margin-bottom: 1rem;

                a.item-link {
                    display: block;
                    color: $white;

                    .item-link-text {
                        display: inline-block;
                        margin-left: 0.25rem;
                        transition: transform 0.3s;
                    }

                    &:hover {
                        .item-link-text {
                            transform: translate3d(15px, 0, 0);
                        }
                    }
                }
            }

            // Tags
            .item-tags {
                .tag {
                    margin-right: 0.5rem;
                    margin-bottom: 0.5rem;
                    padding: 0.35rem 0;
                    color: fade-out($white, 0.4);
                    text-transform: uppercase;
                    font-size: $core-font-size - 0.1875;
                    font-weight: $font-weight-semibold;
                    line-height: $core-line-height - 0.85;

                    .fa {
                        margin-right: 0.15rem;
                        font-size: $core-font-size;
                        vertical-align: text-top;
                    }

                    a {
                        &:hover {
                            color: inherit;
                        }
                    }
                }
            }
        }
    }
}