/* default / demo page from https://russellgoldenberg.github.io/scrollama/sticky-js/ */

* {
	box-sizing: border-box;
}

html,
body {
	margin: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

body {
	min-height: 1280px;
	font-weight: 300;
	color: #2a2a2a;
}

p,
h1,
h2,
h3,
h4,
a {
	margin: 0;
	font-weight: 300;
}

a,
a:visited,
a:hover {
	color: #f30;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

#intro {
	max-width: 40rem;
	margin: 1rem auto;
	text-align: center;
}

.intro__overline {
	font-size: 1.4rem;
}

.intro__hed {
	font-size:2.5rem;
	text-transform: uppercase;
	font-weight: 900;
	letter-spacing: 0.05em;
}

.intro__dek {
	font-size: 1.1rem;
}

/* demo */

#intro {
	margin-bottom: 100px;
}

#outro {
	height: 640px;
}

/* scrollama */

#scroll {
	position: relative;
	border-top: 1px dashed #000;
	border-bottom: 1px dashed #000;
}

.scroll__graphic {
	position: -webkit-sticky;
	position: sticky;
	float: right;
	top: 0;
	right: 0;
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.scroll__text {
	position: relative;
	padding: 0 1rem;
	max-width: 30rem;
	width: 33%;
}

.step {
	margin: 2rem auto;
	/*border: 1px solid #333;*/
}

/*.step.is-active {
	background-color: lightgoldenrodyellow;
}*/

.step p {
	text-align: justify;
	padding: 1rem;
	font-size: 1.5rem;
}