diff --git a/.gitignore b/.gitignore
index ee3f929..d69a7dc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -14,4 +14,5 @@ results
 npm-debug.log
 node_modules
 database.js
-.env
\ No newline at end of file
+.env
+profileEJSBU.txt
\ No newline at end of file
diff --git a/app/routes.js b/app/routes.js
index a512f12..eda060c 100644
--- a/app/routes.js
+++ b/app/routes.js
@@ -49,8 +49,14 @@ const moodActions = {
             const user = req.user || null; 
            
             const moodCollection = await Mood.find({ userId: req.user._id }); 
+
+            const latestMood = await Mood.findOne().sort({ timestamp: 1 }).exec();
+            console.log(`This is the latest log: ${latestMood}`)
+            console.log(`This is the latest mood: ${latestMood.mood}`)
+            const backgroundColor = latestMood.length > 0 ? latestMood.mood : 'neutral'
+            console.log(`This is the background color: ${backgroundColor}`)
             
-            res.render('profile', { user, moodCollection });
+            res.render('profile', { user, moodCollection, backgroundColor });
         } catch (err) {
             console.log('Error fetching moods:', err);
             res.status(500).send('Internal Server Error');
@@ -106,7 +112,7 @@ app.post('/submitMood', (req, res) => {
 });
 
 
-// Edit mood 
+// Edit mood
 
 app.put('/mood/:id', async (req, res) => {
     const moodId = req.params.id;
diff --git a/config/database.js b/config/database.js
index 5f3239b..3e9fb59 100644
--- a/config/database.js
+++ b/config/database.js
@@ -1,5 +1,5 @@
 // config/database.js
 module.exports = {
-    'url' : 'mongodb://mongo:xUrCxmUvhUJZtSPhoDOPSmOLCxqczxsS@mongodb.railway.internal:27017', 
+    'url' : 'mongodb+srv://branic1578:eZdPtF9CXVrfL2gF@cluster0.rss8y.mongodb.net/', 
     'dbName': 'mood-tracker'
 };
diff --git a/node_modules/has-symbols/test/shams/core-js.js b/node_modules/has-symbols/test/shams/core-js.js
deleted file mode 100644
index df5365c..0000000
--- a/node_modules/has-symbols/test/shams/core-js.js
+++ /dev/null
@@ -1,28 +0,0 @@
-'use strict';
-
-var test = require('tape');
-
-if (typeof Symbol === 'function' && typeof Symbol() === 'symbol') {
-	test('has native Symbol support', function (t) {
-		t.equal(typeof Symbol, 'function');
-		t.equal(typeof Symbol(), 'symbol');
-		t.end();
-	});
-	return;
-}
-
-var hasSymbols = require('../../shams');
-
-test('polyfilled Symbols', function (t) {
-	/* eslint-disable global-require */
-	t.equal(hasSymbols(), false, 'hasSymbols is false before polyfilling');
-	require('core-js/fn/symbol');
-	require('core-js/fn/symbol/to-string-tag');
-
-	require('../tests')(t);
-
-	var hasSymbolsAfter = hasSymbols();
-	t.equal(hasSymbolsAfter, true, 'hasSymbols is true after polyfilling');
-	/* eslint-enable global-require */
-	t.end();
-});
diff --git a/node_modules/has-symbols/test/shams/get-own-property-symbols.js b/node_modules/has-symbols/test/shams/get-own-property-symbols.js
deleted file mode 100644
index 9191b24..0000000
--- a/node_modules/has-symbols/test/shams/get-own-property-symbols.js
+++ /dev/null
@@ -1,28 +0,0 @@
-'use strict';
-
-var test = require('tape');
-
-if (typeof Symbol === 'function' && typeof Symbol() === 'symbol') {
-	test('has native Symbol support', function (t) {
-		t.equal(typeof Symbol, 'function');
-		t.equal(typeof Symbol(), 'symbol');
-		t.end();
-	});
-	return;
-}
-
-var hasSymbols = require('../../shams');
-
-test('polyfilled Symbols', function (t) {
-	/* eslint-disable global-require */
-	t.equal(hasSymbols(), false, 'hasSymbols is false before polyfilling');
-
-	require('get-own-property-symbols');
-
-	require('../tests')(t);
-
-	var hasSymbolsAfter = hasSymbols();
-	t.equal(hasSymbolsAfter, true, 'hasSymbols is true after polyfilling');
-	/* eslint-enable global-require */
-	t.end();
-});
diff --git a/node_modules/oauth/examples/express-gdata/server.js b/node_modules/oauth/examples/express-gdata/server.js
deleted file mode 100644
index 3c7bf7f..0000000
--- a/node_modules/oauth/examples/express-gdata/server.js
+++ /dev/null
@@ -1,168 +0,0 @@
-var express = require('express'),
-	 OAuth = require('oauth').OAuth,
-	 querystring = require('querystring');
-
-// Setup the Express.js server
-var app = express.createServer();
-app.use(express.logger());
-app.use(express.bodyParser());
-app.use(express.cookieParser());
-app.use(express.session({
-	secret: "skjghskdjfhbqigohqdiouk"
-}));
-
-// Home Page
-app.get('/', function(req, res){
-	if(!req.session.oauth_access_token) {
-		res.redirect("/google_login");
-	}
-	else {
-		res.redirect("/google_contacts");
-	}
-});
-
-// Request an OAuth Request Token, and redirects the user to authorize it
-app.get('/google_login', function(req, res) {
-	
-	var getRequestTokenUrl = "https://www.google.com/accounts/OAuthGetRequestToken";
-	
-	// GData specifid: scopes that wa want access to
-	var gdataScopes = [
-		querystring.escape("https://www.google.com/m8/feeds/"),
-		querystring.escape("https://www.google.com/calendar/feeds/")
-	];
-	
-	var oa = new OAuth(getRequestTokenUrl+"?scope="+gdataScopes.join('+'),
-	                  "https://www.google.com/accounts/OAuthGetAccessToken",
-	                  "anonymous",
-	                  "anonymous",
-	                  "1.0",
-	                  "http://localhost:3000/google_cb"+( req.param('action') && req.param('action') != "" ? "?action="+querystring.escape(req.param('action')) : "" ),
-	                  "HMAC-SHA1");
-
-	oa.getOAuthRequestToken(function(error, oauth_token, oauth_token_secret, results){
-	  if(error) {
-			console.log('error');
-	 		console.log(error);
-		}
-	  else { 
-			// store the tokens in the session
-			req.session.oa = oa;
-			req.session.oauth_token = oauth_token;
-			req.session.oauth_token_secret = oauth_token_secret;
-		
-			// redirect the user to authorize the token
-	   	res.redirect("https://www.google.com/accounts/OAuthAuthorizeToken?oauth_token="+oauth_token);
-	  }
-	})
-
-});
-
-// Callback for the authorization page
-app.get('/google_cb', function(req, res) {
-		
-	// get the OAuth access token with the 'oauth_verifier' that we received
-	
-	var oa = new OAuth(req.session.oa._requestUrl,
-	                  req.session.oa._accessUrl,
-	                  req.session.oa._consumerKey,
-	                  req.session.oa._consumerSecret,
-	                  req.session.oa._version,
-	                  req.session.oa._authorize_callback,
-	                  req.session.oa._signatureMethod);
-	
-    console.log(oa);
-	
-	oa.getOAuthAccessToken(
-		req.session.oauth_token, 
-		req.session.oauth_token_secret, 
-		req.param('oauth_verifier'), 
-		function(error, oauth_access_token, oauth_access_token_secret, results2) {
-			
-			if(error) {
-				console.log('error');
-				console.log(error);
-	 		}
-	 		else {
-		
-				// store the access token in the session
-				req.session.oauth_access_token = oauth_access_token;
-				req.session.oauth_access_token_secret = oauth_access_token_secret;
-
-	    		res.redirect((req.param('action') && req.param('action') != "") ? req.param('action') : "/google_contacts");
-	 		}
-
-	});
-	
-});
-
-
-function require_google_login(req, res, next) {
-	if(!req.session.oauth_access_token) {
-		res.redirect("/google_login?action="+querystring.escape(req.originalUrl));
-		return;
-	}
-	next();
-};
-
-app.get('/google_contacts', require_google_login, function(req, res) {
-	var oa = new OAuth(req.session.oa._requestUrl,
-	                  req.session.oa._accessUrl,
-	                  req.session.oa._consumerKey,
-	                  req.session.oa._consumerSecret,
-	                  req.session.oa._version,
-	                  req.session.oa._authorize_callback,
-	                  req.session.oa._signatureMethod);
-	
-    console.log(oa);
-
-	// Example using GData API v3
-	// GData Specific Header
-	oa._headers['GData-Version'] = '3.0'; 
-	
-	oa.getProtectedResource(
-		"https://www.google.com/m8/feeds/contacts/default/full?alt=json", 
-		"GET", 
-		req.session.oauth_access_token, 
-		req.session.oauth_access_token_secret,
-		function (error, data, response) {
-			
-			var feed = JSON.parse(data);
-			
-			res.render('google_contacts.ejs', {
-				locals: { feed: feed }
-			});
-	});
-	
-});
-
-app.get('/google_calendars', require_google_login, function(req, res) {
-		var oa = new OAuth(req.session.oa._requestUrl,
-	                  req.session.oa._accessUrl,
-	                  req.session.oa._consumerKey,
-	                  req.session.oa._consumerSecret,
-	                  req.session.oa._version,
-	                  req.session.oa._authorize_callback,
-	                  req.session.oa._signatureMethod);
-	// Example using GData API v2
-	// GData Specific Header
-	oa._headers['GData-Version'] = '2'; 
-	
-	oa.getProtectedResource(
-		"https://www.google.com/calendar/feeds/default/allcalendars/full?alt=jsonc", 
-		"GET", 
-		req.session.oauth_access_token, 
-		req.session.oauth_access_token_secret,
-		function (error, data, response) {
-			
-			var feed = JSON.parse(data);
-			
-			res.render('google_calendars.ejs', {
-				locals: { feed: feed }
-			});
-	});
-	
-});
-
-app.listen(3000);
-console.log("listening on http://localhost:3000");
diff --git a/node_modules/oauth/examples/express-gdata/views/google_calendars.ejs b/node_modules/oauth/examples/express-gdata/views/google_calendars.ejs
deleted file mode 100644
index 15b826f..0000000
--- a/node_modules/oauth/examples/express-gdata/views/google_calendars.ejs
+++ /dev/null
@@ -1,21 +0,0 @@
-
-<p><a href="/google_contacts">Check google_contacts</a></p>
-
-<h1>Google Calendars</h1>
-
-<% for(var i = 0 ; i < feed.data.items.length ; i++ ) { 
-  
-  var calendar = feed.data.items[i]; %>
-<div>
-  
-  <h2 style="color:white;background-color:<%= calendar["color"] %>"><%= calendar["title"] %></h2>
-  
-  <p>canEdit: <%= calendar["canEdit"] %></p>
-  <p>accessLevel: <%= calendar["accessLevel"] %></p>
-  <p>timeZone: <%= calendar["timeZone"] %></p>
-  <p>kind: <%= calendar["kind"] %></p>
-  <p>updated: <%= calendar["updated"] %></p>
-  <p>created: <%= calendar["created"] %></p>
-  
-</div>
-<% } %>
\ No newline at end of file
diff --git a/node_modules/oauth/examples/express-gdata/views/google_contacts.ejs b/node_modules/oauth/examples/express-gdata/views/google_contacts.ejs
deleted file mode 100644
index a2050b2..0000000
--- a/node_modules/oauth/examples/express-gdata/views/google_contacts.ejs
+++ /dev/null
@@ -1,24 +0,0 @@
-
-<p><a href="/google_calendars">Check google_calendars</a></p>
-
-<h1>Google Contacts</h1>
-
-<% for(var i = 0 ; i < feed.feed.entry.length ; i++ ) { 
-  
-  var contact = feed.feed.entry[i]; %>
-
-<div>
-  <!-- you can access much more ! Just a sample: -->
-  <%= contact["title"]["$t"] %>
-  <% emails = contact["gd$email"] %>
-  
-  <ul>
-    <% for(var j = 0 ; j < emails.length ; j++) { %>
-      <li><%= emails[j]["address" ]%></li>
-    <% } %>
-  </ul>
-  
-</div>
-
-
-<% } %>
diff --git a/node_modules/oauth/examples/express-gdata/views/layout.ejs b/node_modules/oauth/examples/express-gdata/views/layout.ejs
deleted file mode 100644
index 8d1ac6d..0000000
--- a/node_modules/oauth/examples/express-gdata/views/layout.ejs
+++ /dev/null
@@ -1,9 +0,0 @@
-<html>
-<head>
-</head>
-<body>
-  
-<%- body %>  
-  
-</body>
-</html>
\ No newline at end of file
diff --git a/node_modules/object-inspect/test/browser/dom.js b/node_modules/object-inspect/test/browser/dom.js
deleted file mode 100644
index 210c0b2..0000000
--- a/node_modules/object-inspect/test/browser/dom.js
+++ /dev/null
@@ -1,15 +0,0 @@
-var inspect = require('../../');
-var test = require('tape');
-
-test('dom element', function (t) {
-    t.plan(1);
-
-    var d = document.createElement('div');
-    d.setAttribute('id', 'beep');
-    d.innerHTML = '<b>wooo</b><i>iiiii</i>';
-
-    t.equal(
-        inspect([d, { a: 3, b: 4, c: [5, 6, [7, [8, [9]]]] }]),
-        '[ <div id="beep">...</div>, { a: 3, b: 4, c: [ 5, 6, [ 7, [ 8, [Object] ] ] ] } ]'
-    );
-});
diff --git a/node_modules/passport-oauth1/lib/errors/internaloautherror.js b/node_modules/passport-oauth1/lib/errors/internaloautherror.js
deleted file mode 100644
index 37e95bb..0000000
--- a/node_modules/passport-oauth1/lib/errors/internaloautherror.js
+++ /dev/null
@@ -1,45 +0,0 @@
-/**
- * `InternalOAuthError` error.
- *
- * InternalOAuthError wraps errors generated by node-oauth.  By wrapping these
- * objects, error messages can be formatted in a manner that aids in debugging
- * OAuth issues.
- *
- * @constructor
- * @param {String} [message]
- * @param {Object|Error} [err]
- * @api public
- */
-function InternalOAuthError(message, err) {
-  Error.call(this);
-  Error.captureStackTrace(this, this.constructor);
-  this.name = this.constructor.name;
-  this.message = message;
-  this.oauthError = err;
-}
-
-// Inherit from `Error`.
-InternalOAuthError.prototype.__proto__ = Error.prototype;
-
-/**
- * Returns a string representing the error.
- *
- * @return {String}
- * @api public
- */
-InternalOAuthError.prototype.toString = function() {
-  var m = this.name;
-  if (this.message) { m += ': ' + this.message; }
-  if (this.oauthError) {
-    if (this.oauthError instanceof Error) {
-      m = this.oauthError.toString();
-    } else if (this.oauthError.statusCode && this.oauthError.data) {
-      m += ' (status: ' + this.oauthError.statusCode + ' data: ' + this.oauthError.data + ')';
-    }
-  }
-  return m;
-};
-
-
-// Expose constructor.
-module.exports = InternalOAuthError;
diff --git a/node_modules/passport-oauth1/lib/requesttoken/session.js b/node_modules/passport-oauth1/lib/requesttoken/session.js
deleted file mode 100644
index c3a54c0..0000000
--- a/node_modules/passport-oauth1/lib/requesttoken/session.js
+++ /dev/null
@@ -1,38 +0,0 @@
-function SessionStore(options) {
-  if (!options.key) { throw new TypeError('Session-based request token store requires a session key'); }
-  this._key = options.key;
-}
-
-SessionStore.prototype.get = function(req, token, cb) {
-  if (!req.session) { return cb(new Error('OAuth authentication requires session support. Did you forget to use express-session middleware?')); }
-  
-  // Bail if the session does not contain the request token and corresponding
-  // secret.  If this happens, it is most likely caused by initiating OAuth
-  // from a different host than that of the callback endpoint (for example:
-  // initiating from 127.0.0.1 but handling callbacks at localhost).
-  if (!req.session[this._key]) { return cb(new Error('Failed to find request token in session')); }
-  
-  var tokenSecret = req.session[this._key].oauth_token_secret;
-  return cb(null, tokenSecret);
-};
-
-SessionStore.prototype.set = function(req, token, tokenSecret, cb) {
-  if (!req.session) { return cb(new Error('OAuth authentication requires session support. Did you forget to use express-session middleware?')); }
-  
-  if (!req.session[this._key]) { req.session[this._key] = {}; }
-  req.session[this._key].oauth_token = token;
-  req.session[this._key].oauth_token_secret = tokenSecret;
-  cb();
-};
-
-SessionStore.prototype.destroy = function(req, token, cb) {
-  delete req.session[this._key].oauth_token;
-  delete req.session[this._key].oauth_token_secret;
-  if (Object.keys(req.session[this._key]).length === 0) {
-    delete req.session[this._key];
-  }
-  cb();
-};
-
-
-module.exports = SessionStore;
diff --git a/public/img/Mood-Tracker-UI 2.png b/public/img/Mood-Tracker-UI 2.png
new file mode 100644
index 0000000..6a0caff
Binary files /dev/null and b/public/img/Mood-Tracker-UI 2.png differ
diff --git a/public/main.js b/public/main.js
index f6b9db2..ad4e32d 100644
--- a/public/main.js
+++ b/public/main.js
@@ -47,3 +47,49 @@ Array.from(document.querySelectorAll('.deleteClick')).forEach(button => {
       }
   });
 });
+
+
+
+// fetch('/profile', {
+//     method: 'GET',
+//     headers: {
+//         'Content-Type': 'application/json',
+//     },
+//     // body: JSON,
+//     //body: JSON.stringify(payload),
+// })
+// .then(response => {
+//     if (!response.ok) {
+//       throw new Error('Network response was not ok');
+//     }
+//     return response.text();
+//   })
+// .then(data => {
+//   // Handle the data
+//   console.log("This is the data from profile route", data.moodCollection)
+//   // changeBackgroundColor(data);
+// })
+// .catch(error => console.error('Error:', error));
+
+// function changeBackgroundColor(data) {
+//     console.log("This is the data from profile route", data)
+
+//     let backgroundColor = '#EEDAD1'; // Default color
+  
+//     if (data.mood === 'happy') {
+//       backgroundColor = '#FFE680';
+//     } else if (data.mood === 'sad') {
+//       backgroundColor = '#7DA3DA';
+//     } else if (data.mood === 'angry') {
+//       backgroundColor = 'blue';
+//     } else if (data.mood === 'stressed') {
+//         backgroundColor = '#935252';
+//     } else if (data.mood === 'excited') {
+//         backgroundColor = 'blue';
+//     } else {
+//         backgroundColor = '#EEDAD1';
+//     }
+    
+//     setBodyBackgroundColor(backgroundColor);
+//   }
+
diff --git a/public/style.css b/public/style.css
index 3e914f9..0d467a7 100644
--- a/public/style.css
+++ b/public/style.css
@@ -6,7 +6,7 @@
 
 body {
   font-family: 'Helvetica Neue', sans-serif;
-  background: linear-gradient(180deg, #FBE3D2, #FAF4D9); 
+  /* background: linear-gradient(180deg, #FBE3D2, #FAF4D9);  */
   color: #333;
   margin: 0;
   padding: 0;
@@ -14,7 +14,7 @@ body {
 }
 
 .container {
-  max-width: 900px;
+  /* max-width: 900px; */
   margin: 0 auto;
   padding: 30px;
 }
@@ -101,6 +101,7 @@ h1 {
   display: flex;
   justify-content: space-between;
   align-items: center; 
+  /* justify-content: center; */
   margin-bottom: 20px;
 }
 
@@ -138,6 +139,14 @@ h1 {
   background-color: #A03C52;
 }
 
+.large-mood-text {
+  font-size: 8rem;
+}
+
+.large-actions-text {
+  font-size: 3rem;
+}
+
 /* Mood Log List */
 .moodCollection {
   list-style: none;
@@ -226,9 +235,35 @@ h1 {
   margin: 5px 0;
 }
 
+.first-box {
+  float: left;
+  width: 20%;
+  height: 20%;
+}
 
+.box {
+  float: left;
+  width: 40%;
+  height: 20%;
+}
 
+.logout-box {
+  float: left;
+  width: 10%;
+  /* height: 20%; */
+}
 
+body.happy {
+  background-color: #FFE680;
+}
+
+body.sad {
+  background-color: #7DA3DA;
+}
+
+body.neutral {
+  background-color: #FBE3D2;
+}
 
 
 
diff --git a/server.js b/server.js
index d9330dc..1766df9 100644
--- a/server.js
+++ b/server.js
@@ -12,7 +12,7 @@ var morgan       = require('morgan'); // Logging
 var cookieParser = require('cookie-parser');
 var bodyParser   = require('body-parser'); // See whats coming with req
 
-var session      = require('cookie-session'); // This is to deploy it
+var session      = require('express-session'); // Keep logged in session alive
 
 var configDB = require('./config/database.js');
 
diff --git a/views/profile.ejs b/views/profile.ejs
index 04f5251..ef3cd73 100644
--- a/views/profile.ejs
+++ b/views/profile.ejs
@@ -8,25 +8,28 @@
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
     <link rel="stylesheet" href="/style.css">
 </head>
-<body>
+<body class="<%= backgroundColor %>">
+    <%= backgroundColor %>
+
   <div class="container">
 
-    <div class="page-header text-center">
-        <h1>Mood Tracker Profile</h1>
-        <a href="/logout" class="btn btn-logout">Logout</a>
-    </div>
+    <div class="row"> <!--First row: Mood Tracker title and description, mood submission, logout-->
 
-    <div class="row">
+        <div class="first-box">
+            <h1>Mood Tracker Profile</h1>
+            <p>What should you do today?</p>
+            <p>Enter your mood to find out!</p>
+        </div>
 
+        <div class="box">
         <!-- Mood tracker form -->
-        <h2>Add a mood</h2>
         <% if (user) { %>
         <form action="/submitMood" method="POST" class="mood-entry-form">
       
             <!-- Mood, Date Inputs and Submit Button in One Row -->
             <div class="input-group">
                 <div class="input-item">
-                    <label for="mood">Select your mood for the day:</label>
+                    <label for="mood">What's your mood?:</label>
                     <select id="mood-dropdown" name="mood" required>
                         <option value="happy">Happy</option>
                         <option value="sad">Sad</option>
@@ -35,7 +38,7 @@
                 </div>
                 
                 <div class="input-item">
-                    <label for="date-entry">Date Entry:</label>
+                    <label for="date-entry">Date:</label>
                     <input type="date" id="date-entry" name="date-entry" required> 
                 </div>
 
@@ -44,6 +47,25 @@
             </div>
         </form>
         <% } %>
+        </div>
+
+
+        <div class="logout-box">
+            <a href="/logout" class="btn btn-logout">Logout</a>
+        </div>
+
+    </div>
+
+    <div class="main-mood">
+        <% if (moodCollection.length > 0) { %>
+            <% const mainMoodData = moodCollection[moodCollection.length - 1]; %> <!-- '-1' grabs the last object -->
+            <p class="large-mood-text"><strong></strong> <%= mainMoodData.mood %> </p>
+            <p><strong>Last logged date:</strong> <%= mainMoodData.date %> </p>
+            <p class="large-actions-text"><%= mainMoodData.actions %></p>
+          <% } else { %>
+            <p>Enter your mood above</p>
+          <% } %>
+    </div>
 
         <!-- List of all moods logged -->
         <ul class="moodCollection">
@@ -84,7 +106,7 @@
         </div>
         <% }); %>
 
-    </div>
+    
 
 </div>