diff --git a/index.html b/index.html
index 94850e4..9d7bab5 100644
--- a/index.html
+++ b/index.html
@@ -4,13 +4,21 @@
   <meta charset="utf-8">
   <meta name="viewport" content="minimal-ui, width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
   <title>TryCatch - Home</title>
-  <link href="style/style.css" rel="stylesheet" type="text/css" />
+  <!-- CSS stylesheets -->
+  <link href="style/base.css" rel="stylesheet" type="text/css"/>
+  <link href="style/menus.css" rel="stylesheet" type="text/css"/>
+  <link href="style/game.css" rel="stylesheet" type="text/css"/>
+  
+  <!-- Fonts -->
   <link href='https://fonts.googleapis.com/css?family=Montserrat:700,400' rel='stylesheet' type='text/css'>
   
+  <!-- JQuery library -->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
   
   <!-- Sounds library-->
   <script src="js/howlerjs/howler.js"></script>
+  
+  <!-- Sound and menu scripts -->
   <script src="js/sounds.js"></script>
   <script src="js/menus.js"></script>
 </head>
@@ -128,7 +136,7 @@ <h2>Game Paused</h2>
     </div>
     
     <!-- This is the tutorial section (hidden by default) -->
-    <div id="tutorial-screen">
+    <div id="tutorial-screen" class="drop-menu">
       <h2 class="how-to-play">How to play - Spelling</h2>
       <img src="images/tutorial/mathtutorial.jpg" class="math-tutorial">
       <img src="images/tutorial/spellingtutorial.jpg" class="spelling-tutorial">
@@ -136,7 +144,7 @@ <h2 class="how-to-play">How to play - Spelling</h2>
     </div>
     
     <!-- This is the achievement section (hidden by default) -->
-    <div id="achievement-screen">
+    <div id="achievement-screen" class="drop-menu">
       <h2>Achievements</h2>
       <div id="achievements-div">
         <table id="achievements-table">
@@ -162,20 +170,20 @@ <h2>Achievements</h2>
     </div>
      
      <!-- This is the difficulty menu section (hidden by default) -->
-      <div id="difficulty-menu" >
+      <div id="difficulty-menu" class="drop-menu">
         <h2>Choose Difficulty</h2>
         <button id="easy" class="button diff">Easy</button>
         <br/>
         <button id="medium" class="button-selected diff">Medium</button>
         <br/>
         <button id="hard" class="button diff">Hard</button> 
-        <button class="button tutorial-button">Tutorial</button>
+        <button id = "tutorial-button" class="button">Tutorial</button>
         <button id="start-button" class="button">Start Game</button> 
         <button class="button main-menu-button">Back</button>
       </div>
       
       <!-- This is the leaderboard section (hidden by default) -->
-      <div id="leaderboard" >
+      <div id="leaderboard" class="drop-menu">
         <h2 id="leaderboard-header">Leaderboard - Spelling</h2>
             <?php include 'php/server-logOn.php'; ?>
 
@@ -287,7 +295,6 @@ <h1 id="score" class="score"></h1>
   <script src="js/lives.js"></script>
   <script src="js/gameOver.js"></script>
   <script src="js/bonusLevel.js"></script>
-  
   <script src="js/background.js"></script>
   
   <!-- Canvas resizing script -->
diff --git a/js/menus.js b/js/menus.js
index e25a8e8..d2062f0 100644
--- a/js/menus.js
+++ b/js/menus.js
@@ -29,7 +29,7 @@ $(document).ready(function () {
   /**
    * Brings the tutorial screen up.
    */
-  $(".tutorial-button").click(function() {
+  $("#tutorial-button").click(function() {
     $("#tutorial-screen").css({display: "block"});
   });
   
diff --git a/style/base.css b/style/base.css
new file mode 100644
index 0000000..e60d33a
--- /dev/null
+++ b/style/base.css
@@ -0,0 +1,64 @@
+/*************/
+/* Reset CSS */
+/*************/
+* {
+  margin: 0;
+  padding: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+/*******************/
+/* General Styling */
+/*******************/
+h2 {
+  text-align: center;
+  padding-top: 1em;
+  padding-bottom: 1em;
+  margin: 0 0 0.3em 0;
+  background: #F1AE3E;
+  background-color: #0088CB;
+  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.40);
+  border: none;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 700;
+  font-size: 1.5em;
+  color: #FFFFFF;
+  text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.50);
+  background-image: radial-gradient(50% 99%, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
+}
+
+button {
+  outline: none;
+}
+
+button:hover {
+    text-shadow: 0px 8px 24px rgba(0, 0, 0, 0.70);
+    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.60);
+}
+
+button:active {
+  text-shadow: 0px 2px 24px rgba(0, 0, 0, 0.70);
+}
+
+#wrapper {
+  position: relative;
+  width: 1000px;
+  height: 100vh;
+  margin: auto;
+  top: 0;
+}
+
+p {
+  margin: 0;
+}
+
+/**********************************/
+/* Fill Wrapper When Under 1000px */
+/**********************************/
+@media screen and (max-width: 1000px) {
+  #wrapper {
+    width: 100%;
+  }
+}
\ No newline at end of file
diff --git a/style/game.css b/style/game.css
new file mode 100644
index 0000000..9cabc81
--- /dev/null
+++ b/style/game.css
@@ -0,0 +1,289 @@
+/************/
+/* Canvases */
+/************/
+canvas {
+  position: absolute;
+  background: transparent;
+}
+
+#background {
+  z-index: 0;
+  background-color: #1F2B42;
+}
+
+#elements {
+  z-index: 1;
+}
+
+#player {
+  bottom: 0;
+  z-index: 3;
+}
+
+#gradient {
+  z-index: 2;
+  width: 100%;
+  height: 100%;
+  background-image: linear-gradient(-180deg, rgba(0,0,0,0.35) 10%, rgba(0,0,0,0.00) 35%),
+    linear-gradient(0deg, rgba(0,0,0,0.35) 5%, rgba(0,0,0,0.00) 33%);
+}
+
+/*************************/
+/* Game Body Backgrounds */
+/*************************/
+#spelling-bg {
+  display: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  background: #0f162E;
+  background-image: radial-gradient(53% 102%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, 0.45) 100%),
+    url(../images/spelling/background/spellingbodybg.png);
+  z-index: -10;
+}
+
+#math-bg {
+  display: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  background: #4593DE;
+  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%,
+    rgba(23, 51, 97, 0.36) 100%), url(../images/math/background/mathbodybg.png);
+  z-index: -10;
+}
+
+/***********/
+/* Game UI */
+/***********/
+#game {
+  display: none;
+  position: relative;
+  height: 100%;
+  top: 0;
+}
+
+/************/
+/* Top Menu */
+/************/
+#top-menu {
+  position: absolute;
+  top: 0;
+  z-index: 2;
+  width: 100%;
+  height: 10%;
+}
+
+#left {
+  position: absolute;
+  left: 0;
+  width: 300px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background-image: url(../images/menubar.png);
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+}
+
+#right {
+  position: absolute;
+  right: 0;
+  text-align: right;
+}
+
+#pause-button {
+  cursor: pointer;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+  font-size: 1.5em;
+  background: none;
+  border: none;
+  margin: 0;
+  color: #C9C1C1;
+  text-shadow: 0px 1px 15px rgba(0,0,0,0.50);
+  z-index: 9;
+}
+
+#pause-button:hover {
+  text-shadow: 0px 5px 15px rgba(0,0,0,0.90);
+}
+
+#menu-pause {
+  margin: 0.8em 0 2em -6em;
+}
+
+#level-counter {
+  position: relative;
+  margin: 0.2em 0 0.2em -3em;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+  font-size: 1.5em;
+  color: #C9C1C1;
+  text-shadow: 0px 1px 15px rgba(0,0,0,0.50);
+}
+
+#score-counter {
+  margin: -15px 15px 15px 0;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+  font-size: 5em;
+  color: white;
+}
+
+/******************/
+/* Answer Section */
+/******************/
+#answer-section {
+  position: absolute;
+  top: 0px;
+  width: 100%;
+  font-size: 1.5em;
+  z-index: 0;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+#answer-table {
+  margin: auto;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+  font-size: 3em;
+  color: #1B2338;
+  text-shadow:
+    -1px -1px 0 #fff,  
+    1px -1px 0 #fff,
+    -1px 1px 0 #fff,
+    1px 1px 0 #fff,
+    0 0 40px rgba(0, 0, 0, 0.5);
+}
+
+.equation-answer {
+  text-align: center;
+  color: #FFFFFF;
+  width: 80px;
+  height: 80px;
+  box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.30);
+}
+
+#answer-row td:last-of-type {
+  box-shadow: none;
+}
+
+/******************/
+/* Mobile Buttons */
+/******************/
+#mobile-buttons {
+  display: none;
+  position: absolute;
+  width: 100%;
+  height: 60px;
+  bottom: 0;
+  z-index: 3;
+}
+
+#left-button {
+  width: 54px;
+  height: 81px;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  background-image: url("../images/leftarrow.png");
+  background-repeat: no-repeat;
+  border: none;
+}
+
+#right-button {
+  width: 54px;
+  height: 81px;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  background-image: url("../images/rightarrow.png");
+  background-repeat: no-repeat;
+  border: none;
+}
+
+/**********************************************/
+/* Move Answer Section Down When Under 1000px */
+/**********************************************/
+@media screen and (max-width: 1000px) {
+  #answer-section {
+    top: 80px;
+  }
+}
+
+/**********************/
+/* For Mobile Devices */
+/**********************/
+@media screen and (max-width: 530px) {
+  /************/
+  /* Top Menu */
+  /************/
+  #left {
+    width: 50%;
+  }
+
+  #right {
+    width: 50%;
+  }
+  
+  #level-counter {
+    font-size: 1.2em;
+    margin: 0.4em 0 0.1em -1.3em;
+  }
+  
+  #pause-button {
+    font-size: 1.2em;
+    margin: 0.1em 0 0 1.5em;
+  }
+  
+  #lives-table img {
+    width: 75%;
+    height: auto;
+  }
+  
+  #score-counter {
+    font-size: 4em;
+  }
+
+  /******************/
+  /* Answer Section */
+  /******************/
+  #answer-row td {
+    font-size: 0.75em;
+  }
+  
+  .equation-answer {
+    width: 40px;
+    height: 40px;
+    box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.30);
+  }
+  
+  /******************/
+  /* Mobile Buttons */
+  /******************/
+  #mobile-buttons {
+    display: block;
+  }
+}
+
+/***********************/
+/* For Smaller Devices */
+/***********************/
+@media screen and (max-width: 375px) {
+  /************/
+  /* Top Menu */
+  /************/
+  #left {
+    font-size: 0.85em;
+  }
+  
+  #score-counter {
+    font-size: 3.5em;
+  }
+}
\ No newline at end of file
diff --git a/style/style.css b/style/menus.css
similarity index 58%
rename from style/style.css
rename to style/menus.css
index cb7d0de..d594c87 100644
--- a/style/style.css
+++ b/style/menus.css
@@ -1,121 +1,118 @@
-/*************/
-/* RESET CSS */
-/*************/
-* {
-  margin: 0;
-  padding: 0;
-  font-size: 100%;
-  font: inherit;
-  vertical-align: baseline;
-}
-
-/*******************/
-/* General Styling */
-/*******************/
-
-#menu-bg {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100vh;
-  background: #4593DE;
-  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
-  z-index: -10;
-}
-
-#spelling-bg {
-  display: none;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100vh;
-  background: #0f162E;
-  background-image: radial-gradient(53% 102%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, 0.45) 100%),
-    url(../images/spelling/background/spellingbodybg.png);
-  z-index: -10;
-}
-
-#math-bg {
-  display: none;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100vh;
-  background: #4593DE;
-  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%,
-    rgba(23, 51, 97, 0.36) 100%), url(../images/math/background/mathbodybg.png);
-  z-index: -10;
+/****************/
+/* Menu Buttons */
+/****************/
+#button-collection {
+  display: flex;
+  flex-direction: column;
 }
 
-h2 {
-  text-align: center;
-  padding-top: 1em;
-  padding-bottom: 1em;
-  margin: 0 0 0.3em 0;
+.button {
+  width: 250px;
+  height: 50px;
+  margin: 0 auto .5em auto;
+  background-color: #0AAFF1;
   background: #F1AE3E;
-  background-color: #0088CB;
-  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.40);
+  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.50);
   border: none;
   font-family: 'Montserrat', sans-serif;
-  font-weight: 700;
+  font-weight: 400;
   font-size: 1.5em;
   color: #FFFFFF;
   text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.50);
-  background-image: radial-gradient(50% 99%, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
-}
-
-button {
   outline: none;
 }
 
-button:hover {
-    text-shadow: 0px 8px 24px rgba(0, 0, 0, 0.70);
-    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.60);
-}
-
-button:active {
-  text-shadow: 0px 2px 24px rgba(0, 0, 0, 0.70);
-}
-
-#title h1 {
-  text-align: center;
+.button-selected {
+  width: 250px;
+  height: 50px;
+  margin: 0 auto 1em auto;
+  background-color: #0AAFF1;
+  background: #F1AE3E;
+  box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.50);
+  border: none;
   font-family: 'Montserrat', sans-serif;
-  font-weight: 700;
-  font-size: 6em;
+  font-weight: 400;
+  font-size: 1.5em;
   color: #FFFFFF;
-  text-shadow: 0px 4px 40px rgba(0, 0, 0, 0.50);
-  margin-top: 0;
-  margin-bottom: 0.5em;
+  text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.50);
+  outline: 8px solid white;
+  border: none;
+  overflow: hidden;
 }
 
-#wrapper {
+/***************/
+/* Mute Button */
+/***************/
+#main-menu .mute {
   position: relative;
-  width: 1000px;
-  height: 100vh;
-  margin: auto;
-  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 50px;
+  height: 50px;
+}
+
+/*******************/
+/* Drop down Menus */
+/*******************/
+@keyframes menu-drop-in {
+    from {
+      top: -50%;
+    } to {
+      transform: translateY(-50%);
+      top: 50%;
+    }
 }
 
-canvas {
+.drop-menu {
+  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
+  display: none;
   position: absolute;
-  background: transparent;
+  margin: auto;
+  left: 0;
+  right: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  background-color: #CCFFFF;
+  width: 400px;
+  height: 600px;
+  z-index: 10;
+  animation-name: menu-drop-in;
+  animation-duration: 1s;
+  animation-fill-mode: forwards;
+  box-shadow: 0px 3px 94px 20px rgba(0,0,0,0.38);
 }
 
-p {
-  margin: 0;
+/************/
+/* Main Menu*/
+/************/
+#main-menu {
+  position: absolute;
+  width: 100%;
+  top: 50%;
+  transform: translateY(-50%);
 }
 
 #buttons {
   margin: auto;
 }
 
+/*********************************/
+/* Main Menu Background Gradient */
+/*********************************/
+#menu-bg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  background: #4593DE;
+  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
+  z-index: -10;
+}
+
 /*******************/
-/* The Menu Header */
+/* Main Menu Title */
 /*******************/
-
 #header-title {
   text-align: center;
   padding-top: 20%;
@@ -127,6 +124,17 @@ p {
   height: 20%;
 }
 
+#title h1 {
+  text-align: center;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 700;
+  font-size: 6em;
+  color: #FFFFFF;
+  text-shadow: 0px 4px 40px rgba(0, 0, 0, 0.50);
+  margin-top: 0;
+  margin-bottom: 0.5em;
+}
+
 #cloud {
   width: 30%;
   height: auto;
@@ -134,21 +142,9 @@ p {
   transform: translateY(15%);
 }
 
-/*****************/
-/* The Main Menu */
-/*****************/
-
-#main-menu {
-  position: absolute;
-  width: 100%;
-  top: 50%;
-  transform: translateY(-50%);
-}
-
-/*********************/
-/* Main Menu Buttons */
-/*********************/
-
+/****************************************/
+/* Main Menu Gamemode Selection Buttons */
+/****************************************/
 #game-collection {
   display: flex;
   flex-direction: row;
@@ -183,29 +179,10 @@ p {
   height: auto;
 }
 
-#button-collection {
-  display: flex;
-  flex-direction: column;
-}
-
-button .banner {
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-  font-size: 1.2em;
-  color: #FFFFFF;
-  text-shadow: 0px 2px 20px rgba(0,0,0,0.50);
-  background-color: #B6182A;
-  transform: rotate(-30deg);
-  width: 150%;
-  margin-left: -32px;
-  height: 30px;
-  box-shadow: 0px 3px 16px 0px rgba(0,0,0,0.38);
-}
-
 .theme {
   width: 130px;
   height: 130px;
-  margin: 0 1em 0.5em 1em;
+  margin: 0 0.9em 0.5em 0.9em;
   background: #18306E;
   box-shadow: 0px 4px 40px 0px rgba(0,0,0,0.50);
   border: none;
@@ -215,7 +192,7 @@ button .banner {
 .theme-selected {
   width: 130px;
   height: 130px;
-  margin: 0 1em 0.5em 1em;
+  margin: 0 0.9em 0.5em 0.9em;
   background: #18306E;
   box-shadow: 0px 4px 40px 0px rgba(0,0,0,0.50);
   outline: 8px solid white;
@@ -223,75 +200,63 @@ button .banner {
   overflow: hidden;
 }
 
-.button {
-  width: 250px;
-  height: 50px;
-  margin: 0 auto .5em auto;
-  background-color: #0AAFF1;
-  background: #F1AE3E;
-  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.50);
-  border: none;
+button .banner {
   font-family: 'Montserrat', sans-serif;
   font-weight: 400;
-  font-size: 1.5em;
+  font-size: 1.2em;
   color: #FFFFFF;
-  text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.50);
-  outline: none;
+  text-shadow: 0px 2px 20px rgba(0,0,0,0.50);
+  background-color: #B6182A;
+  transform: rotate(-30deg);
+  width: 150%;
+  margin-left: -32px;
+  height: 30px;
+  box-shadow: 0px 3px 16px 0px rgba(0,0,0,0.38);
 }
 
-.button-selected {
-  width: 250px;
-  height: 50px;
-  margin-bottom: 1em;
-  margin: 0 auto 1em auto;
-  background-color: #0AAFF1;
-  background: #F1AE3E;
-  box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.50);
-  border: none;
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-  font-size: 1.5em;
-  color: #FFFFFF;
-  text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.50);
-  outline: 8px solid white;
-  border: none;
-  overflow: hidden;
+/*******************/
+/* Difficulty Menu */
+/*******************/
+#difficulty-menu h2 {
+  font-size: 2em;
 }
 
-#main-menu .mute {
+#difficulty-menu .button {
   position: relative;
+  margin-top: 17px;
+  margin-bottom: 5px;
   left: 50%;
   transform: translateX(-50%);
+<<<<<<< HEAD:style/style.css
   width: 50px;
   height: 50px;
   margin-top: 5px;
+=======
+  background-color: #18306E;
+>>>>>>> f3988c958e3a59fdca544ea3943569d835ee01fe:style/menus.css
 }
 
-/************/
-/* Canvases */
-/***********/
-#background {
-  z-index: 0;
-  background-color: #1F2B42;
+#difficulty-menu .button-selected {
+  position: relative;
+  margin-top: 17px;
+  margin-bottom: 5px;
+  left: 50%;
+  transform: translateX(-50%);
+  background-color: #18306E;
 }
 
-#elements {
-  z-index: 1;
-}
+#difficulty-menu #start-button {
 
-#player {
-  bottom: 0;
-  z-index: 3;
+  background-color: #0AAFF1;
+  background: #F1AE3E;
 }
 
-#gradient {
-  z-index: 2;
-  width: 100%;
-  height: 100%;
-  background-image: linear-gradient(-180deg, rgba(0,0,0,0.35) 10%, rgba(0,0,0,0.00) 35%),
-    linear-gradient(0deg, rgba(0,0,0,0.35) 5%, rgba(0,0,0,0.00) 33%);
+#difficulty-menu #tutorial-button {
+  background-color: #0AAFF1;
+  background: #F1AE3E;
 }
 
+<<<<<<< HEAD:style/style.css
 /***********/
 /* Game UI */
 /***********/
@@ -301,149 +266,201 @@ button .banner {
   z-index: 4;
   width: 100%;
   height: 10%;
+=======
+#difficulty-menu .main-menu-button {
+  background-color: #0AAFF1;
+  background: #F1AE3E;
+>>>>>>> f3988c958e3a59fdca544ea3943569d835ee01fe:style/menus.css
 }
 
-#left {
-  position: absolute;
-  left: 0;
-  width: 300px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  background-image: url(../images/menubar.png);
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
+/*******************/
+/* Tutorial Screen */
+/*******************/
+#tutorial-screen {
+  z-index: 11;
 }
 
-#right {
-  position: absolute;
-  right: 0;
-  text-align: right;
+#tutorial-screen img {
+  height: 425px;
+  width: auto;
+  position: relative;
+  left: 50%;
+  transform: translateX(-50%);
 }
 
-#pause-button {
-  cursor: pointer;
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-  font-size: 1.5em;
-  background: none;
-  border: none;
-  margin: 0;
-  color: #C9C1C1;
-  text-shadow: 0px 1px 15px rgba(0,0,0,0.50);
-  z-index: 9;
+.math-tutorial {
+  display: none;
 }
 
-#pause-button:hover {
-  text-shadow: 0px 5px 15px rgba(0,0,0,0.90);
+#tutorial-screen h2 {
+  font-size: 1.3em;
 }
 
-#menu-pause {
-  margin: 0.8em 0 2em -6em;
+#tutorial-screen .button {
+  position: relative;
+  left: 50%;
+  margin-top: 10px;
+  transform: translateX(-50%);
 }
 
-#level-counter {
-  position: relative;
-  margin: 0.2em 0 0.2em -3em;
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-  font-size: 1.5em;
-  color: #C9C1C1;
-  text-shadow: 0px 1px 15px rgba(0,0,0,0.50);
+/**********************/
+/* Achievement Screen */
+/**********************/
+#achievement-screen {
+  overflow: hidden;
 }
 
-#score-counter {
-  margin: -15px 15px 15px 0;
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-  font-size: 5em;
-  color: white;
+#achievement-screen h2 {
+  font-size: 2em;
 }
 
+<<<<<<< HEAD:style/style.css
 #answer-section {
   position: absolute;
   top: 0px;
   width: 100%;
   font-size: 1.5em;
   z-index: 3;
+=======
+#achievement-screen .button {
+  position: relative;
+  margin-top: 0.5em;
+  margin-top: 18px;
+>>>>>>> f3988c958e3a59fdca544ea3943569d835ee01fe:style/menus.css
   left: 50%;
   transform: translateX(-50%);
+  background-color: #F1AE3E;
 }
 
-#answer-table {
-  margin: auto;
+#achievements-table {
+  box-shadow: 0px 3px 28px 0px rgba(0,0,0,0.38);
   font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-  font-size: 3em;
-  color: #1B2338;
-  text-shadow:
-    -1px -1px 0 #fff,  
-    1px -1px 0 #fff,
-    -1px 1px 0 #fff,
-    1px 1px 0 #fff,
-    0 0 40px rgba(0, 0, 0, 0.5);
+  text-shadow: 0px 6px 18px rgba(0, 0, 0, 0.50);
+  color: white;
+  width: 95%;
+  width: 90%;
+  position: relative;
+  left: 50%;
+  transform:translateX(-50%);
+  border-collapse: collapse;
+  background: #4593DE;
+  background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
 }
 
-.equation-answer {
-  text-align: center;
-  color: #FFFFFF;
-  width: 80px;
-  height: 80px;
-  box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.30);
+#achievements-table tr {
+  border-top: solid 5px white;
+  border-bottom: solid 5px white;
 }
 
-#answer-row td:last-of-type {
-  box-shadow: none;
+#achievements-table td {
+  vertical-align: top;
+  padding-left: 0.5em;
+  padding-top: 0.5em;
+  padding-right: 1em;
+  padding-bottom: 0;
 }
 
-#mobile-buttons {
-  display: none;
-  position: absolute;
-  width: 100%;
-  height: 60px;
-  bottom: 0;
-  z-index: 3;
+#achievements-table tr:first-child {
+  border-top: 0;
 }
 
-#left-button {
-  width: 54px;
-  height: 81px;
-  position: absolute;
-  left: 0;
-  bottom: 0;
-  background-image: url("../images/leftarrow.png");
-  background-repeat: no-repeat;
-  border: none;
+#achievements-table tr:last-child {
+  border-bottom: 0;
 }
 
-#right-button {
-  width: 54px;
-  height: 81px;
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  background-image: url("../images/rightarrow.png");
-  background-repeat: no-repeat;
-  border: none;
+#achievements-div {
+  margin: auto;
+  padding-top: 5%;
+  width: 90%;
+  position: relative;
+  height: auto;
+  height: 60%;
+  overflow: auto;
+}
+
+/**********************/
+/* Leaderboard Screen */
+/**********************/
+#score-table {
+  position: relative;
+  margin-top: 60px;
+  margin-right: 0.2em;
+  padding: 0 0 0 2.5%;
+  text-shadow: 0px 6px 18px rgba(0, 0, 0, 0.50);
+}
+
+#spelling-scores {
+  box-shadow: 0px 3px 28px 0px rgba(0,0,0,0.38);
+  font-family: 'Montserrat', sans-serif;
+  margin: 0, auto, 1em, auto;
+  border: solid 5px;
+  width: 95%;
+  color: white;
+  border-spacing: 10px;
+  border-collapse: seperate;
+  position: relative;
+  background: #4593DE;
+  background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
 }
 
-#game {
+#math-scores {
+  box-shadow: 0px 3px 28px 0px rgba(0,0,0,0.38);
+  font-family: 'Montserrat', sans-serif;
+  margin: 0, auto, 1em, auto;
+  border: solid 5px;
+  width: 95%;
+  color: white;
+  border-spacing: 10px;
+  position: relative;
   display: none;
+  background: #4593DE;
+  background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
+}
+
+.scores {
   position: relative;
-  height: 100%;
-  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
 }
 
-/*******************/
-/**** GAME OVER ****/
-/*******************/
+.scores th {
+  padding: 0 35px 0 35px;
+  text-decoration: underline;
+}
+
+.scores td {
+  text-align: center;
+}
+
+#leaderboard #next-board .button {
+  width: 32%;
+  float: right;
+  margin-top: 15px;
+  margin-right: 10px;
+}
+
+#leaderboard #previous-board .button {
+  width: 32%;
+  float: left;
+  margin-top: 15px;
+  margin-left: 10px;
+}
+
+#back-button .button {
+  position: relative;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 35%;
+}
 
+/******************/
+/* Game Over Menu */
+/******************/
 @keyframes game-over-fade-in {
     from {
       display: none;
       opacity: 0;
-    }
-    to {
+    } to {
       display: block;
       opacity: 1;
     }
@@ -541,94 +558,9 @@ button .banner {
 }
 
 
-/*******************/
-/**** DIFFICULTY ***/
-/*******************/
-
-@keyframes menu-drop-in {
-    from {
-      top: -50%;
-    }
-    to {
-      transform: translateY(-50%);
-      top: 50%;
-    }
-}
-
-#difficulty-menu {
-  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
-  display: none;
-  position: absolute;
-  margin: auto;
-  left: 0;
-  right: 0;
-  top: -50%;
-  margin: auto;
-  background-color: #CCFFFF;
-  width: 400px;
-  height: 600px;
-  z-index: 10;
-  animation-name: menu-drop-in;
-  animation-duration: 1s;
-  animation-fill-mode: forwards;
-  box-shadow: 0px 3px 94px 20px rgba(0,0,0,0.38);
-}
-
-#difficulty-menu h2 {
-  font-size: 2em;
-}
-
-#difficulty-menu .button {
-  position: relative;
-  margin-top: 17px;
-  margin-bottom: 5px;
-  left: 50%;
-  transform: translateX(-50%);
-  background-color: #18306E;
-}
-
-#difficulty-menu #start-button {
-  position: relative;
-  margin-top: 17px;
-  margin-bottom: 5px;
-  left: 50%;
-  transform: translateX(-50%);  
-  background-color: #0AAFF1;
-  background: #F1AE3E;
-}
-
-#difficulty-menu .tutorial-button {
-  position: relative;
-  margin-top: 17px;
-  margin-bottom: 5px;
-  left: 50%;
-  transform: translateX(-50%);  
-  background-color: #0AAFF1;
-  background: #F1AE3E;
-}
-
-#difficulty-menu .main-menu-button {
-  position: relative;
-  margin-top: 17px;
-  left: 50%;
-  transform: translateX(-50%);  
-  background-color: #0AAFF1;
-  background: #F1AE3E;
-}
-
-#difficulty-menu .button-selected {
-  position: relative;
-  margin-top: 20px;
-  margin-bottom: 5px;
-  left: 50%;
-  transform: translateX(-50%);
-  background-color: #18306E;
-}
-
 /*******************/
 /**** PAUSE MENU ***/
 /*******************/
-
 #pause-menu {
   background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
   display: none;
@@ -673,279 +605,39 @@ button .banner {
   width: 100%;
   height: 100%;
   background-color: black;
-  /*opacity: 0.5;*/
-  /*filter: alpha(opacity=40);*/
-  /* For IE8 and earlier */
   z-index: 7;
 }
 
-/************************/
-/**** TUTORIAL SCREEN ***/
-/************************/
+/**********************/
+/* For Mobile Devices */
+/**********************/
+@media screen and (max-width: 530px) {
+  /****************/
+  /* Menu Buttons */
+  /****************/
+  .button-selected {
+    outline: 5px solid white;
+  }
 
-#tutorial-screen {
-  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
-  display: none;
-  position: absolute;
-  margin: auto;
-  left: 0;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-  background-color: #CCFFFF;
-  width: 400px;
-  height: 600px;
-  z-index: 11;
-  animation-name: menu-drop-in;
-  animation-duration: 1s;
-  animation-fill-mode: forwards;
-}
+  /*******************/
+  /* Drop down Menus */
+  /*******************/
+  .drop-menu {
+  	width: 350px;
+  }
 
-#tutorial-screen img {
-  height: 425px;
-  width: auto;
-  position: relative;
-  left: 50%;
-  transform: translateX(-50%);
-}
-
-.math-tutorial {
-  display: none;
-}
-
-#tutorial-screen h2 {
-  font-size: 1.3em;
-}
-
-#tutorial-screen .button {
-  position: relative;
-  left: 50%;
-  margin-top: 10px;
-  transform: translateX(-50%);
-  background-color: #F1AE3E;
-}
-
-
-/***************************/
-/**** ACHIEVEMENT SCREEN ***/
-/***************************/
-
-#achievement-screen {
-  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
-  display: none;
-  position: absolute;
-  margin: auto;
-  left: 0;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-  background-color: #CCFFFF;
-  width: 400px;
-  height: 650px;
-  z-index: 10;
-  animation-name: menu-drop-in;
-  animation-duration: 1s;
-  animation-fill-mode: forwards;
-  box-shadow: 0px 3px 94px 20px rgba(0,0,0,0.38);
-  overflow: hidden;
-}
-
-#achievement-screen h2 {
-  font-size: 2em;
-}
-
-#achievement-screen .button {
-  position: relative;
-  margin-top: 0.5em;
-  margin-top: 18px;
-  left: 50%;
-  transform: translateX(-50%);
-  background-color: #F1AE3E;
-}
-
-#achievements-table {
-  box-shadow: 0px 3px 28px 0px rgba(0,0,0,0.38);
-  font-family: 'Montserrat', sans-serif;
-  text-shadow: 0px 6px 18px rgba(0, 0, 0, 0.50);
-  color: white;
-  width: 95%;
-  width: 90%;
-  position: relative;
-  left: 50%;
-  transform:translateX(-50%);
-  border-collapse: collapse;
-  background: #4593DE;
-  background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
-}
-
-#achievements-table tr {
-  border-top: solid 5px white;
-  border-bottom: solid 5px white;
-}
-
-#achievements-table td {
-  vertical-align: top;
-  padding-left: 0.5em;
-  padding-top: 0.5em;
-  padding-right: 1em;
-  padding-bottom: 0;
-}
-
-#achievements-table tr:first-child {
-  border-top: 0;
-}
-
-#achievements-table tr:last-child {
-  border-bottom: 0;
-}
-
-#achievements-div {
-  margin: auto;
-  padding-top: 5%;
-  width: 90%;
-  position: relative;
-  height: auto;
-  height: 60%;
-  overflow: auto;
-}
-
-/***********************/
-/* Leaderboard Styling */
-/***********************/
-
-#back-button .button {
-  position: relative;
-  left: 50%;
-  transform: translateX(-50%);
-  width: 35%;
-}
-
-#score-table {
-  position: relative;
-  text-shadow: 0px 6px 18px rgba(0, 0, 0, 0.50);
-  padding: 0;
-  margin-top: 60px;
-}
-
-#leaderboard {
-  display: none;
-  background-image: radial-gradient(53% 102%, rgba(193, 238, 253, 0.65) 34%, rgba(23, 51, 97, 0.36) 100%);
-  display: none;
-  position: absolute;
-  margin: auto;
-  left: 0;
-  right: 0;
-  top: -50%;
-  margin: auto;
-  background-color: #CCFFFF;
-  width: 400px;
-  height: 550px;
-  z-index: 12;
-  animation-name: menu-drop-in;
-  animation-duration: 1s;
-  animation-fill-mode: forwards;
-  box-shadow: 0px 3px 94px 20px rgba(0,0,0,0.38);
-}
-
-#spelling-scores {
-  box-shadow: 0px 3px 28px 0px rgba(0,0,0,0.38);
-  font-family: 'Montserrat', sans-serif;
-  margin: 0, auto, 1em, auto;
-  border: solid 5px;
-  width: 95%;
-  color: white;
-  border-spacing: 10px;
-  border-collapse: seperate;
-  position: relative;
-  background: #4593DE;
-  background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
-}
-.scores {
-  position: relative;
-  left: 50%;
-  transform: translateX(-50%);
-}
-
-.scores th {
-  padding: 0 35px 0 35px;
-  text-decoration: underline;
-}
-
-.scores td {
-  text-align: center;
-}
-
-#math-scores {
-  box-shadow: 0px 3px 28px 0px rgba(0,0,0,0.38);
-  font-family: 'Montserrat', sans-serif;
-  margin: 0, auto, 1em, auto;
-  border: solid 5px;
-  width: 95%;
-  color: white;
-  border-spacing: 10px;
-  position: relative;
-  display: none;
-  background: #4593DE;
-  background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
-}
-
-#leaderboard #next-board .button {
-  width: 32%;
-  float: right;
-  margin-top: 15px;
-  margin-right: 10px;
-}
-
-#leaderboard #previous-board .button {
-  width: 32%;
-  float: left;
-  margin-top: 15px;
-  margin-left: 10px;
-}
-
-#score-table {
-  position: relative;
-  margin: .35em, 0, 0, .2em;
-  padding-left: 2.5%;
-}
-
-
-@keyframes leaderboard-drop-in {
-    from {
-      top: -50%;
-    }
-    to {
-      transform: translateY(-50%);
-      top: 50%;
-    }
-}
-
-/*******************************************/
-/* Fill screen when under 1000px */
-/*******************************************/
-@media screen and (max-width: 1000px) {
-  #wrapper {
-    width: 100%;
-  }
-  
-  #answer-section {
-    top: 80px;
+  /*************/
+  /* Main Menu */
+  /*************/
+  #main-menu {
+    top: 47%;
   }
-}
 
-/**********************/
-/* For larger devices */
-/**********************/
-@media screen and (max-width: 530px) {
-  #wrapper {
-    width: 100%;
-  }
-  
   #menu-bg {
     background: #4593DE;
     background-image: linear-gradient(-180deg, rgba(193,238,253,0.65) 0%, rgba(23,51,97,0.36) 100%);
   }
-  
+
   #title h1 {
     font-size: 3em;
   }
@@ -958,7 +650,6 @@ button .banner {
   .theme {
     height: 100px;
     width: 100px;
-    margin: 0 1em 0.5em 0.9em;
   }
   
   .theme-selected {
@@ -966,16 +657,14 @@ button .banner {
     height: 100px;
     outline: 5px solid white;
   }
-  
-  #difficulty-menu .button-selected {
-    margin-top: 17.5px;
-    margin-bottom: 2.5px;
-  }
-  
-  .button-selected {
-    outline: 5px solid white;
+
+  button .banner {
+    font-size: 1em;
+    width: 150%;
+    margin-left: -25px;
+    height: 25px;
   }
-  
+
   #spelling-ship {
     transform: rotate(-45deg);
     margin-left: -10px;
@@ -983,94 +672,18 @@ button .banner {
     width: 90px;
     height: 125px;
   }
-  
-  button .banner {
-    font-family: 'Montserrat', sans-serif;
-    font-weight: 400;
-    font-size: 1em;
-    color: #FFFFFF;
-    text-shadow: 0px 2px 20px rgba(0,0,0,0.50);
-    background-color: #B6182A;
-    transform: rotate(-30deg);
-    width: 150%;
-    margin-left: -25px;
-    height: 25px;
-    box-shadow: 0px 3px 16px 0px rgba(0,0,0,0.38);
-  }
-  
-  #left {
-    width: 50%;
-  }
-  
-  #level-counter {
-    font-size: 1.2em;
-    margin: 0.4em 0 0.1em -1.3em;
-  }
-  
-  #pause-button {
-    font-size: 1.2em;
-    margin: 0.1em 0 0 1.5em;
-  }
-  
-  #right {
-    width: 50%;
-  }
-  
-  #lives-table img {
-    width: 75%;
-    height: auto;
-  }
-  
-  #score-counter {
-    font-size: 4em;
-  }
-  
-  #answer-table {
-    font-size: 2em;
-  }
-  
-  #mobile-buttons {
-    display: block;
-  }
-  
-  #difficulty-menu {
-    width: 350px;
-  }
-  
-  #tutorial-screen {
-    width: 350px;
-  }
-  
-  #leaderboard {
-    width: 350px;
-  }
-  
-  #achievement-screen {
-    width: 350px;
-    height: 600px;
-  }
-  
-  #pause-menu {
-    width: 300px;
-  }
-  
-  .equation-answer {
-    width: 40px;
-    height: 40px;
-    box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.30);
-  }
-  
-  #answer-table {
-    margin: auto;
-  }
-  
-  #game-over {
-    width: 300px;
-    animation-name: game-over-fade-in;
-    animation-duration: 1.5s;
-    animation-fill-mode: forwards;
+
+  /*******************/
+  /* Difficulty Menu */
+  /*******************/
+  #difficulty-menu .button-selected {
+    margin-top: 17.5px;
+    margin-bottom: 2.5px;
   }
-  
+
+  /**********************/
+  /* Leaderboard Screen */
+  /**********************/
   #leaderboard #next-board .button {
     width: 120px;
     float: right;
@@ -1092,15 +705,36 @@ button .banner {
     width: 173px;
   }
   
-  #main-menu {
-    top: 47%;
+  /******************/
+  /* Game Over Menu */
+  /******************/
+  #game-over {
+    width: 300px;
+  }
+
+  /**************/
+  /* Pause Menu */
+  /**************/
+  #pause-menu {
+    width: 300px;
   }
 }
 
 /*********************/
-/* For small devices */
+/* For Small Devices */
 /*********************/
 @media screen and (max-width: 375px) {
+  /*******************/
+  /* Drop Down Menus */
+  /*******************/
+  .drop-menu {
+    width: 100%;
+    height: 100%;
+  }
+
+  /*************/
+  /* Main Menu */
+  /*************/
   #title h1 {
     font-size: 3.5em;
   }
@@ -1119,32 +753,7 @@ button .banner {
     width: 75px;
     height: 75px;
   }
-  
-  #difficulty-menu {
-    width: 100%;
-    height: 100%;
-  }
-  
-  #tutorial-screen {
-    width: 100%;
-    height: 100%;
-  }
-  
-  #tutorial-screen img {
-    width: 300px;
-    height: 400px;
-  }
-  
-  #leaderboard {
-    width: 100%;
-    height: 100%;
-  }
-  
-  #achievement-screen {
-    width: 100%;
-    height: 100%;
-  }
-  
+
   #spelling-ship {
     transform: rotate(-45deg);
     margin-left: -10px;
@@ -1152,34 +761,10 @@ button .banner {
     width: 65px;
     height: 95px;
   }
-  
-  #left {
-    font-size: 0.85em;
-  }
-  
-  #score-counter {
-    font-size: 3.5em;
-  }
-  
-  #word-table {
-    font-size: 1.5em;
-  }
-  
+
   button .banner {
-    font-family: 'Montserrat', sans-serif;
-    font-weight: 400;
     font-size: .75em;
-    color: #FFFFFF;
-    text-shadow: 0px 2px 20px rgba(0,0,0,0.50);
-    background-color: #B6182A;
-    transform: rotate(-30deg);
-    width: 150%;
     margin-left: -18px;
     height: 20px;
-    box-shadow: 0px 3px 16px 0px rgba(0,0,0,0.38);
-  }
-  
-  #main-menu {
-    top: 47%;
   }
 }
\ No newline at end of file