/****  Used in OLD (Rephactor 2) version of site.  *************/

@CHARSET "UTF-8";

body {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 100%;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

header {
	width: 100%;
	position: fixed;
	z-index: 9999;
}

.width-1200 {
	width: 1200px;
	margin: 0 auto;
}

.width-900 {
	width: 900px;
	margin: 0 auto;
}

.clear {
	clear: both;
}


ul,ol {
	font-size: 0.9em;
	margin-left: 30px;
}

ul.paragraph li {
	text-align: justify;
	width: 90%;
	margin-bottom: 10px;
}

table {
	margin: 25px auto;
	border-collapse: collapse;
	text-align: center;
}

tr:nth-child(odd) {
	background-color: #EFF9FF;
}

th {
	font-size: 0.9em;
	padding: 4px 7px;
	background-color: #3B6DA9;
	color: #FFFFFF;
	border: 1px solid #4F81BD;
}

td {
	font-size: 0.9em;
	border: 1px solid #4F81BD;
	padding: 4px 7px;
}

label {
	font-size: 0.9em;
}

label.error {
	font-size: 0.8em;
	color: red;
	margin-left: 7px;
}

img.figure {
	display: block;
	margin: 20px auto;
}



pre.pseudocode {
	font-family: "Arial Monospaced", Monaco, monospace;
	line-height: 1.4;
}



span.user-input {
	color: #0000FF;
}

pre.error {
	background-color: #F2D8D8;
	border: 1px solid #943634;
}



/***************************** General *******************************/

.fake-link {
	color: #B22222;
}

.fake-link:hover {
	text-decoration: underline;
}

.position-container {
	position: relative;
}

#syllabus-placeholder {
	float: left;
	margin-top: 0;
	width: 150px;
	height: 2px;
}

#syllabus-container {
	float: left;
	width: 298px;
	margin-top: 0;
	background-color: #FFF;
	display: none;
}

#syllabus-sidebar {
	width: 290px;
	margin: 0;
	background-color: #fef6ce;
}

#page-content {
	width: 900px;
	margin-left: 0px;
	display: inline-block;
	float: left;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

/***************************** Header and Footer *******************************/
#main-header {
 	background-color: #fef6ce;
	border-top: 1px solid #BBB;
    border-bottom: 1px solid #BBB;
	color: #000;
	height: 60px;
}

#main-header img.logo {
	float: left;
	margin-top: 5px;
}

#main-header-right {
	float: right;
	margin-top: 10px;
	margin-right: 10px;
	text-align: right;
}

#main-header-right ul {
	list-style-type: none;
	margin-top: 5px;
	margin-bottom: 0;
	padding: 0;
	float: right;
}

#main-header-right ul li {
	display: inline;
	float: left;
	padding-left: 15px;
}

.book-page {
	padding-top: 100px;
}

.non-book-page {
	padding-top: 62px;
}

#book-selector-container {
	position: relative;
}

#book-selector-container select {
	position: absolute;
}

#book-header {
	width: 100%;
	background-color: #fef6ce;
    border-bottom: 1px solid #BBB;
	color: #000;
	height: 36px;
	margin: 0;
}

#book-header img {
	float:right;
	margin: 4px 500px 0 0;
}

#book-header ul {
	list-style-type: none;
	margin: 10px 0 0 0;
	padding: 0;
	float: left;
}

#book-header ul li {
	display: inline;
	float: left;
	padding-left: 15px;
}

footer {
	background-color: #fef6ce;
	border-top: 1px solid #BBB;
    border-bottom: 1px solid #BBB;
	color: #000;
	height: 50px;
	margin-top: 40px;
}

#footer-left {
	float: left;
	margin-top: 10px;
	margin-left: 10px;
}

#footer-left ul {
	list-style-type: none;
	margin-top: 7px;
	margin-left: 0;
	padding: 0;
}

#footer-left ul li {
	display: inline;
	float: left;
	padding-right: 15px;
}

footer div#copyright {
	float: left;
	font-size: 0.7em;
	margin-left: 200px;
	margin-top: 8px;
}

footer div#social {
	float: right;
	margin-top: 9px;
	margin-right: 10px;
}


/***************************** Syllabus (in sidebar) *******************************/

#syllabus-sidebar {
	padding: 0 0 6px 0;
}

#syllabus-sidebar div.course-info {
	font-size: 0.8em;
	margin: 0;
	font-weight: bold;
	padding: 8px 3px;
	background-color: #D8E5F1;
	border-top: 1px solid #8DB3E2;
	border-bottom: 1px solid #8DB3E2;
}

#syllabus-sidebar p.course-number-term, #syllabus-sidebar p.course-title {
	text-align: left;
	margin: 0;
	padding: 1px 0;
}

#syllabus-sidebar #select-course {
	display: block;
	margin: 8px auto 0;
}

#syllabus-sidebar div.syllabus-openers {
	font-size: 0.8em;
	margin-left: 25px;
	padding-top: 9px;
	padding-bottom: 2px;
}

#syllabus-sidebar span.syllabus-title {
	font-size: 1.1em;
	font-weight: bold;
	margin-right: 30px;
}

#syllabus-sidebar .syllabus-open-all, .syllabus-close-all {
	cursor: pointer;
}

#syllabus-sidebar div.invisible {
	display: none;
}

#syllabus-sidebar div.syllabus-week-header {
	font-size: 0.9em;
	margin: 8px 0 4px 0;
	padding: 4px 0 4px 25px;
	background-color: #DDD;
	background-image: url(/images/arrow_right.gif);
	background-repeat: no-repeat;
	background-position: 7px 7px;
	cursor: pointer;
}

#syllabus-sidebar .syllabus-week-date {
	float: right;
	margin-right: 10px;
}

#syllabus-sidebar div.week-is-open {
	background-image: url(/images/arrow_down.gif);
}

#syllabus-sidebar span.topic-title {
	font-size: 0.9em;
	margin: 0 0 4px 0;
	padding: 0 0 0 25px;
}

#syllabus-sidebar span.topic-title.marked-as-read {
	background-image: url(/images/black_check_tiny.png);
	background-repeat: no-repeat;
	background-position: 4px 0px;
}

#syllabus-sidebar span.note-text p {
	font-size: 0.9em;
	margin: 8px 0 8px 0;
	padding: 0 6px 0 6px;
	text-align: left;
}

#syllabus-sidebar p.no-items-in-week {
	margin: 15px 0;
	padding: 0;
	text-align: center;
	font-style: italic;
}

/***************************** Topic Footer *******************************/
#topic-footer {
	width: 100%;
	margin: 30px 0 0 0;
	padding-top: 5px;
}

#topic-footer p {
	margin: 3px 12px;
}

#topic-footer-syllabus-previous {
	float: left;
}

#topic-footer-center p {
	text-align: center;
}

#topic-footer-center .mark-topic-as-read-disabled {
	color: grey;
}


#topic-footer-syllabus-next {
	float: right;
}

#topic-footer-syllabus-next p {
	text-align: right;
}

/***************************** Topic Opener *******************************/
#topic-opener {
	margin: 0 0 10px 0;
	padding: 0;
}

#topic-opener .title {
	margin: 20px 0 0 0;
	padding: 12px 0 15px 20px;
	font-family: "Trebuchet MS" Verdana, Geneva, sans-serif;
	font-size: 2.2em;
	font-weight: bold;
	background-color: #C2D69B;
	border: 1px solid #A2B67B;
	border-bottom: 2px solid #82965B;
	border-right: 2px solid #82965B;
}

#topic-opener img.opener {
	float: left;
	border: 2px solid lightgray;
	margin: 20px 0 0 10px;
	padding: 0;
}

#topic-opener .opener-mid {
	float: left;
	width: 205px;
	margin: 15px 0 0 15px;
}

#topic-opener .topic-video-link {
	font-size: 1.0em;
	margin: 10px 0 0 0;
	cursor: pointer;
}

#topic-opener .close-topic-video-link {
	font-size: 0.8em;
	text-align: right;
	cursor: pointer;
	margin: 0 5px 5px 0;
}

video.topic-video {
	margin:0 auto;
	display:block;
}

div.topic-video-container {
	margin:25px auto;
	width:90%;
	background:#CCCCCC;
	padding: 5px 20px 20px 20px;
	border:1px solid #999999;
	border-radius:10px;
	-moz-border-radius:10px;
	-khtml-border-radius:10px;
	-webkit-border-radius:10px;
}

#topic-opener .mark-topic-as-read {
	font-size: 0.8em;
	margin: 15px 0 0 0;
}

#topic-opener .mark-topic-as-read-disabled {
	font-size: 0.8em;
	margin: 15px 0 0 0;
	color: grey;
}

#topic-opener .prereq-header {
	font-size: 0.9em;
	font-weight: bold;
	margin: 15px 0 0 0;
}

#topic-opener ul.topic-prereq-list {
	font-size: 0.9em;
	padding-left: 25px;
	margin: 5px 5px 0 0;
}

#topic-opener ul.topic-prereq-list li {
	margin: 0;
	padding: 0;
}

#topic-opener .quotes {
	float: left;
	width: 360px;
	margin: 20px 0 0 10px;
	padding: 5px 15px 0;
	background-color: #D8E5F1;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
	border: 2px solid #8DB3E2;
}

#topic-opener .quote {
	font-size: 0.9em;
	margin: 10px 0 0 0;
}

#topic-opener .quote-author {
	font-size: 0.8em;
	color: sienna;
	margin: 2px 0 12px 40px;
}

#topic-opener .topic-login-message {
	margin-top: 20px;
	margin-bottom: 0;
	text-align: center;
}

/***************************** Feedback *******************************/
#topic-opener #feedback-trigger {
	float: right;
	margin-right: 20px;
	cursor: pointer;
}

#topic-opener #feedback-thanks {
	float: right;
	font-size: 0.5em;
	font-style: italic;
	color: #2289CA;
	display: none;
}

#topic-opener #feedback-container {
	position: relative;
	display: none;
	z-index: 5555;
}

#topic-opener #feedback {
	position: absolute;
	width: 700px;
	height: 240px;
	background-color: #f6aa88;
	border: 2px solid #e38860;
}

/***************************** Status Checks *******************************/
.billing-status-pending, .email-verification-pending, .role-instructor-pending {
	background-color: #FCEBD8;
	padding: 0px;
	width: 810px;
	margin: 30px auto;
	border: 1px solid #E4D3C0;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.email-verification-pending .resend-confirmation-email {
	text-align: center;
}
.email-verification-pending .resend-confirmation-email-message {
	text-align: center;
	color: #2289CA;
}

/***************************** Topic Content *******************************/
#topic-content .term {
	font-weight: bold;
	color: #555555;
}

#topic-content p.section-head {
	font-size: 1.3em;
	background-color: #C2D69B;
	border: 1px solid #A2B67B;
	border-bottom: 2px solid #82965B;
	border-right: 2px solid #82965B;
	margin: 24px 0 14px;
	padding: 5px 10px;
}

/* the width of each key concept is set individually */
#topic-content p.key-concept {
	font-size: 0.8em;
	margin: 5px 0 0 15px;
	padding: 2px 5px;
	float: right;
	background-color: #D8E5F1;
	border: 1px solid #8DB3E2;
}

#topic-content div.download-container {
	position: relative;
	left: 838px;
	top: -12px;
	z-index: 3333;
	width: 50px;
}

#topic-content img.download-button {
	position: absolute;
	z-index: 3333;
}

#topic-content div.run-and-revise-container {
	position: relative;
	left: 822px;
	top: -39px;
	z-index: 3333;
	width: 50px;
}

#topic-content img.run-and-revise-button {
	position: absolute;
	cursor: pointer;
	z-index: 3333;
}



/***************************** Quick Check Quiz  --  NEW VERSION *******************************/

.quick-check-quiz {
	width: 900px;
	border: 1px solid grey;
	margin-top: 25px;
}
.quick-check-quiz .quick-check-header {
	height: 30px;
	background-color: #FFE066;
	border-bottom: 1px solid grey;
	margin: 0 0 10px 0;
}
.quick-check-quiz .quick-check-header p.qc-head {
	margin: 0;
	padding-top: 5px;
	padding-left: 20px;
	font-size: 1.0em;
	font-weight: bold;
}
.quick-check-quiz .qc-matching-instructions {
	margin-bottom: 10px;
}
.quick-check-quiz .quick-check-header img.explain-qc-scores-trigger {
	float: right;
	margin: 8px 5px 0 20px;
	cursor: pointer;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores-container {
	position: relative;
	display: none;
	z-index: 5555;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores {
	position: absolute;
	width: 700px;
	height: 145px;
	background-color: #FFE066;
	border: 1px solid grey;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores table {
	margin: 10px auto;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores table tr {
	background-color: #FFE066;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores table td {
	border: none;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores table td.qc-correct {
	color: green;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores table td.qc-incorrect {
	color: red;
}
.quick-check-quiz .quick-check-header div.explain-qc-scores table td:nth-child(2) {
	text-align: left;
}
.quick-check-quiz .quick-check-header .explain-qc-scores-close {
	float: right;
	font-size: 0.8em;
	margin: 4px 8px 0 0;
	cursor: pointer;
}
.quick-check-quiz .quick-check-header div.qc-scores {
	float: right;
	display: inline;
	margin-top: 6px;
	font-size: 0.9em;
}
.quick-check-quiz .quick-check-header .qc-scores .qc-correct {
	color: green;
}
.quick-check-quiz .quick-check-header .qc-scores .qc-incorrect {
	color: red;
	margin-left: 20px;
}
.quick-check-quiz .quick-check-footer {
	height: 70px;
	background-color: #FFE066;
	border-top: 1px solid grey;
	margin: 20px 0 0 0;
}
.quick-check-quiz .quick-check-footer .qc-submit-button {
	background-color: #FFFFFF;
	border: 1px solid grey;
	border-radius: 4px;
	margin: 20px 0 0 20px;
	padding: 5px 10px;
	font-size: 1.0em;
	cursor: pointer;
	transition: all .1s ease;
}
.quick-check-quiz .quick-check-footer .qc-submit-button:hover {
	background-color: #B2FDFE;
}
.quick-check-quiz .quick-check-footer .qc-submit-button:active {
	color: #000000;
	background-color: green;
}


/***************************** Quick Check Quiz: Matching Question  --  NEW VERSION *******************************/

.quick-check-quiz .qc-matching-question div.qc-matching-term-list {
	width: 200px;
	float: left;
}
.quick-check-quiz .qc-matching-question div.qc-matching-term-list ul {
	list-style-type: none;
	margin-left: 30px;
	padding-left: 0;
}
.quick-check-quiz .qc-matching-question div.qc-matching-term-list li {
	margin-bottom: 7px;
	cursor: pointer;
}
.quick-check-quiz .qc-matching-question div.qc-matching-def-list {
	float: left;
	margin-left: 10px;
}
.quick-check-quiz .qc-matching-question div.qc-matching-def-list table {
	width: 650px;
	margin: 10px 0;
	border: none;
}
.quick-check-quiz .qc-matching-question div.qc-matching-def-list tr {
	text-align: left;
	background-color: #FFF;
	margin-top: 10px;
}
.quick-check-quiz .qc-matching-question .qc-matching-def-list .qc-matching-def {
	border: 1px solid #FFF;
}
.quick-check-quiz .qc-matching-question .dqc-matching-ef-list .qc-answer {
	width: 20px;
	background-color: #DDD;
	border: 1px solid #BBB;
}
.quick-check-quiz .qc-matching-question .qc-matching-def-list .qc-answer.hover {
	background-color: #FFE066;
	border: 1px solid black;
}
.quick-check-quiz .qc-matching-question .qc-matching-def-list .qc-answer.correct {
	width: 1%;
	white-space: nowrap;
	background-color: #CCFFCC;
}
.quick-check-quiz .qc-matching-question .qc-matching-def-list .qc-answer.incorrect {
	width: 1%;
	white-space: nowrap;
	background-color: #FF9999;
}
.quick-check-quiz .qc-matching-question .qc-matching-def-list .qc-ans {
	display: none;
}


/***************************** Quick Check Quiz: True-False Question  --  NEW VERSION *******************************/

.quick-check-quiz .qc-true-false-question table {
	margin: 0 0 0 5px;
}
.quick-check-quiz .qc-true-false-question table tr {
	background-color: #FFF;
}
.quick-check-quiz .qc-true-false-question table td {
	border: none;
	padding: 10px 0 10px 20px;
}
.quick-check-quiz .qc-true-false-question .qc-tf-check-or-x {
	width: 20px;
	height: 20px;
}
.quick-check-quiz .qc-true-false-question table .qc-ans {
	display: none;
}
.quick-check-quiz .qc-true-false-question .qc-tf-options {
	width: 110px;
}
.quick-check-quiz .qc-true-false-question .qc-tf-option {
	padding: 2px;
	border: 1px solid #FFF;
	cursor: pointer;
}
.quick-check-quiz .qc-true-false-question .qc-tf-selected-correct {
	border: 1px solid #0A0;
}
.quick-check-quiz .qc-true-false-question .qc-tf-selected-incorrect {
	border: 1px solid #FF9999;
}
.quick-check-quiz .qc-true-false-question table .qc-tf-question {
	text-align: left;
}
.quick-check-quiz .qc-true-false-question table .qc-tf-explanation {
	display: none;
	padding-top: 5px;
	color: #2289ca;
	font-style: italic;
}

/***************************** Quick Check Quiz: Multiple-Choice Question  --  NEW VERSION *******************************/

.quick-check-quiz .qc-multiple-choice-question .qc-mc-question-text {
	font-size: 0.9em;
	margin: 20px 0 10px 20px;
}
.quick-check-quiz .qc-multiple-choice-question .qc-mc-question-text pre {
	margin-left: 20px;
}
.quick-check-quiz .qc-multiple-choice-question table.qc-mc-answer-table {
	margin: 0 0 0 40px;
}
.quick-check-quiz .qc-multiple-choice-question table.qc-mc-answer-table tr {
	background-color: #FFF;
}
.quick-check-quiz .qc-multiple-choice-question table.qc-mc-answer-table td {
	border: none;
	padding: 0 30px 0 0;
	text-align: left;
}
.quick-check-quiz .qc-multiple-choice-question table.qc-mc-answer {
	margin: 0;
}
.quick-check-quiz .qc-multiple-choice-question table.qc-mc-answer td {
	border: none;
	padding: 3px 5px;
	text-align: left;
	width: 1px;
	white-space: nowrap;
}
.quick-check-quiz .qc-multiple-choice-question .qc-mc-answer-text pre {
	margin: 0;
}
.quick-check-quiz .qc-multiple-choice-question .qc-mc-selected-correct {
	background-color: #CCFFCC;
}
.quick-check-quiz .qc-multiple-choice-question .qc-mc-selected-incorrect {
	background-color: #FF9999;
}
.quick-check-quiz .qc-multiple-choice-question td.qc-ans {
	display: none;
}
.quick-check-quiz .qc-multiple-choice-question td.qc-answer-explanation {
	display: none;
}
.quick-check-quiz .qc-multiple-choice-question td.qc-explanation-display {
	color: #2289ca;
	font-style: italic;
}




/***************************** Quick Check (Self-Review) Quiz *******************************/
/********* THIS IS THE OLD VERSION -- NEW VERSION IS ABOVE THIS *****************************/

.self-review-quiz {
	width: 900px;
	border: 1px solid grey;
	margin-top: 25px;
	padding-bottom: 10px;
}
.self-review-quiz .self-review-header {
	height: 30px;
	background-color: #FFE066;
	border-bottom: 1px solid grey;
	margin: 0 0 10px 0;
}
.self-review-quiz .self-review-header p.sr-head {
	margin: 0;
	padding-top: 5px;
	padding-left: 20px;
	font-size: 1.0em;
	font-weight: bold;
}
.self-review-quiz .instructions {
	margin-bottom: 10px;
}
.self-review-quiz .self-review-header img.explain-sr-scores-trigger {
	float: right;
	margin: 8px 5px 0 20px;
	cursor: pointer;
}
.self-review-quiz .self-review-header div.explain-sr-scores-container {
	position: relative;
	display: none;
	z-index: 5555;
}
.self-review-quiz .self-review-header div.explain-sr-scores {
	position: absolute;
	width: 700px;
	height: 145px;
	background-color: #FFE066;
	border: 1px solid grey;
}
.self-review-quiz .self-review-header div.explain-sr-scores table {
	margin: 10px auto;
}
.self-review-quiz .self-review-header div.explain-sr-scores table tr {
	background-color: #FFE066;
}
.self-review-quiz .self-review-header div.explain-sr-scores table td {
	border: none;
}
.self-review-quiz .self-review-header div.explain-sr-scores table td.correct {
	color: green;
	font-size: 0.9em;
}
.self-review-quiz .self-review-header div.explain-sr-scores table td.numIncorrect {
	color: red;
	font-size: 0.9em;
}
.self-review-quiz .self-review-header div.explain-sr-scores table td:nth-child(2) {
	text-align: left;
}
.self-review-quiz .self-review-header .explain-sr-scores-close {
	float: right;
	font-size: 0.8em;
	margin: 4px 8px 0 0;
	cursor: pointer;
}
.self-review-quiz .self-review-header div.quiz-scores {
	float: right;
	display: inline;
	margin-top: 4px;
}
.self-review-quiz .self-review-header .quiz-scores .correct {
	color: green;
	font-size: 0.9em;
}
.self-review-quiz .self-review-header .quiz-scores .numIncorrect {
	color: red;
	margin-left: 20px;
	font-size: 0.9em;
}

/***************************** Quick Check (Self-Review) Quiz: Matching Question *******************************/

.self-review-quiz .matching-question div.term-list {
	width: 200px;
	float: left;
}
.self-review-quiz .matching-question div.term-list ul {
	list-style-type: none;
	margin-left: 30px;
	padding-left: 0;
}
.self-review-quiz .matching-question div.term-list li {
	margin-bottom: 7px;
	cursor: pointer;
}
.self-review-quiz .matching-question div.def-list {
	float: left;
	margin-left: 10px;
}
.self-review-quiz .matching-question div.def-list table {
	width: 650px;
	margin: 10px 0;
	border: none;
}
.self-review-quiz .matching-question div.def-list tr {
	text-align: left;
	background-color: #FFF;
	margin-top: 10px;
}
.self-review-quiz .matching-question .def-list .def {
	border: 1px solid #FFF;
}
.self-review-quiz .matching-question .def-list .answer {
	width: 20px;
	background-color: #DDD;
	border: 1px solid #BBB;
}
.self-review-quiz .matching-question .def-list .answer.hover {
	background-color: #FFE066;
	border: 1px solid black;
}
.self-review-quiz .matching-question .def-list .answer.correct {
	width: 1%;
	white-space: nowrap;
	background-color: #CCFFCC;
}
.self-review-quiz .matching-question .def-list .answer.incorrect {
	width: 1%;
	white-space: nowrap;
	background-color: #FF9999;
}
.self-review-quiz .matching-question .def-list .ans {
	display: none;
}


/***************************** Quick Check (Self-Review) Quiz: True-False Question *******************************/

.self-review-quiz .true-false-question table {
	margin: 0 0 0 5px;
}
.self-review-quiz .true-false-question table tr {
	background-color: #FFF;
}
.self-review-quiz .true-false-question table td {
	border: none;
	padding: 10px 0 10px 20px;
}
.self-review-quiz .true-false-question .check-or-x {
	width: 20px;
	height: 20px;
}
.self-review-quiz .true-false-question table .ans {
	display: none;
}
.self-review-quiz .true-false-question .choice {
	width: 110px;
}
.self-review-quiz .true-false-question .tf-SR-choice {
	padding: 2px;
	border: 1px solid #FFF;
	cursor: pointer;
}
.self-review-quiz .true-false-question .tf-selected-correct {
	border: 1px solid #0A0;
}
.self-review-quiz .true-false-question .tf-selected-incorrect {
	border: 1px solid #FF9999;
}
.self-review-quiz .true-false-question table .question {
	text-align: left;
}
.self-review-quiz .true-false-question table .explanation {
	display: none;
	padding-top: 5px;
	color: #2289ca;
	font-style: italic;
}

/***************************** Quick Check (Self-Review) Quiz: Multiple-Choice Question *******************************/

.self-review-quiz .multiple-choice-question .mc-question-text {
	font-size: 0.9em;
	margin: 20px 0 10px 20px;
}
.self-review-quiz .multiple-choice-question .mc-question-text pre {
	margin-left: 20px;
}
.self-review-quiz .multiple-choice-question table.mc-answer-table {
	margin: 0 0 0 40px;
}
.self-review-quiz .multiple-choice-question table.mc-answer-table tr {
	background-color: #FFF;
}
.self-review-quiz .multiple-choice-question table.mc-answer-table td {
	border: none;
	padding: 0 30px 0 0;
	text-align: left;
}
.self-review-quiz .multiple-choice-question table.mc-answer {
	margin: 0;
}
.self-review-quiz .multiple-choice-question table.mc-answer td {
	border: none;
	padding: 3px 5px;
	text-align: left;
	width: 1px;
	white-space: nowrap;
}
.self-review-quiz .multiple-choice-question .mc-answer-text pre {
	margin: 0;
}
.self-review-quiz .multiple-choice-question .mc-selected-correct {
	background-color: #CCFFCC;
}
.self-review-quiz .multiple-choice-question .mc-selected-incorrect {
	background-color: #FF9999;
}
.self-review-quiz .multiple-choice-question td.ans {
	display: none;
}
.self-review-quiz .multiple-choice-question td.answer-explanation {
	display: none;
}
.self-review-quiz .multiple-choice-question td.explanation-display {
	color: #2289ca;
	font-style: italic;
}


/***************************** Rephactor IDE *******************************/
div.rephactor-IDE {
	display: none;
	margin-left: 40px;
	width: 90%;
	padding: 6px 5px 3px 7px;
	background-color: grey;
	border: 1px solid #F0EBD7;
}

textarea.rephactor-IDE-code, textarea.rephactor-IDE-input-data {
	display: none;
}

div.editor-head {
	width: 96%;
	height: 10px;
	margin: 0px auto;
	background-color: #FFF;
}

div.rephactor-editor { 			/* Ace editor */
    position: relative;			/* must be relative or absolute */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0px auto 10px;
    width: 96%;
}

div.rephactor-IDE-controls {
	margin: 10px auto;
	width: 96%;
	background-color: grey;
}

div.rephactor-IDE-controls input[type="button"] {
	cursor: pointer;
}

p.rephactor-IDE-status-message {
	display: inline;
	color: white;
}

textarea.rephactor-IDE-input {
	display: block;
	width: 96%;
	margin: 10px auto;
	background-color: #FFF;
	resize: none;
}

pre.rephactor-IDE-output {
	width: 95%;
	overflow: scroll;
	margin: 10px auto 20px;
	background-color: #FDE9D9;
	border: 1px solid #FBD4B4;
	padding: 3px 5px;
	font-size: 0.8em;
}

.tabs {
    display:block;
	width:96%;
    margin: 10px auto 0;
}

.tab-links {
	margin-left: 0;
	margin-bottom: 0;
	padding-left: 0;
}

/* Clearfix */
.tab-links:after {
	display:block;
	clear:both;
	content:'';
}

.tab-links li {
	margin:0 10px 0 0;
	float:left;
	list-style:none;
}

.tab-links a {
	padding:3px 15px 8px;
	display:inline-block;
	border-radius:3px 3px 0px 0px;
	background:#7FB5DA;
	font-size:0.9em;
	color:#4c4c4c;
	transition:all linear 0.15s;
}

.tab-links a:hover {
	background:#a7cce5;
	text-decoration:none;
}

li.active a, li.active a:hover {
	background:#fff;
	color:#4c4c4c;
   }

.tab {
	display:none;
}

.tab.active {
	display:block;
}


/***************************** BTW Sidebar *******************************/
#topic-content div.sidebar {
	width: 70%;
	margin: 40px auto 35px;
	background-color: #F0E0FF;
	border: 1px solid #B48EC5;
	border-left: 25px solid #B48EC5;
}

#topic-content div.sidebar p {
	margin: 0;
	padding: 10px 15px;
}

#topic-content .sidebar-image-container {
	position: relative;
	left: -53px;
	top: -28px;
	float: left;
	width: 0px;
	height: 0px;
	margin-right: 15px;
	z-index: 5555;
}

#topic-content .sidebar-image {
	position: absolute;
	z-index: 5555;
}

/***************************** To The Java API *******************************/
#topic-content .to-the-java-api {
	float: right;
	width: 250px;
	margin-left: 10px;
}

#topic-content .to-the-java-api-image-container {
	position: relative;
	left: 12px;
	top: -5px;
	float: left;
	width: 55px;
	height: 55px;
	margin-right: 15px;
}

#topic-content .to-the-java-api-image {
	position: absolute;
}

#topic-content p.to-the-java-api-head {
	color: #2289ca;
	font-weight: bold;
	font-size: 1.0em;
	margin-top: 5px;
	margin-bottom: 0px;
}

#topic-content .to-the-java-api a {
	font-size: 0.8em;
}

/***************************** Common Error *******************************/
#topic-content .common-error {
	background-color: #F2D8D8;
	padding: 3px;
	border: #943634 solid 1px;
	width: 80%;
	margin: 30px auto 20px;
}

#topic-content .common-error pre {
	background-color: #F2D8D8;
	border: 2px solid #F0EBD7;
}

#topic-content .common-error pre.fixed {
	background-color: #FEF9E0;
	border: 1px solid #F0EBD7;
}

#topic-content .common-error-image-container {
	position: relative;
	left: -15px;
	top: -15px;
	float: left;
	width: 55px;
	height: 55px;
	margin-right: 15px;
}

#topic-content .common-error-image {
	position: absolute;
}

#topic-content p.common-error-head {
	font-weight: bold;
	font-size: 1.0em;
	margin-top: 10px;
	margin-bottom: 10px;
}

#topic-content .common-error-head-lead {
	color: #943634;
}

/***************************** Watch This *******************************/

.watch-this {
	width: 800px;
	margin: 30px auto;
}

.wt-title {
	margin: 0;
	background-color: #C1D1FF;
	border: 1px solid #C1D1FF;
	border-bottom: 3px solid grey;
	background-repeat: no-repeat;
	background-position: 10px -3px;
	padding: 7px 10px;
	text-indent: 60px;
}

.wt-screen {
	width: 740px;
	margin: 0 auto;
	border: 1px solid grey;
	border-top: none;
}

/***************************** Try This *******************************/

.try-this {
	width: 800px;
	margin: 30px auto;
}

.tt-title {
	margin: 0;
	background-color: #C1D1FF;
	border: 1px solid #C1D1FF;
	border-bottom: 3px solid grey;
	background-repeat: no-repeat;
	background-position: 10px 0px;
	padding: 7px 10px;
	text-indent: 50px;
}

.tt-screen {
	width: 740px;
	margin: 0 auto;
	border: 1px solid grey;
	border-top: none;
}


/***************************** Exercises *******************************/
.exercise {
	margin: 25px 0;
}

.exercise-header {
	margin: 0 0 3px 5%;
	padding: 0;
	font-size: 0.9em;
}

.problem-statement {
	position: relative;
	width: 90%;
	margin: 0 5%;
	background-color: #EEF9FF;
	border: 1px solid #CED9DF;
}

.problem-statement img.solve-it {
	position: absolute;
	top: -11px;
	left: 771px;
}

.problem-statement p {
	margin-left: 10px;
}

.problem-statement pre.output {
	margin-left: 25px;
}

/***************************** 5Q Self-Review *******************************/
table.self-review-results-table {
	margin: 20px 0 25px 40px;
	text-align: center;
}

table.self-review-results-table th {
	font-weight: normal;
	background-color: #FFFFFF;
	color: #000000;
	border: none;
}

table.self-review-results-table td {
	background-color: #FFFFFF;
}

table.self-review-results-table td.name {
	border: none;
	width: 300px;
	text-align: right;
}

table.self-review-results-table td.no-attempt {
	background-color: #EEEEEE;
}

table.self-review-results-table td.incorrect {
	background-color: #FF9999;
}

table.self-review-results-table td.correct {
	background-color: #CCFFCC;
}

/***************************** Easter Eggs *******************************/
.ee-container {
	position: relative;
	display: none;
	z-index: 5555;
}

.ee-trigger {
	font-style: italic;
	cursor: pointer;
}

#ee {
	position: absolute;
	cursor: pointer;
	border: none;
	z-index: 5555;
}

/***************************** Display (any pop up) *******************************/
.display-container {
	position: relative;
	display: none;
	z-index: 5555;
}

.display-trigger {
	cursor: pointer;
}

.display-item {
	position: absolute;
	cursor: pointer;
	border: none;
	z-index: 5555;
}