diff --git a/css/global.css b/css/global.css
index b734896..4eb3e30 100644
--- a/css/global.css
+++ b/css/global.css
@@ -104,7 +104,7 @@ h1, h2, h3 {
 /* Cards */
 .card {
     display: flex;
-    flex-direction: row;
+    flex-direction: column;
     align-items: center;
     
     background-color: var(--background);
@@ -131,9 +131,11 @@ h1, h2, h3 {
 }
 
 .post-info {
+    width: 100%;
     display: flex;
     flex-direction: row;
     justify-content: space-between;
+    align-items: center;
 }
 
 .post-info img {
@@ -148,8 +150,60 @@ h1, h2, h3 {
     align-content: flex-end;
 }
 
+.post-stats {
+    display: flex;
+    flex-direction: column;
+    align-content: flex-end;
+    
+    text-align: right;
+}
+
+.post-stats > h6 {
+    margin: 10px;
+}
+
+.post-votes {
+    display: flex;
+}
+
+.stat-con-small {
+    background-color: var(--backgroundTemp);
+    
+    align-items: center;
+    justify-content: center;
+    
+    padding: 0.5rem 1.2rem;
+    border-radius: 1.2rem;
+    margin: 0.2rem;
+    
+    display: flex;
+    flex-direction: row;
+}
+
+.stat-con-small > .material-icons, .stat-con-small > h5 {
+    margin: 0px;
+}
+
+.stat-con-small.pos {
+    color: var(--primaryText);
+}
+
+.stat-con-small.neg {
+    color: var(--secondaryText);
+}
+
 .card h1, .card h2, .card h3 {
     color: var(--text);
+    margin: 0px;
+}
+
+.card > .content {
+    display: flex;
+    flex-direction: row;
+}
+
+.card > .content p {
+    margin-right: 1rem;
 }
 
 /* Quick Post */
@@ -164,6 +218,7 @@ h1, h2, h3 {
 /* Ad Cards */
 .column-ad {
     justify-content: center;
+    text-align: center;
 
     padding: 2rem;
     margin-top: 20px;
@@ -429,6 +484,12 @@ label {
     padding: 8px 1.25rem;
 }
 
+.button.material-icons {
+    font-size: 20px;
+    
+    padding: 8px 1rem;
+}
+
 /* Nav */
 .nav-height {
     margin-top: 4.25rem;
@@ -460,7 +521,7 @@ label {
     font-size: 2rem;
     font-weight: 700;
 }
-.nav .logo img{
+.nav .logo img {
     height: 25px;
 }
 .nav a:not(.button){
@@ -472,12 +533,16 @@ label {
     align-items: center;
 }
 
+.nav-items > .button {
+    margin-left: 10px;
+}
+
 .pfpButton {
     display: inline-block;
     vertical-align: middle;
     padding: 0;
     border: none;
-    margin: 0 1.5rem;
+    margin-left: 10px;
     padding: 1.225rem;
     background: #ccc url("../design_files/newjimbo.png?raw=true");
     background-size: cover;
@@ -557,6 +622,67 @@ label {
 }
 
 
+/* - Media Queries - */
+@media only screen and (min-width: 800px) {
+    .logo-small img {
+        display: none;
+    }
+    
+    .button.search {
+        display: none;
+    }
+}
+
+@media only screen and (max-width: 800px) {
+    
+    /* Nav Items */
+    .nav-items > .input.primaryAlt {
+        display: none;
+    }
+    
+    .logo-large img {
+        display: none;
+    }
+    
+    .button {
+        font-size: 15px;
+        
+        padding: 8px 1.5rem;
+    }
+    
+    /* Hero Header */
+    .hero.large > h1 {
+        font-size: 2rem;
+    }
+    
+}
+
+@media only screen and (max-width: 400px) {    
+    
+    /* Nav Items */
+    .button.search {
+        display: none;
+    }
+    
+    .nav-container {
+        margin: 1rem;
+    }
+    
+    /* Post Cards */
+    .card.post > .content {
+        flex-direction: column;
+    }
+    
+    .card.post > .content p {
+        margin-right: 0px;
+    }
+    
+    .post-votes {
+        flex-direction: column;
+    }
+}
+
+
 /* - Colors - */
     /* Text */
     .default-text { color: var(--text); }
diff --git a/css/page-specific/post.css b/css/page-specific/post.css
index e0ddf86..df27ecb 100644
--- a/css/page-specific/post.css
+++ b/css/page-specific/post.css
@@ -32,7 +32,7 @@
     flex-direction: row;
     align-items: center;
     
-    background-color: var(--backgroundDark);
+    background-color: var(--background);
     border-radius: 1.2rem;
     color: var(--text);
     
diff --git a/design_files/logosquare.png b/design_files/logosquare.png
new file mode 100644
index 0000000..9fd04b5
Binary files /dev/null and b/design_files/logosquare.png differ
diff --git a/index.html b/index.html
index 6a97cfd..055641d 100644
--- a/index.html
+++ b/index.html
@@ -29,14 +29,17 @@
         <!-- Nav Bar -->
         <nav class="nav">
             <div class="nav-container">
-                <a class="logo" href="./"><img src="./design_files/logo.png" alt="STiBaRC Logo"></a>
+                <a class="logo logo-large" href="./"><img src="./design_files/logo.png" alt="STiBaRC Logo"></a>
+                <a class="logo logo-small" href="./"><img src="./design_files/logosquare.png" alt="STiBaRC Logo"></a>
+
                 <span class="flex-grow"></span>
                 
                 <!-- Logged Out Buttons -->
                 <span id="loggedout">
                     <span class="nav-items">
                         <input class="input primaryAlt" placeholder="Search">
-                        <a href="login.html" class="button m-left m-right primaryAlt">Log In</a> 
+                        <a href="" class="button search primaryAlt material-icons">search</a> 
+                        <a href="login.html" class="button primaryAlt">Log In</a> 
                         <a href="signup.html" class="button">Sign Up</a>
                     </span>
                 </span>
@@ -45,6 +48,7 @@
                 <span id="loggedin">
 			        <span class="nav-items">
 				        <input class="input primaryAlt" placeholder="Search">
+                        <a href="" class="button search primaryAlt material-icons">search</a> 
 
 				        <img class="pfpButton" tabindex="0">
 				        <button class="button dropdown"><i class="material-icons" style="vertical-align: middle; line-height: 5px; font-size: 1.75rem;">keyboard_arrow_down</i></button>
@@ -103,22 +107,40 @@ <h1 style="margin-bottom: 1rem;">Recent Posts</h1>
                     
                     <!-- Large Card -->
                     <a class="card post" href="post.html"> 
-                        <span class="content">
-                            <div class="post-info">
-                                <img src="./design_files/newjimbo.png" alt="Profile picture" height="50px">
-                                <div class="post-name" style="flex-grow: 1;">
-                                    <h2 style="line-height: 0rem;">Post Title</h2>
-                                    <h7 style="line-height: 0rem;"><i>Post Author</i></h7>
+                        <div class="post-info">
+                            <img src="./design_files/newjimbo.png" alt="Profile picture" height="50px">
+                            <div class="post-name" style="flex-grow: 1;">
+                                <h2>Post Title</h2>
+                                <h7><i>Post Author</i></h7>
+                            </div>
+                            <div class="post-stats">  
+                                <div class="post-votes">
+                                    <div class="stat-con-small pos">
+                                        <span class="material-icons" style="font-size: 15px; margin-right: 10px;">
+                                            thumb_up
+                                        </span>
+                                        <h5 style="font-size: 12px;">114K</h5>
+                                    </div>
+                                    <div class="stat-con-small neg">
+                                        <span class="material-icons" style="font-size: 15px; margin-right: 10px;">
+                                            thumb_down
+                                        </span>
+                                        <h5 style="font-size: 12px;">50</h5>
+                                    </div>
                                 </div>
-                                <h6 style="flex-grow: 1"> <i>4 Hours Ago</i></h6>
+                                <h6><i>4 Hours Ago</i></h6>
                             </div>
-                            <p style="text-align: justify; max-width: 90%; max-height: 75px; overflow: hidden;">
-                                Here is a paragraph. This paragraph would be either the first 3-4 lines of the post, or a set description given by the user upon publishing, although that feature may have to wait until another post making page refresh. This particular card is the larger size, presumably to be used for full posts.
-                            </p>
-                        </span>
-                        <span class="embed">
-                            <img src="./sample_assets/placeholderimage.png" alt="Embed placeholder">
-                        </span>
+                        </div>
+                        <div class="content">
+                            <span class="left">
+                                <p style="text-align: justify; max-height: 75px; overflow: hidden;">
+                                    Here is a paragraph. This paragraph would be either the first 3-4 lines of the post, or a set description given by the user upon publishing, although that feature may have to wait until another post making page refresh. This particular card is the larger size, presumably to be used for full posts.
+                                </p>
+                            </span>
+                            <span class="right">
+                                <img src="./sample_assets/placeholderimage.png" alt="Embed placeholder">
+                            </span>
+                        </div>
                     </a>
                     
                     <br>