.grades-info,
.enrollment-info {
	display: flex;
	flex-direction: column;

	.info-icon {
		padding-left: 5px;
		width: 25px;
	}
	.opaque {
		opacity: 1 !important;
	}

	.info-text {
		opacity: 1 !important;
		line-height: 1.6;
		font-weight: lighter;
	}

	.header {
		display: flex;
		flex-direction: row;
		align-items: center;

		margin-bottom: 5px;

		.square {
			width: 16px;
			height: 16px;
			border-radius: 3px;
			margin-right: 8px;
			margin-bottom: 4px;
		}

		.course {
			font-weight: bold;
			color: $bt-base-text;
			font-size: 18px;
		}
	}

	.title,
	.info {
		font-size: 16px;
		color: $bt-grey-text;
	}

	.title {
		margin-bottom: 5px;
	}

	.info {
		margin-bottom: 30px;
	}

	h6 {
		font-size: 16px;
		font-weight: bold;
		margin-bottom: 5px;
	}

	.stat-section {
		.date {
			font-weight: bold;
			padding-bottom: 5px;
		}
		.text {
			padding-right: 8px;
		}
		.waitlisted-stat {
			margin-top: 5px;
			margin-bottom: 20px;
		}
	}

	span {
		margin-right: 5px;
	}

	.course-average,
	.section-average,
	.percentile {
		margin-bottom: 10px;
	}
}
