﻿#game {
    position: absolute;
    left: 0;
    right: 0;
    /*margin-right: auto;
    margin-left: auto;*/
    height: 1015px;
    width: 1800px;
    overflow: hidden;
    display: none;
}

#gameCardsLeft {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 680px;
    width: 315px;
    overflow-x: hidden;
    overflow-y: auto;
    /*background-color: azure;*/
}

#gameCardsRight {
    position: absolute;
    top: 0px;
    left: 320px;
    height: 680px;
    width: 315px;
    overflow-x: hidden;
    overflow-y: auto;
    /*background-color: aquamarine;*/
}

.cardContainer {
    width: 300px;
    height: 40px;
    overflow: hidden;
    float: left;
    /*display: none;*/
}

    .cardContainer:hover {
        width: 300px;
        height: 252px;
        float: left;
    }

#gameControlPanel {
    position: absolute;
    top: 405px;
    left: 640px;
    height: 275px;
    width: 865px;
    overflow: hidden;
    /*background-color: blueviolet;*/
}

.gameStatsButtonsDiv {
    position: absolute;
    top: 210px;
    left: 0px;
    width: 865px;
    height: 63px;
    overflow: hidden;
    text-align: center;
}

.gameStatsGeneralDiv {
    position: absolute;
    top: 66px;
    left: 0px;
    width: 865px;
    height: 63px;
    overflow: hidden;
}

.gameStatsSpecialDiv {
    position: absolute;
    top: 135px;
    left: 0px;
    width: 865px;
    height: 63px;
    overflow: hidden;
}

.gameStatsSepcialButtonDiv {
    position: absolute;
    top: 220px;
    left: 0px;
    width: 865px;
    height: 63px;
    overflow: hidden;
    display: none;
}

.gameStatsActivePlayers {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 865px;
    height: 63px;
    overflow: hidden;
}

/*#gameMinorControlPanel {
    position: absolute;
    width: 290px;
    height: 295px;
    top: 385px;
    left: 1510px;
    overflow: hidden;
    background-color: coral;
}*/

#gameHand {
    position: absolute;
    top: 685px;
    left: 00px;
    height: 275px;
    width: 1520px;
    overflow-y: auto;
    overflow-x: hidden;
    /*background-color: chocolate;*/
}

.gameHandContainer {
    width: 300px;
    float: left;
}

#gameMessages {
    position: absolute;
    top: 0px;
    left: 640px;
    height: 400px;
    width: 865px;
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 20px;
    /*background-color: darkblue;*/
}

/* "Fill Seats with AI" call-to-action shown over the game message log while a PvP game waits for
 * players (created on demand by showFillWithAI; the Dominion twin of #mFillWithAIButton).  Centered
 * on #gameMessages (640 + (865-320)/2 = 912); big and dashed so it reads as a placeholder action,
 * not part of the log.  Fixed dark background + gold text stays readable on both page themes. */
#fillWithAIButton {
    position: absolute;
    top: 150px;
    left: 912px;
    width: 320px;
    height: 100px;
    font-size: 24px;
    line-height: 28px;
    white-space: normal;
    cursor: pointer;
    border: 2px dashed #999;
    border-radius: 8px;
    background: rgba(20, 20, 20, 0.85);
    color: #FFD75E;
    font-weight: bold;
    z-index: 5;
}

#fillWithAIButton:disabled {
    opacity: 0.5;
    cursor: default;
}

#gameChat {
    position: absolute;
    top: 0px;
    left: 1510px;
    height: 680px;
    width: 290px;
    overflow: hidden;
    /*background-color: darkslateblue;*/
}

#gameChatInput {
    margin-top: 5px;
    width: 200px;
    display: inline-block;
}

#gameChatSend {
    width: 70px;
    /*margin-left: 5px;*/
}

#gameChatMessages {
    overflow-x: hidden;
    overflow-y: auto;
    width: 290px;
    height: 650px;
    font-size: 19px;
}

#gameOptions {
    position: absolute;
    top: 685px;
    left: 1525px;
    height: 275px;
    width: 275px;
    overflow-x: hidden;
    overflow-y: auto;
    /*background-color: cornflowerblue;*/
    text-align: center;
    font-size: 20px;
}

#tempGameMessage {
    font-weight: bolder;
    font-size: 22px;
}

.gameStatsDivContainer {
    float: left;
    width: 150px;
    height: 130px;
    overflow: hidden;
}

.gameStatDiv {
    height: 60px;
    line-height: 50px;
    width: 205px;
    overflow: hidden;
    float: left;
    margin-left: 5px;
}

.statIcon {
    width: 55px;
    display: inline-block;
    vertical-align: middle;
}

.gameStat {
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
    font-size: 35px;
}

.gameSpecialStatDiv {
    height: 60px;
    line-height: 50px;
    width: 160px;
    overflow: hidden;
    float: left;
    margin-left: 10px;
}

.gameStatTreasureDiv {
    height: 60px;
    line-height: 50px;
    width: 230px;
    overflow: hidden;
    float: left;
    margin-left: 5px;
}

.gameStatsPlayers {
    float: left;
    width: 410px;
    height: 90px;
    font-size: 20px;
    text-align: center;
}

.gameStatsButtons {
    width: 430px;
    height: 40px;
    float: left;
    overflow: hidden;
}

.gameButton {
    font-size: 33px;
    float: left;
    width: 199px;
    height: 60px;
    margin-bottom: 15px;
    margin-left: 15px;
}

.gameStatsData {
    display: inline-block;
    float: left;
    height: 63px;
    line-height: 40px;
    vertical-align: middle;
    font-size: 30px;
    width: 635px;
    overflow: hidden;
}

/*#gameSettingsButton {
    width: 150px;
    margin-left: 0px;
}*/

.endOfGameStats {
    height: 340px;
    float: left;
    overflow-x: hidden;
    overflow-y: auto;
}

.gameActivePlayersTitle {
    display: inline-block;
    font-size: 34px;
    height: 63px;
    width: 225px;
    float: left;
    line-height: 40px;
    vertical-align: middle;
    margin-left: 5px;
}

.optionButton {
    width: 265px;
    height: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 20px;
}

#gameExtraStats {
    width: 1800px;
    height: 50px;
    position: absolute;
    top: 965px;
}

.gameExtraStatDiv {
    display: inline-block;
    float: left;
    width: 200px;
    height: 45px;
    margin-right: 20px;
    margin-left: 5px;
    margin-top: 5px;
    /*background-color: limegreen;*/
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    font-size: 25px;
    line-height: 35px;
}

#moreStatsButton{
    visibility: hidden;
}

#moreStatsCloseButton{
    visibility: hidden;
}
