﻿.showcase {
    background-color: #e2e5e8;
    margin-top: .9em;
    padding: 1.25em;
    display: inline-block;
    width: 23.9375em;
    vertical-align: top;
    position: relative;
}

@media all and (max-width: 54.0625rem) {
    .showcase {
        padding: 0 .625em;
    }

        .showcase.normal,
        .showcase img {
            display: none;
        }
}

@media all and (max-width: 26.4375rem) {
    .showcase {
        width: 90%;
    }
}

.showcase h4 {
    font-size: 1em;
    color: #b3b3b3;
    line-height: 1.375em;
    margin: 0 auto;
    font-weight: 800;
}

.showcase.sweet {
    padding-top: .875em;
}

    .showcase.sweet button {
        margin-top: .8125em;
    }

.showcase button {
    margin: 1.25em;
}

.showcase .vs-icon {
    background-image: -webkit-image-set(url("/images/vs_icon.png") 1x, url("/images/vs_icon@2x.png") 2x);
    background-image: image-set(url("/images/vs_icon.png") 1x, url("/images/vs_icon@2x.png") 2x);
    background-repeat: no-repeat;
    width: 4.3125em;
    height: 4.3125em;
    position: absolute;
    right: -2.125em;
    top: 3.75em;
    z-index: 2;
}

@media all and (max-width: 54.0625rem) {
    .showcase .vs-icon {
        margin: .3125em auto;
        right: auto;
        left: 50%;
        margin-left: -2.1875em;
        top: auto;
        bottom: -2.1875em;
    }
}
