@prefix: graphjs;

.@{prefix}-card.@{prefix}-root {
    overflow: hidden;
    width: 15em;
    text-align: center;
    .border-radius(@border-radius-large);
    .@{prefix}-information {
        display: block;
        height: 15em;
        & > * {
            pointer-events: none;
        }
        b {
            // ThemeOption: .text-color-states(@primary-color);
        }
    }
    button {
        width: 100%;
        height: 3em;
        .border-radius(0);
        font-size: 1em;
        // ThemeOption: .background-color-states(@primary-color);
    }
}

// Responsive

/* Window Width < 480 */
@media only screen and (max-width: 479px) {
    .@{prefix}-card.@{prefix}-root {
        width: 11em;
        .@{prefix}-information {
            height: 11em;
        }
        button {
            height: 2.5em;
            padding: .5em .75em;
        }
    }
}

/* 480 â‰¤ Window Width < 768 */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .@{prefix}-card.@{prefix}-root {
        width: 12.5em;
        .@{prefix}-information {
            height: 12.5em;
        }
        button {
            height: 2.75em;
            padding: .625em .875em;
        }
    }
}