diff --git a/assets/music-mute.png b/assets/music-mute.png
new file mode 100644
index 0000000..60728b1
Binary files /dev/null and b/assets/music-mute.png differ
diff --git a/assets/music.png b/assets/music.png
new file mode 100644
index 0000000..178f1dd
Binary files /dev/null and b/assets/music.png differ
diff --git a/client/index.html b/client/index.html
index d055555..d9c5e02 100644
--- a/client/index.html
+++ b/client/index.html
@@ -13,6 +13,15 @@
   <script src="Config.js"></script>
 </head>
 <body>
+<div class="music-container" title="Click to mute/unmute music">
+  <span class="video-self"></span>
+  <i class="music-icon active"></i>
+  <div class="music-options">
+    <label for="volume">Volume</label>
+    <input type="text" class="volume" id="volume">
+    <label for="volume">%</label>
+  </div>
+</div>
 <div class="container">
   <div class="row">
     <div class="notifications"></div>
@@ -20,6 +29,10 @@
   </div>
 </div>
 <script src="build/app.js"></script>
+
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+<script src="build/tubeplayer.js"></script>
+<script src="build/temp.js"></script>
 <script>
 
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
diff --git a/client/scss/_base.scss b/client/scss/_base.scss
index c5557ab..54f7501 100644
--- a/client/scss/_base.scss
+++ b/client/scss/_base.scss
@@ -101,4 +101,63 @@ body {
   text-align: right;
   color: #8798ac;
   right: 20px;
+}
+
+.music-container {
+  position: fixed;
+  top: 0;
+  right: 0;
+  transition: all .2s ease-in-out 0s;
+  z-index: 20;
+  padding: 30px;
+
+  &:hover .music-options {
+    opacity: 1;
+    visibility: visible;
+  }
+}
+
+.music-icon {
+  background: url(../../assets/music-mute.png) no-repeat;
+  float: right;
+  width: 35px;
+  height: 33px;
+  opacity: .8;
+  cursor: pointer;
+  transition: all .2s ease-in-out 0s;
+
+  &:hover {
+    opacity: 1;
+  }
+
+  &.active {
+    background: url(../../assets/music.png) no-repeat;
+  }
+}
+
+.music-options {
+  float: right;
+  background: rgba(#000, .5);
+  padding: 10px 20px;
+  color: #8798ac;
+  clear: both;
+  margin: 15px 0 0 0;
+  opacity: 0;
+  visibility: hidden;
+  width: 170px;
+
+  label {
+    float: left;
+    margin: 4px 10px 0 0;
+  }
+}
+
+.volume {
+  width: 40px;
+  background: #404d5b;
+  border: 0;
+  padding: 5px;
+  float: left;
+  margin: 0 15px 0 0;
+  text-align: center;
 }
\ No newline at end of file
