universe@10: /*
universe@10:  * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS HEADER.
universe@10:  * 
universe@24:  * Copyright 2018 Mike Becker. All rights reserved.
universe@10:  * 
universe@10:  * Redistribution and use in source and binary forms, with or without
universe@10:  * modification, are permitted provided that the following conditions are met:
universe@10:  *
universe@10:  *   1. Redistributions of source code must retain the above copyright
universe@10:  *      notice, this list of conditions and the following disclaimer.
universe@10:  *
universe@10:  *   2. Redistributions in binary form must reproduce the above copyright
universe@10:  *      notice, this list of conditions and the following disclaimer in the
universe@10:  *      documentation and/or other materials provided with the distribution.
universe@10:  *
universe@10:  * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
universe@10:  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
universe@10:  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
universe@10:  * ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
universe@10:  * LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
universe@10:  * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
universe@10:  * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
universe@10:  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
universe@10:  * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
universe@10:  * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
universe@10:  * POSSIBILITY OF SUCH DAMAGE.
universe@10:  * 
universe@10:  */
universe@10: 
universe@10: html {
universe@47:     font-family: sans-serif;
universe@52:     font-size: 11pt;
universe@47:     background: white;
universe@47:     color: #1c204e;
universe@47:     margin: 0;
universe@47:     padding: 0;
universe@10: }
universe@10: 
universe@10: body {
universe@47:     height: 100%;
universe@47:     margin: 0;
universe@47:     padding: 0;
universe@26: }
universe@26: 
universe@10: a {
universe@11:     color: #3060f8;
universe@10:     text-decoration: none;
universe@10: }
universe@10: 
universe@96: #mainMenu {
universe@98:     position: fixed;
universe@98:     z-index: 2;
universe@10:     width: 100%;
universe@10:     display: flex;
universe@10:     flex-flow: row wrap;
universe@45:     border-image-source: linear-gradient(to right, #606060, rgba(60, 60, 60, .25));
universe@45:     border-image-slice: 1;
universe@45:     border-bottom-style: solid;
universe@45:     border-bottom-width: 1pt;
universe@45: }
universe@98: 
universe@96: #sideMenu {
universe@96:     display: flex;
universe@98:     z-index: 1;
universe@96:     flex-flow: column;
universe@96:     position: fixed;
universe@96:     height: 100%;
universe@124:     width: 40ch; /* adjust with sidebar-spacing.margin-left */
universe@98:     padding-top: 2.25rem;
universe@109:     color: #3060f8;
universe@96:     border-image-source: linear-gradient(to bottom, #606060, rgba(60, 60, 60, .25));
universe@96:     border-image-slice: 1;
universe@96:     border-right-style: solid;
universe@96:     border-right-width: 1pt;
universe@96: }
universe@96: 
universe@96: #content-area.sidebar-spacing {
universe@124:     margin-left: 40ch; /* adjust with sideMenu.width */
universe@96: }
universe@45: 
universe@45: #mainMenu {
universe@98:     font-size: 1.2rem;
universe@45:     background: #e0e0e5;
universe@10: }
universe@10: 
universe@96: #sideMenu {
universe@10:     background: #f7f7ff;
universe@97:     overflow-x: scroll;
universe@10: }
universe@10: 
universe@96: #mainMenu .menuEntry {
universe@10:     padding: .25em 1em .25em 1em;
universe@28:     border-right-style: solid;
universe@28:     border-right-width: 1pt;
universe@28:     border-right-color: #9095a1;
universe@10: }
universe@10: 
universe@97: #sideMenu .menuEntry {
universe@97:     padding-top: .25em;
universe@97:     padding-bottom: .25em;
universe@97:     border-bottom-style: solid;
universe@97:     border-bottom-width: 1pt;
universe@97:     border-bottom-color: #d7d7df;
universe@97: }
universe@97: 
universe@10: #mainMenu .menuEntry[data-active] {
universe@45:     background: #d0d0d5;
universe@10: }
universe@10: 
universe@96: #sideMenu .menuEntry[data-active] {
universe@10:     background: #e7e7ef
universe@10: }
universe@10: 
universe@97: #sideMenu .level-0 {
universe@97:     padding-left: .25em;
universe@97: }
universe@97: 
universe@97: #sideMenu .level-1 {
universe@97:     padding-left: .75em;
universe@97: }
universe@97: 
universe@97: #sideMenu .level-2 {
universe@97:     padding-left: 2em;
universe@97: }
universe@97: 
universe@10: #content-area {
universe@98:     padding: 2.75rem 1em 1em;
universe@10: }
universe@23: 
universe@47: button, a.button {
universe@47:     display: inline-block;
universe@47:     font-size: medium;
universe@103:     border-style: solid;
universe@103:     border-width: 1pt;
universe@103:     border-color: #606060;
universe@47:     color: inherit;
universe@47:     background: #f0f0f0;
universe@47: 
universe@47:     padding: .25em .5em .25em .5em;
universe@47:     cursor: default;
universe@47:     text-decoration: none;
universe@47: }
universe@47: 
universe@47: button:hover, a.button:hover {
universe@47:     background: #f0f0ff;
universe@47: }
universe@47: 
universe@146: button[type=submit], a.button.submit {
universe@47:     background: #20a0ff;
universe@47:     color: white;
universe@47: }
universe@47: 
universe@146: button[type=submit]:hover, a.button.submit:hover {
universe@47:     background: #1090cf;
universe@47: }
universe@47: 
universe@26: th {
universe@26:     text-align: left;
universe@26: }
universe@26: 
universe@26: table.datatable {
universe@23:     border-style: solid;
universe@23:     border-width: 1pt;
universe@80:     border-color: silver;
universe@23:     border-collapse: collapse;
universe@23: }
universe@23: 
universe@26: table.datatable th {
universe@47:     white-space: nowrap;
universe@23:     font-weight: bold;
universe@103:     background: #f7f7ff;
universe@23: }
universe@23: 
universe@26: table.datatable th, table.datatable td {
universe@23:     border-style: solid;
universe@23:     border-width: 1pt;
universe@103:     border-color: lightgray;
universe@23:     padding: .4em;
universe@23: }
universe@23: 
universe@26: table.datatable tr:nth-child(2n) {
universe@103:     background: #faffff;
universe@23: }
universe@26: 
universe@47: table.formtable {
universe@47:     border-style: none;
universe@47:     border-collapse: separate;
universe@47:     border-spacing: 1em;
universe@47: }
universe@47: 
universe@47: table.formtable th {
universe@47:     font-weight: bold;
universe@47:     text-align: left;
universe@47:     vertical-align: center;
universe@47:     white-space: nowrap;
universe@47: }
universe@47: 
universe@47: table.formtable tbody td > * {
universe@47:     width: 100%;
universe@124:     box-sizing: border-box;
universe@47: }
universe@47: 
universe@75: table.formtable input[type=date] {
universe@75:     width: auto;
universe@75: }
universe@75: 
universe@47: table.formtable tfoot td {
universe@47:     text-align: right;
universe@47: }
universe@47: 
universe@47: .fullwidth {
universe@47:     width: 100%;
universe@47: }
universe@47: 
universe@47: .vtop {
universe@47:     vertical-align: top;
universe@47: }
universe@47: 
universe@26: .hcenter {
universe@26:     text-align: center;
universe@26: }
universe@26: 
universe@80: .hright {
universe@80:     text-align: right;
universe@80: }
universe@80: 
universe@26: .smalltext {
universe@26:     font-size: smaller;
universe@26: }
universe@26: 
universe@26: .nowrap {
universe@26:     white-space: nowrap;
universe@47: }
universe@47: 
universe@47: .medskip {
universe@47:     margin-top: .5em;
universe@47: }
universe@47: 
universe@101: .info-box, .error-box, .warn-box {
universe@47:     margin: 2em;
universe@47:     border-style: dashed;
universe@47:     border-width: 1pt;
universe@47:     border-color: deepskyblue;
universe@47:     padding: 1em;
universe@101: }
universe@101: 
universe@101: .error-box {
universe@101:     border-color: red;
universe@101: }
universe@101: 
universe@101: .warn-box {
universe@101:     border-color: gold;
universe@101: }
universe@101: 
universe@101: .table {
universe@101:     display: table;
universe@101:     border-spacing: .5em;
universe@101:     margin: -.5em;
universe@101: }
universe@101: 
universe@101: .row {
universe@101:     display: table-row;
universe@101: }
universe@101: 
universe@101: .caption {
universe@101:     font-weight: bold;
universe@101: }
universe@101: 
universe@101: .row > div {
universe@101:     display: table-cell;
universe@101: }
universe@162: 
universe@162: /* MARKDOWN STYLES */
universe@162: 
universe@162: div.markdown-styled p:first-child {
universe@162:     margin-top: 0;
universe@162: }
universe@162: 
universe@162: div.markdown-styled table {
universe@162:     border-collapse: collapse;
universe@162: }
universe@162: 
universe@162: div.markdown-styled td,
universe@162: div.markdown-styled th {
universe@162:     padding: 0.25em;
universe@162:     border-style: solid;
universe@162:     border-color: darkgray;
universe@162:     border-width: 1pt;
universe@162: }