diff --git a/_includes/postslist.njk b/_includes/postslist.njk
index d220513..21920e7 100644
--- a/_includes/postslist.njk
+++ b/_includes/postslist.njk
@@ -1,12 +1,15 @@
 <ol reversed class="postlist" style="counter-reset: start-from {{ (postslistCounter or postslist.length) + 1 }}">
-{% for post in postslist | reverse %}
-  <li class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
-    <a href="{{ post.url | url }}" class="postlist-link">{% if post.data.title %}{{ post.data.title }}{% else %}<code>{{ post.url }}</code>{% endif %}</a>
-    <time class="postlist-date" datetime="{{ post.date | htmlDateString }}">{{ post.date | readableDate }}</time>
-    {% for tag in post.data.tags | filterTagList %}
-      {% set tagUrl %}/tags/{{ tag | slug }}/{% endset %}
-      <a href="{{ tagUrl | url }}" class="post-tag">{{ tag }}</a>
-    {% endfor %}
-  </li>
-{% endfor %}
-</ol>
+	{% for post in postslist | reverse %}
+	<li class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
+		<a href="{{ post.url | url }}" class="postlist-link">{% if post.data.title %}{{ post.data.title }}{% else
+			%}<code>{{ post.url }}</code>{% endif %}</a>
+		<time class="postlist-date" datetime="{{ post.date | htmlDateString }}">{{ post.date | readableDate }}</time>
+		{% for tag in post.data.tags | filterTagList %}
+		<span class="post-tags">
+			{% set tagUrl %}/tags/{{ tag | slug }}/{% endset %}
+			<a href="{{ tagUrl | url }}" class="post-tag">{{ tag }}</a>
+			{% endfor %}
+		</span>
+	</li>
+	{% endfor %}
+</ol>
\ No newline at end of file
diff --git a/css/index.css b/css/index.css
index 3905c5b..e46ed96 100644
--- a/css/index.css
+++ b/css/index.css
@@ -24,7 +24,7 @@ body {
 	display: grid;
 	text-align: justify;
 	grid-template-rows: auto;
-	grid-template-columns: 25% 50% 25%;
+	grid-template-columns: 25% 1fr 25%;
 	grid-template-areas:
 		"left content right";
 	padding: 0;
@@ -39,14 +39,29 @@ body {
 
 @media (max-width: 1024px) {
 	body {
-		grid-template-rows: auto auto auto;
+		grid-template-rows: auto auto 1fr;
 		grid-template-columns: 1fr;
 		grid-template-areas: "left""right""content";
 	}
-
-
+	
+	.postlist .postlist-item {
+		display: grid;
+		grid-template-rows: auto 1fr;
+		grid-template-columns: auto auto 1fr;
+		grid-template-areas: "number title title" "time time tags";
+	}
+	
+	.postlist-item:before { grid-area: number; }
+	.postlist-link { grid-area: title; }
+	.postlist-date { grid-area: time; }
+	.post-tags { grid-area: tags; text-align: left; }
+	
 }
 
+nav {
+	grid-area: right;
+	justify-self: center;
+}
 
 p:last-child {
 	margin-bottom: 0;
@@ -67,7 +82,8 @@ a[href]:visited {
 
 main {
 	padding: 1rem;
-	grid-area: content
+	grid-area: content;
+	justify-self: center;
 }
 
 main :first-child {
@@ -75,13 +91,9 @@ main :first-child {
 }
 
 header {
-	color: var(--text)
-}
-
-header:after {
-	content: "";
-	display: table;
-	clear: both;
+	grid-area: left;
+	color: var(--text);
+	justify-self: center;
 }
 
 table {