style.css

html, body {
  height: 100%;
}

body {
  display: flex;
  align-items: center;
  justify-content: center;
}

div {
  width: 100px;
  height: 100px;
  border: 1px #ccc dotted;
  margin: 10px;
  border-radius: 50%;
  background-color: #eee;
}

div.blue {
  background-color: blue;
}

div.green {
  background-color: green;
}
/*
need to find the difference between div.green and .green
https://stackoverflow.com/questions/6489110/differences-between-div-class-class-and-class-div
*/

div.cat{
  background-image: url("https://upload.wikimedia.org/wikipedia/commons/3/3c/Creative-Tail-Animal-cat.svg");
}

.invisible {
  display: none;
}

.visible {
  display: block;
  border: 3px black dashed;
  border-radius: 0;
  background-color: white;
}