/* ==========================================================================
 LESSON
 ========================================================================== */
#lesson-xc12 {
	padding: 0 !important;
	margin: 0 !important;
	text-align: center;
	background: url('../img/bg/gradient.gif') top left repeat-x !important;
}

#main-xc12 {
	text-align: left;
	padding: 0;
	margin: 0 auto;
	padding-top: 10px;
	max-width: 1002px;
	background: url('../img/bg/gradient.gif') top left repeat-x;
	width: 1002px;
}

#top--buttons {
	display: block;
	margin-bottom: 10px;
	clear: both;
	width: 100%;
	overflow: hidden;
}

#top--buttons .button {
	float: left;
	background: #0096d5;
	border-radius: 5px;
	margin-right: 10px;
}

#top--buttons .button:last-child {
	margin-right: 0;
}

#top--buttons .button h2 {
	border-bottom: none;
	margin: 0;
	padding: 0;
	background: none;
	font-size: 1.25em;
	font-family: 'Open Sans';
	width: 284px;
}

#top--buttons .button.back h2 {
	width: 120px;
	display: block;
}

#top--buttons .button h2 a {
	color: white;
	display: block;
	padding: 20px 20px;
	background: transparent url('../img/icons/arrows.png') 95% 13px no-repeat;
	text-decoration: none;
}

#top--buttons .button.back h2 a {
	background: transparent url('../img/icons/arrows.png') 50% -220px no-repeat;
	padding-left: 60px;
	padding-right: 60px;
}

#top--buttons .supplement {
	background: #0071b5;
}

#top--buttons .foundation {
	background: #009900;
}

#top--buttons .practice {
	background: #dd0101;
}

/* ACTIVE */
#top--buttons .button:hover, #top--buttons .button.active {
	background: white;
	text-transform: uppercase;
}
#top--buttons .button.back:hover {
	background: #00a8f0;
}

#top--buttons .supplement.active h2 a, #top--buttons .supplement h2 a:hover {
	color: #0071b5;
	background-position: 95% -320px;
}
#top--buttons .foundation.active h2 a, #top--buttons .foundation h2 a:hover {
	color: #009900;
	background-position: 95% -420px;
}
#top--buttons .practice.active h2 a, #top--buttons .practice h2 a:hover {
	color: #dd0101;
	background-position: 95% -520px;
}

/*DISABLED*/
#top--buttons .supplement.disabled:hover,
#top--buttons .supplement.disabled {
    background: rgb(170,180,186);
}

#top--buttons .foundation.disabled:hover,
#top--buttons .foundation.disabled {
    background: rgb(170,184,170);
}

#top--buttons .practice.disabled:hover,
#top--buttons .practice.disabled {
    background: rgb(190,170,170);
}

#top--buttons .disabled:hover h2 a {
    background: transparent url('../img/icons/arrows.png') 95% 13px no-repeat;
}

#top--buttons .disabled:hover h2 a,
#top--buttons .disabled:hover {
    color: #ffffff;
    text-transform: none;
}

/* --- */
#loading-wrapper {
    display: none;
    background-color: #ffffff;
}

#iframe-wrapper {
    display: none;
}

#no-access-wrapper {
    display: none;
}

.center-block {
    display: block;
    margin: 0 auto;
}

iframe {
    border: none;
}