*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 标题 */
h1{
  text-align: center;
  font-size: 48px;
  font-weight: 400;
  margin: 40px auto 20px auto;
}

/* 游戏难度选择 */
.level{
  text-align: center;
  margin-bottom: 20px;
}
.level button{
  padding: 10px 20px;
  border-radius: 2px;
  outline: none;
  border: none;
  margin: 0 10px;
  cursor: pointer;
}
.level button.active{
  background-color: #00abff;
}

/* 提示信息 */
.info{
  text-align: center;
  font-weight: 200;
  margin: 10px auto;
}

/* 表格样式 */

table{
  background: #929196;
  margin: 0 auto;
  border-spacing:1px ;
}
table td{
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-weight: bold;
  background-color: #ccc;
  border: 2px solid ;
  border-color:#fff #a1a1a1 #a1a1a1  #fff;
  cursor: pointer;
}

td>div{
  width: 100%;
  height: 100%;
}
/* 显示地雷 */
td>div.mine{
  background: #ccc url("../img/mine.png") center/cover no-repeat;
  opacity: 0;
}
/* 显示旗 */
td>div.flag{
  background: #ccc url("../img/flag.png") center/cover no-repeat;
  opacity:1;
}

td>div.error{
  background-color: rgb(216,0,0);
}

td>div.right{
  background-color: green;
}


/* 不同数字对应的颜色 */
td>div.zero{
  border-color: #d9d9d9;
  background: #d9d9d9;
}

td>div.one{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #0332fe;
}

td>div.tow{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #ff2600;
}
td>div.three{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #ff2600 ;
}
td>div.four{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #9320BF;
}

td>div.five{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #ff7f29;
}

td>div.six{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #ff3fff;
}

td>div.seven{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #3fffbf;
}

td>div.eight{
  border-color: #d9d9d9;
  background: #d9d9d9;
  color: #22ee0f;
}