* {box-sizing:border-box;}

body {
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  max-width: 700px;
  font-family: Times, "Times New Roman", serif;
}

.white {
  color: #FFFFE4;
}

.centered {
  text-align: center;
}

.noTopMargin {
  margin-top: 0;
}

.grey {
  background-color: grey;
  padding: 15px;
}

.bearZone {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-around;
  align-items: center;

  padding: 15px;
}

#chooseBear {
  color: #FFFFE4;
  width: 30%;
}

li {
  padding: 5px;
  margin: 7px 0;
  background-color: #D62828;
}

#allBears {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  width:70%;
}

#bearList {
  list-style-type: none;
  padding-left: 0;
  margin-left: 0;
  text-align: center;
  font-size: 14pt;
}

.bearContainer {
  padding: 5px 25px;
  background-color: #F7A607;

  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

.count {
  font-size: 16pt;
}

.fiveClick {
  background-color: red;
}