:root{--title-size:clamp(1.5rem,4vw,2.5rem);--nav-size:clamp(0.9rem,2.2vw,1.2rem)}*{box-sizing:border-box}body,html{height:100%;margin:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fdfafb;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;overflow-x:hidden}body::-webkit-scrollbar{width:.5rem}body::-webkit-scrollbar-track{background:#faebd7}body::-webkit-scrollbar-thumb{background:#6495ed}h2{color:#1e90ff}h5,h6{margin:.5rem}ul{margin:0;padding:0}li,ul{list-style-type:none}li{display:inline-block;font-weight:bolder;margin:.1rem;padding:.1rem}a{color:#1e90ff;cursor:pointer;margin:.2rem;text-decoration:none}a:hover{color:#125fad}button{background-color:#6495ed;border:none;color:#fff;cursor:pointer;font-weight:700;padding:.43rem .5rem;text-transform:uppercase}button:hover{background-color:#3169d0;cursor:pointer}label,option{color:#1e90ff;font-weight:700}nav ul li{cursor:pointer;font-size:clamp(.9rem,2.2vw,1.2rem);font-size:var(--nav-size);font-weight:500;text-transform:capitalize}.App{text-align:center}.app-container{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1 1}#title{font-size:clamp(1.5rem,4vw,2.5rem);font-size:var(--title-size);font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flex-row,.header{align-items:center;display:flex;gap:2rem;justify-content:center}.footer{background-color:#f2f2f2;font-weight:700;padding:1rem 0;text-align:center}#filter{background-size:.6rem;border:2px solid #6495ed;color:#6495ed;font-weight:700;outline:none;padding:.3rem .5rem;transition:border-color .2s ease,box-shadow .2s ease}#filter:focus{border-color:#6495ed}.articleComments,.articles,.singleArticle{align-items:center;display:flex;flex-direction:column;padding:2rem 1rem;width:100%}.articleList,.commentList{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;margin:0 auto;max-width:1200px;width:100%}.flex-col{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:2rem}.flex-col>svg{height:min(10rem,30vw);width:min(10rem,30vw)}.articleCard,.commentCard{background:#fff;border:2px solid #1e90ff;border-radius:.8rem;box-shadow:0 2px 8px rgba(0,0,0,.1);color:inherit;display:flex;flex-direction:column;max-width:22rem;padding:1.5rem;text-align:left;transition:box-shadow .3s ease,-webkit-transform .3s ease;transition:transform .3s ease,box-shadow .3s ease;transition:transform .3s ease,box-shadow .3s ease,-webkit-transform .3s ease;width:100%}.articleCard{cursor:pointer}.articleCard:hover{box-shadow:0 8px 16px rgba(0,0,0,.15);-webkit-transform:translateY(-5px);transform:translateY(-5px)}.commentCard{border:1px solid #ddd;max-width:20rem}.sort_by{align-items:center;display:flex;justify-content:center;margin:1rem auto}.comment_form{display:flex;flex-direction:column}.articleTopic{align-self:flex-start;background-color:#faebd7;border-radius:50px;font-size:.85rem;margin-bottom:.5rem;padding:.3rem .8rem}.article_card_footer{align-items:baseline;border-top:1px solid #eee;display:flex;justify-content:flex-start;margin-top:1rem;padding-top:.5rem}.centerArticle{border-bottom:1px solid #000;border-top:1px solid #000;margin:1rem 0;max-width:40rem;text-align:center;text-transform:capitalize;width:100%}.loading-txt{-webkit-animation:blink 1s ease-in-out infinite;animation:blink 1s ease-in-out infinite;color:#6495ed;font-size:2rem;font-weight:700;text-align:center}@-webkit-keyframes blink{0%,to{opacity:1}50%{opacity:.2}}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}@-webkit-keyframes loader-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes loader-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.hidden{display:none}#success{color:#4169e1;font-size:1.5rem;font-weight:700;text-align:center}.no_articles{color:#6495ed;text-align:"center"}.error_message{color:#4169e1;text-align:"center"}@media only screen and (max-width:600px){nav ul li{font-weight:700}a{margin:.1rem}.articleCard,.commentCard{max-width:100%}.flex-row,.header{gap:.1rem}}
/*# sourceMappingURL=main.1d208c61.css.map*/