.Main{min-height:100vh;background-color:#edeae5}.Header{display:flex;padding:15px;justify-content:center}.logo-img{height:125px;transition:transform .4s ease-in-out}.logo-img:hover{transform:rotate(90deg)}.Home{padding:15px 7%;display:flex;flex-direction:column;gap:20px}.posts-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:20px}.hero-text{display:flex;justify-content:space-between}@media screen and (max-width: 800px){.hero-text{display:block}}.PostPreview{cursor:pointer;transition:transform .4s ease-in-out;border:1px solid black;border-radius:10px;box-shadow:#0e1e251f 0 2px 4px,#0e1e2552 0 2px 16px}.PostPreview:hover{transform:scale(1.025)}.color-holder{border-radius:10px 10px 0 0;height:100px}.post-preview-data{border-radius:0 0 10px 10px;padding:15px;background-color:#fff}.post-preview-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.Post{display:flex;flex-direction:column;gap:40px}.post-container{border:1px solid black;border-radius:10px;background-color:#fff;box-shadow:#0000003d 0 3px 8px}.post-color-holder{border-radius:10px 10px 0 0;height:150px}.post-content{padding:20px;display:flex;flex-direction:column;align-items:center;gap:5px}.post-title{text-align:center;width:100%}.post-date,.post-text{width:100%}.post-text{display:flex;flex-direction:column;gap:10px}.post-text img{width:100%}.graytext{color:gray}@media screen and (min-width: 320px){.Post{padding:15px 1%}}@media screen and (min-width: 600px){.Post{padding:15px 5%}.post-date,.post-text,.post-title{width:80%}}@media screen and (min-width: 900px){.Post{padding:15px 10%}}@media screen and (min-width: 1200px){.Post{padding:15px 15%}}@media screen and (min-width: 1400px){.Post{padding:15px 20%}}.Comment{display:flex;flex-direction:column;gap:5px}.Comment+.Comment{padding-top:5px;border-top:1px solid gray}.comment-header{display:flex;gap:5px}.comment-name,.comment-date{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media screen and (max-width: 500px){.comment-dot{display:none}.comment-header{display:block}}.CommentForm{width:100%}.CommentForm form{display:flex;flex-direction:column;gap:10px}input{padding:5px;font-size:16px}.comment-form-textarea{padding:5px;resize:vertical;font-size:16px}.form-input{display:flex;flex-direction:column}.btn-submit{background-color:#111827;border:1px solid transparent;border-radius:.75rem;box-sizing:border-box;color:#fff;cursor:pointer;flex:0 0 auto;font-size:.8rem;font-weight:600;line-height:1.5rem;padding:.25rem .75rem;text-align:center;text-decoration:none #6b7280 solid;text-decoration-thickness:auto;transition-duration:.2s;transition-property:background-color,border-color,color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:none;touch-action:manipulation;width:auto;align-self:center}.btn-submit:hover{background-color:#374151}.btn-submit:focus{box-shadow:none;outline:2px solid transparent;outline-offset:2px}.Comments{display:flex;flex-direction:column;align-self:center;width:75%;gap:20px;padding:20px 10%;border-radius:5px;background-color:#fff;box-shadow:#0000003d 0 3px 8px}.comments-container{display:flex;flex-direction:column;gap:10px}@media screen and (max-width: 1000px){.Comments{width:100%}}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter var,ui-sans-serif,system-ui,-apple-system,system-ui,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji"}html{font-size:16px}@media screen and (min-width: 320px){html{font-size:calc(16px + 6 * ((100vw - 320px) / 680))}}@media screen and (min-width: 1000px){html{font-size:22px}}
