.bread-crumb {
    margin-bottom: 40px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    display: flex;
    align-items: center;
    padding: 120px 0;
    position: relative;
    z-index: 1
}

@media (max-width: 991px) {
    .bread-crumb {
        padding: 100px 0
    }
}

.bread-crumb::before {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    content: "";
    width: 100%;
    height: 100%;
    z-index: -1;
    background: -webkit-gradient(linear, right top, left top, color-stop(24.56%, rgba(12, 10, 10, 0.5)), color-stop(71.75%, rgba(12, 10, 10, 0.74)), color-stop(81.83%, rgba(12, 10, 10, 0.82)), to(rgba(12, 10, 10, 0.9)));
    background: linear-gradient(-90deg, rgba(12, 10, 10, 0.5) 24.56%, rgba(12, 10, 10, 0.74) 71.75%, rgba(12, 10, 10, 0.82) 81.83%, rgba(12, 10, 10, 0.9) 100%)
}

@media (max-width: 991px) {
    .bread-crumb {
        margin-bottom: 20px
    }
}

.bread-crumb .title-bread-crumb {
    font-size: 35px;
    color: #fff;
    font-weight: 600;
    font-size: 4rem
}

@media (max-width: 1199px) {
    .bread-crumb .title-bread-crumb {
        font-size: 3.6rem
    }
}

@media (max-width: 1025px) {
    .bread-crumb .title-bread-crumb {
        font-size: 3.2rem
    }
}

@media (max-width: 992px) {
    .bread-crumb .title-bread-crumb {
        font-size: 3rem
    }
}

@media (max-width: 767px) {
    .bread-crumb .title-bread-crumb {
        font-size: 2.6rem
    }
}

.breadcrumb {
    margin: 0;
    font-size: 14px;
    padding: 10px 0px;
    border-radius: 0;
    font-weight: 400;
    line-height: 24px;
    width: 100%
}

.breadcrumb li {
    display: inline
}

.breadcrumb li>a {
    color: #fff
}

.breadcrumb li>a>span {
    color: #fff
}

.breadcrumb li .mr_lr {
    padding: 0px 3px;
    color: #fff
}

.breadcrumb li .mr_lr svg {
    width: 10px;
    height: 10px;
    margin-top: -2px
}

.breadcrumb li span {
    display: inline;
    color: #fff
}

.breadcrumb li span .fa {
    color: #fff;
    padding: 0px 5px
}

.breadcrumb li a:hover,
.breadcrumb li.active,
.breadcrumb li strong {
    color: var(--mainColor);
    font-weight: 400;
    text-decoration: none
}

.breadcrumb li a:hover span,
.breadcrumb li.active span,
.breadcrumb li strong span {
    color: var(--mainColor)
}

.breadcrumb>li+li:before {
    display: none
}

.pagenav {
    position: relative;
    width: 100%;
    margin-bottom: 20px
}

.pagenav span {
    display: inline-block;
    float: left;
    margin-right: 10px;
    line-height: 30px;
    font-weight: 700
}

.nav_pagi {
    display: inline-block;
    width: 100%
}

.nav_pagi .pagination {
    position: relative;
    z-index: 1;
    padding: 0 0px;
    margin: 0 0 0px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    list-style: none
}

@media (max-width: 768px) {
    .nav_pagi .pagination {
        padding: 0 0px
    }
}

.nav_pagi .pagination .page-link {
    font-weight: 400;
    float: left;
    margin: 0 2.5px;
    margin-bottom: 5px;
    width: 36px;
    background: transparent;
    border: solid 1px #000;
    text-align: center;
    height: 36px;
    font-size: 14px;
    padding: 0;
    line-height: 34px;
    color: #000;
    text-decoration: none;
    border-radius: 50%
}

.nav_pagi .pagination .page-link.link-next-pre {
    line-height: 32px
}

.nav_pagi .pagination .page-link.page-db {
    width: auto;
    padding: 0 20px
}

.nav_pagi .pagination .page-link:hover {
    background-color: var(--mainColor);
    color: #fff;
    border-color: var(--mainColor)
}

.nav_pagi .pagination .page-link svg {
    width: 14px;
    height: 14px
}

.nav_pagi .pagination .page-item.disabled .page-link {
    border: 0;
    display: none
}

.nav_pagi .pagination .page-item.active .page-link {
    background-color: var(--mainColor);
    border-color: var(--mainColor);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center
}