Dotted border - evenly spaced dots

Question

I'm trying (and failing) to produce a circle with completely evenly spaced dots on the border. Making a nicely rounded dotted border is no problem. But the dots don't quite space out just right. I've tried many different combinations of div sizes, dot (border) sizes, radius sizes, etc. There's always those two dots at the top that aren't spaced evenly.

html,
body {
  height: 100%;
  width: 100%;
  position: fixed;
  background-color: #000;
}

.vertz {
  position: relative;
  margin: 0px;
  padding: 0px;
  padding-left: -10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.horz {
  width: 300px;
  height: 300px;
  font-weight: bold;
  margin: auto;
}

.shadow {
  box-shadow: 0px 0px 10px #888888;
  -moz-box-shadow: 0px 0px 10px #888888;
  -webkit-box-shadow: 0px 0px 10px #888888;
  -o-box-shadow: 0px 0px 10px #888888;
}

.dots {
  border: rgba(3, 79, 132, 0.75) dotted 5px;
  border-radius: 200px;
  -moz-border-radius: 200px;
  -webkit-border-radius: 200px;
  -o-border-radius: 200px;
}

<div class="vertz horz dots"></div>