header{width:100%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgb(199,190,190);height:78px;padding-left:20px;background-color:#191e3d;color:#fff}.header-container{display:flex;align-items:center}.header-wrapper{background-color:#ac1919;border:1px solid rgb(184,100,100);color:#fff;margin-right:8px;padding-left:4px;padding-right:4px}.header-welcome{margin:0}.menu-icon{display:none}.nav{display:flex;justify-content:space-evenly}.nav-item{margin-left:30px;align-self:center;font-size:x-large;color:#fff;text-decoration:none}.nav-account{display:flex;flex-direction:column;margin-left:20px}.nav-account-img{font-size:large;margin-left:10px;border-radius:50%;background-color:#fff;border:4px solid white;color:#fff}.nav-item:hover{border-bottom:2px solid rgb(185,41,41);padding-top:7px}.nav-account:hover{border:none}.nav-account-img:hover{border:2px solid red}.nav-log-in{font-size:small;color:#f4a460;text-decoration:none}#home{margin:20px}.home-welcome{text-align:center;font-weight:700;font-size:24px;background-color:#ffdab9;padding:10px;color:#ac1919}.sidebar{position:absolute;top:78px;left:-250px;width:250px;height:100%;background-color:#191e3d;transition:left .3s ease;overflow-y:auto}.sidebar.active{left:0}.sidebar-nav{list-style-type:none;padding:0}.sidebar-nav li a:hover{color:#b54b4b}.sidebar-nav li{padding:20px;border-bottom:1px solid rgb(214,172,172);font-weight:700;font-size:18px;color:#fff}.sidebar-nav li a{color:#fff;text-decoration:none}.sidebar-account-icon{font-size:large;margin-left:10px;border-radius:50%;background-color:#fff;border:4px solid white;color:#fff}.sidebar-log-in{font-size:16px;color:#f4a460}.sidebar-account-icon:hover{border:3px solid rgb(181,75,75);padding:2px}.hide-link{display:none}.main{margin:10px;padding-bottom:50px;overflow:scroll;height:calc(100vh - 4rem);font-family:Gill Sans,Gill Sans MT,Calibri,Trebuchet MS,sans-serif}#article-page{display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:auto}.spinner-icon{position:absolute;top:50%;left:45%;right:30%}.articles-sorted-heading{font-size:24px;font-weight:700;color:#ac1919;background-color:#ffdab9;width:100%;text-align:center;padding:10px}.not-articles-sorted-heading{display:none}.sort-articles{display:flex;flex-wrap:wrap;font-size:20px;margin-top:10px;color:#20207e;font-weight:700}.sort-articles-item{padding-right:6px}.sort-section{margin:20px}#sort_by{border:1px solid black;border-radius:16px;width:fit-content;height:25px;font-weight:700;font-size:16px;font-weight:500;text-align:center}#order_by{border-radius:16px;width:fit-content;height:25px;font-size:16px;font-weight:500}.second-word-formatting{padding:6px}.articles-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-evenly;margin-top:30px;margin-bottom:30px;height:100%;width:100%;overflow-y:auto}.article{display:flex;flex-direction:column;flex-wrap:no-wrap;height:600px;width:400px;background-color:#314790;box-shadow:2px 2px 2px 2px #756f6f;margin:20px;padding:5px;border-radius:5px}.article-img{height:500px;width:100%;border-radius:20px}.article-title{font-size:20px;font-weight:700}.article-item{padding:6px;color:#fff}.article-info{align-self:flex-end}.article-sub-section{display:flex;align-items:center;align-self:flex-end;width:100px}.article-sort-section{display:flex;align-items:center;justify-content:space-evenly;padding-top:10px;margin-top:10px;border-top:1px solid rgb(180,170,170);width:100%}.article-votes{font-size:18px;font-weight:700;margin-left:8px}.article-rating-icon{color:#e49e61;font-size:x-large}.article-comment-icon{color:#f4a460;font-size:x-large}.article-comment-count{font-size:17px;margin-left:8px;color:#fff;font-weight:700}.article-timestamp{font-size:14px;font-weight:700;color:#fff}.article-topic-wrapper{color:#c5ff95}.article-author{font-style:italic;color:#c5ff95}.article-heading:hover{color:#4cd892}#topics-page{display:flex;flex-direction:column;align-items:center;overflow:scroll;width:100%}.topic-header{font-weight:800;font-size:x-large;margin-top:30px}.topics-container{margin-top:8%;display:flex;flex-wrap:wrap;width:fit-content;align-items:center;padding:10px;justify-content:center}.topic-container{display:flex;flex-wrap:no-wrap;flex-direction:column;color:#fff;height:200px;width:200px;margin:40px;background-color:#3f508a;border-radius:20%;align-items:center;justify-content:space-evenly}.topic-item{font-size:18px;margin:10px}.topic-title{font-size:x-large;color:#c5ff95}.topic-button{padding:5px 15px;background-color:#5debd7;border:1px solid #C5FF95;box-shadow:1px 1px 1px 1px #c5ff95;cursor:pointer;border-radius:20px}.topic-button:hover{background-color:#e3a1a1}#users-page{display:flex;flex-direction:column;flex-wrap:wrap;align-items:center;justify-content:space-evenly;overflow:scroll}.user-paragraph{font-size:18px;font-weight:600;margin-top:10px;padding-top:10px}.users{display:flex;align-items:flex-start;justify-content:center;flex-wrap:wrap;margin-top:30px;width:100%;padding:10px}.user{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;height:300px;width:250px;margin:40px;color:#fff;background-color:#3f508a;border-radius:20px}.user-name{font-size:24px}.user-username{font-size:18px}.user-img{height:100px;width:100px;background-color:#fff;border:4px solid white;border-radius:40%}.username{color:#f4a460}.user-log-in-button{height:40px;width:65px;font-weight:700;padding:5px 15px;background-color:#5debd7;border:1px solid #C5FF95;box-shadow:1px 1px 1px 1px #c5ff95;cursor:pointer;border-radius:20px}.user-log-in-button:hover{background-color:#e3a1a1}.single-article-container{display:flex;flex-direction:column;align-items:flex-start;margin:10px}.single-article-title{margin-top:20px;color:#3f508a}.single-article-img{height:700px;width:100%;align-self:center}.article-end-section{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-around}.author-name{color:#ba6b27;font-weight:700;margin-left:5px}.divider{margin-right:5px;font-weight:700}.article-end-section-item{margin:3px}.vote-section{display:flex;flex-direction:column;align-items:flex-start}.vote{display:flex;flex-direction:row;align-items:center;margin-top:20px;margin-bottom:20px;background-color:#3f508a;padding:10px;border-radius:10px}.vote-section-item{margin-left:10px;margin-right:10px}.vote-count{font-size:large;font-weight:700;padding:10px;color:#fff}.button-vote{background-color:#fff;border:3px solid rgb(63,80,138);color:#3f508a;border-radius:10px;padding:4px}.up-vote:hover{background-color:#fff;color:#00a6ff}.down-vote:hover{background-color:#fff;color:red}.comments-button{display:flex;align-items:center;background-color:#3f508a;color:#fff;font-size:16px;font-weight:700;padding:10px;margin-bottom:20px;border-radius:10px}.comments-button:hover{background-color:#5debd7;color:#314483;font-size:18px}.comments-section-container{display:flex;flex-direction:column;align-items:center;border:3px solid rgb(63,80,138);border-radius:10px;margin-bottom:20px;padding-bottom:20px;width:100%;overflow:scroll}.new-comment-box{display:flex;flex-direction:column;align-items:center;width:100%}.comment-add-button{background-color:#1242e2;color:#fff;font-size:medium;align-self:flex-start;margin:20px;padding:10px;border-radius:10px}#form-submit{display:flex;flex-direction:column;align-items:center;width:100%}.comment-items{margin-bottom:10px}.comment-box{padding-left:10px;font-size:large;width:96%;justify-self:flex-start;height:200px;background-color:#f4a460;border:2px solid rgb(216,75,75);border-radius:20px}.comment-submit{background-color:#1242e2;font-size:18px;font-weight:700;color:#fff;border:2px solid black;align-self:flex-end;margin-right:3%;margin-top:20px;height:40px;width:100px;border-radius:5px}.comment-submit:hover{background-color:#53b453;color:#000}.comments-container{display:flex;flex-direction:column;align-items:flex-start;margin:5px;padding:9px;background-color:#3f508a;opacity:.85;width:96%;color:#fff;border-radius:10px;font-size:20px}.comment-item{margin-top:10px}.comment-vote-section{display:flex;align-items:flex-start;justify-content:space-between;width:100%}.comment-vote{display:flex;flex-direction:row;align-items:center;justify-content:space-around;padding:10px;border-radius:10px;border:1px solid rgb(44,44,208);background-color:#1242e2}.vote-section-item{margin-right:5px}.comment-time-stamp{align-self:flex-end;font-size:medium;font-style:italic}.comment-author{font-size:large;color:#f4a460}.delete-button{width:"fit-content";padding:10px;font-size:16px;border:1px solid blue;box-shadow:1px 1px 1px 1px #415477;background-color:#1242e2;color:#fff;border-radius:20px}.delete-button:hover{background-color:#b85252;border:1px solid rgb(189,30,30);box-shadow:1px 1px 1px 1px #bd1e1e}.delete-button:disabled{background-color:gray;color:#bbb6b6;border:1px solid grey;box-shadow:1px 1px 1px 1px gray}.red{color:red;font-size:18px}.blue{color:#00f;font-size:18px;font-weight:400}.error-page{position:absolute;top:40%;left:45%}.error-paragraph{font-size:18px;color:#c73a3a}@media (max-width: 768px){.menu-icon{display:block}.nav{display:none}.header-welcome{display:block;margin-left:calc(100vw - 16rem)}.sidebar{width:50%;left:-100%;z-index:1}.sidebar.active{left:0}.single-article-img{height:30%}.comments-section-container{display:flex;flex-direction:column;align-items:center;border:3px solid rgb(63,80,138);border-radius:10px;margin-bottom:20px;height:fit-content;width:100%;overflow:visible;z-index:9}}*{box-sizing:border-box;font-family:serif;margin:0;overflow:hidden}