@import url("uikit/css/uikit-icons.css");

@charset "utf-8";
/* CSS Document */

/* Required section for text to speech to work correctly */

object#WebToSpeech { position: fixed; }

/* Charlie — please check these */

.donebuild-start {
	display:inline-block;
	background-image:url(../images/done-start.gif);
	width:71px;
	height:16px;
	cursor:pointer;
}
.donebuild-start:hover {
	background-image:url(../images/done-start-hover.gif);
}
.donebuild-retry {
	display:inline-block;
	background-image:url(../images/done-retry.gif);
	width:71px;
	height:16px;
	cursor:pointer;
}
.donebuild-retry:hover {
	background-image:url(../images/done-retry-hover.gif);
}
.donebuild-complete {
	display:inline-block;
	background-image:url(../images/done-complete.gif);
	width:71px;
	height:16px;
}
.question-stem {
	margin-bottom: 8px;
}
.answer-choice-button {
	float: left;
	margin-top: -1px;
	margin-left: 0px;
}
.answer-choice-label {
	padding-left: 25px;
	margin-left: 0px;
	margin-bottom: 8px;
}
.ChosenAnswerCorrect {
	background-image:url(../images/correct-student.gif);
	background-repeat: no-repeat;
	display: inline-block;
	height: 16px;
	width: 22px;/*-webkit-font-smoothing: antialiased;*/
}
.ChosenAnswerIncorrect {
	background-image:url(../images/incorrect.gif);
	background-repeat: no-repeat;
	display: inline-block;
	height: 16px;
	width: 22px;/*-webkit-font-smoothing: antialiased;*/
}
.TextAnswerCorrect {
	background-image:url(../images/correct-student.gif);
	background-repeat: no-repeat;
	/*added this to text boxes*/
	display: inline-block;
	width:20px;
	height:15px;
	/*float: right;*/
	/*margin-left:5px;*/
	margin-left:5px;
}
.TextAnswerIncorrect {
	background-image:url(../images/incorrect.gif);
	background-repeat: no-repeat;
	/*added this to text boxes*/
	display: inline-block;
	width:20px;
	height:15px;
	/*float: right;*/
	/*margin-left:5px;*/
	margin-right:5px;
}
.MissedAnswer {
	background-image:url(../images/correct-system.gif);
	background-repeat: no-repeat;
	display: inline-block;
	height: 16px;
	width: 22px;
}
/* Basic Frame CSS */
HTML {
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px;
	background-color: #2877C4;
}
BODY {
	padding: 0;
	width: 800px;
	height: 450px;
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-color: white;
}
IMG[fdone] {
	cursor:pointer;
}

/*

/*Standard text styles */


*/ body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 16px;
}
body p {
	line-height:21px;
	font-family: Arial, Helvetica, sans-serif;
}
.body-text-2 {
	font-size: 24px;
}
.body-text-3 {
	font-size: 13px;
}
a:link {
	color: #2877C4;
	border-style: none;
}
a:visited {
	color: #2877C4;
}
a:hover {
	color: #fe8900;
	text-decoration: none;
}
a:link img {
	text-decoration:none;
	border:0px;
}
a:visited img {
	text-decoration:none;
	border:0px;
}
a:hover img {
	text-decoration:none;
	border:0px;
}
.span-link {
	color: #2877C4;
	text-decoration: underline;
}
.span-link:hover {
	color: #fe8900;
	text-decoration: none;
	cursor:pointer;
}
h1 {
	font-size: 30px;
	color: #2877C4;
}
h2 {
	font-size: 24px;
	color: #fe8900;
	font-weight: bold;
}
/*Text colors, for vocabulary, etc */

.blue {
	color: #2877C4;
}
.green {
	color: #5b8f22;
}
.orange {
	color: #FE8900;
}
.gray {
	color: #4D4F58;
}
.purple {
	color: #7E5ABE;
}
.pink {
	color: #D6156C;
}
/*Image caption text, not for attributions */

.caption-text {
	text-align: center;
	padding-bottom: 0px;
	position: relative;
	padding-top: 0px;
	margin-bottom: -14px;
}
/*Image attribution text, not for captions */

.image-attribtution-text {
	font-size: 9px;
	color: #999;
	text-align: center;
	padding-bottom: 0px;
	position: relative;
	padding-top: 0px;
	margin-bottom: -21px;
}
/*bullet styles */

.standard-bullet {
	color: #000;
	list-style-type: square;
	list-style-position: inside;
	background-image: url(../images/or-bullet.gif);
	background-repeat: no-repeat;
	background-position: left 7px;
	padding-left: 18px;
	margin-top: -7px;
}
.indented-bullet {
	color: #000;
	list-style-type: square;
	list-style-position: inside;
	background-image: url(../images/gr-bullet.gif);
	background-repeat: no-repeat;
	background-position: left 7px;
	padding-left: 15px;
	margin-left: 18px;
	margin-top: -7px;
}
#science-practice {
	list-style-type: square;
	list-style-position: inside;
	background-image: url(../images/science_practice.gif);
	background-repeat: no-repeat;
	background-position: left 0px;
	padding-left: 18px;
	margin-top: -7px;
}
/*reading pane block quote backgrounds*/
.reading {
	overflow: auto;
	position: relative;
	margin-top: 21px;
	max-height: 310px;
	font-family: Georgia, "Times New Roman", Times, serif;
}
*+html .reading {
	margin-top: 0px;
	margin-bottom: 14px;
}
.pane-blue {
	background-color: #d1e4f6;
	border: 2px solid #2877C4;
}
.pane-orange {
	background-color: #ffe7cc;
	border: 2px solid #FE8900;
}
.pane-green {
	background-color: #dff2c9;
	border: 2px solid #5b8f22;
}
.pane-gray {
	background-color: #dadbdf;
	border: 2px solid #4D4F58;
}
.pane-purple {
	background-color: #e5def2;
	border: 2px solid #7E5ABE;
}
.pane-pink {
	background-color: #facde1;
	border: 2px solid #D6156C;
}
.pane-white {
	background-color: #fff;
	border: 2px solid #4D4F58;
}
div.reading img {
	border: 1px solid #CCC;
	margin: 5px;
}
/*reading pane text class */

div.reading p {
	margin-top: 5px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	margin-right: 15px;
	margin-left: 15px;
	position: relative;
	margin-bottom:10px;
}
/*for hanging indents- used with text that is contained within quotes*/

.hi {
	position: relative;
	margin-top: 5px;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-indent: -8px;
	font-size: 16px;
	margin-right: 15px;
	margin-left: 15px;
}
/*reading pane text class for attributions- add italics and em dashes manually */
.attribution {
	font-family: Georgia, "Times New Roman", Times, serif;
	text-align: right;
	padding-bottom: 10px;
	position: relative;
	padding-top: 0px;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
/*containers and positioning */

/*#container {
	height: 450px;
	width: 800px;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #000;
	padding: 0px;
}*/
.title-bar {
	text-align: left;
	text-decoration: none;
	background-color: #4D4F58;
	height: 62px;
	vertical-align: middle;
	font-weight: bold;
	padding-right: 28px;
	padding-left: 28px;
	padding-top: 14px;
	padding-bottom: 14px;
	position: relative;
	margin-bottom: 0px;
	display: block;
}
.title-bar h1 {
	vertical-align: middle;
	display: table-cell;
	height: 64px;
	font-size: 28px;
	line-height: 32px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
}
.content {
	width: 744px;
	height: 100%;
	max-height: 360px;
	padding-right: 28px;
	padding-left: 28px;
	float: left;
	overflow: auto;
	font-family: Arial, Helvetica, sans-serif;
	display: block;
}
/*IE hack*/
*+html .content {
	padding-top:21px;
}
/*columns*/
.left-column {
	padding:0px;
	float: left;
	width: 358px;
	vertical-align: top;
	position: relative;
}
/*removed left-column img*/
/*.left-column img {
	text-align: right;
	display: block;
	float: left;
	margin-top: 21px;
}
*+html .left-column img {
	margin-top: 0px;
}*/
.left-column-seperated {
	float: left;
	width: 357px;
	height:358px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
	padding-top: 0px;
	padding-right: 14px;
	padding-bottom: 0px;
	padding-left: 0px;
}
*+html .left-column-seperated {
	margin-top: -21px;
	padding-top:21px;
	position: relative;
}
.left-column-separated {
	float: left;
	width: 357px;
	height:358px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
	padding-top: 0px;
	padding-right: 14px;
	padding-bottom: 0px;
	padding-left: 0px;
}
*+html .left-column-separated {
	margin-top: -21px;
	padding-top:21px;
	position: relative;
}
.right-column {
	margin-left: 372px;
	margin-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 14px;
	padding-right: 0px;
	width: 358px;
	vertical-align: top;
}
/*.right-column img {
	text-align: right;
	float: right;
	display: block;
	margin-top: 21px;
}*/
.two-up {
	float: right;
	width: 100%;
}
.three-up {
	width:100%;
	float: right;
}
/*.two-up .right-column img {
	margin-top: 5px;
}*/

.col-1-3 {
	float:left;
	width:198px;
}
.col-2-3 {
	width:198px;
	margin-right: auto;
	margin-left: 75px;
	float: left;
}
.col-3-3 {
	width:198px;
	margin-left: auto;
	margin-right: 0px;
	float: right;
}
.four-up {
	width:100%;
	float: right;
}
.col-1-4 {
	float:left;
	width:165px;
}
.col-2-4 {
	width:165px;
	margin-right: auto;
	margin-left: 28px;
	float: left;
}
.col-3-4 {
	width:165px;
	margin-right: auto;
	margin-left: 28px;
	float: left;
}
.col-4-4 {
	width:165px;
	margin-left: auto;
	margin-right: 0px;
	float: right;
}
/**+html .right-column img {
	margin-top: 0px;
}*/
/*Full-Bleed images*/
.image-full-bleed {
	right: 0px;
	margin-right: -28px;
	margin-top: 0px;
	display: block;
	float: right;
}
.right-frame {
	right: 0px;
	margin-right: -28px;
	margin-top: 0px;
	display: block;
	float: right;
	margin-left: -42px;
	overflow: hidden;
}
/*For CEE title Pages*/
.lesson-title {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 30px;
	color: #FFF;
	background-color: #4d4f58;
	vertical-align: middle;
	text-align: right;
	height: 74px;
	padding-right: 28px;
	padding-left: 28px;
	padding-top: 22px;
	font-weight: bold;
	line-height: 32px;
}
.lesson-title-sub {
	padding-left: 28px;
	padding-right: 28px;
	text-align: left;
	overflow: hidden;
	padding-top: 16px;
	font-size: 30px;
	color: #000;
	font-weight: bold;
	text-decoration: none;
	position: relative;
	vertical-align: top;
}
.lesson-title-sub img {
	padding-right: 14px;
	vertical-align: middle;
}
.summary p {
	font-size: 18px;
	line-height: 24px;
}
/*Text with or without icons */
.no-icon {
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	margin: 0px;
}
.assesment {
	background-image: url(../images/assesment.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.assignment {
	background-image: url(../images/assignment.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.assignment {
	background-image: url(../images/assignment.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.career-connection {
	background-image: url(../images/career_connection.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.example {
	background-image: url(../images/example.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.genre {
	background-image: url(../images/genre.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.instruction {
	background-image: url(../images/instruction.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.lesson-summary {
	background-image: url(../images/lesson_summary.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.lesson-question {
	background-image: url(../images/lesson_question.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
	vertical-align: middle;
	display: block;
	text-align: left;
}
.objectives {
	background-image: url(../images/objectives.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.quick-check {
	background-image: url(../images/quick_check.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.real-world-connection {
	background-image: url(../images/real_world_connection.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.review {
	background-image: url(../images/review.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.think-about-it {
	background-image: url(../images/think_about_it.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.try-it {
	background-image: url(../images/try_it.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
.warm-up {
	background-image: url(../images/warm_up.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 64px;
	padding-left: 90px;
	margin: 0px;
}
/* Math variable style */
var {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
}

/* Widget Classes */
object {
	outline: none;
}
embed {
	outline: none;
}
.indent {
	padding-left: 20px;
	padding-bottom:15px;
	text-decoration: none;
}
.indent:first-letter {
	margin-left: -20px;
	text-decoration: none;
}
.no-indent {
	padding-bottom:15px;
}
.code {
	color: #5b8f22;
	font-family:"Courier New", Courier, monospace;
}
a.procLink:focus {
	background-color: #e1e1e1;
	color: #000;
	text-decoration:none;
}
.dragtile{
                text-align:center; 
                padding:5px 10px 10px 5px;
                line-height:1;
                color:#00;
                border-radius:15px;
                font-weight:bold;
}

.release {}
.release:hover{
                cursor: url ("../../../../../images/openhand.png"), default !important;
                cursor:-moz-grab;
                cursor:-webkit-grab;
}

.grabbing{
                cursor: url ("../../../../../images/closedhand.cur"), default !important;
                cursor:-moz-grabbing;
                cursor:-webkit-grabbing;
}

.icon-qa-wrong2, .icon-qa-right1, .icon-qa-right2, .QuestionContainer {
	height: 16px;
	width: 20px;
	float: left;
}

.QuestionContainer {
	padding-left: 3px;
}

.answer-choice-label {
	display: block;
	margin-left: 22px;
	padding-left: initial !important;
}