/* ============================================
   SCALE DEGREE FLASHCARDS - APP SPECIFIC CSS
   Only styles unique to this app
   Common styles are in flashcard-common.css
   ============================================ */

/* VexTab editor (hidden) */
.editor { height: 0 !important; width: 0 !important; }

/* Override highlight size for scale degree display */
.highlight {
    font-size: 40px;
    margin: 0 8px;
    line-height: 1;
}

/* Mobile overrides */
@media (max-width: 768px) {
    .highlight {
        font-size: 42px;
    }

    .flashcard {
        height: 190px;
    }
}

@media (max-width: 480px) {
    .highlight {
        font-size: 36px;
    }

    .flashcard {
        height: 150px;
    }
}