body {
    background-color: #222;
    color: #888888;
}

button {
    background-color: rgb(40,40,40);
    color: white;
}


button:hover {
    background-color: rgb(100,100,100);
}

button:active {
    background-color: rgb(80,80,80);
}

button.toggled {
    background-color: rgb(220, 220, 220);
    color: black;
}

button[disabled] {
    background-color: rgb(90,90,90);
    color: gray;
}


.menu-options-header {
    color: lightgray;
}

#menuButton {
    color: gray;
    background-color: rgb(50,50,50);
}
#menuButton:hover {
    color: white;
}


#menuFrame {
    position: absolute;
    color: white;
    left: 0;
    top: 0;
    height: 100%;
    background-color: rgb(50,50,50);
    width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    text-align: center;
    opacity: 0;
    z-index: 3;
    transition: .5s ease all;
}

.horizontal-button-bar {
    background-color: rgb(90, 90, 90);
}


.center-connection-box {
    background-color: rgb(60, 60, 60);
    color: white;
}


.logo-subtitle {
    color: deepskyblue;
}

.logo-title {
    color: white;
}


footer a {
    color: deepskyblue;
}



.status-message {
    color: deepskyblue;
}

.toast-message {
    background-color: rgb(50, 50, 50);
    color: white;
}

.modal-prompt {
    background-color: rgb(60, 60, 60);
    color: white;
}

#connectionRelayedIcon {
    background-color: orange;
}

#connectionP2PIcon {
    background-color: green;
}