.pagination {
	@include font-primary-bold;
	color: $color-charcoal1;
	font-size: 0;
	list-style: none;
	margin: 30px 0;
	padding: 0;
	vertical-align: middle;

	li {
		display: inline-block;
		font-size: 16px;
		height: 30px;
		letter-spacing: .8px;
		line-height: 30px;
		width: 35px;
		line-height: 30px;
		text-align: center;

		&.disabled {
			> * {
				cursor: not-allowed;
			}
		}

		&.active {
			> * {
				color: $color-blue5;
			}
		}
	}

	a {
		color: $color-charcoal3;
		transition: color $trans-time $trans-func;

		&:hover,
		&:focus,
		&:active {
			color: $color-blue5;
		}
	}

	i {
		bottom: -1px;
		position: relative;
	}
}