diff --git a/hourglass/client/main/main.css b/hourglass/client/main/main.css
index 1ce7c0e..6978354 100644
--- a/hourglass/client/main/main.css
+++ b/hourglass/client/main/main.css
@@ -432,11 +432,12 @@ input {
 }
 
 .classWrapper {
-	width: 300px;
+	width: 20vw;
 	height: 95%;
 	margin: 10px;
 	margin-top: 20px;
 	display: inline-block;
+	position: relative;
 	vertical-align: top;
 }
 
@@ -455,9 +456,8 @@ input {
 }
 
 .mainClassName {
-	font-size: 160%;
+	font-size: 2vw;
 	white-space: normal;
-	word-break: break-all;
 
 	-webkit-filter: none !important;
 	filter: none !important;
@@ -465,15 +465,18 @@ input {
 }
 
 .mainClassHour {
+	font-size: 1.1vw;
 	margin-top: 0;
 	pointer-events: none;
 }
 
 .mainClassTeacher {
+	font-size: 1.1vw;
 	pointer-events: none;
 }
 
 .creWork {
+	font-size: 1.1vw;
 	cursor: pointer;
 	box-shadow: 0px 5px 5px -2px #666;
 
@@ -494,7 +497,7 @@ input {
 
 .workHolder {
 	width: 90% !important;
-	max-height: 71vh;
+	max-height: 55.5vh;
 	padding: 5%;
 }
 
@@ -545,16 +548,16 @@ input {
 }
 
 .cWorkCont {
+	font-size: .97vw;
 	padding: 5%;
 }
 
 .cWorkType {
-	height: 5px;
+	height: .3vw;
 }
 
 .cWorkName {
 	font-weight: 400;
-	font-size: 100%;
 	width: 50%;
 	margin-top: 0;
 	
diff --git a/hourglass/client/main/main.html b/hourglass/client/main/main.html
index ed208c2..de074eb 100644
--- a/hourglass/client/main/main.html
+++ b/hourglass/client/main/main.html
@@ -157,14 +157,14 @@
             </div>
             <div id="userFunctions" style="background-color:{{divColor 'userDropdownColor'}}">
                 {{#if admin}}
-                    <div id="myprofile" class="userFunction" onclick="window.location='/admin';">
+                    <div class="userFunction" onclick="window.location='/admin';">
                         <i class="fa fa-cogs" aria-hidden="true"></i>
                         <p>Admin Panel</p>
                     </div>
                 {{/if}}
             </div>
             <div style="background-color:{{divColor 'userDropdownColor'}}">
-                <div id="myprofile" class="userFunction" onclick="document.getElementById('login-buttons-logout').click();">
+                <div id="signout" class="userFunction">
                     <i class="fa fa-sign-out" aria-hidden="true"></i>
                     <p>Sign out</p>
                 </div>
diff --git a/hourglass/client/main/main.js b/hourglass/client/main/main.js
index 2af258a..33f611c 100644
--- a/hourglass/client/main/main.js
+++ b/hourglass/client/main/main.js
@@ -31,6 +31,8 @@ Session.set("classDispHover", null); // Stores current hovered class filter.
 Session.set("restrictText", {}); // Stores text for comment character restriction.
 Session.set("confirmText", ""); // Stores text for confirmations.
 
+var dragging = false;
+
 // On render actions
 
 Template.login.rendered = function() {
@@ -72,37 +74,33 @@ Template.classesMode.rendered = function() {
     });
     $(".mainClass .slimScrollBar").css("display", "none");
     
-    // Classes mode drag scrolling
-    var dX = 0;
-    var currX = 0;
-    var area = new Hammer($("#classesMode")[0], {
-        domEvents: true
-    });
+    var area = $("#classesMode");
+    var clicked = false;
+    var clickX = 0;
 
-    area.add(new Hammer.Pan({ threshold: 0 }));
-
-    area.on('panmove', function(e) {    
-        if(e.srcEvent.srcElement.className === "classInfo") {
-            /*if(e.srcEvent.pageX <= .06*screen.width) {
-                dX = currX + 5;
-                $("#classesMode").scrollLeft(-dX);
-                return;    
-            } else if(e.srcEvent.pageX >= window.innerWidth-.06*screen.width) {
-                dX = currX + 5;
-                $("#classesMode").scrollLeft(dX);
-                return;
-            } else {
-                return;
-            }*/
-            return;   
+    area.on({
+        'mousemove': function(e) {
+            if(clicked) area.scrollLeft(area.scrollLeft() + (clickX - e.pageX)/25);
+        },
+        'mousedown': function(e) {
+            clicked = true;
+            clickX = e.pageX;
+        },
+        'mouseup': function() {
+            clicked = false;
         }
-        dX = currX + e.deltaX;
-        $("#classesMode").scrollLeft(-dX);
     });
 
-    area.on('panend', function(e) {
-        currX = dX;
-    });
+    /*if(dragging) {
+        var onLeft = e.pageX <= .1*screen.width;
+        var onRight = e.pageX >= (window.innerWidth-.1*screen.width);
+        console.log(onLeft);
+        if(onLeft) {
+            area.scrollLeft(area.scrollLeft() - 5);
+        } else if(onRight) {
+            area.scrollLeft(area.scrollLeft() + 5);
+        }
+    }*/
 };
 
 // Global Helpers
@@ -285,8 +283,11 @@ Template.main.helpers({
             },
             dayClick: function(date, jsEvent, view) { // On-click for each day.
                 if (jsEvent.target.className.includes("fc-past")) return;
-                var realDate = date.format();
-                realDate = new Date(realDate[0], parseInt(realDate[1]) - 1, realDate[2], 11, 59, 59);
+                var realDate = date;
+                date.seconds(59);
+                date.minutes(59);
+                date.hour(15);
+                realDate = realDate._d;
                 Session.set("newWork", true);
                 Session.set("currentWork", {dueDate: realDate});
                 if(!Session.equals("sidebarMode", "create")) toggleToSidebar("create");
@@ -685,6 +686,11 @@ Template.main.events({
     'click .cWorkBottom .fa-exclamation-triangle' (event) {
         serverData = [event.target.parentNode.parentNode.parentNode.parentNode.getAttribute("workid"), "reports"]
         sendData("toggleWork")
+    },
+    'click #signout' () {
+        $(".noScroll").velocity("fadeOut", 50);
+        Session.set('sidebarMode','');
+        document.getElementById('login-buttons-logout').click();
     }
 });
 
@@ -944,19 +950,23 @@ checkComplete = function(required, inputs) {
 startDragula = function() {
     dragula([document.querySelector('#classesMode'), document.querySelector('#nonexistant')], {
         moves: function(el, container, handle) {
-            // return handle.classList.contains("classInfo") || handle.classList.contains("mainClassName");
             return _.intersection(["classInfo"], handle.classList).length > 0;
         }
     })
-        .on('out', function(el) {
-            var els = document.getElementsByClassName("classWrapper");
-            var final = [];
-            for (var i = 0; i < els.length; i++) {
-                var classid = els[i].getElementsByClassName("creWork")[0].getAttribute("classid");
-                final.push(classid);
-            }
-            Meteor.call("reorderClasses", final);
-        });
+    .on('drag', function() {
+        dragging = true;  
+    })
+    .on('out', function(el) {
+        var els = document.getElementsByClassName("classWrapper");
+        if($(els[0]).hasClass("gu-transit")) return;
+        dragging = false;
+        var final = [];
+        for (var i = 0; i < els.length; i++) {
+            var classid = els[i].getElementsByClassName("creWork")[0].getAttribute("classid");
+            final.push(classid);
+        }
+        Meteor.call("reorderClasses", final);
+    });
 };
 
 myClasses = function() {
diff --git a/hourglass/client/menus/menus.html b/hourglass/client/menus/menus.html
index 757c1cf..caa2a1b 100644
--- a/hourglass/client/menus/menus.html
+++ b/hourglass/client/menus/menus.html
@@ -169,9 +169,11 @@
                     <span class="hour classText">Hour</span>
                     <span class="subscriptions classText">Members</span>
                 </div>
-                {{#each myClasses}}
-                    {{> classDisplay}}
-                {{/each}}
+                <div id="classBody">
+                    {{#each myClasses}}
+                        {{> classDisplay}}
+                    {{/each}}
+                </div>
             </div>
         </div>
         <div id="colRight" style="background-color:{{divColor 'sidebarColor'}}">
diff --git a/hourglass/client/menus/menus.js b/hourglass/client/menus/menus.js
index 12de451..b6ebe08 100644
--- a/hourglass/client/menus/menus.js
+++ b/hourglass/client/menus/menus.js
@@ -276,6 +276,16 @@ Template.registerHelper("classSelected", () => {
     return !Session.equals("classInfo", null);
 });
 
+Template.manageClass.rendered = function() {
+    $("#classBody").slimScroll({
+        width: '100%',
+        height: '',
+        touchScrollStep: 60,
+        color: '#FFF',
+        railOpacity: 0.7
+    });
+}
+
 Template.manageClass.events({
     'click .classBox' (event) {
         var classId = event.target.getAttribute("classid");
@@ -330,6 +340,16 @@ Template.manageClass.events({
     }
 });
 
+Template.joinClass.rendered = function() {
+    $("#classBody").slimScroll({
+        width: '100%',
+        height: '',
+        touchScrollStep: 60,
+        color: '#FFF',
+        railOpacity: 0.7
+    });
+}
+
 Template.joinClass.helpers({
     classes() { // Loads all of the possible classes ( Limit of twenty shown ) ( Sorts by class size ) ( Only your school)
         var array = classes.find({
diff --git a/hourglass/client/mobile/mobile.js b/hourglass/client/mobile/mobile.js
index 5868a92..1b75669 100644
--- a/hourglass/client/mobile/mobile.js
+++ b/hourglass/client/mobile/mobile.js
@@ -61,7 +61,7 @@ Template.mobile.rendered = function() {
 					Session.set("mobileMode", "main");
 			        $("#mobileBody").velocity("fadeIn", 200);
 					$("#mainCircleButton").velocity("fadeIn", 200);
-					timedPushback();
+					timedPushback(true);
 				}
 			});
     	}
@@ -78,7 +78,7 @@ Template.mobile.rendered = function() {
 					$("#mainCircleButton").velocity("fadeIn", 200);
 			        $("#mobileBody").velocity("fadeIn", 200);
 			        Session.set("mobileMode", "main");
-    				timedPushback();	
+    				timedPushback(false);	
 				}
 			});
     	}
@@ -111,9 +111,15 @@ Template.mobile.rendered = function() {
 
 		}
 	});
-	timedPushback();
+	timedPushback(true);
 }
 
+Template.mobile.events({
+	'click #mOverlay' () {
+		toggleSidebar(false);
+	}
+});
+
 Template.defaultSidebar.rendered = function() {
 	addMobileButton($(".mSectionMode")[0], 0.2, "brightness", function() {
 		if(Session.equals("mobileMode", "main")) {
@@ -121,7 +127,7 @@ Template.defaultSidebar.rendered = function() {
 		} else {
 			Session.set("mobileMode","main");
 			toggleSidebar(false);
-			timedPushback();
+			timedPushback(true);
 		}
 	});
 
@@ -131,7 +137,7 @@ Template.defaultSidebar.rendered = function() {
 		} else {
 			Session.set("mobileMode","done");
 			toggleSidebar(false);
-			timedPushback();
+			timedPushback(true);
 		}
 	});
 
@@ -182,7 +188,7 @@ Template.defaultSidebar.rendered = function() {
 	addMobileButton($("#mDisableFilter")[0], -0.1, "brightness", function() {
         Session.set("typeFilter", []);
 		Session.set("classDisp", []);
-        timedPushback();
+        timedPushback(true);
 	});
 }
 
@@ -364,7 +370,7 @@ Template.mSidebarClasses.rendered = function() {
 	            array.push(classid);
 	        }
 	        Session.set("classDisp", array);
-	        timedPushback();
+	        timedPushback(true);
 	    }
 	});
 }
@@ -386,7 +392,7 @@ Template.mSideTypeFilter.rendered = function() {
 	            array.push(type);
 	        }
 	        Session.set("typeFilter", array);
-	        timedPushback();
+	        timedPushback(true);
 		}
 	});
 }
@@ -490,7 +496,7 @@ Template.mEditWork.rendered = function() {
 	});
 
 	/*addMobileButton($("#mDelete"), 0.2, "brightness", function() {
-		
+
 	})*/
 }
 
@@ -669,21 +675,27 @@ function toggleSidebar(open) {
 	}
 }
 
-function timedPushback() {
+function timedPushback(type) {
 	var fadeTime = 10;
 	$(".mClassContainer").velocity("stop", true);
-	$(".mClassContainer").velocity("fadeOut", fadeTime);
-	setTimeout(function() {
-		$(".mClassContainer").velocity({left: "-150vw"}, 0);
-		$(".mClassContainer").velocity("fadeIn", 0);
-		$(".mClassContainer").velocity({opacity: 1}, 0);
-		var i = 0;
-		var timer = setInterval(function() {
-			$($(".mClassContainer")[i]).velocity({left: ""});
-			if(i === $(".mClassContainer").length - 1) clearInterval(timer);
-			i += 1;
-		}, 100);
-	}, fadeTime);
+	if(!type) {
+		setTimeout(function() {
+			$(".mClassContainer").velocity({opacity: 1}, 0);
+		}, fadeTime);	
+	} else {
+		$(".mClassContainer").velocity("fadeOut", fadeTime);
+		setTimeout(function() {
+			$(".mClassContainer").velocity({left: "-150vw"}, 0);
+			$(".mClassContainer").velocity("fadeIn", 0);
+			$(".mClassContainer").velocity({opacity: 1}, 0);
+			var i = 0;
+			var timer = setInterval(function() {
+				$($(".mClassContainer")[i]).velocity({left: ""});
+				if(i === $(".mClassContainer").length - 1) clearInterval(timer);
+				i += 1;
+			}, 100);
+		}, fadeTime);
+	}
 }
 
 mobileWork = function() {
diff --git a/hourglass/client/profile/mProfile.css b/hourglass/client/profile/mProfile.css
index 6036aef..4c1ca94 100644
--- a/hourglass/client/profile/mProfile.css
+++ b/hourglass/client/profile/mProfile.css
@@ -111,12 +111,27 @@
 	table-layout: fixed;
 }
 
-.mClassBox .fa {
-	font-size: 4vw;
-	width: 2%;
+.mProfClassDelete {
+	width: 9vw;
+	height: 9vw;
+	background-color: rgba(255,255,255,0.1);
 	display: table-cell;
 }
 
+.mClassBox .fa {
+	font-size: 4vw !important;
+	line-height: 9vw !important; 
+}
+
+#mProfClass .mClassBox {
+	width: 94%;
+	padding: 2% 2% 2% 4%;
+}
+
+#mProfClass .name {
+	width: 48%;
+}
+
 #mProfClassTitle {
 	font-weight: 200;
 	width: 92%;
diff --git a/hourglass/client/profile/mProfile.html b/hourglass/client/profile/mProfile.html
index 4aea1c8..dfb5b3a 100644
--- a/hourglass/client/profile/mProfile.html
+++ b/hourglass/client/profile/mProfile.html
@@ -84,6 +84,8 @@
 		<span class="name classText">{{name}}</span>
 	    <span class="teacher classText">{{teachershort}}</span>
 	    <span class="hour classText">{{hour}}</span>
-	    <i class="fa fa-times" aria-hidden="true"></i>
+	    <div class="mProfClassDelete mCircleButton">
+			<i class="fa fa-times" aria-hidden="true" ></i>
+		</div>
     </div>
 </template>
diff --git a/hourglass/client/profile/mProfile.js b/hourglass/client/profile/mProfile.js
index 54aab01..f3986fc 100644
--- a/hourglass/client/profile/mProfile.js
+++ b/hourglass/client/profile/mProfile.js
@@ -243,10 +243,11 @@ Template.mClassDisplay.rendered = function() {
 }
 
 Template.mClassDisplay2.rendered = function() {
-	var div = this.firstNode.children[3];
-	div.onclick = function() {
-		var newSetting = Session.get("profile");
-		newSetting.classes.splice(newSetting.classes.indexOf(div.getAttribute("classid")),1)
-		Session.set("profile", newSetting);
-	}
+	let div = this.firstNode.children[3];
+    addMobileButton(div, 0.1, "brightness", function() {
+        console.log(div);
+       var newSetting = Session.get("profile");
+        newSetting.classes.splice(newSetting.classes.indexOf(div.parentNode.getAttribute("classid")),1)
+        Session.set("profile", newSetting); 
+    });
 }
\ No newline at end of file