:root { /* Site Fonts */ --siteFont: var(--siteFont2), Helvetica Neue, Helvetica, Arial, sans-serif; --siteFont1: 'Sabon'; /* sans-serif */ --siteFont2: 'Moderat'; /* sans-serif */ --siteFont3: 'Montserrat'; /* sans-serif */ /* Site Scale */ --siteScale: 16px; /* Keep as px value for all the other rem values to be based off of */ /* Body Fonts */ --bodyFontSize: 1rem; --bodyFont: var(--siteFont); /* Title Fonts - Desktop At Bottom */ --titleFontSize1: 2.25rem; --titleFontSize2: 2rem; --titleFontSize3: 1.75rem; --titleFontSize4: 1.5rem; --titleFontSize5: 1.375rem; --titleFontSize6: 1.125rem; /* Border Radius Defaults */ --borderRadius: 0.5rem; /* Global Radius for most if not all things (8px) */ --borderRadiusXS: 0.5rem; --borderRadiusSM: 1rem; --borderRadiusMD: 2rem; --borderRadiusLG: 3rem; --borderRadiusXL: 4rem; --borderRadiusPill: 100vw; --borderRadiusCircle: 100rem; --borderRadiusCheckbox: 0.25rem; /* Drop Shadow Defaults */ --dropShadow: 0 0 1.25rem hsla(var(--siteColor1), 0.15); --focusShadow: 0 0 0 0.125rem hsla(var(--siteColor1), 0.25); --focusShadowLight: 0 0 0 0.125rem hsla(var(--white), 0.25); --focusShadowDark: 0 0 0 0.125rem hsla(var(--black), 0.25); --dropShadowFilter: drop-shadow(0.0625rem 0.0625rem 0.125rem hsla(var(--black), 70%)); --dropShadowFilterLight: drop-shadow(0.0625rem 0.0625rem 0.125rem hsla(var(--white), 70%)); /* Button Drop Shadow */ --btnShadow: 0 0 0 0.125rem hsla(var(--black), 0.5); --btnShadowWhite: 0 0 0 0.125rem hsla(var(--white), 0.5); --btnShadowBlack: 0 0 0 0.125rem hsla(var(--black), 0.5); --btnShadowColor1: 0 0 0 0.125rem hsla(var(--siteColor1), 0.5); --btnShadowColor2: 0 0 0 0.125rem hsla(var(--siteColor2), 0.5); --btnShadowColor3: 0 0 0 0.125rem hsla(var(--siteColor3), 0.5); --btnShadowColor4: 0 0 0 0.125rem hsla(var(--siteColor4), 0.5); --btnShadowColor5: 0 0 0 0.125rem hsla(var(--siteColor5), 0.5); --btnShadowColor6: 0 0 0 0.125rem hsla(var(--siteColor6), 0.5); /* Button Outline */ --btnOutlineWhite: 0.0625rem solid hsl(var(--white)); --btnOutlineBlack: 0.0625rem solid hsl(var(--black)); --btnOutlineColor1: 0.0625rem solid hsl(var(--siteColor1)); --btnOutlineColor2: 0.0625rem solid hsl(var(--siteColor2)); --btnOutlineColor3: 0.0625rem solid hsl(var(--siteColor3)); --btnOutlineColor4: 0.0625rem solid hsl(var(--siteColor4)); --btnOutlineColor5: 0.0625rem solid hsl(var(--siteColor5)); --btnOutlineColor6: 0.0625rem solid hsl(var(--siteColor6)); /* Font Weight Defaults */ --wUltraLight: 100; --wThin: 200; --wLight: 300; --wRegular: 400; --wMedium: 500; --wBold: 600; --wHeavy: 700; --wBlack: 800; --wExtraBlack: 900; /* Sup - Settings for Sup Text <sup> */ --supFontSize: 60%; --supLineHeight: 125%; --supTop: -0.3125rem; /* Header Height - used by JS and CSS */ --headerHeight: 9rem; --anchorScrollOffset: 7.1875rem; /* 115px */ /* Layout Sizing */ --bsContainerWidth: 73.125rem; /* 1170px */ --bsContainerWideWidth: 100rem; /* 1600px */ --sidebarWidth: 23.4375rem; /* 375px */ --mainContainerWithSidebar: 49.6875rem; /* ADMIN COLORS */ --primary: hsl(var(--siteColor1)); --secondary: hsl(var(--siteColor2)); }
/* Desktop */
@media (min-width: 1025px) {
:root { --titleFontSize1: 3rem; --titleFontSize2: 2.75rem; --titleFontSize3: 2.5rem; --titleFontSize4: 2.25rem; --titleFontSize5: 2rem; --titleFontSize6: 1.75rem; }
}