@media screen and (max-width: 854px) {
    #divNavBar {
        visibility: hidden;
        clear: both;
        display: none;
    }
}

.bg-dg-gray {
    background-color: #F9F9F9;
}

.bg-dg-primary {
    background-color: rgb(0,48,62);
}

#custCarousel .carousel-indicators {
    height: 100px
}

#carouselExampleCaptions .carousel-indicators > li {
    width: 100px
}

#carouselExampleCaptions .carousel-indicators li img {
    display: block;
    opacity: 1;
    height: 64px
}

#carouselExampleCaptions .carousel-indicators li.active img {
    opacity: 1
}

#carouselExampleCaptions .carousel-indicators li:hover img {
    opacity: 1;
    box-shadow: 2px 2px 2px #a8a8a8;
}

.carousel-indicators li {
    background-color: transparent;
}

.carousel-indicators {
    bottom: -90px;
}

.carousel-indicators [data-bs-target] {
        text-indent: 0px;
}

.form-control-dg {
    border: 0;
    max-width:23px;
}

.btn_active {
    background-color: #E8FFF3;
}


/*#############################*/

.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 95%;
}

/*#############################*/

:root {
    --special-redish-color: #C83C34;
    --special-redish-color-active-hover: #B13131;
}

@media screen and (max-width: 912px) {
    .footer {
        visibility: hidden;
        display: none;
    }
}

.fw-boldest {
    font-weight: 700 !important;
}

#anchor-logo > img {
    width: 38px !important;
    height: 61px !important;
}

#kt_header {
    background: rgb(255,255,255);
    background: linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.8%);
    background: -moz-linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.8%);
    background: -webkit-linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.8%);
    background: linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.8%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#c83c34",GradientType=1);
}

@media screen and (min-width: 576px) {
    #kt_header {
        background: linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.7%);
        background: -moz-linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.7%);
        background: -webkit-linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.7%);
        background: linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.7%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#c83c34",GradientType=1);
    }
}

@media screen and (min-width: 992px) {
    #kt_header {
        background: linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.6%);
        background: -moz-linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.6%);
        background: -webkit-linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.6%);
        background: linear-gradient(64deg, rgba(255,255,255,1) 36.54%, rgba(200,60,52,1) 36.6%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#c83c34",GradientType=1);
    }


    .container-xxl.d-flex.flex-grow-1.flex-stack {
        height: 70px !important;
    }

    #kt_body > div > div > div > #kt_header {
        height: 145px !important;
    }

    #kt_body[data-kt-sticky-header="on"] > div > div > div > #kt_header {
        height: 70px !important;
    }

    #kt_body > div > div > div > #kt_header > div > div > #anchor-logo {
        z-index: 1 !important;
        margin-top: 1.5rem !important;
    }

    #kt_body > div > div > div > #kt_header > div > div > #anchor-logo > img {
        width: auto !important;
        height: 70px !important;
    }

    #kt_body[data-kt-sticky-header="on"] > div > div > div > #kt_header > div > div > #anchor-logo {
        z-index: 1 !important;
        margin-top: 0rem !important;
    }

    #kt_body[data-kt-sticky-header="on"] > div > div > div > #kt_header > div > div > #anchor-logo > img {
        width: auto !important;
        height: 61px !important;
    }
}


.special-redish-background-color {
    background-color: var(--special-redish-color) !important;
}

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

a.special-redish-background-color:hover,
a.special-redish-background-color:active,
button.special-redish-background-color:hover,
button.special-redish-background-color:active{
    background-color: var(--special-redish-color-active-hover) !important;
}

a.menu-item {
    cursor: context-menu;
}

.bullet {
    background-color: #B5B5C3 !important;
}

.menu-link:hover > .menu-bullet > .bullet.bullet-dot,
div.menu-item.menu-lg-down-accordion:hover > span.menu-link > .menu-bullet > .bullet.bullet-dot {
    background-color: black !important;
}

.customized-menu-link {
    cursor: pointer;
    color: #B5B5C3;
    padding-left: 1rem;
    padding-right: 1rem;
    border-radius: 0.475rem !important;
}

@media screen and (max-width: 992px) {
    .customized-menu-link {
        color: #5E6278 !important;
    }
}

div.menu-item.menu-lg-down-accordion.show.menu-dropdown > span.menu-link > span.menu-icon > span.svg-icon,
div.menu-item.menu-lg-down-accordion.show.menu-dropdown > span.menu-link > span.menu-arrow {
    color: black !important;
}

.customized-menu-arrow {
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    transform: rotateZ(-180deg) !important;
    display: flex;
    align-items: stretch;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    width: 0.8rem;
    height: 0.8rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%23B5B5C3' %3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.06463 4.42111C1.96161 4.22088 1.9809 3.9637 2.12863 3.78597L5.12847 0.177181C5.31402 -0.046034 5.63049 -0.060261 5.83532 0.145404C6.04015 0.351069 6.05578 0.698744 5.87023 0.921959L3.19406 4.14137L5.84414 7.06417C6.03896 7.27904 6.03835 7.62686 5.84278 7.84105C5.64721 8.05524 5.33073 8.05469 5.13591 7.83982L2.14806 4.54449C2.1141 4.50704 2.08629 4.46541 2.06463 4.42111Z'/%3e%3c/svg%3e") !important;
}

div.menu-item.menu-lg-down-accordion.show.menu-dropdown > span.menu-link > span.customized-menu-arrow {
    color: black !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%55B5B5C3' %3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.06463 4.42111C1.96161 4.22088 1.9809 3.9637 2.12863 3.78597L5.12847 0.177181C5.31402 -0.046034 5.63049 -0.060261 5.83532 0.145404C6.04015 0.351069 6.05578 0.698744 5.87023 0.921959L3.19406 4.14137L5.84414 7.06417C6.03896 7.27904 6.03835 7.62686 5.84278 7.84105C5.64721 8.05524 5.33073 8.05469 5.13591 7.83982L2.14806 4.54449C2.1141 4.50704 2.08629 4.46541 2.06463 4.42111Z'/%3e%3c/svg%3e") !important;
}


div.menu-item.menu-lg-down-accordion:hover > span.menu-link > span.customized-menu-title,
div.menu-item:hover.menu-lg-down-accordion.show.menu-dropdown > span.menu-link > .menu-title.customized-menu-title,
div.menu-sub.menu-sub-lg-down-accordion:hover + span.customized-menu-link,
div.menu-item:hover > a.menu-link:hover,
.menu-item > a.menu-link:hover,
.menu-item > a.menu-link:active,
.menu-item > a.menu-link.active,
div.menu-item.menu-lg-down-accordion.show.menu-dropdown > a.menu-link,
div.menu-item.menu-lg-down-accordion > span:hover,
div.menu-item.menu-lg-down-accordion:hover > span.menu-link,
div.menu-item.menu-lg-down-accordion:hover > span.menu-link:hover,
a.menu-item > div.menu-link.active,
a.menu-item > div.menu-link:hover {
    background-color: #f8f1f1 !important;
    color: var(--special-redish-color) !important;
}

.menu-state-primary .menu-item .menu-link:hover,
.menu-state-primary .menu-item .menu-link.active, .menu-state-primary .menu-item.hover:not(.here) > .menu-link:not(.disabled):not(.active):not(.here), .menu-state-primary .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here),
.menu-state-primary .menu-item .menu-link.active .menu-title {
    background-color: #f8f1f1 !important;
    color: var(--special-redish-color) !important;
}
.menu-item.menu-lg-down-accordion.hover.show > .menu-link > .menu-icon > .svg-icon,
.menu-link:hover > .menu-icon > .svg-icon,
.menu-link.active > .menu-icon > .svg-icon {
    color: black !important;
}

.menu-link > .menu-icon > .svg-icon {
    color: #A1A5B7 !important;
}

span.menu-title.customized-menu-title {
    color: #5E6278 !important;
    background-color: white !important;
    transition: color 0s !important;
    transition: background-color 0s !important;
}

.d-block.d-lg-none.menu-link {
    color: #5E6278 !important;
}

#user-layout-data-id {
    display: none;
    margin-left: 5%;
    min-width: 150px;
}

#user-layout-data-id > button {
    cursor: context-menu;
    max-width: 300px !important;
    width: auto;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

#user-layout-data-id > button:first-child > svg {
    margin-top: -0.4rem;
}

@media screen and (min-width: 600px) {
    #user-layout-data-id {
        display: inline;
        margin-left: 24% !important;
    }
}

@media screen and (min-width: 700px) {
    #user-layout-data-id {
        display: inline;
        margin-left: 25.5% !important;
    }
}

@media screen and (min-width: 800px) {

    #user-layout-data-id {
        display: inline;
        margin-left: 30% !important;
    }
}

@media screen and (min-width: 900px) {
    #user-layout-data-id {
        margin-left: 35% !important;
    }
}


@media screen and (min-width: 1200px) {
    #user-layout-data-id {
        margin-left: 30% !important;
    }
}


@media screen and (min-width: 1400px) {
    #user-layout-data-id {
        margin-left: 30% !important;
    }
}

@media screen and (min-width: 1600px) {
    #user-layout-data-id {
        margin-left: 25% !important;
    }
}




.footer {
    visibility: visible;
    display: inline-block;
    /*
        This part shouldn't exist but there is a weird bug where 
        google chrome is caching an old part of css code in this
        file where it hides the footer class in width under 768px.
        And even though I cleared the cache multiple times and in
        different ways, it still does that.
    */
}

a.footer-social-media-anchor:active > span.svg-icon.svg-icon-6.svg-icon-white,
a.footer-social-media-anchor:hover > span.svg-icon.svg-icon-6.svg-icon-white {
    color: #fff700;
}

a.footer-social-media-anchor:active,
a.footer-social-media-anchor:hover {
    border-color: #fff700 !important;
    --bs-border-opacity: 1.0 !important;
}

#newsletter-button:active > span > svg,
#newsletter-button:hover > span > svg {
    color: #fff700 !important;
}

#info-div-footer {
    width: 100%;
    height: auto;
    border-radius: 0.2rem;
}

@media screen and (min-width: 768px) {
    #info-div-footer {
        width: 19.3rem;
        height: 18.77rem;
        border-radius: 0rem;
    }
}

@media screen and (min-width: 992px) {
    #info-div-footer {
        border-radius: 0.55rem;
    }
}

@media screen and (min-width: 1200px) {
    #info-div-footer {
        border-radius: 0.8rem;
    }
}

@media screen and (min-width: 1400px) {
    #info-div-footer {
        width: 25rem;
        height: 24.32rem;
        border-radius: 1rem;
    }
}