/*html { overflow-y: scroll;}*/
a {
	color: #417398;
}
p a {
	text-decoration:underline;
}
a:hover {
	color: #17BABF;
}
html { font-size: 100%; }

body {
	/*font: 1.4em/1.6em "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif*/
	/*font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;*/
	font-family:"Charlie Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans",Ubuntu,"Droid Sans","Helvetica Neue",sans-serif;
	color:#444444;
	background:#68ADF0;
	background:-webkit-gradient(linear, left top, left bottom, from(#3A5D9F), to(#68ADF0)) fixed;
	background:-moz-linear-gradient(top,#3A5D9F,#68ADF0) fixed;
	background:-ms-linear-gradient(top,#3A5D9F,#68ADF0) fixed;
	background:linear-gradient(top,#3A5D9F,#68ADF0) fixed;
	overflow-y:scroll;
	-webkit-overflow-scrolling: touch;
}
.well {
	background:rgba(0,0,0,.01);
	width:80%;
	margin:20px 10%;
}
.screenshot {
	margin:0 1em;
	border:3px solid #FFF;
	border-radius:10px;
	box-shadow:0 0 5px rgba(0,0,0,.25);
	float:left;
}

.mascotContainer {
	text-align: center;
}

/* Bootstrap alert styles */
.alert {
	margin: 10px auto;
}
.errorText {
	font-weight:bold;
}
.successText {
	font-weight:bold;
}
.badge{
	margin:6px;
	padding:8px;
}
.mikuTable .dropdown-toggle {
	margin:-5px;
}
.dropdown-menu li {
	text-align:left;
}
.dropdown-menu li a{
	padding:0.5em 1em;
}
.dropdown-menu .removeLink {
	color:darkred;
}
.dropdown-menu i {
	width:20px;
	display:inline-block;
}

.sidebar li {
	list-style: none;
}

.alert ul {
	margin:10px;
}

h1 {
	font-size: 20px;
	margin-bottom: 4px;
	padding-top: 6px;
}

h2 {
	font-size: 16px;
	margin-bottom: 4px;
	padding-top: 6px;
	text-align:center;
}

::selection {
	background:#1FB9E7;
	color:#FFF;
}

h3 {
	font-size: 18px;
	margin:1em 0;
	padding: 12px 0px 0px 0px;
	display:block;
	font-weight:bold;
}

h3 small {
	font-weight:normal;
	font-size:14px;
}

h4 {
	text-align:center;
	margin-bottom: 10px;
}

@font-face {
  font-family: 'SFCartoonist';
  src: url('../_font/SF_Cartoonist_Hand_Bold.ttf');
  font-weight: bold;
  font-style: normal;
}

@font-face {
    font-family: 'latolight';
    src: url('../_font/lato-lig-webfont.eot');
    src: url('../_font/lato-lig-webfont.eot?#iefix') format('embedded-opentype'),
         url('../_font/lato-lig-webfont.woff') format('woff'),
         url('../_font/lato-lig-webfont.ttf') format('truetype'),
         url('../_font/lato-lig-webfont.svg#latolight') format('svg');
    font-weight: normal;
    font-style: normal;

}

#main h1 {
	margin:0 0 0.3em 0;
	font-family: SFCartoonist, sans-serif;
	font-size:2.0em;
	color:#555;
}
.header h1 {
	font-family: SFCartoonist, sans-serif;
}

#main {
	background: #DDE9F7;
}

#contentBody {
	padding:15px;
	background: #F0F5F9;
	border-right:5px solid #FFF;
	min-height: 380px;
}

.sidebar {
	color:#555;
	padding:10px 0;
}

.sidebar .btn {
	margin:1em auto;
	text-shadow:1px 1px 0 rgba(0,0,0,0.3);
	display:block;
	width:150px;
	font-weight:bold;
	font-family: SFCartoonist, sans-serif;
	font-size:1.3em;
}

.mathzorForm {
	width:450px; margin:0 auto; padding:10px; border-radius:1em;
}

/*###################################
		ALERT STYLINGS
###################################*/

.alertWarning {
	background: #F7FFB2 url('../_img/icon_alert.gif') no-repeat scroll 8px center;
	background: url('../_img/icon_alert.gif') no-repeat scroll 8px center, -moz-linear-gradient(top, #FBFCD6, #F7FFB2);
	background: url('../_img/icon_alert.gif') no-repeat scroll 8px center, -webkit-linear-gradient(top, #FBFCD6, #F7FFB2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FBFCD6', endColorstr='#F7FFB2',GradientType=0);
	border:1px solid #ffcd00;
}

.alertSuccess {
	background: #E6FED6 url('../_img/icon_check.png') no-repeat scroll 8px center;
	background: url('../_img/icon_check.png') no-repeat scroll 8px center, -moz-linear-gradient(top, #E6FED6, #CCEABC);
	background: url('../_img/icon_check.png') no-repeat scroll 8px center, -webkit-linear-gradient(top, #E6FED6, #CCEABC);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E6FED6', endColorstr='#CCEABC',GradientType=0);
	border:1px solid #34AB00;
}

.alertSuccess, .alertWarning {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	margin:15px auto 20px auto;
	padding:10px 10px 10px 50px;
	width: 400px;
	font-size:1.2em;
}
.alertWarning li, .alertSuccess li {
	list-style:inside disc;
}

/*###################################
		BASIC SITE STRUCTURE
###################################*/

.mainContainer {
	background:#FFFFFF;
	margin-top:20px;
	margin-bottom:20px;
	border:5px #fff solid;
}

.shadowed {
	border-radius:10px;
	box-shadow:0 1px 14px rgba(0, 0, 0, 0.3);
	background:#FFF;
}

.clearer {clear: both;}
.left {float: left;}
.right {float: right; }

.headerRight p, .headerRight form {margin: 10px 0px 0px 17px;}

a img {border: none;}

.header {
	background:#5D98AF;
	background:-webkit-gradient(linear, left top, left bottom, from(#8ADFE4), to(#408FA0));
	background:-moz-linear-gradient(top,#8ADFE4,#408FA0);
	background:-ms-linear-gradient(top,#8ADFE4,#408FA0);
	background:linear-gradient(top,#8ADFE4,#408FA0);
	border-radius:10px 10px 0 0;
}

.header a {
	color:#FFFFFF;
}

.header .pageTitle {
	font-family:"trebuchet ms",verdana,helvetica,sans-serif;
	text-align: center;
	color:#FFFFFF;
	font-size:1.5em;
	font-weight:bold;
	text-shadow:1px 0px 0px rgba(0, 0, 0, 0.2);
}

.header .pageTitle h1 {
  	text-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2);
	font-size:3.2em;
   	margin-top:5px;
}

.headerRight {
	color:#FFFFFF;
	font-size:1.0em;
	font-weight:bold;
	text-shadow:1px 1px 0px rgba(0,0,0,.25);
	text-align: center;
}
.headerRight form {
	text-align: right;
	display: inline-block;
}
.headerRight h1 {
	font-size:1.3em;
}
.headerRight .input-group-addon {
	min-width:38px;
	color:#888;
	text-shadow:none;
	background:#FFF;
}
.headerRight .input-group {
	margin:3px 0;
}
.loginForm .btn {
	font-weight: bold;
}
.loginForm input {
	font-size:1.2em;
}
.loginForm .form-group {
	margin-top:8px;
	margin-bottom:12px;
}

/*###################################
		NAVIGATION
###################################*/

.navigation {
	background-color:#BFCDD4;
	background-image:-moz-linear-gradient(top, #F3F6F7, #BFCDD4);
	background-image:-webkit-gradient(linear, left top, left bottom, from(#F3F6F7), to(#BFCDD4));
	background-image:-ms-linear-gradient(top, #F3F6F7, #BFCDD4);
	background-image:linear-gradient(top, #F3F6F7, #BFCDD4);
	font-weight:bold;
	font-size:1.0em;
}

.navigation a {
	color:#456;
	height:2.8em;
	line-height:2.8em;
	text-decoration:none;
	text-shadow:1px 1px 1px rgba(0,0,0,0.15);
	text-align:center;
	border-right:1px solid #BFCDD4;
	border-bottom:1px solid #BFCDD4;
	white-space: nowrap;
}

@media only screen and (max-width : 991px) {
	#contentBody {
		border-right:none;
		border-bottom:5px solid #FFF;
	}
}

.container {
  /*max-width: 950px; /* or 950px */
}

.navigation a:hover, .navigationSelected {
	background:#BFCDD4;
	background:-moz-linear-gradient(top, #BFCDD4, #F3F6F7);
	background:-webkit-linear-gradient(top, #BFCDD4, #F3F6F7);
	background:-ms-linear-gradient(top, #BFCDD4, #F3F6F7);
	background:linear-gradient(top, #BFCDD4, #F3F6F7);
	border-bottom:2px solid #5D98AF !important;
}

/*###################################
		SIDEBAR STYLES
###################################*/

.sidebar h2 {
	color: #555;
	margin: 10px 0 10px 0;
	font-size: 1.2em;
}
.sidebar ul {
	padding:0;
	border-top: 1px solid #C8D6E9;
}
.sidebar li {
	border-bottom: 1px solid #C8D6E9;
	padding:12px;
}
.sidebar i {
	margin-right:5px;
	color:#5D98AF;
}
.sidenavLinks li {
	padding:0px;
}
.sidenavLinks li a {
	color:#777;
	display: block;
	padding: 12px 0 12px 12px;
	text-decoration: none;
	font-weight: bold;
	font-size:0.9em;
	border-left: 4px solid transparent;
}
.chalkboard a, .sidenavLinks li a, .mikuTable td, .navigation a {
	transition: all .15s linear 0;
	-moz-transition: all .15s linear 0;
	-webkit-transition: all .15s linear 0;
	-ms-transition: all .15s linear 0;
}
.sidenavLinks li a:hover, .sidenavLinks .active {
	color: #5D98AF;
	background-color:#deefff;
	border-left:4px solid #5D98AF;
}
.sidenavLinks li a img {
	border:none;
	float:left;
	margin-right:6px;
}

/*.content p {*/
#main p {
	line-height:1.5em;
	text-align:justify;
	font-size:1.1em;
}

.loadingIcon {
	color:teal;
	font-size:8em;
	text-align:center;
	width:100%;
}

.modal-body .pagination {
	margin:0;
}

/* Styles for teacher panels */

.pagination>.active>a {
	background-color:#5D98AF;
}
.mikuTable .tableGreenText td, .mikuTable .greenText {
	color:green;
	background-color:#E9FACF !important;
}
.mikuTable .tableRedText td{
	color:darkred ;
}

#progressUpdate {
	display:block;
	width:9em;
	background:#FFF;
	border-radius:1em;
	overflow:hidden;
	font-size:1.5em;
	float:right;
	margin:1em;
	box-shadow:0 0 5px rgba(0, 0, 0, .1);
	padding:0 0 1em 0;
}
#progressUpdate span {
	padding:0.2em 1em;
	display:block;
}
#progressUpdate h1 {
	background-color:#78C0C0;
	text-align:center;
	padding:.5em 0;
	font-size:1em;
	color:#FFF;
	text-shadow: 2px 2px 1px rgba(0,0,0,.25);
}
#progressUpdate .taken {

}
#progressUpdate .passed {
	color:green;
}
#progressUpdate .failed {
	color:darkred;
}
/* Charting */

.progressChart {
	width:95%;
	margin:1em auto;
	border:1px solid #CCC;
	border-collapse:collapse;
	background:#FCFCFC;
	box-shadow:0 0 5px rgba(0, 0, 0, .1);
}
.progressChart th {
	text-align:center;
}
.progressChart td, .progressChart th {
	border-right:1px solid #CCC;
	height:20px;
	padding:5px 0;
}
.progressChart .progressFill {
	display:block;
	height:20px;
	margin:0;
	padding:0;
	background-color:#5D98AF;
}

.footer {
	clear:both;
	-moz-border-radius:0 0 10px 10px;
	-webkit-border-radius:0 0 10px 10px;
	border-radius:0 0 10px 10px;
	background:#5D98AF;
	color:#FFFFFF;
	font-weight: bold;
	padding:12px;
	text-shadow: 1px 1px 1px #0F5B73;
}
.footer a, .footer a:hover,.footer .right a:hover { color: #FFFFFF; }

label { font-weight: bold; }

.mikuTable {
	border-collapse:collapse;
	margin:20px auto;
	text-align:left;
	border:solid 1px #D3D3D3;
	min-width:95%;
	box-shadow:0 0 5px rgba(0, 0, 0, .1);
	font-size:1.1em;
}

.mikuTable.centeredTable td {
	text-align:center;
}

.mikuTable th, .progressChart th {
	color:#FFFFFF;
	font-weight:bold;
	padding:6px;
	background-color:#78C0C0;
	border: solid 1px #78C0C0;
	text-align:center;
	text-shadow: 1px 1px 0 rgba(0,0,0,.2);
	background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
	background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
	background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
	background-image: linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
}
.mikuTable tbody {
	background-color: #fff;
}
.mikuTable td {
	color:#336699;
	padding:0.8em;
}
.mikuTable tbody tr:hover td {
	background-color: #F3F3F3 !important;
}
.mikuTable tbody tr:nth-child(odd) td {
	background-color:#FAFAFA;
}
.mikuTable .centered {
	text-align:center;
}
.pageLink {
	color:#336699;
	padding: 4px;
	border: solid 1px #D3D3D3;
	margin:5px 5px 0 0;
	background:#fff;
	display:block;
	float:left;
	width:15px;
	text-align:center;
	text-decoration:none;
}
.pageLink:hover{
	background-color: #f1f1f1;
}
.selected{
	font-weight:bold;
	background-color: #f1f1f1;
}

/*###################################
		CHALKBOARD STYLE BUTTONS
###################################*/

.chalkboard a {
	font-size:2em;
	color:#FFF;
	font-family:SFCartoonist, sans-serif;
	background:#318563;
	border:6px solid #E4C181;
	padding:12px;
	text-align:center;
	text-decoration: none;
	text-shadow: 1px 1px 1px #000;
	-moz-box-shadow: 2px 2px 3px #888;
	box-shadow: inset 0 0 1em rgba(0,0,0,.25), 0 0 5px rgba(0,0,0,.25);
}

.chalkboardAuto a {
	display:block;
	width:2em;
}

.chalkboard a:hover {
	background-color: #0C3F29;
	border-color: #DCAD57;
}

.chalkboardFunction a {
	margin:5px;
	font-size:1.5em;
	display:inline-block;
	width:7.5em;
	line-height:1.5em;
}

.chalkboardNumber a{
	margin: 15px 5px 5px 5px;
	width:4em;
	font-size:2.8em;
	line-height:1.2em;
	display:inline-block;
}

.chalkboardNumber li .mixedLink{
	width:150px;
	margin-left:230px;
}

.chalkboardAuto a{
	width: 10em;
	margin: 1em auto;
}

#completedNotification {
	font-size:2em;
	text-align:center;
	margin:1em;
  position: relative;
  background:transparent;

}
#completedNotification i {
	font-size:3em;
	color:gold;
	text-shadow: 0 0 0.01em rgba(0,0,0,.25);

}

/*###################################
		QUIZ TESTING INTERFACE
###################################*/

#container {
	width: 816px;
	background-color: #F2F0F0;
	margin: 15px auto 0px auto;
	padding: 8px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
#content {
	width: 800px;
	background-color: #FFF;
	padding: 5px;
	border: solid 2px #E9E2DA;
}

#loginSelect {
	position:absolute;
	right:30px;
	top:0;
	background-color: #0F0;
	height:40px;
}

/* Class Login Panel */
.classPanel .password{
	font-size:16px;
	width:300px;
	padding:14px;
	border: 2px solid #ccc;
	margin:10px;
	border-radius:5px;
}
.classPanel .password:focus, .classPanel select:focus{
	border: 2px solid #5D98AF;
}
.classPanel select option {
	/*padding:1px;*/
}
.classPanel .altRow {
	background:#EEE;
}
.classPanel label {
	display:block;
	width:90px;
	float:left;
	padding-top:15px;
	text-align:right;
	font-size:16px;
}
.classPanel .loginButton {
	display:block;
	margin:10px 0px 0px 180px;
	padding:4px;
	width:100px;
}

.bigrounded {
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
}
.medium {
	font-size: 12px;
	padding: .4em .5em .42em;
}
.small {
	font-size: 11px;
	padding: .2em 1em .275em;
}

/* Hybrid Forms */
.mathzorForm {
	table-collapse:collapse;
	width:450px;
	margin:0 auto 0 auto;
	border:solid 3px #FFFFFF;
	background:#DDE9F7;
	box-shadow:	0 1px 3px white,inset 0 1px 10px rgba(0, 0, 0, .1);
}
.mathzorForm td {
	padding:5px;
	vertical-align:middle;
}
.mathzorForm input[type='text'], .mathzorForm input[type='password'], .mathzorForm select, .mathzorForm textArea {
	border:2px solid #D2DCE1;
    width:180px;
	font:inherit;
}
.mathzorForm input[type='text']:focus, .mathzorForm input[type='password']:focus, .mathzorForm select:focus, .mathzorForm textArea:focus {
	border: 2px solid #5D98AF;
}
.mathzorForm input, .mathzorForm select, .mathzorForm textArea{
	padding:4px;
}

.simpleBarGraphShell{
	margin-top: 6px;
	width:300px;
	height:16px;
	border:solid 1px #000;
	background-color: #DDE9F7;
}
.simpleBarGraphFill{
	float:left;
	height: 10px;
	background-color: #ADFF2F;
	border-top: 3px solid #9ACD32;
	border-bottom: 3px solid #9ACD32;
}

.header .classSignInLink {
	font-size:1.4em;
	color:#555;
}

.oobeNavigation {
	padding:5px 0 20px 0;
	text-align:center;

}
.subscribeSidebar {
	background-color:#E9FACF;
}
.subscribeSidebar:hover {
	background-color:#E9FACF;
}
.oobeNavigation .oobeHeader {
	font-family: SFCartoonist, sans-serif;
	font-size:2.0em;
	color:#555;
}

.acceptGradient {
	box-shadow:rgba(68, 68, 68, 0.6) 0px 1px 2px -1px;
	box-shadow:rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset;
	border:1px solid #338213;
	border-radius:5px;
	background:-webkit-linear-gradient(top, #7FB56A, #2F860D);
	color:#FFF;
	text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 1px;
	font-weight:bold;
	font-size:1.2em;
	display:block;
	padding:10px;
}

.rejectGradient {

}

.registerOption {
	width:250px;
	text-align:center;
	margin:10px auto 20px auto;
	background:#FEFEFE;
	border:1px solid #31b0d5;
	border-radius:10px;
	padding:10px;
	overflow:hidden;
	box-shadow:0 0 10px rgba(0, 0, 0, .1);
}
.registerOption hr {
	margin:10px 0;
}
#main .registerOption h1 {
	color:#FFF;
	background-color:#31b0d5;
	margin:-10px -10px 10px -10px;
	text-align:left;
	padding:10px;
	text-shadow: 1px 1px 0 rgba(0,0,0,.1);
}
.registerOption .cost {
	float:right;
	color:rgba(255,255,255, 0.6);
	font-size:0.8em;
}
.registerOption #standardTotal{
	color:#FFF;
	font-size:1.3em;
}
.registerOption ul {
	text-align:left;
	padding-left:20px;
	list-style:none;
	line-height:1.9em;
}

.paypal-input {
	width:50px;
	margin:10px;
	border-radius:5px;
	padding:3px;
	border:1px solid #CCC;
}
.glossy, .sidenavLinks li a {
	background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
	background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
	background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
	background-image: linear-gradient(top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(255, 255, 255, 0.2) 100%);
}

	span.twitter-typeahead .tt-dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  text-align: left;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box;
}
span.twitter-typeahead .tt-suggestion > p {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
}
span.twitter-typeahead .tt-suggestion > p:hover,
span.twitter-typeahead .tt-suggestion > p:focus {
  color: #ffffff;
  text-decoration: none;
  outline: 0;
  background-color: #428bca;
}
span.twitter-typeahead .tt-suggestion.tt-cursor {
  color: #ffffff;
  background-color: #428bca;
}
span.twitter-typeahead {
  width: 100%;
}
.input-group span.twitter-typeahead {
  display: block !important;
}
.input-group span.twitter-typeahead .tt-dropdown-menu {
  top: 32px !important;
}
.input-group.input-group-lg span.twitter-typeahead .tt-dropdown-menu {
  top: 44px !important;
}
.input-group.input-group-sm span.twitter-typeahead .tt-dropdown-menu {
  top: 28px !important;
}


/* Backend Styles */
.statsBoxes {
	margin:20px 0;
}
.statBox {
	text-align:center;
	font-size:1.2em;
	padding:7px;
	color:#555;
	margin-bottom:10px;
}
.statBox strong {
	font-size:1.4em;
}
.statBox i {
	font-size:2em;
	line-height: 1.5em;
}

.g-recaptcha {
	display: inline-block;
}