.report-card {

    &.sum {
        font-size: 3.9rem;
        font-family: $futura-book;
        line-height: 3.9rem;

        @media (min-width: 668px) {
            font-size: 5.2rem;
            line-height: 5.2rem;
        }
    }

    .base {
        padding: 1rem;

        &:before {
            content: 'You had';
            font-size: 2rem;
            left: -45px;
            line-height: 4rem;
            position: absolute;

            @media (min-width: 576px) {
                font-size: 2.7rem;
                left: -70px;
                line-height: 5rem;
            }
        }
    }

    .total {
        border: 2px solid $color-nonstop;
        border-top-left-radius: 4rem;
        border-bottom-left-radius: 4rem;
        color: $color-nonstop;
        float: right;
        padding: .75rem .75rem .25rem;
        min-width: 10rem;
        position: relative;
        position: absolute;
        right: 0;
        top: -35px;

        &:before {
            content: 'You have';
            font-size: 2rem;
            left: -100px;
            line-height: 4rem;
            position: absolute;

            @media (min-width: 576px) {
                font-size: 2.7rem;
                left: -130px;
                line-height: 5rem;
            }
        }

        svg {
            height: 2.4rem;
            position: absolute;
            left: 12px;
            top: calc(50% - 1.2rem);
            width: 2.4rem;
        }
    }

    .add {
        margin-top: -1rem;
        padding: 1rem;
    }

    .nonstop-show-logo {
        max-width: 290px;
        margin-bottom: .5rem;
    }


.reward-counter {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
    border-radius: 50%;
    font-family: $futura-book;
    width: 6.5rem;
    height: 6.5rem;

    .total {
        font-size: 3.2rem;
        vertical-align: top;
    }

    .time {
        font-size: 1.1rem;
        font-family: $futura-light;
        margin-top: -1rem;
        vertical-align: top;
    }
}

.reward-multiplier {
    height: 6.5rem;
    vertical-align: top;
    position: relative;
    width: 6.5rem;

    .amount {
        color: #000;
        font-family: $futura-bold;
        font-size: .9rem;
        position: absolute;
        right: 20%;
        top: 18%;
    }
}

.times {
    font-size: 5rem;
    height: 6.5rem;
    line-height: 6.5rem;
    text-align: center;
    width: 4rem;
}

.sample-image {
    height: 0;
    padding-bottom: 56.25%;
    background: #ccc;
}

}