/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Simple Pagination */
/*-------------------------------------------------------------------------------------------------------------------------------*/
.pagination-one .custom-pagination {display: block;position: relative;}
.pagination-one .custom-pagination ul {position: relative;display: inline-block;margin: 0 auto;text-align: center;font-size: 0;}
.pagination-one .custom-pagination ul li {position: relative;display: inline-block;vertical-align: middle;}
.pagination-one .custom-pagination ul li a {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;color: #282828;border: 1.2px solid #E7E7E7;width: 60px;height: 60px;z-index: 2;position: relative;font-size: 16px;font-weight: 500;line-height: 1.6em;text-transform: uppercase;-o-transition: all 0.3s;transition: all 0.3s;-webkit-transition: all 0.3s;}
.pagination-one .custom-pagination ul li.active a {color: #fff;border-color: #2980b9;background-color: #2980b9;}
/*media*/
@media(min-width: 1200px){
	.pagination-one .custom-pagination ul li a:hover {color: #2980b9;}
	.pagination-one .custom-pagination ul li.active a:hover {color: #fff;}
}
@media(max-width: 767px){
	.pagination-one .custom-pagination ul li a {width: 50px;height: 50px;}
}
@media(max-width: 480px){
	.pagination-one .custom-pagination ul li a {width: 40px;height: 40px;font-size: 14px;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Pagination with Arrows */
/*-------------------------------------------------------------------------------------------------------------------------------*/
.pagination-two .custom-pagination {display: block;position: relative;}
.pagination-two .custom-pagination ul {position: relative;display: inline-block;margin: 0 auto;text-align: center;font-size: 0;}
.pagination-two .custom-pagination ul li {position: relative;display: inline-block;vertical-align: middle;}
.pagination-two .custom-pagination ul li a {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;color: #282828;border: 1.2px solid #E7E7E7;width: 60px;height: 60px;z-index: 2;position: relative;font-size: 16px;font-weight: 500;line-height: 1.6em;text-transform: uppercase;-o-transition: all 0.3s;transition: all 0.3s;-webkit-transition: all 0.3s;}
.pagination-two .custom-pagination ul li.active a {color: #fff;border-color: #2980b9;background-color: #2980b9;}
.pagination-two .custom-pagination ul li.arrow a {display: inline-block;border: 1.2px solid #E7E7E7;font-size: 16px;font-weight: 500;height: 60px;width: 60px;}
.pagination-two .custom-pagination ul li.arrow.disabled a {pointer-events: none;opacity: 0.6;}
.pagination-two .custom-pagination ul li.arrow.left a::before {content: '';position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%) rotate(45deg);-ms-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);width: 10px;height: 10px;border-left: 2px solid #282828;border-bottom: 2px solid #282828;-webkit-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.pagination-two .custom-pagination ul li.arrow.right a::before {content: '';position: absolute;top: 50%;left: 50%;margin-left: -2px;-webkit-transform: translate(-50%,-50%) rotate(45deg);-ms-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);width: 10px;height: 10px;border-right: 2px solid #282828;border-top: 2px solid #282828;-webkit-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
/*media*/
@media(min-width: 1200px){
	.pagination-two .custom-pagination ul li a:hover {color: #2980b9;}
	.pagination-two .custom-pagination ul li.active a:hover {color: #fff;}
	.pagination-two .custom-pagination ul li.arrow.left a:hover::before,
	.pagination-two .custom-pagination ul li.arrow.right a:hover::before {border-color: #2980b9;}
}
@media(max-width: 767px){
	.pagination-two .custom-pagination ul li a {width: 50px;height: 50px;}
	.pagination-two .custom-pagination ul li.arrow a {width: 50px;height: 50px;}
	.pagination-two .custom-pagination ul li.arrow.left a::before,
	.pagination-two .custom-pagination ul li.arrow.right a::before {width: 9px;height: 9px;}
}
@media(max-width: 480px){
	.pagination-two .custom-pagination ul li a {width: 40px;height: 40px;font-size: 14px;}
	.pagination-two .custom-pagination ul li.arrow a {width: 40px;height: 40px;}
}
@media(max-width: 400px){
	.pagination-two .custom-pagination ul li.arrow a {display: none;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Pagination with Dott */
/*-------------------------------------------------------------------------------------------------------------------------------*/
.pagination-tree .custom-pagination {display: block;position: relative;}
.pagination-tree .custom-pagination ul {position: relative;display: inline-block;margin: 0 auto;text-align: center;font-size: 0;}
.pagination-tree .custom-pagination ul li {position: relative;display: inline-block;vertical-align: middle;}
.pagination-tree .custom-pagination ul li a {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;color: #282828;border: 1.2px solid #E7E7E7;width: 60px;height: 60px;z-index: 2;position: relative;font-size: 16px;font-weight: 500;line-height: 1.6em;text-transform: uppercase;-o-transition: all 0.3s;transition: all 0.3s;-webkit-transition: all 0.3s;}
.pagination-tree .custom-pagination ul li.active a {color: #fff;border-color: #2980b9;background-color: #2980b9;}
.pagination-tree .custom-pagination ul li.dott {display: inline-block;color: #282828;border: 1.2px solid #E7E7E7;font-size: 16px;font-weight: 500;line-height: 60px;height: 60px;width: 60px;pointer-events: none;}
/*media*/
@media(min-width: 1200px){
	.pagination-tree .custom-pagination ul li a:hover {color: #2980b9;}
	.pagination-tree .custom-pagination ul li.active a:hover {color: #fff;}
}
@media(max-width: 767px){
	.pagination-tree .custom-pagination ul li a {width: 50px;height: 50px;}
	.pagination-tree .custom-pagination ul li.dott {width: 50px;height: 50px;line-height: 50px;}
}
@media(max-width: 480px){
	.pagination-tree .custom-pagination ul li a {width: 40px;height: 40px;font-size: 14px;}
	.pagination-tree .custom-pagination ul li.dott {width: 40px;height: 40px;line-height: 40px;font-size: 14px;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Pagination with Dotta and Arrows */
/*-------------------------------------------------------------------------------------------------------------------------------*/
.pagination-foure .custom-pagination {display: block;position: relative;}
.pagination-foure .custom-pagination ul {position: relative;display: inline-block;margin: 0 auto;text-align: center;font-size: 0;}
.pagination-foure .custom-pagination ul li {position: relative;display: inline-block;vertical-align: middle;}
.pagination-foure .custom-pagination ul li a {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;color: #282828;border: 1.2px solid #E7E7E7;width: 60px;height: 60px;z-index: 2;position: relative;font-size: 16px;font-weight: 500;line-height: 1.6em;text-transform: uppercase;-o-transition: all 0.3s;transition: all 0.3s;-webkit-transition: all 0.3s;}
.pagination-foure .custom-pagination ul li.active a {color: #fff;border-color: #2980b9;background-color: #2980b9;}
.pagination-foure .custom-pagination ul li.dott {display: inline-block;color: #282828;border: 1.2px solid #E7E7E7;font-size: 16px;font-weight: 500;line-height: 60px;height: 60px;width: 60px;pointer-events: none;}
.pagination-foure .custom-pagination ul li.dott {display: inline-block;color: #282828;border: 1.2px solid #E7E7E7;font-size: 16px;font-weight: 500;line-height: 60px;height: 60px;width: 60px;pointer-events: none;}
.pagination-foure .custom-pagination ul li.arrow.disabled a {pointer-events: none;opacity: 0.6;}
.pagination-foure .custom-pagination ul li.arrow.left a::before {content: '';position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%) rotate(45deg);-ms-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);width: 10px;height: 10px;border-left: 2px solid #282828;border-bottom: 2px solid #282828;-webkit-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.pagination-foure .custom-pagination ul li.arrow.right a::before {content: '';position: absolute;top: 50%;left: 50%;margin-left: -2px;-webkit-transform: translate(-50%,-50%) rotate(45deg);-ms-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);width: 10px;height: 10px;border-right: 2px solid #282828;border-top: 2px solid #282828;-webkit-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
/*media*/
@media(min-width: 1200px){
	.pagination-foure .custom-pagination ul li a:hover {color: #2980b9;}
	.pagination-foure .custom-pagination ul li.active a:hover {color: #fff;}
	.pagination-foure .custom-pagination ul li.arrow.left a:hover::before,
	.pagination-foure .custom-pagination ul li.arrow.right a:hover::before {border-color: #2980b9;}
}
@media(max-width: 767px){
	.pagination-foure .custom-pagination ul li a {width: 50px;height: 50px;}
	.pagination-foure .custom-pagination ul li.dott {width: 50px;height: 50px;line-height: 50px;}
	.pagination-foure .custom-pagination ul li.arrow a {width: 50px;height: 50px;}
	.pagination-foure .custom-pagination ul li.arrow.left a::before,
	.pagination-foure .custom-pagination ul li.arrow.right a::before {width: 9px;height: 9px;}
}
@media(max-width: 480px){
	.pagination-foure .custom-pagination ul li a {width: 40px;height: 40px;font-size: 14px;}
	.pagination-foure .custom-pagination ul li.dott {width: 40px;height: 40px;line-height: 40px;font-size: 14px;}
	.pagination-foure .custom-pagination ul li.arrow a {width: 40px;height: 40px;}
}
@media(max-width: 400px){
	.pagination-foure .custom-pagination ul li.arrow a {display: none;}
}