diff --git a/hourglass/client/main/main.css b/hourglass/client/main/main.css
index be2e4da..eb7f7f4 100644
--- a/hourglass/client/main/main.css
+++ b/hourglass/client/main/main.css
@@ -674,7 +674,13 @@ input, textarea {
 #calCreWork {
 	margin-left: 0 !important;
 	color: #fff;
-	display: inline-block;
+	display: none;
+	opacity: 0;
+
+	-webkit-transition: opacity 0.4s ease;  
+	-moz-transition: opacity 0.4s ease; 
+	-ms-transition: opacity 0.4s ease;
+	transition: opacity 0.4s ease;
 
 	-webkit-animation: neonglow 1.5s ease-in-out infinite alternate;
     -moz-animation: neonglow 1.5s ease-in-out infinite alternate;
diff --git a/hourglass/client/main/main.html b/hourglass/client/main/main.html
index 6585912..9ffeb87 100644
--- a/hourglass/client/main/main.html
+++ b/hourglass/client/main/main.html
@@ -33,8 +33,7 @@
         </div>
         <div id="classListHolder">
         {{#if myClasses}}
-
-            <h3>Enrolled</h3><h3 id="calCreWork">{{calCreWork}}</h3>
+            <h3>Enrolled</h3><h3 id="calCreWork">-- Pick a class{{calCreWork}}</h3>
                 {{#each myClasses}}
                     {{> sidebarClasses}}  
                 {{/each}}
diff --git a/hourglass/client/main/main.js b/hourglass/client/main/main.js
index c4da5cc..908cce0 100644
--- a/hourglass/client/main/main.js
+++ b/hourglass/client/main/main.js
@@ -31,9 +31,13 @@ var workColors = {
     "other": "#852E6D"
 };
 
+// Preference settings.
+Session.set("mode", null);
+Session.set("timeHide",null);
+
+// Reactive variables.
 Session.set("calendarclasses", null);
 Session.set("sidebar", null);
-Session.set("mode", null); // Change to user preferences
 Session.set("newWork",null);
 Session.set("currentWork",null);
 Session.set("currentReadableWork",null);
@@ -89,6 +93,7 @@ Template.registerHelper('myClasses', () => {
         }
         Session.set("noclass",false);
         Session.set("calendarclasses", Meteor.user().profile.classes);
+        var hide = Session.get("timeHide");
         return array;
     }
 });
@@ -194,7 +199,6 @@ Template.main.helpers({
                 openDivFade(document.getElementsByClassName("overlay")[0]);
             },
             dayClick: function(date, jsEvent, view) {
-                if(Session.get("sidebar") !== null) return;
                 if(jsEvent.target.className.includes("fc-other-month") || jsEvent.target.className.includes("fc-past")) return;
                 Session.set("calCreWork",true);
                 Session.set("calWorkDate",date.format());
@@ -213,9 +217,18 @@ Template.main.helpers({
     },
     calCreWork() {
         if(Session.get("calCreWork")) {
-            return " -- Pick a Class";
+            var div = document.getElementById("calCreWork");
+            div.style.setProperty("display","inline-block","important");
+            div.style.setProperty("opacity","0","important");
+            setTimeout(function() {
+                div.style.setProperty("opacity","1","important");
+            }, 100);
+            return;
         } else {
-            return "";
+            try {
+                closeDivFade(document.getElementById("calCreWork"));
+            } catch(err) {}
+            return;
         }
     },
     workCenter() {
@@ -305,7 +318,8 @@ Template.main.events({
         !e.includes("fa-bars") &&
         !document.getElementById("menuContainer").contains(event.target) &&
         !document.getElementById("optionsContainer").contains(event.target) &&
-        !event.target.className.includes("fc-day")) {
+        !(event.target.className.includes("fc-today") ||
+        (event.target.className.includes("fc-future") && !event.target.className.includes("fc-other-month")))) {
             if(Session.get("calCreWork")) {
                 Session.set("calCreWork",false);
             }