@import"https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Parisienne&family=Cookie&family=Noticia+Text:ital,wght@0,400;0,700;1,400;1,700&family=Newsreader:ital,opsz,wght@0,6..72,200..800;1,6..72,200..800&display=swap";body{margin:0}#root{--main-bg-color: orange;--secondary-bg-color: white;--header-bg-color: #384b6b;--active-bt-color: pink;--text-color-light: ghostwhite;--text-color-dark: #0f1621;margin:0;padding:0}body{font-family:Figtree,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;color:var(--text-color-dark)}a{text-decoration-line:none;color:var(--text-color-dark);font-weight:600}h1{font-family:Newsreader,serif;font-size:4rem;font-optical-sizing:auto;font-weight:600;font-style:normal}.header{background-color:var(--header-bg-color);border-radius:30px;color:var(--text-color-light);display:grid;grid-template-columns:3fr 1fr;align-items:center;justify-items:center;margin:10px}.header>a{color:beige!important;text-decoration-line:none}.user-avatar{width:100px;height:100px;object-fit:contain}.nav-bar{display:flex;padding:10px;justify-content:space-around;background-color:var(--secondary-bg-color);position:sticky;top:0}.nav-items{height:100px}.article-card{border:dotted 3px darkslategray;background-color:var(--main-bg-color);margin:10px;padding:10px;border-radius:30px}.article-card-img-preview{max-width:-webkit-fill-available;width:100%;height:100%;border-radius:25px;width:auto}.article-card-text-title{font-size:1.2rem}.date-time{font-size:1rem;font-style:italic}.interaction-counts{display:flex;flex-direction:row;justify-content:space-around}.article-img{max-width:-webkit-fill-available}.article-topic{font-size:1.1rem;font-style:italic}.article{border:dotted 3px darkslategray;border-radius:30px;background-color:var(--main-bg-color);margin:10px;padding:10px}.article-details{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}.interactions-bar{display:flex;flex-direction:row;justify-content:space-between}.interaction{display:flex;flex-direction:row;border:dotted 1px darkslategray}.interaction-boxes{width:40px;height:40px;display:flex;justify-content:center;align-items:center}.interaction-boxes{background-color:#fff;border-radius:50%;margin:0 2px}button.interaction-boxes:hover{animation-name:pop;animation-duration:.3s;transition:.2s}@keyframes pop{0%{scale:1}75%{scale:1.1}to{scale:1}}.active-button{background-color:var(--active-bt-color)}.interaction-icons{width:30px;border-radius:50%}.comment-section{margin:10px}.comment-card{border:dotted 3px darkslategray;border-radius:30px;background-color:var(--main-bg-color);padding:10px}.add-comment{border:dotted 3px darkslategray;background-color:var(--secondary-bg-color);margin:10px;padding:10px}.comment-form{display:flex;flex-direction:column;align-items:flex-start}.sort-articles{display:flex;justify-content:flex-end}.user-card{margin:10px;background-color:var(--secondary-bg-color);border:dotted 3px darkslategray}