@import "_logo";

.logo.mastercard {
    // display: none;
    $red: #FF0000;
    $yellow: #FFAB00;
    $offset: 0;
    color: white;
    font-weight: bold;
    text-align: center;
    font-size: 9px;
    line-height: $logo-height;
    z-index: 1;
    text-shadow: 1px 1px rgba(0, 0, 0, .6);
    &:before, &:after {
        content: " ";
        display: block;
        width: $logo-height;
        top: 0;
        position: absolute;
        height: $logo-height;
        border-radius: $logo-height / 2;
    }

    &:before {
        left: $offset;
        background: $red;
        z-index: -1;
    }

    &:after {
        right: $offset;
        background: $yellow;
        z-index: -2;
    }
}