|  | html, body, .wrapper { | 
|  | background-color: #121212; | 
|  | color: #FFFFFF; | 
|  | font-family: 'Roboto', sans-serif; | 
|  | margin: 0; | 
|  | padding: 0; | 
|  | border: 0; | 
|  | outline: 0; | 
|  | height: 100%; | 
|  | } | 
|  |  | 
|  | a:link { | 
|  | text-decoration: none; | 
|  | color: #FFFFFF; | 
|  | } | 
|  |  | 
|  | a:visited { | 
|  | color: #FFFFFF; | 
|  | text-decoration: none; | 
|  | } | 
|  |  | 
|  | pre { | 
|  | text-align: left; | 
|  | } | 
|  |  | 
|  | table, th, td { | 
|  | width: 100%; | 
|  | height: 100%; | 
|  | padding: 10px; | 
|  | text-align: left; | 
|  | border: 1px solid #5f6369; | 
|  | border-collapse: collapse; | 
|  | } | 
|  |  | 
|  | .header-text { | 
|  | color: #e8eaee; | 
|  | font-size: 1.5em; | 
|  | padding-right: 1em; | 
|  | } | 
|  |  | 
|  | .header-logo { | 
|  | max-width: 1.5em; | 
|  | max-height: 1.5em; | 
|  | } | 
|  |  | 
|  | .header-search-wrapper { | 
|  | overflow: hidden; | 
|  | } | 
|  |  | 
|  | .header-search { | 
|  | background-color: #121213; | 
|  | border: 1px solid #5f6369; | 
|  | color: #e8eaed; | 
|  | font-size:1em; | 
|  | /* transition: width 0.5s ease-in-out; */ | 
|  | width: 50%; | 
|  | padding: 0.5em; | 
|  | } | 
|  |  | 
|  | .header-search-button { | 
|  | background-color: #121213; | 
|  | border: 1px solid #5f6369; | 
|  | color: #e8eaed; | 
|  | font-size:1em; | 
|  | font-weight: bolder; | 
|  | padding: 0.5em; | 
|  | } | 
|  |  | 
|  | .manifest-button { | 
|  | background-color: #121213; | 
|  | border: 1px solid #e8eaed; | 
|  | color: #e8eaed; | 
|  | font-size:1em; | 
|  | } | 
|  |  | 
|  | .sidebar { | 
|  | background: #3c4045; | 
|  | border-right: 1px solid #5f6369; | 
|  | height: 100%; | 
|  | overflow-x: hidden; | 
|  | overflow-y: auto; | 
|  | padding: 0; | 
|  | position: fixed; | 
|  | width: 20.75em; | 
|  | z-index: 1; | 
|  | } | 
|  |  | 
|  | .sidebar::-webkit-scrollbar { | 
|  | display: none; | 
|  | } | 
|  |  | 
|  | .component-list { | 
|  | background: #3c4043; | 
|  | list-style-type:none; | 
|  | margin: 0; | 
|  | padding: 0; | 
|  | } | 
|  |  | 
|  | .component-list li { | 
|  | margin: 0; | 
|  | padding: 1em; | 
|  | border-bottom: 1px solid #5f6369; | 
|  | } | 
|  |  | 
|  | .graph { | 
|  | position: fixed; | 
|  | margin-left: 20.75em; | 
|  | width:100%; | 
|  | height:100%; | 
|  | } | 
|  |  | 
|  | .map { | 
|  | height:100%; | 
|  | width:100%; | 
|  | } | 
|  |  | 
|  | .search-header-text { | 
|  | color: #e8eaee; | 
|  | font-weight: bold; | 
|  | font-size: 1em; | 
|  | padding-right: 1em; | 
|  | } | 
|  |  | 
|  | .search-results { | 
|  | display: flex; | 
|  | flex-direction: column; | 
|  | flex-flow: column wrap; | 
|  | justify-content: center; | 
|  | padding: 0; | 
|  | list-style: none; | 
|  | margin-top: 20px; | 
|  | margin-bottom: 20px; | 
|  | margin-left: 50px; | 
|  | margin-right: 50px; | 
|  | } | 
|  |  | 
|  | .dashboard { | 
|  | display: flex; | 
|  | flex-flow: row wrap; | 
|  | justify-content: center; | 
|  | padding: 0; | 
|  | list-style: none; | 
|  | margin-top: 20px; | 
|  | margin-bottom: 20px; | 
|  | margin-left: 50px; | 
|  | margin-right: 50px; | 
|  | } | 
|  |  | 
|  | .tile-header { | 
|  | background: #202120; | 
|  | border-bottom: 1px solid #5f6369; | 
|  | border-left: 0px; | 
|  | border-right: 0px; | 
|  | border-top: 0px; | 
|  | margin: 0; | 
|  | padding: 0; | 
|  | width: 100%; | 
|  | text-align: center; | 
|  | padding: 5px; | 
|  | } | 
|  |  | 
|  | .tile-body { | 
|  | padding-bottom: 10px; | 
|  | padding-left: 20px; | 
|  | padding-right: 20px; | 
|  | padding-top: 10px; | 
|  | text-align: center; | 
|  | } | 
|  |  | 
|  | .tile-body-scrollable { | 
|  | overflow: hidden; | 
|  | overflow-y: scroll; | 
|  | max-height: 450px; | 
|  | } | 
|  |  | 
|  | .tile-body-scrollable::-webkit-scrollbar { | 
|  | display: none; | 
|  | } | 
|  |  | 
|  | .tile { | 
|  | background: #3c4045; | 
|  | border-radius: 10px; | 
|  | border: 1px solid #5f6369; | 
|  | margin: 10px; | 
|  | text-overflow: ellipsis; | 
|  | overflow: hidden; | 
|  | white-space: nowrap; | 
|  | width: 25%; | 
|  | } | 
|  |  | 
|  | .tile-header-search { | 
|  | padding: 10px; | 
|  | text-align: left; | 
|  | } | 
|  |  | 
|  |  | 
|  | .tile-content { | 
|  | overflow: hidden; | 
|  | white-space: normal; | 
|  | width: 100%; | 
|  | } | 
|  |  | 
|  | .tile-table { | 
|  | margin-bottom: 10px; | 
|  | } | 
|  |  | 
|  | .tile-table th { | 
|  | background: #202120; | 
|  | } | 
|  |  | 
|  | .tile-table tr:hover { | 
|  | background: #202120; | 
|  | } | 
|  |  | 
|  | .tile-content { | 
|  | text-align: left; | 
|  | white-space: normal; | 
|  | } | 
|  |  | 
|  | .menu { | 
|  | list-style-type: none; | 
|  | list-style-position: inside; | 
|  | margin: 0; | 
|  | padding: 0; | 
|  | margin-top: 10px; | 
|  | margin-bottom: 10px; | 
|  | } | 
|  |  | 
|  | .menu li { | 
|  | margin-bottom: 30px; | 
|  | } | 
|  |  | 
|  | .menu-button { | 
|  | text-decoration: none; | 
|  | background: #3c4045; | 
|  | border: 1px solid #5f6369; | 
|  | border-radius: 10px; | 
|  | color: #e8eaee; | 
|  | font-family: 'Roboto', sans-serif; | 
|  | font-size: 1em; | 
|  | padding: 10px; | 
|  | transition-duration: 0.3s; | 
|  | outline: 0; | 
|  | } | 
|  |  | 
|  | .menu-button:hover { | 
|  | background: #202120; | 
|  | } | 
|  |  | 
|  | .search-stats { | 
|  | margin-left: 15px; | 
|  | } | 
|  |  | 
|  | .nav { | 
|  | background: #3c4045; | 
|  | border-bottom: 1px solid #5f6369; | 
|  | border-left: 0px; | 
|  | border-right: 0px; | 
|  | border-top: 0px; | 
|  | color: #e8eaee; | 
|  | margin: 0; | 
|  | padding: 10px; | 
|  | overflow: hidden; | 
|  | h2 { | 
|  | display: inline; | 
|  | } | 
|  | } |