:root {
	--sans: 'LabGrotesque', -apple-system, BlinkMacSystemFont, 'Segoe UI',
		'Roboto', 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji',
		'Segoe UI Emoji', 'Segoe UI Symbol';
	--serif: TiemposTextWeb, Georgia, Times, serif;
	--mono: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
		'Courier New', monospace;
	--tiemposhed: TiemposHeadline, TiemposTextWeb, Georgia, Times, serif;
	--metric: Metric, sans-serif;

	--z-bottom: -100;
	--z-middle: 0;
	--z-top: 100;
	--z-overlay: 1000;

	--fstep-3: 0.512rem;
	--fstep-2: 0.64rem;
	--fstep-1: 0.8rem;
	--fstep0: 1rem;
	--fstep1: 1.25rem;
	--fstep2: 1.563rem;
	--fstep3: 1.953rem;
	--fstep4: 2.441rem;
	--fstep5: 3.052rem;
	--fstep6: 3.815rem;
	--fstep7: 4.768rem;
	--fstep8: 5.96rem;

	/*https://tbimedia.s3.us-east-1.amazonaws.com/bistudios/_00/dev_edit/graphics/tools/colors.svg*/
	--black: #000;
	--offblack: #222;
	--gray4: #bcbcbc;
	--gray3: #d3d3d3;
	--gray2: #e8e8e8;
	--gray1: #f8f8f8;
	--white: #fff;
	--insider-blue: #096ffa;
	--blue4: #00007c;
	--blue3: #007eff;
	--blue2: #2eb8ff;
	--blue1: #aef7ff;
	--red3: #930000;
	--red2: #e62828;
	--red1: #f15213;
	--green3: #00896a;
	--green2: #33ba98;
	--green1: #a0f2b8;
	--purple3: #5700d3;
	--purple2: #8d45ff;
	--purple1: #baa4ff;
	--yellow3: #e0b500;
	--yellow2: #ffdc31;
	--yellow1: #fff92e;
	--pink3: #bf005b;
	--pink2: #ff57a7;
	--pink1: #ffbdef;
	--orange3: #db5e00;
	--orange2: #f37d00;
	--orange1: #ffb0b0;

	--gi-orange: #eaa700;
	--gi-blue: #002b37;
	--gi-teal: #19918b;
	--gi-red: #a51c54;
	--gi-offwhite: #fdfff7;

	--primary-color: var(--gi-teal);
	--secondary-color: var(--gi-red);
	--tertiary-color: var(--gi-orange);

	--links: var(--primary-color);
	--bg: var(--gi-offwhite);
	--text-black: #212529;
	--hed-color: var(--primary-color);
	--text-color: var(--gi-blue);

	--american: var(--gi-red);

	--text-shadow: 1px 1px 1px var(--bg), 1px -1px 1px var(--bg),
		-1px -1px 1px var(--bg), -1px 1px 1px var(--bg);
	--text-shadow-dark: 1px 1px 1px var(--gi-blue), 1px -1px 1px var(--gi-blue),
		-1px -1px 1px var(--gi-blue), -1px 1px 1px var(--gi-blue);
	--text-shadow-scrolly: 1px 1px 1px rgba(0, 0, 0, 0.6),
		1px 1px 12px rgba(0, 0, 0, 1);
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}
body {
	font-family: var(--sans);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	-ms-overflow-style: none; /* IE and Edge */
	scrollbar-width: none; /* Firefox */
	background-color: var(--bg) !important;
	color: var(--text-color) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
	color: var(--text-color);
}

input,
button,
select,
textarea {
	font-family: var(--sans);
}

.content-well {
	max-width: 640px;
	margin: 0 auto;
}

.typography p {
	font-family: var(--serif);
	font-size: var(--fstep1);
	color: var(--text-color);
}

.gi-content-well {
	width: 100%;
	max-width: 740px;
	margin: 0 auto;
	z-index: var(--z-bottom);
}

main {
	margin-top: -71px;
}

main a {
	color: inherit;
	text-decoration: none;
	box-shadow: 0 1px 0 0 var(--links);
	background-color: transparent;
	cursor: pointer;
	transition: 0.2s;
}
main a:hover {
	color: var(--links) !important;
	text-decoration: none;
	box-shadow: 0 1px 0 0 transparent !important;
}

*:focus {
	outline: 2px solid var(--primary-color);
}
::selection {
	background-color: #bbdece;
}

.serif {
	font-family: var(--serif);
}
.tiempos {
	font-family: var(--tiemposhed);
}
.sans {
	font-family: var(--sans);
}
.f-heavy {
	font-weight: 900;
}
.f-light {
	font-weight: 400;
}
.w-50 {
	width: 50%;
}
.w-100 {
	width: 100%;
}
.flex {
	display: flex;
}
.chart-wrapper {
	max-width: 900px;
	height: 450px;
	margin: 0 auto;
}

.mapboxgl-map a {
	box-shadow: none !important;
}

.visually-hidden {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}
.sv-bg {
	background: #111111;
}
.sv-overflow {
	overflow-x: hidden;
}
.padding {
	padding: 0 25px;
}
@media (min-width: 600px) {
	.padding {
		padding: 0 20px;
	}
}

main button {
	background-color: var(--gi-orange);
}

/* soundcite - v0.5.1 - 2017-07-10
 * Copyright (c) 2017 Tyler J. Fisher and Northwestern University Knight Lab
 */

/*PLAYER CHROME*/

@-webkit-keyframes spin {
	from {
		-webkit-transform: rotate(0deg);
		opacity: 0.4;
	}
	50% {
		-webkit-transform: rotate(180deg);
		opacity: 1;
	}
	to {
		-webkit-transform: rotate(360deg);
		opacity: 0.4;
	}
}

@-moz-keyframes spin {
	from {
		-moz-transform: rotate(0deg);
		opacity: 0.4;
	}
	50% {
		-moz-transform: rotate(180deg);
		opacity: 1;
	}
	to {
		-moz-transform: rotate(360deg);
		opacity: 0.4;
	}
}

@-ms-keyframes spin {
	from {
		-ms-transform: rotate(0deg);
		opacity: 0.4;
	}
	50% {
		-ms-transform: rotate(180deg);
		opacity: 1;
	}
	to {
		-ms-transform: rotate(360deg);
		opacity: 0.4;
	}
}

@-o-keyframes spin {
	from {
		-o-transform: rotate(0deg);
		opacity: 0.4;
	}
	50% {
		-o-transform: rotate(180deg);
		opacity: 1;
	}
	to {
		-o-transform: rotate(360deg);
		opacity: 0.4;
	}
}

@keyframes spin {
	from {
		transform: rotate(0deg);
		opacity: 0.2;
	}
	50% {
		transform: rotate(180deg);
		opacity: 1;
	}
	to {
		transform: rotate(360deg);
		opacity: 0.2;
	}
}

.soundcite-loaded {
	border-radius: 6px;
	padding: 0 5px;
	display: inline-block;
	cursor: pointer;
}

.soundcite-loaded:before {
	display: inline-block;
	content: '';
	vertical-align: -10%;
}

.soundcite-loading:before {
	margin-right: 0.5em;
	font-size: 0.75em;
	position: relative;
	top: -0.05em;
	height: 0.75em;
	width: 0.75em;
	border: 2px solid var(--gi-blue);
	border-right-color: transparent;
	border-radius: 50%;
	-webkit-animation: spin 1s linear infinite;
	-moz-animation: spin 1s linear infinite;
	-ms-animation: spin 1s linear infinite;
	-o-animation: spin 1s linear infinite;
	animation: spin 1s linear infinite;
}

.soundcite-play:before {
	font-size: 0.9em;
	position: relative;
	top: -0.05em;
	border: 0.5em solid transparent;
	border-left: 0.75em solid var(--gi-blue);
}

.soundcite-pause:before {
	font-size: 0.9em;
	position: relative;
	top: -0.05em;
	height: 1em;
	border-left: 0.75em double var(--gi-blue);
	border-right: 0.5em solid transparent;
}

.tick {
	font-size: 14px;
	font-weight: 400;
	font-family: var(--sans);
}

span.label-chart {
	--label-padding: 30px;
	position: absolute;
	font-weight: 900;
	font-family: var(--sans);
	font-size: 18px;
	line-height: 1.3;
	pointer-events: none;
}

.typography {
	line-height: 1.9!important;
}

.l-masthead, .drawer {
	background-color: var(--bg)!important;
}