.FlashCards #Player {display: none;}
.FlashCards .Chunk {content-visibility: visible;}

.FlashCards .Background1 {display: block; background-image: url('graphics/titles/flashcards.jpg'); background-size: cover;}
.FlashCards .Chunk {padding-top: 40px; text-align: center;}
.FlashCards .Message {pointer-events: none;}
.FlashCards .Card {animation: CardDeal 1s forwards; --left: 0px !important; --top: 0px !important; position: static; display: inline-block; background: transparent; width: 180px; height: 120px; border-radius: 10px; margin: 4px;}
.FlashCards .Card.Small {width: 135px; height: 90px;}
.FlashCards .Card.VerySmall {width: 90px; height: 60px;}
.FlashCards .CardInner {position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d; border-radius: 10px;}
    .FlashCards .Card.Flipped .CardInner {transform: rotateY(180deg); animation-play-state: var(--AnimationPlayState);}
    .FlashCards .CardFront, .FlashCards .CardBack {position: absolute; top: 0px; left: 0px; min-width: 100%; font-size: 26pt; font-family: var(--DefaultFontFamily); padding-top: 32px; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 10px; border: solid 10px white; box-shadow: 2px 2px 2px rgba(0,0,0,0.5); box-sizing: border-box; cursor: pointer;}
    .Literacy .FlashCards .CardFront, .Literacy .FlashCards .CardBack {--DefaultFontFamily: QuicksandAlternate, Quicksand, sans-serif;}
        .FlashCards .CardBack {background-color: dodgerblue; color: white;}
        .FlashCards .Card.AnswerCard .CardBack {background-color: red;}
        .FlashCards .CardFront {background-color: white; color: black; transform: rotateY(180deg);}
        .FlashCards .Card.AnswerCard .CardFront {color: red;}
        .FlashCards .Card.Match .CardBack, .FlashCards .Card.Match .CardFront {background-color: limegreen; color: white;}
        .FlashCards .Card.Match {animation: CardRemoval 1s forwards !important; animation-delay: 0s !important; pointer-events: none;}