@import url("https://fonts.googleapis.com/css?family=Montserrat");

:root {
    --color-primary: #59358C;
    --color-secondary: #52AE32;
    --color-text: #686868;
    --color-accent: #52AE32;
    --color-1e4acae: #000;
    --color-23eb9a7: #FFF;
    --color-6cb3898: #E5E5E5;
    --color-99eb751: #EEEEEE;
    --color-buttonhover: #BDBDBD;
    --color-5022e7c: #FF6C37;
}

body {
    font-family: 'Montserrat',Roboto,Helvetica Neue,sans-serif;
    font-weight: 400;
}

.max-body-width {
    background-image: url('../Images/background.png');
    background-position: center center;
}

.desktop-menu-container, .desktop-menu-container-sticky {
    background: var(--color-99eb751);
}

.nav-tabs {
    --bs-nav-tabs-color: var(--color-primary);
    --bs-link-hover-color: var(--color-secondary);
    --bs-nav-tabs-link-active-color: var(--color-secondary);
    --bs-nav-tabs-link-focus-color: var(--color-secondary);
    --bs-nav-tabs-link-hover-color: var(--color-secondary);
}

    .nav-tabs a {
        color: var(--color-primary);
    }

a.nav-link:hover {
    color: var(--color-secondary);
}

.btn-success {
    --bs-btn-bg: var(--color-secondary);
    --bs-btn-border-color: var(--color-secondary);
    --bs-btn-hover-bg: var(--color-buttonhover);
    --bs-btn-hover-border-color: var(--color-buttonhover);
    --bs-btn-active-bg: var(--color-secondary);
    --bs-btn-active-border-color: var(--color-secondary);
}

.order-direct-container, .btn-primary, .delivery-container .btn-primary, .delivery-container .btn-primary:hover, .delivery-container .btn-primary:focus, .login_action_container .btn-primary, .login_action_container .btn-primary {
    background: var(--color-primary) !important;
}

    .btn-primary:hover, .btn-primary:focus, .service-btn:hover, .service-btn:focus, .login_action_container .btn-primary:hover, .login_action_container .btn-primary:focus {
        background: var(--color-buttonhover) !important;
    }

a, .header-points a, .header-points span, .product-points, .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 {
    color: var(--color-primary);
}

    a:hover, a:focus {
        color: var(--color-secondary);
    }

.product-details-icon mat-icon:hover {
    color: var(--color-primary) !important;
}

.mobile-header-points span {
    color: #FFF;
}

.max-body-width .logo-container {
    padding-bottom: 0;
}

    .max-body-width .logo-container img {
        max-width: 70%;
        margin: 10px;
    }

.sticky-logo img {
    max-width: 70%;
    margin: 5px 10px 0 10px;
}

.delivery-container .btn-primary, .delivery-container .btn-primary:hover, .delivery-container .btn-primary:focus {
    border: 1px solid #3186cf;
}

.ngrs-range-slider .ngrs-join {
    background-image: linear-gradient(#52AE32, #52AE32);
}

.register-field button[type="submit"] {
    float: right;
    margin-right: 5px;
    padding: 15px 40px;
}

.wrapper_main_content_loggedin {
    /* must be same height as the footer */
    padding-bottom: 180px;
}

.wrapper_main_footer_loggedin {
    /* negative value of footer height */
    margin-top: -180px;
    height: 180px;
}

.footer-container {
    margin-top: -12px !important;
}

.unauthenticated .footer-container {
    margin-top: -3px !important;
}

.login_action_container .btn-primary, .login_action_container .btn-primary:focus {
    background-color: var(--color-secondary) !important;
}

    .login_action_container .btn-primary:hover {
        background-color: var(--color-buttonhover) !important;
    }

.social, .product-details-icon span:hover {
    color: var(--color-primary);
}

.desktop-menu-container li a, .desktop-menu-container-sticky li a {
    text-transform: uppercase;
    color: var(--color-primary);
    font-weight: normal;
}

    .desktop-menu-container li a:hover, .desktop-menu-container-sticky li a:hover {
        color: var(--color-secondary);
    }

.service-btn-active, .service-btn:hover {
    color: var(--color-secondary) !important;
    background-color: var(--color-primary) !important;
}

.catalog-block:hover, .product-recommend, .loginblock .front {
    background-color: var(--color-primary);
}

.catalog-block .catalog-icon-savingsgoal-has-savingsgoal {
    background-image: url(../Images/catalog_icon_savingsgoal_has_savingsgoal.png);
}

.catalog-block-savingsgoal-overlay {
    background-color: var(--color-primary);
    color: var(--color-secondary);
}

.savings-goal-reached-percent, .product-offer {
    background: var(--color-secondary) !important;
}


h1, h2 {
    text-transform: uppercase;
    font-weight: bold;
    color: var(--color-primary);
}

h1 {
    font-size: 30px;
}

.footer-container li.main, .footer-container li.main a {
    color: var(--color-primary);
}

li.active a {
    color: var(--color-secondary) !important;
}

.footer-container li.main a:hover {
    color: var(--color-secondary);
}

.privacylink:hover {
    text-decoration: underline !important;
}

body.max-body-width:has(>.theme-XMAS2023) {
    background: url('../Images/background-xmas.png') no-repeat fixed center -126px !important;
}

.touch, figure img {
	width: 300px !important;
	max-width: 300px !important;
	display: block;
}