/* .pagination */

.pagination { margin-top: 100px;}
.pagination ul { display: flex; flex-direction: row; justify-content: center; align-items: center; margin-bottom: 0;}
.pagination ul li { font-size: 18px; margin: 0 .5rem;}
.pagination ul li a { position: relative; color: #28628a; opacity: 1; padding: .5rem; transition: opacity .5s ease;}
.pagination ul li a.btn { display: flex; flex-direction: row; justify-content: center; align-items: center; background: #fff; border: 1px solid #28628a; padding: .75rem; transition: color .5s ease , background-color .5s ease;}
.pagination ul li a.btn span { display: flex; flex-direction: row; justify-content: center; align-items: center; }

.pagination ul li.current-page a { pointer-events: none; font-weight: bold;}
.pagination ul li.current-page a:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #efcd34;}

@media (hover:hover){
    .pagination ul li:not(.current-page) a:not(.btn):hover { opacity: .25;}
    .pagination ul li a.btn:hover { color: #fff; background: #28628a;}
}

@media(max-width: 767px){
    .pagination { margin-top: 50px;}
    .pagination ul li { font-size: 16px; margin: 0 .25rem;}
    .pagination ul li a { padding: 1rem;}
}