How to add circle icon to the class="number" ?

You can make it with a border-radius ! If you have a square with a height/width equal to 30px, add 'border-radius: 15px' to the element ! (the value has to be the half of the height/width and it has to be a square !) If your square is white and the body is white too, don't forget to add a 'border: 1px solid black' or you'll not see the circle !

You can see exactly what style was applied in the workspace for the video on fieldsets. It has a lot of declarations, and you can easily modify colours and margins, etc. When things are difficult to figure out, I usually just go back to the provided .css files in workspaces where I saw techniques work for sure:

.number { background-color: #5fcf80; color: #fff; height: 30px; width: 30px; display: inline-block; font-size: 0.8em; margin-right: 4px; line-height: 30px; text-align: center; text-shadow: 0 1px 0 rgba(255,255,255,0.2); border-radius: 100%; }

Thanks, that made sense but something is not right... it is still showing an odd shaped circle.. Can you see any issue in my css?

* {
  box-sizing: border-box;
}

body {
  background: #171717;
  text-align: center;
  color: #e3e3e3;
  font-family: Nunito, Arial, sans-serif;
}

label {
  display: block;
  text-align: left;
}


fieldset {
  border: none;
  border-radius: 7px;
  background: #717171;
  margin: 30px 70px;
}

legend {
  float: left;
  width: 100%;
  padding: 20px;
  font-weight: bold;
}

.number {
  border-radius: 15px;
  width: 30px;
  height: 30px;
  background-color: #b8d130;
  font-size: 1.5em;
  color: #fff;
}