﻿:root {
	--primary-color: #743C97;
    --secondary-color: #f09336;
	--top-banner-bg-color: #743C97;
	--accent-color: #E4f6ff;
	--topic-menu-bg-color-hover: #F0F0F0;
	/* LINK COLORS */
	--primary-links-color-hover: #451c5f;
	--secondary-links-color-hover: #f09336;
	--footer-link-color: #c4c4c4;
    --footer-link-color-hover: #F7941D;
	/* BUTTON COLORS - PRIMARY */
	--primary-button-color: #a6dde5;
	--primary-button-color-hover: #7fced9;
	--primary-button-text-color: #222;
	--primary-button-text-color-hover: #222;
	--primary-button-border-color: #a6dde5;
	--primary-button-border-color-hover: #a6dde5;
	/* BUTTON COLORS - SECONDARY */
	--secondary-button-color: #743C97;
    --secondary-button-color-hover: #451c5f;
	--secondary-button-text-color: #005E91;
	--secondary-button-text-color-hover: #FEFEFE;
	--secondary-button-border-color: #005E91;
	--secondary-button-border-color-hover: #005E91;
	/* NAVIGATION COLORS */
	--nav-bg-color: #005E91;
	--nav-tab-color: #FEFEFE;
	--nav-tab-color-hover: #a6dde5;
	--nav-link-color: #743C97;
    --nav-link-color-hover: #451c5f;
	/* HEADING/BANNER BACKGROUND COLORS */
	--bg-color-1: #0693B2;
	--bg-color-2: #D48000;
	--bg-color-3: #91C500;
	/* HEADING/BANNER BACKGROUND COLORS WITH TRANSPARENCY */
	--rgba-color-1: rgb(6 147 178 / .5);
	--rgba-color-2: rgb(212 128 0 / .5);
	--rgba-color-3: rgb(145 197 0 / .5);
	/* FONT FAMILY */
	--font-family-heading: "Oswald", sans-serif;
	--font-family-body: "Noto Sans", sans-serif;
}
/*
body {
    font-family: "HCo Gotham SSm", Arial, Helvetica;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: "HCo Gotham SSm", Arial, Helvetica;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
*/
a.button {
    background-color: #a6dde5;
    color: #222;
}
a.button:focus, a.button:hover {
    background-color: #7fced9;
    color: #222;
}

.button.primary {
    background: #a6dde5;
    color: #222;
}

.button.primary:hover {
    color:#222;
}

.button.secondary{
    background-color: var(--secondary-button-color);
    color: #fff;
    border: 1px solid #222;
}

.button.secondary:focus, .button.secondary:hover {
    color: #fff;
}

.button.hollow.primary {
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
    background: transparent;
}

.button.hollow.primary:hover {
    border-color: var(--secondary-button-color-hover);
    color: var(--secondary-button-color-hover);
    background-color: transparent;
}

input#apply_coupon {
    background-color: #8dc63f;
    color: #222;
}

input#apply_coupon:hover {
    background-color: #5c8a1d;
    color: #eee;
}

#top-banner {
    background-color: #743C97;
    color: #fff;
    font-size: var(--small-font-size);
    padding: .5rem;
}

.home-announcements h3 {
    background: #743c97;
    color: #fff;
}

.block-featureditems h3 {
    background: #A7A8AA;
}

.also-bought h2 {
    background: #009DB4;
}

.contact-block-1, .contact-block-2, .contact-block-3, .contact-block-4 {
    /* overflow: hidden; */
    word-wrap: break-word;
}

.dropdown.menu > li.is-active > a {
    color: #a6dde5;
}

.mega-menu a:hover {
    color: #451c5f;
}

#product-summary tbody tr {
    background: #e4f6ff;
}

.cart-item-heading.secondary {
    background: #8DC63F;
}

.additional-colors {
    border-color: #f38a00;
}

p.acknowledgment-text {
    margin: 0;
    border-bottom: 1px solid #333;
    padding-bottom: 1em;
}

.alert-left-col {
    color: #000;
    background: #fdf1fb;
}

.cart-gift-card-message {
    display: none;
}

p.book-faq {
    display: none;
}

p.ship-reminder {
    padding: 1em 1em;
    background: #fbfaee;
    border-radius: .5em;
    border: 1px solid #ccc;
    font-size: small;
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR MEDIUM SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */
@media screen and (min-width: 40em) {
    @media screen and (min-width: 40em) {
        .caption-container.caption-right {
            background-image: linear-gradient(to left, rgb(0 0 0 / .5), rgb(0 0 0 / .5),transparent);
        }
        .caption-container.caption-left {
            background-image: linear-gradient(to right, rgb(0 0 0 / .5), rgb(0 0 0 / .5),transparent);
        }
    }
}


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

@media screen and (min-width: 64em) {
    .caption-container.caption-left > .caption {
        max-width: 67ch;
        padding: 2rem 4rem 2rem 1rem;
    }
    .caption-container.caption-right > .caption {
        max-width: 67ch;
        padding: 2rem 1rem 2rem 4rem;
    }
    #menu {
        background: #222;
    }
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     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) {
}
