/*
 Theme Name:   Alton MO
 Theme URI:    https://bitbucket.org/bizstax/altonmo-directory
 Description:  DW Focus Child Theme
 Author:       TJ Thomas
 Author URI:   http://sitedesignusa.com
 Template:     dw-focus
 Version:      2.0.1
 Requires at least: 4.9.6
 Tested up to: 4.9.6
 Requires PHP: 7.2
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  altonmo
*/

/*
CSS Specificity Guide:
https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
*/

/* Begin Styles */
/* Basic Styles */
.tj_bottom_border {
    border-bottom: 1px solid #656565;
}

/* Header */
/*Fix Admin Bar Footnote issues*/

.simple-footnote {
    margin-bottom: -40px;
    padding-top: 40px;
}

.simple-footnotes h4 {
    margin-bottom: -30px;
}

/* Fix font size on archive, search etc pages */
.page-header h1 {
    font-size: 100%;
}

/*.tj_fix_wp_overlap { min-height: 32px; } @media screen and (max-width: 782px) { .fix_wp_overlap { top: 46px !important; } }*/
/*:target:before {*/
/*content:"";*/
/*display:block;*/
/*height:90px; !* fixed header height*!*/
/*margin:-70px 0 0; !* negative fixed header height *!*/
/*}*/
/* Slider */
.dw_focus_widget_news_slider .carousel-inner, .widget_news-slider .carousel-inner {
    width: 710px;
    height: 400px;
    z-index: 1;
    background: #000;
}

.dw_focus_widget_news_slider .carousel-entry .carousel-caption, .widget_news-slider .carousel-entry .carousel-caption {
    margin-bottom: -30px;
}

/* End Slider */

/* Weather page */
.tj-weather-header {
    margin-bottom: 20px;
    border-bottom: solid #C6C6C6 1px;
    height: 275px;
}

/* END Weather page */

/*Tags*/
.single #main > .post .entry-sidebar .tags-links .tjmarginbottom {
    margin-bottom: 5px;
}

.single #main > .post .entry-sidebar .tags-links a {
    color: #777;
    font-size: 14px;
}

.single #main > .post .entry-sidebar h3 {
    font-size: 14px;
}

/*END Tags*/
/* Footer */
.tj_footer_menu {
    display: inline;
    margin-right: 10px;
}

.site-footer .site-footer-logo img {
    max-height: 30px;
    width: auto;
    opacity: .7;
}

.site-footer .site-footer-logo img:hover {
    max-height: 30px;
    width: auto;
    opacity: 1;
}

.tj_footer_menu a:after {
    content: '|'
}

.tj_footer_menu a:last-child:after {
    content: '';
}

/* Fix links so they work */
#colophon.site-footer::before {
    content: none;
}

#footer-widgets.widget-area .row .textwidget .btn {
    width: 100%;
    margin-top: 16px;
}


/* The ribbons. https://codepen.io/eode9/pen/twkKm */

.tj-banner {
    position: relative;
    overflow: hidden;
}

.corner-ribbon {
    width: 200px;
    background: #e43;
    position: absolute;
!important;
    top: 25px;
    left: -50px;
    text-align: center;
    line-height: 50px;
    letter-spacing: 1px;
    color: #f0f0f0;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    font-size: 20px;
}

.single-post .tj-banner .corner-ribbon a {
    color: #fff;
}

.single-post .tj-banner span.corner-ribbon a:hover {
    color: #f0f0f0 !important;
}

/* Custom styles */

.corner-ribbon.sticky {
    position: fixed;
}

.corner-ribbon.shadow {
    box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
}

/* Different positions */

.corner-ribbon.top-left {
    top: 25px;
    left: -50px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

/* Color of ribbon */
.corner-ribbon.red {
    background: #ee3224;
}

/* End ribbons */


/* START Image Caption */

.tj-caption {
    position: absolute;
    /* adjust as needed, you may not even need them */
    bottom: 0;
    right: 0;
    font-size: 11px;
    background-color: #000;
    color: #c8c8c8;
    padding: 10px 20px;
    opacity: .8;
}

.tj-caption-below-image {
    margin: 8px auto 14px;
    color: #777;
    font-size: 10px;
    padding: 0 20px 10px 20px;
    text-align: right;
}

.tj-slider-image {
    margin: 0 0 -10px -18px;
    color: #898989;
    font-size: 12px;
    padding: 0 20px 10px 20px;
    text-align: left;
    font-style: italic;
}

/*END Caption*/


.single #main > .post .entry-thumbnail {
    margin-bottom: 0;
}

/* Start breadcrumb style */
header.entry-header .entry-meta p#breadcrumbs, header.page-header .entry-meta p#breadcrumbs {
    margin: -13px 0 13px auto;
}

main#main header .entry-meta {
    margin: 0 0 10px;
    font-size: 12px;
    color: #777;
}

main#main header .entry-meta a {
    color: #000;
}

main#main header .entry-meta a:hover {
    color: #ee3224;
}

/* END breadcrumb style */
/* Start remove category title in mega menu */
h3.dw-megamenu-widget-title {
    display: none;
}

.wp-block-geodirectory-geodir-event-widget-calendar h3.tj_gd_title.dw-megamenu-widget-title {
    display: block;
    font-size: 1.3rem;
    margin-top: -24px;
}

/* END remove category title in mega menu */

/* Start styles in mega menu */
nav#masthead.navbar-default #site-navigation .dw-mega-menu-hover a:hover {
    color: #ee3224;
    background-color: #e8e8e8;
}
#site-navigation .dw-mega-menu-hover.menu-business a {
    color: green;
}
#site-navigation .dw-mega-menu-hover.menu-about a {
    color: #07c;
}
#site-navigation .dw-mega-menu-hover.menu-news a {
    color: #941f16;
}
#site-navigation .dw-mega-menu-hover.menu-sports a {
    color: #1e357f;
}
#site-navigation .dw-mega-menu-hover.menu-community a {
    color: #b96e04;
}
#site-navigation .dw-mega-menu-hover.menu-contact-us a {
    color: #059f05;
}
/* This removes scrollbar from menu (problem appears when using tablet or phone size)  */
nav#masthead.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    overflow-y: hidden;
}
/* END styles in mega menu */


/* BEGIN geodirectory */
h1.page-title {
    font-size: 36px;
    font-weight: 400;
    font-family: Roboto Slab;
    line-height: 1.3;
    border: 0;
    margin-top: -10px;
}

/* This is for the alert help box */
.wp-block-geodirectory-geodir-widget-notifications {
    margin: -18px auto 28px;
}

/* Image control */
/* greater than > means only direct child. not grandchildren */
a.geodir-link-image.embed-has-action.embed-responsive.embed-responsive-16by9.d-block > img.align.size-medium_large.geodir-image-1.embed-responsive-item.embed-item-cover-xy.w-100.p-0.m-0.mw-100.border-0 {
    height: 100%;
}

.bsui .embed-responsive-16by9::before {
    padding-top: 52.25%;
}

.bsui .embed-responsive .embed-responsive-item, .bsui .embed-responsive iframe, .bsui .embed-responsive embed, .bsui .embed-responsive object, .bsui .embed-responsive video {
    height: auto;
}

/* categories and tags under image on single page */
.wp-block-geodirectory-geodir-widget-single-taxonomies {
    margin: 12px auto 24px;
}

/* Puts a border around tab area */
#gd-single-tabs-content.geodir-tabs-content.mt-3 {
    border-left: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    margin-top: -16px !important;
    padding: 14px;
}

/* Space after overall reviews before stars */
div.gd-main-overall-rating.d-flex.align-items-center.h4 > span {
    margin-right: 14px;
}

div.gd-main-overall-rating.d-flex.align-items-center.h4 {
    padding-bottom: 10px;
    padding-top: 50px;
    margin-bottom: 32px;
}

.bsui .gd-overall-rating-text.badge.badge-secondary {
    color: #fff;
    background-color: #6c757d;
    width: 30%;
}

/* Remove dotted or dashed border line from dw-focus */
#comments .commentlist-wrap .commentlist.list-unstyled .comment-content.comment.card-body.m-0,
#comments .commentlist-wrap .commentlist.list-unstyled .comment.geodir-comment.list-unstyled {
    border-bottom: 0;
    padding: 0;
}

/* Put a little space around comments */
#comments .commentlist-wrap .commentlist.list-unstyled .comment-content.comment.card-body.m-0 p {
    padding: 12px 12px 0 12px;
}

/*
Buttons
*/
/* Style mostly covered up at line 333, but this adds padding to review button */
.geodir-single-tabs-container.bsui .submit.btn.btn-primary.form-control.text-white {
    padding: 10px 0 35px 0;
}

/* This colors all buttons */
/* Submit listing button */
/*#geodir-add-listing-submit.geodir_form_row .geodir_button.btn.btn-primary*/
/* Submit listing button */
.btn.btn-primary {
    color: #fff !important;
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}
.btn.btn-outline-primary {
    color: #c82333!important;
    border-color: #dc3545 !important;
}
.btn.btn-primary:hover,
.btn.btn-outline-primary:hover {
    color: #fff !important;
    background-color: #c82333 !important;
    border-color: #bd2130 !important;
}
/*

Add listing "Set Address on Map" button because morons at geodirectory can't get their instructions
straight. Here is link to replacing templates: https://docs.wpgeodirectory.com/article/346-customizing-templates
It doesn't work. So here we are. CSS trickery.

*/
/* Space at top of map on add listing pages */
#geodir_address_map_row .mb-3.row {
    margin-top: 1rem;
}
/* Don't display set on map button on add listing pages */
#geodir_address_map_row .mb-3.row .btn.btn-primary,
/* Move text above map to left */
#geodir_address_map_row .mb-3.row .col-form-label,
/* Move submit button at bottom of add listing page to left */
#gd_recaptch_row.required_field.gd-captcha.gd-captcha-add_listing .gd-captcha-title.col-form-label,
#geodir-add-listing-submit.geodir_form_row .col-sm-2.col-form-label {
    display: none;
}

#geodir_address_map_row .mb-3.row .form-text.text-muted.d-block {
    font-size: 0;
}

#geodir_address_map_row .mb-3.row .form-text.text-muted.d-block:after {
    font-size: .85rem;
    content: 'After entering your address, please drag the map marker to help people find the correct address. Use +/- to zoom.';
}

#gd_recaptch_row.required_field.gd-captcha.gd-captcha-add_listing #gdcaptcha_add_listing.gd-captcha-render {
    padding-left: 0;
}

/* Geodirectory Search boxes and buttons under map */
/* Centers the search div with rest of content and map (makes look even) */
.geodir-search-container.bsui .px-3 {
    padding-right: 0.2rem !important;
    padding-left: 0.2rem !important;
}
/* Pagination on geodirectory pages */
/* Use neutral gray colors */
.bsui .page-link.active, .active>.bsui .page-link {
    --bs-pagination-active-bg: #ccc;
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: var(--bs-pagination-active-bg);
    border-color: var(--bs-pagination-active-bg);
}
.bsui .page-link:hover {
    --bs-pagination-hover-color: #ee3224;
    --bs-pagination-hover-bg: #ececec;
    z-index: 2;
    color: var(--bs-pagination-hover-color);
    background-color: var(--bs-pagination-hover-bg);
}
/* END Pagination on geodirectory pages */

/* Button & badge color for replies */
#comments.bsui .comment-reply-link.btn.btn-primary {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
    font-size: .75rem;
}

#comments.bsui .comment-reply-link.btn.btn-primary:hover {
    color: #fff;
    background-color: #c82333;
    border-color: #bd2130;
}

.bsui #comments .badge.badge-primary {
    color: #fff;
    background-color: #dc3545;
    font-size: .75rem;
}

#comments .comment-respond .form-submit input[type="submit"] {
    background: #dc3545;
    color: #fff;
    border-color: #dc3545;
}

#comments .comment-respond .form-submit input[type="submit"]:hover {
    color: #fff;
    background-color: #c82333;
    border-color: #bd2130;
}

/* Font style for reviews */
.bsui .comment.geodir-comment.list-unstyled a {
    color: #777;
    font-size: .75rem;
    text-decoration: none;
    background-color: transparent;
}

.bsui a:hover {
    text-decoration: none;
}

/* Geodirectory messed up awesome fonts */
.fa, .fa-brands, .fa-duotone, .fa-light, .fa-regular, .fa-solid, .fa-thin, .fab, .fad, .fal, .far, .fas, .fat {
    margin: 0 5px 0 0;
}

.fa.fa-twitter, .fa.fa-facebook-square, .fa.fa-facebook, .fa.fa-google-plus, .fa.fa-linkedin, .fa.fa-pinterest {
    font-family: "Font Awesome 5 Brands";
    font-weight: 100;
    margin: 0;
}

/* Icons look better skinny (font-weight) but these need heavier or won't show up */
.fa.fa-rss, .fa.fa-print {
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin: 0;
}

/* Let's fix border around directory details */
#secondary.widget-area .geodir_post_meta.list-group-item.list-group-item-action {
    margin-bottom: 0;
}


/*
Featured image slider on Geodirectory
*/
.geodir-images .carousel-item.active .embed-responsive {
    height: unset;
}

.bsui .embed-responsive.ratio-16x9.ratio.ratio-16x9.ratio-16x9 {
    --bs-aspect-ratio: calc(8.31 / 16 * 100%);
    height: unset;
}

/*
Images and content in Geodirectory tabs area
*/
#gd-tabs .tab-pane.fade.active.show,
.geodir-notifications.bsui .alert.fade.show {
    opacity: unset;
}

/*
Modal display in Geo
*/
#gd-image-meta-input.modal.bsui.fade.show,
#aui-carousel-modal.fade {
    opacity: unset;
}

/* slideshow */
/* Doesn't work for width but may work for other style*/
/* Less than 820px wide */
/*#aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded.tj_modal_820 {*/
/*    width: 80% !important;*/
/*    height: auto !important;*/
/*}*/
/*!* Less than 820px wide *!*/
/*#aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded.tj_modal_1200 {*/
/*    width: 80% !important;*/
/*    height: auto !important;*/
/*}*/
/*!* Less than 820px wide *!*/
/*#aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded.tj_modal_large {*/
/*    width: 80% !important;*/
/*    height: auto !important;*/
/*}*/


#aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded {
    width: 80% !important;
    height: auto !important;
}





/*
Images in tab area
*/
/* For the images area */
.geodir-post-slider.bsui .card {
    border-radius: 0;
    --bs-card-border-radius: 0;
    --bs-card-inner-border-radius: 0;
}

/* For the archive page */
.geodir-loop-container.bsui .card {
    border-radius: 0;
    --bs-card-border-radius: 0;
    --bs-card-inner-border-radius: 0;
}


/*
Tabs in Geo
*/
.geodir-single-tabs-container.bsui .nav-tabs .nav-link {
    border-radius: 0;
    /*box-shadow: none;*/
    /*background-color: #f5f4f8;*/
    /*color: #454056;*/
    /*font-weight: normal;*/
}

/*
Badges
*/
/* All buttons border in area */
.geodir-single-taxonomies-container.bsui .badge {
    border-radius: 0;
}

/* Control the lower previous, next buttons at bottom */
.geodir-single-taxonomies-container.bsui .badge.bg-secondary, .bsui .badge.bg-light {
    color: #fff;
}



/*
Calendar
 */
.bsui .event_highlight.text-bg-primary {
    color: #fff !important;
    background-color: RGBA(57, 147, 213, var(--bs-bg-opacity, 1)) !important;
}
.big-calendar .geodir-event-calendar.bsui .geodir_event_cal_widget.table-responsive .badge,
.bsui .geodir_event_cal_widget.table-responsive .badge {
    --bs-badge-font-size: 100%;
    font-size: var(--bs-badge-font-size);
}


/*
Forms
/*
Solve package dilemma. If user clicks then reload whole page and would upset user.
https://docs.wpgeodirectory.com/article/689-geodirectory-frequently-asked-css-customizations

<div data-argument="package_id" class="mb-3 row" data-rule-key="package_id" data-rule-type="text"
 */

form#geodirectory-add-post div.mb-3.row[data-argument="package_id"]{
    display:none;
}

/* When submit listing this pushes footer down so no white space on screen. */
.geodir-add-listing.bsui .gd-notification.alert-info {
    margin: 98px 0 250px;
    padding: 64px 15px;
    font-size: 1.25rem;
}

/* END Geodirectory */



/* Media Queries */

/* Start the max-width queries (must be from largest to smallest. Opposite of min-width) */

@media (max-width: 991px) {
    .navbar-header {
        float: none;
    }
    nav#masthead.navbar-default .main-navigation .dw-mega-menu,
    nav#masthead.navbar-default .main-navigation .dw-sub-menu {
        display: block;
        width: 100%;
    }
    nav#masthead.navbar-default .navbar-collapse, .navbar-default .navbar-form {
        margin-bottom: 30px;
    }

    .simple-footnote {
        margin-bottom: -60px;
        padding-top: 60px;
    }

    .tj_footer_menu {
        display: block;
    }

    /* Slider */
    .dw_focus_widget_news_slider .carousel-inner, .widget_news-slider .carousel-inner {
        width: 720px;
        height: 400px;
    }

    .dw_focus_widget_news_slider .carousel-entry .carousel-caption, .widget_news-slider .carousel-entry .carousel-caption {
        margin-bottom: 0;
    }

    .site-footer .site-footer-logo img {
        max-height: 50px;
        width: auto;
        opacity: .7;
    }

    .site-footer .site-footer-logo img:hover {
        max-height: 50px;
        width: auto;
        opacity: 1;
    }

    /* Sidebar */
    /*Social Icons*/
    /*column is too far left put this is child theme*/
    .single #main > .post .entry-sidebar {
        margin-right: 0;
        margin-top: 100px;
    }

    /*END Social Icons*/
    /*END Sidebar*/
    /* End Slider */
    /*START Caption*/
    .tj-caption-below-image p {
        margin: 0 0 auto 0;
    }

    /*END Caption*/
    /* START geodirectory badge and stars */
    .bsui .gd-overall-rating-text.badge.badge-secondary {
        width: 35%;
    }

    /* END geodirectory badge and stars */
}

@media (max-width: 768px) {
    .widget .widget-title {
        font-size: 22px;
    }

    .site-footer {
        font-size: 18px;
        color: #555;
        line-height: 24px;
    }

    .dw_focus_widget_news_slider .carousel-inner, .widget_news-slider .carousel-inner {
        width: auto;
        height: auto;
    }

    .dw_focus_widget_news_slider .carousel-entry .entry-title, .widget_news-slider .carousel-entry .entry-title {
        margin-bottom: 0;
    }

    .dw_focus_widget_news_slider .carousel-entry:after, .widget_news-slider .carousel-entry:after {
        height: 75%;
    }

    #footer-widgets.widget-area .row .textwidget .btn {
        width: 90%;
        margin-top: 16px;
    }

    /* START Geodirectory Modal for viewing listings images */

    #aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded {
        width: 80% !important;
        height: auto !important;
    }

    /* END Geodirectory Modal for viewing listings images */

    /* START geodirectory badge and stars */
    .bsui .gd-overall-rating-text.badge.badge-secondary {
        width: 40%;
    }

    /* END geodirectory badge and stars */
}

@media (max-width: 599px) {
    /*START Caption*/
    .tj-caption-below-image p {
        margin: 0 0 auto 0;
        text-align: left;
    }

    .tj-slider-image {
        font-size: 8px;
        margin-top: 3px;
    }

    /*END Caption*/
    /* START geodirectory badge and stars */
    .bsui .gd-overall-rating-text.badge.badge-secondary {
        width: 75%;
    }

    /* END geodirectory badge and stars */
}

@media (max-width: 510px) {
    /* Weather page */
    .tj-weather-header {
        height: 315px;
    }

    /* END Weather page */
}

@media (max-width: 480px) {
    /* Calendar on search archive page for geodirectory events */
    .big-calendar .geodir-event-calendar.bsui .geodir_event_cal_widget.table-responsive .badge,
    .bsui .geodir_event_cal_widget.table-responsive .badge {
        --bs-badge-font-size: 75%;
        font-size: var(--bs-badge-font-size);
    }
    /* END Calendar page */
}

@media (max-width: 320px) {
    /* Calendar on search archive page for geodirectory events */
    .big-calendar .geodir-event-calendar.bsui .geodir_event_cal_widget.table-responsive .badge,
    .bsui .geodir_event_cal_widget.table-responsive .badge {
        --bs-badge-font-size: 60%;
        font-size: var(--bs-badge-font-size);
    }
    /* END Calendar page */
}


/* Start the min-width queries (must be from smallest to largest. Opposite of max-width) */
@media (min-width: 992px) {
    .col-md-9 {
        width: 73%;
    }

    .col-md-3 {
        width: 27%;
    }

    /* Sidebar */
    /*Social Icons*/
    /*column is too far left put this is child theme*/
    .single #main > .post .entry-sidebar {
        margin-right: -10px;
        padding-left: 38px;
    }

    /*END Social Icons*/
    /*END Sidebar*/
    /*START Caption*/
    .tj-caption-below-image p {
        margin: 0 0 auto 25%;
    }

    /*END Caption*/
}

@media (min-width: 1200px) {
    header.site-header div.under-navigation.hidden-xs.hidden-sm::before {
        left: 74%;
    }
    /* Calendar on search archive page for geodirectory events */
    .bsui .geodir_event_cal_widget.table-responsive .badge {
        --bs-badge-font-size: 63%;
        font-size: var(--bs-badge-font-size);
    }
    /* START Geodirectory Modal for viewing listings images */
    #aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded {
        width: 80% !important;
        height: 70vh !important;
    }

    /* END Geodirectory Modal for viewing listings images */


}

@media (min-width: 1600px) {
    /* START Geodirectory Modal for viewing listings images */

    #aui-carousel-modal.modal.fade.aui-carousel-modal.bsui.show .modal-dialog.modal-dialog-centered.modal-xl.mw-100 #aui-embed-slider-modal.carousel.slide .carousel-inner .carousel-item.active img.mx-auto.d-block.w-auto.mw-100.rounded {
        width: auto !important;
        height: 80vh !important;
    }

    /* END Geodirectory Modal for viewing listings images */
}



.geodir-search-container.bsui .px-3 {
    padding-right: 0.2rem !important;
    padding-left: 0.2rem !important;
}

.bsui .page-link.active, .active>.bsui .page-link {
    --bs-pagination-active-bg: #ccc;
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: var(--bs-pagination-active-bg);
    border-color: var(--bs-pagination-active-bg);
}
.bsui .page-link:hover {
    --bs-pagination-hover-color: #ee3224;
    z-index: 2;
    color: var(--bs-pagination-hover-color);
}