html, body {
    height: 100%;
    width: 100%;
    margin: 0;
}

.page-bg {
    background-color: black;

    /*height:900px;*/
    /*width:1600px;*/
}

.container-top {
    display: block;
    background-color: darkgoldenrod;
    height: 16%;
}

.container-body {

    height: calc(100% - 16%);

    max-width: 1318px;
}

.Game {

    background-color: blue;

    height: 100%;
}

.Game > .Scores {

    background-color: darkcyan;

    height: 37%;

    color: white;

    width: 100%;
}

.Game > .Pokers {

    background-color: darkgrey;

    height: 50%;

    position: relative;
}

.Game > .Prompt {
    background-color: darkorchid;
    height: 5%;
    text-align: center;
}

.Game > .FunctionButtons {
    background-color: darkturquoise;
    height: 100%;
    position: relative;
}

.Tables {
}

.Tables > .bottom-buttons {

}

.Scores > .l {
    float: left;
    width: 568px;
    height: 100%;
}

.Scores > .l > .l {

    float: left;

    margin-top: 12%;

    margin-left: 24%;

    font-size: 5.4vh;
}

.Scores > .l > .l :nth-child(1) {

}

.Scores > .l > .l :nth-child(2) {

    margin-top: 31%;
}

.Scores > .l > .r {

    float: right;

    text-align: right;

    margin-right: 8%;

    margin-top: 3%;
}

.Scores > .l > .r :nth-child(1) {

    font-size: 3.8vh;
}

.Scores > .l > .r :nth-child(2) {

    margin-top: 47%;

    font-size: 3.8vh;
}

.Scores > .l > .r :nth-child(3) {

    font-size: 3.8vh;

    margin-top: 37%;
}

.Scores > .l > .r :nth-child(4) {

    font-size: 3.8vh;

    margin-top: 24%;
}

.Scores > .l > .r :nth-child(5) {

    font-size: 3.8vh;

    margin-top: 23%;
}

.Scores > .l > .r :nth-child(6) {

    font-size: 3.8vh;

    margin-top: 21%;
}

.Scores > .r {

    float: left;

    height: 100%;

    width: calc(100% - 568px);
}

.Scores > .r .score-line {

    /* line-height: calc(100%/9); */

    height: calc(100% / 9);

    position: relative;
}

.Scores > .r .placeholder {

    height: 5%;
}

.Scores > .r .box {

    height: 95%;

    font-size: 3.7vh;

    width: 85%;

    letter-spacing: 5px;
}

.Scores > .r .score-line .l {
    float: left;
}

.Scores > .r .score-line .r {
    float: right;
}

.Scores > .r .score-line .text-box {
}

.Pokers > .poker .front {

    z-index: 0;

    position: absolute;

    top: 0;

    width: 100%;

    height: 100%;
}

.Pokers > .poker .front img {
    width: 100%;
    height: 100%;
}

.Pokers > .poker {

    clear: both;

}

.back {

    position: absolute;

    top: 0;

    z-index: 1;
}

.hide {
    display: none;
}

.Pokers > .poker.poker-1 {

    left: 10%;

    top: 0;

    position: absolute;

    height: 84%;

    width: 16.5%;
}

.Pokers > .poker.poker-2 {

    left: 21%;

    top: 14%;

    position: absolute;

    height: 100%;

    height: 84%;

    width: 16.5%;
}

.Pokers > .poker.poker-3 {

    left: 31.5%;

    top: 2%;

    display: inline-block;

    position: absolute;

    height: 100%;

    height: 84%;

    width: 16.5%;
}

.Pokers > .poker.poker-4 {

    left: 42%;

    top: 14%;

    display: inline-block;

    position: absolute;

    height: 100%;

    height: 84%;

    width: 16.5%;
}

.Pokers > .poker.poker-5 {

    left: 52.5%;

    top: 2%;

    display: inline-block;

    position: absolute;

    height: 100%;

    height: 84%;

    width: 16.5%;
}

.Pokers > .poker.poker-6 {

    left: 63.5%;

    top: 14%;

    display: inline-block;

    position: absolute;

    height: 100%;

    height: 84%;

    width: 16.5%;
}

.Pokers > .hint-1 {
    background-color: black;
    height: 41%;
    position: absolute;
    width: 9%;
    left: 22%;
    top: 17%;
    z-index: 1;
    opacity: 0.25;
}

.Pokers > .hint-2 {
    background-color: black;
    height: 41%;
    position: absolute;
    width: 9%;
    left: 82.5%;
    top: 3%;
    opacity: 0.25;
}

.Prompt .box {
    font-size: 3.8vh;
    display: inline-block;
    height: 100%;
    line-height: 100%;
}

.FunctionButtons {

}

.FunctionButtons .fbutton {

    display: inline-block;

    height: 100%;

    font-size: 3vh;
}

.FunctionButtons .fbutton.fbutton-1 {

    position: absolute;

    top: 2%;

    left: 9%;
}

.FunctionButtons .fbutton.fbutton-2 {

    position: absolute;

    top: 2%;

    left: 22%;
}

.FunctionButtons .fbutton.fbutton-3 {

    position: absolute;

    top: 2%;

    left: 32%;
}

.FunctionButtons .fbutton.fbutton-4 {

    position: absolute;

    top: 2%;

    left: 42%;
}

.FunctionButtons .fbutton.fbutton-5 {

    position: absolute;

    top: 2%;

    left: 52%;
}

.FunctionButtons .fbutton.fbutton-6 {

    position: absolute;

    top: 2%;

    left: 67%;
}

.FunctionButtons .fbutton.fbutton-7 {

    position: absolute;

    top: 2%;

    left: 77%;
}

.FunctionButtons .fbutton.fbutton-8 {

    position: absolute;

    top: 2%;

    left: 86%;
}