body{
  /*background:#eee;*/
  background:url("/images/games/four-in-a-row/Stars-and-Teacakes.png") 58% 82% no-repeat #ee1b2e;
  /*background-size: contain;*/
  background-color:#ee1b2e;
}

h1{
  text-align:center;
  margin-bottom:5px;
}

#game-base{
  /*width:640px;*/
  width:100%;
  margin:0 auto;
  padding:60px 0px 150px 0px;
}

#game-table{
  width:434px;
  height:374px;
  margin:0 auto;
  /*background:url("/images/four-in-a-row.png") 50% 40% no-repeat;*/
  background:url("/images/games/four-in-a-row/game-base.png") 46% 44% no-repeat;
  background-size:117%;
  position:relative;
}

.disc{
  position:absolute;
  z-index:-1;
  top:-55px;
  left:14px;
  /*width:46px;
  height:46px;*/
  width:50px; height:50px;
  border-radius:46px;
  transition:all .3s;
}

.disc.red{
  /*background:#d96666;*/
  background-image:url("/images/games/four-in-a-row/milk.png");
  background-size: 50px 50px;
}

.disc.yellow{
  /*background:#ffeb79;*/
   background-image:url("/images/games/four-in-a-row/dark.png");
   background-size: 50px 50px;
}

#game-popup {
    width:300px; background-color:White; padding:30px 12px 12px 12px; position:absolute; 
    top:45%; left:50%; margin-left:-150px; display:none; z-index:99999;
    -webkit-box-shadow: 4px 4px 2px 0px rgba(50, 50, 50, 0.3);
    -moz-box-shadow:    4px 4px 2px 0px rgba(50, 50, 50, 0.3);
    box-shadow:         4px 4px 2px 0px rgba(50, 50, 50, 0.3);
}
    #game-popup-close {color:#ee1b2e; float:right; font-weight:800; margin-top:-25px; font-size:1em;}
    #game-popup-close:hover {cursor:pointer;}
    #game-popup-info {
        display:block; background-color:#ee1b2e; color:White;
        font-family:franklin-gothic-urw-cond,sans-serif;
        font-size:2em; text-transform:uppercase; font-weight:800;  padding:30px 20px 10px;
    }
    #game-popup-info::before {
        width:46px; height:46px; display:block; background-image:url("/images/games/four-in-a-row/winner-star.png");
        background-size:46px;
        position:absolute; left:50%; margin:-55px 0px 0px -23px; content:""; z-index:999999;
    }
    #game-play-again {
        border:none;                display:inline-block;           font-weight:800;
        text-transform:uppercase;   color:#ee1b2e;                  position:relative;
        background:url(/Images/button3.png) no-repeat;              padding:14px 30px 30px 20px;
        background-size:100%;
        min-width:100px;            font-size:0.6em;                clear:both;
        height: 53px;
    }
    #game-play-again:hover {
        text-decoration:none; background:url(/Images/button3.png) bottom no-repeat;
        padding:14px 30px 30px 20px; background-size:100%; cursor:pointer;        
    }





@media(max-width:768px){

    body{
        background-size: contain;
    }


    #game-base {
        min-height:400px;
        width:320px;
    }

    #game-table {
        width:320px;
        left:50%;
        margin-left:-160px;
        bottom:0px;
        position:absolute;
        background-size:contain;
        background-position:0px 7px;

    }

    .disc {
        background-size:cover !important;
        width: 30px;
        height: 30px;
        background-repeat: no-repeat;
    }

}