:root {
    --color-primary-brand: #12a2fc;
    --color-primary: rgb(0, 178, 255);
    --color-primary-seconday: orange;
    --color-primary-hover: #0e8de6;
    --color-primary-link: black;
    --color-secondary: #6c757d;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-bg: #fff;
    --bs-pagination-border-width: 1px;
    --bs-pagination-border-color: #dee2e6;

}

html body {
    overflow-x: hidden;
}


.custom_page_link {
    position: relative;
    display: block;
    padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
    font-size: var(--bs-pagination-font-size);
    color: var(--color-primary);
    text-decoration: none;
    background-color: var(--bs-pagination-bg);
    border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}



.primary-color {
    color: var(--color-primary) !important;
}

.breadcrumb a {
    color: var(--color-primary) !important;
}

.nav-link {
    color: var(--color-primary) !important;
}

.nav-link.active {
    color: white !important;
    background-color: var(--color-primary) !important;
}

.custom-link {
    color: var(--color-primary-link) !important;
}

.page-item.active .page-link {
    z-index: 3;
    color: white !important;
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.page-item.active .page-link{
    z-index: 3;
    color: white !important;
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}


.btn-custom-outline {
    color: var(--color-primary) !important;
    border: 1px solid var(--color-primary) !important;
}

.btn-custom-outline:hover {
    background-color: var(--color-primary) !important;
    color: white !important;
}

.btn-custom {
    background-color: var(--color-primary-seconday) !important;
    border: 1px solid var(--color-primary-seconday) !important;
}

.custom-text {
    color: var(--color-primary) !important;
}