body {
}
#game {
/*
	border: 6px solid white;
    
	width: 620px;
	height: 515px;
    */
    border: 1px solid #000000;

	background-color: white;
	float: left;
    position: relative;
    width: 100%;
    margin-right: 0;
    margin-bottom: 5.2rem;
}
table,tr,td {
    margin:0
;    padding:0;
}
#game .td{
    position: relative;
    vertical-align: top;
    display: inline-block;
   /*
    float:left; */
}
#game .tr{
    clear: both;
    text-align: center;
}
#game .table {
    background: #FFF;
    margin: 0 auto;
    /*
    box-shadow: 0 0 8px #666;
    
	width: 620px;
	height: 515px;
   
    width:430px;
    height: 430px; */
    background: url(../img/mahjong-bg.gif) center center no-repeat;
    background-size: 100% 99.99%;
    width: 100%;
}
.game-row:nth-child(3n+3){
    border-bottom:3px solid #000000;
  

}
.game-row:first-child{
    border-top:3px solid #000000;
  

}
#game .table:after{
    content: '';
    display: block;
    height: 0;
    clear: both;
}
.game-row{
    /*outline: 1px solid #000000;*/
}

.cell {
    position: relative;
    color: #B8860B;
    text-align: center;
    font-size: 2.4em;
     outline: 1px solid #3c3c3c;  
    width: 11.111111%;
    padding-bottom: 11.111111%;
    height: 0;
    /*
    width:9.89999%;
    padding-bottom: 9.89999%;*/
    /*
    width: 48px !important;
    height: 48px !important; 
    width: 48px;
    height: 48px; */
 

   /* border: 1px solid lightgray;*/
    position: relative;
   /*
    box-shadow: 0 1px 0 lightgray, 0 -1px 0 lightgray, -1px 0 0 lightgray, 1px 0 0 lightgray;
    */
}
.cell:nth-child(3n+3) {
    border-right: 3px #000000 solid;
}  
.cell:first-child{
    border-left: 3px #000000 solid;
}  
.cell span{
    color: black;
    position: absolute;
    top: 50%;
    bottom: 0;
    left: 0;
    right: 0;
        vertical-align: middle;
    line-height: 0;
}
.cell:not(.game-value){
    cursor: pointer;
}
.cell:not(.game-value):hover {
    background: #EEE;
}
.first-row {
  /*  border-top: 2px solid #000; 
  box-shadow: 0 -2px 0 #000, 0 1px 0 lightgray, -1px 0 0 lightgray, 1px 0 0 lightgray;*/

}
.first-col {
  /*   border-left: 2px solid #000;
 box-shadow: -2px 0 0 #000, 0 -1px 0 lightgray, 1px 0 0 lightgray, 1px 0 0 lightgray; */
}
.mini-right {
 /*border-right: 2px solid #000; 
     box-shadow: 2px 0 0 #000, 0 -1px 0 lightgray, -1px 0 0 lightgray, 0 1px  0 lightgray;*/
}
.mini-bottom {
    /* border-bottom: 2px solid #000; 
 box-shadow: 0 2px 0 #000, 0 -1px 0 lightgray, -1px 0 0 lightgray, 1px 0 0 lightgray;*/
}

/* individual cells */
.cell-selected {
    background-color: #f6ea86;
}
.game-value {
    font-weight: bold;
    cursor: default;
    color: #000;
}
.conflict span {
    color: red;
}
/* timer */
#timer {
}
/* ending dialog */
.ending {
    border: 1px solid black;
    width: 300px;
    height: 150px;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -150px;
    margin-top: -75px;
    background: #f6ea86;
    border-radius: 10px;
    box-shadow: 0 0 10px #000;
    color: white;
    text-align: center;
}
/* input dialog */
.input-dialog, .input-input{
    padding: 0;
    margin: 0;
    /* width: 48px;
    height: 48px; */
    border-radius: 10px;
}

.input-dialog {
    position: absolute;
	background: white;
/*     border: 1px solid blue;
    box-shadow: 0 0 10px #000;
*/
    border: 2px solid #fad211;
    box-shadow: 0 0 6px #F8CE4A;
    opacity: 0.8;
}
.input-input {
  border: none;
    outline: none;
    text-align: center;
   /*   font-size: 24px;*/
    line-height: 48px; /* fucking ie */
    background-color: #f6ea86;

}

/* options */
#options-wrap {
    /*
  background: url("../img/difficulty_bg.png") no-repeat 0 0 transparent;
  height: 45px;
  margin: 14px 0 0 -2px;
  width: 302px;
  */
}
#options-wrap div {
    /*
    margin: 8px 0 0 20px;
	position: absolute;
    */
}

#options-wrap * {
	color: black;
}

#options-wrap select {
	/* width: 190px; 
	margin-left: 10px;*/
}

.button {
    color: #FFF;    
    font-size: 100%;
    text-decoration: none;
    padding: 10px 15px !important;
    margin: 0 5px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: 2px solid #5d8de4;
    cursor: pointer;
    background: #4b75c2; 


    box-shadow: 1px 2px 5px #3a6e62;    
    /* cross b gradient 
    background: -moz-linear-gradient(top, #ccffcc 0%, #3fff3f 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ccffcc), color-stop(100%,#3fff3f)); 
    background: -webkit-linear-gradient(top, #ccffcc 0%,#3fff3f 100%); 
    background: -o-linear-gradient(top, #ccffcc 0%,#3fff3f 100%); 
    background: -ms-linear-gradient(top, #ccffcc 0%,#3fff3f 100%); 
    background: linear-gradient(top, #ccffcc 0%,#3fff3f 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccffcc', endColorstr='#3fff3f',GradientType=0 );     */   
}
.button:hover {
    color: #4b75c2;
    background: lightBlue;
    -webkit-box-shadow: 0 0 2px #666;
    -moz-box-shadow: 0 0 2px #666;
    box-shadow: 0 0 2px #666;
}
.button:active {
    color: #006400;
    border: 1px solid #7FFF7F;
    -webkit-box-shadow: inset 1px 1px 2px #444;
    -moz-box-shadow: inset 1px 1px 2px #444;
    box-shadow: inset 1px 1px 2px #444;
}

.ending *{
    margin: 10px 0;
}
.ending p::last-child{
    margin: 3400px 0 0;
}
@media screen and (max-width: 610px){

}
@media print {
    * {
	background: #FFF;
    }
    #options-wrap, #actions-wrap, #timer, #sc-info  {
	display: none;
    }

}