html, body, header, nav, h1, a,
ul, li, strong, main, button, i,
section, img, div, h2, h3, p, form,
fieldset, label, input, textarea,
span, article, footer, time, small,table, tr, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font: inherit;
  color: inherit;
  text-align: inherit;
  text-decoration: inherit;
  vertical-align: inherit;
  box-sizing: inherit;
  background: transparent;
  font-family: 'Open Sans', sans-serif;
}
a:hover{
  cursor: pointer;
}
ul{
  list-style: none;
}
body {
    background-image: url("assets/art/bg.jpg");
    background-color: #cccccc;
}
div{
  margin: 0;
  padding: 0;
}
canvas{
  padding: 0;
  margin: auto;
  display: block;
  width: 1200px;
  cursor: pointer;;
}
/*.grabbing{
  cursor: -webkit-grabbing;
}*/

.score-show{
  display: flex;
}
.logo{
  width: 100%;
  position: relative;
}
.logo h1{
  font-family: 'Bungee Shade', cursive;
  .font-weight: bolder;
  margin: auto;
  font-size: 40px;
  text-align: center;
  margin-top: 10px;color: white;
}
.modal-box{
  position: absolute;
  width: 100%;
  height: 600px;
  top: 103px;
  left: 0;
}
.modal{
  padding: 50px;
  margin: auto;
  display: block;
  width: 1200px;
  box-sizing: border-box;
}
.modal p{
  font-size: 24px;
  text-align: center;
  line-height: 2;
  padding-top: 100px;
}
.button{
  font-weight: bolder;
  font-size: 32px;
   
  padding: 10px 10px 10px 17px;
  letter-spacing: .1em;
  border-radius: 1px;
  cursor: pointer;
  background-color: #FF5722;
  color: white;
  display: table;
  margin: auto;
  transition: background-color 0.5s ease;
  border-radius: 15px;
}
.small{
  padding: 15px;
  font-size: 18px;
  display: inline-block;;
  border: none;
  font-weight: normal;
}
.button:hover{
  background-color: #e63700;
  transition: background-color 0.5s ease;
}
.hidden{
  display: none;
}
.score{
  position: absolute;
  padding: 5px;
  border-radius: 1px;
  left: calc(50% - 59px);
  top: 85px;
  z-index: 3;
  font-size: 32px;color: white;
}
strong{
  font-weight: bolder;
  font-size:42px;
  color: #009688;
}
.score-header{
  font-weight: bolder;
  font-size: 24px;
}
td{
  padding-right:15px;
  padding-left:15px;
  padding-top:2px;
  font-weight:bold;
  color: black;
  font-size: 20px;
}
tr{
  text-align: center;
}

.score-detail {
  color: #009688;
  float: left;
  width: 50%;
  text-align: center;
}
.score-list{
  padding-top: 15px;
  margin: auto;
}
.score-detail input{
  font-size: 18px;
  color: black;
  background-color: white;
  padding: 5px;
  width: 115px;
  margin-bottom: 10px;
}
.heading{
  font-size: 28px;
  font-weight: bolder;
}
#score{
  color: black;
  font-size: 72px;
}
#restart{
  position: absolute;
  bottom: 0;
  left: calc(50% - 64px);
}
#running-score{
  color: #009688;
  font-size: 32px;
  /*display: block;
  clear: both;*/
  text-align: center;
}
#start-modal{
  z-index: 3;
}
#restart-modal{
  z-index: 3;

}