:root {
    --black: #232323;
    --dark-gray: #3c3c3c;
    --gray: #949494;
    --light-gray: #dddddd;
    --very-light-gray: #f5f5f5;
    --white: #ffffff;
    
    --gold: #BA8A2C;
    
    --primary-heading: var(--black);
    --secondary-heading: var(--black);
    --tertiary-heading: var(--dark-gray);
    --body: var(--dark-gray);
    --form-borders: var(--gray);
    --borders: var(--light-gray);
    --links: var(--gold);
    --hover: var(--gray);
    --bg-hover: var(--light-gray);
    
    /*160px*/
    --xxlarge-margin: clamp(6rem, 10.5vw, 10rem);
    /*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*/
    --medium-small-margin: clamp(1rem, 1.25vw, 1.25rem);
    /*15px*/
    --small-margin: clamp(0.85rem, 0.95vw, 0.9375rem);
    /*10px*/
    --xsmall-margin: clamp(0.65rem, 0.775vw, 0.725rem);
    /*8px*/
    --xxsmall-margin: clamp(0.55rem, 0.675vw, 0.625rem);
    
    --xlarge-border-radius: 100px;
    --large-border-radius: 20px;
    --medium-border-radius: 12px;
    --small-border-radius: 4px;
    
    --hero-copy: clamp(1.35rem, 1.95vw, 1.75rem);
    --lead-copy: clamp(1.25rem, 1.75vw, 1.5625rem);
    --body-copy: clamp(1rem, 1.55vw, 1.125rem);
    --navigation: clamp(0.8rem, 1.125vw, 1.0625rem);
    --buttons: clamp(1rem, 1.125vw, 1.0625rem);
    --small-copy: clamp(0.85rem, 1.125vw, 0.9357rem);
} 

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

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

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

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

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

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

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

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

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

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