button{
  border-radius: 14px;
}


body{
  background: url(galaxy.jpg) no-repeat center center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;}
.container {
  margin: auto;
    width: 500px;
    align-content: center;
  }

  div {
    font-size: 25px;
    text-align: center;
    font-family: 'Roboto Mono', monospace;
  
  }
.twotimer {
    color: white;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #AF0029;
    margin:0 auto;
    width:90%;
    height: auto;
    display: flex;
    justify-content: space-between;
  }
  .timer-section, .record-section {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .timer-title, .record-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 5px;
 
  }

  #timer, #record {
    display: inline-block;
    /* margin-right: 273px; */
    font-size:45px;

  }
  .timer-title ,#timer{
    margin-left: 40px;
  }

  .difficulty, .flags-left, #flags-left{
    color: white;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #AF0029;
  }
  .difficulty{
    margin-top: 2%;
  }
  
  #controls button {
    font-size:20px;
  }
           
.count {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-top: 0%;
}

#new {
  border-radius: 14px;
  padding-top: 16px;
    margin: auto;
    margin-top: 2%;
    width:200px;
    height:35px;
    font-size: 15px;
    text-align:center;
    background-color: white;
}

.diffEasy, .diffMedium, .diffhard{
  margin-top: 2%;
  width: 120px;
  height: 35px;
  font-size: 18px;
}



/* .checked {
    background-color: red;
} */
.back{
  width: 120px;
  height: 45px;
  font-size: 20px;
  margin-right: 35%;
}



.valid {
  height: 40px;
  width: 40px;
  border: 1px solid;
  border-color: darkslategrey;
  box-sizing: border-box;
}
.flagsLeft{
  color: white;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #AF0029;
}

.grid {
  height: 400px;
  width: 400px;
  display: flex;
  flex-wrap: wrap;
  background: url(unnamed.jpg);
  margin-left: 50px;
  margin-top: 20px;
  border: 10px solid #dcd6bc;
  margin-bottom: 10px;
}

.bomb {
  height: 40px;
  width: 40px;
  border: 1px solid;
  /* border-color: red; */
  border-color: darkslategrey;
  /* background-color: orange; */
  box-sizing: border-box;
}  
.checked {
  height: 40px;
  width: 40px;
  border: 1px solid;
  background-color: rgb(243, 196, 136);
  border-color: gray;
  box-sizing: border-box;
}


.one {
  color: cornflowerblue;
}

.two {
  color: green;
}

.three {
  color: red;
}

.four{
  color: darkblue;
}

.five{
  color: darkmagenta;
}

.six{
  color: brown;
}

.seven{
  color: darkgoldenrod;
}

.eight{
  color: black;
}