/*--------------------------------------------------------------
   Pagination
--------------------------------------------------------------*/

.megaphone-pagination {
	position: relative;
	clear: both;
	text-align: center;
	width: 100%;
	line-height: 27px;
	margin: 0 auto;

	@include mq('sm') {
		margin: 0 auto;
		min-height: 40px;
	}

	@include mq('md') {
		margin: get-gutter-width('md') auto get-gutter-width('md');
		min-height: 40px;
	}

	@include mq('lg') {
		margin: 75px auto 15px;
	}
}

.megaphone-pagination a {
	margin-top: 0;
}

.nav-links {
	position: relative;
	font-size: 0 !important;
	padding-top: 0;

	@include mq('md') {
		padding-top: 0;
	}
}

.prev-next.nav-links {
	display: flex;
	justify-content: space-between;
}
.megaphone-pagination .page-numbers.current{
	border-radius: 50%;
}
.megaphone-pagination .page-numbers,
.megaphone-pagination .page-numbers.current {
	padding: 0;
}

.megaphone-load-more a,
.megaphone-pagination a.next,
.megaphone-pagination a.prev,
.megaphone-infinite-scroll a {
	margin: 0;
	position: relative;
}

.megaphone-pagination .page-numbers,
.megaphone-link-pages a,
.megaphone-link-pages span {
	height: 40px;
	width: 40px;
	line-height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 5px;
}

.page-numbers.dots {
	padding-top: 5px;
	font-size: 1.2rem;
	max-width: 30px;
	font-family: initial;
}

.megaphone-pagination a.next {
	right: 0;
}

.megaphone-pagination a.prev {
	left: 0;
}

.megaphone-pagination a.prev,
.megaphone-pagination a.next {
	position: absolute;
	top: 0;
	width: auto;
	min-width: 135px;

	@include mq('lg') {
		min-width: 200px;
	}
}

.megaphone-pagination .next a,
.megaphone-pagination .prev a,
.megaphone-pagination a.next,
.megaphone-pagination a.prev {
	display: flex;
	align-items: center;
	line-height: 1;
}

.megaphone-pagination .next a:after,
.megaphone-pagination .prev a:before,
.megaphone-pagination a.next:after,
.megaphone-pagination a.prev:before {
	font-size: 1.8rem;
	font-family: "megaphone-font";
}

.megaphone-pagination .next a:after,
.megaphone-pagination a.next:after {
	content: "\e903";
	margin-left: 2px;
	margin-right: -9px;
}

.megaphone-pagination .prev a:before,
.megaphone-pagination a.prev:before {
	content: "\e902";
	margin-right: 2px;
	margin-left: -9px;
}

.megaphone-loader {
	width: 64px;
	height: 47px;
	position: absolute;
	margin-left: -33px;
	top: 0;
	left: 50%;
	opacity: 0;
	z-index: 0;
	pointer-events: none;
}

.megaphone-loader-active .megaphone-loader {
	opacity: 1;
	z-index: 1;
}

.megaphone-loader-active a {
	opacity: 0;
}

.megaphone-pagination .load-more a {
	position: relative;
	z-index: 2;
}

.megaphone-ellipsis {
	display: inline-block;
	position: relative;
	width: 64px;
	height: 47px;
}

.megaphone-ellipsis div {
	position: absolute;
	top: 10px;
    width: 20px;
    clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%);
    height: 20px;
	animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.megaphone-ellipsis div:nth-child(1) {
	left: 6px;
	animation: megaphone-ellipsis1 0.4s infinite;
}

.megaphone-ellipsis div:nth-child(2) {
	left: 6px;
	animation: megaphone-ellipsis2 0.4s infinite;
}

.megaphone-ellipsis div:nth-child(3) {
	left: 26px;
	animation: megaphone-ellipsis2 0.4s infinite;
}

.megaphone-ellipsis div:nth-child(4) {
	left: 45px;
	animation: megaphone-ellipsis3 0.4s infinite;
}

@keyframes megaphone-ellipsis1 {
	0% {
		transform: scale(0);
	}

	100% {
		transform: scale(1);
	}
}

@keyframes megaphone-ellipsis3 {
	0% {
		transform: scale(1);
	}

	100% {
		transform: scale(0);
	}
}

@keyframes megaphone-ellipsis2 {
	0% {
		transform: translate(0, 0);
	}

	100% {
		transform: translate(19px, 0);
	}
}

.megaphone-link-pages {
	text-align: left;
	margin-bottom: 30px;
}

.megaphone-link-pages a,
.megaphone-link-pages span {
	height: 30px;
	width: 30px;
	display: inline-block;
	vertical-align: top;
	border-radius: 50%;
	line-height: 30px;
	font-size: 14px;
	text-align: center;
}

.megaphone-front-page {
	.megaphone-pagination {
		margin: 0 auto 40px;
		border-top: none;
		padding-top: 10px;
	}
}