html{font-family:Roboto,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;font-variation-settings:"wdth" 100}body{margin:0;background:#ddd8d0;color:#343434}.header-component{display:flex;margin:0%;background:#f5f5f5;justify-content:space-between;align-items:center;padding-right:2em}.logo-star{color:red}.logged-in-icon{display:inline-flex;align-items:center;color:#343434}.logged-in-icon img{width:60px;height:60px;border-radius:100%;border:solid rgb(52,52,52) 4px;transition-duration:.5s;background-color:#f5f5f5}.logged-in-icon img:hover{scale:1.05}a{text-decoration:none;color:#343434}a h1{padding-left:2rem;color:#000;font-size:35pt;transition-duration:.5s;font-family:Playfair,serif;font-optical-sizing:auto;font-weight:900;font-style:oblique;font-variation-settings:"wdth" 100}a h1:hover{scale:1.05;color:red}.nav-buttons{display:flex;justify-content:space-evenly;background:#f5f5f5;box-shadow:0 15px 9px #343434}.nav-buttons h2{border-bottom:4px solid whitesmoke}.nav-buttons h2:hover{border-bottom:4px solid rgb(52,52,52);color:#343434}.articles-list-component h2,.articles-list-query-btns{display:flex;align-items:center;justify-content:center}.articles-list-query-btns select{background-color:#f5f5f5;color:#343434;font-weight:500;border-radius:20px;height:2em;width:7em;align-content:center}.articles-list{max-width:700px;margin:1em auto;display:grid;grid-row-gap:1em}.article-card{display:grid;padding:1em;height:fit-content;grid-template-areas:"article-card-author . article-card-date" "h3                  h3               h3" "img                 .                 ." "... article-likes article-comment-count";grid-template-columns:auto;grid-template-rows:auto;grid-column-gap:2em;grid-gap:8px;background-color:#f5f5f5;border-radius:2em;box-shadow:10px 10px 5px 5px #434343;transition-duration:.3s}.article-card-author{grid-area:article-card-author;display:flex;justify-content:space-between;padding-bottom:none}.article-card-date{grid-area:article-card-date}.article-card h3{grid-area:h3;padding-top:none}.article-card img{grid-area:img}.article-card:hover{scale:1.01}.article-likes{grid-area:article-likes;font-size:16pt}.article-comment-count{grid-area:article-comment-count;font-size:16pt}.login-btn{width:8em;height:3em;font-family:Roboto,sans-serif;font-weight:700;font-size:medium;background-color:#000;color:#f0f8ff;border:none;border-radius:20pt}.login-btn:hover{background-color:#f5f5f5;color:#000;border:3pt solid black;cursor:pointer}.users-list-text h2,.users-list-text h3{display:flex;justify-content:center}.user-btn{background-color:#fff;border:4px solid black;transition-duration:.5s}.user-btn:hover{cursor:pointer;scale:1.05}.user-cards{display:flex;flex-wrap:wrap;justify-content:space-around}.user-name-user-page{display:flex;justify-content:center}.topics-header{display:flex;justify-content:center;align-items:center}.topics-list{max-width:700px;margin:1em auto;display:grid;grid-row-gap:1em}.topic-card{display:grid;padding:1em;height:fit-content;grid-template-areas:"img" "topic-h3" "topic-desc";background-color:#f5f5f5;border-radius:2em;box-shadow:10px 10px 5px 5px #434343;transition-duration:.3s;justify-content:center}.topic-card:hover{scale:1.01}.single-topic-view-title{display:flex;justify-content:center}.single-topic-list{max-width:700px;margin:1em auto;display:grid;grid-row-gap:1em}.single-article-view{padding:2em;margin:2em;width:fit-content;background-color:#f5f5f5;border-radius:20pt}.single-article-view-topic-link{width:6em;height:2em;font-family:Roboto,sans-serif;font-weight:500;font-size:12pt;background-color:#000;color:#f0f8ff;border:3pt solid black;border-radius:20pt}.single-article-view-topic-link:hover{background-color:#f5f5f5;color:#000;border:3pt solid black;cursor:pointer}.loading-error{display:flex;justify-content:center;align-items:center;flex-direction:column}