diff --git a/tarotcard.css b/tarotcard.css
index 23ca21e..7999471 100644
--- a/tarotcard.css
+++ b/tarotcard.css
@@ -2,11 +2,20 @@
     --tarot-card-title-background-color: rgb(234, 191, 99);
 }
 
+* {
+    box-sizing: border-box;
+}
+
 .tarot-card {
     aspect-ratio: 7 / 12;
 
     max-height: 80vh;
     max-width: 80vw;
+}
+
+.tarot-card__content {
+    width: 100%;
+    height: 100%;
 
     border: 1em solid white;
 }
diff --git a/test/index.html b/test/index.html
index 22e4bee..8f4f8e1 100644
--- a/test/index.html
+++ b/test/index.html
@@ -34,23 +34,51 @@
 
 			<!-- Simplest possible card. Just displays a title and a piece of artwork. -->
 			<div id="simple-card" class="tarot-card">
-				<div class="tarot-card__section tarot-card__section--art">
-					<img class="tarot-card__art" src="images/card_art_std.jpg" alt="The Simple Card artwork image." title="The Simple Card artwork image.">
-				</div>
+				<div class="tarot-card__content">
+					<div class="tarot-card__section tarot-card__section--art">
+						<img class="tarot-card__art"
+							src="images/card_art_std.jpg"
+							alt="The Simple Card artwork image."
+							title="The Simple Card artwork image." />
+					</div>
 
-				<div class="tarot-card__section tarot-card__section--title">
-					<p class="tarot-card__title">The Simple Card.</p>
+					<div class="tarot-card__section tarot-card__section--title">
+						<p class="tarot-card__title">The Simple Card.</p>
+					</div>
 				</div>
 			</div>
 
 			<!-- Identical to The Simple Card, but uses the "deal" animation to slide in when the page is loaded. -->
 			<div id="deal-card" class="tarot-card tarot-card--deal">
-				<div class="tarot-card__section tarot-card__section--art">
-					<img class="tarot-card__art" src="images/card_art_std.jpg" alt="The Deal Card artwork image." title="The Simple Card artwork image.">
-				</div>
+				<div class="tarot-card__content">
+					<div class="tarot-card__section tarot-card__section--art">
+						<img class="tarot-card__art"
+							src="images/card_art_std.jpg"
+							alt="The Deal Card artwork image."
+							title="The Deal Card artwork image." />
+					</div>
 
-				<div class="tarot-card__section tarot-card__section--title">
-					<p class="tarot-card__title">The Deal Card.</p>
+					<div class="tarot-card__section tarot-card__section--title">
+						<p class="tarot-card__title">The Deal Card.</p>
+					</div>
+				</div>
+			</div>
+
+			<!-- Uses the "flip" animation to turn over to the other side when hovered on. -->
+			<div id="flip-card" class="tarot-card">
+				<div class="tarot-card__content">
+					<div class="tarot-card__side tarot-card__side--front">
+						<div class="tarot-card__section tarot-card__section--art">
+							<img class="tarot-card__art"
+								src="images/card_art_std.jpg"
+								alt="The Flip Card artwork image."
+								title="The Flip Card artwork image." />
+						</div>
+
+						<div class="tarot-card__section tarot-card__section--title">
+							<p class="tarot-card__title">The Flip Card.</p>
+						</div>
+					</div>
 				</div>
 			</div>