@font-face {
	font-family: Gothic;
	font-style: normal;
	src: url("../fonts/font-gothic.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: GothicBold;
	font-style: normal;
	src: url("../fonts/font-gothic-bold.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: RedCircle;
	font-style: normal;
	src: url("../fonts/font-red-circle.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: EurostyleExtendedBold;
	font-style: normal;
	src: url("../fonts/font-eurostyle-extended-bold.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: Eurostyle;
	font-style: normal;
	src: url("../fonts/font-eurostyle.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: EurostyleBold;
	font-style: normal;
	src: url("../fonts/font-eurostyle-bold.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: Avenir;
	font-style: normal;
	src: url("../fonts/font-avenir.woff") format('woff');
	font-display: swap;
}

@font-face {
	font-family: AvenirHeavy;
	font-style: normal;
	src: url("../fonts/font-avenir-heavy.woff") format('woff');
	font-display: swap;
}

:root {
	--gothic: "Gothic", serif;
	--gothic-bold: "GothicBold", serif;
	--red-circle: "RedCircle", serif;
	--eurostyle-x-bold: "EurostyleExtendedBold", sans-serif;
	--eurostyle: "Eurostyle", sans-serif;
	--eurostyle-bold: "EurostyleBold", sans-serif;
	--avenir: "Avenir", serif;
	--avenir-heavy: "AvenirHeavy", serif;
}

body {
	font-family: "Montserrat", sans-serif;
  	font-optical-sizing: auto;
  	font-weight: 400;
  	font-style: normal;
}

#bears-den body {
	font-family: var(--gothic);
}

#heart-to-heart-fitness body {
	font-family: var(--red-circle);
}

h1, h2, h3, h4 {
	line-height: 1.125;
	-moz-osx-font-smoothing: grayscale; /*(For Firefox)*/
	-webkit-font-smoothing: antialiased; /*(For Chrome and Safari)*/
}

h1 {
	font-size: 4rem;
	margin-block-start: .0625em;
	margin-block-end: .0625em;
}

h2 {
	font-size: 3rem;
	margin-block-start: .125em;
	margin-block-end: .125em;
}

h3 {
	font-size: 2.25rem;
	margin-block-start: .25em;
	margin-block-end: .25em;
}

h4, .tabs h4 {
	font-size: 2rem;
	margin-block-start: .375em;
	margin-block-end: .375em;
}

h5 {
	font-weight: 700;
	font-size: 1.75rem;
	margin-block-start: .5em;
	margin-block-end: .5em;
}

h6 {
	font-weight: 700;
	font-size: 1.25rem;
	margin-block-start: .625em;
	margin-block-end: .625em;
}

em, blockquote {
	font-style: italic;
}

strong {
	font-weight: 700;
}

p, blockquote, ul, li {
	margin-block-start: .75em;
	margin-block-end: .5em;
	line-height: 1.5;
}

p, ul, li {
	font-size: 1rem;
	font-weight: 400;
	margin-block-start: .625em;
	margin-block-end: .625em;
}

p.small {
	font-size: .75rem!important;
}

nav li {
	margin-block-start: 0!important;
	margin-block-end: 0!important;
}

nav li a {
	padding: .625rem 0;
}

.h1 {
	font-size: 4rem;
	margin-block-start: .0625em;
	margin-block-end: .0625em;
}

.h2 {
	font-size: 3rem;
	margin-block-start: .125em;
	margin-block-end: .125em;
}

.h3 {
	font-size: 2.25rem;
	margin-block-start: .25em;
	margin-block-end: .25em;
}

.h4, .tabs h4 {
	font-size: 2rem;
	margin-block-start: .375em;
	margin-block-end: .375em;
}

.h5 {
	font-size: 1.75rem;
	margin-block-start: .5em;
	margin-block-end: .5em;
}

.h6 {
	font-size: 1.25rem;
	margin-block-start: .625em;
	margin-block-end: .625em;
}

.p {
	font-size: 1rem;
	margin-block-start: .625em;
	margin-block-end: .625em;
}

.eyebrow {
	font-size: .875rem;
	font-weight: 700;
}

.featured-article .background-black p {
	margin-block-start: .25em;
	margin-block-end: .25em;
}

.button-container a.button {
	font-size: .9375rem;
	font-weight: 700;
}

/******/
/* MEDIA QUERIES */
/******/

@media screen and (min-width: 64.0625rem) and (max-width: 93.75rem) {
	
	h1 {
		font-size: 3.5rem;
	}

	h2 {
		font-size: 2.75rem;
	}

	h3 {
		font-size: 2.25rem;
	}

	h4 {
		font-size: 1.875rem;
	}

	.h1 {
		font-size: 3.5rem;
	}

	.h2 {
		font-size: 2.75rem;
	}

	.h3 {
		font-size: 2.25rem;
	}

	.h4 {
		font-size: 1.875rem;
	}
	
}

@media screen and (min-width: 48rem) and (max-width: 64rem) {
	
	h1 {
		font-size: 1.875rem;
	}

	h2 {
		font-size: 1.625rem;
	}

	h3 {
		font-size: 1.5rem;
	}

	h4 {
		font-size: 1.25rem;
	}
	
	h5 {
		font-size: 1.125rem;
	}

	.h1 {
		font-size: 1.875rem;
	}

	.h2 {
		font-size: 1.625rem;
	}

	.h3 {
		font-size: 1.5rem;
	}

	.h4 {
		font-size: 1.25rem;
	}
	
	.h5 {
		font-size: 1.125rem;
	}
	
	p, .p {
		font-size: 1rem;
	}
	
}

@media screen and (max-width: 47.9375rem) {
	
	h1 {
		font-size: 1.75rem;
	}

	h2 {
		font-size: 1.5rem;
	}

	h3 {
		font-size: 1.375rem;
	}

	h4 {
		font-size: 1.25rem;
	}
	
	h5 {
		font-size: 1.125rem;
	}

	.h1 {
		font-size: 1.75rem;
	}

	.h2 {
		font-size: 1.5rem;
	}

	.h3 {
		font-size: 1.375rem;
	}

	.h4 {
		font-size: 1.25rem;
	}
	
	.h5 {
		font-size: 1.125rem;
	}
	
	p, .p {
		font-size: 1rem;
	}

}