diff --git a/ui.css b/ui.css
index e7008e7..312a2f7 100755
--- a/ui.css
+++ b/ui.css
@@ -9,7 +9,7 @@
 */
 
 :root {
-    --menu-opacity: 0.8;
+    --menu-opacity: 0.9;
     /* Malth is a nerd btw */
     --menu-bg-colour: 55, 48, 33;
 }
@@ -30,12 +30,18 @@ body {
     color: #ffffff;
 
     text-shadow: 2px 2px 8px #000;
+
+    font-family: "Noto Sans", "Noto Sans Symbols", "Noto Sans JP", "Noto Sans TC", "Noto Sans KR", "Noto Sans Arabic", "Noto Sans SC", sans-serif;
 }
 
 h1 {
     font-weight: normal;
 }
 
+.input {
+    font-family: "Noto Sans", "Noto Sans Symbols", "Noto Sans JP", "Noto Sans TC", "Noto Sans KR", "Noto Sans Arabic", "Noto Sans SC", sans-serif;
+}
+
 .settings-subcategory {
     display: flex;
     flex-direction: column;
@@ -99,8 +105,12 @@ h1 {
     background-color: #1b5037;
 }
 
+.button.noaction {
+    pointer-events: none;
+}
+
 .button:disabled, .button.disabled {
-    background: #3c3c3c !important;
+    filter: brightness(50%) grayscale(1);
     pointer-events: none;
 }
 
@@ -134,6 +144,12 @@ h1 {
     left: 0;
 }
 
+.root-container {
+    position: absolute;
+    width: 100%;
+    height: 80%;
+}
+
 .content {
     position: absolute;
     width: 100%;
@@ -150,6 +166,11 @@ h1 {
 
     left: -100%;
     transition: left 0.2s linear;
+    z-index: 200;
+}
+
+.root-content {
+    height: 100%;
 }
 
 .home-container {
@@ -211,7 +232,10 @@ h1 {
 
 .list-filter {
     width: 25%;
-    padding: 1%;
+    padding: 0.5em;
+    display: flex;
+    justify-content: flex-start;
+    flex-direction: column;
 }
 
 .list-filter .option-caption {
@@ -220,29 +244,60 @@ h1 {
     margin-bottom: 10px;
 }
 
-.list-filter .content-btn {
-    left: 5%;
-}
-
 .list-filter h1 {
     text-align: center;
     color: #ffffff;
     margin-top: 0;
+    margin-bottom: 0.5em;
 }
 
 .list-content {
     width: 75%;
     border-left: 3px solid #59885d;
 
-    padding: 1%;
+    padding: 0.5em;
 
     overflow: scroll;
 
     position: relative;
 }
 
+.root-content .invite-banner{
+    position: absolute;
+    width: 75%;
+    height: 10%;
+    top: 0;
+    right: 0;
+    z-index: 10;
+    background-color: rgba(255, 69, 0, 0.5);
+}
+
+.invite-banner.hidden {
+    display: none !important;
+}
+
+.invite-banner span {
+    display: block;
+    height: auto;
+    font-size: 1.5em;
+}
+
+.invite-banner .content-btn {
+    position: relative;
+    width: 20%;
+    font-size: 1.2em;
+}
+
+.invite-banner.flex-row-container {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    align-items: center;
+}
+
 .content-row {
     display: flex;
+    width: 100%;
 }
 
 .content-cell {
@@ -267,14 +322,13 @@ h1 {
 }
 
 .list-filter .scroll-content {
-    position: absolute;
     width: 100%;
-    left: 5%;
-    top: 6.5em;
-    bottom: 6em;
+    flex: 100;
 }
-#props .list-filter .scroll-content {
-    bottom: 10.5em;
+
+.list-filter .content-btn {
+    position: relative;
+    margin-top: 0.5em;
 }
 
 .filter-option {
@@ -344,15 +398,14 @@ h1 {
 .content-name {
     position: absolute;
     width: 100%;
-    height: 1.1em;
-    bottom: 5.5em;
+    height: auto;
+    bottom: 5.4em;
 
     text-align: center;
 
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    coh-font-fit-mode: shrink;
 }
 
 .content-btn {
@@ -389,7 +442,7 @@ h1 {
     bottom: 5em;
 }
 .content-cell.world .content-name {
-    bottom: 3.2em;
+    bottom: 3em;
 }
 
 .content-cell.prop .content-cell-formatter {
@@ -397,7 +450,7 @@ h1 {
 }
 
 .content-cell.prop .content-name {
-    bottom: 8em;
+    bottom: 7.7em;
 }
 
 .content-cell.prop .content-image {
@@ -762,7 +815,6 @@ h1 {
     height: 4em;
     border-radius: 0.25em;
     border: 3px solid #59885d;
-    padding: 0 0.2em 0 0;
 }
 
 .action-btn img {
@@ -770,6 +822,19 @@ h1 {
     height: 2.6em;
 }
 
+.action-btn .img-inverted {
+    filter: invert(1);
+}
+
+.action-btn.sm-exit {
+    height: auto;
+    width: auto;
+    border: 0 none;
+    position: absolute;
+    top: 1%;
+    right: 1%;
+}
+
 /*World Detail*/
 #world-detail {
     background-color: #373021;
@@ -782,6 +847,18 @@ h1 {
     margin-right: 4em;
 }
 
+/* let's customize the dropdown a bit in world instance creation */
+#world-detail .valueList {
+    max-height: 500px;
+}
+
+#world-detail .listValue {
+    text-overflow: ellipsis;
+    height: auto;
+    white-space: nowrap;
+    overflow: hidden;
+}
+
 .close-btn {
     position: absolute;
     top: 1%;
@@ -885,6 +962,14 @@ h1 {
     width: auto;
 }
 
+.list-filter .scroll-content {
+    position: relative;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
+
 .row-wrapper {
     display: flex;
 }
@@ -926,6 +1011,8 @@ h1 {
 .world-image {
     width: 14em;
     height: 14em;
+    align-self: center;
+    border-radius: 0.25em;
 }
 
 .content-world-actions .action-btn {
@@ -1095,19 +1182,20 @@ h1 {
     top: 6%;
     bottom: 9%;
     left: -100%;
-    width: 30%;
+    width: 50%;
     height: 81%;
 
+    display: flex;
+    flex-direction: column;
+
     border-radius: 0.25em;
     border: 3px solid #59885d;
 
     padding: 0.5em;
 }
-.world-instancing.group {
-    height: 89%;
-}
+
 .world-instancing.in {
-    left: 35%;
+    left: 25%;
     transition: left 0.2s linear;
 }
 .world-instancing.out {
@@ -1118,11 +1206,35 @@ h1 {
     visibility: hidden;
 }
 
+.world-instancing .flex-row-container {
+    display: flex;
+    flex-direction: row;
+}
+
+.world-instancing .flex-col-container {
+    display: flex;
+    flex-direction: column;
+    width: 50%;
+    align-items: center;
+}
+
+.world-instancing .flex-col-container.bottom {
+    align-self: center;
+    width: 60%;
+    margin-top: 2em;
+}
+
 .world-instancing h2, .world-instancing h3 {
     margin-top: 0;
     text-align: center;
 }
 
+.world-instancing .flex-col-container .content-btn {
+    position: relative;
+    margin-bottom: 0.5em;
+    min-width: 15em;
+}
+
 .world-instancing .content-btn {
     position: relative;
     margin-bottom: 0.5em;
@@ -1134,12 +1246,23 @@ h1 {
     margin-bottom: 1em;
 }
 #instance_group {
-    width: 100%;
     display: none;
     z-index: 10;
+    border-radius: 0.25em;
+}
+#instance_group_title {
+    width: 100%;
+    display: none;
+    margin-top: 0.2em;
+    margin-bottom: 0.5em;
+    text-align: center;
 }
 .group #instance_group {
     display: block;
+    margin-bottom: 0;
+}
+.group #instance_group_title {
+    display: block;
 }
 
 .btn-region .region-select {
@@ -1179,6 +1302,7 @@ h1 {
     border: 3px solid #59885d;
 
     padding: 0.5em;
+    z-index: 500;
 }
 .favorite-category-selection.in {
     left: 35%;
@@ -1190,6 +1314,7 @@ h1 {
 }
 .favorite-category-selection.hidden {
     visibility: hidden;
+    display: block !important;
 }
 .favorite-category-selection .scroll-content {
     top: 4em;
@@ -1202,8 +1327,11 @@ h1 {
 }
 .favorite-category-selection .close-btn {
     height: 2.5em;
-    top: 1em;
+    bottom: 1em;
     right: 1em;
+    top: auto;
+    position: absolute;
+    text-align: center;
 }
 .favorite-category-selection .apply-btn {
     height: 2.5em;
@@ -1220,6 +1348,31 @@ h1 {
     top: 0.4em;
 }
 
+.favorite-category-selection h3 {
+    text-align: center;
+    margin-bottom: 0.3em;
+    margin-top: 0.3em;
+}
+
+.favorite-category-selection .big-button {
+    width: 80%;
+    height: auto;
+    font-size: 1.5em;
+    margin-top: 20px;
+    text-align: center;
+    padding: 10px;
+}
+.favorite-category-selection .big-button:hover {
+    filter: brightness(0.75);
+}
+.favorite-category-selection .big-button.danger{
+    background-color: #b00000;
+}
+.favorite-category-selection .big-button.warning{
+    background-color: #c4c400;
+    color: black;
+}
+
 /*Instance Detail*/
 #instance-detail {
     background-color: #373021;
@@ -1237,6 +1390,84 @@ h1 {
     background-color: #373021;
 }
 
+#create-group-modal p {
+    text-align: center;
+    align-self: center;
+}
+
+#group-detail .flex-col-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+#group-detail .hidden {
+    display: none;
+}
+
+#group-detail .content-instance-information {
+    overflow-x: hidden;
+}
+
+.editable {
+    position: relative;
+    border-radius: 0.25em;
+    min-height: 5em;
+    pointer-events: none;
+}
+
+.editable-enable {
+    background-color: rbga(var(--menu-bg-colour), var(--menu-opacity));
+    pointer-events: auto;
+}
+
+.edit-icon {
+    position: absolute;
+    height: 3em;
+    width: 3em;
+    right: 0;
+    background-image: url("gfx/Group/icons8-edit.svg");
+    /*filter: drop-shadow(0 0 1rem #1b5037); apparently drop shadow on these causes them to flicker, why? idk. Blame cohtml I guesss..... */
+    display: none;
+    z-index: 100;
+}
+
+.editable-enable:hover {
+    filter: brightness(0.75);
+    backdrop-filter: brightness(0.75);
+}
+
+.upload-overlay{
+    z-index: 10000;
+    position: absolute;
+    background-color: rgba(var(--menu-bg-colour), 0.8);
+    justify-content: center;
+    align-items: center;
+    display: none;
+    width: 100%;
+    height: 100%;
+    bottom: 0;
+    left: 0;
+    flex-direction: column;
+}
+
+.upload-overlay p {
+    font-size: 2.5em;
+}
+
+.upload-overlay .upload-button {
+    height: 2.5em;
+    font-size: 2.5em;
+    width: 8em;
+    text-align: center;
+    border: grey solid 2px;
+    border-radius: 0.25em;
+    align-self: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
 #group-detail h1 {
     text-align: left;
     margin-top: 0.3em;
@@ -1244,6 +1475,24 @@ h1 {
     margin-right: 4em;
 }
 
+.group-description {
+    white-space: pre-wrap;
+}
+
+.pagination-button {
+    height: 1.5em;
+    font-size: 1.5em;
+    width: 6em;
+    text-align: center;
+    border: grey solid 2px;
+    border-radius: 0.25em;
+    align-self: center;
+}
+
+.pagination-button:hover{
+    filter: brightness(80%);
+}
+
 .content-instance-owner {
     position: absolute;
     top: 10%;
@@ -1284,6 +1533,60 @@ h1 {
 .content-instance-owner p {
     margin: 0;
     margin-top: 0.5em;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    height: auto;
+    display: block;
+    width: 100%;
+}
+
+.content-instance-group {
+    position: absolute;
+    top: 10%;
+    width: 20%;
+    padding: 0.5em;
+    height: 65%;
+    left: 1%;
+
+    border-radius: 0.25em;
+    border: 3px solid #59885d;
+}
+
+.content-instance-group .profile-image {
+    width: 13.5em;
+    height: 13.5em;
+    margin-left: 0.5em;
+    mask-image: url("gfx/HexagonMask.svg");
+    mask-size: contain;
+    mask-position: center;
+    align-self: center;
+}
+
+.content-instance-group h2 {
+    font-weight: normal;
+    margin-bottom: 0;
+    text-align: center;
+    margin-top: 0.2em;
+    coh-font-fit-mode: shrink;
+}
+
+.content-instance-group h3 {
+    font-weight: normal;
+    margin-top: 0;
+    text-align: center;
+    margin-bottom: 0.8em;
+}
+
+.content-instance-group p {
+    margin: 0;
+    margin-top: 0.5em;
+}
+
+.content-instance-group .world-image {
+    width: 14.5em;
+    height: 14.5em;
+    pointer-events: auto;
 }
 
 .content-instance-world {
@@ -1330,6 +1633,11 @@ h1 {
     display: none;
 }
 
+.content-instance-information p {
+    margin-bottom: 0;
+    margin-top: 0;
+}
+
 .content-instance-buttons {
     position: absolute;
     top: 77%;
@@ -1349,6 +1657,51 @@ h1 {
     text-align: center;
 }
 .content-instance-buttons .instance-btn img {
+    width: 60%;
+    height: 65%;
+    margin-top: 3%;
+    margin-left: 15%;
+    margin-right: 15%;
+    margin-bottom: 3%;
+}
+.content-instance-buttons .instance-btn.disabled {
+    filter: brightness(50%) grayscale(1);
+    pointer-events: none;
+}
+.content-instance-buttons .instance-btn.noaction {
+    pointer-events: none;
+}
+.content-instance-buttons .instance-btn + .instance-btn {
+    border-left: 3px solid #59885d;
+    border-right: 3px solid #59885d;
+}
+
+.content-group-buttons {
+    position: absolute;
+    top: 77%;
+    width: 67%;
+    padding: 0;
+    height: 20.5%;
+    left: 1%;
+
+    border-radius: 0.25em;
+    border: 3px solid #59885d;
+
+    display: flex;
+}
+.content-group-buttons p{
+    font-size: 1.5em;
+    text-align: center;
+    display: block;
+    align-self: center;
+    flex: 100;
+}
+.content-group-buttons .instance-btn {
+    width: 14%;
+    position: relative;
+    text-align: center;
+}
+.content-group-buttons .instance-btn img {
     width: 70%;
     height: 70%;
     margin-top: 3%;
@@ -1356,11 +1709,20 @@ h1 {
     margin-right: 15%;
     margin-bottom: 3%;
 }
-.content-instance-buttons .instance-btn.disabled {
-    background: rgba(80, 80, 80, 1);
+.content-group-buttons .instance-btn.disabled {
+    filter: brightness(50%) grayscale(1);
+    pointer-events: none;
 }
-.content-instance-buttons .instance-btn + .instance-btn {
+.content-group-buttons .instance-btn.noaction {
+    pointer-events: none;
+}
+.content-group-buttons .instance-btn + .instance-btn {
     border-left: 3px solid #59885d;
+    border-right: 3px solid #59885d;
+}
+
+.content-group-buttons .hidden {
+    display: none;
 }
 
 .content-instance-players {
@@ -1395,8 +1757,88 @@ h1 {
     top: 25em;
 }
 
+.content-group-players {
+    position: absolute;
+    top: 10%;
+    width: 30%;
+    padding: 0.5em;
+    height: 87.5%;
+    left: 69%;
+
+    border-radius: 0.25em;
+    border: 3px solid #59885d;
+}
+.content-group-players .instancePlayer {
+    display: flex;
+}
+.content-group-players .instancePlayer .instancePlayerImage {
+    width: 4em;
+    height: 4em;
+    margin-right: 1em;
+    margin-bottom: 0.5em;
+}
+.content-group-players .instancePlayer .instancePlayerName {
+    flex: 1;
+    font-size: 1.2em;
+    overflow: hidden;
+}
+
+.content-group-players .instancePlayer .manageButton {
+    border-radius: 0.25em;
+    border: 2px solid #59885d;
+    align-self: center;
+    z-index: 5;
+    pointer-events: all;
+}
+
+.content-group-players .instancePlayer .manageButton img {
+    height: 100px;
+    width: 100px;
+}
+
+.content-group-players .instancePlayer .manageButton:hover {
+    filter: brightness(0.75);
+}
+
+.content-group-players .content-list-pagination {
+    display: flex;
+    justify-content: space-around;
+    position: relative;
+    top: 25em;
+}
+
 #group-detail .scroll-content {
     bottom: 4.5em;
+    z-index: 300;
+}
+
+#group-detail .instancePlayer {
+    display: flex;
+    margin-top: 10px;
+}
+#group-detail .instancePlayer .instancePlayerImage {
+    width: 4em;
+    height: 4em;
+    margin-right: 1em;
+    margin-bottom: 0;
+}
+#group-detail .instancePlayer .player-name-container {
+    display: flex;
+    flex-direction: column;
+    flex: 100;
+}
+
+#group-detail .instancePlayer .instancePlayerName {
+    flex: 1;
+    font-size: 1.2em;
+}
+#group-detail .instancePlayer .instancePlayerRank {
+    flex: 1;
+    font-size: 1em;
+}
+
+#group-detail .favorite-category-selection {
+    z-index: 0;
 }
 
 .content-list-pagination .page-arrow {
@@ -1411,7 +1853,7 @@ h1 {
 }
 
 .content-list-pagination .previous-page {
-    transform: rotate(180deg);
+
 }
 
 .content-list-pagination .next-page {
@@ -1420,7 +1862,7 @@ h1 {
 
 .content-list-pagination .disabled {
     pointer-events: none !important;
-    filter: brightness(0.5) !important;
+    filter: brightness(50%) grayscale(1) !important;
 }
 
 .content-list-pagination .page-arrow:hover {
@@ -1454,6 +1896,14 @@ h1 {
     margin-left: 0.5em;
     margin-right: 4em;
 }
+
+#our-user-detail .toolbar-btn {
+    font-size: 1em !important;
+    border-right-width: 3px;
+    border-right-color: rgba(89, 136, 93, 1.000000);
+    border-right-style: solid;
+}
+
 .user-sidebar {
     position: absolute;
     top: 10%;
@@ -1494,6 +1944,7 @@ h1 {
     mask-position: center;
     align-self: center;
     z-index: 2;
+    border-radius: 0.25em;
 }
 
 .profile-bg {
@@ -1533,6 +1984,12 @@ h1 {
 .user-sidebar p {
     margin: 0;
     margin-top: 0.5em;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    height: auto;
+    display: block;
+    width: 100%;
 }
 
 .user-tabview {
@@ -1612,10 +2069,23 @@ h1 {
     display: flex;
 }
 
-.user-toolbar .toolbar-btn {
+.group-toolbar .toolbar-btn {
     width: 11.111111%;
 }
 
+.group-toolbar {
+    position: absolute;
+    top: 82%;
+    width: 77%;
+    height: 16%;
+    left: 22%;
+
+    border-radius: 0.25em;
+    border: 3px solid #59885d;
+
+    display: flex;
+}
+
 .activityDataAvailable,
 .activityDataUnavailable,
 .activityDataPrivate,
@@ -1677,6 +2147,53 @@ h1 {
     }
 }
 
+.note-block {
+    width: 100%;
+    height: 100%;
+    white-space: pre-wrap;
+    font-size: 1.5em;
+    overflow-wrap: break-word;
+}
+
+.note-block-label {
+    margin: 10px;
+    font-size: 1.5em;
+    text-decoration: underline;
+    text-decoration-color: white;
+}
+
+.note-block-scroll {
+    top: 2.5em;
+}
+
+.note-edit-btn {
+    position: absolute;
+    font-size: 2.0em;
+    text-align: center;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    border: 0;
+    opacity: 0;
+}
+
+.note-edit-btn:hover {
+    animation-duration: 0.3s;
+    animation-name: noteEditAppear;
+    animation-fill-mode: forwards;
+    background-color: rgba(var(--menu-bg-colour), 0.2);
+}
+
+@keyframes noteEditAppear {
+    0%{
+        opacity: 0;
+    }
+    100%{
+        opacity: 1;
+    }
+}
+
 .activityDataLoading img {
     width: 3em;
     height: 3em;
@@ -1970,6 +2487,11 @@ h1 {
     margin: 10% 25% 5%;
 }
 
+.user-toolbar .toolbar-btn {
+    font-size: 0.9em;
+    width: 10%;
+}
+
 .time-display {
     margin-top: 0.1em;
     font-size: 72px;
@@ -1979,7 +2501,7 @@ h1 {
 .message-box {
     position: absolute;
     width: 40%;
-    height: 40%;
+    min-height: 20em;
     top: 20%;
     left: -100%;
 
@@ -1992,6 +2514,11 @@ h1 {
     background-color: #373021;
 
     text-align: center;
+    z-index: 500;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+    flex-direction: column;
 }
 
 .message-box.alert-timed-box {
@@ -2008,11 +2535,18 @@ h1 {
 }
 
 .message-box.push-box {
+    z-index: 500;
     left: 20%;
     width: 60%;
     top: 100%;
     height: 10%;
+    min-height: 0;
 }
+
+.message-box.push-box p {
+    flex: 0;
+}
+
 .message-box.push-box.in {
     left: 20%;
     top: 70%;
@@ -2034,11 +2568,14 @@ h1 {
 
 .message-box p {
     font-size: 1.3em;
+    margin-top: 0;
+    margin-bottom: 0;
+    flex: 100;
+    padding-left: 0.5em;
+    padding-right: 0.5em;
 }
 
 .message-box .action-btn {
-    position: absolute;
-
     width: 4em;
     height: 2em;
 
@@ -2047,7 +2584,8 @@ h1 {
     font-size: 1.5em;
     line-height: 1.8em;
 
-    bottom: 0.5em;
+    margin-top: 1em;
+    margin-bottom: 1em;
 }
 .message-box.alert-timed-box .action-btn {
     bottom: 2em;
@@ -2079,10 +2617,16 @@ h1 {
     right: 2.5em;
 }
 
+.message-box .flex-row-container {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+    justify-content: space-around;
+}
+
 /*Settings*/
 .settings-categorie {
     display: none;
-    padding-bottom: 100px;
 }
 .settings-categorie.active {
     display: block;
@@ -2184,8 +2728,11 @@ h1 {
 
 .feed-text-wrapper {
     flex: 1;
-    padding: 0.5em 0;
+    display: flex;
+    flex-direction: column;
     align-self: flex-start;
+    height: 100%;
+    justify-content: space-around;
 }
 
 .feed-name {
@@ -2196,7 +2743,10 @@ h1 {
 .feed-text {
     margin-right: 0.6em;
     padding-left: 0.4em;
-    padding-top: 0.4em;
+    overflow: hidden;
+    white-space: nowrap;
+    overflow-wrap: anywhere;
+    text-overflow: ellipsis;
 }
 
 .feed-time-block {
@@ -2364,6 +2914,7 @@ h1 {
     border: 4px solid #59885d;
 
     background-color: #373021;
+    z-index: 10;
 }
 .inp_dropdown.open .valueList {
     display: block;
@@ -2442,6 +2993,7 @@ h1 {
 .settings-categorie .content-btn {
     width: 15em;
     position: relative;
+    margin-bottom: 50px;
 }
 
 .inp_search {
@@ -2449,128 +3001,13 @@ h1 {
     border: 3px solid #59885d;
     background: transparent;
     border-radius: 0.25em;
-    padding: 0.5em;
-    margin-left: -0.05em;
-    color: #ffffff;
-}
-
-/*Keyboard*/
-#keyboard {
-    position: absolute;
-    width: 90%;
-    height: 70%;
-    top: 5%;
-    left: -100%;
-
-    border-radius: 0.25em;
-    overflow: hidden;
-
-    box-sizing: border-box;
-    border: 3px solid #59885d;
-
-    background-color: #373021;
-
-    text-align: center;
-}
-#keyboard.in {
-    left: 5%;
-    transition: left 0.2s linear;
-}
-#keyboard.out {
-    left: 100%;
-    transition: left 0.2s linear;
-}
-.keyboard-row {
-    width: 100%;
-    height: 18%;
-    position: absolute;
-    top: 0;
-    left: 0;
-
-    display: flex;
-}
-.keyboard-row + .keyboard-row {
-    border-top: 3px solid #59885d;
-}
-.keyboard-row.r1 {
-    height: 10%;
-}
-.keyboard-row.r2 {
-    top: 10%;
-}
-.keyboard-row.r3 {
-    top: 28%;
-}
-.keyboard-row.r4 {
-    top: 46%;
-}
-.keyboard-row.r5 {
-    top: 64%;
-}
-.keyboard-row.r6 {
-    top: 82%;
-}
-#keyoard-input {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    border: 0;
-
-    text-align: center;
-    font-size: 2em;
-    line-height: 1.5em;
-}
-.keyboard-key,
-.keyboard-mod,
-.keyboard-func {
-    flex: 1;
-    padding-top: 1.3em;
-    font-size: 1.5em;
-}
-.keyboard-key:hover,
-.keyboard-mod:hover,
-.keyboard-func:hover,
-.keyboard-key.active,
-.keyboard-mod.active,
-.keyboard-func.active {
-    background-color: #1b5037;
-}
-.keyboard-key + .keyboard-key,
-.keyboard-key + .keyboard-mod,
-.keyboard-key + .keyboard-func,
-.keyboard-mod + .keyboard-key,
-.keyboard-mod + .keyboard-mod,
-.keyboard-mod + .keyboard-func,
-.keyboard-func + .keyboard-key,
-.keyboard-func + .keyboard-mod,
-.keyboard-func + .keyboard-func {
-    border-left: 3px solid #59885d;
-}
-.keyboard-key.wide,
-.keyboard-mod.wide,
-.keyboard-func.wide {
-    flex: 1.5;
-}
-.keyboard-key.wider,
-.keyboard-mod.wider,
-.keyboard-func.wider {
-    flex: 2;
-}
-.keyboard-key.widest,
-.keyboard-mod.widest,
-.keyboard-func.widest {
-    flex: 2.5;
-}
-.keyboard-key.space {
-    flex: 6;
-}
-.cancel-key {
-    background: #E43600;
-}
-.cancel-key:hover {
-    background: #f56b40;
+    padding-left: 0.5em;
+    padding-right: 0.5em;
+    font-family: "Noto Sans", "Noto Sans Symbols", "Noto Sans JP", "Noto Sans TC", "Noto Sans KR", "Noto Sans Arabic", "Noto Sans SC", sans-serif;
+    height: 70px;
+    font-size: 45px;
+    color: #000000;
+    background: #ffffff;
 }
 
 .content-avatar-functions .action-btn {
@@ -2905,6 +3342,10 @@ h1 {
     margin-left: 0.5em;
     margin-right: 4em;
 }
+.prop-maininformation .description {
+    white-space: normal;
+    overflow-wrap: break-word;
+}
 .prop-sidebar {
     position: absolute;
     top: 10%;
@@ -2963,10 +3404,6 @@ h1 {
     padding: 0 1em;
 }
 
-#search .scroll-content {
-    top: 8em;
-}
-
 #friend .list-content, #avatars .list-content, #worlds .list-content, #props .list-content {
     padding-right: 0;
     width: 76%;
@@ -3119,12 +3556,6 @@ td div {
     border-radius: 8px;
     border: 3px solid #59885d;
 }
-.inp_search {
-    height: 70px;
-    font-size: 30px;
-    color: #333333;
-    background: #ffffff;
-}
 
 .option-caption.nsfw-toggle-caption {
     display: flex;
@@ -3162,9 +3593,13 @@ td div {
     width: 60%;
     top: 100%;
     height: 10%;
+    min-height: 0;
 
     z-index: 10000;
 }
+.message-box.loading-box p {
+    flex: 0;
+}
 .message-box.loading-box.in {
     left: 20%;
     top: 70%;
@@ -3200,6 +3635,7 @@ td div {
 
 #settings .filter-option {
     padding: 0.35em 0.5em;
+    font-size: 30px;
 }
 
 .settings-categorie .row-wrapper p {
@@ -3225,6 +3661,8 @@ td div {
     padding: 1em;
     border: 3px solid #59885d;
     border-radius: 10px;
+    display: flex;
+    flex-direction: column;
 }
 .user-public-content img {
     width: 11em;
@@ -3233,6 +3671,7 @@ td div {
 .user-public-content .name {
     text-align: center;
     margin: 5px 0;
+    flex: 1;
 }
 .user-public-content .detail-btn {
     border: 3px solid #59885d;
@@ -3399,6 +3838,7 @@ img[data-loading-url] {
 /* Content Share: Share Bubble */
 
 .share-bubble-dialog {
+    z-index: 1002;
     max-width: 800px;
     transform: translate(-50%, -60%);
 }
@@ -3462,6 +3902,7 @@ img[data-loading-url] {
 /* Content Share: Share Select */
 
 .share-select-dialog {
+    z-index: 1001;
     width: 650px;
     height: 480px;
     transform: translate(-50%, -80%);
@@ -3504,6 +3945,7 @@ img[data-loading-url] {
 /* Content Share: Direct Share */
 
 .direct-share-dialog {
+    z-index: 1003;
     width: 800px;
     height: 1000px;
     transform: translate(-50%, -60%);
@@ -3651,6 +4093,7 @@ img[data-loading-url] {
 /* Content Share: Unshare */
 
 .unshare-dialog {
+    z-index:1000;
     width: 800px;
     height: 1000px;
     transform: translate(-50%, -60%);