*{margin:0;padding:0;box-sizing:border-box;overflow-wrap:break-word;font-family:Arial,Helvetica,sans-serif}html{max-width:100vw;height:100vh}html::-webkit-scrollbar{width:10px}html::-webkit-scrollbar-track{background:transparent}html::-webkit-scrollbar-thumb{background:transparent}body{background:#191919;color:#fff;padding:50px;overflow:auto}.container{display:flex;flex-direction:row;align-items:center;justify-content:center;min-height:calc(100vh - 170px);flex-wrap:wrap;gap:30px}.home{min-height:calc(100vh - 250px)}.container img{width:max(8vw,190px);height:max(8vw,190px)}.navbar{height:70px;display:flex;align-items:center;justify-content:space-evenly}.navbar .links{height:100%;display:flex;align-items:center;font-size:1.75rem}.links a{width:40vw}.loggedInContainer{height:100%;width:40vw;display:flex;justify-content:flex-end;align-items:center;align-content:flex-end}.loggedInContainer h1{font-size:1.5rem;font-family:Metal mania;padding-right:30px}a{margin-left:20px;text-decoration:none;color:#fff;font-family:Metal mania}.navbar button{width:100px;height:40px;cursor:pointer;margin-right:10px;border-radius:10px;background-color:#fff;font-family:Metal mania}.navbar h1{text-align:right;margin-right:10px;color:#fff;font-weight:lighter}.center{display:flex;flex-direction:column;align-items:center;justify-content:center}.update-article{display:flex;flex-direction:row;width:100%;justify-content:center;align-items:center;gap:15px}.update-article a,button.edit{margin:15px 0 0}.edit{display:flex;flex-direction:row;justify-content:center;align-items:center;width:30%;background-color:orange}.edit:hover{transform:scale(1.01)}#form-btn{height:70px;width:70px;border-radius:50%;color:#fff;display:flex;align-items:center;flex-direction:column;justify-content:center;box-shadow:0 0 5px #ccc;background-color:#2d323b;position:absolute;bottom:30px;right:30px}#form-btn:hover{transform:scale(1.15)}#create{display:flex;align-items:center;justify-content:center;font-family:Metal mania;background:#ffffff;color:#000;text-align:center;border-radius:10px;padding:10px;border:#ccc solid 1px;margin-top:30px;font-size:1.5rem}#create:after{content:"";display:block;width:0;z-index:1;border-style:solid;border-color:#ffffff transparent;border-width:10px 6px 0;margin-right:-6px}.character-container img{width:max(8vw,120px);height:max(8vw,120px)}.character-container{background-color:#2d323b;display:flex;flex-direction:column;justify-content:center;border-radius:5px;align-items:center;text-align:center;cursor:pointer;padding:5px;margin:0;width:max(15.229vw,220px);height:max(17.5vw,220px)}.character-container h1{font-family:Metal mania;letter-spacing:2px}.character-container:hover,#create:hover{box-shadow:0 15px 20px -15px #fff;transform:scale(1.05);cursor:pointer}main{display:flex}#header{width:100vw}#character-container-left{list-style:none;width:320px;height:100%;display:flex;flex-direction:column;padding-top:150px;justify-content:center;align-items:center}#character-container-left img{height:289px;width:250px}#character-container-left section{box-sizing:border-box;width:255px;margin-bottom:0;overflow-wrap:break-word;vertical-align:baseline;display:flex;flex-direction:column;align-items:center;background:#111;color:#fff}.overview-header{margin:2.4px 0;display:block;font-size:14px;line-height:1.25;padding:6px;background:#2d323b;text-align:center;width:98%;border-radius:3px}.name{font-size:1.5rem}.overview-container{width:98%;display:flex;flex-direction:column;gap:2px}.overview-key{width:250px;display:flex;align-items:center;flex-direction:row;font-size:16px;min-height:25px;width:100%;background:#2d323b}.key{font-size:12px;display:flex;align-items:center;justify-content:center;height:100%;padding:5px;background:#2d323b}.key-desc{flex:1;font-size:12px;display:flex;height:100%;flex-direction:column;justify-content:center;border-left:2px solid #949494;padding-left:10px}#character-container-right{max-width:calc(100vw - 405px)}#character-container-right h1{font-size:1.7em;font-weight:300;padding:35px 0;font-family:Metal mania;width:120px}#character-container-right p{padding:0 25px;line-height:1.4;white-space:pre-wrap}#character-container-right li{padding-bottom:15px;margin-left:30px;list-style:none}#character-container-right textarea{resize:vertical;min-width:calc(100vw - 405px);margin:0;line-height:1.4}#the-count{float:right;padding:.1rem 0 0;font-size:.875rem}.error-message{color:orange;text-align:center}.article-submit{width:100%;background:#2d323b;color:#fff;font-size:1.5rem}.article-submit:hover{transform:scale(1.02);box-shadow:0 5px 10px -5px #fff}.loginContainer{display:flex;align-items:center;flex-direction:column;border:5px solid orange;border-radius:5px;padding:20px}.loginContainer input,button{width:200px;height:50px;border-radius:8px;border:none;margin:15px}.loginContainer button{background-color:#2d323b;color:#fff}.loginContainer button:hover{background-color:orange}.loginContainer input{border:2px solid grey;border-radius:5px}.padding-bottom{padding-bottom:10px}input,textarea{padding:5px}@media (max-width: 850px){main{flex-direction:column}#character-container-left{align-self:center}#character-container-right textarea,.article-submit,#character-container-right p,#character-container-right li,#character-container-right{min-width:calc(100vw - 100px)}}@media (max-width: 750px){.links a{font-size:1rem}.loggedInContainer{align-items:center;justify-content:center}.loggedInContainer h1{font-size:.9rem;margin:0 auto;padding:0}.loggedInContainer button{width:45px}#form-btn{bottom:20px;right:55%;left:45%;margin:0;height:50px;width:50px}#create{font-size:.8rem}.character-container{width:250px;height:250px}.character-container h1{font-size:1.5rem}}@media (max-width: 479px){#character-container-right p,#character-container-right li{font-size:.9em}}@media (max-width: 414px){.character-container{width:190px;height:190px}.character-container img{width:90px;height:90px}.home{align-content:space-evenly}}@media (max-width: 345px){#character-container-left,#character-container-left ul{min-width:345px}}