@import url('https://fonts.googleapis.com/css2?family=Bungee+Inline&family=Comfortaa&display=swap');
body {
    font-family: Comfortaa;
    color: white;
    background-image: url(https://media.istockphoto.com/id/1191658515/photo/neon-background-abstract-blue-and-pink-with-light-shapes-line-diagonals.jpg?b=1&s=612x612&w=0&k=20&c=g_jTxYYwBLI4lZjG607HeaxVOPoiQEpGzdubEsI-r38=);
    background-repeat: no-repeat;
    background-size: cover;
}
#chatbody {
    display: grid;
    grid-template-columns: 20% 80%;
    grid-template-rows: 100%;
    padding: 0px;
    margin: 0px;
    background-color: white;
    background-image: none;
    color: black;
    height: 100%;
}
#chats {
    border-style: solid;
    height: 100%;
    padding: 10px;
}
.chat {
    border-style: solid;
    padding: 10px;
    margin-bottom: 5px;
    cursor: pointer;
}
.chat.selected {
    border-color: green;
}
#chatwin {
    border-style: solid;
    height: 100%;
    width: 100%;
    margin: 0px;
    padding: 0px;
}

input, textarea {
    width: 100%;
    border-radius: 5px;
    border-style: none;
    margin-top: 10px;
    height: 30px;
}
#chatinput {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    border-style: solid;
    margin: 0px;
    border-radius: 0px;
    border-color: black;
}
a {color: lightblue;}
button {
    font-size: 20px;
    border-radius: 5px;
    border-style: none;
    padding: 10px;
}
button:hover {opacity: 75%;}
.center-content {
        text-align:center;
}
.center-box {
    margin-left: auto;
    margin-right: auto;
}
#navbar {
    display: inline-block;
}

.navbtn {
    float: right;
    margin-left:30px;
}
.post-box {
    border-style: solid;
    margin-top:30px;
    padding:10px;
    border-color: white;
    border-width: thick;
    border-radius: 20px;
}
#post-content-input {
    height: 50%;
    margin-top: 30px;
}
.topmargin {
    margin-top: 20px;
}
#loginform {
    width: 500px;
}
.link {
    border-radius: 10px;
    width: 300px;
    height: 175px;
    display: inline-block;
    margin: 10px;
    transition-property: transform;
    transition-duration: 0.75s;
    transition-timing-function: ease;
}
.link:hover {transform: scale(110%);}