:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#58b8f0de;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}h2{padding:10px;width:100%}h3{padding:3px;width:100%;text-align:left}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#ec9017;cursor:pointer;transition:border-color .25s;margin:20px}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}*{margin:0;padding:0;box-sizing:border-box}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}header{position:flex;place-items:top;top:0;width:100%;text-align:center;border:solid blue 2px;padding:10px}footer{position:flex;place-items:bottom;bottom:0;width:100%;text-align:center;border:solid blue 2px;margin-top:50px;padding:10px}#nav-bar{padding-left:0;list-style-type:none;padding-inline-start:0;border:solid blue 2px}#nav-bar li{display:inline;padding:10px}.Welcome{padding:10px;width:100%}.All-Artilces{width:100%}.Articles-Filter{border:solid rgb(80,255,74) 2px;padding:10px;width:100%;margin-top:10px}.Article-List{width:100%;padding:10px;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.Article-List-Item{list-style-type:none;border:solid rgb(80,255,74) 2px;width:100%;padding:10px}.Article-List-Item img{height:10rem}.Article-List-Item p{padding-left:25px;padding-right:25px}.Single-Article{list-style-type:none;border:solid red 2px;margin-top:10px;margin-bottom:10px;width:100%}.Single-Article p,.Single-Article h3{text-align:justify;padding:10px;margin-left:10px;margin-right:10px}.Single-Article img{padding:20px 10px 10px}.Article-Comments{border:solid lightblue 3px}#Comment-Title{text-align:left;padding:10px}.Article-Comments ul{padding-inline-start:0;padding-left:20px;padding-right:20px}.Article-Comments li{list-style-type:none;border:solid lime 2px;margin-top:10px;margin-bottom:10px;width:100%}.Article-Comments button{margin:10px}.Article-Comments p{margin:10px;text-align:justify}.Article-Comments h4{margin:10px}.new-comment{display:grid;border:solid red 2px;padding:10px}.new-comment label{font-size:large}.new-comment input{height:50px}.posted{margin-top:10px}.Article-New-Comment{border:solid blue 2px;padding-inline-start:0;padding-left:20px;padding-right:20px}.Article-New-Comments li{list-style-type:none;border:solid lime 2px;margin-top:10px;margin-bottom:10px;width:100%}.User{display:grid;grid-template-columns:200px auto;grid-template-rows:50px minmax(160px,auto) auto;grid-template-areas:"header header" "leftbar main" "footer footer";column-gap:20px;row-gap:20px}.User h3{text-align:center;border:solid purple 2px;grid-area:header;margin:auto}.User li{list-style-type:none;border:solid purple 2px;margin-bottom:10px;width:100%;padding:10px;grid-area:main}.User img{width:200px;grid-area:leftbar}
