/// /// Solid State by HTML5 UP /// html5up.net | @ajlkn /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) /// /* Pagination */ ul.pagination { cursor: default; list-style: none; padding-left: 0; li { display: inline-block; padding-left: 0; vertical-align: middle; > .page { @include vendor('transition', ( 'background-color #{_duration(transition)} ease-in-out', 'color #{_duration(transition)} ease-in-out' )); border-bottom: 0; border-radius: _size(border-radius); display: inline-block; height: 1.5em; line-height: 1.5em; margin: 0 0.125em; min-width: 1.5em; padding: 0 0.5em; text-align: center; &:hover { background-color: _palette(border-bg); } &.active { background-color: _palette(accent); } } &:first-child { padding-right: 0.75em; } &:last-child { padding-left: 0.75em; } } @include breakpoint('<=xsmall') { li { &:nth-child(n+2):nth-last-child(n+2) { display: none; } .button { width: 100%; } &:first-child { width: calc(50% - 2px); text-align: left; padding-right: 0.325em; } &:last-child { width: calc(50% - 2px); text-align: right; padding-left: 0.325em; } } } }