diff --git a/css/style.css b/css/style.css
index 0b25ad8..de876e6 100644
--- a/css/style.css
+++ b/css/style.css
@@ -152,7 +152,6 @@ body {
   padding-top: 10px;
   width: 100%;
   position: fixed;
-  background: black;
   z-index: 999; }
   #top div {
     margin: auto;
@@ -179,15 +178,15 @@ body {
     transition-property: size;
     transition-duration: .2s; }
 
-.small .hideable {
-  display: none;
-  opacity: 0; }
-
-.small img {
-  max-width: 200px; }
-
-.small h2 {
-  font-size: 1em; }
+.small {
+  background: black; }
+  .small .hideable {
+    display: none;
+    opacity: 0; }
+  .small img {
+    max-width: 200px; }
+  .small h2 {
+    font-size: 1em; }
 
 .large img {
   width: 100%;
diff --git a/index.html b/index.html
index 1c26215..07ca52e 100644
--- a/index.html
+++ b/index.html
@@ -21,6 +21,7 @@
     <style>
         #spaceTakerUpper {
             height: 98vh;
+            background: black;
         }
     </style>
 </head>
@@ -220,9 +221,9 @@
             // var mastHeight = mast.clientHeight;
             // var halfHeight = Math.floor((topHeight / 2) - (mastHeight / 2));
             if (topHeight < 300) {
-                mast.className = "small";
+                topDiv.className = "small";
             } else {
-                mast.className = "large";
+                topDiv.className = "large";
             }
             topDiv.style.height = topHeight + "px";
             // console.log("topheight is " + topHeight + " and topDiv.style.height = " + topDiv.style.height);
diff --git a/sass/style.scss b/sass/style.scss
index c52f330..2efb4be 100644
--- a/sass/style.scss
+++ b/sass/style.scss
@@ -38,7 +38,7 @@ body {
     padding-top: 10px;
     width: 100%;
     position: fixed;
-    background: black;
+    // background: black;
     z-index: 999;
     div {
         margin: auto;
@@ -76,6 +76,7 @@ body {
 
 //small and large classes are applied to #top
 .small {
+    background: black;
     .hideable {
         display: none;
         opacity: 0;