.pagination-wrapper { background: #fff; position: relative; margin-top: 54px; > div { position: absolute; z-index: 1; left: 0; top: 50%; margin-top: 6 - 1 + px; width: 100%; height: 1px; padding: 0 15px; &:before { content: ''; background: #eaeaea; width: 100%; height: 100%; position: relative; display: block; } } } ul.pagination { z-index: 2; width: auto; position: relative; display: table; margin: 0 auto; background: #fff; margin-bottom: 0; float: none; &:before, &:after { width: 73px; height: 100%; background: #fff; left: -74px; top: 0; content: ''; position: absolute; } &:after { left: auto; right: -74px; } li { float: left; list-style: none; width: auto; height: 38px; border: 1px solid #eaeaea; line-height: 36px; text-align: center; margin: 6px 6px 0 6px; position: relative; z-index: 1; display: block; a { text-decoration: none; color: $main-color; font-size: 14px; font-weight: 300; display: block; height: 100%; //padding: 0 10px; padding: 0 2px; min-width: 36px; } &:active { background: #949494; a { @include Transition(0.05); @include Scale(1.05); } } &.active { background: #eaeaea !important; border: 1px solid #eaeaea !important; box-shadow: none !important; a { cursor: default; @include Scale(1); } } &.prev, &.next { cursor: pointer; width: 38px; background: #fff !important; @include svgIcon(); span, a { font-size: 0; color: #fff; } a { position: absolute; top: 0; left: 0; } &:before { content: ""; background-size: 8px 13px; background: url(../images/ico-breadcrumbs.svg) 0 0 no-repeat; width: 8px; height: 13px; position: absolute; left: 50%; top: 50%; margin-left: -4px; margin-top: -6px; } &.prev:before { background: url(../images/ico-breadcrumbs-left.svg) 0 0 no-repeat; } &.disabled { cursor: default; &:before { color: $border-items; } } } &:hover { @include Shadow2; &.prev, &.next { &:before { color: #4b4b4b; } &.disabled { &:before { color: $border-items; } } } } &:active { &.prev, &.next { &:before { color: #444444; } &.disabled { &:before { color: #969696; } } } } } } @media (max-width: 992px) { } @media (max-width: 767px) { ul.pagination { li { height: 29px; line-height: 27px; margin-left: 3px; margin-right: 3px; a { min-width: 27px; font-size: 13px; } &.prev, &.next { width: 29px; } } } }