﻿@font-face { 
    font-family: 'Arial Bold';
    font-style: normal;
    font-weight: normal;
    src: url('../Font/ARIALBD 1.woff') format('woff'), url('../Font/ARIALBD 1.ttf') format('truetype');
}

/* Algemeen */

:root {
    --blue: #195AF6;
    --green: #2BA121;
    --background: #EBFAFF;
    --primary: #195AF6;
    --primaryhover: #094AE6;
    --success: #2BA121;
    --successhover: #1B9111;
    --textcolor: #195AF6;
    --greyaccentdark: #414042;
    --greyaccentlight: #E8E8E8;
}

body {
    font-family: "Helvetica Neue Regular", Arial;
    font-size: 16px !important;
}

body.v25 {
    font-size: 16px !important;
}

.v25 input,
.v25 .form-select,
table.mat-table .table-header .mat-header-cell,
table.mat-table .mat-form-field,
.mat-paginator,
.mat-select-panel .mat-option,
.mat-paginator-page-size .mat-select-trigger,
#mobileMenu,
#mobileMenu .mobile-dropdown-menu,
.mobile-product-filter-item,
.voucher-history-table .header,
.product-container-blocks .product-title,
.product-details-points-todo,
.display-options-row .display-options-col {
    font-size: 16px;
}

.v25 .btn {
    --bs-btn-font-size: 16px !important;
}

h1,
h2 {
    font-family:  "Relative Black", "Arial Bold";
}

h1,
.product-detail-title {
    color: var(--blue);
}

h2 {
    color: var(--green);
}

.max-body-width {
    background-color: var(--background) !important;
}

.btn-primary, .service-btn:hover, .service-btn-active, .catalog-block:hover, .catalog-block-savingsgoal-overlay, .catalog-block-savingsgoal-overlay .catalog-block-savingsgoal-overlay-inner .progress-container .progress-inner, .slider-dummy-button:hover, .slider-dummy-button:focus, .order-direct-container {
    background: var(--primary) !important;
}

    .btn-primary:hover {
        background: var(--primaryhover) !important;
    }


.product-container-blocks .product-image .helper {
    height: auto !important; /* fixes catalog images*/
}

a, .header-points a, .header-points .mat-icon, .product-icon div .mat-icon:hover, .savings-goal-star-active, .fade-out-block-button-open span, .fade-out-block-button-open .mat-icon, .fade-out-block-button-close span, .fade-out-block-button-close .mat-icon, .product-container-blocks .product-title a:hover, .product-details-icon .mat-icon:hover {
    color: var(--primary);
}

    a:hover, a:focus {
        color: var(--primary) !important;
    }

.wrapper_main_content_loggedin {
    /* must be same height as the footer */
    padding-bottom: 196px;
}

.wrapper_main_footer_loggedin {
    /* negative value of footer height */
    margin-top: -196px;
    height: 196px;
}

.ngrs-range-slider .ngrs-join, .savings-goal-dropdown .progress-container .progress-inner {
    background-image: linear-gradient(var(--primary), var(--primary));
}

@media (max-width: 991px) {
    .savings-goal-star-active, .savings-goal-star-active:hover {
        color: var(--primary) !important;
    }
}

.catalog-block-image-savingsgoal {
    background-image: url(../images/static_catalog_block_savingsgoal.jpg);
}

.savings-goal-dropdown .progress-container .progress-overlay {
    color: #FFF;
    font-weight: normal;
}

.savings-goal-dropdown {
    line-height: 21px;
}

/* Footer */
.footer-container {
    background: var(--background);
    color: var(--textcolor);
    font-size: 16px;
}

    .footer-container a, .footer-container a:hover {
        color: inherit;
    }

    .footer-container li {
        line-height: 30px;
    }

.footer-contaienr li.main {
    font-size: 16px;
}

/* Header */

.container-fixed {
    margin-top: 5px;
}

.header-pull-down {
    line-height: 65px;
    margin: 0px !important;
}

.logo-container {
    padding: 0;
}

    .logo-container img {
        height: 60px;
    }

.header-beforelogin {
    margin-bottom: 10px;
}

.desktop-menu-container, .desktop-menu-container-sticky, .row-header .dropdown-menu {
    background: var(--primary);
    color: #FFF;
}

.desktop-menu-container {
    margin-top: 6px;
    background: var(--primary);
}

    .desktop-menu-container ul li {
        margin-right: 0;
        margin-left: 45px;
    }

.header-pull-down .basket-click {
    line-height: 21px;
    margin-top: 6px;
}

.header-pull-down .basket-outer .basket-click {
    margin-top: 10px;
}

.desktop-menu-container-sticky li {
    margin: 0 5px !important;
}

    .desktop-menu-container li a, .desktop-menu-container-sticky li a {
        color: #FFF;
        font-weight: normal;
        font-size: 16px;
    }

        .desktop-menu-container li a:hover, .desktop-menu-container li a:visited, .desktop-menu-container-sticky li a:hover {
            background: var(--primary);
            text-decoration: underline;
            color: #FFF !important;
        }

.desktop-menu-container-sticky .basket-click {
    background: url("/images/basket_icon_mobile.png") no-repeat bottom;
}

.desktop-menu-container-sticky .header-points a, .desktop-menu-container-sticky .header-points span {
    color: #FFF;
}

    .desktop-menu-container-sticky .header-points a:hover, .desktop-menu-container-sticky .header-points span:hover {
        color: #FFF;
        text-decoration: underline;
    }


.dropdown-menu li {
    background: var(--primary);
}

    .dropdown-menu li a {
        text-transform: none;
        font-size: 16px;
        background: var(--primary);
        color: #FFF;
    }

.desktop-menu-container li a, .desktop-menu-container .dropdown-menu {
    background: var(--primary);
    color: #FFF;
}

    .desktop-menu-container li a:hover {
        background: var(--primary);
        text-decoration: underline;
        color: #FFF;
    }

.sticky-logo {
    display: none;
}

.desktop-menu-container-sticky .sticky-logo {
    margin-top: 5px;
}

.desktop-menu-container-sticky .sticky-logo {
    margin-top: 0;
}

    .desktop-menu-container-sticky .sticky-logo .logo-row .logo-col {
        position: absolute;
    }

.desktop-menu-container-sticky .sticky-items {
    margin-left: 13%;
}

.desktop-menu-container-sticky .dropdown-menu, .desktop-menu-container-sticky .dropdown-menu a {
    background: var(--primary) !important;
    color: #FFF;
}

/* Catalog */
.product-points {
    font-size: 16px;
    color: var(--blue);
}

.catalog-block-savingsgoal-overlay .catalog-block-savingsgoal-overlay-inner .overlay-product-title {
    border-color: var(--blue);
}

.catalog-block .catalog-icon-savingsgoal-has-savingsgoal {
    background-image: url(../Images/catalog_icon_savingsgoal_has_savingsgoal.png);
}

.productfilter-outer {
    font-size: 16px;
}

.product-details-button .btn-primary {
    background: var(--success) !important;
}

.product-details-button .btn-primary:hover {
    background: var(--successhover) !important;
}

/* .product-icon,
.product-icon div a {
    color: var(--textcolor);
}
.product-icon div a:hover {
    color: var(--primary);
} */

/* Mobile */
.mobile-menu, .mobile-header {
    background: var(--primary);
}

    .mobile-menu .sidebar-nav li a:hover {
        border-left: 2px solid var(--primary);
    }

.product-filter-mobile-open:hover, .display-options-row .display-options-col .glyphicon-inactive:hover {
    color: var(--primary);
}

.logo-container-mobile {
    padding-top: 40px;
    z-index: 9;
}

.logo-container-mobile .logo-row .logo-col {
    display: flex;
    justify-content: center;
}

.mobile-header .basket-click {
    background: none;
    font-size: 16px;
}

.header-top-item {
    color: var(--primary);
    font-size: 16px;
}

    .header-top-item .user-list {
        line-height: 18px;
        width: auto !important;
        font-size: 16px !important;
    }

.desktop-menu-container-sticky .sticky-items .basket-click {
    color: #FFF;
}

.order-steps {
    background: var(--blue);
    color: #FFF;
}

    .order-steps div.disable-step:hover {
        background-color: var(--primary) !important;
    }

    .order-steps div.active-step, .order-steps div:hover {
        background-color: var(--primary);
        color: #FFF;
    }

.footerlogo img {
    width: auto;
    max-width: 100%;
    height: auto;
    margin-top: -20px;
}

.basket-list .basket_top, .basket-list .basket_total_to {
    border-color: var(--blue) !important;
    box-shadow: 0 0 3px var(--blue);
}

.basket-list {
    border-color: var(--blue) !important;
}

.header-pull-down .basket-list {
    margin-top: -53px;
    margin-left: -224px;
    line-height: 21px;
}

.basket-list .basket_top, .basket-list .basket_total {
    background: var(--blue);
}

    .basket-list .basket_top .basket_total_top {
        background-color: #FFF;
        color: var(--primary);
    }

.btn.btn-success {
    background-color: var(--success);
}

    .btn.btn-success:hover {
        background-color: var(--successhover);
    }

.points-container {
    background-color: var(--blue);
}

.loginblock .front,
.loginblock .back,
.loginblock .frontedge,
.loginblock .backedge {
    background-color: var(--blue);
}

.login_links a:hover {
    color: #FFF !important;
    text-decoration: underline !important;
}

.login_action_container .btn-primary,
.login-secondary-btn {
    background: var(--success) !important;
}

.login_action_container .btn-primary:hover,
.login_action_container .btn-primary:focus,
.login-secondary-btn:hover,
.login-secondary-btn:focus {
    background: var(--successhover) !important;
    color: #FFF !important;
}

#UserName,
#UserNameLogin,
#Password {
  background: var(--greyaccentlight);
  color: var(--greyaccentdark);
}

.loginblock .success {
    color: #FFF;
}
.loading_box2 img {
    padding: 16px 16px 0px 0px;
    background: url('/Areas/Hilterman-DealerPlus/Images/login_loader_blue.gif');
    background-size: auto;
    width: 0px;
    height: 0px;
}