/* The container */ .paginator-links { text-align: center; padding: 2em; } /* Text components */ .paginator-links .start-ellipsis::before, .paginator-links .end-ellipsis::before { content: '...'; } .paginator-links .seperator::before { content: ','; } .paginator-links .first-page::before { content: 'First'; } .paginator-links .previous-page::before { content: 'Previous'; } .paginator-links .next-page::before { content: 'Next'; } .paginator-links .last-page::before { content: 'Last'; } /* The actual buttons */ .paginator-links .numbers {} .paginator-links .first-page::before, .paginator-links .previous-page::before, .paginator-links .next-page::before, .paginator-links .last-page::before, .paginator-links .number { border-radius: 1em; background-color: rgba(0, 200, 0, 0.5); margin: 0.5em; padding: 1em; } .paginator-links a { text-decoration: none; } .paginator-links a:link { color: rgb(255, 0, 0); } .paginator-links a:visited { color: rgb(0, 255, 0); } .paginator-links .number.current { background-color: rgba(0, 220, 0, 0.7); font-weight: bold; }