my_tests/assets/css/photos_components/_pagination.scss

$photos-main-color:#6D6D6D;
$photos-second-color:#EE7800;
$light-gray:#9D9D9D;
$photos-main-font-size:18px;
$photos-second-font-size:14px;
$photos-main-family:'Microsoft JhengHei', Helvetica,Noto Sans TC,Roboto,Arial,sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";


// pagination
.pagination{
    border: 1px solid #DDDDDD;

    .page-item{
        &.active .page-link{
            background-color: $photos-second-color;
            border-color:$photos-second-color;
        }
    }
    .page-link{
        color: #6D6D6D;
        font-family: $photos-main-family;
        border: 1px solid #FFF;
        &:hover{
            color: #fff;
            background-color: $photos-second-color;
        }
    }
    .page-link-arrow{
        color: #6D6D6D !important;
        font-family: $photos-main-family;
        position: relative;
        display: block;
        padding: 0.5rem 0.70rem;
        line-height: 1.25;
        color: $photos-main-color;
        background-color: #fff;
        border: 1px solid #fff;
        &:hover{
            text-decoration: none;
            color: #fff !important;
            background-color: $photos-second-color;
        }
    }
}