body {
background-color: black;
}
th, td, tr, h1, h2, h3, p, li {
color: white;
}
th {
text-align: left;
}
h3, h2, h1, p {
margin: 0;
}
a {
color: white;
}
button {
background-color: #313131;
border: 0 none transparent;
padding: 8px;
color: white;
}
code {
color: white;
padding: 4px;
background-color: black;
}
label {
color: white;
}
#map {
height: 100%;
width: 100%;
}
.event-table-row:nth-child(odd) {
background-color: #312e2e;
}
@media (hover: hover) {
button:hover {
background-color: #003fc5;
}
}
.inactive-tab {
color: white;
float: left;
border: 0 none transparent;
outline: none;
cursor: pointer;
padding: 14px 16px;
font-size: 17px;
background-color: inherit;
}
.active-tab {
color: white;
float: left;
border: 0 none transparent;
outline: none;
cursor: pointer;
padding: 14px 16px;
font-size: 17px;
background-color: #171718;
}
.input-panel-active {
display: flex;
flex-direction: column;
align-items: center;
align-content: center;
justify-content: center;
height: 50vh;
width: 50vh;
margin-bottom: 12px;
}
.input-panel-inactive {
display: flex;
flex-direction: column;
align-items: center;
align-content: center;
justify-content: center;
height: 50vh;
width: 50vh;
margin-bottom: 12px;
}
@media screen and (max-width: 800px) {
.input-panel-inactive {
display: none;
}
.input-panel-active {
width: 100%;
justify-content: center;
}
#settings-button {
position: absolute;
top: 16px;
left: 16px;
padding: 8px;
border-radius: 8px;
}
}
@media screen and (min-width: 800px) {
.small-screens-only {
display: none;
}
.input-panel {
display: block;
}
}
.event-table-row {
height: 50px;
border: 0 none transparent;
background-color: inherit;
color: white;
&:hover {
background-color: #00abff;
color: black;
}
}
.state-table {
width: 100%;
border-collapse: collapse;
}
.state-table-row {
height: 50px;
opacity: 0.85;
&:hover {
opacity: 1.0;
}
}