@charset "UTF-8";
body {
    background: MediumPurple;
    font-family: Helvetica, Arial, sans-serif;
    font-size: .875rem;
    scroll-behavior: smooth;
}

main {
    display: block;
    position: relative;
    max-width: 60rem;
    margin: auto;
    padding: .25rem 1rem .25rem 1rem;
    min-height: 100%;
    background: white;
    text-align: left;
}
*.wide {
    max-width: 80rem;
}
p {
    background: transparent;
    margin: 0 0 0.5em 0;
}
/* p:last-of-type { margin-bottom: 0em; }*/

h1 {
    font-size: 1.2rem;
    text-align: center;
}
.appName {
    font-size: 1.2rem;
    font-weight: bold;
}

th,td {
    padding: .2rem;
    font-size: .875rem;
}

table {
	border-collapse: collapse; /* necessary for rows to be borderable */
	/* see https://stackoverflow.com/questions/18679020/border-around-tr-element-doesnt-show#18679047 */
}
table tr,table th {
	border-style: solid;
	border-width: 1px;
	border-color: silver;
}

footer,nav {
    display: block;
    position: relative;
    max-width: 60rem;
    margin: auto;
    padding: .25rem 1rem .25rem 1rem;
    background: LightGray;
    text-align: center;           
}

*.form {
    margin: 0 .5em 0 .5em;
    border-width: .5em; 
    border-color: gray;
}
input {
    padding: .0625rem;
}
input.readonly {
    border-width: 0em; 
}
input.right {
    padding: .0625rem;
    text-align: right;
}

label {
    display: inline-block;
    min-width: 8em;
    vertical-align: top;
}





*.center{
    text-align: center;
}
*.right {
    text-align: right;
}

*.msg {
    margin: 1em 0 1em 0;
    font-weight: bold;
}
*.errorMsg {
    margin: 1em 0 1em 0;
    color: red;
    font-weight: bold;
}
*.hide {
    display: none;
}
*.options {
    display:inline-block;
    margin: .375em;
    padding: .25em;
    border-style: dotted;
    border-width: .1em;
    border-color: green;
}

ul {
    display: block;
    margin: .25em auto;
}
li.navItem {
            display:inline-block;
            min-width: 6em;
            border-style: double;
            border-width: .33em;
            border-color: green;
            background: White;
            padding: .25em;
}
li.soon {
            display:inline-block;
            min-width: 6em;
            border-style: double;
            border-width: .33em;
            border-color: DarkGray;
            background: LightGray;
            padding: .25em;
}
li.hide {
            display:hide;
            min-width: 6em;
            border-style: double;
            border-width: .33em;
            border-color: DarkGray;
            background: LightGray;
            padding: .25em;
}