@font-face {
    font-family: 'BankGothic';
    src: url('fonts/BankGothic.ttf');
}

@font-face {
    font-family: 'Jura';
    src: url('../fonts/Jura-Bold.ttf');
}

body {
    background-color: #f0f0f0;
    font-family: Jura, Arial, sans-serif;
    /* margin: 0;
    padding: 0; */
}

/* all */
#content {
    background-color: #FFF;
    border: 1px solid #000;
    border-radius: 5px;
}

/* header */
h1 {
    text-align: center;

}

#userControls {
    text-align: center;
}

/* chat */
#chatBox {
    border: 1px solid #000;
    border-radius: 5px;
    margin: 5px;
    background-color: #ccc;
}

#chatContainer {
}

.tabs {
}

.tab {
    cursor: pointer;
    background-color: #FFF;
    border: 1px solid #000;
    border-radius: 5px;
    padding: 10px;
    margin: 5px;
}

#userList {
    padding: 10px;
    background-color: #FFF;
    border: 1px solid #000;
    border-radius: 5px;
    white-space: nowrap;
    margin: 5px;
}

#chatMessages {
    margin: 5px;
}

#chatMessagesContent {
    background-color: #FFF;
    border: 1px solid #000;
    border-radius: 5px;
    padding: 10px;
}

#chatInput {
    margin-top: 5px;
}

#chatInput input {
    padding: 10px;
    border: 1px solid #000;
    border-radius: 5px 0 0 5px;
}

#chatInput button {
    padding: 10px;
    border: 1px solid #000;
    border-radius: 0 5px 5px 0;
    background-color: #333;
    color: white;
    cursor: pointer;
}

/* game list */

#gameList {
    background-color: #aaa;
    border: 1px solid #000;
    border-radius: 5px;
}

.headerRow {
    padding: 5px;
    background-color: #000;
    border-bottom: 1px solid #000;
}

.listRow {
    padding: 5px;
}

.colCell {
    background-color: #FFF;
    padding: 5px;
    border-radius: 5px;
    margin: 5px;
}

.colCellDouble {

}