* {
        padding: 0;
        margin:0;
        font-family: Arial, Helvetica, sans-serif;
}

:root {
  --base-font-size: 1.3rem;
  --menu-font-size: 1.5rem;
  --base-header-size: 3rem;
  --base-line-height: 1.3em;
  --header-line-height: 1.5em;
  --background-image: url(../images/background.jpg);
  --header-image: url(../images/milkyway_banner.png);
  --font-light: #cbcbcb;
  --font-header-light: #cbcbcb;
  --font-dark: black;
}

header {
        background-color: #222222;
}

p {
        font-size: var(--base-font-size);
}
h3 {margin: 10pt 10pt;}

.basic-list {
list-style-type: none;
}
.page-title {
        display: inline-block;
        padding: 20pt;
        align-content: center;
        font-size: var(--base-header-size);
        color:var(--font-header-light);
}

.page-title>a {
        text-decoration-line: none;
        font-weight: bolder;
        color:var(--font-header-light);
}
.page-title>a:visited {
        color:var(--font-header-light);
        
}
footer{
        min-height: 10vh;
        padding:10pt;
        bottom:0;
}

footer h2 {
        margin: 10pt 0;
}

.menu-item>a {
        font-size: var(--menu-font-size);
        color: var(--font-light);
        text-decoration: none;
        white-space: nowrap;
}
.menu-item>a:visited {
        color: var(--font-light);
}

.menu-item button {
        font-size: var(--menu-font-size);
        color: var(--font-light);
        white-space: nowrap;
        border: 0;
          border-radius: 0.25rem;
          background: #222222;
          text-decoration: none;
          //padding: 0.25rem 0.5rem;
          //margin: 0.25rem;
          cursor: pointer;
}

.menu-item-spacer {
        flex:2;
}

.centered {
        display:inline-block;
        width:100%;
        text-align: center;
}

footer>h2 {
display: inline-block;
height:100%;
}

footer p {
        font-size: 1rem
}

a.touch-button {
        display: block; 
        width:150pt;
        padding: 10pt 30pt;
        text-align: center;
        background-color: #3cff2e;
        //margin: 50pt auto 20pt auto;
        margin: auto;
        border: 2px solid black;
        border-radius: 5px;
        text-decoration: none; 
        color: black; 
        font-weight: bold
}


.bordered-table {
	width: 100%;
	border-collapse: collapse;
        font-size: var(--table-font-size);
	//word-wrap: break-word;
}

.bordered-table th {
	padding: 5pt 5pt;
	border: 1pt solid rgb(150,150,150);
        background-color: #222222;
        color: var(--font-light);
	word-wrap: break-word;
}
.selectable-row:hover {
        background-color: #c1c1c1;
}
.bordered-table tr>th {
        background-color: #222222;
}

.bordered-table td{
        //height: 10vmin;
        //width: 4vmin;
	padding: 5pt 2pt;
	border: 1pt solid rgb(150,150,150);
        word-wrap: break-word;
}
.td-center {text-align: center}
.td-left {text-align: left}
.td-right {text-align: right}

.simple-table {
        border-collapse: collapse;
}
.simple-table td, .simple-table th {
        border: 1pt solid rgb(150,150,150);
        padding: 2pt 5pt;
}