body {
	-webkit-font-smoothing: auto;
	font: $museo;
	font-size: 12px;

	@include small-screen {
		font-size: 16px;
	}

	@include retina-screen {
		-webkit-font-smoothing: antialiased;
	}
}

p,
.body {
	line-height: 1.6;
	margin-bottom: $outer-margin;
	color: $alex-text;

	span {
		font-weight: 700;
	}
}

b,
strong {
	font-weight: 700;
}

em {
	font-style: italic;
}

.section-header {
	font-weight: 700;
	color: $alex-blue;
	font-size: 1.5em;
	margin-bottom: 1em;
	text-transform: uppercase;
}

.explanation {
	font-weight: 100;
	font-size: 1.375em;
	margin-bottom: 0;

	li {
		margin: 0 0 $inner-margin 1em;
		list-style-type: disc;
		list-style-position: outside;

		span {
			display: inline;
		}
	}
	&:last-child {
		margin-bottom: $inner-margin;
		ul {
			margin-bottom: 0.5em;
		}
	}

}

.explanation-number,
.subheader {
	display: block;
	font-size: 1.375em;
	font-weight: 700;
	color: $alex-black;
	margin-bottom: $inner-margin;
}

.subheader {
	line-height: 2;
}

.explanation-bold-result {
	border-top: 1px solid $alex-blue;
	padding-top: 0.75em;
}

.line {
	width: 100%;
	border-bottom: 1px solid $alex-blue;
	margin: 1.75em 0 $outer-margin;
}

.question,
.question_text, //backward compatibility
.question-text,
header {
	font: $foro;
	font-size: 2em;
	color: $alex-text;
	margin-bottom: $inner-margin;
}


.footnote {
	color: $alex-text;
	margin-bottom: 2.5em;
}

.error {
	color: $error;
	font-size: 1em;
}

header > h1 {
	font: $museo;
	font-size: 18px;
	color: $alex-text;
	margin-bottom: 0;

	&:empty {
		&:after {
			display: none;
		}
	}
}

.module-header {
	font-size: 1.1em;
	color: $alex-text;
}

.plan-reveal {
	font: $foro;
	font-size: 3em;
	text-align: center;
	color: $alex-navy;
	width: 100%;
    height: 90%;
    max-height: 470px;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    @include small-screen {
    	width: 70%;
    	min-height: 340px;
    }

    @media (max-width: 360px) {
    	font-size: 2.5em;
    }
}

.closedcaption-text {
	color: $alex-white;
	line-height: 2.5em;
	font-size: 1.5625em;
	font-family: $museo;
	letter-spacing: .5px;
}

// global display text overrides
// should cover all text fade-ins (not cards or summary)
.display-text {
	animation: text-on 200ms ease-in-out;
	animation-fill-mode: forwards;

	&.section-header,
	&.no-fade {
		animation: none;
		transition: none;
	}
}