body{font-family:Arial,sans-serif;margin:0;padding:0}header{background-color:#333;color:#fff;padding:1rem;text-align:center}.article-list{margin-left:17%;margin-right:17%}.article-card{width:700px;display:flex;align-items:left;flex-direction:column;padding:0;transition:transform .2s}.article-card:hover{transform:scale(1.02)}.article-link{display:flex;align-items:center;text-decoration:none;color:inherit}.article-content{flex-grow:1}.article-img{width:350px;height:auto;text-align:center;margin-right:15px;border-radius:5px;justify-content:center}.article-details{margin-left:20%;margin-right:20%}.sorting-container{display:flex;justify-content:center;align-items:center;gap:15px}.sorting-container select,.sorting-container button{padding:.3rem;font-size:.8rem;border:1px solid #ccc;border-radius:6px}.sorting-container button:hover,.sorting-container select:hover{background-color:#f0f0f0}.comments-section{margin-top:20px}.comment-card{padding:15px;border:1px solid #ddd;margin-bottom:10px;border-radius:8px}.vote-section{display:flex;align-items:center;margin-top:10px}.vote-section button{margin:0 5px;padding:5px 10px;font-size:1em;cursor:pointer}.vote-count{font-size:1.5em;font-weight:700}.topic-list-container,.topic-list{text-align:center}.topic-card-container{justify-content:center}.topic-card{margin:1%;width:300px;height:350px;border:2px solid #ccc;border-radius:8px;transition:transform .2s}.topic-card:hover{transform:scale(1.05)}.topic-image{width:100%;height:auto;max-width:300px;border-radius:6px}#all-articles{display:flex;justify-content:center;align-items:center;gap:15px}#nav{margin-top:.5rem}#nav a{color:#fff;margin:0 1rem;text-decoration:none}h2{font-size:xx-large;text-align:center;color:#333}ul{list-style-type:none;padding:0}li{margin:1rem 0;padding:1rem;border:1px solid #ddd;border-radius:8px}img{width:100%;max-width:300px;height:auto;display:block;margin:0 auto 1rem}@media (min-width: 768px){ul{display:flex;flex-wrap:wrap;gap:1rem}}