/* **********************************************
* Navigation
********************************************** */

/*
* Bracken learner navigation.
*/

#brackenContainer .previousPageButton[data-button-visible="false"],
#brackenContainer .nextPageButton[data-button-visible="false"] {
	visibility: hidden;
}

#brackenContainer.printPreview .previousPageButton,
#brackenContainer.printPreview .nextPageButton,
#brackenContainer.printPreview .brackenCarouselLayer {
	display: none;
}

/*#brackenContainer .previousPageButton.visible,
#brackenContainer .nextPageButton.visible {
	visibility: visible;
}*/

#brackenContainer.printPreview .contentFooter {
	display: none;
}

@media print {
	#brackenContainer .headerBar,
	#brackenContainer .brackenPrintBar {
		display: none;
	}
}

#blockLayer {
	height: 655px;
	/*z-index: 900; - is this needed? */
}


#mediaManagerContainer {
	left: 0;
	top: 0;
	width: 100%;
	height: auto;
	z-index: 900;
}

	#mediaManagerContainer .mmContainer .mmMainHeight {
		height: 590px;
	}


/*
* Navigation
*/
.brButtonSize {
	width: 200px;
	height: 42px;
	margin: 0;
}

.brButton {
	display: none;
	color: white;
	font-size: 16px;
	border: none;
	background-color: #8DBB3D;
}

	.brButton:hover {
		background-color: #a1d546;
		text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.4);
		transition: 0.3s;
	}

	.brButton:active {
		background-color: #698140;
	}

	.brButton .icon {
		display: inline-block;
		width: 24px;
		height: 36px;
		vertical-align: middle;
	}

		.brButton .icon.thumbsUp {
			background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIzNiIgdmlld0JveD0iMCAzMCAxODAgMjcwIiBzdHJva2U9Im5vbmUiIGZpbGw9IndoaXRlIj48cGF0aCBkPSJNMTY5IDE5NiBRMTY5IDIxMiAxNjIgMjI5IEwxNDIgMjI5IFExMjcgMjQ2IDExMCAyNTMgUTEwNSAyNTQgMTAyIDI1NCBROTUgMjU0IDg2IDI1MSBMODEgMjU0IEw3NSAyNTQgUTU0IDI1NCA1NCAyNDAgUTU0IDIzOCA1NCAyMzcgUTM5IDIzNSAzOSAyMjIgUTM5IDIyMCA0MCAyMTggUTI4IDIxNSAyOCAyMDQgUTI4IDIwMCAzMSAxOTUgUTI0IDE4NyAyNCAxNzcgUTI0IDE1MSA3MyAxNTEgUTcxIDEzNyA2NSAxMjcgUTU2IDExMCA1NiAxMDEgUTU2IDg5IDYzIDgyIFE2OSA3NyA4MiA3NCBMODkgMTA1IEwxMTUgMTMzIFExMjQgMTQ1IDEzNyAxNjEgUTE0MCAxNjMgMTYyIDE2MyBRMTY5IDE3OSAxNjkgMTk2IFpNMTYyIDE5NyBRMTYyIDE4NCAxNTcgMTcwIFExNDAgMTcwIDEzNSAxNjggUTEzMSAxNjYgMTIzIDE1NSBRMTEyIDE0MSAxMTEgMTM5IEw4MyAxMDkgTDc3IDgzIFE2MyA4OCA2MyAxMDEgUTYzIDEwOCA3MSAxMjEgUTgwIDEzOCA4MSAxNTggUTMxIDE1OCAzMSAxNzYgUTMxIDE4NCAzNyAxOTAgUTQyIDE5NSA1MSAxOTUgTDU5IDE5NiBMODUgMTg0IFE3OSAxNzUgNjkgMTc1IFE2NCAxNzUgNTQgMTgwIEw0NyAxODAgTDQwIDE3MyBMNTIgMTczIFE2MSAxNjkgNjggMTY5IFE4NiAxNjkgOTUgMTg3IEw5MCAxODkgUTk5IDE5NCAxMDMgMjA1IEw5OCAyMDcgUTEwNCAyMTEgMTEwIDIyMSBMMTAxIDIyNSBRMTA4IDIzMCAxMTMgMjQwIEw5NSAyNDcgUTEwMCAyNDggMTAzIDI0OCBRMTAzIDI0OCAxMDggMjQ4IFExMjcgMjM3IDEzOCAyMjIgTDE1OCAyMjIgUTE2MiAyMDkgMTYyIDE5NyBaTTk0IDIwMSBRODkgMTk1IDgyIDE5MyBMNjEgMjAyIEw1NCAyMDIgUTQzIDIwMiAzNyAxOTkgUTM2IDIwMiAzNiAyMDQgUTM2IDIxMyA1MyAyMTMgTDY4IDIxMyBMOTQgMjAxIFpNMTAwIDIxOCBROTUgMjEzIDkwIDIxMCBMNjkgMjIwIEw0NiAyMjAgUTQ2IDIyMSA0NiAyMjIgUTQ2IDIzMCA2MiAyMzAgTDczIDIzMCBMMTAwIDIxOCBaTTEwMyAyMzcgUTEwMCAyMzQgOTQgMjI4IEw3NCAyMzcgTDYxIDIzNyBMNjEgMjM4IFE2MSAyNDcgNzUgMjQ3IEw4MCAyNDcgTDEwMyAyMzcgWiIvPjwvc3ZnPg==');
		}

		.brButton .icon.pushPin {
			background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIzNiIgdmlld0JveD0iMCAwIDMwMCAzMDAiIHN0cm9rZT0ibm9uZSIgZmlsbD0id2hpdGUiID48cGF0aCBkPSJNMjczIDEzMSBRMjczIDE0NSAyNjkgMTUzIFEyNjggMTU0IDI2MiAxNTggUTI1NyAxNjIgMjUwIDE2NCBRMjQ1IDE2NSAyNDYgMTY1IFEyNDkgMTY1IDIzNCAxNjMgTDE5NyAyMDIgUTIwMiAyMTUgMjAyIDIyOSBRMjAyIDIzOCAxOTUgMjQ3IFExODcgMjU3IDE3OSAyNTcgUTE2NCAyNTcgMTU2IDI1NCBRMTUzIDI1MiAxNDYgMjQ4IFExNDEgMjQ1IDEzMiAyNDAgUTExMyAyNTcgNzQgMjkzIFE2MCAzMDYgNTMgMzEyIFE0MSAzMjMgMzAgMzI5IFEyMCAzMzUgMTYgMzM1IFExNSAzMzUgMTMgMzMzIFExMSAzMzEgMTEgMzMxIFExMSAzMTggNTYgMjY5IEwxMDYgMjE1IFE5NiAxOTcgOTQgMTkyIFE4OSAxODIgODkgMTY4IFE4OSAxNjYgOTIgMTYwIFExMDAgMTQ0IDExOCAxNDQgUTEyNSAxNDQgMTMwIDE0NSBRMTMxIDE0NSAxNDQgMTQ5IFExNDYgMTQ5IDE2NSAxMzIgUTE4MyAxMTUgMTgzIDExMiBRMTgzIDExMCAxODIgMTA2IFExODIgMTAxIDE4MiA5OSBRMTgyIDEwMCAxODMgOTUgUTE4NyA3MiAyMTUgNzIgUTIzMSA3MiAyNTIgOTQgUTI3MyAxMTUgMjczIDEzMSBaTTI2MyAxMzIgUTI2MyAxMTkgMjU4IDExMiBRMjQ3IDk4IDIzOSA5MiBRMjI3IDgyIDIxMyA4MiBRMjA0IDgyIDE5NyA4OCBRMTkxIDkzIDE5MSAxMDIgUTE5MSAxMDMgMTkxIDEwNiBRMTkxIDEwOCAxOTEgMTA5IFExOTggMTA1IDE5OSAxMDUgUTIxMCAxMDUgMjE0IDEwOCBRMjIxIDExMiAyMzAgMTIyIFEyNDEgMTMzIDI0MSAxMzggTDI0MSAxNDkgUTI0MSAxNDkgMjM2IDE1NSBMMjQ4IDE1NSBRMjUzIDE1NSAyNTggMTQ5IFEyNjMgMTQ0IDI2MyAxMzIgWk0yMzYgMTQ0IFEyMzYgMTQxIDIzMyAxMzUgUTIzMSAxMjkgMjI5IDEyNyBRMjIwIDExNSAyMDkgMTEyIFEyMDQgMTEwIDIwMiAxMTAgUTIwMiAxMTAgMTk3IDExMiBRMTkyIDExNCAxOTIgMTE1IFExODkgMTE3IDE3OSAxMjYgUTE3MCAxMzYgMTUwIDE1NyBRMTU2IDE2MSAxNjggMTY5IFExNzEgMTcyIDE3NiAxNzcgTDIyMyAxMjkgUTIyOSAxMzcgMjI5IDE0NiBRMjI5IDE1MCAyMjYgMTUzIFEyMjUgMTU1IDIxMyAxNjcgUTIwMSAxODAgMTg4IDE5MiBRMTg4IDE5NCAxOTAgMTk1IFEyMDAgMTg2IDIxOCAxNjggUTIyMyAxNjQgMjMxIDE1NSBRMjM2IDE0OSAyMzYgMTQ0IFpNMTkyIDIyNSBRMTkyIDIyMSAxODkgMjExIFExODkgMjA5IDE4OCAyMDQgUTE3NiAxNzkgMTUxIDE2NCBRMTQ4IDE2MiAxNDIgMTU4IFExMjkgMTU0IDEyMCAxNTQgUTExNCAxNTQgMTEyIDE1NSBRMTA4IDE1NiAxMDQgMTYyIFE5OSAxNjggOTkgMTcxIFE5OSAxOTIgMTE2IDIwOSBRMTE5IDIwNiAxMjMgMjAxIFExMjcgMTk2IDEyOCAxOTUgUTEzMSAxOTIgMTM3IDE5MiBRMTQzIDE5MiAxNDggMTk4IFExNTQgMjAzIDE1NCAyMDkgUTE1NCAyMTUgMTQ4IDIyMSBRMTQyIDIyNiAxMzcgMjMxIFExNDcgMjQwIDE1NCAyNDMgUTE2MyAyNDcgMTc0IDI0NyBRMTc4IDI0NyAxODQgMjQyIFExOTAgMjM4IDE5MSAyMzQgUTE5MiAyMzAgMTkyIDIyNSBaTTE0OSAyMDYgUTE0OSAyMDQgMTQwIDE5NyBRMTM5IDE5OCAxMzcgMTk5IFExMzcgMTk5IDEyMyAyMTMgTDYzIDI3MyBRNTcgMjc5IDQ1IDI5MSBRNDMgMjkzIDM1IDMwNCBRMjUgMzE3IDE3IDMyOSBRMzEgMzIxIDU2IDMwMSBRNzIgMjg3IDk1IDI2MiBRMTI3IDIyOSAxMzUgMjIyIFExNDkgMjA4IDE0OSAyMDYgWk0yNjEgMTMzIFEyNjEgMTM5IDI1MyAxNDggUTI1MyAxNDggMjUxIDE0OCBRMjQ5IDE0OSAyNDggMTQ5IFEyNDggMTQ5IDI0NiAxNDcgUTI0NyAxNDAgMjQ3IDE0MCBRMjQ3IDEzNyAyNDEgMTI4IFEyNDggMTMwIDI0OSAxMzAgUTI1MCAxMzAgMjU0IDEyOCBRMjU3IDEyNiAyNTggMTI0IFEyNjEgMTMzIDI2MSAxMzMgWk0xNDUgMjA3IFExMTYgMjM3IDg5IDI2NSBRNzggMjc2IDU0IDI5OSBRNTQgMjk5IDI4IDMxOSBMMTQzIDIwMyBRMTQ0IDIwNSAxNDUgMjA3IFoiIHN0cm9rZT0ibm9uZSIgLz48L3N2Zz4=');
		}

		.brButton .icon.reload {
			background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjEgOCAyMi4wMiAxOS42MiIgd2lkdGg9IjI0IiBoZWlnaHQ9IjM2IiBzdHJva2U9Im5vbmUiIGZpbGw9IndoaXRlIj48cGF0aCBkPSJNMTAuNDEsMjcuMzdhMTAuNDYsMTAuNDYsMCwwLDAsOS4zMS0xNi45M2wtMS0xLjI0LDMuNzEuNDFhLjYxLjYxLDAsMCwwLC4xNC0xLjIybC01LjE5LS41N2EuNjIuNjIsMCwwLDAtLjY4LjU0bC0uNTgsNS4xOWEuNjIuNjIsMCwxLDAsMS4yMi4xNEwxNy43NywxMGwxLDEuMjRhOS4yMyw5LjIzLDAsMSwxLTEzLTEuNDQuNjIuNjIsMCwxLDAtLjc3LTEsMTAuNDYsMTAuNDYsMCwwLDAsNS4zOCwxOC41NVoiLz48L3N2Zz4=');
		}

		.brButton .icon.correct {
			background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIzNiIgdmlld0JveD0iMSA4IDIxLjgyIDIwLjEiIHN0cm9rZT0ibm9uZSIgZmlsbD0id2hpdGUiPjxwYXRoIGQ9Ik0yMi40MSw3LjkxYS40NC40NCwwLDAsMSwuMjcuNzZjLTIuMTcsMi4wNS04LjQ2LDguODktMTAuNCwxNi43M2ExLjcxLDEuNzEsMCwwLDEtLjgxLDEuMDhjLS43LjQtMS42NC45MS0yLjQyLDEuMzRhMS41NCwxLjU0LDAsMCwxLTIuMTItLjczLDI4LjM5LDI4LjM5LDAsMCwwLTUuNTktOC4zNSwxLjA2LDEuMDYsMCwwLDEsLjA4LTEuNjIsOCw4LDAsMCwxLDMtMS4zNSwxLjczLDEuNzMsMCwwLDEsMS41NS4zOWMxLC44NCw0LjExLDYuNTksNC4xMyw2LjU5LS4wOS0uMjcsMy4wNi0xMC4zLDYuNzYtMTMuMDlhOC41Niw4LjU2LDAsMCwxLDQuNDMtMS43NUE4LjA5LDguMDksMCwwLDEsMjIuNDEsNy45MVoiIC8+PC9zdmc+');
		}

/*
* Footer content
*/

	hoverMenuAnchor > .hoverMenuPopup {
		display: none;
}

	.hoverMenuAnchor[data-hover-menu-visible="true"] > .hoverMenuPopup {
		display: block;
	}

.contentFooter {
	position: relative;
	left: 58px;
	width: 952px;
}

.navigationScrollAnchor {
	position: relative;
	cursor: pointer;
}

	.navigationScrollAnchor .navigationScroll {
		position: absolute;
		bottom: 0;
		width: 100%;
		padding: 2px;
		background-color: #e7e7e7;
		white-space: nowrap;
		overflow: hidden;
		overflow-x: auto;
	}

	.navigationScrollAnchor .navigationScroll li {
		display: inline-block;
	}

.lessonProgressBar {
	margin: 2px 0;
	background-color: #ccc;
	border-radius: 4px;
}

	.lessonProgressBar .fill {
		position: relative;
		height: 0.5em;
		width: 0;
		border-radius: 4px;
		transition: width 0.3s ease-out;
	}

		.lessonProgressBar .fill:after {
			content: " ";
			position: absolute;
			width: 0.5em;
			height: 0.5em;
			top: 0;
			right: -0.25em;
			border-radius: 50%;
		}

		.lessonProgressBar .fill,
		.lessonProgressBar .fill:after {
			background-color: #8DBB3D;
		}

.navigationButtons {
	position: absolute;
	right: 0;
}

.navigationSaving,
.lessonMarks {
	font-size: 16px;
	color: #8DBB3D;
}
.lessonMarks {
	text-align: center;
	padding-top: 0.8em;
}

	.lessonMarks #lessonPage {
		display: none;
	}

	.lessonMarks .score[data-outof="0"] {
		display: none;
	}

[data-lesson-mode-name="Wizard"] .lessonMarks {
	display: none;
}

.navigationSaving {
	position: absolute;
	left: 0;
}

.navigationSaving label {
	display: none;
}
.navigationSaving[data-save-progress="saving"] [data-save-progress="saving"],
.navigationSaving[data-save-progress="saved"] [data-save-progress="saved"] {
	display: inline-block;
}

/*
* Prev / next Buttons
*/
.previousPageButton.standard,
.contentFrame,
.nextPageButton {
	display: inline-block;
	vertical-align: top;
}

@media print {
	.contentFrame {
		display: block;
	}
	.brackenPrintModulePage {
		page-break-inside: avoid;
	}
}

.previousPageButton.standard,
.nextPageButton.standard {
	display: inline-block;
	width: 58px;
	height: 602px;
	line-height:602px;
	vertical-align: middle;
	text-align: center;
	font-size: 64px;
	color: #8DBB3D;
	border: none;
	background-color: #fff;
}


	.previousPageButton.standard:hover,
	.nextPageButton.standard:hover {
		text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.4);
		transition: 0.3s;
		text-decoration: none;
	}

/*
* Transitions
*/

/* Content layer (incoming) */
#contentFrame #contentLayer,
#contentFrame #contentLayerOut {
	position: absolute;
	width: 100%;
	height: 100%;
}

#contentFrame.canTransition.transition #contentLayer {
	opacity: 0;
}

#contentFrame.canTransition.transition.next #contentLayer {
	left: 20px;
}

#contentFrame.canTransition.transition.prev #contentLayer {
	left: -20px;
}

#contentFrame.canTransition.transitioned #contentLayer {
	left: 0;
	opacity: 1;
	transition: 0.5s;
	transition-property: left, opacity;
}

/* Content layer out (outgoing) */
#contentFrame #contentLayerOut {
	display: none;
}

#contentFrame.canTransition #contentLayerOut {
	display: block;
}

#contentFrame.canTransition.transition #contentLayerOut {
	left: 0;
	opacity: 1;
}

#contentFrame.canTransition.transitioned.prev #contentLayerOut {
	left: +30px;
}

#contentFrame.canTransition.transitioned.next #contentLayerOut {
	left: -30px;
}
#contentFrame.canTransition.transitioned.prev #contentLayerOut,
#contentFrame.canTransition.transitioned.next #contentLayerOut {
	opacity: 0;
	transition: 0.5s;
	transition-property: left, opacity;
}