| html, | |
| body { | |
| background-color: #f8f8f8; | |
| font-family: 'Roboto', 'Noto', sans-serif; | |
| margin: 0; | |
| overflow-x: hidden; | |
| padding: 0; | |
| } | |
| h1 { | |
| font-size: 24; | |
| } | |
| h2 { | |
| font-size: 18; | |
| } | |
| h3 { | |
| font-size: 16; | |
| } | |
| p { | |
| margin: 8px 0px; | |
| } | |
| p, | |
| p a { | |
| font-size: 16; | |
| } | |
| a:link, | |
| a:visited { | |
| color: blue; | |
| text-decoration: none; | |
| } | |
| label { | |
| font-size: 16; | |
| } | |
| .navbar { | |
| align-items: center; | |
| background-color: #4285f4; | |
| display: flex; | |
| height: 50px; | |
| width: 100%; | |
| } | |
| .navbar-title { | |
| color: #f8f8f8; | |
| font-size: 24; | |
| padding-left: 25px; | |
| } | |
| a.login, | |
| a.signout { | |
| color: #f8f8f8; | |
| float: right; | |
| font-size: 16; | |
| margin-left: auto; | |
| padding-right: 25px; | |
| } | |
| .sidenav { | |
| height: 100%; | |
| left: 0; | |
| margin-top: 50px; | |
| overflow-x: hidden; | |
| padding-top: 30px; | |
| position: fixed; | |
| top: 0; | |
| width: 120px; | |
| z-index: 1; | |
| } | |
| .sidenav a { | |
| color: #272727; | |
| display: block; | |
| font-size: 16px; | |
| padding: 0px 8px 8px 26px; | |
| text-decoration: none; | |
| transition: 0.2s; | |
| } | |
| .sidenav a.active { | |
| color: #4285f4; | |
| font-weight: bold; | |
| } | |
| .sidenav a:hover { | |
| color: #3d3d3d; | |
| font-weight: bold; | |
| } | |
| .main { | |
| margin: 30px 25px 0px 155px; | |
| } | |
| .text-content { | |
| margin: auto; | |
| max-width: 725px; | |
| } | |
| .text-content h1 { | |
| margin-bottom: 8px; | |
| } | |
| .text-content h2 { | |
| margin: 20px 0px 8px 0px; | |
| } | |
| .text-content p { | |
| margin: 12px 0px; | |
| } |