body {
  background-color: green;
  display: flex;
  flex-direction: column;
  justify-content: center;
}


.content{
  display: flex;
  flex-direction: row;
  justify-content: space-around;

}
h1{
  margin: 0 0 0 0;
  text-align: center;
  font-size:30px;
  text-transform: uppercase;
  font-family: cursive;
}
p{
  margin: 0 0 0 0;
  text-align: center;
  font-size: 20px;
}
td.mis {
    background-image: url("mouse.png");
}

td.repGor{
  background-image: url("rep.png");
}

td.repDol{
  background-image: url("rep.png");
  transform: rotate(180deg);
}

td.repLevo{
  background-image: url("rep.png");
  transform: rotate(270deg);
}

td.repDesno{
  background-image: url("rep.png");
  transform: rotate(90deg);
}




td.glavaDol{
  background-image: url("glava.png");
}
td.glavaGor{
  background-image: url("glava.png");
  transform: rotate(180deg);
}
td.glavaDesno{
  background-image: url("glava.png");
  transform: rotate(270deg);
}
td.glavaLevo{
  background-image: url("glava.png");
  transform: rotate(90deg);
}

td.kaca{
  background-color: #088c34;
}
td.prazno{
  background-color: #8c0811;
}



table{
  border: 2px solid black;
  padding: 0px;
  border-collapse: collapse;
}
td {
  padding: 0px;
  height: 20px;
  width: 20px;
  background-color: #8c0811;

}
tr{
  text-align: center;
  background-color: #8c0811;
}

table#Score{
  font-family: monospace;
  background-color: #FF0066;
  border: 3px solid black;
  padding: 20px;
  width: 500px;
  height:20px;

}

td.Score{
  border: 1px solid black;
  width: 200px;
  height:20px;
  text-align: center;
  background-color: #6CBC41;
}