Worked on add song modal.

app/app.css

@@ -395,7 +395,7 @@ footer a:hover{
   height: 900px;
   text-align: center;
 }
-#song-input{
+.song-input{
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
@@ -414,6 +414,48 @@ footer a:hover{
           transition-duration: 0.25s;
   font-weight: 300;
 }
+.song-input-select{
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  outline: 0;
+  border: 1px solid rgba(255, 255, 255, 0.4);
+  background-color: rgba(255, 255, 255, 0.2);
+  width: 304px;
+  border-radius: 3px;
+  padding: 10px 15px;
+  margin: 1em auto 10px auto;
+  display: block;
+  text-align: center;
+  font-size: 18px;
+  color: white;
+  -webkit-transition-duration: 0.25s;
+          transition-duration: 0.25s;
+  font-weight: 300;
+}
+
+.song-input:hover {
+  background-color: rgba(255, 255, 255, 0.4);
+}
+
+.song-input:focus {
+  background-color: rgba(255, 255, 255, 0.4);
+}
+
+.song-input-select:hover {
+  background-color: rgba(255, 255, 255, 0.4);
+}
+
+.song-input-select > option {
+  color: black;
+  background-color: rgba(255, 255, 255, 0.2);
+}
+
+.song-input:focus {
+  width: 354px;
+  color: white;
+}
+
 #search-song{
   display: block;
   margin: 0 auto;
@@ -507,3 +549,8 @@ footer a:hover{
   background-color: rgb(107, 197, 164);
   color: white;
 }
+
+.song-input-label {
+  width: 100%;
+  text-align: center;
+}

app/templates/room.html

@@ -20,9 +20,22 @@
                     <h4 class="modal-title">Search for a song</h4>
                   </div>
                   <div class="modal-body">
-                    <input type="text" id="song-input">
-                    <button type="button" id="search-song" class="button">Search</button>
-                    <div id="song-results"></div>
+                      <label for="type" class="song-input-label">Song Type</label>
+                      <select name="type" id="type" class="song-input-select">
+                          <option name="youtube" id="youtube">YouTube</option>
+                          <option name="soundcloud" id="soundcloud">SoundCloud</option>
+                      </select>
+                      <label for="id" class="song-input-label">Song ID</label>
+                      <input class="song-input" name="id" id="id" type="text" />
+                      <label for="id" class="song-input-label">Song Artist</label>
+                      <input class="song-input" name="artist" id="artist" type="text" />
+                      <label for="title" class="song-input-label">Song Title</label>
+                      <input class="song-input" name="title" id="title" type="text" />
+                      <hr />
+                      <!--small id="search-alert">Searching for a song fills out the above fields automatically, but you will still have to verify them.</small-->
+                      <input type="text" id="song-input" class="song-input">
+                      <button type="button" id="search-song" class="button">Search</button>
+                      <div id="song-results"></div>
                   </div>
                   <div class="modal-footer">
                     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>