body { background-color: black; color: rebeccapurple; } h1, h2, label { font-size: 160%; } h1 { text-align: center; } /* .big { font-size: 200%; } */ .big>input { font-size: 180%; margin: 5%; } input { background-color: black; color: white; border-color: rebeccapurple; } .error { color: rgba(255, 0, 0, 0.7); font-weight: bold; border: 5px solid rgba(99, 0, 0, 0.2); background-color: rgba(95, 0, 0, 0.5); } .success { color: rgba(0, 202, 0, 0.7); font-weight: bold; border: 5px solid rgba(0, 99, 0, 0.2); background-color: rgba(0, 99, 0, 0.5); } #central { width: 40%; border: 5px solid rebeccapurple; height: 30vw; padding: 10px; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: rgba(13, 6, 19, 0.4); font-weight: bold; } a { color: rebeccapurple; } .main { width: 85vw; border: 5px solid rebeccapurple; height: 85vh; padding: 10px; margin: 0 auto; display: flex; background-color: rgba(13, 6, 19, 0.4); font-weight: bold; } .profile-avatar { width: 128px; height: 128px; border: 3px solid rebeccapurple; } .name { font-size: 110%; text-align: center; margin: 0; } .profile { /* border: 3px solid rebeccapurple; */ padding: 5px; display: flex; text-align: left; } .profile-header { text-align: left; width: 128px; } .profile-bio { border: 3px solid rgba(102, 51, 153, 0.5); margin-left: 5px; text-align: center; height: fit-content; height: -moz-fit-content; margin-left: 10px; } .stats>div { border: 3px solid rgba(102, 51, 153, 0.5); height: fit-content; height: -moz-fit-content; text-align: center; width: 33%; float: left; margin: 5px; } .stats { height: fit-content; margin: 5px; overflow: hidden; width: auto; display: flex; align-items: center; } .stat-name { font-weight: bold; } nav { overflow: hidden; border: 5px solid rgba(102, 51, 153, 0.5); width: 85vw; padding-left: 10px; padding-right: 10px; margin-left: auto; margin-right: auto; margin-bottom: 10px; background-color: rgba(13, 6, 19, 0.4); font-weight: bold; } nav ul { margin: 0; padding: 0; } nav ul li { display: inline-block; list-style-type: none; } nav>ul>li>a { display: block; line-height: 2em; padding: 0.5em 0.5em; text-decoration: none; } .avatar { width: 42px; height: 42px; } button { background-color: rgba(102, 51, 153, 0.75); color: rgb(204, 179, 230); border-color: rgba(102, 51, 153, 0.25); border-style: initial; font-size: large; } #postbox { /* border: 3px solid rebeccapurple; */ /* padding: 5px; */ margin: 0 0 30px 0; height: fit-content; display: flex; /* text-align: left; */ } #timeline { margin: 0; padding: 0; } #timeline li { display: grid; list-style-type: none; width: 85vw; } #post-content { color: rgb(204, 179, 230); background-color: rebeccapurple; border-width: 0px; height: 60px; width: 85vw; } .note { display: flex; } .content { display: inline-flex; flex-direction: column; } div>p { font-size: small; margin-left: 2px; margin-right: 2px; } .display-name { font-weight: bold; } .username { color: rgba(102, 51, 153, 0.5); } .user-info { display: inline-flex; margin-top: 0px; } #timeline-box { color: rgb(204, 179, 230); display: flex; flex-direction: column; } .note:nth-child(even) { background: rgba(102, 51, 153, 0.25); } .note:nth-child(odd) { background: rgba(102, 51, 153, 0.125); }