*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.header{background-color:#e1eebc;color:#328e6e;display:grid;grid-template-columns:repeat(3,1fr);padding:30px;text-align:center}.search-bar{width:400px;border-radius:30px;border:1px solid #67AE6E;background-color:#e1eebc;color:#328e6e;padding-left:5px;font-size:1em}.search-bar::placeholder{color:#328e6e}.header-links{display:flex;gap:30px;width:400px;align-items:center;font-weight:300}.header-links p:hover{transition:.5s;color:#67ae6e}.Create-Form-Container{display:flex;flex-direction:column;gap:10px;justify-content:flex-start;align-items:center;height:100vh;background-color:#90c67c}.Create-Form{display:flex;flex-direction:column;gap:10px;margin-top:40px;padding:20px;background-color:#e1eebc}.input-bar{width:400px;height:30px;padding:5px;border-radius:5px;border:1px solid #90C67C;color:#90c67c}.input-bar::placeholder{color:#90c67c}.post-btn{width:120px;padding:7px;font-size:18px;background-color:#e1eebc;color:#67ae6e;border:1px solid #90C67C;border-radius:5px}.post-btn:hover{border-width:2px;transition:.5s}.text-area-content{width:400px;font-size:12px;height:150px;border:1px solid #90C67C;border-radius:10px;padding:5px;color:#90c67c}.text-area-content::placeholder{color:#90c67c}a,a:hover{text-decoration:none;color:inherit}.Sort-btn-container{margin-top:10px;margin-left:10px;margin-bottom:25px;display:flex;gap:20px;align-items:center;color:#328e6e}.order-btn{padding:7px;color:#328e6e;background-color:#e1eebc;border:0px solid #90C67C;border-radius:5px;cursor:pointer}.order-btn:hover{transition:.5s;border-width:1px}.posts-container{height:100vh;width:100vw;display:flex;flex-direction:column;align-items:center;gap:20px}.post{display:flex;flex-direction:column;gap:10px;width:700px;background-color:#e1eebc;padding:10px;color:#328e6e;border-radius:15px;border:1px solid #90C67C}.post:hover{transition:.5s;border-width:2px}.post p{font-size:12px}img{width:300px;height:300px}.post-page-container{height:100vh;width:100vw;display:flex;justify-content:center;padding:30px}.post-page{display:flex;flex-direction:column;gap:20px;justify-content:flex-start;width:1200px;height:700px;background-color:#e1eebc;border-radius:50px;padding:50px}.upvote-container{display:flex;gap:5px}.comments-container{background-color:#90c67c;height:400px;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:10px;overflow-y:auto}.input-comment{width:100%;height:30px;font-size:16px;border-radius:5px;border:none;padding:5px;color:#328e6e}.input-comment::placeholder{color:#328e6e}.comments-container p{color:#328e6e}.input-btn{padding:5px;margin-top:10px}.title{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.button-container{display:flex;gap:8px}.edit-btn,.delete-btn{padding:4px 10px;font-size:.85rem;border:none;border-radius:5px;background-color:#fff;color:#328e6e;cursor:pointer}.edit-btn:hover{transition:.5s;background-color:#ddd}.delete-btn:hover{transition:.5s;color:#fff;background-color:red}.active{background-color:#19520356}.signup-link{text-decoration:none;color:#328e6e;font-weight:600}.signup-link:hover{text-decoration:underline;color:#2a6a54}.signup-container{display:flex;flex-direction:column;gap:30px;justify-content:center;align-items:center;height:100vh;width:100vw;background-color:#90c67c}.signup-container input{width:250px;height:30px;background-color:#e1eebc;color:#328e6e;border-radius:5px;border:none;padding:5px}.signup-container input::placeholder{color:#328e6e}.signup-container h1,.signup-container h2{color:#328e6e}.signup-container button{padding:10px;color:#328e6e;background-color:#e1eebc;font-size:14px;border:none;border-radius:5px;cursor:pointer}.signin-container{display:flex;flex-direction:column;gap:30px;justify-content:center;align-items:center;height:100vh;width:100vw;background-color:#90c67c}.signin-container input{width:250px;height:30px;background-color:#e1eebc;color:#328e6e;border-radius:5px;border:none;padding:5px}.signin-container input::placeholder{color:#328e6e}.signin-container h1,.signin-container h2{color:#328e6e}.signin-container button{padding:10px;color:#328e6e;background-color:#e1eebc;font-size:14px;border:none;border-radius:5px;cursor:pointer}.footer-container button{color:#e1eebc;background-color:#328e6e;border:none;padding:10px;border-radius:7px;cursor:pointer}.footer-container button:hover{box-shadow:2px 4px 8px #90c67c33}.comment{display:flex;width:100%}.comment-section{display:flex;margin-left:auto;cursor:pointer;gap:10px}.loader{font-weight:700;font-family:monospace;display:inline-grid;font-size:30px}.loader:before,.loader:after{content:"Loading...";grid-area:1/1;-webkit-mask-size:100% 5px,100% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-composite:xor;mask-composite:exclude;animation:l35-1 1s infinite}.loader:before{-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0)}.loader:after{-webkit-mask-image:linear-gradient(#000 0 0);animation:l35-1 1s infinite,l35-2 .2s infinite cubic-bezier(.5,200,.5,-200)}@keyframes l35-1{0%{-webkit-mask-position:0 20px,0 0}20%{-webkit-mask-position:0 8px,0 0}40%{-webkit-mask-position:0 100%,0 0}60%{-webkit-mask-position:0 3px,0 0}80%{-webkit-mask-position:0 15px,0 0}to{-webkit-mask-position:0 0,0 0}}@keyframes l35-2{to{transform:translate(.1px)}}