h1 {
    font-size: 28pt;
    text-align: center;
    margin: 0px;
    color: #0000ff;
}

#selected-game {
    font-size: 20px;
    text-align: center;
    margin: 10px;
    color: #0000ff;
}

/* Admin interface */

.tabs {
    min-width: 950px;
}

.row {
    border: 1px #333 solid;
    padding: 5px; 
    margin: 4px;
    font-family: Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 800;
}

.currentstep {
    background-color: #6f6;
}

.value {
    padding: 0px 5px;
    display: table-cell;
    vertical-align: middle;
}

.edit  {
    padding: 0px 5px
    vertical-align: middle;
    display: table-cell;
    text-align: right;
}

/* Games tab */

.gamerow, .premisesrow, .questionrow, .teamrow {
    background-color: #eef;
    min-width: 500px;
}

.gamec-id, .premisesc-id, .locationc-id, .questionc-id,
.answerc-id, .teamc-id, .questionc-locationid, .questionc-premisesid,
.teamlocationc-lid, .teamlocationc-qid, .scorec-id {
    border-bottom: 4px solid #777;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 4px solid #777;
    border-radius: 10px;
    background-color: #bbf;
    padding: 3px 5px 0px 5px;
    text-align: center;
    font-size: 12px;
    min-width: 5em;
    width: 5em;
    font-family: 'Courier New', monospace;
}

.gamec-name, .premisesc-name, .locationc-name, .teamc-name,
.teamlocationsc-lname {
    width: 100%;
}

.questionc-locationname, .questionc-premisesname {
    width: 33%;
}

.gamec-edit {
    min-width: 20em;
}

/* Premises tab */

.premisesc-type {
    min-width: 7em;
    text-align: left;
}

.premisesc-edit {
    min-width: 20em;
    text-align: right;
}

/* questions tab */

.questionc-skipscore {
    min-width: 10em;
    width: 10em;
    text-align: right;
}

.questionc-edit {
    min-width: 18em;
    text-align: right;
}

/* Locations table */

.locationtableinner, .answertableinner, .questiontableinner,
.teamlocationtableinner {
    border: 2px #333 solid;
    margin: 10px;
    font-family: Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 800;
    background-color: #ddf;
    min-width: 780px;
}

.gamebuttons, .premisesbuttons, .locationbuttons,
.questionbuttons, .answerbuttons {
    /* border-bottom: 2px #333 solid; */o
    padding: 5px;
    text-align: right;
    display: table-cell;
    min-width: 20em;
}

.teambuttons {
    padding: 5px;
    text-align: right;
    display: table-cell;
    width: 100%;
}

.teamcnt {
    font-family: Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 800;
    min-width: 10em;
}

.gamecnt, .premisescnt, .locationcnt, .questioncnt, .answercnt, .scorecnt {
    width: 100%;
    font-family: Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 800;
}

.locationrow, .answerrow {
    background-color: #aaf;
    min-width: 760px;
    margin: 5px 30px;
}

.locationc-type, .answerc-score {
    min-width: 7em;
    text-align: left;
}

.answerc-score {
    width: 100%;
}

.locationc-edit, .answerc-edit {
    min-width: 20em;
    text-align: right;
}

.html-container-table {
    margin: 4px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    display: table;
}

.html-container-row {
    display: table-row;
}

.answerc-answer {
    background-color: #eee;
}

.questionc-question, .locationc-description, .teamlocationc-teamlocation {
    background-color: #fff;
}

.html-container-cell {
    border-bottom: 5px solid #777;
    border-top: 2px solid black;
    border-left: 2px solid black;
    border-right: 5px solid #777;
    border-radius: 10px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    min-width: 500px;
    width: 500px;
    padding: 30px;
    font-family: Helvetica, sans-serif;
    font-size: 24px;
}

.html-preview {
    background-color: #fff;
    padding: 10px 5px 10px 5px;
    display: inline-block;
    /* padding: 30px;
    display: table-cell; */

    min-height: 300px;
    border-bottom: 5px solid #777;
    border-top: 2px solid black;
    border-left: 2px solid black;
    border-right: 5px solid #777;
    border-radius: 10px;
    text-align: center;
    vertical-align: middle;
    min-width: 500px;
    width: 500px;
    font-family: Helvetica, sans-serif;
    font-size: 24px;
    font-weight: 800;
}

.locationr-description, .answerr-answer {
}

.locationc-description, .answerc-answer {
}

#location-qrcode, #team-qrcode {
    text-align: center;
    vertical-align: middle;
    width: 300px;
    height: 300px;
}

.qrcode-page {
    display: table-cell;
    width: 500px;
    height: 500px;
    text-align: center;
    vertical-align: middle;
}

.qrcode-content {
    min-width: 254;
    width: 100%;
    text-align: center;
}

.qrcode-name {
    font-size: 32px;
    font-weight: 800;
    text-align: center;
}

.qrcode-img {
    text-align: center;
}

.qrcode-lid, .qrcode-tid {
    text-align: center;
}

/* Teams tab */

.teamc-phase, .teamc-score, .teamlocationsc-step  {
    min-width: 5em;
    text-align: left;
}

.teamc-edit {
    min-width: 32em;
    text-align: right;
}

/* Scores tab */
.scoretable {
    display: table;
    border: 1px #333 solid;
    width: 90%;
}

.scorerow:nth-child(odd) {
    background-color: #ffe;
}

.scorerow:nth-child(even) {
    background-color: #ddf;
}

.scorehrow {
    background-color: #aae;
    display: table-row;
    border: 1px #333 solid;
}

.scorerow {
    display: table-row;
}

.scorec-num, .scorec-name, .scorec-phase, .scorec-score,
.scorec-location {
    padding: 5px 10px;
}

.scorec-phase, .scorec-score, .scorec-location {
    border-left: 1px #333 solid;
}

.scoreh-num, .scoreh-id, .scoreh-name, .scoreh-phase, .scoreh-score,
.scoreh-location {
    border: 1px #333 solid;
    padding: 5px 10px;
}

/* Player pages */

/* Container for whole page, set defaults */
.pagecontent {
    font-family: Helvetica, sans-serif;
    font-size: 24pt;
}

/* Team info */
.plteamdiv {
    border-bottom: 4px solid #777;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 4px solid #777;
    border-radius: 10px;
    background-color: #eef;
    padding: 20px 20px;
    text-align: center;
    width: 90%;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    font-weight: 800;
    font-size: 24pt;
}

.plteamnamediv, .plphasediv, .plleftdiv {
    display: block;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
}

.plteamlabel, .plphaselabel, .plleftlabel,
.plteamname, .plphase, .plleft {
    display: table-cell;
}

.plteamlabel, .plphaselabel, .plleftlabel {
    width: 4em;
    padding-right: 1em;
    text-align: right;
}

.plbuttons {
    float: right;
    text-align: right;
}

.plskip {
    padding-top: 10px;
}

.plreport {
    padding-top: 10px;
}

.bad-score {
    background-color: #fbb !important;
}

.good-score {
    background-color: #bfb !important;
}

.plnext {
    width: 100%;
}

.plnextdescriptiontext {
    width: 100%;
}

.plnexttype {
    border-bottom: 4px solid #777;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 4px solid #777;
    border-radius: 10px;
    background-color: #eef;
    padding: 20px 20px;
    text-align: center;
    width: 90%;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    font-weight: 800;
    width: 90%;
}

.planswerr-answer:hover {
    background-color: #888;
}

.planswerr-answer {
    background-color: #eee;
}

.planswerrow {
/*    background-color: #aaf;
    min-width: 760px; */
    padding: 20px;
    margin: 5px 5px;
}

/* Search filters */
.search-row {
    margin: 3px;
    padding: 3px;
    font-size: 20px;
    display: table-cell;
    min-width: 12em;
}

/* QR code reader. */
#reader {
    font-size: 50px;
}

#html5-qrcode-button-camera-permission,
#html5-qrcode-button-camera-stop,
#html5-qrcode-button-camera-start,
#html5-qrcode-select-camera {
    font-size: 40pt;
}

/* error window */
.errorwindow {
    border-bottom: 4px solid #777;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 4px solid #777;
    border-radius: 10px;
    background-color: #fdd;
    padding: 20px 20px;
    text-align: center;
    font-size: 24px;
    width: 80%;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}

/* Dialogs */
.no-close .ui-dialog-titlebar-close {
    display: none;
}

.errormsg {
    color: red;
}

.addline, .editline, .pleditline {
    margin: 2px;
}

.addheader, .editheader, .pleditheader {
    display: inline-block;
    width: 8em;
    text-align: right;
    font-weight: 800;
}

.addfield, .editheader, .pleditheader {
    text-align: left;
}

#eventsmessage {
    margin: 10px;
}

.error-item {
    padding: 10px;
    background-color: #fdd;
    width: 30em;
}

#eventsmessage .error {
    color: red;
    padding: 10px;
}

#time {
    float: right;
    font-size: 36px;
    font-weight: 800;
    text-align: right;
    border: 1px black solid;
    padding: 4px;
    margin: 0px 30px 10px 20px;
}