diff --git a/hourglass/client/main/main.css b/hourglass/client/main/main.css
index 26f88af..0e4b8fc 100644
--- a/hourglass/client/main/main.css
+++ b/hourglass/client/main/main.css
@@ -85,6 +85,12 @@ body {
 	pointer-events: all;
 }
 
+.noScroll {
+	width: 100%;
+	height: 100%;
+	position: fixed;
+}
+
 #mainHeader {
 	font-weight: 600;
 	width: 100%;
@@ -1027,7 +1033,7 @@ input, textarea {
 }
 
 .doneUser {
-	font-size: 110%;
+	font-size: 1.5vh;
 	margin: 0;
 	padding: 4% 4% 3% 6%;
 	background-color: rgba(0,0,0,0.1);
@@ -1045,20 +1051,33 @@ input, textarea {
 	background-color: rgba(0,0,0,0.15);
 }
 
+.doneUser div {
+	height: 2vw;
+	line-height: 2vw;
+	text-align: center;
+}
+
 .doneUser img {
 	height: 2vw;
 	width: 2vw;
-	margin-right: 0.5vw;
+	margin-bottom: 0.3vw;
+
+	display: inline-block;
+	vertical-align: middle;
+	line-height: normal;
 
 	-moz-border-radius: 50%;
 	-webkit-border-radius: 50%;
 	border-radius: 50%;
 }
 
+
 .doneUser span {
-	position: absolute;
-	top: 32%;
-	width: 7.5vw;
+	margin-bottom: 0.3vw;
+	
+	display: inline-block;
+	vertical-align: middle;
+	line-height: normal;
 }
 
 #toggleButtons {
@@ -1103,12 +1122,6 @@ input, textarea {
 	box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.15);
 }
 
-.workCreator span {
-	font-weight: 400;
-	font-size: 1.2vh;
-	text-align: center;
-}
-
 #userTab {
 	width: 0; 
 	height: 0; 
diff --git a/hourglass/client/main/main.html b/hourglass/client/main/main.html
index 5cb028b..f0496e1 100644
--- a/hourglass/client/main/main.html
+++ b/hourglass/client/main/main.html
@@ -4,245 +4,251 @@
 </head>
 
 <template name="main">
-    <header id="mainHeader" style="background-color:{{userProfile}}{{divColor 'header'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
-        <i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i>
-        <h1>Hourglass</h1><h2>{{schoolName}}</h2>
-        <i class="fa fa-cog" aria-hidden="true" style="color:{{iconColor 'options'}}"></i>
-        <div id="dropdown">
-            <img src="{{avatar}}">
-        </div>
-        <div id="headerBar"></div>
-    </header>
-    <div id="menuContainer" style="margin-left:{{menuStatus}};background-color:{{divColor 'sidebar'}}">
-        <div id="modes">
-            <div class="mode classes" style="background-color:{{divColor 'funcButton'}}">
-                <i class="fa fa-university" aria-hidden="true"></i>
-                <h4 style="color:{{modeStatus 'classes'}}">Classes</h4>
+    <div class="noScroll">
+        <header id="mainHeader" style="background-color:{{userProfile}}{{divColor 'header'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
+            <i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i>
+            <h1>Hourglass</h1><h2>{{schoolName}}</h2>
+            <i class="fa fa-cog" aria-hidden="true" style="color:{{iconColor 'options'}}"></i>
+            <div id="dropdown">
+                <img src="{{avatar}}">
             </div>
-            <div class="mode calendar" style="background-color:{{divColor 'funcButton'}}">
-                <i class="fa fa-calendar" aria-hidden="true"></i>
-                <h4 style="color:{{modeStatus 'calendar'}}">Calendar</h4>
-            </div>
-        </div>
-        <div id="functions">
-            <div class="function manageClass" onclick="window.location='/profile'" style="background-color:{{divColor 'funcButton'}}">
-                <i class="fa fa-tasks" aria-hidden="true"></i>
-                <h4>Manage Classes</h4>
-            </div>
-        </div>
-        <div id="classListHolder">
-        {{#if myClasses}}
-            <h3>Enrolled</h3>
-            {{#if calCreWork}}
-                <h3 id="calCreWork">-- Pick a class</h3>
-            {{else}}
-                {{#if filterOn}}
-                    <h3 id="disableFilter">Disable All</h3>
-                {{/if}}
-            {{/if}}
-                {{#each myClasses}}
-                    {{> sidebarClasses}}  
-                {{/each}}
-        {{/if}}
-        </div>
-    </div>
-    <div id="optionsContainer" style="margin-right:{{optionsStatus}};background-color:{{divColor 'sidebar'}}">
-        <h3>Preferences</h3>
-        <div id="prefCont">
-            <div>
-                <div class="inputRadioPref">
-                <p class="prefTitle">Theme:</p>
-                <span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
+            <div id="headerBar"></div>
+        </header>
+        <div id="menuContainer" style="margin-left:{{menuStatus}};background-color:{{divColor 'sidebar'}}">
+            <div id="modes">
+                <div class="mode classes" style="background-color:{{divColor 'funcButton'}}">
+                    <i class="fa fa-university" aria-hidden="true"></i>
+                    <h4 style="color:{{modeStatus 'classes'}}">Classes</h4>
                 </div>
-                <div class="prefOptions">
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Light</p>
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Dark</p>
+                <div class="mode calendar" style="background-color:{{divColor 'funcButton'}}">
+                    <i class="fa fa-calendar" aria-hidden="true"></i>
+                    <h4 style="color:{{modeStatus 'calendar'}}">Calendar</h4>
                 </div>
             </div>
-            <div>
-                <div class="inputRadioPref">
-                <p class="prefTitle">Default Mode:</p>
-                <span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
-                </div>
-                <div class="prefOptions">
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Classes</p>
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Calendar</p>
+            <div id="functions">
+                <div class="function manageClass" onclick="window.location='/profile'" style="background-color:{{divColor 'funcButton'}}">
+                    <i class="fa fa-tasks" aria-hidden="true"></i>
+                    <h4>Manage Classes</h4>
                 </div>
             </div>
-            <div>
-                <div  class="inputRadioPref">
-                <p class="prefTitle">Hide Homework:</p>
-                <span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
-                </div>
-                <div class="prefOptions">
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Day</p>
-                    <P class="prefOptionText"  style="background-color:{{divColor 'header'}}">2 Days</p>
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Week</p>
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Month</p>
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Never</p>
-                </div>
-            </div>
-            <div>
-                <div class="inputRadioPref">
-                <p class="prefTitle">Hide Done:</p>
-                <span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
-                </div>
-                <div class="prefOptions">
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
-                    <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">No</p>
-                </div>
-            </div>
-        </div>
-    </div>
-    <img id="bg" src={{bgSrc}}>
-    <div id="mainBody{{highlight}}">
-        {{#if currMode 'classes'}}
-            <div id="classesMode">
-                {{#each myClasses}}
-                    {{> classesMode}}
-                {{/each}}
-            </div>
-        {{/if}}
-
-        {{#if currMode 'calendar'}}
-            <div id="calendar" style="{{calColor}}">
-                {{> fullcalendar calendarOptions}}
-            </div>
-        {{/if}}
-    </div>
-
-    <div class="overlay">
-        <div id="editWork">
-            <div id="editWorkCont" style="background-color:{{divColor 'header'}};border-top:10px solid {{workType}}">
-                <div id="workInfoContainer">
-                    <div id="workNameDiv">
-                        <span id="workNamerestrict">{{commentLength}}</span>
-                        <span class="change req" id="workName" restrict="50">{{work 'name'}}</span>
-                    </div>
-                    <div id="workInfoNmCont">
-                        <div>
-                            <span class="workTitle">Due Date:</span><br>
-                            <span class="change req" re="readonly" id="workDate">{{work 'dueDate'}}</span>
-                        </div>
-                        <div>
-                            <span class="workTitle">Description:</span><br>
-                            <span id="workDescrestrict">{{commentLength}}</span>
-                            <span class="change" type="textarea" id="workDesc" restrict="150">{{work 'description'}}</span>
-                        </div>
-                        <div>
-                            <div  class="inputRadio">
-                            <span class="workTitle">Type:</span>
-                            <span class="change radio req" re="readonly" id="workType">{{work 'type'}}</span>
-                            </div>
-                            <div class="workOptions type">
-                                <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Normal</p>
-                                <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Quiz</p>
-                                <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Test</p>
-                                <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Project</p>
-                                <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Other</p>
-                            </div>
-                        </div>
-                        <!-- <div id="workAttach">Attach other files</div>
-                        <div id="workAttachmentHolder">
-                            {{#each work 'attachments'}}
-                                <a href={{link}}>{{filename}}</a>
-                            {{/each}}
-                        </div> -->
-                        {{#unless newWork}}
-                            <div id="workComments">
-                                <h3>Comments</h3>
-                                <div>
-                                    <textarea id="workComment" class="restrict" rows="4" cols="50" maxlength="200"></textarea><br>
-                                    <div>
-                                        <span id="commentrestrict">{{commentLength}}</span>
-                                        <div id="commentSubmit">Submit</div>
-                                    </div>
-                                </div>
-                                <div id="comment">
-                                    {{#each work 'comments'}}
-                                        {{> comment}}
-                                    {{/each}}
-                                </div>
-                            </div>
-                        {{/unless}}
-                    </div>
-                </div>
-                {{#unless newWork}}
-                    <div id="workToggle">
-                        <div id="done">
-                            {{#each work 'done'}}
-                                {{> doneUsers}}
-                            {{/each}}
-                        </div>
-                        <div id="toggleButtons">
-                            <div id="markDone" style="background-color:{{work 'doneCol'}}">
-                                <i class="fa fa-check-square-o" aria-hidden="true"></i>
-                                <p>{{work 'doneText'}}</p>
-                            </div>
-                            <div id="markConfirm" style="color:{{work 'userConfirm'}}">
-                                <i class="fa fa-thumbs-up" aria-hidden="true"></i>
-                                <p>{{work 'confirmations'}}</p>
-                            </div>
-                            <div id="markReport" style="color:{{work 'userReport'}}">
-                                <i class="fa fa-thumbs-down" aria-hidden="true"></i>
-                                <p>{{work 'reports'}}</p>
-                            </div>
-                            <div class="workCreator doneUser" onclick="window.location='/user/{{work 'email'}}'">
-                                <img src="{{work 'avatar'}}">
-                                <span>Created by<br>{{work 'creator'}}</span>
-                            </div>
-                        </div>
-                    </div>
-                {{/unless}}
-                {{#if inRole}}
-                    {{#if newWork}}
-                        <div id="workSubmit">Save</div>
-                    {{else}}
-                        <div id="workDelete">Delete</div>
+            <div id="classListHolder">
+            {{#if myClasses}}
+                <h3>Enrolled</h3>
+                {{#if calCreWork}}
+                    <h3 id="calCreWork">-- Pick a class</h3>
+                {{else}}
+                    {{#if filterOn}}
+                        <h3 id="disableFilter">Disable All</h3>
                     {{/if}}
                 {{/if}}
+                    {{#each myClasses}}
+                        {{> sidebarClasses}}  
+                    {{/each}}
+            {{/if}}
             </div>
         </div>
-    </div>
+        <div id="optionsContainer" style="margin-right:{{optionsStatus}};background-color:{{divColor 'sidebar'}}">
+            <h3>Preferences</h3>
+            <div id="prefCont">
+                <div>
+                    <div class="inputRadioPref">
+                    <p class="prefTitle">Theme:</p>
+                    <span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
+                    </div>
+                    <div class="prefOptions">
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Light</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Dark</p>
+                    </div>
+                </div>
+                <div>
+                    <div class="inputRadioPref">
+                    <p class="prefTitle">Default Mode:</p>
+                    <span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
+                    </div>
+                    <div class="prefOptions">
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Classes</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Calendar</p>
+                    </div>
+                </div>
+                <div>
+                    <div  class="inputRadioPref">
+                    <p class="prefTitle">Hide Homework:</p>
+                    <span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
+                    </div>
+                    <div class="prefOptions">
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Day</p>
+                        <P class="prefOptionText"  style="background-color:{{divColor 'header'}}">2 Days</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Week</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Month</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Never</p>
+                    </div>
+                </div>
+                <div>
+                    <div class="inputRadioPref">
+                    <p class="prefTitle">Hide Done:</p>
+                    <span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
+                    </div>
+                    <div class="prefOptions">
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">No</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <img id="bg" src={{bgSrc}}>
+        <div id="mainBody{{highlight}}">
+            {{#if currMode 'classes'}}
+                <div id="classesMode">
+                    {{#each myClasses}}
+                        {{> classesMode}}
+                    {{/each}}
+                </div>
+            {{/if}}
 
-    <div id="userDropdown" style="background-color:{{divColor 'dropdown'}}">
-        <div id="userTab" style="border-bottom: 3vh solid {{divColor 'dropdown'}}"></div>
-        <div id="userDropdownAvatar" style="background-color:{{divColor 'dropdown'}}">
-            <img src="{{avatar}}">
-            <p>{{username}}</p>
-        </div>
-        <div id="userFunctions" style="background-color:{{divColor 'dropdown'}}">
-            <div id="myprofile" class="userFunction" onclick="window.location='/profile';">
-                <i class="fa fa-user" aria-hidden="true"></i>
-                <p>My Profile</p>
-            </div>
-            {{#if admin}}
-                <div id="myprofile" class="userFunction" onclick="window.location='/admin';">
-                    <i class="fa fa-cogs" aria-hidden="true"></i>
-                    <p>Admin Panel</p>
+            {{#if currMode 'calendar'}}
+                <div id="calendar" style="{{calColor}}">
+                    {{> fullcalendar calendarOptions}}
                 </div>
             {{/if}}
         </div>
-        <div style="background-color:{{divColor 'dropdown'}}">
-            <div id="myprofile" class="userFunction" onclick="document.getElementById('login-buttons-logout').click();">
-                <i class="fa fa-sign-out" aria-hidden="true"></i>
-                <p>Sign out</p>
+
+        <div class="overlay">
+            <div id="editWork">
+                <div id="editWorkCont" style="background-color:{{divColor 'header'}};border-top:10px solid {{workType}}">
+                    <div id="workInfoContainer">
+                        <div id="workNameDiv">
+                            <span id="workNamerestrict">{{commentLength}}</span>
+                            <span class="change req" id="workName" restrict="50">{{work 'name'}}</span>
+                        </div>
+                        <div id="workInfoNmCont">
+                            <div>
+                                <span class="workTitle">Due Date:</span><br>
+                                <span class="change req" re="readonly" id="workDate">{{work 'dueDate'}}</span>
+                            </div>
+                            <div>
+                                <span class="workTitle">Description:</span><br>
+                                <span id="workDescrestrict">{{commentLength}}</span>
+                                <span class="change" type="textarea" id="workDesc" restrict="150">{{work 'description'}}</span>
+                            </div>
+                            <div>
+                                <div  class="inputRadio">
+                                <span class="workTitle">Type:</span>
+                                <span class="change radio req" re="readonly" id="workType">{{work 'type'}}</span>
+                                </div>
+                                <div class="workOptions type">
+                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Normal</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Quiz</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Test</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Project</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Other</p>
+                                </div>
+                            </div>
+                            <!-- <div id="workAttach">Attach other files</div>
+                            <div id="workAttachmentHolder">
+                                {{#each work 'attachments'}}
+                                    <a href={{link}}>{{filename}}</a>
+                                {{/each}}
+                            </div> -->
+                            {{#unless newWork}}
+                                <div id="workComments">
+                                    <h3>Comments</h3>
+                                    <div>
+                                        <textarea id="workComment" class="restrict" rows="4" cols="50" maxlength="200"></textarea><br>
+                                        <div>
+                                            <span id="commentrestrict">{{commentLength}}</span>
+                                            <div id="commentSubmit">Submit</div>
+                                        </div>
+                                    </div>
+                                    <div id="comment">
+                                        {{#each work 'comments'}}
+                                            {{> comment}}
+                                        {{/each}}
+                                    </div>
+                                </div>
+                            {{/unless}}
+                        </div>
+                    </div>
+                    {{#unless newWork}}
+                        <div id="workToggle">
+                            <div id="done">
+                                {{#each work 'done'}}
+                                    {{> doneUsers}}
+                                {{/each}}
+                            </div>
+                            <div id="toggleButtons">
+                                <div id="markDone" style="background-color:{{work 'doneCol'}}">
+                                    <i class="fa fa-check-square-o" aria-hidden="true"></i>
+                                    <p>{{work 'doneText'}}</p>
+                                </div>
+                                <div id="markConfirm" style="color:{{work 'userConfirm'}}">
+                                    <i class="fa fa-thumbs-up" aria-hidden="true"></i>
+                                    <p>{{work 'confirmations'}}</p>
+                                </div>
+                                <div id="markReport" style="color:{{work 'userReport'}}">
+                                    <i class="fa fa-thumbs-down" aria-hidden="true"></i>
+                                    <p>{{work 'reports'}}</p>
+                                </div>
+                                <div class="workCreator doneUser" onclick="window.location='/user/{{work 'email'}}'">
+                                    <div style="display:inline-block">
+                                        <img src="{{work 'avatar'}}">
+                                    </div>
+                                    <div style="display:inline-block;margin-left:0.3vw">
+                                        <span>{{work 'creator'}}</span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {{/unless}}
+                    {{#if inRole}}
+                        {{#if newWork}}
+                            <div id="workSubmit">Save</div>
+                        {{else}}
+                            <div id="workDelete">Delete</div>
+                        {{/if}}
+                    {{/if}}
+                </div>
             </div>
         </div>
-    </div>
 
-    <div id="requests" style="background-color:{{divColor 'cards'}}">
-        <div id="requestTab" style="background-color:{{divColor 'cards'}}">
-            <i class="fa fa-question" aria-hidden="true"></i>
+        <div id="userDropdown" style="background-color:{{divColor 'dropdown'}}">
+            <div id="userTab" style="border-bottom: 3vh solid {{divColor 'dropdown'}}"></div>
+            <div id="userDropdownAvatar" style="background-color:{{divColor 'dropdown'}}">
+                <img src="{{avatar}}">
+                <p>{{username}}</p>
+            </div>
+            <div id="userFunctions" style="background-color:{{divColor 'dropdown'}}">
+                <div id="myprofile" class="userFunction" onclick="window.location='/profile';">
+                    <i class="fa fa-user" aria-hidden="true"></i>
+                    <p>My Profile</p>
+                </div>
+                {{#if admin}}
+                    <div id="myprofile" 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 'dropdown'}}">
+                <div id="myprofile" class="userFunction" onclick="document.getElementById('login-buttons-logout').click();">
+                    <i class="fa fa-sign-out" aria-hidden="true"></i>
+                    <p>Sign out</p>
+                </div>
+            </div>
         </div>
-        <p>Send an help request, feature, or bug report.</p>
-        <textarea id="requestArea" class="restrict" rows="4" cols="50" maxlength="500" placeholder="Enter request here..."></textarea><br>
-        <div id="requestCont" style="background-color:{{divColor 'cards'}}">
-            <span id="requestrestrict">{{commentLength}}</span>
-            <div id="requestSubmit">Send</div>
+
+        <div id="requests" style="background-color:{{divColor 'cards'}}">
+            <div id="requestTab" style="background-color:{{divColor 'cards'}}">
+                <i class="fa fa-question" aria-hidden="true"></i>
+            </div>
+            <p>Send an help request, feature, or bug report.</p>
+            <textarea id="requestArea" class="restrict" rows="4" cols="50" maxlength="500" placeholder="Enter request here..."></textarea><br>
+            <div id="requestCont" style="background-color:{{divColor 'cards'}}">
+                <span id="requestrestrict">{{commentLength}}</span>
+                <div id="requestSubmit">Send</div>
+            </div>
         </div>
+        {{> loginButtons}}
     </div>
-    {{> loginButtons}}
 </template>
 
 <template name="sidebarClasses">
@@ -311,7 +317,11 @@
 
 <template name="doneUsers">
     <div class="doneUser" onclick="window.location='/user/{{email}}'">
-        <img src='{{avatar}}'>
-        <span>{{user}}</span>
+        <div style="display:inline-block">
+            <img src='{{avatar}}'>
+        </div>
+        <div style="display:inline-block;margin-left:0.3vw">
+            <span>{{user}}</span>
+        </div>
     </div>
 </template>
\ No newline at end of file
diff --git a/hourglass/client/profile/profile.html b/hourglass/client/profile/profile.html
index 6e78927..c6050d1 100644
--- a/hourglass/client/profile/profile.html
+++ b/hourglass/client/profile/profile.html
@@ -1,263 +1,265 @@
 <template name="profile">
-	<div id="mainpage{{userProfile}}" onclick="window.location='/'"><h2>Main Page</h2></div>
-	<div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div>
-	<div id="profPage" style="background-color:{{divColor 'header'}};{{textColor}}{{loadNew}}">
-		<div id="profMainContainer">
-			<div id="profTop">
-				<img id="profBanner" src='{{banner}}' alt="Banner">
-				<img id="profAvatar" src='{{avatar}}' alt="Avatar">
-				<div id="motdBox">
-					<span class="username">{{username}} - </span>
-					<span class="change mo" restrict="50" id="motd">{{motd}}</span>
-					<span id="motdrestrict">{{commentLength}}</span>
+	<div class="noScroll">
+		<div id="mainpage{{userProfile}}" onclick="window.location='/'"><h2>Main Page</h2></div>
+		<div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div>
+		<div id="profPage" style="background-color:{{divColor 'header'}};{{textColor}}{{loadNew}}">
+			<div id="profMainContainer">
+				<div id="profTop">
+					<img id="profBanner" src='{{banner}}' alt="Banner">
+					<img id="profAvatar" src='{{avatar}}' alt="Avatar">
+					<div id="motdBox">
+						<span class="username">{{username}} - </span>
+						<span class="change mo" restrict="50" id="motd">{{motd}}</span>
+						<span id="motdrestrict">{{commentLength}}</span>
+					</div>
 				</div>
-			</div>
-			<div id="profCards">
-				<div id="cardColLeft">
-					<!-- Card 1 -->
-					<div id="profInfo" class="card" style="background-color:{{divColor 'cards'}}">
-						<h3 class="profHea">About</h3>
-						<div id="about">
-							<div>
-								<p class="profTitle">School Name:</p>
-								<span class="change" id="school">{{school}}</span>
-							</div>
-							<br>
-							<div class="radioContainer">
+				<div id="profCards">
+					<div id="cardColLeft">
+						<!-- Card 1 -->
+						<div id="profInfo" class="card" style="background-color:{{divColor 'cards'}}">
+							<h3 class="profHea">About</h3>
+							<div id="about">
 								<div>
-								<p class="profTitle">Grade:</p>
-								<span class="change radio" re="readonly" id="grade">{{grade}}</span>
+									<p class="profTitle">School Name:</p>
+									<span class="change" id="school">{{school}}</span>
 								</div>
-					            <div class="profOptions">
-				                  	<p class="profOptionText"  style="background-color:{{divColor 'header'}}">9th</p>
-					                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">10th</p>
-					                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">11th</p>
-					                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">12th</p>
+								<br>
+								<div class="radioContainer">
+									<div>
+									<p class="profTitle">Grade:</p>
+									<span class="change radio" re="readonly" id="grade">{{grade}}</span>
+									</div>
+						            <div class="profOptions">
+					                  	<p class="profOptionText"  style="background-color:{{divColor 'header'}}">9th</p>
+						                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">10th</p>
+						                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">11th</p>
+						                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">12th</p>
+						            </div>
 					            </div>
-				            </div>
-				        </div>
+					        </div>
+						</div>
+						<!-- Card 2 -->
+						<div id="profPreferences" class="card" style="background-color:{{divColor 'cards'}}">
+							<h3 class="profHea">Preferences</h3>
+							<div id="preferences">
+					            <div class="radioContainer">
+					                <div class="inputRadio">
+					                <p class="profTitle">Theme:</p>
+					                <span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
+					                </div>
+					                <div class="profOptions">
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Light</p>
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Dark</p>
+					                </div>
+					            </div>
+					            <br>
+					            <div class="radioContainer">
+					                <div class="inputRadio">
+					                <p class="profTitle">Default Mode:</p>
+					                <span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
+					                </div>
+					                <div class="profOptions">
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Classes</p>
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Calendar</p>
+					                </div>
+					            </div>
+					            <br>
+					            <div class="radioContainer">
+					                <div class="inputRadio">
+					                <p class="profTitle">Hide Homework:</p>
+					                <span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
+					                </div>
+					                <div class="profOptions">
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Day</p>
+					                    <P class="profOptionText"  style="background-color:{{divColor 'header'}}">2 Days</p>
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Week</p>
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Month</p>
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Never</p>
+					                </div>
+					            </div>
+					            <br>
+					            <div class="radioContainer">
+					                <div class="inputRadio">
+					                <p class="profTitle">Hide Done:</p>
+					                <span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
+					                </div>
+					                <div class="profOptions">
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
+					                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">No</p>
+					                </div>
+					            </div>
+					        </div>
+						</div>
 					</div>
-					<!-- Card 2 -->
-					<div id="profPreferences" class="card" style="background-color:{{divColor 'cards'}}">
-						<h3 class="profHea">Preferences</h3>
-						<div id="preferences">
-				            <div class="radioContainer">
-				                <div class="inputRadio">
-				                <p class="profTitle">Theme:</p>
-				                <span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
-				                </div>
-				                <div class="profOptions">
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Light</p>
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Dark</p>
-				                </div>
-				            </div>
-				            <br>
-				            <div class="radioContainer">
-				                <div class="inputRadio">
-				                <p class="profTitle">Default Mode:</p>
-				                <span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
-				                </div>
-				                <div class="profOptions">
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Classes</p>
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Calendar</p>
-				                </div>
-				            </div>
-				            <br>
-				            <div class="radioContainer">
-				                <div class="inputRadio">
-				                <p class="profTitle">Hide Homework:</p>
-				                <span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
-				                </div>
-				                <div class="profOptions">
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Day</p>
-				                    <P class="profOptionText"  style="background-color:{{divColor 'header'}}">2 Days</p>
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Week</p>
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Month</p>
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Never</p>
-				                </div>
-				            </div>
-				            <br>
-				            <div class="radioContainer">
-				                <div class="inputRadio">
-				                <p class="profTitle">Hide Done:</p>
-				                <span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
-				                </div>
-				                <div class="profOptions">
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
-				                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">No</p>
-				                </div>
-				            </div>
-				        </div>
-					</div>
-				</div>
-				<div id="cardColRight">
-					<!-- Card 3 -->
-					<div id="profClasses" class="card" style="background-color:{{divColor 'cards'}};">
-						<h3 class="profHea">Classes</h3>
-						<div id="classes">
-							<div id="profFunctions">
-								<div class="profFunction manageClass">
-						        	<i class="fa fa-tasks" aria-hidden="true"></i>
-						        	<h4 style="color:{{profClassTabColor 'manClass'}}">Manage my Classes</h4>
-						      	</div>
-						      	<div class="profFunction addClass">
-						        	<i class="fa fa-plus" aria-hidden="true"></i>
-						        	<h4 style="color:{{profClassTabColor 'addClass'}}">Join a Class</h4>
-						      	</div>
-						      	<div class="profFunction createClass">
-						        	<i class="fa fa-graduation-cap" aria-hidden="true"></i>
-						        	<h4 style="color:{{profClassTabColor 'creClass'}}">Create a Class</h4>
-						      	</div>
-						    </div>
-							<div id="profClassInfoHolder">
-							{{#if profClassTab "manClass"}}
-								<div id="label" class="classBox">
-									<span class="name classText">Class Name</span>
-									<span class="teacher classText">Teacher</span>
-									<span class="hour classText">Hour</span>
-									<span class="subscriptions classText">Members</span>
-								</div>
-								<div class="classHolder">
-									{{#each myClasses}}
-										{{> classDisplay}}
+					<div id="cardColRight">
+						<!-- Card 3 -->
+						<div id="profClasses" class="card" style="background-color:{{divColor 'cards'}};">
+							<h3 class="profHea">Classes</h3>
+							<div id="classes">
+								<div id="profFunctions">
+									<div class="profFunction manageClass">
+							        	<i class="fa fa-tasks" aria-hidden="true"></i>
+							        	<h4 style="color:{{profClassTabColor 'manClass'}}">Manage my Classes</h4>
+							      	</div>
+							      	<div class="profFunction addClass">
+							        	<i class="fa fa-plus" aria-hidden="true"></i>
+							        	<h4 style="color:{{profClassTabColor 'addClass'}}">Join a Class</h4>
+							      	</div>
+							      	<div class="profFunction createClass">
+							        	<i class="fa fa-graduation-cap" aria-hidden="true"></i>
+							        	<h4 style="color:{{profClassTabColor 'creClass'}}">Create a Class</h4>
+							      	</div>
+							    </div>
+								<div id="profClassInfoHolder">
+								{{#if profClassTab "manClass"}}
+									<div id="label" class="classBox">
+										<span class="name classText">Class Name</span>
+										<span class="teacher classText">Teacher</span>
+										<span class="hour classText">Hour</span>
+										<span class="subscriptions classText">Members</span>
+									</div>
+									<div class="classHolder">
+										{{#each myClasses}}
+											{{> classDisplay}}
 
-									{{/each}}
-									{{#if noclass}}
-										<h3>No results found...</h3>
-									{{/if}}
-								</div>
-							{{/if}}
+										{{/each}}
+										{{#if noclass}}
+											<h3>No results found...</h3>
+										{{/if}}
+									</div>
+								{{/if}}
 
-							{{#if profClassTab "addClass"}}
-								<div id="joinTop">
-									<i class="fa fa-search" aria-hidden="true"></i>
-									{{> inputAutocomplete id="profClassSearch" settings=classSettings placeholder="Search..."}}
-									<h4 id="private">Join Private Class</h4>
-								</div>
-								<div id="label" class="classBox">
-									<span class="name classText">Class Name</span>
-									<span class="teacher classText">Teacher</span>
-									<span class="hour classText">Hour</span>
-									<span class="subscriptions classText">Members</span>
-								</div>
-								<div class="classHolder">
-								{{#if notsearching}}
-									{{#each classes}}
-										{{> classDisplay}}
-									{{/each}}
-									{{#if noclass}}
-										<h3>No results found...</h3>
-									{{/if}}
-								{{else}} 
-									{{#each autocompleteClasses}}
-										{{> classDisplay}}
-									{{/each}}
-									{{#if notfound}}
-										<h3>No results found...</h3>
+								{{#if profClassTab "addClass"}}
+									<div id="joinTop">
+										<i class="fa fa-search" aria-hidden="true"></i>
+										{{> inputAutocomplete id="profClassSearch" settings=classSettings placeholder="Search..."}}
+										<h4 id="private">Join Private Class</h4>
+									</div>
+									<div id="label" class="classBox">
+										<span class="name classText">Class Name</span>
+										<span class="teacher classText">Teacher</span>
+										<span class="hour classText">Hour</span>
+										<span class="subscriptions classText">Members</span>
+									</div>
+									<div class="classHolder">
+									{{#if notsearching}}
+										{{#each classes}}
+											{{> classDisplay}}
+										{{/each}}
+										{{#if noclass}}
+											<h3>No results found...</h3>
+										{{/if}}
+									{{else}} 
+										{{#each autocompleteClasses}}
+											{{> classDisplay}}
+										{{/each}}
+										{{#if notfound}}
+											<h3>No results found...</h3>
+										{{/if}}
 									{{/if}}
+									</div>
+								{{/if}}
+
+								{{#if profClassTab "creClass"}}
+									<div id="creRules"><p>Submit a request for a class to be approved by an administrator.</p></div>
+									<div id="formContainer">
+										<div class="formDiv">
+							            	<p class="profTitle">School:</p>
+					              			{{> inputAutocomplete settings=schoolComplete class="form-control creInput" 		type="text" name="school" placeholder="Example: International Academy" }}
+						              	</div>
+						              	<div class="formDiv">
+							            	<p class="profTitle">Hour:</p>
+							              	<input class="creInput" type="text" name="hour">
+							            </div>
+							            <div class="formDiv">
+							            	<p class="profTitle">Teacher:</p>
+							              	{{> inputAutocomplete settings=teacherComplete class="form-control creInput" type="text" name="teacher" placeholder="Example: Woods" }}
+							            </div>
+							            <div class="formDiv">
+							            	<p class="profTitle">Class Name:</p>
+							              	<input class="creInput" type="text" name="classname">
+							            </div>
+							            <div class="formDiv">
+								            <p class="profTitle">Privacy:</p>
+							              	<input class="creInput radio op" type="text" name="privacy" readonly>
+							              	<div class="profOptions creOp">
+							                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Public</p>
+							                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Private</p>
+							              	</div>
+						              	</div>
+						              	<div class="formDiv">
+								            <p class="profTitle">Category:</p>
+							              	<input class="creInput radio op" type="text" name="category" readonly>
+							              	<div class="profOptions creOp">
+							                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Class</p>
+							                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Club</p>
+							                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Other</p>
+							              	</div>
+								        </div>
+							        </div>
+							        <h3 id="creSubmit">Submit Request</h3>
 								{{/if}}
 								</div>
-							{{/if}}
-
-							{{#if profClassTab "creClass"}}
-								<div id="creRules"><p>Submit a request for a class to be approved by an administrator.</p></div>
-								<div id="formContainer">
-									<div class="formDiv">
-						            	<p class="profTitle">School:</p>
-				              			{{> inputAutocomplete settings=schoolComplete class="form-control creInput" 		type="text" name="school" placeholder="Example: International Academy" }}
-					              	</div>
-					              	<div class="formDiv">
-						            	<p class="profTitle">Hour:</p>
-						              	<input class="creInput" type="text" name="hour">
-						            </div>
-						            <div class="formDiv">
-						            	<p class="profTitle">Teacher:</p>
-						              	{{> inputAutocomplete settings=teacherComplete class="form-control creInput" type="text" name="teacher" placeholder="Example: Woods" }}
-						            </div>
-						            <div class="formDiv">
-						            	<p class="profTitle">Class Name:</p>
-						              	<input class="creInput" type="text" name="classname">
-						            </div>
-						            <div class="formDiv">
-							            <p class="profTitle">Privacy:</p>
-						              	<input class="creInput radio op" type="text" name="privacy" readonly>
-						              	<div class="profOptions creOp">
-						                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Public</p>
-						                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Private</p>
-						              	</div>
-					              	</div>
-					              	<div class="formDiv">
-							            <p class="profTitle">Category:</p>
-						              	<input class="creInput radio op" type="text" name="category" readonly>
-						              	<div class="profOptions creOp">
-						                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Class</p>
-						                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Club</p>
-						                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Other</p>
-						              	</div>
-							        </div>
-						        </div>
-						        <h3 id="creSubmit">Submit Request</h3>
-							{{/if}}
 							</div>
 						</div>
 					</div>
 				</div>
 			</div>
 		</div>
-	</div>
-	<div class="overlay">
-	    <div class="overlayCont" style="background-color:{{divColor 'header'}}">
-	     	<p>{{confirmText}}</p>
-	     	<div id="faCont">
-	     		<i class="fa fa-check-circle-o" aria-hidden="true"></i>
-      			<i class="fa fa-times-circle-o" aria-hidden="true"></i>
-      		</div>
-	    </div>
-  	</div>
+		<div class="overlay">
+		    <div class="overlayCont" style="background-color:{{divColor 'header'}}">
+		     	<p>{{confirmText}}</p>
+		     	<div id="faCont">
+		     		<i class="fa fa-check-circle-o" aria-hidden="true"></i>
+	      			<i class="fa fa-times-circle-o" aria-hidden="true"></i>
+	      		</div>
+		    </div>
+	  	</div>
 
-  	<div id="createdClasses" style="background-color:{{divColor 'cards'}}" classid="{{selectedClass '_id'}}">
-  		<h3>{{selectedClass 'name'}}</h3>
-  		<h4 id="codetext">Code:</h4>
-  		<input id="code" value="{{selectedClass 'code'}}" type="text" readonly>
-  		{{#if code}}
-			<h4 id="copy">Copy Code</h4>
-		{{/if}}
-  		<div id="moderatorCont">
-  			<div class="userAdder">
-  			<h4>Moderators:</h4>
-  			<input class="userAddInput" type="text" placeholder="1234@abc.xyz">
-  			<i class="fa fa-plus" aria-hidden="true"></i>
-			</div>
-			<div class="userHolder">
-	  			{{#each selectedClass 'moderators'}}
-	  				{{> userDisplay}}
-	  			{{/each}}
-	  		</div>
-  		</div>
-  		<div id="bannedCont">
-  			<div class="userAdder">
-	  			<h4>Banned:</h4>
+	  	<div id="createdClasses" style="background-color:{{divColor 'cards'}}" classid="{{selectedClass '_id'}}">
+	  		<h3>{{selectedClass 'name'}}</h3>
+	  		<h4 id="codetext">Code:</h4>
+	  		<input id="code" value="{{selectedClass 'code'}}" type="text" readonly>
+	  		{{#if code}}
+				<h4 id="copy">Copy Code</h4>
+			{{/if}}
+	  		<div id="moderatorCont">
+	  			<div class="userAdder">
+	  			<h4>Moderators:</h4>
 	  			<input class="userAddInput" type="text" placeholder="1234@abc.xyz">
 	  			<i class="fa fa-plus" aria-hidden="true"></i>
+				</div>
+				<div class="userHolder">
+		  			{{#each selectedClass 'moderators'}}
+		  				{{> userDisplay}}
+		  			{{/each}}
+		  		</div>
+	  		</div>
+	  		<div id="bannedCont">
+	  			<div class="userAdder">
+		  			<h4>Banned:</h4>
+		  			<input class="userAddInput" type="text" placeholder="1234@abc.xyz">
+		  			<i class="fa fa-plus" aria-hidden="true"></i>
+				</div>
+				<div class="userHolder">	
+		  			{{#each selectedClass 'banned'}}
+		  				{{> userDisplay}}
+		  			{{/each}}
+	  			</div>
+	  		</div>
+	  		<div id="changeAdmin">
+				<span>Change Owner</span>
 			</div>
-			<div class="userHolder">	
-	  			{{#each selectedClass 'banned'}}
-	  				{{> userDisplay}}
-	  			{{/each}}
-  			</div>
-  		</div>
-  		<div id="changeAdmin">
-			<span>Change Owner</span>
-		</div>
-  		<div id="deleteClass">Delete Class</div>
-  	</div>
+	  		<div id="deleteClass">Delete Class</div>
+	  	</div>
 
-  	<div id="joinPrivClass" style="background-color:{{divColor 'cards'}}">
-  		<h3>Enter Code:</h3>
-  		<input id="privateCode" type="text" placeholder="Enter code here...">
-  		<h4 id="privSubmit">Submit</h4>
-  	</div>
-	{{> loginButtons}}
+	  	<div id="joinPrivClass" style="background-color:{{divColor 'cards'}}">
+	  		<h3>Enter Code:</h3>
+	  		<input id="privateCode" type="text" placeholder="Enter code here...">
+	  		<h4 id="privSubmit">Submit</h4>
+	  	</div>
+		{{> loginButtons}}
+	</div>
 </template>
 
 <template name="classDisplay">