.controls {
  margin-bottom: 25px;
}

.controls .btn {
  min-width: 45px;
}

.cells table {
  border-style: solid;
  border-width: 1px;
}
.cells td {
  width: 20px;
  height: 20px;
}

.cells td.alive {
  background-color: black;
}

.cells td.dead {
  background-color: white;
}

.cells {
  margin-bottom: 25px;
}

@keyframes fadeIn {
  0% {
    transform: scale(0.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}

.cells .alive {
  animation-duration: 0.05s;
  animation-name: fadeIn;
}

.dimensions input.form-control {
  width: 80px;
}

.dimensions input[type='range'] {
  min-width: 200px;
  height: 22px;
}

.dimensions .speed p.form-control-static {
  min-width: 28px;
  text-align: right;
}



.controls {
  margin-bottom: 25px;
}

.controls .btn {
  min-width: 45px;
}

.controls .play {
  min-width: 85px;
}

.controls .pause {
  min-width: 85px;
}

.cells table {
  border-style: solid;
  border-width: 1px;
}
.cells td {
  width: 20px;
  height: 20px;
}

.cells td.alive {
  background-color: black;
}

.cells td.dead {
  background-color: white;
}

.cells {
  margin-bottom: 25px;
}

@keyframes fadeIn {
  0% {
    transform: scale(0.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}

.cells .alive {
  animation-duration: 0.05s;
  animation-name: fadeIn;
}

.dimensions input.form-control {
  width: 80px;
}

.dimensions input[type='range'] {
  min-width: 200px;
  height: 22px;
}

.dimensions .speed p.form-control-static {
  min-width: 28px;
  text-align: right;
}



Make play/pause always have the same size
Make play/pause always have the same size
