#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center;text-decoration:none;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;color-scheme:light dark}.header{font-size:xx-large}.nav-link{padding:12px 24px;color:#fff;font-size:30px;border:2px solid #fff;border-radius:30px;background-color:#1d1111de;text-decoration:none;display:inline-block;margin:10px;transition:background-color .2s,color .2s}.nav-link:hover{background-color:#9d9898;color:#1d1111de}.article{box-shadow:0 4px 8px #0003;max-width:300px;max-height:30rem;min-height:30rem;margin:20px;text-align:center;font-family:arial;padding:20px 10px}.article img{max-width:300px;min-height:200px;vertical-align:middle}.article-div{max-height:500px;padding-bottom:100px}.flex-container{display:flex;align-items:center;flex-direction:row;flex-wrap:wrap}@media (max-width: 800px){.flex-container{flex-direction:column}}.bullets{font-weight:700}#single-article{border:2px solid rgb(80,80,82);border-radius:8px;padding:20px;margin:30px;background-color:#d3cece;box-shadow:0 0 90px #8a8b8f1a;text-decoration:none;font-size:20px}#single-article h2{font-size:35px}#single-article img{width:50%;height:350px;object-position:bottom;object-fit:cover}button{padding:12px 24px;color:#fff;font-size:30px;border:2px solid #fff;border-radius:30px;background-color:#1d1111de;text-decoration:none;display:inline-block;margin:10px;transition:background-color .2s,color .2s}button:hover{background-color:#9d9898;color:#1d1111de}a{text-decoration:none}nav{border-color:#0ff;border-width:30px}#single-article img{max-height:min-content}.create-comment{display:flex;flex-direction:column;align-items:center;margin:20px}.create-comment button{margin-left:30px}.comments-list h3{margin-left:20px}#comment-box{width:100%;height:50px;padding:10px;border:1px solid #ccc;border-radius:5px;margin-bottom:10px}#comment-box::placeholder{font-size:16px}.comment{color:#000;border-radius:8px;background-color:#d3cece;box-shadow:200px 20px 90px #8a8b8f1a;border:2px solid rgb(80,80,82);margin:50px;list-style:none;text-decoration:none}li{color:#000;border-color:#616166;border-width:10px;border-style:groove;margin:30px;list-style:none;text-decoration:none}.loader{border:16px solid #f3f3f3;border-top:16px solid #9d9898;border-radius:50%;width:120px;height:120px;animation:spin 2s linear infinite;margin-left:550px;margin-top:100px}.loading{margin-top:50px;font-size:50px;margin-left:50px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}