*{box-sizing:border-box;margin:0;padding:0;font-family:Roboto}body{background-color:#272727;width:100%;height:100vh}@font-face{font-family:Roboto;src:url(/assets/Roboto-CTnIOZTo.ttf)}label,button{display:block}textarea{resize:none;width:100%!important;height:124px!important;padding:10px;border:1px solid #ffffff;border-radius:5px;outline:none;margin-top:8px;background-color:transparent;color:#ddd}textarea:focus{border:2px solid #9b80ff}input{width:100%;padding:0 7px;height:32px;margin-top:8px;border:1px solid #ffffff;border-radius:5px;outline:none;background-color:transparent;color:#ddd}input:focus{border:2px solid #9b80ff}input::placeholder{color:#ccc}button{width:fit-content;max-width:100%;background-color:#8668f3;border:none;border-radius:8px;padding:10px 25px;color:#fff;font-size:14px;margin:16px 0 0 auto;cursor:pointer;transition:.2s;font-weight:700}button:not(.disabled):not(dialog button):hover{background-color:#6945eb}.like-btn{margin:unset;cursor:pointer}.disabled{background-color:gray;cursor:not-allowed}.error{background-color:#ff5a5a;text-align:center;padding:35px;border-radius:5px;color:#fff}.error img{width:200px;height:auto;margin-bottom:30px}.signin-page{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(90deg,#272727,#414141);padding:24px;max-width:95%;border-radius:8px;box-shadow:5px 5px 4px #0000004b}.signin-page h2{margin-bottom:24px;color:#fff}.signin-page form{width:500px;max-width:95%;color:#fff}.signin-page input{border:1px solid #8668f3}.signin-page input:focus{border:2px solid #9b80ff}.signin-page input::placeholder{color:#535353}label{font-weight:400}@media screen and (max-width:280px){.signin-page h2,.signin-page label{text-align:center}.signin-page button{margin:16px auto 0}}.post-page{width:100%;margin:0 auto;border-radius:0 0 16px 16px}.post-page .content{width:1360px;max-width:100%;margin:0 auto;padding:0 24px 10px}.post-page header:not(.postcard header){width:100%;position:sticky;top:0;padding:20px 37px;background-color:#474747;color:#fff;margin-bottom:24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:25px;z-index:1}.post-page header button{margin:0;background-color:#fff;color:#000;font-weight:400}.post-page header button:hover{color:#fff}.apresentation-title{color:#8668f3;margin:40px 0 25px}.postCreated{width:100%;padding:20px;border-radius:16px;outline:none;background-color:#212121;margin-bottom:24px;box-shadow:2px 4px 6px #00000040}.postCreated h2{color:#8668f3}.postCreated-item{max-width:100%;margin-bottom:25px}.postCreated button{width:100px;height:unset;margin:unset;margin-right:auto}.postCreated label{color:#fff}.creating-post{position:fixed;bottom:5%;left:50%;transform:translate(-50%);width:250px;max-width:100%;padding:15px;background-color:#8668f3;text-align:center;border-radius:5px;color:#fff;font-weight:700;box-shadow:2px 2px 3px #0000003d}.postcard{width:100%;border:1px solid #999999;border-radius:16px;margin-bottom:24px;font-size:18px;animation:slideIn .45s cubic-bezier(.22,1,.36,1) forwards;opacity:0;transform:.2s;color:#c2c2c2}.postcard header{padding:20px 24px;flex-wrap:wrap;gap:15px}.postcard .author{font-weight:700}.postcard header,.postcard-infos{display:flex;align-items:center;justify-content:space-between}.postcard-infos{color:#777;flex-wrap:wrap;gap:15px}.postcard-infos .datetime{font-weight:400;font-size:12px}.postcard .postcard-content{padding:0 24px 24px}.postcard-content .text-postcard{margin-top:18px;font-weight:500;overflow-wrap:break-word;font-size:14px}.actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.postcard span{margin:0 4px}.actions span{cursor:pointer}.postcard img{transition:.2s;width:30px;height:auto}.postcard img:hover{transform:scale(1.05)}.pagination-btns{display:flex;align-items:center;justify-content:flex-end;gap:10px}.pagination-btns button{width:110px;max-width:100%;margin:0}.account{display:flex;align-items:center;justify-content:flex-start;gap:15px;flex-wrap:wrap}.comments{text-align:start;font-size:14px;color:#fff}.comments p{margin-top:20px;word-break:break-all;border-top:1px solid rgb(97,97,97);padding-top:15px}.commentary-list{padding:0 20px 20px}.commentary-list:before{content:"";position:relative;display:inline-block;width:100%;height:1px;background-color:#d1d1d1}.content-commentPost{position:relative;padding-bottom:10px;font-size:14px;color:#c7c7c7}.content-commentPost:before{content:"";position:absolute;top:100%;left:2%;width:2px;height:80px;background-color:#8668f3}.comment-icon{width:25px!important;height:auto}.no-comments{font-size:14px;margin-top:25px;color:#bdbdbd}@keyframes slideIn{0%{transform:translateY(-15px);opacity:0}to{transform:translateY(0);opacity:1}}@media screen and (max-width:400px){.postcard-infos .datetime{font-size:1rem}}@media screen and (max-width:310px){.post-page header h2{font-size:1.2rem}}dialog{width:660px;max-width:90%;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border:none;border-radius:16px;padding:24px;animation:grow .45s cubic-bezier(.22,1,.36,1) forwards;overflow:hidden;background-color:#272727;color:#fff}.dialog-btns{display:flex;align-items:center;justify-content:flex-start;gap:16px}dialog button{margin:40px 0 0;background-color:#939393;color:#fff}.edit-modal h3{margin-bottom:24px}.edit-modal .dialog-btns button{margin:0}.delete-btn,.positive-btn{color:#fff;border:none;transition:.2s}.delete-btn{background-color:#ff5151}.positive-btn{background-color:#8668f3}.positive-btn:hover{background-color:#6d4aec}.delete-btn:hover{background-color:#a52323}dialog::backdrop{background-color:#000000b9}.edit-item{margin-bottom:24px}.comments textarea{position:relative;z-index:2;border:none;padding:10px 0 0;margin-top:80px;font-size:1.4rem}.comments textarea:focus{box-shadow:none}.extra-actions{display:flex;align-items:center;justify-content:center;gap:45px;margin-top:35px}.see-comments{font-size:16px;color:#af9aff;cursor:pointer}.see-comments:hover{text-decoration:underline}@keyframes grow{0%{transform:scale(.5) translate(-50%,-50%);transform-origin:top center;opacity:0}to{transform:scale(1) translate(-50%,-50%);opacity:1}}.container{margin:2em auto;height:10vh;display:flex;align-items:center;justify-content:center}.loader{border:1em solid lightgrey;height:100px;width:100px;border-radius:50%;border-top:1em solid #8668F3;animation:spin 1.5s linear infinite}.loading-animation{text-align:center;color:#8668f3}@keyframes spin{to{transform:rotate(360deg)}}