:root {
    --black: #000000;
    --dark-gray: #2B2B25;
    --gray: #A7B0AD;

    --brown: #45423B;
    --tan: #615F57;
    --tan-light: #807E74;
    --tan-lighter: #D1CFCB;

    --cream: #E8E5DD;
    --white: #fff;

    --red: #931818;
    --pink: #A64949;

    --borders: var(--gray);
    --link: var(--pink);
    --hover: var(--tan);
    --active: var(--tan-lighter);
    --bg-hover: var(--tan-lighter);

    --body: var(--brown);
    --primary-heading: var(--dark-gray);
    --secondary-heading: var(--tan);

    /*120px*/
    --xxlarge-margin: clamp(6rem, 7.5vw, 7.5rem);
    
    /*60px*/
    --xlarge-margin: clamp(2rem, 3.75vw, 3.75rem);
    
    /*40px*/
    --large-margin: clamp(1.85rem, 2.5vw, 2.5rem);
    
    /*30px*/
    --medium-margin: clamp(1.275rem, 1.75vw, 1.75rem);
    
    /*20px*/
    --small-margin: clamp(0.85rem, 1.125vw, 1.125rem);
    
    /*16px*/
    --xsmall-margin: clamp(0.75rem, 1vw, 1rem);
    
    /*12px*/
    --xxsmall-margin: clamp(0.55rem, 0.75vw, 0.75rem);

    /*6px*/
    --xxxsmall-margin: clamp(0.35rem, 0.375vw, 0.375rem);

    /*Fonts*/
    --body-copy: clamp(1rem, 1.175vw, 1.175rem);
    --small-copy: clamp(0.85rem, 1vw, 1rem);
    --navigation: clamp(1.375rem, 1.625vw, 1.625rem);
    --tophat-nav: clamp(1.125rem, 1.25vw, 1.25rem);
    --button: clamp(1.125rem, 1.375vw, 1.375rem);

    /*Radius*/
    --large-border-radius: 16px;
    --medium-border-radius: 8px;
    --small-border-radius: 4px;
    
} 

/*Text Colors*/
.black{
	color: var(--black);
}

.dark-gray{
	color: var(--dark-gray);
}

a.dark-gray{
	color: var(--dark-gray) !important;
}

a.dark-gray:hover{
	color: var(--hover) !important;
}

.gray{
	color: var(--gray);
}

.brown{
	color: var(--brown);
}


.tan{
	color: var(--tan);
}

.tan-light{
    color: var(--tan-light);    
}

.tan-lighter{
    color: var(--tan-lighter);
}

.red{
    color: var(--red);
}

.pink{
    color: var(--pink);
}

.white{
	color: var(--white);
}

.white{
	color: var(--cream);
}

/*Background Colors*/
.bg-black{
    background-color: var(--black);
    color: var(--white);
}

.bg-dark-gray{
    background-color: var(--dark-gray);
}

.bg-gray{
    background-color: var(--gray);
}
.bg-tan{
    background-color: var(--tan);
    color: var(--black);
}
.bg-tan-light{
    background-color: var(--tan-light);
}

.bg-red{
    background-color: var(--red);
    color: var(--white);
}

.bg-pink{
    background-color: var(--pink);
    color: var(--white);
}

.bg-white{
	background-color: var(--white);
}

.bg-cream{
    background-color: var(--cream);
}