Пробел, закрывающий текст на выделенном элементе

Question

Кто-нибудь знает, как удалить это пустое пространство, которое покрывает значение в моем раскрывающемся меню? Я приложил фотографии, ура.

https://i.stack.imgur.com/VqWg0.png

.radiusdrop {
  background: none;
  border: none;
  padding: 0 50px 0 20px;
  cursor: pointer;
  display: inline-block;
  float: right;
  height: 55px;
  width: 120px;
  outline: none;
  border: none;
  font-size: 20px;
  margin-right: 10px;
  color: gray;
  font-family: 'Quicksand', sans-serif;
  font-weight: 100;
  background-color: #F5F5F5;
}

<select class="radiusdrop" name="radius" id="">
  <option value="2">2km</option>
  <option value="2">5km</option>
  <option value="2">10km</option>
  <option value="2">20km</option>
  <option value="2">50km</option>
  <option value="2">100km</option>
  <option value="2">250km</option>
  <option value="2">500km</option>

</select>