Have different texts on the Featured Pages Buttons

Have different texts on the Featured Pages Buttons

I have read the article regarding changing the buttons. However this article show an example for only three buttons.

I have added additional code form the example, however when pasted into the CSS, it still only effects three buttons and not the eight.
Any Ideas?
Deird
Heres the code

.fp-one .btn.btn-primary.fp-button:after {
content:”Bicycles”; /* Change to required text */
}
.fp-two .btn.btn-primary.fp-button:after {
content:”Services”; /* Change to required text */
}
.fp-three .btn.btn-primary.fp-button:after {
content:”Parts”; /* Change to required text */
}
.fp-four .btn.btn-primary.fp-button:after {
content:”Accessories”; /* Change to required text */
}
.fp-five .btn.btn-primary.fp-button:after {
content:”Rentals”; /* Change to required text */
}
.fp-six .btn.btn-primary.fp-button:after {
content:”Events”; /* Change to required text */
}
.fp-seven .btn.btn-primary.fp-button:after {
content:”Rentals”; /* Change to required text */
}
.fp-eight .btn.btn-primary.fp-button:after {
content:”Events”; /* Change to required text */
}