/* Stylesheet for Haunt Command Colors
-------------------------------------------------------------- */

html { }

/* ----------- Main Site Colors -------- */

:root { 

        --main-color: #ff0000; 
        --main-three-quarter: rgba(255,255,255, 0.75);
        --main-fifty: rgba(255,255,255, 0.50);
        --main-quarter: rgba(255,255,255, 0.25);        
        --alt-color: #000;
        --alt-fifty: rgba(157,157,157,0.50);
        --alt-fifty-solid: #9d9d9d; 
        --alt-quarter: #3f3f3f; 
        --reader-bg: #880000; /* must use hex color */
        --cta-button: rgba(176, 0, 0, 0.9);
        --cta-hover: rgba(255, 0, 0, 0.95);
        --ip-border: #4d0000;
}
/* Conversion for use as classes */

        .main-color { color: var(--main-color); }
        .main-three-quarter { color: var(--main-three-quarter); }
        .main-fifty { color: var(--main-fifty); }
        .main-quarter { color: var(--main-quarter); }
        .alt-color { color: var(--alt-color); }
        .alt-fifty { color: var(--alt-fifty); }
        .alt-fifty-solid { color: var(--alt-fifty-solid); }
        .alt-quarter { color: var(--alt-quarter); }

/* Icon SVG Color: Red (include this class in div inline css of svg) */

.icon-svg-color img{ filter: invert(15%) sepia(100%) saturate(7093%) hue-rotate(5deg) brightness(94%) contrast(124%); }


/* ----------------------------------------------------------------------- */


a:hover { color: var(--main-color) !important; }

/* Header Cart */

span.count { background-color: var(--main-color); }

/* ---------------- */
/* Scrolling Banner */
/* ---------------- */

/* Container styles */

.scrolling-text-container { background: var(--main-fifty); border-image: linear-gradient(to right, var(--main-color), var(--main-color)) 1;}