body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}html,body,#root{height:100%;background-color:#313338}.layout-container{display:grid;grid-template-columns:1fr minmax(300px,1200px) 1fr;gap:20px;background-color:#313338;color:#fff}.layout-content{grid-column:2}.navigation-component{display:flex;justify-content:space-between;align-items:center;background-color:#2b2d31;grid-column:2;margin-top:20px;border-radius:10px;padding:10px}.navigation-component .nav-left,.navigation-component .nav-right{display:flex;align-items:center}.navigation-component .nav-item{text-align:center;color:#fff;text-decoration:none;padding:5px 10px;border-radius:4px;width:fit-content}.navigation-component .nav-item:hover{background-color:#00529b}.browse-component h1{font-size:38px;margin-bottom:20px}.list-container{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;grid-auto-rows:minmax(100px,auto)}.list-container .list-item-custom{padding:12px;background-color:#2b2d31;border-radius:8px;color:#fff}.list-container .list-item-custom h4{font-size:20px}.list-container .list-item-custom .image-url{max-height:600px;margin-bottom:10px}.list-container .list-item-custom .post-author{color:gray;margin-bottom:10px}.list-container .list-item-custom:hover{background-color:#1e1e1e}.post-details-container .title{font-size:36px;margin-bottom:10px}.post-details-container .image{margin-bottom:10px;max-width:100%;max-height:60rem}.post-details-container .description-label{font-size:24px}.create-account-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;gap:2rem}.create-account-container .form-container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:35%;box-shadow:5px 5px 20px #000000bf;border:2px solid gray;border-radius:4px;padding:2rem}.create-account-container .form-container .form-header{text-align:center;font-size:1.6rem}.create-account-container .form-container .field-container{display:flex;flex-direction:column;width:80%}.create-account-container .form-container .field-container .field-label{color:#fffc;margin-bottom:.5rem}.create-account-container .form-container .field-container .field-label .sub-label{color:#fffc;font-size:12px}.create-account-container .form-container .field-container .field-input{border:2px solid rgba(255,255,255,.2);border-radius:4px;background-color:#2b2d31;padding:.8rem;color:#fff}.create-account-container .form-container .form-submit{width:80%}.create-account-container .form-container .form-submit .submit-button{height:40px;width:100%;border:none;border-radius:4px;background-color:#66339980;color:#fff}.create-account-container .form-container .form-submit .submit-button:hover{background-color:#639;cursor:pointer}.create-account-container .form-container .form-footer{width:80%;text-align:center;color:#fff6}.create-account-container .form-container .form-footer a{text-decoration:none;color:#fff}.create-post-container .form-container{display:flex;flex-direction:column;align-items:center}.create-post-container .form-container .form-header{text-align:center;font-size:1.6rem}.create-post-container .form-container .field-container{display:flex;flex-direction:column;width:80%;margin:1rem}.create-post-container .form-container .field-container .field-label{color:#fffc;margin-bottom:.5rem}.create-post-container .form-container .field-container .field-label .sub-label{font-size:12px;color:#fff9}.create-post-container .form-container .field-container .field-input{border:2px solid rgba(255,255,255,.2);border-radius:4px;background-color:#2b2d31cc;padding:.8rem;color:#fff}.sign-in-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;gap:2rem}.sign-in-container .form-container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:35%;box-shadow:5px 5px 20px #000000bf;border:2px solid gray;border-radius:4px;padding:2rem}.sign-in-container .form-container .form-header{text-align:center;font-size:1.6rem}.sign-in-container .form-container .field-container{display:flex;flex-direction:column;width:80%}.sign-in-container .form-container .field-container .field-label{color:#fffc;margin-bottom:.5rem}.sign-in-container .form-container .field-container .field-input{border:2px solid rgba(255,255,255,.2);border-radius:4px;background-color:#2b2d31;padding:.8rem;color:#fff}.sign-in-container .form-container .field-container .field-input--error{border-color:red}.sign-in-container .form-container .field-container .field-input-error-text{color:#f00c;text-align:right;margin-top:.5rem}.sign-in-container .form-container .form-submit{width:80%}.sign-in-container .form-container .form-submit .submit-button{height:40px;width:100%;border:none;border-radius:4px;background-color:#66339980;color:#fff}.sign-in-container .form-container .form-submit .submit-button:hover{background-color:#639;cursor:pointer}.sign-in-container .form-container .form-footer{width:80%;text-align:center;color:#fff6}.sign-in-container .form-container .form-footer a{text-decoration:none;color:#fff}
