diff --git a/src/webfiles/web/css/web.css b/src/webfiles/web/css/web.css
index 0e04a01..0c13981 100644
--- a/src/webfiles/web/css/web.css
+++ b/src/webfiles/web/css/web.css
@@ -1,480 +1,570 @@
 :root {
-    --background:#1B1F3B;
-    --background-alt:#2a2f50;
-    --text:white;
-    --text-secondary:#A1A8D9;
-    --btn:#673DB6;
-    --btn-secondary:#333960;
-    --theme:var(--btn);
-    --theme-light:#A185D6;
-    --text-secondary-2:#8990C1;
-    --border:rgba(255, 255, 255, 0.1);
-    --background-alt-alt:#383f6b
+	--background: #1B1F3B;
+	--background-alt: #2a2f50;
+	--text: white;
+	--text-secondary: #A1A8D9;
+	--btn: #673DB6;
+	--btn-secondary: #333960;
+	--theme: var(--btn);
+	--theme-light: #A185D6;
+	--text-secondary-2: #8990C1;
+	--border: rgba(255, 255, 255, 0.1);
+	--background-alt-alt: #383f6b
 }
-button, input[type="button"], input[type="submit"] {
-    cursor:pointer;
-    background:var(--background-alt-alt);
+
+button,
+input[type="button"],
+input[type="submit"] {
+	cursor: pointer;
+	background: var(--background-alt-alt);
 	color: var(--text);
-    border:0;
-    border-radius:1em;
-    font-weight:700;
-    padding:1em
+	border: 0;
+	border-radius: 1em;
+	font-weight: 700;
+	padding: 1em
 }
+
 a {
-    color:unset
+	color: unset
 }
+
 a:hover {
-    cursor:pointer;
-    text-decoration:underline
+	cursor: pointer;
+	text-decoration: underline
 }
+
 #title {
-    color:var(--text);
-    display:flex;
-    justify-content:center
+	color: var(--text);
+	display: flex;
+	justify-content: center
 }
+
 #nav-bar {
-    display:flex;
-    background:-webkit-gradient(linear,left top,right top,from(#fff),to(#fff5f5));
-    list-style:none;
-    user-select:none
+	display: flex;
+	background: -webkit-gradient(linear, left top, right top, from(#fff), to(#fff5f5));
+	list-style: none;
+	user-select: none
 }
+
 .badge,
 body,
 button {
-    color:var(--text)
+	color: var(--text)
 }
+
 .badge {
-    position:absolute;
-    background:var(--btn);
-    padding:3px 8px;
-    border-radius:1em;
-    margin-left:1.25em;
-    display:none;
-    margin-bottom:30px
+	position: absolute;
+	background: var(--btn);
+	padding: 3px 8px;
+	border-radius: 1em;
+	margin-left: 1.25em;
+	display: none;
+	margin-bottom: 30px
 }
+
 body {
-    background-color:var(--background);
-    margin:0;
-    font-family:"Conv_Poppins-Light",sans-serif
+	background-color: var(--background);
+	margin: 0;
+	font-family: Conv_Poppins-Light, sans-serif
 }
+
 header {
-    display:flex;
-    align-items:flex-start;
-    margin-top:35px;
-    flex-direction:column;
-    position:fixed
+	display: flex;
+	align-items: flex-start;
+	margin-top: 35px;
+	flex-direction: column;
+	position: fixed
 }
+
 a,
 header a,
 header>a,
 header>a:hover {
-    text-decoration:none
+	text-decoration: none
 }
+
 header .logo-link,
 header .logo-link svg {
-    display:block;
-    width:5em
+	display: block;
+	width: 5em
 }
+
 header a {
-    color:var(--text-secondary);
-    padding:.25em 1.5em .25em 1em;
-    border-radius:2em;
-    display:flex;
-    margin:.1em;
-    align-items:center
+	color: var(--text-secondary);
+	padding: .25em 1.5em .25em 1em;
+	border-radius: 2em;
+	display: flex;
+	margin: .1em;
+	align-items: center
 }
+
 header a:first-child {
-    padding:.5em 1em
+	padding: .5em 1em
 }
+
 header a:hover,
 header>.selected {
-    background:var(--background-alt)
+	background: var(--background-alt)
 }
+
 header>a>p {
-    padding-left:1em
+	padding-left: 1em
 }
+
 header>.selected {
-    border-radius:1em;
-    font-weight:700;
-    color:var(--theme-light)
+	border-radius: 1em;
+	font-weight: 700;
+	color: var(--theme-light)
 }
+
 header>.selected>svg {
-    stroke:var(--theme-light)
+	stroke: var(--theme-light)
 }
+
 .mii-icon {
-    width:40px;
-    height:40px;
-    background:#a1a8d9;
-    border-radius:50px
+	width: 40px;
+	height: 40px;
+	background: #a1a8d9;
+	border-radius: 50px
 }
+
 #main {
-    width:95%;
-    max-width:1400px;
-    margin:0 auto;
-    overflow:hidden
+	width: 95%;
+	max-width: 1400px;
+	margin: 0 auto;
+	overflow: hidden
 }
+
 .post-meta-wrapper {
-    display:flex;
-    color:var(--text);
-    align-items:center;
-    margin-left:.5em;
-    height:2em;
-    margin-bottom:0;
-    font-size:small
+	display: flex;
+	color: var(--text);
+	align-items: center;
+	margin-left: .5em;
+	height: 2em;
+	margin-bottom: 0;
+	font-size: small
 }
+
 .post-meta-wrapper>h3>a {
-    text-decoration:none;
-    color:var(--text)
+	text-decoration: none;
+	color: var(--text)
 }
+
 .post-meta-wrapper>h3>a:hover {
-    text-decoration:underline
+	text-decoration: underline
 }
+
 .post-meta-wrapper>h4:last-child {
-    padding-left:.5em;
-    color:var(--text-secondary)
+	padding-left: .5em;
+	color: var(--text-secondary)
 }
+
 .post-user-info-wrapper {
-    display:flex;
-    height:2em
+	display: flex;
+	height: 2em
 }
+
 #wrapper {
-    display:flex;
-    flex-direction:column;
-    align-content:center;
-    justify-content:center;
-    align-items:center
+	display: flex;
+	flex-direction: column;
+	align-content: center;
+	justify-content: center;
+	align-items: center
 }
+
 .posts-wrapper {
-    width:600px;
-    color:var(--text);
-    background:var(--background-alt);
-    margin-bottom:1em;
-    padding:1em;
-    border-radius:1em
+	width: 600px;
+	color: var(--text);
+	background: var(--background-alt);
+	margin-bottom: 1em;
+	padding: 1em;
+	border-radius: 1em
 }
+
 .icon-container>img,
 .user-icon {
-    width:64px;
-    height:64px;
-    border-radius:.5em;
-    background:var(--text-secondary)
+	width: 64px;
+	height: 64px;
+	border-radius: .5em;
+	background: var(--text-secondary)
 }
+
 .user-icon.verified {
-    border:solid 4px var(--btn);
-    width:60px;
-    height:60px
+	border: solid 4px var(--btn);
+	width: 60px;
+	height: 60px
 }
+
 .verified-badge {
-    background:var(--btn);
-    padding:1px 5px;
-    border-radius:1em;
-    color:var(--text);
-    margin-left:.25em
+	background: var(--btn);
+	padding: 1px 5px;
+	border-radius: 1em;
+	color: var(--text);
+	margin-left: .25em
 }
+
 .painting,
 .screenshot {
-    border-radius:1em;
-    width:100%
+	border-radius: 1em;
+	width: 100%
 }
+
 .painting {
-    image-rendering:pixelated
+	image-rendering: pixelated
 }
+
 .screenshot {
-    margin-bottom:1em
+	margin-bottom: 1em
 }
+
 .post-content {
-    display:flex;
-    flex-direction:column;
-    cursor:pointer
+	display: flex;
+	flex-direction: column;
+	cursor: pointer
 }
+
 .post-content>h4 {
-    margin-top:0;
-    margin-bottom:.5em;
-    font-weight:normal;
-    margin-left: .25em;
+	margin-top: 0;
+	margin-bottom: .5em;
+	font-weight: 400;
+	margin-left: .25em;
 	word-wrap: break-word;
-    white-space: pre-wrap;
+	white-space: pre-wrap
 }
+
 .post-content,
 .spoiler-overlay {
-    margin-left:74px
+	margin-left: 74px
 }
+
 .spoiler-overlay>button {
-    width:100%;
-    padding:12px 48px
+	width: 100%;
+	padding: 12px 48px
 }
+
 .post-buttons-wrapper {
-    margin-top:1em;
-    display:flex;
-    justify-content:space-between;
-    user-select:none;
-    margin-left:74px
+	margin-top: 1em;
+	display: flex;
+	justify-content: space-between;
+	user-select: none;
+	margin-left: 74px
 }
+
 .post-buttons-wrapper>span {
-    display:flex;
-    flex-direction:row;
-    align-items:center;
-    padding:.5em
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	padding: .5em
 }
+
 .post-buttons-wrapper>span:nth-of-type(2):hover {
-    background:rgba(0,255,0,.25)
+	background: rgba(0, 255, 0, .25)
 }
+
 .post-buttons-wrapper>span:last-child:hover {
-    background:rgba(0,150,255,.25)
+	background: rgba(0, 150, 255, .25)
 }
+
 .post-buttons-wrapper>span:hover {
-    cursor:pointer;
-    background:rgba(255,0,0,.25);
-    border-radius:.75em
+	cursor: pointer;
+	background: rgba(255, 0, 0, .25);
+	border-radius: .75em
 }
+
 .post-buttons-wrapper>span>h4 {
-    padding-left:.5em;
-    margin:0
+	padding-left: .5em;
+	margin: 0
 }
+
 .post-buttons-wrapper>span.selected>svg {
-    fill:red;
-    stroke:red
+	fill: red;
+	stroke: red
 }
+
 #load-more {
-    width:632px;
-    margin-bottom:1em
+	width: 632px;
+	margin-bottom: 1em
 }
+
 #toast,
 iframe {
-    border-radius:1em
+	border-radius: 1em
 }
+
 #toast {
-    opacity: 0;
-    min-width:250px;
-    margin-left:-141px;
-    background-color:var(--btn);
-    color:var(--text);
-    text-align:center;
-    position:fixed;
-    z-index:10;
-    left:50%;
-    bottom:5em;
-    padding:1ch;
-    transition:all .5s ease
+	opacity: 0;
+	min-width: 250px;
+	margin-left: -141px;
+	background-color: var(--btn);
+	color: var(--text);
+	text-align: center;
+	position: fixed;
+	z-index: 10;
+	left: 50%;
+	bottom: 5em;
+	padding: 1ch;
+	transition: all .5s ease
 }
+
 #toast.show {
-    opacity:1;
+	opacity: 1
 }
+
 .community-list-wrapper {
-    display:grid;
-    grid-template-areas:"icon main""icon footer";
-    gap:0;
-    cursor:pointer;
-    background:var(--background-alt);
-    padding:1em;
-    width:90%;
-    border-radius:1em;
-    grid-template-columns:111px 152px
+	display: grid;
+	grid-template-areas: "icon main" "icon footer";
+	gap: 0;
+	cursor: pointer;
+	background: var(--background-alt);
+	padding: 1em;
+	width: 90%;
+	border-radius: 1em;
+	grid-template-columns: 111px 152px
 }
+
 .community-list-icon {
-    width:100px;
-    height:100px;
-    grid-area:icon;
-    margin-right:1em;
-    border-radius:1em;
-    -webkit-border-radius:1em;
-    -moz-border-radius:1em;
-    -ms-border-radius:1em;
-    -o-border-radius:1em;
+	width: 100px;
+	height: 100px;
+	grid-area: icon;
+	margin-right: 1em;
+	border-radius: 1em;
+	-webkit-border-radius: 1em;
+	-moz-border-radius: 1em;
+	-ms-border-radius: 1em;
+	-o-border-radius: 1em
 }
+
 .community-list-title {
-    margin:.5em 0-1em;
-    font-size:2ch
+	margin: .5em 0-1em;
+	font-size: 2ch
 }
+
 .community-list-followers {
-    margin:.5em 0 0;
-    font-size:1.5ch
+	margin: .5em 0 0;
+	font-size: 1.5ch
 }
+
 .communities-wrapper {
-    display:grid;
-    max-width:900px;
-    grid-template-columns:auto auto auto;
-    grid-row-gap:1em;
-    grid-column-gap:1em
+	display: grid;
+	max-width: 900px;
+	grid-template-columns: auto auto auto;
+	grid-row-gap: 1em;
+	grid-column-gap: 1em
 }
+
 #new {
-    margin-bottom:1em
+	margin-bottom: 1em
 }
+
 iframe {
-    width:100%;
-    height:20em;
-    margin-top:1em
+	width: 100%;
+	height: 20em;
+	margin-top: 1em
 }
+
 .notifications-list-content {
-    background:var(--background-alt);
-    width:600px;
-    min-height:4em;
-    margin:0;
-    display:flex;
-    justify-content:flex-start;
-    align-items:center;
-    border-bottom:2px solid var(--btn-secondary);
-    user-select:none;
-    cursor:pointer;
-    font-size:small
+	background: var(--background-alt);
+	width: 600px;
+	min-height: 4em;
+	margin: 0;
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
+	border-bottom: 2px solid var(--btn-secondary);
+	user-select: none;
+	cursor: pointer;
+	font-size: small
 }
+
 .notifications-list-content:hover {
-    text-decoration:none;
-    background:var(--btn-secondary)
+	text-decoration: none;
+	background: var(--btn-secondary)
 }
+
 .notifications-list-content:first-of-type {
-    border-top-left-radius:1em;
-    border-top-right-radius:1em
+	border-top-left-radius: 1em;
+	border-top-right-radius: 1em
 }
+
 .notifications-list-content:last-of-type {
-    border-bottom-left-radius:1em;
-    border-bottom-right-radius:1em
+	border-bottom-left-radius: 1em;
+	border-bottom-right-radius: 1em
 }
+
 .unread-badge {
-    padding:.25em;
-    border-radius:1em;
-    margin:1em;
-    background-color:var(--btn)
+	padding: .25em;
+	border-radius: 1em;
+	margin: 1em;
+	background-color: var(--btn)
 }
+
 .community-top {
-    background:var(--background-alt);
-    margin-bottom:1em;
-    padding:1em;
-    border-radius:1em;
-    width:600px;
-    overflow:hidden
+	background: var(--background-alt);
+	margin-bottom: 1em;
+	padding: 1em;
+	border-radius: 1em;
+	width: 600px;
+	overflow: hidden
 }
+
 .community-info {
-    display:flex
+	display: flex
 }
+
 .info-boxes-wrapper {
-    display:flex;
-    justify-content:space-evenly;
-    flex-wrap:wrap
+	display: flex;
+	justify-content: space-evenly;
+	flex-wrap: wrap
 }
+
 .info-boxes-wrapper>div {
-    background:var(--background-alt-alt);
-    border-radius:1em;
-    display:flex;
-    flex-direction:column;
-    align-items:center;
-    margin:.5em;
-    flex-grow:1
+	background: var(--background-alt-alt);
+	border-radius: 1em;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	margin: .5em;
+	flex-grow: 1
 }
+
 .info-boxes-wrapper>div>h4:first-child {
-    margin:.75em 0 0;
-    color:var(--theme-light);
-    font-size:small;
-    font-weight:bolder
+	margin: .75em 0 0;
+	color: var(--theme-light);
+	font-size: small;
+	font-weight: bolder
 }
+
 .info-boxes-wrapper>div>h4:last-child {
-    margin:.75em 0;
-    color:var(--text-secondary);
-    font-size:small
+	margin: .75em 0;
+	color: var(--text-secondary);
+	font-size: small
 }
+
 .community-title {
-    padding-left:.5em;
-    font-size:larger;
-    padding-top:.5em
+	padding-left: .5em;
+	font-size: larger;
+	padding-top: .5em
 }
+
 .banner {
-    width:110%;
-    margin:-1em
+	width: 110%;
+	margin: -1em
 }
+
 .community-page-follow-button-wrapper {
-    padding:.25em;
-    border:2px solid var(--btn);
-    border-radius:1em;
-    margin:1.5em 0 auto auto;
-    cursor:pointer;
-    height:fit-content
+	padding: .25em;
+	border: 2px solid var(--btn);
+	border-radius: 1em;
+	margin: 1.5em 0 auto auto;
+	cursor: pointer;
+	height: fit-content
 }
+
 .community-page-follow-button-wrapper.selected,
 .favorite-button.checked {
-    background:var(--btn)
+	background: var(--btn)
 }
+
 .community-page-follow-button-wrapper>p,
 .favorite-button {
-    margin:.25em;
-    color:var(--text)!important
+	margin: .25em;
+	color: var(--text) !important
 }
+
 .favorite-button {
-    border:2px solid var(--btn);
-    border-radius:1em;
-    margin:1.5em 0 auto auto;
-    cursor:pointer;
-    height:fit-content;
-    text-decoration:none!important;
-    padding:1ch
+	border: 2px solid var(--btn);
+	border-radius: 1em;
+	margin: 1.5em 0 auto auto;
+	cursor: pointer;
+	height: fit-content;
+	text-decoration: none !important;
+	padding: 1ch
 }
+
 .list-content-with-icon-and-text {
-    list-style:none;
-    padding:unset
+	list-style: none;
+	padding: unset
 }
+
 .list-content-with-icon-and-text li {
-    display:flex;
-    padding:0.25em 0;
-    border-bottom:1px solid var(--text-secondary)
+	display: flex;
+	padding: .25em 0;
+	border-bottom: 1px solid var(--text-secondary)
 }
+
 .list-content-with-icon-and-text .body {
-    margin-left:1em;
-    width:100%;
-    align-items:center;
-    display:inherit;
-    text-decoration:none
+	margin-left: 1em;
+	width: 100%;
+	align-items: center;
+	display: inherit;
+	text-decoration: none
 }
+
 #news-list-content li .text .nick-name {
-    font-weight:700
+	font-weight: 700
 }
+
 #news-list-content li .text .link {
-    color:var(--theme-light)
+	color: var(--theme-light)
 }
+
 #news-list-content li .text .timestamp {
-    color:#969696;
-    white-space:nowrap
+	color: #969696;
+	white-space: nowrap
 }
+
 .hover {
-    width: 600px;
-    display:inherit;
-    border-radius: 1em;
-    padding: 1em;
+	width: 600px;
+	display: inherit;
+	border-radius: 1em;
+	padding: 1em
 }
+
 .hover:hover {
-    background:var(--background-alt)
+	background: var(--background-alt)
 }
 
 .body.messages {
-    flex-direction: column;
-    justify-content: center;
-    align-items: flex-start !important;
+	flex-direction: column;
+	justify-content: center;
+	align-items: flex-start !important
 }
-.body.messages > .text {
-    padding-bottom: 0.5ch;
+
+.body.messages>.text {
+	padding-bottom: .5ch
 }
-.report h4, .report p {
-    margin: 0 5px 0 0;
+
+.report h4,
+.report p {
+	margin: 0 5px 0 0
 }
+
 .list-content-with-icon-and-text li.reports {
-    flex-direction: column;
+	flex-direction: column
 }
+
 .reports .hover:hover {
-    background: unset;
+	background: unset
 }
+
 .reports button {
-    margin-bottom: 1em;
+	margin-bottom: 1em
 }
+
 button.report {
 	margin-bottom: 1.5em;
 	max-width: 630px;
-	width: 90vw;
+	width: 90vw
 }
-#report-post-page  {
+
+#report-post-page {
 	display: flex;
 	flex-direction: column;
 	justify-content: center;
 	align-items: center;
-	padding: 1em;
+	padding: 1em
 }
+
 #report-form {
 	display: flex;
 	flex-direction: column;
@@ -484,15 +574,17 @@ button.report {
 	max-width: 600px;
 	background: var(--background-alt);
 	border-radius: 1em;
-	margin-top: 4em;
+	margin-top: 4em
 }
-.add-post-page-content.report > div {
+
+.add-post-page-content.report>div {
 	display: flex;
 	justify-items: center;
 	align-items: center;
 	justify-content: center;
-	margin-top: 13px;
+	margin-top: 13px
 }
+
 .report .textarea-text {
 	width: 100%;
 	height: 100px;
@@ -501,20 +593,24 @@ button.report {
 	background: var(--text);
 	padding: 10px;
 	margin: 1em 0;
-	resize: none;
+	resize: none
 }
 
-#report-post-page input[type="submit"] {
-	background: var(--btn);
+#report-post-page input[type=submit] {
+	background: var(--btn)
 }
-#report-post-page input[type="button"] {
-	background: var(--btn-secondary);
+
+#report-post-page input[type=button] {
+	background: var(--btn-secondary)
 }
+
 .buttons.tabs {
 	display: flex;
-	justify-content: center;
+	justify-content: center
 }
-.buttons.tabs > button, .buttons.tabs > a {
+
+.buttons.tabs>a,
+.buttons.tabs>button {
 	width: 100%;
 	margin: 0 1ch;
 	border: 1px solid var(--text-secondary);
@@ -523,174 +619,321 @@ button.report {
 	font-weight: 700;
 	padding: 1em;
 	text-decoration: none;
-  	text-align: center;
+	text-align: center
 }
-.buttons.tabs > button.selected, .buttons.tabs > a.selected {
+
+.buttons.tabs>a.selected,
+.buttons.tabs>button.selected {
 	background: var(--btn);
-	border-color: transparent;
+	border-color: transparent
 }
+
 .col {
 	margin: 2ch;
-	font-size: larger;
+	font-size: larger
 }
+
 .mt-5.text-center {
 	display: flex;
-	justify-content: center;
+	justify-content: center
 }
 
-@media screen and (max-width:1200px) {
-    .communities-wrapper {
-        max-width:600px;
-        grid-template-columns:auto auto;
-        grid-row-gap:10px;
-        grid-column-gap:10px
-    }
-    header {
-        align-items: center;
-    }
-    header p {
-        display: none;
-    }
-    header a {
-        padding: .25em 0.5em .25em 0.5em;
-    }
+.message-post-list .post {
+	position: relative;
+	padding: 10px 0;
+	margin-bottom: 20px;
+	margin-top: 30px;
 }
-@media screen and (max-width:1000px) {
-    #main {
-        width:100%;
-        margin-bottom:60px
-    }
-    #news-list-content,
-    .posts-wrapper {
-        max-width:600px;
-        width:90vw
-    }
-    .post-content,
-    .spoiler-overlay {
-        margin-top:.25em;
-        margin-left:2.5em
-    }
-    .user-icon,
-    .user-icon.verified {
-        width:2em;
-        height:2em
-    }
-    .user-icon.verified {
-        border:solid 2px var(--btn)
-    }
-    .post-buttons-wrapper {
-        margin-top:.5em;
-        margin-bottom:-.5em;
-        margin-left:2.5em
-    }
-    header {
-        width:100%;
-        margin:0;
-        background:var(--background);
-        flex-direction:row;
-        justify-content:space-evenly;
-        bottom:0;
-        border-top:1px solid var(--text-secondary)
-    }
-    header>a:first-child {
-        display:none
-    }
-    header>a:nth-of-type(2) {
-        position:fixed;
-        top:2px;
-        left:4px;
-        border-radius:100%;
-        width:3em;
-        height:3em;
-        padding:0;
-        justify-content:center;
-        z-index:20
-    }
-    header>a>p {
-        display:none
-    }
-    header a {
-        padding:.25em 1em
-    }
-    header svg {
-        scale:.75
-    }
-    header>.selected {
-        background:var(--background-alt);
-        border-radius:1em;
-        font-weight:700;
-        color:var(--theme-light);
-        margin:unset
-    }
-    header>.selected>svg {
-        stroke:var(--theme-light)
-    }
-    #load-more {
-        margin-bottom:1em;
-        max-width:600px;
-        width:90vw
-    }
-    #title {
-        color:var(--text);
-        width:100vw;
-        display:flex;
-        justify-content:center;
-        border-bottom:1px solid var(--text-secondary);
-        padding-top:.5em;
-        padding-bottom:.5em;
-        position:fixed;
-        background:var(--background);
-        margin-top:0
-    }
-    #wrapper {
-        margin-top:4em
-    }
-    #wrapper.bottom {
-        margin-top:0;
-        margin-bottom: 1em;
-    }
-    .communities-wrapper {
-        max-width:600px;
-        grid-template-columns:auto;
-        grid-row-gap:10px;
-        grid-column-gap:10px
-    }
-    .notifications-list-content {
-        width:90vw;
-        min-height:4em
-    }
-    community-info>.user-icon.verified {
-        width:60px;
-        height:60px
-    }
-    .community-info>.user-icon,
-    community-info>.user-icon {
-        width:64px;
-        height:64px
-    }
-    .community-top {
-        max-width:600px;
-        width:90vw
-    }
-    .info-boxes-wrapper>div {
-        width:100%
-    }
-    .community-info>.user-icon.verified {
-        border:solid 4px var(--btn);
-        width:60px;
-        height:60px
-    }
-    list-content-with-icon-and-text li.reports > * {
-        width: 100%;
-        overflow: clip;
-    }
 
-    li.reports .posts-wrapper {
-        margin-left: -1em;
-    }
-
-    li.reports .hover {
-        width: auto;
-        padding: 0.5em 0.25em;
-    }
+.message-post-list .post.my-post .mii-icon-container {
+	float: right;
+	margin: 0 0 0 10px
 }
+
+.message-post-list .post .mii-icon-container {
+	position: relative;
+	float: left;
+	width: 50px;
+	height: 50px;
+	margin-right: 20px;
+	border-radius: 12px;
+	box-shadow: 0 3px 10px rgba(0, 0, 0, .6)
+}
+
+.message-post-list .post .mii-icon {
+	width: 50px;
+	height: 50px;
+	background: #fff;
+	border-radius: 12px
+}
+
+.message-post-list .post.my-post footer {
+	right: 0;
+}
+
+.message-post-list .post footer {
+	display: block;
+	height: 16px;
+	color: var(--text-secondary-2);
+	font-size: 16px;
+	position: absolute;
+	bottom: -14px;
+}
+
+.message-post-list .post.my-post .post-body {
+	float: right;
+	background: var(--theme);
+	color: #fff
+}
+
+.message-post-list .post .post-body {
+	float: left;
+	position: relative;
+	background: #fff;
+	border-radius: 20px;
+	box-shadow: 0 3px 10px rgba(0, 0, 0, .4);
+	padding: 15px 20px;
+	color: #000
+}
+
+.message-post-list .post .post-content {
+	word-wrap: break-word;
+	white-space: pre-wrap;
+	margin-bottom: 0;
+	margin-left: 0;
+	margin-top: 0
+}
+
+.message-post-list .post::after,
+.settings-list-content .settings-list>li:after {
+	content: "";
+	display: block;
+	clear: both
+}
+
+.message-viewer-bubble-sent-memo {
+	width: 340px;
+	height: 127px
+}
+
+.message-viewer-bubble-sent-screenshot {
+	max-width: 500px;
+	max-height: 281px;
+	width: 100%;
+}
+
+.message-post-list .post .post-buttons {
+	margin: 10px -20px -15px;
+	border-top: 2px solid #938a8a;
+	border-radius: 0 0 20px 20px;
+	text-align: right
+}
+
+.message-post-list .post .post-buttons a,
+.message-post-list .post .post-buttons button {
+	display: inline-block;
+	padding: 0 15px;
+	margin: 0;
+	border-width: 0;
+	border-left: none currentcolor;
+	line-height: 50px;
+	font-size: 20px;
+	color: #938a8a;
+	box-shadow: inset 2px 0 0#ddd
+}
+
+@media screen and (max-width: 1200px) {
+	.communities-wrapper {
+		max-width: 600px;
+		grid-template-columns: auto auto;
+		grid-row-gap: 10px;
+		grid-column-gap: 10px
+	}
+
+	header {
+		align-items: center
+	}
+
+	header p {
+		display: none
+	}
+
+	header a {
+		padding: .25em .5em .25em .5em
+	}
+}
+
+@media screen and (max-width: 1000px) {
+	#main {
+		width: 100%;
+		margin-bottom: 60px
+	}
+
+	#news-list-content,
+	.posts-wrapper {
+		max-width: 600px;
+		width: 90vw
+	}
+
+	.post-content,
+	.spoiler-overlay {
+		margin-top: .25em;
+		margin-left: 2.5em
+	}
+
+	.user-icon,
+	.user-icon.verified {
+		width: 2em;
+		height: 2em
+	}
+
+	.user-icon.verified {
+		border: solid 2px var(--btn)
+	}
+
+	.post-buttons-wrapper {
+		margin-top: .5em;
+		margin-bottom: -.5em;
+		margin-left: 2.5em
+	}
+
+	header {
+		width: 100%;
+		margin: 0;
+		background: var(--background);
+		flex-direction: row;
+		justify-content: space-evenly;
+		bottom: 0;
+		border-top: 1px solid var(--text-secondary);
+		z-index: 100;
+	}
+
+	header>a:first-child {
+		display: none
+	}
+
+	header>a:nth-of-type(2) {
+		position: fixed;
+		top: 2px;
+		left: 4px;
+		border-radius: 100%;
+		width: 3em;
+		height: 3em;
+		padding: 0;
+		justify-content: center;
+		z-index: 20
+	}
+
+	header>a>p {
+		display: none
+	}
+
+	header a {
+		padding: .25em 1em
+	}
+
+	header svg {
+		scale: .75
+	}
+
+	header>.selected {
+		background: var(--background-alt);
+		border-radius: 1em;
+		font-weight: 700;
+		color: var(--theme-light);
+		margin: unset
+	}
+
+	header>.selected>svg {
+		stroke: var(--theme-light)
+	}
+
+	#load-more {
+		margin-bottom: 1em;
+		max-width: 600px;
+		width: 90vw
+	}
+
+	#title {
+		color: var(--text);
+		width: 100vw;
+		display: flex;
+		justify-content: center;
+		border-bottom: 1px solid var(--text-secondary);
+		padding-top: .5em;
+		padding-bottom: .5em;
+		position: fixed;
+		background: var(--background);
+		margin-top: 0;
+		z-index: 100;
+	}
+
+	#wrapper {
+		margin-top: 4em
+	}
+
+	#wrapper.bottom {
+		margin-top: 0;
+		margin-bottom: 1em
+	}
+
+	.communities-wrapper {
+		max-width: 600px;
+		grid-template-columns: auto;
+		grid-row-gap: 10px;
+		grid-column-gap: 10px
+	}
+
+	.notifications-list-content {
+		width: 90vw;
+		min-height: 4em
+	}
+
+	community-info>.user-icon.verified {
+		width: 60px;
+		height: 60px
+	}
+
+	.community-info>.user-icon,
+	community-info>.user-icon {
+		width: 64px;
+		height: 64px
+	}
+
+	.community-top {
+		max-width: 600px;
+		width: 90vw
+	}
+
+	.info-boxes-wrapper>div {
+		width: 100%
+	}
+
+	.community-info>.user-icon.verified {
+		border: solid 4px var(--btn);
+		width: 60px;
+		height: 60px
+	}
+
+	list-content-with-icon-and-text li.reports>* {
+		width: 100%;
+		overflow: clip
+	}
+
+	li.reports .posts-wrapper {
+		margin-left: -1em
+	}
+
+	li.reports .hover {
+		width: auto;
+		padding: .5em .25em
+	}
+
+	#message-page {
+		width: 95%;
+	}
+
+	.scroll-focus.mii-icon-container {
+		display: none;
+	}
+}
\ No newline at end of file
diff --git a/src/webfiles/web/css/web.min.css b/src/webfiles/web/css/web.min.css
index 0b1c18f..e6e55e2 100644
--- a/src/webfiles/web/css/web.min.css
+++ b/src/webfiles/web/css/web.min.css
@@ -1 +1 @@
-:root{--background:#1B1F3B;--background-alt:#2a2f50;--text:white;--text-secondary:#A1A8D9;--btn:#673DB6;--btn-secondary:#333960;--theme:var(--btn);--theme-light:#A185D6;--text-secondary-2:#8990C1;--border:rgba(255, 255, 255, 0.1);--background-alt-alt:#383f6b}button,input[type=button],input[type=submit]{cursor:pointer;background:var(--background-alt-alt);color:var(--text);border:0;border-radius:1em;font-weight:700;padding:1em}a{color:unset}a:hover{cursor:pointer;text-decoration:underline}#title{color:var(--text);display:flex;justify-content:center}#nav-bar{display:flex;background:-webkit-gradient(linear,left top,right top,from(#fff),to(#fff5f5));list-style:none;user-select:none}.badge,body,button{color:var(--text)}.badge{position:absolute;background:var(--btn);padding:3px 8px;border-radius:1em;margin-left:1.25em;display:none;margin-bottom:30px}body{background-color:var(--background);margin:0;font-family:Conv_Poppins-Light,sans-serif}header{display:flex;align-items:flex-start;margin-top:35px;flex-direction:column;position:fixed}a,header a,header>a,header>a:hover{text-decoration:none}header .logo-link,header .logo-link svg{display:block;width:5em}header a{color:var(--text-secondary);padding:.25em 1.5em .25em 1em;border-radius:2em;display:flex;margin:.1em;align-items:center}header a:first-child{padding:.5em 1em}header a:hover,header>.selected{background:var(--background-alt)}header>a>p{padding-left:1em}header>.selected{border-radius:1em;font-weight:700;color:var(--theme-light)}header>.selected>svg{stroke:var(--theme-light)}.mii-icon{width:40px;height:40px;background:#a1a8d9;border-radius:50px}#main{width:95%;max-width:1400px;margin:0 auto;overflow:hidden}.post-meta-wrapper{display:flex;color:var(--text);align-items:center;margin-left:.5em;height:2em;margin-bottom:0;font-size:small}.post-meta-wrapper>h3>a{text-decoration:none;color:var(--text)}.post-meta-wrapper>h3>a:hover{text-decoration:underline}.post-meta-wrapper>h4:last-child{padding-left:.5em;color:var(--text-secondary)}.post-user-info-wrapper{display:flex;height:2em}#wrapper{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center}.posts-wrapper{width:600px;color:var(--text);background:var(--background-alt);margin-bottom:1em;padding:1em;border-radius:1em}.icon-container>img,.user-icon{width:64px;height:64px;border-radius:.5em;background:var(--text-secondary)}.user-icon.verified{border:solid 4px var(--btn);width:60px;height:60px}.verified-badge{background:var(--btn);padding:1px 5px;border-radius:1em;color:var(--text);margin-left:.25em}.painting,.screenshot{border-radius:1em;width:100%}.painting{image-rendering:pixelated}.screenshot{margin-bottom:1em}.post-content{display:flex;flex-direction:column;cursor:pointer}.post-content>h4{margin-top:0;margin-bottom:.5em;font-weight:400;margin-left:.25em;word-wrap:break-word;white-space:pre-wrap}.post-content,.spoiler-overlay{margin-left:74px}.spoiler-overlay>button{width:100%;padding:12px 48px}.post-buttons-wrapper{margin-top:1em;display:flex;justify-content:space-between;user-select:none;margin-left:74px}.post-buttons-wrapper>span{display:flex;flex-direction:row;align-items:center;padding:.5em}.post-buttons-wrapper>span:nth-of-type(2):hover{background:rgba(0,255,0,.25)}.post-buttons-wrapper>span:last-child:hover{background:rgba(0,150,255,.25)}.post-buttons-wrapper>span:hover{cursor:pointer;background:rgba(255,0,0,.25);border-radius:.75em}.post-buttons-wrapper>span>h4{padding-left:.5em;margin:0}.post-buttons-wrapper>span.selected>svg{fill:red;stroke:red}#load-more{width:632px;margin-bottom:1em}#toast,iframe{border-radius:1em}#toast{opacity:0;min-width:250px;margin-left:-141px;background-color:var(--btn);color:var(--text);text-align:center;position:fixed;z-index:10;left:50%;bottom:5em;padding:1ch;transition:all .5s ease}#toast.show{opacity:1}.community-list-wrapper{display:grid;grid-template-areas:"icon main""icon footer";gap:0;cursor:pointer;background:var(--background-alt);padding:1em;width:90%;border-radius:1em;grid-template-columns:111px 152px}.community-list-icon{width:100px;height:100px;grid-area:icon;margin-right:1em;border-radius:1em;-webkit-border-radius:1em;-moz-border-radius:1em;-ms-border-radius:1em;-o-border-radius:1em}.community-list-title{margin:.5em 0-1em;font-size:2ch}.community-list-followers{margin:.5em 0 0;font-size:1.5ch}.communities-wrapper{display:grid;max-width:900px;grid-template-columns:auto auto auto;grid-row-gap:1em;grid-column-gap:1em}#new{margin-bottom:1em}iframe{width:100%;height:20em;margin-top:1em}.notifications-list-content{background:var(--background-alt);width:600px;min-height:4em;margin:0;display:flex;justify-content:flex-start;align-items:center;border-bottom:2px solid var(--btn-secondary);user-select:none;cursor:pointer;font-size:small}.notifications-list-content:hover{text-decoration:none;background:var(--btn-secondary)}.notifications-list-content:first-of-type{border-top-left-radius:1em;border-top-right-radius:1em}.notifications-list-content:last-of-type{border-bottom-left-radius:1em;border-bottom-right-radius:1em}.unread-badge{padding:.25em;border-radius:1em;margin:1em;background-color:var(--btn)}.community-top{background:var(--background-alt);margin-bottom:1em;padding:1em;border-radius:1em;width:600px;overflow:hidden}.community-info{display:flex}.info-boxes-wrapper{display:flex;justify-content:space-evenly;flex-wrap:wrap}.info-boxes-wrapper>div{background:var(--background-alt-alt);border-radius:1em;display:flex;flex-direction:column;align-items:center;margin:.5em;flex-grow:1}.info-boxes-wrapper>div>h4:first-child{margin:.75em 0 0;color:var(--theme-light);font-size:small;font-weight:bolder}.info-boxes-wrapper>div>h4:last-child{margin:.75em 0;color:var(--text-secondary);font-size:small}.community-title{padding-left:.5em;font-size:larger;padding-top:.5em}.banner{width:110%;margin:-1em}.community-page-follow-button-wrapper{padding:.25em;border:2px solid var(--btn);border-radius:1em;margin:1.5em 0 auto auto;cursor:pointer;height:fit-content}.community-page-follow-button-wrapper.selected,.favorite-button.checked{background:var(--btn)}.community-page-follow-button-wrapper>p,.favorite-button{margin:.25em;color:var(--text)!important}.favorite-button{border:2px solid var(--btn);border-radius:1em;margin:1.5em 0 auto auto;cursor:pointer;height:fit-content;text-decoration:none!important;padding:1ch}.list-content-with-icon-and-text{list-style:none;padding:unset}.list-content-with-icon-and-text li{display:flex;padding:.25em 0;border-bottom:1px solid var(--text-secondary)}.list-content-with-icon-and-text .body{margin-left:1em;width:100%;align-items:center;display:inherit;text-decoration:none}#news-list-content li .text .nick-name{font-weight:700}#news-list-content li .text .link{color:var(--theme-light)}#news-list-content li .text .timestamp{color:#969696;white-space:nowrap}.hover{width:600px;display:inherit;border-radius:1em;padding:1em}.hover:hover{background:var(--background-alt)}.body.messages{flex-direction:column;justify-content:center;align-items:flex-start!important}.body.messages>.text{padding-bottom:.5ch}.report h4,.report p{margin:0 5px 0 0}.list-content-with-icon-and-text li.reports{flex-direction:column}.reports .hover:hover{background:unset}.reports button{margin-bottom:1em}button.report{margin-bottom:1.5em;max-width:630px;width:90vw}#report-post-page{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1em}#report-form{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1em;max-width:600px;background:var(--background-alt);border-radius:1em;margin-top:4em}.add-post-page-content.report>div{display:flex;justify-items:center;align-items:center;justify-content:center;margin-top:13px}.report .textarea-text{width:100%;height:100px;border-radius:1em;border:none;background:var(--text);padding:10px;margin:1em 0;resize:none}#report-post-page input[type=submit]{background:var(--btn)}#report-post-page input[type=button]{background:var(--btn-secondary)}.buttons.tabs{display:flex;justify-content:center}.buttons.tabs>a,.buttons.tabs>button{width:100%;margin:0 1ch;border:1px solid var(--text-secondary);cursor:pointer;border-radius:1em;font-weight:700;padding:1em;text-decoration:none;text-align:center}.buttons.tabs>a.selected,.buttons.tabs>button.selected{background:var(--btn);border-color:transparent}.col{margin:2ch;font-size:larger}.mt-5.text-center{display:flex;justify-content:center}@media screen and (max-width:1200px){.communities-wrapper{max-width:600px;grid-template-columns:auto auto;grid-row-gap:10px;grid-column-gap:10px}header{align-items:center}header p{display:none}header a{padding:.25em .5em .25em .5em}}@media screen and (max-width:1000px){#main{width:100%;margin-bottom:60px}#news-list-content,.posts-wrapper{max-width:600px;width:90vw}.post-content,.spoiler-overlay{margin-top:.25em;margin-left:2.5em}.user-icon,.user-icon.verified{width:2em;height:2em}.user-icon.verified{border:solid 2px var(--btn)}.post-buttons-wrapper{margin-top:.5em;margin-bottom:-.5em;margin-left:2.5em}header{width:100%;margin:0;background:var(--background);flex-direction:row;justify-content:space-evenly;bottom:0;border-top:1px solid var(--text-secondary)}header>a:first-child{display:none}header>a:nth-of-type(2){position:fixed;top:2px;left:4px;border-radius:100%;width:3em;height:3em;padding:0;justify-content:center;z-index:20}header>a>p{display:none}header a{padding:.25em 1em}header svg{scale:.75}header>.selected{background:var(--background-alt);border-radius:1em;font-weight:700;color:var(--theme-light);margin:unset}header>.selected>svg{stroke:var(--theme-light)}#load-more{margin-bottom:1em;max-width:600px;width:90vw}#title{color:var(--text);width:100vw;display:flex;justify-content:center;border-bottom:1px solid var(--text-secondary);padding-top:.5em;padding-bottom:.5em;position:fixed;background:var(--background);margin-top:0}#wrapper{margin-top:4em}#wrapper.bottom{margin-top:0;margin-bottom:1em}.communities-wrapper{max-width:600px;grid-template-columns:auto;grid-row-gap:10px;grid-column-gap:10px}.notifications-list-content{width:90vw;min-height:4em}community-info>.user-icon.verified{width:60px;height:60px}.community-info>.user-icon,community-info>.user-icon{width:64px;height:64px}.community-top{max-width:600px;width:90vw}.info-boxes-wrapper>div{width:100%}.community-info>.user-icon.verified{border:solid 4px var(--btn);width:60px;height:60px}list-content-with-icon-and-text li.reports>*{width:100%;overflow:clip}li.reports .posts-wrapper{margin-left:-1em}li.reports .hover{width:auto;padding:.5em .25em}}
\ No newline at end of file
+:root{--background:#1B1F3B;--background-alt:#2a2f50;--text:white;--text-secondary:#A1A8D9;--btn:#673DB6;--btn-secondary:#333960;--theme:var(--btn);--theme-light:#A185D6;--text-secondary-2:#8990C1;--border:rgba(255, 255, 255, 0.1);--background-alt-alt:#383f6b}button,input[type=button],input[type=submit]{cursor:pointer;background:var(--background-alt-alt);color:var(--text);border:0;border-radius:1em;font-weight:700;padding:1em}a{color:unset}a:hover{cursor:pointer;text-decoration:underline}#title{color:var(--text);display:flex;justify-content:center}#nav-bar{display:flex;background:-webkit-gradient(linear,left top,right top,from(#fff),to(#fff5f5));list-style:none;user-select:none}.badge,body,button{color:var(--text)}.badge{position:absolute;background:var(--btn);padding:3px 8px;border-radius:1em;margin-left:1.25em;display:none;margin-bottom:30px}body{background-color:var(--background);margin:0;font-family:Conv_Poppins-Light,sans-serif}header{display:flex;align-items:flex-start;margin-top:35px;flex-direction:column;position:fixed}a,header a,header>a,header>a:hover{text-decoration:none}header .logo-link,header .logo-link svg{display:block;width:5em}header a{color:var(--text-secondary);padding:.25em 1.5em .25em 1em;border-radius:2em;display:flex;margin:.1em;align-items:center}header a:first-child{padding:.5em 1em}header a:hover,header>.selected{background:var(--background-alt)}header>a>p{padding-left:1em}header>.selected{border-radius:1em;font-weight:700;color:var(--theme-light)}header>.selected>svg{stroke:var(--theme-light)}.mii-icon{width:40px;height:40px;background:#a1a8d9;border-radius:50px}#main{width:95%;max-width:1400px;margin:0 auto;overflow:hidden}.post-meta-wrapper{display:flex;color:var(--text);align-items:center;margin-left:.5em;height:2em;margin-bottom:0;font-size:small}.post-meta-wrapper>h3>a{text-decoration:none;color:var(--text)}.post-meta-wrapper>h3>a:hover{text-decoration:underline}.post-meta-wrapper>h4:last-child{padding-left:.5em;color:var(--text-secondary)}.post-user-info-wrapper{display:flex;height:2em}#wrapper{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center}.posts-wrapper{width:600px;color:var(--text);background:var(--background-alt);margin-bottom:1em;padding:1em;border-radius:1em}.icon-container>img,.user-icon{width:64px;height:64px;border-radius:.5em;background:var(--text-secondary)}.user-icon.verified{border:solid 4px var(--btn);width:60px;height:60px}.verified-badge{background:var(--btn);padding:1px 5px;border-radius:1em;color:var(--text);margin-left:.25em}.painting,.screenshot{border-radius:1em;width:100%}.painting{image-rendering:pixelated}.screenshot{margin-bottom:1em}.post-content{display:flex;flex-direction:column;cursor:pointer}.post-content>h4{margin-top:0;margin-bottom:.5em;font-weight:400;margin-left:.25em;word-wrap:break-word;white-space:pre-wrap}.post-content,.spoiler-overlay{margin-left:74px}.spoiler-overlay>button{width:100%;padding:12px 48px}.post-buttons-wrapper{margin-top:1em;display:flex;justify-content:space-between;user-select:none;margin-left:74px}.post-buttons-wrapper>span{display:flex;flex-direction:row;align-items:center;padding:.5em}.post-buttons-wrapper>span:nth-of-type(2):hover{background:rgba(0,255,0,.25)}.post-buttons-wrapper>span:last-child:hover{background:rgba(0,150,255,.25)}.post-buttons-wrapper>span:hover{cursor:pointer;background:rgba(255,0,0,.25);border-radius:.75em}.post-buttons-wrapper>span>h4{padding-left:.5em;margin:0}.post-buttons-wrapper>span.selected>svg{fill:red;stroke:red}#load-more{width:632px;margin-bottom:1em}#toast,iframe{border-radius:1em}#toast{opacity:0;min-width:250px;margin-left:-141px;background-color:var(--btn);color:var(--text);text-align:center;position:fixed;z-index:10;left:50%;bottom:5em;padding:1ch;transition:all .5s ease}#toast.show{opacity:1}.community-list-wrapper{display:grid;grid-template-areas:"icon main" "icon footer";gap:0;cursor:pointer;background:var(--background-alt);padding:1em;width:90%;border-radius:1em;grid-template-columns:111px 152px}.community-list-icon{width:100px;height:100px;grid-area:icon;margin-right:1em;border-radius:1em;-webkit-border-radius:1em;-moz-border-radius:1em;-ms-border-radius:1em;-o-border-radius:1em}.community-list-title{margin:.5em 0-1em;font-size:2ch}.community-list-followers{margin:.5em 0 0;font-size:1.5ch}.communities-wrapper{display:grid;max-width:900px;grid-template-columns:auto auto auto;grid-row-gap:1em;grid-column-gap:1em}#new{margin-bottom:1em}iframe{width:100%;height:20em;margin-top:1em}.notifications-list-content{background:var(--background-alt);width:600px;min-height:4em;margin:0;display:flex;justify-content:flex-start;align-items:center;border-bottom:2px solid var(--btn-secondary);user-select:none;cursor:pointer;font-size:small}.notifications-list-content:hover{text-decoration:none;background:var(--btn-secondary)}.notifications-list-content:first-of-type{border-top-left-radius:1em;border-top-right-radius:1em}.notifications-list-content:last-of-type{border-bottom-left-radius:1em;border-bottom-right-radius:1em}.unread-badge{padding:.25em;border-radius:1em;margin:1em;background-color:var(--btn)}.community-top{background:var(--background-alt);margin-bottom:1em;padding:1em;border-radius:1em;width:600px;overflow:hidden}.community-info{display:flex}.info-boxes-wrapper{display:flex;justify-content:space-evenly;flex-wrap:wrap}.info-boxes-wrapper>div{background:var(--background-alt-alt);border-radius:1em;display:flex;flex-direction:column;align-items:center;margin:.5em;flex-grow:1}.info-boxes-wrapper>div>h4:first-child{margin:.75em 0 0;color:var(--theme-light);font-size:small;font-weight:bolder}.info-boxes-wrapper>div>h4:last-child{margin:.75em 0;color:var(--text-secondary);font-size:small}.community-title{padding-left:.5em;font-size:larger;padding-top:.5em}.banner{width:110%;margin:-1em}.community-page-follow-button-wrapper{padding:.25em;border:2px solid var(--btn);border-radius:1em;margin:1.5em 0 auto auto;cursor:pointer;height:fit-content}.community-page-follow-button-wrapper.selected,.favorite-button.checked{background:var(--btn)}.community-page-follow-button-wrapper>p,.favorite-button{margin:.25em;color:var(--text)!important}.favorite-button{border:2px solid var(--btn);border-radius:1em;margin:1.5em 0 auto auto;cursor:pointer;height:fit-content;text-decoration:none!important;padding:1ch}.list-content-with-icon-and-text{list-style:none;padding:unset}.list-content-with-icon-and-text li{display:flex;padding:.25em 0;border-bottom:1px solid var(--text-secondary)}.list-content-with-icon-and-text .body{margin-left:1em;width:100%;align-items:center;display:inherit;text-decoration:none}#news-list-content li .text .nick-name{font-weight:700}#news-list-content li .text .link{color:var(--theme-light)}#news-list-content li .text .timestamp{color:#969696;white-space:nowrap}.hover{width:600px;display:inherit;border-radius:1em;padding:1em}.hover:hover{background:var(--background-alt)}.body.messages{flex-direction:column;justify-content:center;align-items:flex-start!important}.body.messages>.text{padding-bottom:.5ch}.report h4,.report p{margin:0 5px 0 0}.list-content-with-icon-and-text li.reports{flex-direction:column}.reports .hover:hover{background:unset}.reports button{margin-bottom:1em}button.report{margin-bottom:1.5em;max-width:630px;width:90vw}#report-post-page{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1em}#report-form{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1em;max-width:600px;background:var(--background-alt);border-radius:1em;margin-top:4em}.add-post-page-content.report>div{display:flex;justify-items:center;align-items:center;justify-content:center;margin-top:13px}.report .textarea-text{width:100%;height:100px;border-radius:1em;border:none;background:var(--text);padding:10px;margin:1em 0;resize:none}#report-post-page input[type=submit]{background:var(--btn)}#report-post-page input[type=button]{background:var(--btn-secondary)}.buttons.tabs{display:flex;justify-content:center}.buttons.tabs>a,.buttons.tabs>button{width:100%;margin:0 1ch;border:1px solid var(--text-secondary);cursor:pointer;border-radius:1em;font-weight:700;padding:1em;text-decoration:none;text-align:center}.buttons.tabs>a.selected,.buttons.tabs>button.selected{background:var(--btn);border-color:transparent}.col{margin:2ch;font-size:larger}.mt-5.text-center{display:flex;justify-content:center}.message-post-list .post{position:relative;padding:10px 0;margin-bottom:20px;margin-top:30px}.message-post-list .post.my-post .mii-icon-container{float:right;margin:0 0 0 10px}.message-post-list .post .mii-icon-container{position:relative;float:left;width:50px;height:50px;margin-right:20px;border-radius:12px;box-shadow:0 3px 10px rgba(0,0,0,.6)}.message-post-list .post .mii-icon{width:50px;height:50px;background:#fff;border-radius:12px}.message-post-list .post.my-post footer{right:0}.message-post-list .post footer{display:block;height:16px;color:var(--text-secondary-2);font-size:16px;position:absolute;bottom:-14px}.message-post-list .post.my-post .post-body{float:right;background:var(--theme);color:#fff}.message-post-list .post .post-body{float:left;position:relative;background:#fff;border-radius:20px;box-shadow:0 3px 10px rgba(0,0,0,.4);padding:15px 20px;color:#000}.message-post-list .post .post-content{word-wrap:break-word;white-space:pre-wrap;margin-bottom:0;margin-left:0;margin-top:0}.message-post-list .post::after,.settings-list-content .settings-list>li:after{content:"";display:block;clear:both}.message-viewer-bubble-sent-memo{width:340px;height:127px}.message-viewer-bubble-sent-screenshot{max-width:500px;max-height:281px;width:100%}.message-post-list .post .post-buttons{margin:10px -20px -15px;border-top:2px solid #938a8a;border-radius:0 0 20px 20px;text-align:right}.message-post-list .post .post-buttons a,.message-post-list .post .post-buttons button{display:inline-block;padding:0 15px;margin:0;border-width:0;border-left:none currentcolor;line-height:50px;font-size:20px;color:#938a8a;box-shadow:inset 2px 0 0#ddd}@media screen and (max-width:1200px){.communities-wrapper{max-width:600px;grid-template-columns:auto auto;grid-row-gap:10px;grid-column-gap:10px}header{align-items:center}header p{display:none}header a{padding:.25em .5em .25em .5em}}@media screen and (max-width:1000px){#main{width:100%;margin-bottom:60px}#news-list-content,.posts-wrapper{max-width:600px;width:90vw}.post-content,.spoiler-overlay{margin-top:.25em;margin-left:2.5em}.user-icon,.user-icon.verified{width:2em;height:2em}.user-icon.verified{border:solid 2px var(--btn)}.post-buttons-wrapper{margin-top:.5em;margin-bottom:-.5em;margin-left:2.5em}header{width:100%;margin:0;background:var(--background);flex-direction:row;justify-content:space-evenly;bottom:0;border-top:1px solid var(--text-secondary);z-index:100}header>a:first-child{display:none}header>a:nth-of-type(2){position:fixed;top:2px;left:4px;border-radius:100%;width:3em;height:3em;padding:0;justify-content:center;z-index:20}header>a>p{display:none}header a{padding:.25em 1em}header svg{scale:.75}header>.selected{background:var(--background-alt);border-radius:1em;font-weight:700;color:var(--theme-light);margin:unset}header>.selected>svg{stroke:var(--theme-light)}#load-more{margin-bottom:1em;max-width:600px;width:90vw}#title{color:var(--text);width:100vw;display:flex;justify-content:center;border-bottom:1px solid var(--text-secondary);padding-top:.5em;padding-bottom:.5em;position:fixed;background:var(--background);margin-top:0;z-index:100}#wrapper{margin-top:4em}#wrapper.bottom{margin-top:0;margin-bottom:1em}.communities-wrapper{max-width:600px;grid-template-columns:auto;grid-row-gap:10px;grid-column-gap:10px}.notifications-list-content{width:90vw;min-height:4em}community-info>.user-icon.verified{width:60px;height:60px}.community-info>.user-icon,community-info>.user-icon{width:64px;height:64px}.community-top{max-width:600px;width:90vw}.info-boxes-wrapper>div{width:100%}.community-info>.user-icon.verified{border:solid 4px var(--btn);width:60px;height:60px}list-content-with-icon-and-text li.reports>*{width:100%;overflow:clip}li.reports .posts-wrapper{margin-left:-1em}li.reports .hover{width:auto;padding:.5em .25em}#message-page{width:95%}.scroll-focus.mii-icon-container{display:none}}
\ No newline at end of file
diff --git a/src/webfiles/web/message_thread.ejs b/src/webfiles/web/message_thread.ejs
index 5809612..7562562 100644
--- a/src/webfiles/web/message_thread.ejs
+++ b/src/webfiles/web/message_thread.ejs
@@ -7,9 +7,31 @@
     <h2 id="title" class="page-header"><%= userMap.get(user2.pid) %></h2>
     <%- include('partials/nav_bar', { selection: 3, pid: pid }); %>
     <div id="toast"></div>
-    <div id="wrapper" style="height: 80%;padding: 2em;text-align:center">
-        <h2>Messages are not quite ready yet. Check back soon!</h2>
+    <div id="wrapper">
+		<div class="body-content message-post-list" id="message-page">
+        <% messages.forEach(function(message) { %>
+            <div id="message-<%= message.post_id%>" class="post scroll <%if(message.pid === pid) {%>my-post<%} else {%>other-post<%}%>">
+                <a href="/users/show?pid=<%= message.pid %>" data-pjax="#body" class="scroll-focus mii-icon-container">
+                    <img src="https://pretendo-cdn.b-cdn.net<%= message.mii_face_url.substring(message.mii_face_url.lastIndexOf('/mii')) %>" class="mii-icon">
+                </a>
+                <div class="post-body">
+                    <%if(message.screenshot) {%>
+                        <img class="message-viewer-bubble-sent-screenshot" src="https://pretendo-cdn.b-cdn.net<%= message.screenshot %>">
+                    <%}%>
+                    <%if(message.painting) {%>
+                        <img class="message-viewer-bubble-sent-memo" src="https://pretendo-cdn.b-cdn.net/paintings/<%=message.pid%>/<%=message.id%>.png">
+                    <%}else {%>
+                        <p class="post-content"><%= message.body %></p>
+                    <%}%>
+                </div>
+				<footer>
+                    <span class="timestamp"><%= moment(message.created_at).fromNow()%></span>
+                </footer>
+            </div>
+        <%});%>
+		</div>
     </div>
+	<img src="" onerror="setTimeout(function() { window.scrollTo(0, 50000); }, 500)">
 </div>
 </body>
 </html>