:root {
    --primary-color: #154734;
    --secondary-color: #FFD100;
    --top-banner-bg-color: #AD00FE; /*NEW*/
    --accent-color: #E4f6ff; /*NEW*/
    --topic-menu-bg-color-hover: #F0F0F0; /*NEW*/
    /* LINK COLORS */
    --primary-links-color-hover: #DC582A;
    --secondary-links-color-hover: #FFD100;
    --footer-link-color: #C4C4C4;
    --footer-link-color-hover: #FFD100;
    /* BUTTON COLORS - PRIMARY */
    --primary-button-color: #154734; /*NEW*/
    --primary-button-color-hover: #00313C;
    --primary-button-text-color: #FEFEFE; /*NEW*/
    --primary-button-text-color-hover: #FEFEFE; /*NEW*/
    --primary-button-border-color: #154734; /*NEW*/
    --primary-button-border-color-hover: #00313C; /*NEW*/
    /* BUTTON COLORS - SECONDARY */
    --secondary-button-color: #FFD100;
    --secondary-button-color-hover: #001623;
    --secondary-button-text-color: #154734; /*NEW*/
    --secondary-button-text-color-hover: #FEFEFE; /*NEW*/
    --secondary-button-border-color: #154734; /*NEW*/
    --secondary-button-border-color-hover: #154734; /*NEW*/
    /* NAVIGATION COLORS */
    --nav-bg-color: #154734; /*NEW*/
    --nav-tab-color: #FEFEFE; /*NEW*/
    --nav-tab-color-hover: #FFD100; /*NEW*/
    --nav-link-color: #154734;
    --nav-link-color-hover: #202020;
    /* HEADING/BANNER BACKGROUND COLORS */
    --bg-color-1: #154734;
    --bg-color-2: #FFD100;
    --bg-color-3: #DC582A;
    /* HEADING/BANNER BACKGROUND COLORS WITH TRANSPARENCY */
    --rgba-color-1: rgb(255 209 0 / .5);
    --rgba-color-2: rgb(220 88 42 / .5);
    --rgba-color-3: rgb(21 71 52 / .5);
    /* FONT FAMILY */
    --font-family-heading: "Oswald", sans-serif;
    --font-family-body: "Noto Sans", sans-serif;
}

footer {
    background: var(--primary-color);
}

.block-popularitems h3 {
    background: var(--bg-color-2);
}

.home-announcements h3 {
    background: var(--bg-color-1);
    color: #fff;
}

.also-bought h2 {
    background: var(--bg-color-2);
}

span#looked-at-these-heading {
    color: #202020;
}

#footer-copyright {
    background: #3a3a3a;
}

.frame-announce {
    display: block;
    margin: 1em auto .5em auto;
    background: var(--secondary-color);
    color: #0a0a0a;
    padding: 1em;
    font-size: inherit;
    line-height: inherit;
    border-radius: var(--border-radius-md);
}

.card {
    border-radius: var(--border-radius-md);
}

.card-divider {
    background: var(--primary-color);
    color: var(--primary-button-text-color);
}

#product-info #product-options-list .product-option ul li button.selected, #product-info #product-options-list .product-option ul li button.available:hover {
    background: #e7ffe1;
}

#footer-cookies a {
    color: var(--primary-color);
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR MEDIUM SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */
@media screen and (min-width: 40em) {
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 64em) {
    .mega-menu {
        padding: .5rem 0;
    }
        .mega-menu > li > ul > li.is-dropdown-submenu-item a:hover, .mega-menu > li > ul > li.is-dropdown-submenu-item a:focus {
        background: #ffd100;
    }
    .mega-menu.menu .is-active > a {
        background: #ffd100;
        color: var(--nav-link-color-hover);
    }
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR X-LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 75em) {
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR XX-LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 90em) {
}