﻿html, body {
	margin:0;
	padding:0;
	font: 16px Arial, Helvetica, sans-serif;
	line-height:20px;
	overflow: hidden;
	min-height:600px;
	background-image: url(../assets/img/fresh_snow.png);
}


.scroll-wrapper {
	-webkit-overflow-scrolling: touch;
	width: 100%;
}

.scroll-wrapper iframe {
	/* nada! */
}


ul li, ol li {
	margin-bottom: 5px;
}

a:visited {
	color: #551A8B;
}

li a {
	cursor: pointer;
}

.student-directions {
    color: #ec5b18;
	margin-bottom: 20px;
}

.student-directions:before {
	font-size:22px;
	content:"» ";
}

.content-header {
	font-size:22px;
	padding-bottom:5px;
	margin-bottom:5px;
	color:#152a6e;
	border-bottom:#EDF2F8 double;	
}


/*
	text colors
*/

.unvisited {
	color: #337ab7 !important;
}

.complete {
	color: #551A8B !important;
}

/*
	Header	
*/

#lessonTitle {
	font-weight: bold;
	color:cornflowerblue;
}


/* the following 2 styles force line breaks in leaf nodes */
#lessonMap {
	max-width: calc(100% - 10px);
}

#lessonMap a {
	white-space: normal !important;
	height: auto;
	padding: 1px 2px;
}


/*
	Content
*/

#content {
	margin: 0 auto;
	max-width:1280px;
	margin-bottom:20px;
	position:relative;
}


/*
	specific content elements
*/


#questionContainer {
    position:relative;
}

.student-text {
	margin:0 0 20px 0;
}

.dropshadow {
	box-shadow: 0 10px 6px -6px #777;
}

.text-dropshadow {
	text-shadow: 0 3px 3px rgba(150, 150, 150, 0.5);
}

/*
	Remediation specific styles
*/


.questionFeedbackHeader {
	font-size: 32px;
	letter-spacing: 2px;
	line-height: 32px;
	margin: 0 0 20px 0;
	padding-top: 6px;
	text-align:center;
}

.questionFeedbackHeaderCorrect {
	color: #4e7801;
}

.questionFeedbackHeaderIncorrect {
	color: red;
}

.questionFeedbackMessageText {
	font-size: 14px;
	padding: 0 10px;
	display: table;
}

#remedImage {
	float: left;
	margin: 0 0 20px 0;
}

#remedImage>img{
	box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, 0.19);
}

#remedText {
	padding:10px;
}

.remed-correct-icon, .remed-incorrect-icon {

}

.remed-correct-icon:after {
	/*
	position:relative;
	top:20px;
	left:10px;
	font-size:66px;
	font-weight: 900;
	color:#4e7801;
	content:"✓";
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
	*/
}

.remed-incorrect-icon:after {
	/*
	position:relative;
	top:20px;
	left:10px;
	font-size:66px;
	font-weight: 900;
	color:red;
	content:"✗";
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
	*/

}

@media (min-width: 768px) {

	#lessonMapModal .modal-dialog {
		width: 50%;
	}

	#referencesModal .modal-dialog {
		width: 70%;
	}

}

#referencesModal .modal-dialog {
	margin: 30px auto;
}

@media (max-width: 768px) {

	#remedImage {
		margin-right:0;
	}
}


/*
	Bootstrap overrides
*/

.thead-inverse th {
	background-color: #373a3c;
	color: #fff;
}

.container-fluid > .navbar-header {
	margin-right: 0;
	margin-left: 0;
}

.navbar-toggle {
	color: #9d9d9d;
}

.table-responsive > .table > thead > tr > th, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tfoot > tr > td {
	white-space: normal;
	word-wrap: break-word;
}

.modal.in .modal-dialog {
	transform: none;
}

.glyphicon-refresh-animate {
	-animation: spin .7s infinite linear;
	-webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
	from { -webkit-transform: rotate(0deg);}
	to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
	from { transform: scale(1) rotate(0deg);}
	to { transform: scale(1) rotate(360deg);}
}