100% верно 
(пришлось, конечно! попсиховать, прежде, чем я смогла понять, что к чему)
Проблема с отступами решается в селекторе .bordered .
Свойство padding: 5px; добавленное в этот селектор .bordered, увеличивает отступ от текста внутри до границ рамок. Таким образом, отступы встают на место.
li {
margin: 10px;
}
.large-font {
font-size: 20px;
}
.uppercase {
text-transform: uppercase;
}
.bordered {
border: 2px solid #000000;
padding: 5px;
}
.white-colored {
color: white;
}
.dark-background {
background-color: #4470c4;
}
.border-rounded {
border-radius: 10px;
}