diff --git a/Whack A Mole [30-30]/dirt.svg b/Whack A Mole [30-30]/dirt.svg
new file mode 100644
index 0000000..8726a9e
--- /dev/null
+++ b/Whack A Mole [30-30]/dirt.svg
@@ -0,0 +1,40 @@
+
+
\ No newline at end of file
diff --git a/Whack A Mole [30-30]/index.html b/Whack A Mole [30-30]/index.html
new file mode 100644
index 0000000..e15492e
--- /dev/null
+++ b/Whack A Mole [30-30]/index.html
@@ -0,0 +1,88 @@
+
+
+
+
+ Whack A Mole!
+
+
+
+
+
+
+ Whack-a-mole! 0
+
+
+
+
+
+
+
diff --git a/Whack A Mole [30-30]/mole.svg b/Whack A Mole [30-30]/mole.svg
new file mode 100644
index 0000000..73769a1
--- /dev/null
+++ b/Whack A Mole [30-30]/mole.svg
@@ -0,0 +1,56 @@
+
+
\ No newline at end of file
diff --git a/Whack A Mole [30-30]/style.css b/Whack A Mole [30-30]/style.css
new file mode 100644
index 0000000..03779ff
--- /dev/null
+++ b/Whack A Mole [30-30]/style.css
@@ -0,0 +1,69 @@
+html {
+ box-sizing: border-box;
+ font-size: 10px;
+ background: #ffc600;
+}
+
+*, *:before, *:after {
+ box-sizing: inherit;
+}
+
+body {
+ padding: 0;
+ margin: 0;
+ font-family: 'Amatic SC', cursive;
+}
+
+h1 {
+ text-align: center;
+ font-size: 10rem;
+ line-height: 1;
+ margin-bottom: 0;
+}
+
+.score {
+ background: rgba(255,255,255,0.2);
+ padding: 0 3rem;
+ line-height: 1;
+ border-radius: 1rem;
+}
+
+.game {
+ width: 600px;
+ height: 400px;
+ display: flex;
+ flex-wrap: wrap;
+ margin: 0 auto;
+}
+
+.hole {
+ flex: 1 0 33.33%;
+ overflow: hidden;
+ position: relative;
+}
+
+.hole:after {
+ display: block;
+ background: url(dirt.svg) bottom center no-repeat;
+ background-size: contain;
+ content: '';
+ width: 100%;
+ height:70px;
+ position: absolute;
+ z-index: 2;
+ bottom: -30px;
+}
+
+.mole {
+ background: url('mole.svg') bottom center no-repeat;
+ background-size: 60%;
+ position: absolute;
+ top: 100%;
+ width: 100%;
+ height: 100%;
+ transition:all 0.4s;
+}
+
+.hole.up .mole {
+ top: 0;
+}