/*! jQuery UI - v1.10.1 - 2013-03-07
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.resizable.css, jquery.ui.selectable.css, jquery.ui.accordion.css, jquery.ui.autocomplete.css, jquery.ui.button.css, jquery.ui.datepicker.css, jquery.ui.dialog.css, jquery.ui.menu.css, jquery.ui.progressbar.css, jquery.ui.slider.css, jquery.ui.spinner.css, jquery.ui.tabs.css, jquery.ui.tooltip.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana%2CArial%2Csans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=highlight_soft&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=flat&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=glass&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=glass&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=glass&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=glass&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=glass&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
* Copyright (c) 2013 jQuery Foundation and other contributors Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-clearfix {
	min-height: 0; /* support: IE7 */
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0);
}

.ui-front {
	z-index: 100;
}


/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}


/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-resizable {
	position: relative;
}
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	display: block;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
	display: none;
}
.ui-resizable-n {
	cursor: n-resize;
	height: 7px;
	width: 100%;
	top: -5px;
	left: 0;
}
.ui-resizable-s {
	cursor: s-resize;
	height: 7px;
	width: 100%;
	bottom: -5px;
	left: 0;
}
.ui-resizable-e {
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-w {
	cursor: w-resize;
	width: 7px;
	left: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize;
	width: 12px;
	height: 12px;
	right: 1px;
	bottom: 1px;
}
.ui-resizable-sw {
	cursor: sw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	bottom: -5px;
}
.ui-resizable-nw {
	cursor: nw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	top: -5px;
}
.ui-resizable-ne {
	cursor: ne-resize;
	width: 9px;
	height: 9px;
	right: -5px;
	top: -5px;
}
.ui-selectable-helper {
	position: absolute;
	z-index: 100;
	border: 1px dotted black;
}
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin-top: 2px;
	padding: .5em .5em .5em .7em;
	min-height: 0; /* support: IE7 */
}
.ui-accordion .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-noicons {
	padding-left: .7em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	position: absolute;
	left: .5em;
	top: 50%;
	margin-top: -8px;
}
.ui-accordion .ui-accordion-content {
	padding: 1em 2.2em;
	border-top: 0;
	overflow: auto;
}
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
.ui-button {
	display: inline-block;
	position: relative;
	padding: 0;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	overflow: visible; /* removes extra width in IE */
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
	text-decoration: none;
}
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
	width: 2.2em;
}
/* button elements seem to need a little more width */
button.ui-button-icon-only {
	width: 2.4em;
}
.ui-button-icons-only {
	width: 3.4em;
}
button.ui-button-icons-only {
	width: 3.7em;
}

/* button text element */
.ui-button .ui-button-text {
	display: block;
	line-height: normal;
}
.ui-button-text-only .ui-button-text {
	padding: .4em 1em;
}
.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
	padding: .4em;
	text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 1em .4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 2.1em .4em 1em;
}
.ui-button-text-icons .ui-button-text {
	padding-left: 2.1em;
	padding-right: 2.1em;
}
/* no icon support for input elements, provide padding by default */
input.ui-button {
	padding: .4em 1em;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
	position: absolute;
	top: 50%;
	margin-top: -8px;
}
.ui-button-icon-only .ui-icon {
	left: 50%;
	margin-left: -8px;
}
.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
	left: .5em;
}
.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
	right: .5em;
}

/* button sets */
.ui-buttonset {
	margin-right: 7px;
}
.ui-buttonset .ui-button {
	margin-left: 0;
	margin-right: -.3em;
}

/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month-year {
	width: 100%;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 49%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}
.ui-dialog {
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em;
	outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
	padding: .4em 1em;
	position: relative;
}
.ui-dialog .ui-dialog-title {
	float: left;
	margin: .1em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 50%;
	width: 21px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}
.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
	text-align: left;
	border-width: 1px 0 0 0;
	background-image: none;
	margin-top: .5em;
	padding: .3em 1em .5em .4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
}
.ui-dialog .ui-resizable-se {
	width: 12px;
	height: 12px;
	right: -5px;
	bottom: -5px;
	background-position: 16px 16px;
}
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
.ui-menu {
	list-style: none;
	padding: 2px;
	margin: 0;
	display: block;
	outline: none;
}
.ui-menu .ui-menu {
	margin-top: -3px;
	position: absolute;
}
.ui-menu .ui-menu-item {
	margin: 0;
	padding: 0;
	width: 100%;
}
.ui-menu .ui-menu-divider {
	margin: 5px -2px 5px -2px;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-menu-item a {
	text-decoration: none;
	display: block;
	padding: 2px .4em;
	line-height: 1.5;
	min-height: 0; /* support: IE7 */
	font-weight: normal;
}
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
	font-weight: normal;
	margin: -1px;
}

.ui-menu .ui-state-disabled {
	font-weight: normal;
	margin: .4em 0 .2em;
	line-height: 1.5;
}
.ui-menu .ui-state-disabled a {
	cursor: default;
}

/* icon support */
.ui-menu-icons {
	position: relative;
}
.ui-menu-icons .ui-menu-item a {
	position: relative;
	padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
	position: absolute;
	top: .2em;
	left: .2em;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
	position: static;
	float: right;
}
.ui-progressbar {
	height: 2em;
	text-align: left;
	overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
	margin: -1px;
	height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
	background: url(http://www.khanacademy.org/"/stylesheets/jqueryui-package/images/animated-overlay.gif");
	height: 100%;
	filter: alpha(opacity=25);
	opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
	background-image: none;
}
.ui-slider {
	position: relative;
	text-align: left;
}
.ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1.2em;
	height: 1.2em;
	cursor: default;
}
.ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}

/* For IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
	filter: inherit;
}

.ui-slider-horizontal {
	height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
	left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
	right: 0;
}

.ui-slider-vertical {
	width: .8em;
	height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
	left: -.3em;
	margin-left: 0;
	margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
	left: 0;
	width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
	bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
	top: 0;
}
.ui-spinner {
	position: relative;
	display: inline-block;
	overflow: hidden;
	padding: 0;
	vertical-align: middle;
}
.ui-spinner-input {
	border: none;
	background: none;
	color: inherit;
	padding: 0;
	margin: .2em 0;
	vertical-align: middle;
	margin-left: .4em;
	margin-right: 22px;
}
.ui-spinner-button {
	width: 16px;
	height: 50%;
	font-size: .5em;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	cursor: default;
	display: block;
	overflow: hidden;
	right: 0;
}
/* more specificity required here to overide default borders */
.ui-spinner a.ui-spinner-button {
	border-top: none;
	border-bottom: none;
	border-right: none;
}
/* vertical centre icon */
.ui-spinner .ui-icon {
	position: absolute;
	margin-top: -8px;
	top: 50%;
	left: 0;
}
.ui-spinner-up {
	top: 0;
}
.ui-spinner-down {
	bottom: 0;
}

/* TR overrides */
.ui-spinner .ui-icon-triangle-1-s {
	/* need to fix icons sprite */
	background-position: -65px -16px;
}
.ui-tabs {
	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
	padding: .2em;
}
.ui-tabs .ui-tabs-nav {
	margin: 0;
	padding: .2em .2em 0;
}
.ui-tabs .ui-tabs-nav li {
	list-style: none;
	float: left;
	position: relative;
	top: 0;
	margin: 1px .2em 0 0;
	border-bottom: 0;
	padding: 0;
	white-space: nowrap;
}
.ui-tabs .ui-tabs-nav li a {
	float: left;
	padding: .5em 1em;
	text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: -1px;
	padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active a,
.ui-tabs .ui-tabs-nav li.ui-state-disabled a,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading a {
	cursor: text;
}
.ui-tabs .ui-tabs-nav li a, /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a {
	cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	padding: 1em 1.4em;
	background: none;
}
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
}
body .ui-tooltip {
	border-width: 2px;
}

/* Component containers
----------------------------------*/
.ui-widget {
	font-family: Verdana,Arial,sans-serif;
	font-size: 1.1em;
}
.ui-widget .ui-widget {
	font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
	font-family: Verdana,Arial,sans-serif;
	font-size: 1em;
}
.ui-widget-content {
	border: 1px solid #aaaaaa;
	background: #ffffff url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;
	color: #222222;
}
.ui-widget-content a {
	color: #222222;
}
.ui-widget-header {
	border: 1px solid #aaaaaa;
	background: #cccccc url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x;
	color: #222222;
	font-weight: bold;
}
.ui-widget-header a {
	color: #222222;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
	border: 1px solid #d3d3d3;
	background: #e6e6e6 url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
	font-weight: normal;
	color: #555555;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
	color: #555555;
	text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
	border: 1px solid #999999;
	background: #dadada url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
	font-weight: normal;
	color: #212121;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited {
	color: #212121;
	text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
	border: 1px solid #aaaaaa;
	background: #ffffff url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x;
	font-weight: normal;
	color: #212121;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: #212121;
	text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
	border: 1px solid #fcefa1;
	background: #fbf9ee url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x;
	color: #363636;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: #363636;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 1px solid #cd0a0a;
	background: #fef1ec url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x;
	color: #cd0a0a;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
	color: #cd0a0a;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: #cd0a0a;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
	font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
	opacity: .7;
	filter:Alpha(Opacity=70);
	font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: .35;
	filter:Alpha(Opacity=35);
	background-image: none;
}
.ui-state-disabled .ui-icon {
	filter:Alpha(Opacity=35); /* For IE8 - See #6059 */
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	width: 16px;
	height: 16px;
	background-position: 16px 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_222222_256x240.png);
}
.ui-widget-header .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_222222_256x240.png);
}
.ui-state-default .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_888888_256x240.png);
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_454545_256x240.png);
}
.ui-state-active .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_454545_256x240.png);
}
.ui-state-highlight .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_2e83ff_256x240.png);
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
	background-image: url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-icons_cd0a0a_256x240.png);
}

/* positioning */
.ui-icon-carat-1-n { background-position: 0 0; }
.ui-icon-carat-1-ne { background-position: -16px 0; }
.ui-icon-carat-1-e { background-position: -32px 0; }
.ui-icon-carat-1-se { background-position: -48px 0; }
.ui-icon-carat-1-s { background-position: -64px 0; }
.ui-icon-carat-1-sw { background-position: -80px 0; }
.ui-icon-carat-1-w { background-position: -96px 0; }
.ui-icon-carat-1-nw { background-position: -112px 0; }
.ui-icon-carat-2-n-s { background-position: -128px 0; }
.ui-icon-carat-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -64px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -64px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }


/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: 4px;
}

/* Overlays */
.ui-widget-overlay {
	background: #aaaaaa url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30);
}
.ui-widget-shadow {
	margin: -8px 0 0 -8px;
	padding: 8px;
	background: #aaaaaa url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30);
	border-radius: 8px;
}

/*
 * qTip2 - Pretty powerful tooltips - v2.2.0
 * http://qtip2.com
 *
 * Copyright (c) 2013 Craig Michael Thompson
 * Released under the MIT, GPL licenses
 * http://jquery.org/license
 *
 * Date: Thu Nov 21 2013 08:34 GMT+0000
 * Plugins: tips modal viewport svg imagemap ie6
 * Styles: basic css3
 */
.qtip{
	position: absolute;
	left: -28000px;
	top: -28000px;
	display: none;

	max-width: 280px;
	min-width: 50px;

	font-size: 10.5px;
	line-height: 12px;

	direction: ltr;

	box-shadow: none;
	padding: 0;
}

	.qtip-content{
		position: relative;
		padding: 5px 9px;
		overflow: hidden;

		text-align: left;
		word-wrap: break-word;
	}

	.qtip-titlebar{
		position: relative;
		padding: 5px 35px 5px 10px;
		overflow: hidden;

		border-width: 0 0 1px;
		font-weight: bold;
	}

	.qtip-titlebar + .qtip-content{ border-top-width: 0 !important; }

	/* Default close button class */
	.qtip-close{
		position: absolute;
		right: -9px; top: -9px;

		cursor: pointer;
		outline: medium none;

		border-width: 1px;
		border-style: solid;
		border-color: transparent;
	}

		.qtip-titlebar .qtip-close{
			right: 4px; top: 50%;
			margin-top: -9px;
		}

		* html .qtip-titlebar .qtip-close{ top: 16px; } /* IE fix */

		.qtip-titlebar .ui-icon,
		.qtip-icon .ui-icon{
			display: block;
			text-indent: -1000em;
			direction: ltr;
		}

		.qtip-icon, .qtip-icon .ui-icon{
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
			border-radius: 3px;
			text-decoration: none;
		}

			.qtip-icon .ui-icon{
				width: 18px;
				height: 14px;

				line-height: 14px;
				text-align: center;
				text-indent: 0;
				font: normal bold 10px/13px Tahoma,sans-serif;

				color: inherit;
				background: transparent none no-repeat -100em -100em;
			}

/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
.qtip-focus{}

/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
.qtip-hover{}

/* Default tooltip style */
.qtip-default{
	border-width: 1px;
	border-style: solid;
	border-color: #F1D031;

	background-color: #FFFFA3;
	color: #555;
}

	.qtip-default .qtip-titlebar{
		background-color: #FFEF93;
	}

	.qtip-default .qtip-icon{
		border-color: #CCC;
		background: #F1F1F1;
		color: #777;
	}

	.qtip-default .qtip-titlebar .qtip-close{
		border-color: #AAA;
		color: #111;
	}



/*! Light tooltip style */
.qtip-light{
	background-color: white;
	border-color: #E2E2E2;
	color: #454545;
}

	.qtip-light .qtip-titlebar{
		background-color: #f1f1f1;
	}


/*! Dark tooltip style */
.qtip-dark{
	background-color: #505050;
	border-color: #303030;
	color: #f3f3f3;
}

	.qtip-dark .qtip-titlebar{
		background-color: #404040;
	}

	.qtip-dark .qtip-icon{
		border-color: #444;
	}

	.qtip-dark .qtip-titlebar .ui-state-hover{
		border-color: #303030;
	}


/*! Cream tooltip style */
.qtip-cream{
	background-color: #FBF7AA;
	border-color: #F9E98E;
	color: #A27D35;
}

	.qtip-cream .qtip-titlebar{
		background-color: #F0DE7D;
	}

	.qtip-cream .qtip-close .qtip-icon{
		background-position: -82px 0;
	}


/*! Red tooltip style */
.qtip-red{
	background-color: #F78B83;
	border-color: #D95252;
	color: #912323;
}

	.qtip-red .qtip-titlebar{
		background-color: #F06D65;
	}

	.qtip-red .qtip-close .qtip-icon{
		background-position: -102px 0;
	}

	.qtip-red .qtip-icon{
		border-color: #D95252;
	}

	.qtip-red .qtip-titlebar .ui-state-hover{
		border-color: #D95252;
	}


/*! Green tooltip style */
.qtip-green{
	background-color: #CAED9E;
	border-color: #90D93F;
	color: #3F6219;
}

	.qtip-green .qtip-titlebar{
		background-color: #B0DE78;
	}

	.qtip-green .qtip-close .qtip-icon{
		background-position: -42px 0;
	}


/*! Blue tooltip style */
.qtip-blue{
	background-color: #E5F6FE;
	border-color: #ADD9ED;
	color: #5E99BD;
}

	.qtip-blue .qtip-titlebar{
		background-color: #D0E9F5;
	}

	.qtip-blue .qtip-close .qtip-icon{
		background-position: -2px 0;
	}



.qtip-shadow{
	-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
	box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}

/* Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
.qtip-rounded,
.qtip-tipsy,
.qtip-bootstrap{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.qtip-rounded .qtip-titlebar{
	-moz-border-radius: 4px 4px 0 0;
	-webkit-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}

/* Youtube tooltip style */
.qtip-youtube{
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;

	-webkit-box-shadow: 0 0 3px #333;
	-moz-box-shadow: 0 0 3px #333;
	box-shadow: 0 0 3px #333;

	color: white;
	border-width: 0;

	background: #4A4A4A;
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#4A4A4A),color-stop(100%,black));
	background-image: -webkit-linear-gradient(top,#4A4A4A 0,black 100%);
	background-image: -moz-linear-gradient(top,#4A4A4A 0,black 100%);
	background-image: -ms-linear-gradient(top,#4A4A4A 0,black 100%);
	background-image: -o-linear-gradient(top,#4A4A4A 0,black 100%);
}

	.qtip-youtube .qtip-titlebar{
		background-color: #4A4A4A;
		background-color: rgba(0,0,0,0);
	}

	.qtip-youtube .qtip-content{
		padding: .75em;
		font: 12px arial,sans-serif;

		filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);
		-ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);";
	}

	.qtip-youtube .qtip-icon{
		border-color: #222;
	}

	.qtip-youtube .qtip-titlebar .ui-state-hover{
		border-color: #303030;
	}


/* jQuery TOOLS Tooltip style */
.qtip-jtools{
	background: #232323;
	background: rgba(0, 0, 0, 0.7);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#717171), to(#232323));
	background-image: -moz-linear-gradient(top, #717171, #232323);
	background-image: -webkit-linear-gradient(top, #717171, #232323);
	background-image: -ms-linear-gradient(top, #717171, #232323);
	background-image: -o-linear-gradient(top, #717171, #232323);

	border: 2px solid #ddd;
	border: 2px solid rgba(241,241,241,1);

	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;

	-webkit-box-shadow: 0 0 12px #333;
	-moz-box-shadow: 0 0 12px #333;
	box-shadow: 0 0 12px #333;
}

	/* IE Specific */
	.qtip-jtools .qtip-titlebar{
		background-color: transparent;
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A)";
	}
	.qtip-jtools .qtip-content{
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323)";
	}

	.qtip-jtools .qtip-titlebar,
	.qtip-jtools .qtip-content{
		background: transparent;
		color: white;
		border: 0 dashed transparent;
	}

	.qtip-jtools .qtip-icon{
		border-color: #555;
	}

	.qtip-jtools .qtip-titlebar .ui-state-hover{
		border-color: #333;
	}


/* Cluetip style */
.qtip-cluetip{
	-webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
	box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);

	background-color: #D9D9C2;
	color: #111;
	border: 0 dashed transparent;
}

	.qtip-cluetip .qtip-titlebar{
		background-color: #87876A;
		color: white;
		border: 0 dashed transparent;
	}

	.qtip-cluetip .qtip-icon{
		border-color: #808064;
	}

	.qtip-cluetip .qtip-titlebar .ui-state-hover{
		border-color: #696952;
		color: #696952;
	}


/* Tipsy style */
.qtip-tipsy{
	background: black;
	background: rgba(0, 0, 0, .87);

	color: white;
	border: 0 solid transparent;

	font-size: 11px;
	font-family: 'Lucida Grande', sans-serif;
	font-weight: bold;
	line-height: 16px;
	text-shadow: 0 1px black;
}

	.qtip-tipsy .qtip-titlebar{
		padding: 6px 35px 0 10px;
		background-color: transparent;
	}

	.qtip-tipsy .qtip-content{
		padding: 6px 10px;
	}

	.qtip-tipsy .qtip-icon{
		border-color: #222;
		text-shadow: none;
	}

	.qtip-tipsy .qtip-titlebar .ui-state-hover{
		border-color: #303030;
	}


/* Tipped style */
.qtip-tipped{
	border: 3px solid #959FA9;

	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;

	background-color: #F9F9F9;
	color: #454545;

	font-weight: normal;
	font-family: serif;
}

	.qtip-tipped .qtip-titlebar{
		border-bottom-width: 0;

		color: white;
		background: #3A79B8;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#3A79B8), to(#2E629D));
		background-image: -webkit-linear-gradient(top, #3A79B8, #2E629D);
		background-image: -moz-linear-gradient(top, #3A79B8, #2E629D);
		background-image: -ms-linear-gradient(top, #3A79B8, #2E629D);
		background-image: -o-linear-gradient(top, #3A79B8, #2E629D);
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D)";
	}

	.qtip-tipped .qtip-icon{
		border: 2px solid #285589;
		background: #285589;
	}

		.qtip-tipped .qtip-icon .ui-icon{
			background-color: #FBFBFB;
			color: #555;
		}


/**
 * Twitter Bootstrap style.
 *
 * Tested with IE 8, IE 9, Chrome 18, Firefox 9, Opera 11.
 * Does not work with IE 7.
 */
.qtip-bootstrap{
	/** Taken from Bootstrap body */
	font-size: 14px;
	line-height: 20px;
	color: #333333;

	/** Taken from Bootstrap .popover */
	padding: 1px;
	background-color: #ffffff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
}

	.qtip-bootstrap .qtip-titlebar{
		/** Taken from Bootstrap .popover-title */
		padding: 8px 14px;
		margin: 0;
		font-size: 14px;
		font-weight: normal;
		line-height: 18px;
		background-color: #f7f7f7;
		border-bottom: 1px solid #ebebeb;
		-webkit-border-radius: 5px 5px 0 0;
		-moz-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0;
	}

		.qtip-bootstrap .qtip-titlebar .qtip-close{
			/**
			 * Overrides qTip2:
			 * .qtip-titlebar .qtip-close{
			 *   [...]
			 *   right: 4px;
			 *   top: 50%;
			 *   [...]
			 *   border-style: solid;
			 * }
			 */
			right: 11px;
			top: 45%;
			border-style: none;
		}

	.qtip-bootstrap .qtip-content{
		/** Taken from Bootstrap .popover-content */
		padding: 9px 14px;
	}

	.qtip-bootstrap .qtip-icon{
		/**
		 * Overrides qTip2:
		 * .qtip-default .qtip-icon {
		 *   border-color: #CCC;
		 *   background: #F1F1F1;
		 *   color: #777;
		 * }
		 */
		background: transparent;
	}

		.qtip-bootstrap .qtip-icon .ui-icon{
			/**
			 * Overrides qTip2:
			 * .qtip-icon .ui-icon{
			 *   width: 18px;
			 *   height: 14px;
			 * }
			 */
			width: auto;
			height: auto;

			/* Taken from Bootstrap .close */
			float: right;
			font-size: 20px;
			font-weight: bold;
			line-height: 18px;
			color: #000000;
			text-shadow: 0 1px 0 #ffffff;
			opacity: 0.2;
			filter: alpha(opacity=20);
		}

		.qtip-bootstrap .qtip-icon .ui-icon:hover{
			/* Taken from Bootstrap .close:hover */
			color: #000000;
			text-decoration: none;
			cursor: pointer;
			opacity: 0.4;
			filter: alpha(opacity=40);
		}


/* IE9 fix - removes all filters */
.qtip:not(.ie9haxors) div.qtip-content,
.qtip:not(.ie9haxors) div.qtip-titlebar{
	filter: none;
	-ms-filter: none;
}



.qtip .qtip-tip{
	margin: 0 auto;
	overflow: hidden;
	z-index: 10;

}

	/* Opera bug #357 - Incorrect tip position
	https://github.com/Craga89/qTip2/issues/367 */
	x:-o-prefocus, .qtip .qtip-tip{
		visibility: hidden;
	}

	.qtip .qtip-tip,
	.qtip .qtip-tip .qtip-vml,
	.qtip .qtip-tip canvas{
		position: absolute;

		color: #123456;
		background: transparent;
		border: 0 dashed transparent;
	}

	.qtip .qtip-tip canvas{ top: 0; left: 0; }

	.qtip .qtip-tip .qtip-vml{
		behavior: url(#default#VML);
		display: inline-block;
		visibility: visible;
	}

#qtip-overlay{
	position: fixed;
	left: 0; top: 0;
	width: 100%; height: 100%;
}

	/* Applied to modals with show.modal.blur set to true */
	#qtip-overlay.blurs{ cursor: pointer; }

	/* Change opacity of overlay here */
	#qtip-overlay div{
		position: absolute;
		left: 0; top: 0;
		width: 100%; height: 100%;

		background-color: black;

		opacity: 0.7;
		filter:alpha(opacity=70);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	}



.qtipmodal-ie6fix{
	position: absolute !important;
}

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* End Reset */
/* Borrowed from those smart guys @ Fog Creek. Props to Justin & Bobby */
.fancy-scrollbar::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}
.fancy-scrollbar::-webkit-scrollbar-button:start:decrement,
.fancy-scrollbar::-webkit-scrollbar-button:end:increment {
  background: transparent;
  display: none;
}
.fancy-scrollbar::-webkit-scrollbar-track-piece {
  background: transparent;
}
.fancy-scrollbar::-webkit-scrollbar-track-piece:vertical:start {
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
}
.fancy-scrollbar::-webkit-scrollbar-track-piece:vertical:end {
  -webkit-border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
}
.fancy-scrollbar::-webkit-scrollbar-track-piece:horizontal:start {
  -webkit-border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
}
.fancy-scrollbar::-webkit-scrollbar-track-piece:horizontal:end {
  -webkit-border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
}
.fancy-scrollbar::-webkit-scrollbar-thumb:vertical,
.fancy-scrollbar::-webkit-scrollbar-thumb:horizontal {
  background: #ccc;
  border: 1px solid #aaa;
  -webkit-border-radius: 4px;
  display: block;
  height: 50px;
}
/*
 * jQuery UI Menu 1.8.24
 *
 * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Menu#theming
 */
.ui-menu {
    list-style:none;
    padding: 2px;
    margin: 0;
    display:block;
    float: left;
}
.ui-menu .ui-menu {
    margin-top: -3px;
}
.ui-menu .ui-menu-item {
    margin:0;
    padding: 0;
    zoom: 1;
    float: left;
    clear: left;
    width: 100%;
}
.ui-menu .ui-menu-item a {
    text-decoration:none;
    display:block;
    padding:.2em .4em;
    line-height:1.5;
    zoom:1;
}
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
    font-weight: normal;
    margin: -1px;
}

/* From jquery-ui-1.10.1.custom.css, for homepage */
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/*!
 * jQuery UI Autocomplete 1.8.24
 *
 * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Autocomplete#theming
 */
.ui-autocomplete { position: absolute; cursor: default; }

.ui-widget-content { border: 1px solid #aaaaaa; background: #ffffff url(http://www.khanacademy.org/stylesheets/jqueryui-package/images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; color: #222222; }

.ui-autocomplete.ui-menu {
    padding:0;

    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}
ul.ui-autocomplete .ui-menu-item a,
ul.ui-autocomplete .ui-menu-item .autocomplete-spacer {
    background: #f2f2f2;
    font-size: 11px;
    white-space: nowrap;
    padding: 0;
    padding-right: 10px;
    cursor: pointer;

    border: none;

    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}
ul.ui-autocomplete .ui-menu-item .autocomplete-spacer {
    cursor: auto;
}
ul.ui-autocomplete .ui-menu-item a.ui-state-focus {
    background: #89B908;
    border: none;
    margin: 0;
    color: #fff;
}
ul.ui-autocomplete .ui-menu-item a.ui-state-focus .autocomplete-type {
    background: #89B908;
    border-color: transparent;
    color: #fff;
}

ul.ui-autocomplete .ui-menu-item a .autocomplete-type,
ul.ui-autocomplete .ui-menu-item .autocomplete-empty {
    background: #f7f7f7;
    border-right: 1px solid #ddd;
    box-sizing: border-box;
    color: #898989;
    display: inline-block;
    margin-right: 5px;
    padding-right: 5px;
    text-align: right;
    width: 60px;
}
.autocomplete-spacer {
    height: 7px;
}

#library-content {
    background-color: #fff;
    border-top: 0;
}
    #library-content #library-content-main {
        padding: 0 0 38px;
    }
        #library-content .library-content-header h2 {
            margin-top: 0;
            margin-bottom: .9em;
            color: #333;
        }
        #library-content .library-content-header h2.topic-heading {
            margin-top: 38px;
            margin-bottom: 5px;
            font-size: 18px
        }
        #library-content .library-content-header h2.subtopic-1-heading {
            font-size: 16px;
            margin-top: 20px;
            margin-bottom: 10px;
            line-height: 16px;
        }
        #library-content .library-content-header h2.subtopic-1-heading.topic-heading-first {
            margin-top: 4px;
        }
        #library-content div.subtopic-jump-fix {
            position: relative;
            top: -20px;
        }
        #library-content .subtopic-jump-fix.first {
            top: -35px;
        }
        #library-content .library-content-header .subtopic-2-heading {
            font-size: 14px;
            margin-top: 6px;
            margin-bottom: 0;
            line-height: 16px;
            font-style: italic;
        }
        #library-content .library-content-list .topic-loading {
            padding-left: 14px;
        }
        #library-content .library-content-list .topic-desc {
            color: #555;
            margin: 0 0 10px;
            font-size: 13px;
        }
        #library-content .library-content-list > div {
            margin-left: -14px;
            padding-left: 0;
        }
        #library-content .library-content-list a.vl {
            display: block;
            line-height: 18px;
            overflow: hidden;
            padding-left: 14px;
            text-decoration: none;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        #library-content .library-content-list a.vl:hover {
            color: black;
        }
/* Exercise Dashboard styles */

/* TODO(jasonrr): figure out how or why this is used in exercise files/templates */
#container {
    position: relative;
}
    #container.dashboard {
        background: #fff;
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        line-height: 18px;
    }
    .exercise-badge {
        position: relative;
    }
        .exercise-badge .topic-exercise-image {
            margin: -1px 5px 0 0;
        }

    /* TODO(kamens): goals: remove when goals are removed */
    .exercise-goal-icon {
        width: 12px;
        height: 12px;
    }
    .progress-item .exercise-goal-icon {
        /* Flag positioning for Athena version of knowledge map goal picker */
        position: absolute;
        right: 10px;
        top: 20px;
    }
    .progress-item a.disabled {
        /* Disabled cursor for Athena version of knowledge map goal picker */
        cursor: not-allowed;
    }

    #container .dashboard-drawer {
        position: absolute;
        background: #fff;
        width: 350px;
        height: 800px;
        z-index: 1;
        -webkit-box-shadow: 2px 0 3px rgba(0, 0, 0, .1);
        -moz-box-shadow: 2px 0 3px rgba(0, 0, 0, .1);
        box-shadow: 2px 0 3 rgba(0, 0, 0, .1);
        overflow: hidden;
    }
    #container .dashboard-filter {
        overflow: hidden;
        padding: 0 0 10px 0;
    }
    #container .dashboard-filter-text {
        background-image: none;
        border-color: #ccc;
        padding: 0 55px 0 5px;
        width: 260px;
    }
    .ie #container .dashboard-filter-text {
        height: 24px;
    }
    .dashboard-filter .dashboard-filter-clear {
        height: 26px;
        padding-top: 4px;

        position: absolute;
        top: 10px;
        right: 13px;
        z-index: 100;
    }
    .dashboard-filter-clear:active {
        top: 10px;
        padding-top: 5px;
    }
    .ie .dashboard-filter-clear {
        top: 12px;
    }
    #container .dashboard-drawer-inner {
        position: relative;
        margin-right: 2px;
        overflow: auto;
        padding: 10px 3px 10px 5px;
    }
    #container .dashboard-drawer-inner h3 {
        margin-bottom: 0;
    }

    #container .dashboard-drawer h3 .subheader {
        font-weight: normal;
    }

    #container .dashboard-header {
        background: #fafafa;
        border-width: 0 0 1px 0;
        border-color: #ddd;
        border-style: solid;
        height: 24px;
        padding: 5px;
        position: relative;
        z-index: 0;
    }
    #container .dashboard-header .collapse-drawer,
    #container .dashboard-header .expand-drawer {
        border: none;
        height: 25px;
        position: absolute;
        top: 5px;
        width: 25px;
    }
    #container .dashboard-header .collapse-drawer {
        background: url(http://www.khanacademy.org/images/expand-left.png) no-repeat 0 0;
        right: 0;
    }
    #container .dashboard-header .expand-drawer {
        background: url(http://www.khanacademy.org/images/expand-right.png) no-repeat 0 0;
        left: 0;
    }

    #container .dashboard-header .dashboard-title {
        background: #fafafa;
        border-right: 1px solid #bbb;
        color: #444;
        font-size: 18px;
        font-family: "MuseoSans500", sans-serif;
        width: 340px;
        margin: -5px;
        padding: 8px 5px 0;
        height: 26px;
        position: absolute;
        -webkit-box-shadow: 2px 0 3px rgba(0, 0, 0, .1);
        -moz-box-shadow: 2px 0 3px rgba(0, 0, 0, .1);
        box-shadow: 2px 0 3px rgba(0, 0, 0, .1);
        z-index: 1;
    }
        #container .dashboard-header .dashboard-title .dashboard-icon {
            background: url(http://www.khanacademy.org/images/dashboard-icon-active.png) no-repeat 0 0;
            display: inline-block;
            height: 16px;
            position: relative;
            top: 1px;
            width: 18px;
        }

    #container .dashboard-header .dashboard-nav {
        float: right;
        font-weight: bold;
        position: relative;
        top: 3px;
    }
    #container .dashboard-header .dashboard-nav span.selected a {
        border: none;
        color: #333;
        cursor: default;
    }

    #container .dashboard-map .map-canvas {
        height: 100%;
        left: 350px;
        margin-left: 0;
        margin-right: 350px;
    }

    /* Specifically for videos (i.e. in New Goal view) */
    #container .dashboard-header .dashboard-nav .topic_browser {
        margin: 0;
    }

.exercise-filter-count {
    font-size: 11px;
    color: #444;
}
.exercise-sublist {
    margin-top: 24px;
    display: block;
}
.exercise-sublist:first-child {
    margin-top: 0;
}

.info-box {
    background: #eee;
    border: 1px solid #ccc;
    border-bottom: 1px solid #aaa;
    color: #333;
    margin-bottom: 10px;
    overflow-x: auto;
    padding: 10px;
    position: relative;
    z-index: 10;

    -moz-box-shadow: 0 1px 2px #ccc;
    -webkit-box-shadow: 0 1px 2px #ccc;
    box-shadow: 0 1px 2px #ccc;
}
.info-box table {
    border-collapse: collapse;
}
.info-box .info-box-header, .info-box .info-box-subheader {
    color: #777;
    display: block;
    font-size: 18px;
    line-height: 100%;
    margin-bottom: 10px;
    font-weight: bold;
    text-shadow: 0 1px 0 #fff;
}
.info-box .info-box-subheader {
    line-height: 200%;
    font-size: 14px;
    color: #333;
}
.info-box .related-content-title {
    display: none;
}
.info-box #related-video-list {
    padding: 0;
    margin: 0;
    list-style: none;
}
    .info-box #related-video-list li {
        display: block;
        margin: 0 0 5px 0;
    }
    .info-box #related-video-list a {
        display: block;
        float: left;
        margin: 0;
        width: 98%;
        overflow: hidden;
        text-overflow: ellipsis;
    }
        .info-box #related-video-list a .video-title {
            white-space: nowrap;
        }
        
    .info-box #related-video-list .separator {
        display: none;
    }

.info-box .info-box-sub-description {
    display: block;
    color: #777;
    margin-bottom: 10px;
}
    .info-box .info-box-sub-description strong {
        color: #444;
        font-style: italic;
    }

.info-box .info-box-sub-submission {
    display: block;
    margin-top: 10px;
}

.info-box #check-answer-results #feedback {
    padding: 10px 0 5px;
}
.info-box #answer {
    width: 100px;
}
#thumbnails_container {
    clear: both;
    margin-top: 10px;
}

#thumbnails_container td {
    text-align: center;
}

#thumbnails > div {
    width: 100%;
}

#thumbnails td a {
    outline: none;
    color: #fff;
    white-space: pre;
}

#thumbnails td a:hover {
    text-decoration: none;
}

#thumbnails td div.thumb {
    background-repeat: no-repeat;
    background-position: top left;
    width: 200px;
    height: 100px;
    border: 1px solid #aaa;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-shadow: 0 0 3px #ccc;
    -moz-box-shadow: 0 0 3px #ccc;
    box-shadow: 0 0 3px #ccc;
    background-size: 200px 150px;
}
#thumbnails td.video-thumb div.thumb {
    background-position: 0 -25px;
}

.lte8 #thumbnails td.video-thumb div.thumb {
    /* IE doesn't support background-size, so we'll just reposition the larger background */
    background-position-y: -80px;
    background-position-x: -100px;
}

#thumbnails td.selected div.thumb {
    border: 2px solid #89B908;
}

#thumbnails td div.thumbnail_label {
    padding: 5px 10px;
    max-width: 180px;
    margin: 0 auto;
    text-align: left;
    margin-top: -33px;
    background-color: #333;
    background-color: rgba(30, 30, 30, 0.9);
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
}

#thumbnails td div.thumbnail_desc {
    width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

#thumbnails td div.thumbnail_teaser {
    height: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    text-decoration: none;
    font-size: 11px;
}

#thumbnails td.selected div.thumbnail_label {
    font-weight: bold;
}

.thumbnails_arrow {
    cursor: pointer;
    border: 1px solid #ccc;
    border-bottom: 1px solid #bbb;
    height: 100px;
    position: relative;
    width: 27px;

    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;

    text-shadow: 0 1px 0 #fff;
}

.thumbnails_arrow:hover {
    border-color: #aaa;
    top: 1px;
}

#arrow-right {
    float: right;
}

div.arrow-right, div.arrow-left {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;

    position: absolute;
    top: 35px;
    z-index: 2;
}
    div.arrow-right {
        border-left: 15px solid #777;
        left: 7px;
    }
    div.arrow-left {
        border-right: 15px solid #777;
        right: 7px;
    }

// TODO(benkomalo): some of this stuff really needs to be moved to a specific
// stylesheet to power templates/viewbadges.html, and not be everywhere

.achievement-badge-counts {
    text-decoration: none;
}
.achievement-badge-counts .badge {
  margin-right:10px;
}

.achievement-badge-counts .badge img {
  margin-right:-2px;
}

.achievement-badge {
    background: white;
    border: 1px solid #ddd;
    margin-bottom: 15px;
    margin-left: 15px;
    position: relative;
    width: 300px;
    height: 110px;
    opacity: 0.75;
    filter:alpha(opacity=75);

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.achievement-badge-owned {
    border: 1px solid #bbb;
    opacity: 1.0;
    filter:alpha(opacity=100);
}
.achievement-badge-owned {
    border: 1px solid #ccc;
    border-bottom-color: #aaa;
    background: #eee;
}
.achievement-badge-owned #outline-box {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
    .achievement-badge .energy-points-badge {
        padding: 1px 0 0;
        width: 48px;
        height: 21px;
        line-height: 19px;
        position: absolute;
        right: 5px;
        top: 7px;
    }
    .achievement-badge .achievement-text {
        margin: 10px 4px 0 47px;
        padding: 7px 7px 7px 20px;
    }
    .achievement-badge .achievement-title {
        font-size: larger;
    }
    .achievement-badge .achievement-count {
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        float: left;
        clear: left;
        width: 45px;
    }
    .achievement-badge .achievement-desc .badge-context-retired {
        color: red;
    }
    .achievement-badge .achievement-desc {
        font-size: 11px;
        line-height: 13px;
        margin: 8px 0 0;
        max-height: 39px;
        font-style: italic;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
    .achievement-badge .achievement-desc.expanded {
        max-height: 494px;
        -webkit-line-clamp: 38;
    }
    .achievement-badge #badge-icon {
        width: 40px;
        height: 40px;
        margin: 10px 0 0 12px;
        float: left;
    }
    .achievement-badge.category-5 #badge-icon {
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px;
        border-radius: 20px;
    }
    /*.achievement-badge.category-0 #badge-icon {
        margin-top: 10px;
    }*/

    .achievement-badge .energy-points-badge {
        -webkit-transition: top 250ms ease-in-out;
        -moz-transition: top 250ms ease-in-out;
        -ms-transition: top 250ms ease-in-out;
        -o-transition: top 250ms ease-in-out;
        transition: top 250ms ease-in-out;
    }
    .achievement-badge .energy-points-badge.goal-added{
        top:25px;
    }

.achievement-badges-container .achievement-badge {
    float: left;
}
.achievement-badges-container h3 {
    font-size: 15px;
    color: #333;
    display: block;
}

.achievement-badges-explanation {
    padding: 15px 30px;
}
    .achievement-badges-explanation table {
        width: 100%;
    }
    .achievement-badges-explanation table td {
        text-align: center;
        vertical-align: top;
        padding: 5px 10px;
    }

/* Start knowledge map CSS */
.nodeLabel {
    display: block;
    text-align: center;
    cursor: pointer;
    line-height: normal;
}

a.nodeLabel:hover {
    text-decoration: none;
}

.node-text {
    color: white;
    font-family: "Lucida Grande", "Arial", sans-serif;
    font-size: 12px;
    width: 80px;
    /* Fallback for web browsers that doesn't support RGBa */
    background: rgb(0, 0, 0) transparent;
    /* RGBa with 0.5 opacity */
    background: rgba(0, 0, 0, 0.5);
}

.nodeLabelFiltered .node-text {
    color: #444;
}

.node-icon {
    display: inline-block;
}

.map-marker.exercise {
    display: block;
}

.nodeLabel.exercise {
    display: block;
}

.node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete.png?glove); }   /*! data-uri */
.node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review.png?glove); }     /*! data-uri */
.node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested.png?glove); }  /*! data-uri */
.node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started.png?glove); }  /*! data-uri */

.nodeLabelFiltered .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-faded.png?glove); }   /*! data-uri */
.nodeLabelFiltered .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-faded.png?glove); }     /*! data-uri */
.nodeLabelFiltered .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-faded.png?glove); }   /*! data-uri */
.nodeLabelFiltered .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-faded.png?glove); }  /*! data-uri */

.zoom10 .map-marker {
    margin-left: -40px;
    margin-top: -40px;
}
    .zoom10 .map-marker .node-icon {
        width: 80px;
        height: 80px;
    }

.zoom6 .map-marker,
.zoom7 .map-marker.topic,
.zoom9 .map-marker {
    margin-left: -40px;
    margin-top: -20px;
}
.zoom7 .map-marker.exercise {
    cursor: inherit;
    margin-left: -5px;
    margin-top: -5px;
}

.zoom6 .map-marker .node-icon,
.zoom7 .map-marker.topic .node-icon,
.zoom9 .map-marker .node-icon {
    width: 40px;
    height: 40px;
}

.zoom9 .map-marker.exercise .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-40.png?glove); }
.zoom9 .map-marker.exercise .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-40.png?glove); }
.zoom9 .map-marker.exercise .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-40.png?glove); }
.zoom9 .map-marker.exercise .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-40.png?glove); }

.zoom9 .nodeLabelFiltered.exercise .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-40-faded.png?glove); }
.zoom9 .nodeLabelFiltered.exercise .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-40-faded.png?glove); }
.zoom9 .nodeLabelFiltered.exercise .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-40-faded.png?glove); }
.zoom9 .nodeLabelFiltered.exercise .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-40-faded.png?glove); }

.zoom7 .map-marker.exercise .node-icon {
    width: 10px;
    height: 10px
}
.zoom7 .map-marker.exercise .node-text {
    display: none;
}

.zoom7 .map-marker.exercise .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-10.png?glove); }
.zoom7 .map-marker.exercise .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-10.png?glove); }
.zoom7 .map-marker.exercise .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-10.png?glove); }
.zoom7 .map-marker.exercise .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-10.png?glove); }

.zoom7 .nodeLabelFiltered.exercise .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-10-faded.png?glove); }
.zoom7 .nodeLabelFiltered.exercise .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-10-faded.png?glove); }
.zoom7 .nodeLabelFiltered.exercise .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-10-faded.png?glove); }
.zoom7 .nodeLabelFiltered.exercise .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-10-faded.png?glove); }

.lte7 .zoom6 .map-marker .node-icon,
.lte7 .zoom7 .map-marker.topic .node-icon,
.lte7 .zoom9 .map-marker .node-icon {
    margin-left: 20px;
}
.lte7 .zoom7 .map-marker.exercise .node-icon {
    margin-left: 5px;
}

.zoom8 .map-marker {
    margin-left: -30px;
    margin-top: -13px;
}
.zoom8 .map-marker .node-text {
    font-size: 9px;
    width: 60px;
}
.zoom8 .map-marker .node-icon {
    width: 26px;
    height: 26px;
}
.lte7 .zoom8 .map-marker .node-icon {
    margin-left: 18px;
}

.zoom8 .map-marker.exercise .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-26.png?glove); }
.zoom8 .map-marker.exercise .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-26.png?glove); }
.zoom8 .map-marker.exercise .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-26.png?glove); }
.zoom8 .map-marker.exercise .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-26.png?glove); }

.zoom8 .nodeLabelFiltered.exercise .node-icon.node-complete    { background: url(http://www.khanacademy.org/images/node-complete-26-faded.png?glove); }
.zoom8 .nodeLabelFiltered.exercise .node-icon.node-review      { background: url(http://www.khanacademy.org/images/node-review-26-faded.png?glove); }
.zoom8 .nodeLabelFiltered.exercise .node-icon.node-suggested   { background: url(http://www.khanacademy.org/images/node-suggested-26-faded.png?glove); }
.zoom8 .nodeLabelFiltered.exercise .node-icon.node-not-started { background: url(http://www.khanacademy.org/images/node-not-started-26-faded.png?glove); }

.zoom6 .map-marker.exercise {
    display: none;
}

.zoom8 .map-marker.topic,
.zoom9 .map-marker.topic,
.zoom10 .map-marker.topic {
    display: none;
}

.nodeLabelHighlight .node-text {
    background-color: black;
}

.creditLabel {
    color: white;
    font-size: 10px;
    margin: 0 2px 2px 0;
    white-space: nowrap;
    opacity: 0.5;
}
/* End Knowledge Map CSS */

#topic-jump > span {
    float: left;
    font-size: 15px;
    color: #555;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
    font-weight: bold;
}
#topic-jump nav ul {
    margin: 0;
    padding: 0;
}
#topic-jump nav > ul > li {
    font-size: 15px;
    color: #333;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
}
#topic-jump nav > ul > li.solo > a:visited {
    color: #333;
}
#topic-jump nav > ul > li.solo > a:hover {
    color: #00659E;
}
#topic-jump nav > ul > li:hover {
    color: #00659E;
    text-shadow: 0 0 5px #fff;
}
#topic-jump nav > ul > li > ul > li.sub {
    background: transparent;
    color: #aaa;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
    font-style: italic;
    padding-left: 2px;
}
#topic-jump nav > ul > li > ul > li.sub li {
    font-style: normal;
}
#topic-jump nav > ul > li ul {
    font-size: 12px;
}
/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}
/* End Clearfix */

.tiny { font-size: 10px; }
.large-font {
    font-size: 16px;
}

.large-font input,
.large-font p,
.large-font button {
    font-size: inherit;
}

.right { text-align: right; }
.left { text-align: left; }
.center { text-align: center; }
.justify { text-align: justify; }

.ampersand {
    font-family: Tahoma, sans-serif;
}
    h2 .ampersand {
        font-size: 19px;
    }

/*  ellipses:
    You *must* set a width and display: (inline-)block
    otherwise.... this will 100% not work.
*/
.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

/* End of basic typography */

img {
    -ms-interpolation-mode: bicubic;
    /* Fix IE image scaling so that it isn't crappy */
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.mobile-only { display: none; }

/* Shared by both versions of the homepage
 * #social-actions, #rss-feed */

#social-actions {
    margin-top: 25px;
}
#social-actions > table {
    min-width: 362px;
}
#social-actions #fb-like-badge {
    display: inline-block;
    width: 165px;
    height: 20px;
    vertical-align: top;
}

/* Used on about pages and blog
 * .rounded-background */

img.rounded-background {
    display: block;
    padding: 10px;
    background: #f7f7f7;
    border: 1px solid #ccc;
    border-bottom: 1px solid #aaa;
    margin: 0 auto;
    max-width: 90%;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    -moz-box-shadow: 0 1px 3px #ccc;
    -webkit-box-shadow: 0 1px 3px #ccc;
    box-shadow: 0 1px 3px #ccc;
}

img.icon {
    vertical-align: -3px;
    width: 16px;
    height: 16px;
    padding-right: 2px;
    background: transparent;
}

nav {
    display: block;
    clear: both;
    width: 100%;
    margin: 0;
}

article, section {
    display: block;
}

div.video {
    margin-left: auto;
    margin-right: auto;
    min-width: 700px;
}

div.video #keywords {
    clear: both;
}

/* YouTube jump links found in video discussion and on /about */
span.youTube, .youTubeJump {
    padding-left: 18px;
    background: url(http://www.khanacademy.org/'/images/play.png') no-repeat left top;
    color: #005987;
    cursor: pointer;
}
span.youTube:hover, .youTubeJump:hover {
    border-bottom: solid 1px #005987;
}


/***************For All-videos page******************/


/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 1px;
    height: 1px;
}

/**************end of elements for all-videos page*********************/

.exercise_message {
    padding: 1em;
    border: 1px solid silver;
    border-top: 0;
    background-color: #E5ECF9;
    margin: 0 10px;
}

    .exercise_message.review {
        background-color: #F9ECE5;
    }



#container h3 {
    display: block;
    font-size: 14px;
    color: #333;
    padding-bottom: 5px;
    border-bottom: 1px dotted #bbb;
}
/* End of Exercise Dashboard styles */

/* Exercise related styles */

#container.single-exercise {
    overflow: visible;
    min-width: 950px;
}
#container .dashboard-header.single-exercise {
    border: 1px solid #ccc;
    border-top: none;
}


#description .related-content {
    margin-top: -22px;
    line-height: 13px;
}

#description .related-content ul.related-exercise-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline;
}
    #description .related-content ul.related-exercise-list li {
        display: inline;
    }
    #description .related-content ul.related-exercise-list li span.separator {
        padding-right: 5px;
    }

#description .practice.simple-button {
    float: right;
    font-size: 110%;
}

#extras.single-exercise {
    margin: 6px 0 10px;
    padding-right: 10px;
}
#answer_area_wrap {
    float: right;
    width: 27%;
    margin-right: 10px;
}

/* End of exercise related styles */

/* Used in exercise_message_proficient_withgraph.html
 * TODO(jasonrr) determine if that file is still in use */
#you-are-here{
  position:relative;
  left:10px;
  top:-10px;
}

/* Two column structure for content pages */
.col1, .col2 {
    min-width: 48%;
    max-width: 48%;
    float: left;
}
.col1 {
    margin-right: 4%;
}

.col1.sixty-forty {
    min-width: 63%;
    max-width: 63%;
}
.col2.sixty-forty {
    min-width: 33%;
    max-width: 33%;
}

.col1.forty-sixty {
    min-width: 33%;
    max-width: 33%;
}
.col2.forty-sixty {
    min-width: 63%;
    max-width: 63%;
}

.col1.fifty-fifty {
    min-width: 48%;
    max-width: 48%;
}

.col2.fifty-fifty {
    min-width: 48%;
    max-width: 48%;
}

.spinealign .col1 { text-align:right; }
.spinealign .col2 { text-align:left; }


/* End One-off page styles */

#back-to-top {
    position: fixed;
    bottom: 32px;
    right: 40px;
    text-align: center;
    cursor: pointer;

    opacity: 0.5;
    filter:alpha(opacity=50);

    display: none;
    z-index: 100;
}

#back-to-top a.text {
    display: block;
    background: transparent;
    visibility: hidden;
    position: relative;
    top: 10px;
}

#back-to-top a {
    text-decoration: none;
    border: 0;
    outline: none;
}

#back-to-top .arrow {
    padding: 5px 10px;

    font-size: 36px;
    color: #333;
    background: #eee;
    border: 1px solid #ccc;
    border-bottom: 1px solid #aaa;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#back-to-top:hover {
    opacity: 1.0;
    filter:alpha(opacity=100);
}

#back-to-top:hover a.text {
    visibility: visible;
}

/* About the site styles */

#screenshot-tour img.rounded-background {
    background: white;
}

.lte8 #about-us {
    position: static;
}

/* End about the site */

/* Report a problem styles */
#report-problem ol {
    list-style: decimal outside;
    margin: 18px 27px;
    font-size: 15px;
}
/* End Report a problem styles */

img.throbber { position: absolute; }

a.control, a.control:visited, a.control:focus, a.control:link { color: #0075b1; }
a.control:hover { color: #DD6900; }

.clearFloat { overflow:hidden; height:1px; clear:both; }

.exercise-edit {
    background: #f3f3f3;
    padding-top:3px;
    padding-left:5px;
    margin-left: 1px;
    position: relative;
    width: 320px;
    height: 23px;
    cursor: pointer;
    border: 1px solid #ddd;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
    .drawer-hoverable .exercise-edit:hover {
        background: #FCF9CF;
        -webkit-box-shadow: 0 0 3px #666;
        -moz-box-shadow: 0 0 3px #666;
        box-shadow: 0 0 3px #666;
        border: 1px solid #aaa;
    }

.vid-progress {
  background-repeat: no-repeat;
  background-position: 0 50%;
}

/* There are 5 places where video completion icons are shown:
 * 1. Homepage
 * 2. Previous and next videos on video page
 * 3. Topic dropdown on video page
 * 4. Related videos in top left of exercises page
 * 5. Related videos in sidebar of exercises page
 *
 * All of these are layed out vertically except for #2 and #4. For the ones
 * layed out vertically we always want 14px left padding so the text will
 * always line up. For #2 and #4 we don't want left padding unless there is an
 * icon, to avoid an awkard space. Thus we add 14px of padding to #1, #3, and
 * #5 here and in /user_video_css we add 14px of left padding to any video with
 * an icon.
 */
#library .vl > .vid-progress,
#related-video-list > .related-video-list > li > a > .vid-progress,
#video_menu > .ui-menu .vid-progress {
  padding-left: 14px;
}

/* TODO(benkomalo): move this out of default.css */
#modpanel {
   margin: 9px auto;
   width:1000px;
}

.share-links {
    float: right;
}

.share-links a {
    border-width: 0;
    color: #aaa;
    display: inline-block;
    line-height: 18px;
    margin: 0 0 0 6px;
    padding: 2px;
    text-align: left;
    text-decoration: none;
}
.share-links a:hover {
    color: #666;
    text-decoration: none;
}

.simple-button.qtip-button {
    line-height: 8px;
    padding: 2px 5px;
    margin: 2px;
    font-size: 12px;
}

.qtip {
    font-size: 100%;
    line-height: 1.3;
}

@media screen and (max-width:1075px) {
    .small-social-links {
        display: none;
    }
}

/* For shared navigation elements */

/* Filtering controls for profile page and moderation queue */
.tabrow-container {
    margin: 22px 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #ccc;
    position: relative;
    font-size: 13px;
}

.tabrow {
    text-align: center;
    list-style: none;
    padding: 0;
    line-height: 24px;
    height: 26px;
    float: right;
}

.tabrow li {
    display: inline-block;
    position: relative;
    z-index: 0;
    padding: 0 10px;
}

.tabrow li.hidden {
    display: none;
}

.tabrow li.selected {
    background: #FFF;
    color: #333;
    z-index: 2;
    border-bottom-color: #FFF;
    position: relative;
}

.tabrow li.selected:after {
    content: " ";
    position: absolute;
    z-index: 3;
    width: 0;
    height: 15px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #CCC;
    left: 50%;
    margin-left: -7px;
    bottom: -3px;
    display: block;
}

@-moz-document url-prefix() {
    .tabrow li.selected:after {
        // workaround for positioning bug with absolute :after pseudos in FF
        bottom: -2px !important;
    }
}

 /*==============================================================================

   Based on: http://www.grc.com/mainmenu.css
   Discussed at: http://www.grc.com/menu2/invitro.htm

   GRC multi-level script-free pure-CSS menuing system stylesheet.
   This code is hereby placed into the public domain by its author
   Steve Gibson. It may be freely used for any purpose whatsoever.

    Computed Geometries:    with a default 12px font, 1.0em == 12px and
    1px == 0.08333em.
    Thus, our 98px wide Freeware & Research buttons are 8.166666em wide.

                      PUBLIC DOMAIN CONTRIBUTION NOTICE
   This work has been explicitly placed into the Public Domain for the
    benefit of anyone who may find it useful for any purpose whatsoever.

   Modified by Dean Brettle (dean@brettle.com) for the Khan Academy.
==============================================================================*/

/*========================= TOP OF THE MENU CASCADE =========================*/

.css-menu {
    position:relative;        /* establish a menu-relative positioning context */
    float:left;                                     /* play nicely with others */
    margin:0;
    padding:0;
    border:0;
    width: auto;
    z-index: 100;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.css-menu a {
    text-decoration: none !important;
}

.css-menu img {
    vertical-align: top;      /* prevent images from being pushed down by text */
}

.css-menu > ul, .css-menu > ul > li ul {
    margin:0;
    list-style-type:none;          /* we don't want to view the list as a list */
    line-height:3ex;            /* globally set the menu's item spacing */
}

.css-menu > ul > li, .css-menu > ul > li > ul > li {
    float:left;    /* this creates the side-by-side array of top-level buttons */
    position:relative;    /* create local positioning contexts for each button */
    margin: 0;
    white-space: nowrap;
}

/*======================== TOP LEVEL MENU DEFINITIONS ========================*/

.css-menu > ul > li, .css-menu > ul > li > ul {
    padding-left: 1ex;
    padding-right: 1ex;
}

.css-menu > ul > li {
    border-width: 1px 1px 0 1px;
    border-style: solid;
    border-color: transparent;
    color: white;
    margin-left: 0ex;
    margin-right: 0ex;
    padding-top: .25ex;
    padding-bottom: .25ex;
    font-weight: bold;
    z-index: 1;
    cursor: pointer;

    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.css-menu > ul > li:after {
    content: "";
    width: 13px;
    height: 12px;
    background-image: url(http://www.khanacademy.org/images/non-repeating-sprites.4.png);
    background-position: -72px -67px;
    display: inline-block;
    position: relative;
    top: 1px;
}
.css-menu > ul > li.solo:after {
    background: none;
}

.css-menu > ul > li:hover,
.css-menu > ul > li > a:hover {
    color: black;
    cursor: pointer;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}

.css-menu.noscript > ul > li:hover,
.css-menu.noscript > ul > li > a:hover,
.css-menu > ul > li.css-menu-js-hover
 {
    z-index: 5;
    background-color: #f7f7f7;
    color: black;
    outline: none;
    border-color: #ddd;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}

.css-menu.noscript > ul > li.solo:hover,
.css-menu.noscript > ul > li.solo > a:hover,
.css-menu > ul > li.solo.css-menu-js-hover
 {
    z-index: 5;
    background-color: transparent;
    color: black;
    outline: none;
    border-color: transparent;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}


.css-menu > ul > li > ul {
    clear:left;
    position:absolute;
    left: -999em;                  /* initially hide the entire list hierarchy */
    padding:0;                               /* this is our box border width */
    z-index: 3;
    background-color: #f7f7f7;
    color: black;
}

.css-menu > ul > li > a,
.css-menu > ul > li > a:visited {                    /* unselected top-level menu items */
    display:block;
    float:left;
    text-decoration:none;
}

/*======================== 2ND LEVEL MENU DEFINITIONS ========================*/

.css-menu.noscript > ul > li:hover > ul,
.css-menu.noscript > ul > li > a:hover > ul,
.css-menu > ul > li.css-menu-js-hover > ul
{                           /* 2nd level drop-down box */
    border-top: 1px solid transparent;
    display:block;
    margin:0;
    left: -1px;       /* left-align our drop-down to the previous button border */
    height:auto;      /* the drop-down height will be determiend by line count */
    width:auto;
    min-width: 150px;
    z-index: 4;
}
.lte7 .css-menu.noscript > ul > li:hover > ul,
.lte7 .css-menu.noscript > ul > li > a:hover > ul,
.lte7 .css-menu > ul > li.css-menu-js-hover > ul {
    top: 3.5ex;  /* For IE7: line-height + padding-top + padding-bottom */
    width: 30ex; /* For IE7: approx maximum chars in a menu item */
}
.css-menu > ul > li > ul {
    overflow: hidden;
    border: solid 1px #ddd;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0, .5);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0, .5);

    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-topright: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}

.css-menu > ul > li > ul li,
.css-menu > ul > li > ul li > a {
    width: 100%;
}

.css-menu > ul > li > ul li > p,
.css-menu > ul > li > ul li > a {
    display: block;
    padding-left: 1ex;
    padding-right: 1ex;
    font-weight: normal;
    background-color: #f7f7f7; /* IE7 needs this to workaround http://haslayout.net/css/Hover-White-Background-Ignore-Bug */
    margin: 0;
    height:auto;
    color: black;               /* this sets the unselected drop-down text color */
}

.css-menu > ul > li > ul > li > ul > li > a {
    padding-left: 2ex !important;
}

.css-menu > ul > li > ul > li > ul {
    border-bottom: none;
}

.css-menu > ul > li > ul > li:last-child > ul {
    border-bottom: none 0px;
}

.css-menu > ul > li > ul li > p {
    text-decoration: none;
    font-weight: bold;
}

.css-menu > ul > li > ul li:hover > a,
.css-menu > ul > li > ul li > a:hover,
.css-menu > ul > li > ul li:focus > a,
.css-menu > ul > li > ul li > a:focus,
.css-menu > ul > li > ul li > a.css-menu-js-hover {                /* 2nd level selected item */
    color: #e45c02;
    background-color: white;
}

.css-menu > ul > li > ul > li  {
    display: block;
    clear: left;
    padding: 0;
    height:auto;      /* the drop-down height will be determiend by line count */
    width: 100%;
}
.lte7 .css-menu > ul > li > ul > li  {
    width: 30ex; /* For IE7: ~ maximum chars in a menu item */
}

.css-menu > ul > li > ul > li > ul {
    padding: 0;
}


@font-face {
    font-family: 'Proxima Nova';
    src: url('/fonts/ProximaNova-Reg-webfont.eot');
    src: url('/fonts/ProximaNova-Reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/ProximaNova-Reg-webfont.woff') format('woff'),
         url('/fonts/ProximaNova-Reg-webfont.ttf') format('truetype'),
         url('/fonts/ProximaNova-Reg-webfont.svg#proxima_nova_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('/fonts/ProximaNova-Bold-webfont.eot');
    src: url('/fonts/ProximaNova-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/ProximaNova-Bold-webfont.woff') format('woff'),
         url('/fonts/ProximaNova-Bold-webfont.ttf') format('truetype'),
         url('/fonts/ProximaNova-Bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Proxima Nova Bold';
    src: url('/fonts/ProximaNova-Bold-webfont.eot');
    src: url('/fonts/ProximaNova-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/ProximaNova-Bold-webfont.woff') format('woff'),
         url('/fonts/ProximaNova-Bold-webfont.ttf') format('truetype'),
         url('/fonts/ProximaNova-Bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Fall back colors? Eg coach-res, talks & interviews */
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.input-block-level {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#khanType .thinHeader {
  color: #2c3747;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 24px;
  font-weight: normal;
}
#khanType .smallThinHeader {
  color: #555;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 22px;
}
#khanType .headerDescription {
  color: #898989;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 20px;
  margin-top: 2px;
}
#khanType .domainHeader {
  font-family: 'Proxima Nova Bold', sans-serif;
  font-size: 11px;
  font-weight: normal;
  line-height: 18px;
  text-transform: uppercase;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
#khanType .subjectHeader {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 52px;
  font-weight: normal;
  line-height: 58px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
#khanType .subjectDescription {
  font-family: 'Proxima Nova Bold', sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 22px;
  -webkit-font-smoothing: antialiased;
}
#khanType .topicHeader {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 28.8px;
  margin-bottom: 6px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
#khanType .topicTitle {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 30px;
  font-weight: normal;
  line-height: 48px;
}
#khanType .topicDescription,
#khanType .tutorialDescription {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 18px;
}
#khanType .tutorialTitle {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 24px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
#khanType .tutorialLink {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 18px;
}
.vertical-shadow {
  border: 1px solid #cccccc;
  border-bottom: 1px solid #aaa;
  -webkit-box-shadow: 0 1px 3px #cccccc;
  -moz-box-shadow: 0 1px 3px #cccccc;
  box-shadow: 0 1px 3px #cccccc;
}
.alert {
  padding: 8px 35px 8px 14px;
  margin-bottom: 20px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background-color: #fcf8e3;
  border: 1px solid #fbeed5;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.alert,
.alert h4 {
  color: #c09853;
}
.alert h4 {
  margin: 0;
}
.alert .close {
  position: relative;
  top: -2px;
  right: -21px;
  line-height: 20px;
}
.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #468847;
}
.alert-success h4 {
  color: #468847;
}
.alert-danger,
.alert-error {
  background-color: #f2dede;
  border-color: #eed3d7;
  color: #b94a48;
}
.alert-danger h4,
.alert-error h4 {
  color: #b94a48;
}
.alert-info {
  background-color: #edf2df;
  border-color: #e4e8c6;
  color: #4a7c17;
}
.alert-info h4 {
  color: #4a7c17;
}
.alert-block {
  padding-top: 14px;
  padding-bottom: 14px;
}
.alert-block > p,
.alert-block > ul {
  margin-bottom: 0;
}
.alert-block p + p {
  margin-top: 5px;
}
.close {
  float: right;
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  color: #000000;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.close:hover,
.close:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
  filter: alpha(opacity=40);
}
button.close {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
}
.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -moz-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}
.fade.in {
  opacity: 1;
}
.collapse {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition: height 0.35s ease;
  -moz-transition: height 0.35s ease;
  -o-transition: height 0.35s ease;
  transition: height 0.35s ease;
}
.collapse.in {
  height: auto;
}
.row {
  margin-left: -20px;
  *zoom: 1;
}
.row:before,
.row:after {
  display: table;
  content: "";
  line-height: 0;
}
.row:after {
  clear: both;
}
[class*="span"] {
  float: left;
  min-height: 1px;
  margin-left: 20px;
}
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
  width: 940px;
}
.span12 {
  width: 940px;
}
.span11 {
  width: 860px;
}
.span10 {
  width: 780px;
}
.span9 {
  width: 700px;
}
.span8 {
  width: 620px;
}
.span7 {
  width: 540px;
}
.span6 {
  width: 460px;
}
.span5 {
  width: 380px;
}
.span4 {
  width: 300px;
}
.span3 {
  width: 220px;
}
.span2 {
  width: 140px;
}
.span1 {
  width: 60px;
}
.offset12 {
  margin-left: 980px;
}
.offset11 {
  margin-left: 900px;
}
.offset10 {
  margin-left: 820px;
}
.offset9 {
  margin-left: 740px;
}
.offset8 {
  margin-left: 660px;
}
.offset7 {
  margin-left: 580px;
}
.offset6 {
  margin-left: 500px;
}
.offset5 {
  margin-left: 420px;
}
.offset4 {
  margin-left: 340px;
}
.offset3 {
  margin-left: 260px;
}
.offset2 {
  margin-left: 180px;
}
.offset1 {
  margin-left: 100px;
}
.row-fluid {
  width: 100%;
  *zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
  display: table;
  content: "";
  line-height: 0;
}
.row-fluid:after {
  clear: both;
}
.row-fluid [class*="span"] {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  margin-left: 2.127659574468085%;
  *margin-left: 2.074468085106383%;
}
.row-fluid [class*="span"]:first-child {
  margin-left: 0;
}
.row-fluid .controls-row [class*="span"] + [class*="span"] {
  margin-left: 2.127659574468085%;
}
.row-fluid .span12 {
  width: 100%;
  *width: 99.94680851063829%;
}
.row-fluid .span11 {
  width: 91.48936170212765%;
  *width: 91.43617021276594%;
}
.row-fluid .span10 {
  width: 82.97872340425532%;
  *width: 82.92553191489361%;
}
.row-fluid .span9 {
  width: 74.46808510638297%;
  *width: 74.41489361702126%;
}
.row-fluid .span8 {
  width: 65.95744680851064%;
  *width: 65.90425531914893%;
}
.row-fluid .span7 {
  width: 57.44680851063829%;
  *width: 57.39361702127659%;
}
.row-fluid .span6 {
  width: 48.93617021276595%;
  *width: 48.88297872340425%;
}
.row-fluid .span5 {
  width: 40.42553191489362%;
  *width: 40.37234042553192%;
}
.row-fluid .span4 {
  width: 31.914893617021278%;
  *width: 31.861702127659576%;
}
.row-fluid .span3 {
  width: 23.404255319148934%;
  *width: 23.351063829787233%;
}
.row-fluid .span2 {
  width: 14.893617021276595%;
  *width: 14.840425531914894%;
}
.row-fluid .span1 {
  width: 6.382978723404255%;
  *width: 6.329787234042553%;
}
.row-fluid .offset12 {
  margin-left: 104.25531914893617%;
  *margin-left: 104.14893617021275%;
}
.row-fluid .offset12:first-child {
  margin-left: 102.12765957446808%;
  *margin-left: 102.02127659574467%;
}
.row-fluid .offset11 {
  margin-left: 95.74468085106382%;
  *margin-left: 95.6382978723404%;
}
.row-fluid .offset11:first-child {
  margin-left: 93.61702127659574%;
  *margin-left: 93.51063829787232%;
}
.row-fluid .offset10 {
  margin-left: 87.23404255319149%;
  *margin-left: 87.12765957446807%;
}
.row-fluid .offset10:first-child {
  margin-left: 85.1063829787234%;
  *margin-left: 84.99999999999999%;
}
.row-fluid .offset9 {
  margin-left: 78.72340425531914%;
  *margin-left: 78.61702127659572%;
}
.row-fluid .offset9:first-child {
  margin-left: 76.59574468085106%;
  *margin-left: 76.48936170212764%;
}
.row-fluid .offset8 {
  margin-left: 70.2127659574468%;
  *margin-left: 70.10638297872339%;
}
.row-fluid .offset8:first-child {
  margin-left: 68.08510638297872%;
  *margin-left: 67.9787234042553%;
}
.row-fluid .offset7 {
  margin-left: 61.70212765957446%;
  *margin-left: 61.59574468085106%;
}
.row-fluid .offset7:first-child {
  margin-left: 59.574468085106375%;
  *margin-left: 59.46808510638297%;
}
.row-fluid .offset6 {
  margin-left: 53.191489361702125%;
  *margin-left: 53.085106382978715%;
}
.row-fluid .offset6:first-child {
  margin-left: 51.063829787234035%;
  *margin-left: 50.95744680851063%;
}
.row-fluid .offset5 {
  margin-left: 44.68085106382979%;
  *margin-left: 44.57446808510638%;
}
.row-fluid .offset5:first-child {
  margin-left: 42.5531914893617%;
  *margin-left: 42.4468085106383%;
}
.row-fluid .offset4 {
  margin-left: 36.170212765957444%;
  *margin-left: 36.06382978723405%;
}
.row-fluid .offset4:first-child {
  margin-left: 34.04255319148936%;
  *margin-left: 33.93617021276596%;
}
.row-fluid .offset3 {
  margin-left: 27.659574468085104%;
  *margin-left: 27.5531914893617%;
}
.row-fluid .offset3:first-child {
  margin-left: 25.53191489361702%;
  *margin-left: 25.425531914893618%;
}
.row-fluid .offset2 {
  margin-left: 19.148936170212764%;
  *margin-left: 19.04255319148936%;
}
.row-fluid .offset2:first-child {
  margin-left: 17.02127659574468%;
  *margin-left: 16.914893617021278%;
}
.row-fluid .offset1 {
  margin-left: 10.638297872340425%;
  *margin-left: 10.53191489361702%;
}
.row-fluid .offset1:first-child {
  margin-left: 8.51063829787234%;
  *margin-left: 8.404255319148938%;
}
[class*="span"].hide,
.row-fluid [class*="span"].hide {
  display: none;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
  float: right;
}
html,
body {
  height: 100%;
  background-color: #fdfdfd;
}
body {
  overflow-y: scroll;
}
body {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  margin: 0;
  color: #444;
  line-height: 22px;
  /* extend background to cover #page-container on horizontal scroll */
  min-width: 1000px;
}
#outer-wrapper {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 0 -77px;
}
#page-container {
  min-width: 1000px;
  max-width: 1200px;
  position: relative;
  margin: 0 auto;
}
#page-container-inner article {
  /* TODO(benkomalo): determine if this is correct. On the homepage we
     * definitely don't want the border (as it was for the old design).
     * Does it apply everywhere */
  border-top: none;
}
#end-of-page-spacer {
  clear: both;
}
.external-styles-missing {
  display: none;
}
article {
  padding: 0 20px;
  position: relative;
  border-top: 1px solid #C6D1AD;
}
/* Basic typography for the entire site */
h1,
h2,
h3,
h4,
h5 {
  color: #111;
  font-family: 'Proxima Nova Bold', sans-serif;
}
h1 {
  font-size: 25px;
  margin-bottom: 22px;
}
.main-headline,
.section-headline {
  padding-top: 22px;
}
.main-headline a,
.section-headline a {
  text-decoration: none;
}
.main-headline a:hover,
.section-headline a:hover {
  text-decoration: underline;
}
.main-headline a:visited,
.section-headline a:visited {
  color: #7EA800;
}
h1.main-headline {
  font-size: 32px;
  position: relative;
  line-height: 37px;
  z-index: 10;
}
h2 {
  font-size: 20px;
  margin-bottom: 22px;
}
h3 {
  font-size: 18px;
  margin-bottom: 22px;
}
h4 {
  font-size: 15px;
  margin-bottom: 22px;
}
h5 {
  font-size: 15px;
  margin-bottom: -22px;
}
p {
  font-size: 14px;
  margin: 22px 0;
}
.pulls {
  margin-bottom: 9px;
}
/* "Pulls" the next block element up by halving the margin. */
.pulled {
  margin-top: 11px;
  margin-bottom: 22px;
}
/* Preserves vertical rhythm. Not always necessary */
b,
strong {
  font-weight: bold;
}
em,
cite {
  font-style: italic;
}
hr {
  background: #CCC;
  border: none;
  -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.075);
  -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.075);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.075);
  clear: both;
  color: #CCC;
  display: block;
  height: 1px;
  margin: 18px 0 36px 0;
  padding: 0;
  width: 100%;
}
hr.thin {
  margin-bottom: 18px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.40;
  filter: alpha(opacity=40);
  width: 50%;
}
/* Links in the header and footer don't change color when visited. */
a:link,
a:visited,
header a:visited,
footer a:visited,
.visited-no-recolor a:visited,
a.visited-no-recolor:visited {
  color: #005987;
}
a:link.no-underline,
a:visited.no-underline,
header a:visited.no-underline,
footer a:visited.no-underline,
.visited-no-recolor a:visited.no-underline,
a.visited-no-recolor:visited.no-underline {
  text-decoration: none;
}
a:visited {
  color: #7D00AD;
}
a:link:hover,
a:link:focus,
a:visited:hover,
a:visited:focus {
  color: #707070;
}
a:link:hover.no-underline,
a:link:focus.no-underline,
a:visited:hover.no-underline,
a:visited:focus.no-underline {
  text-decoration: none;
}
form {
  display: inline;
}
.superscript {
  /* http://stackoverflow.com/questions/501671/superscript-in-css-only */
  font-size: .83em;
  line-height: 0.5em;
  vertical-align: baseline;
  position: relative;
  top: -0.4em;
}
ul.styled-list,
ol.styled-list {
  margin-left: 16px;
}
ul.styled-list {
  list-style: disc;
}
ol.styled-list {
  list-style: decimal;
}
.float-left {
  float: left;
}
.float-right {
  float: right;
}
.new-header .domain-color {
  background: #96ab4f !important;
}
.new-header .subject-color {
  background: #a8bb6a !important;
}
.new-header .topic-color {
  background: #b7cf6c !important;
}
.new-header .tutorial-color {
  background: #ffffff !important;
}
.new-header .math {
  color: #ffffff;
}
.new-header .math.domain-color,
.new-header .math .domain-color {
  background: #3b8fa3 !important;
}
.new-header .math.subject-color,
.new-header .math .subject-color {
  background: #46a8bf !important;
}
.new-header .math.topic-color,
.new-header .math .topic-color {
  background: #4fbad4 !important;
}
.new-header .math.tutorial-color,
.new-header .math .tutorial-color {
  background: #ffffff;
}
.new-header .math.accent-button,
.new-header .math .accent-button {
  border: 1px solid #378598;
  color: #ffffff;
  text-shadow: none;
  background-color: #378699;
  background-image: -moz-linear-gradient(top, #3b8fa3, #327889);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3b8fa3), to(#327889));
  background-image: -webkit-linear-gradient(top, #3b8fa3, #327889);
  background-image: -o-linear-gradient(top, #3b8fa3, #327889);
  background-image: linear-gradient(to bottom, #3b8fa3, #327889);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3b8fa3', endColorstr='#ff327889', GradientType=0);
  border-color: #327889 #327889 #1d4751;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #327889;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .math.accent-button:hover,
.new-header .math .accent-button:hover,
.new-header .math.accent-button:focus,
.new-header .math .accent-button:focus,
.new-header .math.accent-button:active,
.new-header .math .accent-button:active,
.new-header .math.accent-button.active,
.new-header .math .accent-button.active,
.new-header .math.accent-button.disabled,
.new-header .math .accent-button.disabled,
.new-header .math.accent-button[disabled],
.new-header .math .accent-button[disabled] {
  color: #ffffff;
  background-color: #327889;
  *background-color: #2b6876;
}
.new-header .math.accent-button:active,
.new-header .math .accent-button:active,
.new-header .math.accent-button.active,
.new-header .math .accent-button.active {
  background-color: #245763 \9;
}
.new-header .math.accent-button:focus,
.new-header .math .accent-button:focus,
.new-header .math.accent-button:hover,
.new-header .math .accent-button:hover {
  border-bottom-color: #275e6b;
}
.new-header .science {
  color: #ffffff;
}
.new-header .science.domain-color,
.new-header .science .domain-color {
  background: #793541 !important;
}
.new-header .science.subject-color,
.new-header .science .subject-color {
  background: #994858 !important;
}
.new-header .science.topic-color,
.new-header .science .topic-color {
  background: #c55f73 !important;
}
.new-header .science.tutorial-color,
.new-header .science .tutorial-color {
  background: #c55f73;
}
.new-header .science.accent-button,
.new-header .science .accent-button {
  border: 1px solid #6e303b;
  color: #ffffff;
  text-shadow: none;
  background-color: #6f313c;
  background-image: -moz-linear-gradient(top, #793541, #602a34);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#793541), to(#602a34));
  background-image: -webkit-linear-gradient(top, #793541, #602a34);
  background-image: -o-linear-gradient(top, #793541, #602a34);
  background-image: linear-gradient(to bottom, #793541, #602a34);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff793541', endColorstr='#ff602a34', GradientType=0);
  border-color: #602a34 #602a34 #2b1317;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #602a34;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .science.accent-button:hover,
.new-header .science .accent-button:hover,
.new-header .science.accent-button:focus,
.new-header .science .accent-button:focus,
.new-header .science.accent-button:active,
.new-header .science .accent-button:active,
.new-header .science.accent-button.active,
.new-header .science .accent-button.active,
.new-header .science.accent-button.disabled,
.new-header .science .accent-button.disabled,
.new-header .science.accent-button[disabled],
.new-header .science .accent-button[disabled] {
  color: #ffffff;
  background-color: #602a34;
  *background-color: #4e222a;
}
.new-header .science.accent-button:active,
.new-header .science .accent-button:active,
.new-header .science.accent-button.active,
.new-header .science .accent-button.active {
  background-color: #3d1b21 \9;
}
.new-header .science.accent-button:focus,
.new-header .science .accent-button:focus,
.new-header .science.accent-button:hover,
.new-header .science .accent-button:hover {
  border-bottom-color: #441e24;
}
.new-header .cs {
  color: #ffffff;
}
.new-header .cs.domain-color,
.new-header .cs .domain-color {
  background: #5b9032 !important;
}
.new-header .cs.subject-color,
.new-header .cs .subject-color {
  background: #6baa4f !important;
}
.new-header .cs.topic-color,
.new-header .cs .topic-color {
  background: #71b64f !important;
}
.new-header .cs.tutorial-color,
.new-header .cs .tutorial-color {
  background: #ffffff;
}
.new-header .cs.accent-button,
.new-header .cs .accent-button {
  border: 1px solid #54852e;
  color: #ffffff;
  text-shadow: none;
  background-color: #54852e;
  background-image: -moz-linear-gradient(top, #5b9032, #4a7629);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5b9032), to(#4a7629));
  background-image: -webkit-linear-gradient(top, #5b9032, #4a7629);
  background-image: -o-linear-gradient(top, #5b9032, #4a7629);
  background-image: linear-gradient(to bottom, #5b9032, #4a7629);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5b9032', endColorstr='#ff4a7629', GradientType=0);
  border-color: #4a7629 #4a7629 #263d15;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #4a7629;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .cs.accent-button:hover,
.new-header .cs .accent-button:hover,
.new-header .cs.accent-button:focus,
.new-header .cs .accent-button:focus,
.new-header .cs.accent-button:active,
.new-header .cs .accent-button:active,
.new-header .cs.accent-button.active,
.new-header .cs .accent-button.active,
.new-header .cs.accent-button.disabled,
.new-header .cs .accent-button.disabled,
.new-header .cs.accent-button[disabled],
.new-header .cs .accent-button[disabled] {
  color: #ffffff;
  background-color: #4a7629;
  *background-color: #3e6322;
}
.new-header .cs.accent-button:active,
.new-header .cs .accent-button:active,
.new-header .cs.accent-button.active,
.new-header .cs .accent-button.active {
  background-color: #32501c \9;
}
.new-header .cs.accent-button:focus,
.new-header .cs .accent-button:focus,
.new-header .cs.accent-button:hover,
.new-header .cs .accent-button:hover {
  border-bottom-color: #37571e;
}
.new-header .hour-of-code {
  color: #ffffff;
}
.new-header .hour-of-code.domain-color,
.new-header .hour-of-code .domain-color {
  background: #5b9032 !important;
}
.new-header .hour-of-code.subject-color,
.new-header .hour-of-code .subject-color {
  background: #6baa4f !important;
}
.new-header .hour-of-code.topic-color,
.new-header .hour-of-code .topic-color {
  background: #71b64f !important;
}
.new-header .hour-of-code.tutorial-color,
.new-header .hour-of-code .tutorial-color {
  background: #ffffff;
}
.new-header .hour-of-code.accent-button,
.new-header .hour-of-code .accent-button {
  border: 1px solid #54852e;
  color: #ffffff;
  text-shadow: none;
  background-color: #54852e;
  background-image: -moz-linear-gradient(top, #5b9032, #4a7629);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5b9032), to(#4a7629));
  background-image: -webkit-linear-gradient(top, #5b9032, #4a7629);
  background-image: -o-linear-gradient(top, #5b9032, #4a7629);
  background-image: linear-gradient(to bottom, #5b9032, #4a7629);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5b9032', endColorstr='#ff4a7629', GradientType=0);
  border-color: #4a7629 #4a7629 #263d15;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #4a7629;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .hour-of-code.accent-button:hover,
.new-header .hour-of-code .accent-button:hover,
.new-header .hour-of-code.accent-button:focus,
.new-header .hour-of-code .accent-button:focus,
.new-header .hour-of-code.accent-button:active,
.new-header .hour-of-code .accent-button:active,
.new-header .hour-of-code.accent-button.active,
.new-header .hour-of-code .accent-button.active,
.new-header .hour-of-code.accent-button.disabled,
.new-header .hour-of-code .accent-button.disabled,
.new-header .hour-of-code.accent-button[disabled],
.new-header .hour-of-code .accent-button[disabled] {
  color: #ffffff;
  background-color: #4a7629;
  *background-color: #3e6322;
}
.new-header .hour-of-code.accent-button:active,
.new-header .hour-of-code .accent-button:active,
.new-header .hour-of-code.accent-button.active,
.new-header .hour-of-code .accent-button.active {
  background-color: #32501c \9;
}
.new-header .hour-of-code.accent-button:focus,
.new-header .hour-of-code .accent-button:focus,
.new-header .hour-of-code.accent-button:hover,
.new-header .hour-of-code .accent-button:hover {
  border-bottom-color: #37571e;
}
.new-header .humanities {
  color: #ffffff;
}
.new-header .humanities.domain-color,
.new-header .humanities .domain-color {
  background: #cf5044 !important;
}
.new-header .humanities.subject-color,
.new-header .humanities .subject-color {
  background: #e65a4c !important;
}
.new-header .humanities.topic-color,
.new-header .humanities .topic-color {
  background: #fc6255 !important;
}
.new-header .humanities.tutorial-color,
.new-header .humanities .tutorial-color {
  background: #fc6255;
}
.new-header .humanities.accent-button,
.new-header .humanities .accent-button {
  border: 1px solid #cc4538;
  color: #ffffff;
  text-shadow: none;
  background-color: #c8483c;
  background-image: -moz-linear-gradient(top, #cf5044, #be3d31);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#cf5044), to(#be3d31));
  background-image: -webkit-linear-gradient(top, #cf5044, #be3d31);
  background-image: -o-linear-gradient(top, #cf5044, #be3d31);
  background-image: linear-gradient(to bottom, #cf5044, #be3d31);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcf5044', endColorstr='#ffbe3d31', GradientType=0);
  border-color: #be3d31 #be3d31 #822a21;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #be3d31;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .humanities.accent-button:hover,
.new-header .humanities .accent-button:hover,
.new-header .humanities.accent-button:focus,
.new-header .humanities .accent-button:focus,
.new-header .humanities.accent-button:active,
.new-header .humanities .accent-button:active,
.new-header .humanities.accent-button.active,
.new-header .humanities .accent-button.active,
.new-header .humanities.accent-button.disabled,
.new-header .humanities .accent-button.disabled,
.new-header .humanities.accent-button[disabled],
.new-header .humanities .accent-button[disabled] {
  color: #ffffff;
  background-color: #be3d31;
  *background-color: #aa372c;
}
.new-header .humanities.accent-button:active,
.new-header .humanities .accent-button:active,
.new-header .humanities.accent-button.active,
.new-header .humanities .accent-button.active {
  background-color: #963026 \9;
}
.new-header .humanities.accent-button:focus,
.new-header .humanities .accent-button:focus,
.new-header .humanities.accent-button:hover,
.new-header .humanities .accent-button:hover {
  border-bottom-color: #9e3329;
}
.new-header .test-prep {
  color: #ffffff;
}
.new-header .test-prep.domain-color,
.new-header .test-prep .domain-color {
  background: #8e4c9b !important;
}
.new-header .test-prep.subject-color,
.new-header .test-prep .subject-color {
  background: #9859a1 !important;
}
.new-header .test-prep.topic-color,
.new-header .test-prep .topic-color {
  background: #a369aa !important;
}
.new-header .test-prep.tutorial-color,
.new-header .test-prep .tutorial-color {
  background: #b187bc;
}
.new-header .test-prep.accent-button,
.new-header .test-prep .accent-button {
  border: 1px solid #854791;
  color: #ffffff;
  text-shadow: none;
  background-color: #854791;
  background-image: -moz-linear-gradient(top, #8e4c9b, #784083);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#8e4c9b), to(#784083));
  background-image: -webkit-linear-gradient(top, #8e4c9b, #784083);
  background-image: -o-linear-gradient(top, #8e4c9b, #784083);
  background-image: linear-gradient(to bottom, #8e4c9b, #784083);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8e4c9b', endColorstr='#ff784083', GradientType=0);
  border-color: #784083 #784083 #492750;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #784083;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .test-prep.accent-button:hover,
.new-header .test-prep .accent-button:hover,
.new-header .test-prep.accent-button:focus,
.new-header .test-prep .accent-button:focus,
.new-header .test-prep.accent-button:active,
.new-header .test-prep .accent-button:active,
.new-header .test-prep.accent-button.active,
.new-header .test-prep .accent-button.active,
.new-header .test-prep.accent-button.disabled,
.new-header .test-prep .accent-button.disabled,
.new-header .test-prep.accent-button[disabled],
.new-header .test-prep .accent-button[disabled] {
  color: #ffffff;
  background-color: #784083;
  *background-color: #683872;
}
.new-header .test-prep.accent-button:active,
.new-header .test-prep .accent-button:active,
.new-header .test-prep.accent-button.active,
.new-header .test-prep .accent-button.active {
  background-color: #592f61 \9;
}
.new-header .test-prep.accent-button:focus,
.new-header .test-prep .accent-button:focus,
.new-header .test-prep.accent-button:hover,
.new-header .test-prep .accent-button:hover {
  border-bottom-color: #5f3368;
}
.new-header .partner-content {
  color: #ffffff;
}
.new-header .partner-content.domain-color,
.new-header .partner-content .domain-color {
  background: #49a88f !important;
}
.new-header .partner-content.subject-color,
.new-header .partner-content .subject-color {
  background: #55c1a7 !important;
}
.new-header .partner-content.topic-color,
.new-header .partner-content .topic-color {
  background: #5cd0b3 !important;
}
.new-header .partner-content.tutorial-color,
.new-header .partner-content .tutorial-color {
  background: #ffffff;
}
.new-header .partner-content.accent-button,
.new-header .partner-content .accent-button {
  border: 1px solid #449d86;
  color: #ffffff;
  text-shadow: none;
  background-color: #459e87;
  background-image: -moz-linear-gradient(top, #49a88f, #3e8f7a);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#49a88f), to(#3e8f7a));
  background-image: -webkit-linear-gradient(top, #49a88f, #3e8f7a);
  background-image: -o-linear-gradient(top, #49a88f, #3e8f7a);
  background-image: linear-gradient(to bottom, #49a88f, #3e8f7a);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff49a88f', endColorstr='#ff3e8f7a', GradientType=0);
  border-color: #3e8f7a #3e8f7a #275a4c;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #3e8f7a;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
  font-family: 'Proxima Nova Bold', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.new-header .partner-content.accent-button:hover,
.new-header .partner-content .accent-button:hover,
.new-header .partner-content.accent-button:focus,
.new-header .partner-content .accent-button:focus,
.new-header .partner-content.accent-button:active,
.new-header .partner-content .accent-button:active,
.new-header .partner-content.accent-button.active,
.new-header .partner-content .accent-button.active,
.new-header .partner-content.accent-button.disabled,
.new-header .partner-content .accent-button.disabled,
.new-header .partner-content.accent-button[disabled],
.new-header .partner-content .accent-button[disabled] {
  color: #ffffff;
  background-color: #3e8f7a;
  *background-color: #367d6b;
}
.new-header .partner-content.accent-button:active,
.new-header .partner-content .accent-button:active,
.new-header .partner-content.accent-button.active,
.new-header .partner-content .accent-button.active {
  background-color: #2f6c5c \9;
}
.new-header .partner-content.accent-button:focus,
.new-header .partner-content .accent-button:focus,
.new-header .partner-content.accent-button:hover,
.new-header .partner-content .accent-button:hover {
  border-bottom-color: #327362;
}
.dropdown-toggle {
  cursor: pointer;
  border-color: transparent;
  border-width: 1px 1px 0px 1px;
  border-style: solid;
}
button.dropdown-toggle {
  background-color: white;
}
.dropdown.open .dropdown-toggle {
  color: #ffffff;
  background-color: #2c3747;
  border-color: #2c3747;
}
.right-arrow {
  top: 50%;
  right: 0;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 3px solid #444444;
  position: absolute;
  right: 6px;
  margin-top: -3px;
}
.caret {
  bottom: 0;
  left: 50%;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid #444444;
  display: inline-block;
  margin-left: 2px;
  margin-bottom: 2px;
}
.dropdown-toggle:hover .caret,
.open.dropdown .caret {
  bottom: 0;
  left: 50%;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid #ffffff;
  margin-left: 2px;
}
.dropdown.open > .dropdown-menu {
  display: block;
}
.dropdown-menu {
  position: absolute;
  z-index: 1000;
  float: left;
  display: none;
  list-style: none;
  background-color: #ffffff;
  padding: 3px 0;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 14px;
  line-height: 24px;
  border: 1px solid #dddddd;
  border-bottom: 1px solid #999;
  -webkit-box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
  box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
}
.dropdown-menu li {
  position: relative;
  float: left;
  clear: both;
  width: 100%;
}
.dropdown-menu li > a {
  white-space: nowrap;
  display: block;
  padding: 0 8px;
}
.dropdown-menu > li {
  color: #444444;
}
.dropdown-menu > li.disabled > a,
.dropdown-menu > li.disabled > label {
  color: #ccc !important;
  cursor: not-allowed;
}
.dropdown-menu > li > a,
.dropdown-menu > li > label {
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  color: #444444;
  position: relative;
}
.dropdown-menu > li > a:link:hover,
.dropdown-menu > li > a:visited:hover,
.dropdown-menu > li > a:link:focus,
.dropdown-menu > li > a:visited:focus {
  text-decoration: none;
  color: #444444;
}
.dropdown-menu.child-active > li.hover-active,
.dropdown-menu.none-active > li:hover,
.dropdown-menu.no-submenus > li:hover {
  text-decoration: none;
  background-color: #2c3747;
}
.dropdown-menu.child-active > li.hover-active.disabled > a,
.dropdown-menu.none-active > li:hover.disabled > a,
.dropdown-menu.no-submenus > li:hover.disabled > a,
.dropdown-menu.child-active > li.hover-active.disabled > label,
.dropdown-menu.none-active > li:hover.disabled > label,
.dropdown-menu.no-submenus > li:hover.disabled > label {
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  text-decoration: none;
}
.dropdown-menu.child-active > li.hover-active > a,
.dropdown-menu.none-active > li:hover > a,
.dropdown-menu.no-submenus > li:hover > a,
.dropdown-menu.child-active > li.hover-active > label,
.dropdown-menu.none-active > li:hover > label,
.dropdown-menu.no-submenus > li:hover > label {
  border-bottom: 1px solid #dddddd;
  border-top: 1px solid #dddddd;
  color: #ffffff;
  text-decoration: none;
}
.dropdown-menu.child-active > li.hover-active > a:hover,
.dropdown-menu.none-active > li:hover > a:hover,
.dropdown-menu.no-submenus > li:hover > a:hover,
.dropdown-menu.child-active > li.hover-active > label:hover,
.dropdown-menu.none-active > li:hover > label:hover,
.dropdown-menu.no-submenus > li:hover > label:hover {
  border-color: #2c3747;
}
.dropdown-menu.child-active > li.hover-active > div.right-arrow,
.dropdown-menu.none-active > li:hover > div.right-arrow,
.dropdown-menu.no-submenus > li:hover > div.right-arrow {
  top: 50%;
  right: 0;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 3px solid #ffffff;
  position: absolute;
  right: 6px;
}
.dropdown-menu > li.has-submenu {
  cursor: default;
}
.dropdown-menu > li.is-subheader,
.dropdown-menu > li.is-subheader:hover,
.dropdown-menu > li.is-subheader.hover-active {
  cursor: default;
  background-color: transparent;
  border-bottom: 1px solid transparent;
}
.dropdown-menu > li.is-subheader > a,
.dropdown-menu > li.is-subheader:hover > a,
.dropdown-menu > li.is-subheader.hover-active > a {
  color: #777777;
  text-transform: uppercase;
  font-weight: inherit;
  bottom: 0px;
  text-shadow: none;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 9px;
  line-height: 17px;
  -webkit-transform: translateY(0px);
}
.dropdown-menu > li.hover-active > ul,
.dropdown-menu > li.hover-active > .sub-menu-custom {
  display: block;
}
.dropdown-menu > li.has-divider {
  border-top: solid 1px #dddddd;
}
.base-button {
  cursor: pointer !important;
  font-family: inherit;
  /* input[type=button] won't inherit by default */
  line-height: 20px;
  margin: 0;
  position: relative;
  text-decoration: none !important;
  text-shadow: none;
  -webkit-transition: box-shadow ease-in-out 0.15s;
  -moz-transition: box-shadow ease-in-out 0.15s;
  -o-transition: box-shadow ease-in-out 0.15s;
  transition: box-shadow ease-in-out 0.15s;
  -webkit-appearance: none;
  /* Special button types */
}
.base-button.seethrough {
  /* Creating my own gradient instead of using a mixin because I explicitly
         * do not want to set a background color which the mixin does by default.
         */
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0)));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(255, 255, 255, 0.5)', endColorstr='rgba(255, 255, 255, 0)', GradientType=0);
  text-shadow: none;
}
.base-button.with-icon {
  padding-left: 30px;
}
.base-button.with-icon img {
  left: 7px;
  position: absolute;
  top: 3px;
}
.base-button.homepage-button {
  border: 1px solid #873989;
  color: #ffffff;
  text-shadow: none;
  background-color: #883a8a;
  background-image: -moz-linear-gradient(top, #923e94, #79337b);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#923e94), to(#79337b));
  background-image: -webkit-linear-gradient(top, #923e94, #79337b);
  background-image: -o-linear-gradient(top, #923e94, #79337b);
  background-image: linear-gradient(to bottom, #923e94, #79337b);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff923e94', endColorstr='#ff79337b', GradientType=0);
  border-color: #79337b #79337b #441d45;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #79337b;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.base-button.homepage-button:hover,
.base-button.homepage-button:focus,
.base-button.homepage-button:active,
.base-button.homepage-button.active,
.base-button.homepage-button.disabled,
.base-button.homepage-button[disabled] {
  color: #ffffff;
  background-color: #79337b;
  *background-color: #672c69;
}
.base-button.homepage-button:active,
.base-button.homepage-button.active {
  background-color: #562457 \9;
}
.base-button.homepage-button:focus,
.base-button.homepage-button:hover {
  border-bottom-color: #5d275e;
}
.base-button.provider-signup {
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  height: 40px;
}
.base-button.provider-signup .icon-facebook,
.base-button.provider-signup .icon-google {
  font-size: 24px;
  display: inline-block;
  position: relative;
  text-align: center;
  top: 10px;
  width: 24px;
}
.base-button.provider-signup.facebook {
  border: 1px solid #185895;
  color: #ffffff;
  text-shadow: none;
  background-color: #185996;
  background-image: -moz-linear-gradient(top, #1a60a2, #154e83);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1a60a2), to(#154e83));
  background-image: -webkit-linear-gradient(top, #1a60a2, #154e83);
  background-image: -o-linear-gradient(top, #1a60a2, #154e83);
  background-image: linear-gradient(to bottom, #1a60a2, #154e83);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1a60a2', endColorstr='#ff154e83', GradientType=0);
  border-color: #154e83 #154e83 #0a2741;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #154e83;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.base-button.provider-signup.facebook:hover,
.base-button.provider-signup.facebook:focus,
.base-button.provider-signup.facebook:active,
.base-button.provider-signup.facebook.active,
.base-button.provider-signup.facebook.disabled,
.base-button.provider-signup.facebook[disabled] {
  color: #ffffff;
  background-color: #154e83;
  *background-color: #12416d;
}
.base-button.provider-signup.facebook:active,
.base-button.provider-signup.facebook.active {
  background-color: #0e3457 \9;
}
.base-button.provider-signup.facebook:focus,
.base-button.provider-signup.facebook:hover {
  border-bottom-color: #0f3960;
}
.base-button.provider-signup.google {
  border: 1px solid #1faae0;
  color: #ffffff;
  text-shadow: none;
  background-color: #26a7da;
  background-image: -moz-linear-gradient(top, #2cafe2, #1c9cce);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2cafe2), to(#1c9cce));
  background-image: -webkit-linear-gradient(top, #2cafe2, #1c9cce);
  background-image: -o-linear-gradient(top, #2cafe2, #1c9cce);
  background-image: linear-gradient(to bottom, #2cafe2, #1c9cce);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2cafe2', endColorstr='#ff1c9cce', GradientType=0);
  border-color: #1c9cce #1c9cce #13698b;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #1c9cce;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.base-button.provider-signup.google:hover,
.base-button.provider-signup.google:focus,
.base-button.provider-signup.google:active,
.base-button.provider-signup.google.active,
.base-button.provider-signup.google.disabled,
.base-button.provider-signup.google[disabled] {
  color: #ffffff;
  background-color: #1c9cce;
  *background-color: #198bb8;
}
.base-button.provider-signup.google:active,
.base-button.provider-signup.google.active {
  background-color: #167aa1 \9;
}
.base-button.provider-signup.google:focus,
.base-button.provider-signup.google:hover {
  border-bottom-color: #1781aa;
}
.base-button.provider-signup .provider-separator {
  background-color: white;
  border-right: 1px solid #999999;
  float: left;
  height: 50px;
  left: 36px;
  opacity: 0.4;
  filter: alpha(opacity=40);
  position: relative;
  top: -5px;
  width: 1px;
}
.base-button.provider-signup .provider-signup-text {
  display: inline;
  font-size: 20px;
  left: 23px;
  position: relative;
  top: 8px;
}
.base-button.social-button {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 9px;
  max-width: 200px;
  padding-top: 7px;
  text-transform: uppercase;
}
.base-button.social-button img {
  height: 24px;
  vertical-align: middle;
  width: 24px;
}
.base-button.donate-button {
  bottom: 1px;
  padding: 3px 7px;
}
.base-button.big-button {
  padding: 0 2em;
  line-height: 2.5;
}
/* A simple 3D button style */
.simple-button {
  cursor: pointer !important;
  font-family: inherit;
  /* input[type=button] won't inherit by default */
  line-height: 20px;
  margin: 0;
  position: relative;
  text-decoration: none !important;
  -webkit-transition: box-shadow ease-in-out 0.15s;
  -moz-transition: box-shadow ease-in-out 0.15s;
  -o-transition: box-shadow ease-in-out 0.15s;
  transition: box-shadow ease-in-out 0.15s;
  -webkit-appearance: none;
  /* Special button types */
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #e6e6e6;
  color: #444444;
  text-shadow: none;
  background-color: #e7e7e7;
  background-image: -moz-linear-gradient(top, #eeeeee, #dcdcdc);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dcdcdc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #dcdcdc);
  background-image: -o-linear-gradient(top, #eeeeee, #dcdcdc);
  background-image: linear-gradient(to bottom, #eeeeee, #dcdcdc);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdcdcdc', GradientType=0);
  border-color: #dcdcdc #dcdcdc #b6b6b6;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #dcdcdc;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #444444 !important;
  padding: 5px 10px;
}
.simple-button.seethrough {
  /* Creating my own gradient instead of using a mixin because I explicitly
         * do not want to set a background color which the mixin does by default.
         */
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0)));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(255, 255, 255, 0.5)', endColorstr='rgba(255, 255, 255, 0)', GradientType=0);
  text-shadow: none;
}
.simple-button.with-icon {
  padding-left: 30px;
}
.simple-button.with-icon img {
  left: 7px;
  position: absolute;
  top: 3px;
}
.simple-button.homepage-button {
  border: 1px solid #873989;
  color: #ffffff;
  text-shadow: none;
  background-color: #883a8a;
  background-image: -moz-linear-gradient(top, #923e94, #79337b);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#923e94), to(#79337b));
  background-image: -webkit-linear-gradient(top, #923e94, #79337b);
  background-image: -o-linear-gradient(top, #923e94, #79337b);
  background-image: linear-gradient(to bottom, #923e94, #79337b);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff923e94', endColorstr='#ff79337b', GradientType=0);
  border-color: #79337b #79337b #441d45;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #79337b;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.homepage-button:hover,
.simple-button.homepage-button:focus,
.simple-button.homepage-button:active,
.simple-button.homepage-button.active,
.simple-button.homepage-button.disabled,
.simple-button.homepage-button[disabled] {
  color: #ffffff;
  background-color: #79337b;
  *background-color: #672c69;
}
.simple-button.homepage-button:active,
.simple-button.homepage-button.active {
  background-color: #562457 \9;
}
.simple-button.homepage-button:focus,
.simple-button.homepage-button:hover {
  border-bottom-color: #5d275e;
}
.simple-button.provider-signup {
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  height: 40px;
}
.simple-button.provider-signup .icon-facebook,
.simple-button.provider-signup .icon-google {
  font-size: 24px;
  display: inline-block;
  position: relative;
  text-align: center;
  top: 10px;
  width: 24px;
}
.simple-button.provider-signup.facebook {
  border: 1px solid #185895;
  color: #ffffff;
  text-shadow: none;
  background-color: #185996;
  background-image: -moz-linear-gradient(top, #1a60a2, #154e83);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1a60a2), to(#154e83));
  background-image: -webkit-linear-gradient(top, #1a60a2, #154e83);
  background-image: -o-linear-gradient(top, #1a60a2, #154e83);
  background-image: linear-gradient(to bottom, #1a60a2, #154e83);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1a60a2', endColorstr='#ff154e83', GradientType=0);
  border-color: #154e83 #154e83 #0a2741;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #154e83;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.provider-signup.facebook:hover,
.simple-button.provider-signup.facebook:focus,
.simple-button.provider-signup.facebook:active,
.simple-button.provider-signup.facebook.active,
.simple-button.provider-signup.facebook.disabled,
.simple-button.provider-signup.facebook[disabled] {
  color: #ffffff;
  background-color: #154e83;
  *background-color: #12416d;
}
.simple-button.provider-signup.facebook:active,
.simple-button.provider-signup.facebook.active {
  background-color: #0e3457 \9;
}
.simple-button.provider-signup.facebook:focus,
.simple-button.provider-signup.facebook:hover {
  border-bottom-color: #0f3960;
}
.simple-button.provider-signup.google {
  border: 1px solid #1faae0;
  color: #ffffff;
  text-shadow: none;
  background-color: #26a7da;
  background-image: -moz-linear-gradient(top, #2cafe2, #1c9cce);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2cafe2), to(#1c9cce));
  background-image: -webkit-linear-gradient(top, #2cafe2, #1c9cce);
  background-image: -o-linear-gradient(top, #2cafe2, #1c9cce);
  background-image: linear-gradient(to bottom, #2cafe2, #1c9cce);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2cafe2', endColorstr='#ff1c9cce', GradientType=0);
  border-color: #1c9cce #1c9cce #13698b;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #1c9cce;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.provider-signup.google:hover,
.simple-button.provider-signup.google:focus,
.simple-button.provider-signup.google:active,
.simple-button.provider-signup.google.active,
.simple-button.provider-signup.google.disabled,
.simple-button.provider-signup.google[disabled] {
  color: #ffffff;
  background-color: #1c9cce;
  *background-color: #198bb8;
}
.simple-button.provider-signup.google:active,
.simple-button.provider-signup.google.active {
  background-color: #167aa1 \9;
}
.simple-button.provider-signup.google:focus,
.simple-button.provider-signup.google:hover {
  border-bottom-color: #1781aa;
}
.simple-button.provider-signup .provider-separator {
  background-color: white;
  border-right: 1px solid #999999;
  float: left;
  height: 50px;
  left: 36px;
  opacity: 0.4;
  filter: alpha(opacity=40);
  position: relative;
  top: -5px;
  width: 1px;
}
.simple-button.provider-signup .provider-signup-text {
  display: inline;
  font-size: 20px;
  left: 23px;
  position: relative;
  top: 8px;
}
.simple-button.social-button {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 9px;
  max-width: 200px;
  padding-top: 7px;
  text-transform: uppercase;
}
.simple-button.social-button img {
  height: 24px;
  vertical-align: middle;
  width: 24px;
}
.simple-button.donate-button {
  bottom: 1px;
  padding: 3px 7px;
}
.simple-button.big-button {
  padding: 0 2em;
  line-height: 2.5;
}
.simple-button:hover,
.simple-button:focus,
.simple-button:active,
.simple-button.active,
.simple-button.disabled,
.simple-button[disabled] {
  color: #444444;
  background-color: #dcdcdc;
  *background-color: #cfcfcf;
}
.simple-button:active,
.simple-button.active {
  background-color: #c3c3c3 \9;
}
.simple-button:focus,
.simple-button:hover {
  border-bottom-color: #c8c8c8;
}
.simple-button:focus,
.simple-button:hover {
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .35), inset 0 0 50px 5px rgba(255,255,255,.2);
  -moz-box-shadow: 0 1px 1px rgba(0,0,0, .35), inset 0 0 50px 5px rgba(255,255,255,.2);
  box-shadow: 0 1px 1px rgba(0,0,0, .35), inset 0 0 50px 5px rgba(255,255,255,.2);
}
.simple-button:active,
.simple-button.toggled {
  border-color: rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.3), inset 0 1px 3px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.3), inset 0 1px 3px rgba(0, 0, 0, 0.4);
  box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.3), inset 0 1px 3px rgba(0, 0, 0, 0.4);
}
.simple-button:disabled,
.simple-button.disabled {
  background-image: none !important;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  cursor: not-allowed !important;
  opacity: 0.5;
  filter: alpha(opacity=50);
  top: 0 !important;
}
.simple-button.blue,
.simple-button.secondary {
  border: 1px solid #344050;
  color: #ffffff;
  text-shadow: none;
  background-color: #344050;
  background-image: -moz-linear-gradient(top, #3a4759, #2c3643);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3a4759), to(#2c3643));
  background-image: -webkit-linear-gradient(top, #3a4759, #2c3643);
  background-image: -o-linear-gradient(top, #3a4759, #2c3643);
  background-image: linear-gradient(to bottom, #3a4759, #2c3643);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3a4759', endColorstr='#ff2c3643', GradientType=0);
  border-color: #2c3643 #2c3643 #0e1115;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #2c3643;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.blue:hover,
.simple-button.secondary:hover,
.simple-button.blue:focus,
.simple-button.secondary:focus,
.simple-button.blue:active,
.simple-button.secondary:active,
.simple-button.blue.active,
.simple-button.secondary.active,
.simple-button.blue.disabled,
.simple-button.secondary.disabled,
.simple-button.blue[disabled],
.simple-button.secondary[disabled] {
  color: #ffffff;
  background-color: #2c3643;
  *background-color: #222934;
}
.simple-button.blue:active,
.simple-button.secondary:active,
.simple-button.blue.active,
.simple-button.secondary.active {
  background-color: #181d25 \9;
}
.simple-button.blue:focus,
.simple-button.secondary:focus,
.simple-button.blue:hover,
.simple-button.secondary:hover {
  border-bottom-color: #1c222b;
}
.simple-button.green,
.simple-button.primary {
  border: 1px solid #7fab07;
  color: #ffffff;
  text-shadow: none;
  background-color: #80ac07;
  background-image: -moz-linear-gradient(top, #8aba08, #719807);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#8aba08), to(#719807));
  background-image: -webkit-linear-gradient(top, #8aba08, #719807);
  background-image: -o-linear-gradient(top, #8aba08, #719807);
  background-image: linear-gradient(to bottom, #8aba08, #719807);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8aba08', endColorstr='#ff719807', GradientType=0);
  border-color: #719807 #719807 #3a4e03;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #719807;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.green:hover,
.simple-button.primary:hover,
.simple-button.green:focus,
.simple-button.primary:focus,
.simple-button.green:active,
.simple-button.primary:active,
.simple-button.green.active,
.simple-button.primary.active,
.simple-button.green.disabled,
.simple-button.primary.disabled,
.simple-button.green[disabled],
.simple-button.primary[disabled] {
  color: #ffffff;
  background-color: #719807;
  *background-color: #5e7f05;
}
.simple-button.green:active,
.simple-button.primary:active,
.simple-button.green.active,
.simple-button.primary.active {
  background-color: #4c6704 \9;
}
.simple-button.green:focus,
.simple-button.primary:focus,
.simple-button.green:hover,
.simple-button.primary:hover {
  border-bottom-color: #547105;
}
.simple-button.orange,
.simple-button.warning {
  border: 1px solid #d45704;
  color: #ffffff;
  text-shadow: none;
  background-color: #d55704;
  background-image: -moz-linear-gradient(top, #e35d04, #c04f03);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#e35d04), to(#c04f03));
  background-image: -webkit-linear-gradient(top, #e35d04, #c04f03);
  background-image: -o-linear-gradient(top, #e35d04, #c04f03);
  background-image: linear-gradient(to bottom, #e35d04, #c04f03);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe35d04', endColorstr='#ffc04f03', GradientType=0);
  border-color: #c04f03 #c04f03 #753002;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #c04f03;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.orange:hover,
.simple-button.warning:hover,
.simple-button.orange:focus,
.simple-button.warning:focus,
.simple-button.orange:active,
.simple-button.warning:active,
.simple-button.orange.active,
.simple-button.warning.active,
.simple-button.orange.disabled,
.simple-button.warning.disabled,
.simple-button.orange[disabled],
.simple-button.warning[disabled] {
  color: #ffffff;
  background-color: #c04f03;
  *background-color: #a74403;
}
.simple-button.orange:active,
.simple-button.warning:active,
.simple-button.orange.active,
.simple-button.warning.active {
  background-color: #8e3a02 \9;
}
.simple-button.orange:focus,
.simple-button.warning:focus,
.simple-button.orange:hover,
.simple-button.warning:hover {
  border-bottom-color: #983e03;
}
.simple-button.gray {
  border: 1px solid #808080;
  color: #ffffff;
  text-shadow: none;
  background-color: #818181;
  background-image: -moz-linear-gradient(top, #888888, #767676);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#888888), to(#767676));
  background-image: -webkit-linear-gradient(top, #888888, #767676);
  background-image: -o-linear-gradient(top, #888888, #767676);
  background-image: linear-gradient(to bottom, #888888, #767676);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff888888', endColorstr='#ff767676', GradientType=0);
  border-color: #767676 #767676 #505050;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #767676;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.gray:hover,
.simple-button.gray:focus,
.simple-button.gray:active,
.simple-button.gray.active,
.simple-button.gray.disabled,
.simple-button.gray[disabled] {
  color: #ffffff;
  background-color: #767676;
  *background-color: #696969;
}
.simple-button.gray:active,
.simple-button.gray.active {
  background-color: #5d5d5d \9;
}
.simple-button.gray:focus,
.simple-button.gray:hover {
  border-bottom-color: #626262;
}
.simple-button.brightblue {
  border: 1px solid #55a4fa;
  color: #ffffff;
  text-shadow: none;
  background-color: #56a5fa;
  background-image: -moz-linear-gradient(top, #64acfa, #4199f9);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#64acfa), to(#4199f9));
  background-image: -webkit-linear-gradient(top, #64acfa, #4199f9);
  background-image: -o-linear-gradient(top, #64acfa, #4199f9);
  background-image: linear-gradient(to bottom, #64acfa, #4199f9);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff64acfa', endColorstr='#ff4199f9', GradientType=0);
  border-color: #4199f9 #4199f9 #0772e6;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #4199f9;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.brightblue:hover,
.simple-button.brightblue:focus,
.simple-button.brightblue:active,
.simple-button.brightblue.active,
.simple-button.brightblue.disabled,
.simple-button.brightblue[disabled] {
  color: #ffffff;
  background-color: #4199f9;
  *background-color: #298cf8;
}
.simple-button.brightblue:active,
.simple-button.brightblue.active {
  background-color: #107ff7 \9;
}
.simple-button.brightblue:focus,
.simple-button.brightblue:hover {
  border-bottom-color: #1a84f8;
}
.simple-button.lightgreen {
  border: 1px solid #b9cd83;
  color: #ffffff;
  text-shadow: none;
  background-color: #b9cd84;
  background-image: -moz-linear-gradient(top, #bfd18e, #b1c775);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bfd18e), to(#b1c775));
  background-image: -webkit-linear-gradient(top, #bfd18e, #b1c775);
  background-image: -o-linear-gradient(top, #bfd18e, #b1c775);
  background-image: linear-gradient(to bottom, #bfd18e, #b1c775);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbfd18e', endColorstr='#ffb1c775', GradientType=0);
  border-color: #b1c775 #b1c775 #8faa45;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #b1c775;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.lightgreen:hover,
.simple-button.lightgreen:focus,
.simple-button.lightgreen:active,
.simple-button.lightgreen.active,
.simple-button.lightgreen.disabled,
.simple-button.lightgreen[disabled] {
  color: #ffffff;
  background-color: #b1c775;
  *background-color: #a6bf63;
}
.simple-button.lightgreen:active,
.simple-button.lightgreen.active {
  background-color: #9cb850 \9;
}
.simple-button.lightgreen:focus,
.simple-button.lightgreen:hover {
  border-bottom-color: #a0bb58;
}
.simple-button.exercise-orange {
  border: 1px solid #f09b00;
  color: #ffffff;
  text-shadow: none;
  background-color: #f19c00;
  background-image: -moz-linear-gradient(top, #ffa500, #db8e00);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffa500), to(#db8e00));
  background-image: -webkit-linear-gradient(top, #ffa500, #db8e00);
  background-image: -o-linear-gradient(top, #ffa500, #db8e00);
  background-image: linear-gradient(to bottom, #ffa500, #db8e00);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffa500', endColorstr='#ffdb8e00', GradientType=0);
  border-color: #db8e00 #db8e00 #8f5c00;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #db8e00;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.exercise-orange:hover,
.simple-button.exercise-orange:focus,
.simple-button.exercise-orange:active,
.simple-button.exercise-orange.active,
.simple-button.exercise-orange.disabled,
.simple-button.exercise-orange[disabled] {
  color: #ffffff;
  background-color: #db8e00;
  *background-color: #c27d00;
}
.simple-button.exercise-orange:active,
.simple-button.exercise-orange.active {
  background-color: #a86d00 \9;
}
.simple-button.exercise-orange:focus,
.simple-button.exercise-orange:hover {
  border-bottom-color: #b37300;
}
.simple-button.facebook {
  border: 1px solid #37538d;
  color: #ffffff;
  text-shadow: none;
  background-color: #37538e;
  background-image: -moz-linear-gradient(top, #3b5998, #314a7e);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3b5998), to(#314a7e));
  background-image: -webkit-linear-gradient(top, #3b5998, #314a7e);
  background-image: -o-linear-gradient(top, #3b5998, #314a7e);
  background-image: linear-gradient(to bottom, #3b5998, #314a7e);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3b5998', endColorstr='#ff314a7e', GradientType=0);
  border-color: #314a7e #314a7e #1c2a47;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #314a7e;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.facebook:hover,
.simple-button.facebook:focus,
.simple-button.facebook:active,
.simple-button.facebook.active,
.simple-button.facebook.disabled,
.simple-button.facebook[disabled] {
  color: #ffffff;
  background-color: #314a7e;
  *background-color: #2a3f6c;
}
.simple-button.facebook:active,
.simple-button.facebook.active {
  background-color: #23345a \9;
}
.simple-button.facebook:focus,
.simple-button.facebook:hover {
  border-bottom-color: #263961;
}
.simple-button.facebook-light {
  border: 1px solid #4763a1;
  color: #ffffff;
  text-shadow: none;
  background-color: #4864a2;
  background-image: -moz-linear-gradient(top, #4c6aac, #415b93);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4c6aac), to(#415b93));
  background-image: -webkit-linear-gradient(top, #4c6aac, #415b93);
  background-image: -o-linear-gradient(top, #4c6aac, #415b93);
  background-image: linear-gradient(to bottom, #4c6aac, #415b93);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4c6aac', endColorstr='#ff415b93', GradientType=0);
  border-color: #415b93 #415b93 #2a3a5e;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #415b93;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.facebook-light:hover,
.simple-button.facebook-light:focus,
.simple-button.facebook-light:active,
.simple-button.facebook-light.active,
.simple-button.facebook-light.disabled,
.simple-button.facebook-light[disabled] {
  color: #ffffff;
  background-color: #415b93;
  *background-color: #395082;
}
.simple-button.facebook-light:active,
.simple-button.facebook-light.active {
  background-color: #314570 \9;
}
.simple-button.facebook-light:focus,
.simple-button.facebook-light:hover {
  border-bottom-color: #354977;
}
.simple-button.twitter {
  border: 1px solid #3191ff;
  color: #ffffff;
  text-shadow: none;
  background-color: #3291ff;
  background-image: -moz-linear-gradient(top, #4099ff, #1c86ff);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4099ff), to(#1c86ff));
  background-image: -webkit-linear-gradient(top, #4099ff, #1c86ff);
  background-image: -o-linear-gradient(top, #4099ff, #1c86ff);
  background-image: linear-gradient(to bottom, #4099ff, #1c86ff);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4099ff', endColorstr='#ff1c86ff', GradientType=0);
  border-color: #1c86ff #1c86ff #0060cf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #1c86ff;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  color: #ffffff !important;
}
.simple-button.twitter:hover,
.simple-button.twitter:focus,
.simple-button.twitter:active,
.simple-button.twitter.active,
.simple-button.twitter.disabled,
.simple-button.twitter[disabled] {
  color: #ffffff;
  background-color: #1c86ff;
  *background-color: #0378ff;
}
.simple-button.twitter:active,
.simple-button.twitter.active {
  background-color: #006ce8 \9;
}
.simple-button.twitter:focus,
.simple-button.twitter:hover {
  border-bottom-color: #0071f3;
}
/* A group of simple-buttons */
.simple-button-group .simple-button {
  border-radius: 0px;
  /* Hide the overlapping blue focus outline */
}
.simple-button-group .simple-button:first-child {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.simple-button-group .simple-button:last-child {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.simple-button-group .simple-button:focus {
  outline: none;
}
.action-gradient {
  /* TODO (jasonrr): remove this once the last few uses of it have been converted or removed */
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #f7f7f7;
  background-image: -moz-linear-gradient(top, #fdfdfd, #eeeeee);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdfdfd), to(#eeeeee));
  background-image: -webkit-linear-gradient(top, #fdfdfd, #eeeeee);
  background-image: -o-linear-gradient(top, #fdfdfd, #eeeeee);
  background-image: linear-gradient(to bottom, #fdfdfd, #eeeeee);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffdfdfd', endColorstr='#ffeeeeee', GradientType=0);
  border-color: #eeeeee #eeeeee #c8c8c8;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #eeeeee;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.action-gradient:hover,
.action-gradient:focus,
.action-gradient:active,
.action-gradient.active,
.action-gradient.disabled,
.action-gradient[disabled] {
  color: #ffffff;
  background-color: #eeeeee;
  *background-color: #e1e1e1;
}
.action-gradient:active,
.action-gradient.active {
  background-color: #d5d5d5 \9;
}
/* Modifications for IE8 and under */
.lte8 .simple-button {
  border-width: 1px;
}
.lte8 .simple-button:active,
.lte8 .simple-button.toggled {
  background-color: #d5d5d5;
}
.lte8 .simple-button.blue:active,
.lte8 .simple-button.blue.toggled {
  background-color: #10161d;
}
.lte8 .simple-button.green:active,
.lte8 .simple-button.green.toggled {
  background-color: #496400;
}
.lte8 .simple-button.orange:active,
.lte8 .simple-button.orange.toggled {
  background-color: #8d3a03;
}
.lte7 .simple-button {
  position: static;
}
input.simple-button {
  /* Inputs (specificically buttons) don't obey padding in some cases */
  line-height: 15px;
}
a.big-button:link,
a.big-button:visited {
  color: inherit;
  display: inline-block;
  text-decoration: none;
  /* For big solo buttons that should expand in width
     * to fill their container.
     */
}
a.big-button:link.block-button,
a.big-button:visited.block-button {
  display: block;
  text-align: center;
}
/**
 * Links that wrap divs and are big buttons,
 * such as badge description buttons. */
a.big-button:focus > div,
a.big-button:hover > div,
a.big-button:active > div {
  -webkit-box-shadow: 0px 0px 4px 0px #aaaaaa;
  -moz-box-shadow: 0px 0px 4px 0px #aaaaaa;
  box-shadow: 0px 0px 4px 0px #aaaaaa;
}
.ui-corner-right.strict {
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
/* TODO(joshnetterfield): less-ify this file */
/* Exercise Colors */
/**
 * Use this mixin when you're looking to apply our state colors to an element
 */
.unstarted {
  background: #dddddd;
}
.practiced {
  background: #96d9ff;
}
.mastery1 {
  background: #30b4ff;
}
.mastery2 {
  color: #fdfdfd;
  background: #0080c9;
}
.mastered,
.mastery3 {
  color: #fdfdfd;
  background: #004f7d;
}
.exercise-color.proficient {
  background-color: #0080c9;
  color: #eee !important;
}
.exercise-color.proficient:hover {
  background-color: #0080c9;
}
.exercise-color.suggested {
  background-color: #73982c;
  color: #eee !important;
}
.exercise-color.suggested:hover {
  background-color: #73982c;
}
.exercise-color.review {
  background-color: #e35d04;
  color: #eee !important;
}
.exercise-color.review:hover {
  background-color: #e35d04;
}
.exercise-color.not-started,
.exercise-color.needsPractice {
  background-color: #cccccc;
}
.exercise-color.not-started:hover,
.exercise-color.needsPractice {
  background-color: #cccccc;
}
.exercise-color.struggling {
  background-color: #c30202;
  color: #dfdfdf !important;
}
.exercise-color.struggling:hover {
  background-color: #c30202;
}
.exercise-color.started {
  background-color: #c7e5f7;
}
.exercise-color.started:hover {
  background-color: #c7e5f7;
}
.exercise-color.review.light {
  background-color: #f2b891;
  background-color: #c7e5f7;
  color: #333 !important;
}
.exercise-color.review.light:hover {
  background-color: #f2b891;
}
.exercise-color.border-only {
  background-color: transparent;
}
.exercise-color.border-only:hover {
  background-color: transparent;
}
.exercise-color.proficient.border-only {
  border-left: 5px solid #0080c9;
}
.exercise-color.review.border-only {
  border-left: 5px solid #e35d04;
}
.exercise-color.not-started.border-only,
.exercise-color.needsPractice.border-only {
  border-left: 5px solid #cccccc;
}
.exercise-color.struggling.border-only {
  border-left: 5px solid #c30202;
}
.exercise-color.started.border-only {
  border-left: 5px solid #c7e5f7;
}
.exercise-color.practiced.border-only {
  border-left: 5px solid #96d9ff;
}
.exercise-color.mastery1.border-only {
  border-left: 5px solid #30b4ff;
}
.exercise-color.mastery2.border-only {
  border-left: 5px solid #0080c9;
}
.exercise-color.mastery3.border-only {
  border-left: 5px solid #004f7d;
}
/*!
 *  Font Awesome 3.6.0
 *  the iconic font designed for Bootstrap
 *  ------------------------------------------------------------------------------
 *  The full suite of pictographic icons, examples, and documentation can be
 *  found at http://fontawesome.io.  Stay up to date on Twitter at
 *  http://twitter.com/fontawesome.
 *
 *  License
 *  ------------------------------------------------------------------------------
 *  - The Font Awesome font is licensed under SIL OFL 1.1 -
 *    http://scripts.sil.org/OFL
 *  - Font Awesome CSS, LESS, and SASS files are licensed under MIT License -
 *    http://opensource.org/licenses/mit-license.html
 *  - Font Awesome documentation licensed under CC BY 3.0 -
 *    http://creativecommons.org/licenses/by/3.0/
 *  - Attribution is no longer required in Font Awesome 3.0, but much appreciated:
 *    "Font Awesome by Dave Gandy - http://fontawesome.io"
 *
 *  Author - Dave Gandy
 *  ------------------------------------------------------------------------------
 *  Email: dave@fontawesome.io
 *  Twitter: http://twitter.com/davegandy
 *  Work: Lead Product Designer @ Kyruus - http://kyruus.com
 */
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
  src: url('/fonts/fontawesome-webfont.eot?v=3.6.0');
  src: url('/fonts/fontawesome-webfont.eot?#iefix&v=3.6.0') format('embedded-opentype'), url('/fonts/fontawesome-webfont.woff?v=3.6.0') format('woff'), url('/fonts/fontawesome-webfont.ttf?v=3.6.0') format('truetype'), url('/fonts/fontawesome-webfont.svg#fontawesomeregular?v=3.6.0') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* FONT AWESOME CORE
 * -------------------------- */
[class^="icon-"],
[class*=" icon-"] {
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em;
}
[class^="icon-"]:before,
[class*=" icon-"]:before {
  text-decoration: inherit;
  display: inline-block;
  speak: none;
}
/* makes the font 33% larger relative to the icon container */
.icon-large:before {
  vertical-align: -10%;
  font-size: 1.3333333333333333em;
}
/* makes sure icons active on rollover in links */
a [class^="icon-"],
a [class*=" icon-"] {
  display: inline;
}
li {
  /* previous fontawesome fixed width list icon styling */
}
li [class^="icon-"],
li [class*=" icon-"] {
  display: inline-block;
  text-align: center;
  width: 1.25em;
}
/* increased font size for icon-large */
[class^="icon-"].icon-fixed-width,
[class*=" icon-"].icon-fixed-width {
  display: inline-block;
  width: 1.1428571428571428em;
  text-align: right;
  padding-right: 0.2857142857142857em;
}
[class^="icon-"].icon-fixed-width.icon-large,
[class*=" icon-"].icon-fixed-width.icon-large {
  width: 1.4285714285714286em;
}
.icons-ul {
  margin-left: 2.142857142857143em;
  list-style-type: none;
}
.icons-ul > li {
  position: relative;
}
.icons-ul .icon-li {
  position: absolute;
  left: -2.142857142857143em;
  width: 2.142857142857143em;
  text-align: center;
  line-height: inherit;
}
[class^="icon-"].hide,
[class*=" icon-"].hide {
  display: none;
}
.icon-muted {
  color: #eeeeee;
}
.icon-light {
  color: #ffffff;
}
.icon-dark {
  color: #333333;
}
.icon-border {
  border: solid 1px #eeeeee;
  padding: .2em .25em .15em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.icon-15x {
  font-size: 1.5em;
}
.icon-15x.icon-border {
  border-width: 2px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.icon-2x {
  font-size: 2em;
}
.icon-2x.icon-border {
  border-width: 2px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.icon-3x {
  font-size: 3em;
}
.icon-3x.icon-border {
  border-width: 3px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.icon-4x {
  font-size: 4em;
}
.icon-4x.icon-border {
  border-width: 4px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}
.icon-5x {
  font-size: 5em;
}
.icon-5x.icon-border {
  border-width: 5px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
}
.pull-right {
  float: right;
}
.pull-left {
  float: left;
}
[class^="icon-"].pull-left,
[class*=" icon-"].pull-left {
  margin-right: .3em;
}
[class^="icon-"].pull-right,
[class*=" icon-"].pull-right {
  margin-left: .3em;
}
/* EXTRAS
 * -------------------------- */
/* Stacked and layered icon */
.icon-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: -35%;
}
.icon-stack [class^="icon-"],
.icon-stack [class*=" icon-"] {
  display: block;
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 1em;
  line-height: inherit;
  *line-height: 2em;
}
.icon-stack .icon-stack-base {
  font-size: 2em;
  *line-height: 1em;
}
/* Animated rotating icon */
.icon-spin {
  display: inline-block;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}
/* Prevent stack and spinners from being taken inline when inside a link */
a .icon-stack,
a .icon-spin {
  display: inline-block;
  text-decoration: none;
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@-ms-keyframes spin {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
/* Icon rotations and mirroring */
.icon-rotate-90:before {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}
.icon-rotate-180:before {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}
.icon-rotate-270:before {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.icon-flip-horizontal:before {
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.icon-flip-vertical:before {
  -webkit-transform: scale(1, -1);
  -moz-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  -o-transform: scale(1, -1);
  transform: scale(1, -1);
}
/* ensure rotation occurs inside anchor tags */
a .icon-rotate-90:before,
a .icon-rotate-180:before,
a .icon-rotate-270:before,
a .icon-flip-horizontal:before,
a .icon-flip-vertical:before {
  display: inline-block;
}
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.icon-glass:before {
  content: "\f000";
}
.icon-music:before {
  content: "\f001";
}
.icon-search:before {
  content: "\f002";
}
.icon-envelope-alt:before {
  content: "\f003";
}
.icon-heart:before {
  content: "\f004";
}
.icon-star:before {
  content: "\f005";
}
.icon-star-empty:before {
  content: "\f006";
}
.icon-user:before {
  content: "\f007";
}
.icon-film:before {
  content: "\f008";
}
.icon-th-large:before {
  content: "\f009";
}
.icon-th:before {
  content: "\f00a";
}
.icon-th-list:before {
  content: "\f00b";
}
.icon-ok:before {
  content: "\f00c";
}
.icon-remove:before {
  content: "\f00d";
}
.icon-zoom-in:before {
  content: "\f00e";
}
.icon-zoom-out:before {
  content: "\f010";
}
.icon-power-off:before,
.icon-off:before {
  content: "\f011";
}
.icon-signal:before {
  content: "\f012";
}
.icon-gear:before,
.icon-cog:before {
  content: "\f013";
}
.icon-trash:before {
  content: "\f014";
}
.icon-home:before {
  content: "\f015";
}
.icon-file-alt:before {
  content: "\f016";
}
.icon-time:before {
  content: "\f017";
}
.icon-road:before {
  content: "\f018";
}
.icon-download-alt:before {
  content: "\f019";
}
.icon-download:before {
  content: "\f01a";
}
.icon-upload:before {
  content: "\f01b";
}
.icon-inbox:before {
  content: "\f01c";
}
.icon-play-circle:before {
  content: "\f01d";
}
.icon-rotate-right:before,
.icon-repeat:before {
  content: "\f01e";
}
.icon-refresh:before {
  content: "\f021";
}
.icon-list-alt:before {
  content: "\f022";
}
.icon-lock:before {
  content: "\f023";
}
.icon-flag:before {
  content: "\f024";
}
.icon-headphones:before {
  content: "\f025";
}
.icon-volume-off:before {
  content: "\f026";
}
.icon-volume-down:before {
  content: "\f027";
}
.icon-volume-up:before {
  content: "\f028";
}
.icon-qrcode:before {
  content: "\f029";
}
.icon-barcode:before {
  content: "\f02a";
}
.icon-tag:before {
  content: "\f02b";
}
.icon-tags:before {
  content: "\f02c";
}
.icon-book:before {
  content: "\f02d";
}
.icon-bookmark:before {
  content: "\f02e";
}
.icon-print:before {
  content: "\f02f";
}
.icon-camera:before {
  content: "\f030";
}
.icon-font:before {
  content: "\f031";
}
.icon-bold:before {
  content: "\f032";
}
.icon-italic:before {
  content: "\f033";
}
.icon-text-height:before {
  content: "\f034";
}
.icon-text-width:before {
  content: "\f035";
}
.icon-align-left:before {
  content: "\f036";
}
.icon-align-center:before {
  content: "\f037";
}
.icon-align-right:before {
  content: "\f038";
}
.icon-align-justify:before {
  content: "\f039";
}
.icon-list:before {
  content: "\f03a";
}
.icon-indent-left:before {
  content: "\f03b";
}
.icon-indent-right:before {
  content: "\f03c";
}
.icon-facetime-video:before {
  content: "\f03d";
}
.icon-picture:before {
  content: "\f03e";
}
.icon-pencil:before {
  content: "\f040";
}
.icon-map-marker:before {
  content: "\f041";
}
.icon-adjust:before {
  content: "\f042";
}
.icon-tint:before {
  content: "\f043";
}
.icon-edit:before {
  content: "\f044";
}
.icon-share:before {
  content: "\f045";
}
.icon-check:before {
  content: "\f046";
}
.icon-move:before {
  content: "\f047";
}
.icon-step-backward:before {
  content: "\f048";
}
.icon-fast-backward:before {
  content: "\f049";
}
.icon-backward:before {
  content: "\f04a";
}
.icon-play:before {
  content: "\f04b";
}
.icon-pause:before {
  content: "\f04c";
}
.icon-stop:before {
  content: "\f04d";
}
.icon-forward:before {
  content: "\f04e";
}
.icon-fast-forward:before {
  content: "\f050";
}
.icon-step-forward:before {
  content: "\f051";
}
.icon-eject:before {
  content: "\f052";
}
.icon-chevron-left:before {
  content: "\f053";
}
.icon-chevron-right:before {
  content: "\f054";
}
.icon-plus-sign:before {
  content: "\f055";
}
.icon-minus-sign:before {
  content: "\f056";
}
.icon-remove-sign:before {
  content: "\f057";
}
.icon-goals:before,
.icon-ok-sign:before {
  content: "\f058";
}
.icon-question-sign:before {
  content: "\f059";
}
.icon-info-sign:before {
  content: "\f05a";
}
.icon-screenshot:before {
  content: "\f05b";
}
.icon-remove-circle:before {
  content: "\f05c";
}
.icon-ok-circle:before {
  content: "\f05d";
}
.icon-ban-circle:before {
  content: "\f05e";
}
.icon-arrow-left:before {
  content: "\f060";
}
.icon-arrow-right:before {
  content: "\f061";
}
.icon-arrow-up:before {
  content: "\f062";
}
.icon-arrow-down:before {
  content: "\f063";
}
.icon-mail-forward:before,
.icon-share-alt:before {
  content: "\f064";
}
.icon-resize-full:before {
  content: "\f065";
}
.icon-resize-small:before {
  content: "\f066";
}
.icon-plus:before {
  content: "\f067";
}
.icon-minus:before {
  content: "\f068";
}
.icon-asterisk:before {
  content: "\f069";
}
.icon-exclamation-sign:before {
  content: "\f06a";
}
.icon-gift:before {
  content: "\f06b";
}
.icon-leaf:before {
  content: "\f06c";
}
.icon-fire:before {
  content: "\f06d";
}
.icon-eye-open:before {
  content: "\f06e";
}
.icon-eye-close:before {
  content: "\f070";
}
.icon-warning-sign:before {
  content: "\f071";
}
.icon-plane:before {
  content: "\f072";
}
.icon-calendar:before {
  content: "\f073";
}
.icon-random:before {
  content: "\f074";
}
.icon-comment:before {
  content: "\f075";
}
.icon-magnet:before {
  content: "\f076";
}
.icon-chevron-up:before {
  content: "\f077";
}
.icon-chevron-down:before {
  content: "\f078";
}
.icon-retweet:before {
  content: "\f079";
}
.icon-shopping-cart:before {
  content: "\f07a";
}
.icon-folder-close:before {
  content: "\f07b";
}
.icon-folder-open:before {
  content: "\f07c";
}
.icon-resize-vertical:before {
  content: "\f07d";
}
.icon-resize-horizontal:before {
  content: "\f07e";
}
.icon-bar-chart:before {
  content: "\f080";
}
.icon-twitter-sign:before {
  content: "\f081";
}
.icon-facebook-sign:before {
  content: "\f082";
}
.icon-camera-retro:before {
  content: "\f083";
}
.icon-key:before {
  content: "\f084";
}
.icon-gears:before,
.icon-cogs:before {
  content: "\f085";
}
.icon-discussion:before,
.icon-comments:before {
  content: "\f086";
}
.icon-thumbs-up-alt:before {
  content: "\f087";
}
.icon-thumbs-down-alt:before {
  content: "\f088";
}
.icon-star-half:before {
  content: "\f089";
}
.icon-heart-empty:before {
  content: "\f08a";
}
.icon-signout:before {
  content: "\f08b";
}
.icon-pushpin:before {
  content: "\f08d";
}
.icon-external-link:before {
  content: "\f08e";
}
.icon-signin:before {
  content: "\f090";
}
.icon-trophy:before {
  content: "\f091";
}
.icon-github-sign:before {
  content: "\f092";
}
.icon-upload-alt:before {
  content: "\f093";
}
.icon-lemon:before {
  content: "\f094";
}
.icon-phone:before {
  content: "\f095";
}
.icon-unchecked:before,
.icon-check-empty:before {
  content: "\f096";
}
.icon-bookmark-empty:before {
  content: "\f097";
}
.icon-phone-sign:before {
  content: "\f098";
}
.icon-twitter:before {
  content: "\f099";
}
.icon-facebook:before {
  content: "\f09a";
}
.icon-github:before {
  content: "\f09b";
}
.icon-unlock:before {
  content: "\f09c";
}
.icon-credit-card:before {
  content: "\f09d";
}
.icon-rss:before {
  content: "\f09e";
}
.icon-hdd:before {
  content: "\f0a0";
}
.icon-bullhorn:before {
  content: "\f0a1";
}
.icon-bell:before {
  content: "\f0a2";
}
.icon-certificate:before {
  content: "\f0a3";
}
.icon-hand-right:before {
  content: "\f0a4";
}
.icon-hand-left:before {
  content: "\f0a5";
}
.icon-hand-up:before {
  content: "\f0a6";
}
.icon-hand-down:before {
  content: "\f0a7";
}
.icon-circle-arrow-left:before {
  content: "\f0a8";
}
.icon-circle-arrow-right:before {
  content: "\f0a9";
}
.icon-circle-arrow-up:before {
  content: "\f0aa";
}
.icon-circle-arrow-down:before {
  content: "\f0ab";
}
.icon-globe:before {
  content: "\f0ac";
}
.icon-wrench:before {
  content: "\f0ad";
}
.icon-tasks:before {
  content: "\f0ae";
}
.icon-filter:before {
  content: "\f0b0";
}
.icon-briefcase:before {
  content: "\f0b1";
}
.icon-fullscreen:before {
  content: "\f0b2";
}
.icon-group:before {
  content: "\f0c0";
}
.icon-link:before {
  content: "\f0c1";
}
.icon-cloud:before {
  content: "\f0c2";
}
.icon-beaker:before {
  content: "\f0c3";
}
.icon-cut:before {
  content: "\f0c4";
}
.icon-copy:before {
  content: "\f0c5";
}
.icon-paperclip:before,
.icon-paper-clip:before {
  content: "\f0c6";
}
.icon-save:before {
  content: "\f0c7";
}
.icon-sign-blank:before {
  content: "\f0c8";
}
.icon-reorder:before {
  content: "\f0c9";
}
.icon-list-ul:before {
  content: "\f0ca";
}
.icon-list-ol:before {
  content: "\f0cb";
}
.icon-strikethrough:before {
  content: "\f0cc";
}
.icon-underline:before {
  content: "\f0cd";
}
.icon-table:before {
  content: "\f0ce";
}
.icon-magic:before {
  content: "\f0d0";
}
.icon-truck:before {
  content: "\f0d1";
}
.icon-google-plus-sign:before {
  content: "\f0d4";
}
.icon-google-plus:before {
  content: "\f0d5";
}
.icon-money:before {
  content: "\f0d6";
}
.icon-caret-down:before {
  content: "\f0d7";
}
.icon-caret-up:before {
  content: "\f0d8";
}
.icon-caret-left:before {
  content: "\f0d9";
}
.icon-caret-right:before {
  content: "\f0da";
}
.icon-columns:before {
  content: "\f0db";
}
.icon-sort:before {
  content: "\f0dc";
}
.icon-sort-down:before {
  content: "\f0dd";
}
.icon-sort-up:before {
  content: "\f0de";
}
.icon-envelope:before {
  content: "\f0e0";
}
.icon-linkedin:before {
  content: "\f0e1";
}
.icon-rotate-left:before,
.icon-undo:before {
  content: "\f0e2";
}
.icon-legal:before {
  content: "\f0e3";
}
.icon-dashboard:before {
  content: "\f0e4";
}
.icon-comment-alt:before {
  content: "\f0e5";
}
.icon-comments-alt:before {
  content: "\f0e6";
}
.icon-bolt:before {
  content: "\f0e7";
}
.icon-sitemap:before {
  content: "\f0e8";
}
.icon-umbrella:before {
  content: "\f0e9";
}
.icon-paste:before {
  content: "\f0ea";
}
.icon-lightbulb:before {
  content: "\f0eb";
}
.icon-exchange:before {
  content: "\f0ec";
}
.icon-cloud-download:before {
  content: "\f0ed";
}
.icon-cloud-upload:before {
  content: "\f0ee";
}
.icon-user-md:before {
  content: "\f0f0";
}
.icon-stethoscope:before {
  content: "\f0f1";
}
.icon-suitcase:before {
  content: "\f0f2";
}
.icon-bell-alt:before {
  content: "\f0f3";
}
.icon-coffee:before {
  content: "\f0f4";
}
.icon-food:before {
  content: "\f0f5";
}
.icon-file-text-alt:before {
  content: "\f0f6";
}
.icon-building:before {
  content: "\f0f7";
}
.icon-hospital:before {
  content: "\f0f8";
}
.icon-ambulance:before {
  content: "\f0f9";
}
.icon-medkit:before {
  content: "\f0fa";
}
.icon-beer:before {
  content: "\f0fc";
}
.icon-h-sign:before {
  content: "\f0fd";
}
.icon-plus-sign-alt:before {
  content: "\f0fe";
}
.icon-double-angle-left:before {
  content: "\f100";
}
.icon-double-angle-right:before {
  content: "\f101";
}
.icon-double-angle-up:before {
  content: "\f102";
}
.icon-double-angle-down:before {
  content: "\f103";
}
.icon-angle-left:before {
  content: "\f104";
}
.icon-angle-right:before {
  content: "\f105";
}
.icon-angle-up:before {
  content: "\f106";
}
.icon-angle-down:before {
  content: "\f107";
}
.icon-desktop:before {
  content: "\f108";
}
.icon-laptop:before {
  content: "\f109";
}
.icon-tablet:before {
  content: "\f10a";
}
.icon-mobile-phone:before {
  content: "\f10b";
}
.icon-circle-blank:before {
  content: "\f10c";
}
.icon-quote-left:before {
  content: "\f10d";
}
.icon-quote-right:before {
  content: "\f10e";
}
.icon-spinner:before {
  content: "\f110";
}
.icon-circle:before {
  content: "\f111";
}
.icon-mail-reply:before,
.icon-reply:before {
  content: "\f112";
}
.icon-github-alt:before {
  content: "\f113";
}
.icon-folder-close-alt:before {
  content: "\f114";
}
.icon-folder-open-alt:before {
  content: "\f115";
}
.icon-expand-alt:before {
  content: "\f116";
}
.icon-collapse-alt:before {
  content: "\f117";
}
.icon-smile:before {
  content: "\f118";
}
.icon-frown:before {
  content: "\f119";
}
.icon-meh:before {
  content: "\f11a";
}
.icon-gamepad:before {
  content: "\f11b";
}
.icon-keyboard:before {
  content: "\f11c";
}
.icon-flag-alt:before {
  content: "\f11d";
}
.icon-flag-checkered:before {
  content: "\f11e";
}
.icon-terminal:before {
  content: "\f120";
}
.icon-code:before {
  content: "\f121";
}
.icon-reply-all:before {
  content: "\f122";
}
.icon-mail-reply-all:before {
  content: "\f122";
}
.icon-star-half-full:before,
.icon-star-half-empty:before {
  content: "\f123";
}
.icon-location-arrow:before {
  content: "\f124";
}
.icon-crop:before {
  content: "\f125";
}
.icon-code-fork:before {
  content: "\f126";
}
.icon-unlink:before {
  content: "\f127";
}
.icon-question:before {
  content: "\f128";
}
.icon-info:before {
  content: "\f129";
}
.icon-exclamation:before {
  content: "\f12a";
}
.icon-superscript:before {
  content: "\f12b";
}
.icon-subscript:before {
  content: "\f12c";
}
.icon-eraser:before {
  content: "\f12d";
}
.icon-puzzle-piece:before {
  content: "\f12e";
}
.icon-microphone:before {
  content: "\f130";
}
.icon-microphone-off:before {
  content: "\f131";
}
.icon-shield:before {
  content: "\f132";
}
.icon-calendar-empty:before {
  content: "\f133";
}
.icon-fire-extinguisher:before {
  content: "\f134";
}
.icon-rocket:before {
  content: "\f135";
}
.icon-chevron-sign-left:before {
  content: "\f137";
}
.icon-chevron-sign-right:before {
  content: "\f138";
}
.icon-chevron-sign-up:before {
  content: "\f139";
}
.icon-chevron-sign-down:before {
  content: "\f13a";
}
.icon-anchor:before {
  content: "\f13d";
}
.icon-unlock-alt:before {
  content: "\f13e";
}
.icon-bullseye:before {
  content: "\f140";
}
.icon-ellipsis-horizontal:before {
  content: "\f141";
}
.icon-ellipsis-vertical:before {
  content: "\f142";
}
.icon-rss-sign:before {
  content: "\f143";
}
.icon-play-sign:before {
  content: "\f144";
}
.icon-ticket:before {
  content: "\f145";
}
.icon-minus-sign-alt:before {
  content: "\f146";
}
.icon-check-minus:before {
  content: "\f147";
}
.icon-level-up:before {
  content: "\f148";
}
.icon-level-down:before {
  content: "\f149";
}
.icon-check-sign:before {
  content: "\f14a";
}
.icon-edit-sign:before {
  content: "\f14b";
}
.icon-external-link-sign:before {
  content: "\f14c";
}
.icon-share-sign:before {
  content: "\f14d";
}
.icon-compass:before {
  content: "\f14e";
}
.icon-collapse:before {
  content: "\f150";
}
.icon-collapse-top:before {
  content: "\f151";
}
.icon-expand:before {
  content: "\f152";
}
.icon-euro:before,
.icon-eur:before {
  content: "\f153";
}
.icon-gbp:before {
  content: "\f154";
}
.icon-dollar:before,
.icon-usd:before {
  content: "\f155";
}
.icon-rupee:before,
.icon-inr:before {
  content: "\f156";
}
.icon-yen:before,
.icon-jpy:before {
  content: "\f157";
}
.icon-renminbi:before,
.icon-cny:before {
  content: "\f158";
}
.icon-won:before,
.icon-krw:before {
  content: "\f159";
}
.icon-bitcoin:before,
.icon-btc:before {
  content: "\f15a";
}
.icon-file:before {
  content: "\f15b";
}
.icon-file-text:before {
  content: "\f15c";
}
.icon-sort-by-alphabet:before {
  content: "\f15d";
}
.icon-sort-by-alphabet-alt:before {
  content: "\f15e";
}
.icon-sort-by-attributes:before {
  content: "\f160";
}
.icon-sort-by-attributes-alt:before {
  content: "\f161";
}
.icon-sort-by-order:before {
  content: "\f162";
}
.icon-sort-by-order-alt:before {
  content: "\f163";
}
.icon-thumbs-up:before {
  content: "\f164";
}
.icon-thumbs-down:before {
  content: "\f165";
}
.icon-youtube-sign:before {
  content: "\f166";
}
.icon-youtube:before {
  content: "\f167";
}
.icon-youtube-play:before {
  content: "\f16a";
}
.icon-dropbox:before {
  content: "\f16b";
}
.icon-tumblr:before {
  content: "\f173";
}
.icon-long-arrow-down:before {
  content: "\f175";
}
.icon-long-arrow-up:before {
  content: "\f176";
}
.icon-long-arrow-left:before {
  content: "\f177";
}
.icon-long-arrow-right:before {
  content: "\f178";
}
.icon-trello:before {
  content: "\f181";
}
.icon-female:before {
  content: "\f182";
}
.icon-male:before {
  content: "\f183";
}
.icon-gittip:before {
  content: "\f184";
}
.icon-sun:before {
  content: "\f185";
}
.icon-moon:before {
  content: "\f186";
}
.icon-archive:before {
  content: "\f187";
}
.icon-bug:before {
  content: "\f188";
}
.icon-ok-dotted:before {
  content: "\f300";
}
.icon-coach-rec:before {
  content: "\f301";
}
.icon-badge:before {
  content: "\f302";
}
.icon-activity:before {
  content: "\f303";
}
.icon-focus:before {
  content: "\f304";
}
.icon-progress:before {
  content: "\f306";
}
.icon-scratchpad:before {
  content: "\f307";
}
.icon-coaches:before {
  content: "\f309";
}
.icon-google:before {
  content: "\f310";
}
.icon-notification:before {
  content: "\f311";
}
.large-search-form {
  display: block;
  position: relative;
}
/* HACK(benkomalo): The large search bar can't use the default sprite
   or a background image, because it's too large, so we use fontawesome
   to manually make an icon */
.large-search-form .icon-search {
  color: #aaaaaa;
  font-size: 18px;
  position: absolute;
  top: 14px;
  right: auto;
  bottom: auto;
  left: 9px;
}
.large-search-form .large-search-submit {
  position: absolute;
  top: 4px;
  right: 4px;
}
.large-search-form .typeahead-search input[type=text] {
  background-image: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  padding-left: 28px;
  width: 50px;
  height: 100%;
  height: 50px;
  width: 100%;
}
.large-search-form .typeahead-search input[type=text].placeholder {
  font-style: normal;
}
.large-search-form .typeahead-search .dropdown-menu {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.large-search-form .typeahead-search .dropdown-menu.touch .typeahead-result {
  width: 90%;
}
.large-search-form .typeahead-search .twitter-typeahead {
  width: 100%;
}
.lte8 .typeahead-search input[type=text] {
  line-height: 40px;
}
.progress-started,
.progress-complete {
  display: none;
}
.progress-container {
  display: block;
  position: relative;
}
.progress-container .active .progress-icon:before {
  color: #aaaaaa;
}
.progress-container .active .progress-title {
  padding-top: 2px;
}
.progress-container:hover .progress-icon:before {
  color: #aaaaaa;
}
.progress-container .progress-item {
  border-top: 1px solid #dddddd;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 18px;
  position: relative;
}
.progress-container .progress-item:first-child {
  border-top: none;
}
.progress-container .progress-item-link {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  padding: 0 5px;
  text-decoration: none;
  width: 100%;
}
.progress-container .progress-item-link .small-icon:after {
  top: 15px;
  left: 15px;
}
.progress-container .progress-icon {
  line-height: 20px;
}
.progress-container .progress-icon.icon-exercise-node,
.progress-container .progress-icon.icon-scratchpad-node,
.progress-container .progress-icon.icon-talkie-node,
.progress-container .progress-icon.icon-challenge-node,
.progress-container .progress-icon.icon-article-node,
.progress-container .progress-icon.icon-video-node,
.progress-container .progress-icon.icon-project-node {
  color: #dddddd;
  display: table-cell;
  font-size: 16px;
  text-indent: 0;
}
.progress-container .progress-icon.icon-exercise-node:after,
.progress-container .progress-icon.icon-scratchpad-node:after,
.progress-container .progress-icon.icon-talkie-node:after,
.progress-container .progress-icon.icon-challenge-node:after,
.progress-container .progress-icon.icon-article-node:after,
.progress-container .progress-icon.icon-video-node:after,
.progress-container .progress-icon.icon-project-node:after {
  color: #76a005;
  display: none;
  height: 10px;
  overflow: hidden;
  position: absolute;
  top: 2px;
  right: auto;
  bottom: auto;
  left: 3px;
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
}
.progress-container .progress-icon.icon-exercise-node.small-icon,
.progress-container .progress-icon.icon-scratchpad-node.small-icon,
.progress-container .progress-icon.icon-talkie-node.small-icon,
.progress-container .progress-icon.icon-challenge-node.small-icon,
.progress-container .progress-icon.icon-article-node.small-icon,
.progress-container .progress-icon.icon-video-node.small-icon,
.progress-container .progress-icon.icon-project-node.small-icon {
  font-size: 12px;
  width: auto;
  line-height: 20px;
}
.progress-container .progress-icon.icon-exercise-node.small-icon:after,
.progress-container .progress-icon.icon-scratchpad-node.small-icon:after,
.progress-container .progress-icon.icon-talkie-node.small-icon:after,
.progress-container .progress-icon.icon-challenge-node.small-icon:after,
.progress-container .progress-icon.icon-article-node.small-icon:after,
.progress-container .progress-icon.icon-video-node.small-icon:after,
.progress-container .progress-icon.icon-project-node.small-icon:after {
  height: 10px;
  position: absolute;
  top: 0;
  right: auto;
  bottom: auto;
  left: 0;
}
.progress-container .progress-icon.icon-exercise-node {
  font-size: 18px;
  width: 20px;
}
.progress-container .progress-icon.icon-exercise-node:after {
  position: absolute;
  top: 1px;
  right: auto;
  bottom: auto;
  left: 2px;
}
.progress-container .progress-icon.icon-exercise-node:before,
.progress-container .progress-icon.icon-exercise-node:after {
  content: "\f005";
}
.progress-container .progress-icon.icon-video-node:before,
.progress-container .progress-icon.icon-video-node:after {
  content: "\f03d";
}
.progress-container .progress-icon.icon-scratchpad-node:before,
.progress-container .progress-icon.icon-scratchpad-node:after,
.progress-container .progress-icon.icon-talkie-node:before,
.progress-container .progress-icon.icon-talkie-node:after .progress-container .progress-icon.icon-challenge-node:before,
.progress-container .progress-icon.icon-challenge-node:after,
.progress-container .progress-icon.icon-project-node:before,
.progress-container .progress-icon.icon-project-node:after {
  content: "\f03e";
}
.progress-container .progress-icon.icon-article-node:before,
.progress-container .progress-icon.icon-article-node:after {
  content: "\f0f6";
}
.progress-container .progress-icon.progress-started:after {
  display: inline-block !important;
}
.progress-container .progress-icon.progress-complete:before {
  color: #76a005 !important;
}
.progress-container .progress-title {
  display: table-cell;
  padding-left: 5px;
  line-height: 20px;
}
.tutorial-nav-node .progress-container .progress-icon {
  line-height: 1;
}
.tutorial-nav-node .progress-container .progress-icon.icon-video-node:after,
.tutorial-nav-node .progress-container .progress-icon.icon-exercise-node:after {
  height: 9px;
  position: absolute;
  top: 8px;
  right: auto;
  bottom: auto;
  left: 7px;
}
.tutorial-nav-node .progress-container .progress-icon.icon-scratchpad-node:after,
.tutorial-nav-node .progress-container .progress-icon.icon-talkie-node:after,
.tutorial-nav-node .progress-container .progress-icon.icon-challenge-node:after,
.tutorial-nav-node .progress-container .progress-icon.icon-project-node:after {
  height: 9px;
  position: absolute;
  top: 9px;
  right: auto;
  bottom: auto;
  left: 7px;
}
.related-video-list .progress-container .progress-icon.icon-exercise-node:after,
.related-video-list .progress-container .progress-icon.icon-scratchpad-node:after,
.related-video-list .progress-container .progress-icon.icon-talkie-node:after,
.related-video-list .progress-container .progress-icon.icon-challenge-node:after,
.related-video-list .progress-container .progress-icon.icon-video-node:after,
.related-video-list .progress-container .progress-icon.icon-project-node:after {
  height: 10px;
  position: absolute;
  top: 0px;
  right: auto;
  bottom: auto;
  left: 0px;
}
.topic-video .progress-container .progress-icon.icon-exercise-node:after,
.topic-video .progress-container .progress-icon.icon-scratchpad-node:after,
.topic-video .progress-container .progress-icon.icon-talkie-node:after,
.topic-video .progress-container .progress-icon.icon-challenge-node:after,
.topic-video .progress-container .progress-icon.icon-video-node:after,
.topic-video .progress-container .progress-icon.icon-project-node:after {
  height: 11px;
  top: 0;
}
.progress-container .progress-icon.small-icon.library-view {
  line-height: 18px;
}
.progress-container .progress-icon.small-icon.library-view:after {
  height: 9px;
  position: absolute;
  top: 2px;
  right: auto;
  bottom: auto;
  left: 14px;
}
.subway-icon {
  display: block;
  position: absolute;
  width: 40px;
  height: 100%;
}
.subway-icon .pipe {
  background-color: #cdcdcd;
  height: 100%;
  padding-top: 2px;
  position: absolute;
  top: -1px;
  right: auto;
  bottom: auto;
  left: 18px;
  width: 4px;
  z-index: 10;
}
.subway-icon .status {
  height: 25px;
  width: 25px;
  overflow: hidden;
  position: absolute;
  top: 50%;
  right: auto;
  bottom: auto;
  left: 8px;
  margin-top: -12px;
  z-index: 20;
}
.subway-icon + .progress-title {
  min-height: 40px;
  padding: 15px;
  padding-left: 50px;
  vertical-align: middle;
}
.progress-item:first-child .pipe,
.tutorial-nav .tutorial-nav-node:first-child .pipe {
  bottom: -1px;
  height: 50%;
  top: auto;
}
.progress-item:last-child .pipe,
.tutorial-nav .tutorial-nav-node:last-child .pipe {
  height: 50%;
}
.progress-item:last-child:first-child .pipe,
.tutorial-nav .tutorial-nav-node:last-child:first-child .pipe {
  display: none;
}
.uncurated .subway-icon .pipe,
.uncurated .subway-icon .pipe.completed,
.pipe.completed {
  display: none;
}
/**
 *  This supports custom icons for user_progress in topic page (and soon tutorial pages)
 *  the whole setup is super messy right now, but if we modify user_progress to imbue each
 *  started/completed node with a background position, then we can go back to having a
 *  single image for .@{domain} .status and setting the video/exercise/scratchpad/etc stuff
 *  in user_progress. That definitely shoves some of the cruft into that file and it's not
 *  totally clear that it's a huge win since all of these solutions are gross in some way.
 */
.new-header .math .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-math.png);
  /*! data-uri */
}
.new-header .math .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-math.png);
  /*! data-uri */
}
.new-header .math .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-math.png);
  /*! data-uri */
}
.new-header .math .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-math.png);
  /*! data-uri */
}
.new-header .math .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-math.png);
  /*! data-uri */
}
.new-header .math .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-math.png);
  /*! data-uri */
}
.new-header .math .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-math.png);
  /*! data-uri */
}
.new-header .math .pipe.completed {
  background-color: #4fbad4;
}
.new-header .math .progress-container:hover .progress-item:hover .progress-item-link {
  background: #3b8fa3;
  color: #ffffff;
  text-decoration: none;
}
.new-header .science .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-science.png);
  /*! data-uri */
}
.new-header .science .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-science.png);
  /*! data-uri */
}
.new-header .science .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-science.png);
  /*! data-uri */
}
.new-header .science .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-science.png);
  /*! data-uri */
}
.new-header .science .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-science.png);
  /*! data-uri */
}
.new-header .science .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-science.png);
  /*! data-uri */
}
.new-header .science .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-science.png);
  /*! data-uri */
}
.new-header .science .pipe.completed {
  background-color: #c55f73;
}
.new-header .science .progress-container:hover .progress-item:hover .progress-item-link {
  background: #793541;
  color: #ffffff;
  text-decoration: none;
}
.new-header .cs .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-cs.png);
  /*! data-uri */
}
.new-header .cs .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-cs.png);
  /*! data-uri */
}
.new-header .cs .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-cs.png);
  /*! data-uri */
}
.new-header .cs .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-cs.png);
  /*! data-uri */
}
.new-header .cs .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-cs.png);
  /*! data-uri */
}
.new-header .cs .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-cs.png);
  /*! data-uri */
}
.new-header .cs .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-cs.png);
  /*! data-uri */
}
.new-header .cs .pipe.completed {
  background-color: #71b64f;
}
.new-header .cs .progress-container:hover .progress-item:hover .progress-item-link {
  background: #5b9032;
  color: #ffffff;
  text-decoration: none;
}
.new-header .hour-of-code .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .pipe.completed {
  background-color: #71b64f;
}
.new-header .hour-of-code .progress-container:hover .progress-item:hover .progress-item-link {
  background: #5b9032;
  color: #ffffff;
  text-decoration: none;
}
.new-header .humanities .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-humanities.png);
  /*! data-uri */
}
.new-header .humanities .pipe.completed {
  background-color: #fc6255;
}
.new-header .humanities .progress-container:hover .progress-item:hover .progress-item-link {
  background: #cf5044;
  color: #ffffff;
  text-decoration: none;
}
.new-header .partner-content .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .pipe.completed {
  background-color: #5cd0b3;
}
.new-header .partner-content .progress-container:hover .progress-item:hover .progress-item-link {
  background: #49a88f;
  color: #ffffff;
  text-decoration: none;
}
.new-header .test-prep .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .pipe.completed {
  background-color: #a369aa;
}
.new-header .test-prep .progress-container:hover .progress-item:hover .progress-item-link {
  background: #8e4c9b;
  color: #ffffff;
  text-decoration: none;
}
.new-header .progress-container:hover .progress-item:hover .progress-item-link {
  background: #96ab4f;
  color: #ffffff;
  text-decoration: none;
}
.new-header .math .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-math.png);
  /*! data-uri */
}
.new-header .math .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-math.png);
  /*! data-uri */
}
.new-header .math .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-math.png);
  /*! data-uri */
}
.new-header .math .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-math.png);
  /*! data-uri */
}
.new-header .math .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-math.png);
  /*! data-uri */
}
.new-header .math .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-math.png);
  /*! data-uri */
}
.new-header .math .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-math.png);
  /*! data-uri */
}
.new-header .math .pipe.completed {
  background-color: #4fbad4;
}
.new-header .math .progress-container:hover .progress-item:hover .progress-item-link {
  background: #3b8fa3;
  color: #ffffff;
  text-decoration: none;
}
.new-header .science .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-science.png);
  /*! data-uri */
}
.new-header .science .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-science.png);
  /*! data-uri */
}
.new-header .science .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-science.png);
  /*! data-uri */
}
.new-header .science .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-science.png);
  /*! data-uri */
}
.new-header .science .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-science.png);
  /*! data-uri */
}
.new-header .science .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-science.png);
  /*! data-uri */
}
.new-header .science .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-science.png);
  /*! data-uri */
}
.new-header .science .pipe.completed {
  background-color: #c55f73;
}
.new-header .science .progress-container:hover .progress-item:hover .progress-item-link {
  background: #793541;
  color: #ffffff;
  text-decoration: none;
}
.new-header .cs .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-cs.png);
  /*! data-uri */
}
.new-header .cs .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-cs.png);
  /*! data-uri */
}
.new-header .cs .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-cs.png);
  /*! data-uri */
}
.new-header .cs .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-cs.png);
  /*! data-uri */
}
.new-header .cs .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-cs.png);
  /*! data-uri */
}
.new-header .cs .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-cs.png);
  /*! data-uri */
}
.new-header .cs .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-cs.png);
  /*! data-uri */
}
.new-header .cs .pipe.completed {
  background-color: #71b64f;
}
.new-header .cs .progress-container:hover .progress-item:hover .progress-item-link {
  background: #5b9032;
  color: #ffffff;
  text-decoration: none;
}
.new-header .hour-of-code .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-cs.png);
  /*! data-uri */
}
.new-header .hour-of-code .pipe.completed {
  background-color: #71b64f;
}
.new-header .hour-of-code .progress-container:hover .progress-item:hover .progress-item-link {
  background: #5b9032;
  color: #ffffff;
  text-decoration: none;
}
.new-header .humanities .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-humanities.png);
  /*! data-uri */
}
.new-header .humanities .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-humanities.png);
  /*! data-uri */
}
.new-header .humanities .pipe.completed {
  background-color: #fc6255;
}
.new-header .humanities .progress-container:hover .progress-item:hover .progress-item-link {
  background: #cf5044;
  color: #ffffff;
  text-decoration: none;
}
.new-header .partner-content .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-partnerContent.png);
  /*! data-uri */
}
.new-header .partner-content .pipe.completed {
  background-color: #5cd0b3;
}
.new-header .partner-content .progress-container:hover .progress-item:hover .progress-item-link {
  background: #49a88f;
  color: #ffffff;
  text-decoration: none;
}
.new-header .test-prep .status.video-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-video-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.exercise-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-exercise-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-scratchpad-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.talkie-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-talkie-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.challenge-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-challenge-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.article-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-article-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .status.project-node {
  background-image: url(http://www.khanacademy.org/images/progress-icons/subway-sprites-project-testPrep.png);
  /*! data-uri */
}
.new-header .test-prep .pipe.completed {
  background-color: #a369aa;
}
.new-header .test-prep .progress-container:hover .progress-item:hover .progress-item-link {
  background: #8e4c9b;
  color: #ffffff;
  text-decoration: none;
}
.status.video-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-video-default.png");
  /*! data-uri */
}
.status.exercise-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-exercise-default.png");
  /*! data-uri */
}
.status.scratchpad-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-scratchpad-default.png");
  /*! data-uri */
}
.status.talkie-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-talkie-default.png");
  /*! data-uri */
}
.status.challenge-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-challenge-default.png");
  /*! data-uri */
}
.status.article-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-article-default.png");
  /*! data-uri */
}
.status.project-node {
  background-image: url(http://www.khanacademy.org/"/images/progress-icons/subway-sprites-project-default.png");
  /*! data-uri */
}
.pipe.completed {
  background-color: #b7cf6c;
}
.new-header .subway-icon.progress-started .pipe.completed,
.new-header .subway-icon.progress-complete .pipe.completed {
  display: block;
}
.new-header .subway-icon.progress-started .status {
  background-position: center;
}
.new-header .subway-icon.progress-complete .status {
  background-position: bottom;
}
#library-content.library-rtl .topic-heading,
#library-content.library-rtl .topic-desc {
  text-align: right;
}
.ie8 .subscription {
  visibility: hidden;
}
.subscription p {
  margin-top: 6px;
}
.subscription input.email {
  padding: 5px;
  outline: none;
  box-shadow: none;
  width: 97%;
  border: 1px solid #cccccc;
  height: 25px;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 20px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.subscription input.invalid {
  border-color: #FF0000;
  box-shadow: 0 0 10px #CC0000;
}
.subscription .dropdown-menu {
  margin-top: -92px;
  padding: 18px;
  margin-left: -19px;
  /** = padding-left + border **/
  border-color: #94a170;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  border: 1px solid #94a170;
  border-bottom: 1px solid #999;
  -webkit-box-shadow: 0 5px 8px #555555;
  -moz-box-shadow: 0 5px 8px #555555;
  box-shadow: 0 5px 8px #555555;
}
.subscription .subscribe-button {
  display: inline-block;
  font-family: 'Proxima Nova Bold', sans-serif;
  font-size: 14px;
  font-weight: bold;
  line-height: 20px;
  line-height: 30px;
  margin-top: 10px;
  padding: 0;
  text-align: center;
  width: 100%;
}
.subscription .subscribe-button span {
  white-space: nowrap;
}
.subscription .dropdown-table {
  font-size: 12px;
  line-height: 21px;
  color: #555555;
}
.subscription .dropdown-table td {
  padding: 0 7px 0 7px;
}
.subscription .dropdown-table tr.description td {
  padding-left: 10px;
  padding-top: 5px;
}
.subscription .dropdown .unsubscribe-teaser {
  text-align: center;
  position: relative;
  top: 12px;
  color: #898989;
}
.subscription .dropdown .dropdown-title {
  text-align: center;
  padding-bottom: 12px;
}
.subscription .dropdown .dropdown-title h2 {
  margin-bottom: 0;
}
.subscription .dropdown .dropdown-throbber {
  position: absolute;
  right: 20px;
  top: 5px;
}
.simple-input {
  background-color: #fafafa;
  border: 1px solid #C6D1AD;
  font-size: 10px;
  padding: 0;
  height: 24px;
  width: 160px;
  outline: none;
}
.simple-input:focus {
  -webkit-box-shadow: 0 0 5px 1px rgba(115, 152, 44, 0.5);
  -moz-box-shadow: 0 0 5px 1px rgba(115, 152, 44, 0.5);
  box-shadow: 0 0 5px 1px rgba(115, 152, 44, 0.5);
  border-color: rgba(100, 140, 30, 0.5);
}
.ie .simple-input {
  height: 22px;
  padding-top: 5px;
}
.simple-input.placeholder {
  font-style: italic;
}
.simple-input:disabled {
  color: #999;
}
input.placeholder {
  color: #898989;
}
.form-horizontal .help-inline,
.form-horizontal .help-block,
.form-horizontal .success-message {
  font-size: 12px;
}
.form-horizontal .help-inline.error,
.form-horizontal .help-block.error,
.form-horizontal .help-inline .error,
.form-horizontal .help-block .error {
  color: #bf4f04;
}
.form-horizontal .help-inline.success,
.form-horizontal .help-block.success,
.form-horizontal .help-inline .success,
.form-horizontal .help-block .success {
  color: #76a005;
}
.form-horizontal .help-inline.neutral,
.form-horizontal .help-block.neutral,
.form-horizontal .help-inline .neutral,
.form-horizontal .help-block .neutral {
  color: #999999;
}
.form-horizontal .success-message {
  color: #76a005;
}
.form-horizontal input + .success-message {
  font-size: 12px;
  color: green;
  margin-left: 9px;
}
.form-search input,
.form-inline input,
.form-horizontal input,
.form-search textarea,
.form-inline textarea,
.form-horizontal textarea,
.form-search select,
.form-inline select,
.form-horizontal select,
.form-search .help-inline,
.form-inline .help-inline,
.form-horizontal .help-inline,
.form-search .uneditable-input,
.form-inline .uneditable-input,
.form-horizontal .uneditable-input,
.form-search .input-prepend,
.form-inline .input-prepend,
.form-horizontal .input-prepend,
.form-search .input-append,
.form-inline .input-append,
.form-horizontal .input-append {
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */
  *zoom: 1;
  margin-bottom: 0;
}
.form-search .hide,
.form-inline .hide,
.form-horizontal .hide {
  display: none;
}
.form-search label,
.form-inline label {
  display: inline-block;
}
.form-search .input-append,
.form-inline .input-append,
.form-search .input-prepend,
.form-inline .input-prepend {
  margin-bottom: 0;
}
.form-search .radio,
.form-search .checkbox,
.form-inline .radio,
.form-inline .checkbox {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle;
}
.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"],
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
  float: left;
  margin-right: 3px;
  margin-left: 0;
}
.control-group {
  margin-bottom: 10px;
}
legend + .control-group {
  margin-top: 20px;
  -webkit-margin-top-collapse: separate;
}
.form-horizontal .control-group {
  margin-bottom: 20px;
  *zoom: 1;
}
.form-horizontal .control-group:before,
.form-horizontal .control-group:after {
  display: table;
  content: "";
  line-height: 0;
}
.form-horizontal .control-group:after {
  clear: both;
}
.form-horizontal .control-label {
  float: left;
  width: 140px;
  padding-top: 5px;
  text-align: right;
}
.form-horizontal .controls {
  *display: inline-block;
  *padding-left: 20px;
  margin-left: 160px;
  *margin-left: 0;
}
.form-horizontal .controls:first-child {
  *padding-left: 160px;
}
.form-horizontal .help-block {
  margin-top: 10px;
  margin-bottom: 0;
}
.form-horizontal .form-actions {
  padding-left: 160px;
}
.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000000;
}
.modal-backdrop.fade {
  opacity: 0;
}
.modal-backdrop,
.modal-backdrop.fade.in {
  opacity: 0.8;
  filter: alpha(opacity=80);
}
.modal {
  position: fixed;
  top: 10%;
  left: 50%;
  z-index: 1050;
  width: 560px;
  margin-left: -280px;
  background-color: #ffffff;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.3);
  *border: 1px solid #999;
  /* IE6-7 */
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  outline: none;
}
.modal.fade {
  -webkit-transition: opacity .3s linear, top .3s ease-out;
  -moz-transition: opacity .3s linear, top .3s ease-out;
  -o-transition: opacity .3s linear, top .3s ease-out;
  transition: opacity .3s linear, top .3s ease-out;
  top: -25%;
}
.modal.fade.in {
  top: 10%;
}
.modal-header {
  padding: 9px 15px;
  border-bottom: 1px solid #eee;
}
.modal-header .close {
  margin-top: 2px;
}
.modal-header h3 {
  margin: 0;
  line-height: 30px;
}
.modal-body {
  position: relative;
  overflow-y: auto;
  max-height: 400px;
  padding: 15px;
}
.modal-form {
  margin-bottom: 0;
}
.modal-footer {
  padding: 14px 15px 15px;
  margin-bottom: 0;
  text-align: right;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  -webkit-border-radius: 0 0 6px 6px;
  -moz-border-radius: 0 0 6px 6px;
  border-radius: 0 0 6px 6px;
  -webkit-box-shadow: inset 0 1px 0 #ffffff;
  -moz-box-shadow: inset 0 1px 0 #ffffff;
  box-shadow: inset 0 1px 0 #ffffff;
  *zoom: 1;
}
.modal-footer:before,
.modal-footer:after {
  display: table;
  content: "";
  line-height: 0;
}
.modal-footer:after {
  clear: both;
}
.modal-footer .btn + .btn {
  margin-left: 5px;
  margin-bottom: 0;
}
.modal-footer .btn-group .btn + .btn {
  margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
  margin-left: 0;
}
.hide {
  display: none;
}
.modal {
  color: #555555;
  margin: 0;
  padding: 15px;
}
.modal h2,
.modal h4 {
  font-family: 'Proxima Nova', sans-serif;
  color: #555555;
}
.modal .lte7 {
  border: 1px solid #999;
}
.modal-backdrop,
.modal-backdrop.fade.in {
  opacity: 0.7;
  filter: alpha(opacity=70);
}
.modal-header {
  border-bottom: 1px solid #ddd;
  padding: 0 0 9px 0;
}
.modal-header h2,
.modal-header h4 {
  margin-bottom: 0;
  padding-top: 9px;
}
.modal-body {
  margin: 0;
  max-height: none;
  padding: 20px 0 9px 0;
}
.modal-footer {
  background-color: #ffffff;
  padding: 15px 0 0 0;
  text-align: right;
}
/* generic-dialog module */
.modal.generic-dialog {
  margin: 0 0 0 -250px;
  top: 50px;
  width: 500px;
}
.modal.generic-dialog .modal-body {
  padding: 0;
}
.notification-bar {
  background: #4858a4;
  height: 40px;
  text-align: center;
  border-bottom: 1px solid #385181;
  color: #eeeeee;
  overflow: hidden;
  position: fixed;
  z-index: 2000;
  left: 0;
  right: 0;
  top: -40px;
  font-size: 16px;
  /* Override to base-element-styles.css link styling. */
}
.notification-bar.auto-visible {
  top: 0;
}
.notification-bar a:link,
.notification-bar a:visited,
.notification-bar a:link:hover,
.notification-bar a:visited:hover,
.notification-bar a:link:focus,
.notification-bar a:visited:focus {
  text-decoration: underline;
  color: #eeeeee;
}
.notification-bar .notification-bar-right,
.notification-bar .notification-bar-close,
.notification-bar .notification-bar-snooze {
  float: right;
  line-height: 40px;
  position: absolute;
  right: 20px;
}
.notification-bar .notification-bar-content {
  position: relative;
  /* For vertical positioning. */
  line-height: 40px;
}
.notification-bar .simple-button {
  white-space: nowrap;
}
.notification-bar.phantom-notification-bar {
  color: #d3d9cc;
  padding: 0 8px;
}
.notification-bar.phantom-notification-bar.error {
  background: #e5772e;
  border-bottom-color: #513326;
  text-align: center;
}
.notification-bar.phantom-notification-bar.error .notification-bar-content {
  color: #faebe1;
  text-shadow: 0 -1px 0 #743002;
}
.notification-bar.phantom-notification-bar .email-address {
  color: #eeeeee;
}
.notification-bar.phantom-notification-bar a.resend-link,
.notification-bar.phantom-notification-bar a.change-link {
  color: #d3d9cc;
  line-height: 40px;
  margin-left: 8px;
}
.notification-bar.phantom-notification-bar a.resend-link.no-link,
.notification-bar.phantom-notification-bar a.change-link.no-link {
  text-decoration: none;
  cursor: text;
}
.notification-bar.phantom-notification-bar a.resend-link:not(.no-link):link:hover,
.notification-bar.phantom-notification-bar a.change-link:not(.no-link):link:hover {
  color: #eeeeee;
}
.notification-bar.phantom-notification-bar .simple-button {
  margin: 0 5px 0 7px;
  /* Adjust to work with envelope icon */
  padding: 5px 5px 5px 10px;
}
/* TODO(cbhl): (i18n) These elements overlap on too-narrow screens; hide them
   when they don't fit. Re-measure these when strings have been i18n-ed. */
@media screen and (max-width: 1200px) {
  .demo-notification-bar {
    position: absolute;
    /* (not fixed) */
  }
}
@media screen and (max-width: 1000px) {
  .demo-notification-bar .notification-bar-close {
    display: none;
  }
}
@media screen and (max-width: 750px) {
  .demo-notification-bar .notification-bar-content .last-ditch-report {
    text-decoration: underline;
    cursor: pointer;
  }
  .demo-notification-bar .notification-bar-content .simple-button {
    display: none;
  }
}
.notification-bar-spacer {
  height: 0;
}
.notification-bar-spacer.auto-visible {
  height: 40px;
}
/* TODO(benkomalo): these change-signup-email-dialog styles aren't strictly
   notification-bar related, but that dialog is triggered and only accessible
   via a notification bar, so there's no better place right now. */
.change-signup-email-dialog.modal {
  width: 300px;
  margin-left: -150px;
}
.change-signup-email-dialog.modal.fade.in {
  top: 200px;
}
.change-signup-email-dialog .field-row {
  margin-top: 8px;
}
.change-signup-email-dialog label {
  display: inline-block;
  font-size: 14px;
  margin-right: 6px;
  width: 48px;
  text-align: right;
}
.change-signup-email-dialog .simple-input {
  display: inline-block;
  font-size: 14px;
  padding: 0 4px;
  width: 231px;
}
.change-signup-email-dialog .simple-button {
  font-size: 14px;
}
.change-signup-email-dialog .error {
  color: red;
}
.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1010;
  display: none;
  max-width: 276px;
  padding: 1px;
  text-align: left;
  background-color: #ffffff;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  white-space: normal;
}
.popover.top {
  margin-top: -10px;
}
.popover.right {
  margin-left: 10px;
}
.popover.bottom {
  margin-top: 10px;
}
.popover.left {
  margin-left: -10px;
}
.popover-title {
  margin: 0;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}
.popover-title:empty {
  display: none;
}
.popover-content {
  padding: 9px 14px;
}
.popover .arrow,
.popover .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.popover .arrow {
  border-width: 11px;
}
.popover .arrow:after {
  border-width: 10px;
  content: "";
}
.popover.top .arrow {
  left: 50%;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: #999;
  border-top-color: rgba(0, 0, 0, 0.25);
  bottom: -11px;
}
.popover.top .arrow:after {
  bottom: 1px;
  margin-left: -10px;
  border-bottom-width: 0;
  border-top-color: #ffffff;
}
.popover.right .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-left-width: 0;
  border-right-color: #999;
  border-right-color: rgba(0, 0, 0, 0.25);
}
.popover.right .arrow:after {
  left: 1px;
  bottom: -10px;
  border-left-width: 0;
  border-right-color: #ffffff;
}
.popover.bottom .arrow {
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999;
  border-bottom-color: rgba(0, 0, 0, 0.25);
  top: -11px;
}
.popover.bottom .arrow:after {
  top: 1px;
  margin-left: -10px;
  border-top-width: 0;
  border-bottom-color: #ffffff;
}
.popover.left .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999;
  border-left-color: rgba(0, 0, 0, 0.25);
}
.popover.left .arrow:after {
  right: 1px;
  border-right-width: 0;
  border-left-color: #ffffff;
  bottom: -10px;
}
.popover-title {
  display: none;
}
ul.inline-list,
ul.inline-list li {
  clear: none;
  display: block;
  float: left;
}
.goal {
  clear: both;
  position: relative;
}
.create-goal-page .goal.with-border {
  border: 1px solid #ccc;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}
.goal .objective-list {
  width: 100%;
  padding-left: 7px;
}
.goal li.objective {
  width: 50%;
}
.goal a.objective {
  position: relative;
  background-image: none;
  box-shadow: none;
  line-height: 23px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}
.goal .objective-description {
  display: block;
  overflow: hidden;
  padding: 0 5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#goals-nav-container .goal a.objective {
  line-height: 23px;
}
.goal a.objective {
  padding-left: 22px;
}
.goal a.objective:before {
  display: block;
  content: " ";
  width: 30px;
  height: 30px;
  position: absolute;
  left: -12px;
  top: -6px;
  border-radius: 18px;
  border: 2px solid white;
}
.goal a.objective.exercise:before,
.goal a.objective.GoalObjectiveExerciseProficiency:before,
.goal a.objective.GoalObjectiveAnyExerciseProficiency:before {
  background: #3a4759 url(http://www.khanacademy.org/images/generic-exercise-icon-inset-small.png) no-repeat 4px 4px;
}
.goal a.objective.video:before,
.goal a.objective.GoalObjectiveWatchVideo:before,
.goal a.objective.GoalObjectiveAnyVideo:before {
  background: #3a4759 url(http://www.khanacademy.org/images/video-camera-icon-inset-small.png) no-repeat 50% 50%;
}
.ie .goal a.objective:before {
  border: none;
  left: -2px;
  top: -4px;
  background-color: transparent;
}
.goal a.objective.exercise-color.not-started:before {
  background-color: #CCC;
}
.goal a.objective.exercise-color.started:before {
  background-color: #C7E5F7;
}
.goal a.objective.exercise-color.proficient:before {
  background-color: #0080C9;
}
.goal a.objective.exercise-color.struggling:before {
  background-color: #C30202;
}
.goal a.objective:hover:before {
  border-color: #89B908;
}
.goal a.objective:hover {
  border-color: #89B908 !important;
}
.goal a.objective.video .objective-progress-meter,
.goal a.objective.GoalObjectiveWatchVideo .objective-progress-meter,
.goal a.objective.GoalObjectiveAnyVideo .objective-progress-meter {
  display: block;
  content: " ";
  width: 20px;
  height: 20px;
  background: transparent url(http://www.khanacademy.org/images/video-camera-icon-full-small.png) no-repeat 0 1px;
  position: absolute;
  left: -5px;
  top: 0;
}
.ie .goal a.objective.video .objective-progress-meter,
.ie .goal a.objective.GoalObjectiveWatchVideo .objective-progress-meter,
.ie .goal a.objective.GoalObjectiveAnyVideo .objective-progress-meter {
  left: 3px;
}
.goal a.objective.exercise .objective-progress-meter,
.goal a.objective.GoalObjectiveExerciseProficiency .objective-progress-meter,
.goal a.objective.GoalObjectiveAnyExerciseProficiency .objective-progress-meter {
  display: block;
  content: " ";
  width: 20px;
  height: 20px;
  background: transparent url(http://www.khanacademy.org/images/generic-exercise-icon-full-small.png) no-repeat 0 0;
  position: absolute;
  left: -6px;
  top: 0;
}
.ie .goal a.objective.exercise .objective-progress-meter,
.ie .goal a.objective.GoalObjectiveExerciseProficiency .objective-progress-meter,
.ie .goal a.objective.GoalObjectiveAnyExerciseProficiency .objective-progress-meter {
  left: 2px;
}
/* Hide the objective progress meter for exercises, because it doesn't play
 * nicely w/ athena progress. Not worth the effort to fix, because athena will
 * be replacing goals in the near future.
 * TODO(kamens): goals: remove this (heh, along w/ the rest of this file) when
 * goals go away.
 */
.goal a.objective.exercise .objective-progress-meter,
.goal a.objective.GoalObjectiveExerciseProficiency .objective-progress-meter,
.goal a.objective.GoalObjectiveAnyExerciseProficiency .objective-progress-meter {
  display: none;
}
.goals-class .goal.complete a.objective.exercise-color.proficient:before {
  background-color: #3A4759;
}
.goals-class .goal.complete a.objective.exercise-color.proficient {
  background-color: #3A4759;
  color: #fff !important;
  border-color: #2c3747;
  border-bottom-color: #13181f;
  text-shadow: 0 -1px 0 #13181f;
}
/* override goal styles for student view */
.goals-personal .goal a.objective.exercise-color.not-started:before,
.goals-personal .goal a.objective.exercise-color.started:before {
  background-color: #3A4759;
}
.goals-personal .exercise-color.not-started,
.goals-personal .exercise-color.started {
  background-color: #3A4759;
  color: #fff !important;
  border-color: #2c3747;
  border-bottom-color: #13181f;
  text-shadow: 0 -1px 0 #13181f;
}
.goals-personal .exercise-color.not-started:hover,
.goals-personal .exercise-color.started:hover {
  background-color: #3A4759;
  color: #fff !important;
}
.goals-personal .goal a.objective.exercise-color.proficient:before {
  background-color: #C7E5F7;
}
.goals-personal .exercise-color.proficient {
  background-color: #C7E5F7;
  color: #444 !important;
}
.goals-personal .exercise-color.proficient:hover {
  background-color: #C7E5F7;
  color: #444 !important;
}
.goals-personal .goal a.objective.exercise-color.proficient:before {
  content: " ";
  width: 30px;
  height: 30px;
  background: #c7e5f7 url(http://www.khanacademy.org/images/objective-complete-tick.png) no-repeat 50% 50%;
  position: absolute;
  left: -12px;
  top: -5px;
  border-radius: 18px;
  border: 1px solid #CCC;
}
.ie .goals-personal .goal a.objective.proficient:before {
  border: none;
  left: -2px;
  top: -4px;
  background-color: transparent;
}
.goals-personal .goal a.objective.proficient {
  text-decoration: line-through !important;
  opacity: .7;
  filter: alpha(opacity=75);
}
/* end style overrides */
/* override for create goal page delete hover */
#create-goal-view .goal a.objective.exercise:hover:before,
#create-goal-view .goal a.objective.video:hover:before {
  background: #3a4759 url(http://www.khanacademy.org/images/delete-icon-inset-small.png) no-repeat 50% 50%;
}
#create-goal-view .goal a.objective:hover:before {
  border-color: #C30202;
}
#create-goal-view .goal a.objective:hover {
  border-color: #C30202 !important;
}
/* end create goal page overrides */
#goals-nav-container .goals-area {
  max-height: 500px;
  overflow-x: visible;
  overflow-y: auto;
  padding: 0 10px 0 8px;
  margin: 0 -10px 0 -8px;
}
.progress-bar {
  position: relative;
  border: 1px solid #000;
  padding: 2px;
}
.bar {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0%;
  background: #c7e5f7;
  z-index: -1;
}
.student-goals-filter {
  display: block;
}
.student-goals {
  width: 95%;
  margin: 0 auto;
}
#profile-goals-content .student-goals {
  width: auto;
  margin: auto;
}
#goals-nav-container {
  position: fixed;
  top: 0;
  width: 800px;
  z-index: 200;
  background: #fff;
  border: 1px solid #aaa;
  border-top: none;
  padding: 10px 25px 20px 20px;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
}
#goals-nav-container .close-button {
  cursor: pointer;
  position: absolute;
  right: 20px;
  bottom: 17px;
  display: block;
}
#class-student-goal .student-name {
  display: inline-block;
  width: 180px;
  font-size: 10pt;
}
#class-student-goal .goal-start-time {
  font-size: 8pt;
}
#class-student-goal .goal-update-time {
  font-size: 8pt;
}
#class-student-goal .goal {
  display: inline-block;
  width: 650px;
  vertical-align: top;
}
#class-student-goal div {
  clear: both;
}
#create-goal-view {
  margin-top: 3px;
}
.goal-title {
  font-size: 14px;
  font-weight: bold;
}
input.goal-title {
  padding: 5px 5px 5px 0;
  height: auto;
  min-width: 250px;
  color: #333;
  background-color: transparent;
  border-color: transparent;
  margin-bottom: 5px;
  /* to match span.goal-title element */
}
input.goal-title::-webkit-input-placeholder {
  color: #333;
}
input.goal-title:-moz-placeholder {
  color: #333;
}
input.goal-title:focus {
  background-color: #FAFAFA;
  border-color: #C6D1AD;
  padding-left: 5px;
}
.goal .goal-description {
  line-height: 35px;
  margin: 0;
}
.goal-description {
  font-size: 14px;
}
.goal-description.pulls {
  margin: 9px 0;
}
.create-goal-page .goal .goal-description {
  text-align: center;
}
#goals-nav-container .goal-description.pulls {
  margin: 0;
  text-align: left;
  line-height: 25px;
}
#goals-nav-container .goal.pulled {
  margin: 0 0 10px 0;
  border: none;
}
.goal-description ul,
.goal-description ul li {
  display: inline;
}
.goal-controls {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
}
.create-goal-page #goal-choose-exercises .dashboard-nav {
  display: none;
}
.create-goal-page #goal-choose-videos .dashboard-header {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.create-goal-page #goal-choose-videos .dashboard-nav {
  top: 2px;
}
.create-goal-page #goal-choose-videos .dashboard-content-stretch {
  overflow-y: auto;
  padding-left: 20px;
  clear: both;
}
.create-goal-page #goal-choose-videos nav {
  clear: none;
  display: inline;
}
.objective-type-picker {
  position: absolute;
  z-index: 100;
  top: -1px;
}
.objective-type-picker .simple-button {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}
.objective-type-picker .simple-button,
.objective.simple-button {
  padding: 0;
  display: block;
}
.objective-type-picker .simple-button {
  line-height: 33px;
  width: 174px;
  float: left;
  text-align: center;
}
.create-goal-page .dashboard {
  margin-top: 18px;
}
.create-goal-page .dashboard .css-menu > ul > li,
.create-goal-page .dashboard #topic-jump > span {
  font-weight: normal;
}
#goalbook-controls {
  margin-top: 20px;
  padding-bottom: 10px;
}
.goal-description .summary-light {
  color: #888;
  display: inline-block;
  float: right;
}
#class-student-goals .objective.matches-filter,
#class-student-goals .objective.matches-filter:before {
  font-weight: bold;
  z-index: 10;
  -moz-box-shadow: inset 0 0 0 1px #555, 0 0 4px 2px orange;
  -webkit-box-shadow: inset 0 0 0 1px #555, 0 0 4px 2px orange;
  box-shadow: inset 0 0 0 1px #555, 0 0 4px 2px orange;
}
.lte8 #class-student-goals .objective.matches-filter,
.lte8 #class-student-goals .objective.matches-filter:before {
  outline: 2px solid orange;
}
.recently-completed {
  position: relative;
}
.recently-completed .goal-description strong {
  display: inline-block;
  text-decoration: line-through;
  opacity: .7;
  filter: alpha(opacity=75);
}
.recently-completed .goal-description .summary-light {
  color: #111;
  font-weight: bold;
}
a.simple-button.seethrough.goal-history {
  background-color: #ddd;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}
/* here to remind us this needs to be prettied up */
.goal-response-text {
  color: white;
  float: right;
  background-color: #C00;
  padding: 5px 10px;
  font-weight: bold;
}
.goalNodeInvalid {
  text-decoration: line-through;
  cursor: not-allowed;
}
.goalNodeInvalid div {
  color: #777;
}
.goalVideoInvalid span {
  text-decoration: line-through;
  color: #99a;
}
.goal-tooltip-status {
  font-style: italic;
}
.goal-tooltip-struggling {
  color: #c00;
  font-weight: bold;
}
/* The New Goal ui */
.goalpicker {
  height: auto;
  min-height: 90%;
}
.goalpicker .newgoal {
  cursor: pointer;
  width: 96%;
  padding: 4em 3% 2em 1%;
  float: left;
  clear: none;
  position: relative;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.goalpicker .newgoal.disabled {
  opacity: 0.2;
  cursor: default;
}
.goalpicker .newgoal.small {
  width: 50%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.goalpicker h3,
.goalpicker h4 {
  font-size: 30px;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: normal;
  line-height: 68px;
  color: #777;
  margin: 0;
  letter-spacing: 4px;
}
.goalpicker h3 {
  margin-bottom: 12px;
  border-bottom: 1px solid #666;
}
.goalpicker h4 {
  text-transform: uppercase;
  font-family: 'Proxima Nova Bold', sans-serif;
  font-weight: bold;
  font-size: 24px;
  letter-spacing: 6px;
  line-height: 38px;
}
.goalpicker a {
  color: #777;
  text-decoration: none;
}
.goalpicker .newgoal.disabled a {
  cursor: default !important;
  color: #777 !important;
}
/* disable hover effects for title and objectives */
.goalpicker a:hover {
  text-decoration: none;
}
.goalpicker .goal a.objective:hover:before {
  border-color: #fff;
}
.goalpicker .goal a.objective:hover {
  border-color: #3A4759 ! important;
}
.goalpicker .newgoal:hover {
  z-index: 10;
  -webkit-box-shadow: 0 0 6px 1px #678D00;
  -moz-box-shadow: 0 0 6px 1px #678D00;
  box-shadow: 0 0 6px 1px #678D00;
}
.goalpicker .newgoal.disabled:hover {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.goalpicker .newgoal .info p {
  margin: 0 0 22px;
}
.goalpicker .newgoal:hover a,
.goalpicker .info button {
  color: #678D00;
}
.goalpicker .info button {
  text-transform: capitalize;
  text-align: center;
  line-height: 16px;
  width: 70%;
  margin: 1em auto 2em;
  margin-left: 15%;
}
.goalpicker .info,
.goalpicker .info:hover {
  display: none;
  cursor: default;
  position: absolute;
  left: -225px;
  top: 20px;
  width: 175px;
  height: auto;
  padding: 22px 15px 0;
  background-color: #eee;
  border: 1px solid #909090;
  -webkit-box-shadow: 0px 0 10px 5px #ccc;
  -webkit-border-radius: 5px;
  -moz-box-shadow: 0px 0 10px 5px #ccc;
  -moz-border-radius: 5px;
}
.goalpicker .info.pos-right {
  left: auto;
  right: -225px;
}
.goalpicker .info.pos-right:after {
  left: -20px;
  border-color: transparent #eee transparent transparent;
}
.goalpicker .info.pos-top {
  left: auto;
  right: 25px;
  top: -40px;
}
.goalpicker .info.pos-top:after {
  left: -20px;
  border-color: transparent #eee transparent transparent;
}
.modal.goal-new {
  margin-left: -350px;
  top: 90px;
  width: 700px;
  overflow: visible;
}
.modal.goal-new .modal-body {
  overflow: visible;
}
.student-module-status.notmatching,
.student-module-status.light.notmatching,
.student-module-status.notmatching:hover {
  background-color: #aaa;
}
.modal .goalpicker h3 {
  font-size: 24px;
  line-height: 36px;
}
.modal .goalpicker h4 {
  font-size: 18px;
}
.modal .goalpicker .newgoal {
  padding: 1em 1em 2em 0.5em;
  width: auto;
}
.modal .goalpicker .newgoal.small {
  width: 50%;
}
.modal.goal-new-custom {
  margin: 0;
  overflow-y: hidden;
  position: fixed;
  top: 85px;
  right: 50px;
  bottom: 50px;
  left: 50px;
  height: auto;
  width: auto;
}
.modal.goal-new-custom.fade.in {
  top: 85px;
}
.modal.goal-new-custom .modal-body {
  padding-top: 0;
  max-height: none;
}
.modal.goal-new-custom .progress-bar-wrapper {
  position: absolute;
  top: 10%;
  left: 50%;
}
.modal.goal-new-custom .progress-bar {
  width: 400px;
  height: 22px;
  text-align: center;
  position: relative;
  top: 20px;
  margin-left: -200px;
  z-index: 1;
}
.modal.goal-new-custom .progress-bar .ui-progressbar-value {
  background-image: url(http://www.khanacademy.org/'/images/progress-animated.gif');
}
#create-goal .section-headline {
  padding-top: 0;
}
.modal.goal-new-custom #goal-submit-button,
.modal.goal-new-custom .goals-close-button {
  font-size: 16px;
  float: right;
  padding: 4px 10px;
  margin-left: 10px;
}
.video-goal-icon {
  display: table-cell;
}
.fieldError {
  border: 1px solid #c00;
  background: #fee;
}
#profile-goals-content .alert,
.goals-area .alert {
  margin-top: 10px;
  margin-right: 20px;
}
#profile-goals-content .alert .top-note,
.goals-area .alert .top-note {
  margin-top: 0;
}
#profile-goals-content .alert .bottom-note,
.goals-area .alert .bottom-note {
  margin-bottom: 0;
}
/**
 * Styles for the header and footer that appear on every page
 */
header,
footer {
  display: block;
  width: 100%;
  font-family: 'Proxima Nova', sans-serif;
}
/**
 * Header, including nav links to the left and search + user info on the right
 */
#top-header-container {
  background: #2c3747;
  -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
  position: relative;
  z-index: 1051;
  /* Primary navigation links (left side of header)
     ************************************************/
  /**
     * Right side of the header, ie search bar, user notifications and dropdown
     *****************************************************/
  /* Search box styles
     ************************************/
  /* Logo Styles
     ************************************/
}
#top-header-container a {
  text-decoration: none;
}
#top-header-container #top-header {
  color: #ffffff;
  height: 45px;
  min-width: 1000px;
  max-width: 1200px;
  position: relative;
  margin: 0 auto;
}
#top-header-container #top-header .dropdown.open .dropdown-toggle {
  background: #ffffff;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-color: #fdfdfd;
  color: #89b908;
}
#top-header-container #top-header .dropdown {
  display: inline-block;
}
#top-header-container .icon-chevron-down {
  margin-left: 4px;
  position: relative;
  top: -2px;
  line-height: 100%;
}
#top-header-container .sitewide-navigation {
  display: inline;
  line-height: 45px;
  margin: 0;
  padding: 0;
  position: relative;
}
#top-header-container .sitewide-navigation .nav-subheader span > a {
  display: block;
  float: left;
  font-size: 16px;
  letter-spacing: -1px;
  text-transform: uppercase;
}
#top-header-container .sitewide-navigation .nav-subheader span > a,
#top-header-container .sitewide-navigation .nav-subheader span > a:visited,
#top-header-container .sitewide-navigation .nav-subheader span > a:link:focus,
#top-header-container .sitewide-navigation .nav-subheader span > a:visited:focus {
  color: #ffffff;
  padding: 0 15px;
  margin-left: 0;
  font-family: 'Proxima Nova', sans-serif;
}
#top-header-container .sitewide-navigation .nav-subheader span > a.watch-link:hover,
#top-header-container .sitewide-navigation .nav-subheader span > a.watch-link:active,
#top-header-container .sitewide-navigation .nav-subheader span > a.watch-link:focus {
  background: #3a485d;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-color: #3a485d;
  color: #ffffff;
}
#top-header-container .sitewide-navigation .nav-subheader span > a.no-menu.selected,
#top-header-container .sitewide-navigation .nav-subheader span > a.no-menu:hover {
  background: #3a485d;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-color: #3a485d;
  color: #ffffff;
  position: relative;
}
#top-header-container .sitewide-navigation .nav-subheader span a.watch-link {
  margin-top: -1px;
  margin-right: 0;
}
#top-header-container .sitewide-navigation .nav-subheader span a.watch-link .icon-chevron-down {
  font-size: 12px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu {
  -webkit-box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
  box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
  position: relative;
  margin-left: 0;
  font-family: 'Proxima Nova', sans-serif;
  /**
             * This causes position: absolute div.sub-menu-custom to orient
             * itself relative to ul.dropdown-menu and thus top aligned.
             */
}
body.lang-use-rtl #top-header-container .sitewide-navigation ul.topic-browser-menu .icon-chevron-right {
  display: none;
}
body.lang-use-rtl #top-header-container .sitewide-navigation ul.topic-browser-menu .icon-chevron-left {
  display: block;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu a {
  white-space: normal;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu .dropdown-menu {
  border-color: #999999;
  /* override. */
}
#top-header-container .sitewide-navigation ul.topic-browser-menu .goals-menu {
  width: 800px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu > li {
  position: static;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > a {
  font-size: 14px;
  line-height: 28px;
  width: 160px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu .icon-chevron-right,
#top-header-container .sitewide-navigation ul.topic-browser-menu .icon-chevron-left {
  font-size: 10px;
  line-height: 28px;
  position: absolute;
  right: 3px;
  top: 0;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu .icon-chevron-right.icon-chevron-left,
#top-header-container .sitewide-navigation ul.topic-browser-menu .icon-chevron-left.icon-chevron-left {
  display: none;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li:hover > .icon-chevron-right {
  color: #ffffff;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu > li.hover-active,
#top-header-container .sitewide-navigation ul.topic-browser-menu > li.hover-active:hover {
  background-color: #2c3747;
  border-color: transparent;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu > li.hover-active > a,
#top-header-container .sitewide-navigation ul.topic-browser-menu > li.hover-active:hover > a {
  border-color: #2c3747;
  color: #ffffff;
  text-shadow: none;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu > li:hover {
  background-color: #5d7496;
  border-color: transparent;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu > li:hover > a {
  border-color: #5d7496;
  color: #ffffff;
  text-shadow: none;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom {
  /**
                 * .dropdown-menu's have a box shadow, which we move to the
                 * right for a sub menu.
                 */
  border-width: 0;
  -webkit-box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.5);
  box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.5);
  min-height: 100%;
  padding: 1px 10px;
  position: absolute;
  top: -1px;
  right: auto;
  bottom: auto;
  left: 176px;
  width: 520px;
  /* Welcome to goals country! */
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-title,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-title,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .submenu-title,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .submenu-title {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 24px;
  border-bottom: 1px solid #ffffff;
  padding: 17px 0 7px 8px;
  /* Override the default link behavior for "Computer
                    Science" in the sub menu, which is our only submenu title
                    that is also a link. TODO(marcia): What extra styles might
                    we need to make it look more like a link so people know to
                    click there? */
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-title .km-link,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-title .km-link,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .submenu-title .km-link,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .submenu-title .km-link {
  color: #ffffff;
  float: right;
  font-size: 14px;
  padding: 0 5px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-title .km-link:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-title .km-link:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .submenu-title .km-link:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .submenu-title .km-link:hover {
  background: #46a8bf;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-title > a,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-title > a,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .submenu-title > a,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .submenu-title > a {
  color: #ffffff;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .submenu-title,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .submenu-title {
  color: #ffffff;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-title,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-title {
  border-color: #999999;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-menu-contents,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-menu-contents {
  padding: 0 8px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul ul,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom ul {
  padding: 14px 0;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 {
  clear: none;
  float: left;
  width: 48.93%;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1:nth-child(2n+1),
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1:nth-child(2n+1) {
  clear: both;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a:link,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a:link,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a:visited,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a:visited,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a:focus,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a:focus,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a:active,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a:active {
  color: #ffffff;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  width: auto;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1 > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1 > a:hover {
  background: #a8bb6a;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1.math > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1.math > a:hover {
  background: #46a8bf;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1.science > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1.science > a:hover {
  background: #994858;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1.cs > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1.cs > a:hover {
  background: #6baa4f;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1.humanities > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1.humanities > a:hover {
  background: #e65a4c;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1.test-prep > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1.test-prep > a:hover {
  background: #9859a1;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul li.level1.partner-content > a:hover,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom li.level1.partner-content > a:hover {
  background: #55c1a7;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-area .goal-title,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-area .goal-title {
  font-size: 18px;
  font-weight: normal;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-area .objective-list,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-area .objective-list {
  width: 90%;
  padding: 10px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-area a.objective,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-area a.objective {
  line-height: 20px;
  width: 100%;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul .goals-area .objective-description,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom .goals-area .objective-description {
  font-size: 11px;
}
#top-header-container .sitewide-navigation ul.topic-browser-menu li > ul #goalbook-controls > .close,
#top-header-container .sitewide-navigation ul.topic-browser-menu li > .sub-menu-custom #goalbook-controls > .close {
  display: none;
}
#top-header-container #page_auth {
  display: block;
  line-height: 45px;
  margin: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: auto;
  left: auto;
  z-index: 102;
}
#top-header-container #page_auth #login-menu {
  margin-top: 9px;
}
#top-header-container #user-info {
  display: block;
  float: right;
  font-family: 'Proxima Nova', sans-serif;
  text-transform: uppercase;
}
#top-header-container #user-info .dropdown {
  height: 45px;
  padding: 9px 0 5px 0;
  position: relative;
  vertical-align: top;
}
#top-header-container #user-info .dropdown.open > span.username_and_notification > .nav-link {
  color: #ffffff;
}
#top-header-container #user-info .dropdown .user-avatar {
  float: left;
  height: 24px;
  padding: 0 4px 0 0;
  position: relative;
  top: 10px;
  vertical-align: middle;
  width: 24px;
}
#top-header-container #user-info .dropdown .user-notification {
  height: 45px;
}
#top-header-container #user-info .dropdown .user-notification .icon-notification {
  color: #ccc;
  position: relative;
  top: -4px;
}
#top-header-container #user-info .dropdown .user-notification .icon-notification.brand-new {
  color: #9db63b;
}
#top-header-container #user-info .dropdown.open .icon {
  background-position: 0 0;
}
#top-header-container #user-info .dropdown .username_and_notification {
  border: none;
  display: inline-block;
  height: 45px;
  padding: 0 5px;
  position: relative;
  top: 0;
  vertical-align: baseline;
}
#top-header-container #user-info .dropdown .username_and_notification .user-name {
  display: inline-block;
  float: left;
  margin-right: 2px;
  max-width: 205px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: baseline;
  white-space: nowrap;
}
#top-header-container #user-info .dropdown .user-notifications-toggle {
  border: none;
  display: inline-block;
  height: 45px;
  padding: 0 10px;
  vertical-align: baseline;
}
#top-header-container #user-info .dropdown .user-notifications-toggle .icon-chevron-down {
  display: inline;
}
#top-header-container #user-info .dropdown .user-notifications-toggle .caret {
  display: none;
}
#top-header-container #user-info .dropdown:hover {
  background: #3a485d;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-color: #3a485d;
  color: #ffffff;
}
#top-header-container #user-info .dropdown:hover > span.user-notifications-toggle > .nav-link,
#top-header-container #user-info .dropdown:hover > span.username_and_notification > .nav-link {
  background: #3a485d;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-color: #3a485d;
  color: #ffffff;
}
#top-header-container #user-info .dropdown.open > span.user-notifications-toggle > .nav-link,
#top-header-container #user-info .dropdown.open > span.username_and_notification > .nav-link {
  background: #ffffff;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-color: #fdfdfd;
  color: #89b908;
}
#top-header-container #user-info .dropdown .dropdown-menu {
  /**
                 * Use box-sizing: border-box so the width of the menu includes
                 * the outline border of the dropdown-toggle
                 */
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  right: 0;
  min-width: 120px;
  width: auto;
  text-transform: none;
}
#top-header-container #user-info .dropdown .dropdown-menu .loading {
  width: 400px;
}
#top-header-container #user-info .icon-chevron-down {
  font-size: 10px;
}
#top-header-container #user-info .hover-card-content-container {
  /**
             * Override the default blue/green link color for name and points.
             */
  color: #444444;
}
#top-header-container #user-info .hover-card-content-container .profile-link {
  color: #444444;
}
#top-header-container #user-info .hover-card-content-container:hover {
  background: #2c3747;
  color: #ffffff;
}
#top-header-container #user-info .hover-card-content-container:hover .hover-card-content .profile-link,
#top-header-container #user-info .hover-card-content-container:hover .hover-card-content .join-date,
#top-header-container #user-info .hover-card-content-container:hover .hover-card-content .points-label {
  color: #ffffff;
}
#top-header-container #user-info .dropdown {
  display: inline-block;
  padding: 0;
}
#top-header-container #user-info .dropdown .nav-link {
  display: inline-block;
  line-height: 45px;
  color: #ffffff;
}
#top-header-container #user-info .dropdown.open .dropdown-toggle {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
#top-header-container #user-info .sign-up-link,
#top-header-container #user-info .log-in-link {
  display: inline-block;
  color: #ffffff;
  height: 45px;
  max-width: 180px;
  min-width: 60px;
  padding: 0 10px;
  text-align: center;
  vertical-align: top;
}
#top-header-container #user-info .sign-up-link:hover,
#top-header-container #user-info .log-in-link:hover,
#top-header-container #user-info .sign-up-link.highlight:hover,
#top-header-container #user-info .log-in-link.highlight:hover {
  background: #ffffff;
  color: #2c3747;
}
#top-header-container #user-info .sign-up-link,
#top-header-container #user-info .log-in-link.highlight {
  background: #89b908;
}
#top-header-container #user-info .user-dropdown-controls {
  background: #eee;
  border-top: 1px solid #ccc;
  padding: 5px 10px 5px 10px;
}
#top-header-container #user-info .user-dropdown-controls .left-control {
  float: left;
}
#top-header-container #user-info .user-dropdown-controls .right-control {
  float: right;
}
#top-header-container #user-info #user-notifications {
  /* These are the bare minimum styles needed to display the notification
             * dropdown's "loading" status. The rest of notifications' styles for
             * the dropdown's content are loaded dynamically via notifications.css.
             */
}
#top-header-container #user-info #user-notifications .user-notification .notification-bubble {
  position: absolute;
  right: -4px;
  top: -6px;
  padding: 0 2px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  background-color: #76a005;
  color: #FFF;
  line-height: 13px;
  font-size: 10px;
  font-weight: bold;
  font-family: 'Proxima Nova', sans-serif;
}
#top-header-container #user-info #user-notifications .dropdown-menu {
  padding: 0;
  right: 0;
  left: auto;
  width: auto;
  text-transform: none;
}
#top-header-container #user-info #user-notifications .dropdown-menu.inner-dropdown-menu {
  display: block;
  position: static;
  max-height: 310px;
  overflow: auto;
  overflow-x: hidden;
  border: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-overflow-scrolling: touch;
}
#top-header-container #user-info #user-notifications .dropdown-menu li {
  width: 400px;
}
#top-header-container #user-info #user-notifications .dropdown-menu li.notifications-heading {
  background: #eee;
  border-bottom: 1px solid #ccc;
  font-size: 14px;
  text-align: center;
}
#top-header-container #user-info #user-notifications .dropdown-menu li.loading {
  background: white;
  text-align: center;
}
#top-header-container #user-info #user-notifications .dropdown-menu li.loading img {
  vertical-align: middle;
  width: 16px;
  height: 16px;
}
#top-header-container #user-info #user-notifications .dropdown-menu li.empty {
  background: white;
  text-align: center;
  height: 150px;
}
#top-header-container #user-info #user-notifications .dropdown-menu li.empty div {
  margin-top: 59px;
}
#top-header-container #user-info #user-notifications .dropdown-menu.unloaded .loading {
  height: 150px;
}
#top-header-container #user-info #user-notifications .dropdown-menu.unloaded .loading img {
  margin-top: 65px;
}
#top-header-container #search-box {
  display: block;
  float: left;
  margin-right: 2px;
  position: static;
  top: -2px;
}
#top-header-container #search-box input[type=text] {
  width: 160px;
  margin-top: 8px;
  font-style: normal;
  /* Round out search bar by making border radius half height */
  height: 26px;
  -webkit-border-radius: 13px;
  -moz-border-radius: 13px;
  border-radius: 13px;
}
@media only screen and (max-width: 1024px) {
  #top-header-container #search-box input[type=text] {
    width: 130px;
  }
}
#top-header-container #search-box .icon-search {
  font-size: 16px;
  top: -1px;
}
#top-header-container #search-box .typeahead-search .dropdown-menu {
  margin-left: -92px;
}
#top-header-container #search-box .typeahead-search .dropdown-menu:before {
  content: " ";
  position: absolute;
  z-index: 100;
  width: 0;
  height: 15px;
  border-left: 8px solid rgba(0, 0, 0, 0);
  border-right: 8px solid rgba(0, 0, 0, 0);
  border-bottom: 9px solid #ffffff;
  left: 100px;
  top: -24px;
  display: block;
}
#top-header-container #header-logo {
  background-image: url(http://www.khanacademy.org/"/images/ka-simplified-logo-white.png");
  /*! data-uri */
  background-repeat: no-repeat;
  height: 27px;
  margin-left: -110px;
  position: absolute;
  top: 9px;
  right: auto;
  bottom: auto;
  left: 50%;
  width: 200px;
}
/**
 * Page specific sub navigation styles (navigation links just below header)
 * Used for Computer Science scratchpads, Coach, and About
 ************************************************************************/
#page_sub_nav {
  background: #ffffff;
  border-bottom: 1px solid #cccccc;
  color: #444444;
  min-height: 16px;
  padding: 0;
  position: relative;
  width: auto;
}
#page_sub_nav .breadcrumbs_nav {
  font-weight: normal;
  font-size: 14px;
  line-height: 36px;
  width: auto;
  float: none;
  /* .breadcrumb-separator's are the >> for scratchpads */
}
#page_sub_nav .breadcrumbs_nav a,
#page_sub_nav .breadcrumbs_nav .breadcrumb-separator {
  color: #222;
  display: block;
  float: left;
  margin-left: 0;
  padding: 0 10px;
  border-bottom: 1px solid #ffffff;
  text-decoration: none;
}
#page_sub_nav .breadcrumbs_nav a.selected {
  border-bottom: 1px solid #444444;
  font-family: 'Proxima Nova Bold', sans-serif;
  position: static;
}
#page_sub_nav .breadcrumbs_nav a:hover {
  text-decoration: none;
  background: #fdfdfd;
  border-bottom: 1px solid #444444;
}
/**
 * More search styles, which Marcia is hesitant to put into #top-header because
 * the search page and other unknown search-type inputs may use these styles...
 */
.page-search {
  display: block;
}
.page-search .search-submit {
  display: none;
}
.page-search .ui-autocomplete-loading {
  background-image: url(http://www.khanacademy.org/"/images/throbber.gif");
  background-repeat: no-repeat;
  background-position: 4px 5px;
}
.page-search .icon-search {
  color: #AAA;
  font-size: 18px;
  left: 7px;
  position: absolute;
  top: 5px;
  z-index: 101;
}
.simple-input.search-input {
  padding-left: 25px;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  height: 30px;
}
.noscript-warning {
  margin: 0 1px;
  background: #fff;
  padding: 22px 19px;
  border-top: 1px solid #c6d1ad;
}
.noscript-warning p {
  /* Copied from bootstrap .alert.alert-error */
  color: #b94a48;
  background: #f2dede;
  border: 1px solid #eed3d7;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 14px 14px;
  margin: 0;
  text-align: center;
}
/**
 * Fancy footer! Only the headings are usually visible, and then the user can
 * click on the headings to scroll + reveal the rest of the footer
 */
.push {
  height: 28px;
}
footer {
  background-color: #fdfdfd;
  border-top: 1px solid #dddddd;
  clear: both;
  color: #999999;
  font-size: 12px;
  height: auto;
  line-height: 20px;
  min-width: 970px;
  position: relative;
  z-index: 10;
}
footer li {
  padding-right: 8px;
  padding-bottom: 8px;
}
footer,
footer .extra-links {
  border-top: 1px solid #dddddd;
}
footer .footer-container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  min-width: 1000px;
  max-width: 1200px;
  position: relative;
  padding: 0 12px;
  margin: 0 auto;
}
footer .heading {
  font-family: 'Proxima Nova Bold', sans-serif;
  text-transform: uppercase;
  color: #2c3747;
}
footer .spaced {
  margin-top: 26px;
}
footer .main-links,
footer .extra-links {
  position: relative;
  padding: 24px 0 12px;
}
footer .main-links a,
footer .extra-links a {
  text-decoration: none;
}
footer .extra-links {
  padding: 12px 0 24px;
}
footer .extra-links .legal {
  float: left;
  margin-right: 30px;
}
footer .extra-links .copyright {
  float: right;
}
footer .i18n-icon {
  cursor: default;
  font-size: 20px;
  vertical-align: middle;
}
footer .handtree {
  position: absolute;
  top: auto;
  right: 0;
  bottom: 25px;
  left: auto;
  max-width: 100px;
}
footer .copyright {
  text-align: right;
}
footer .google-analytics-link-track {
  text-decoration: none;
}
footer #report {
  color: #76a005;
}
footer .footer-scroll-cue {
  cursor: s-resize;
}
footer .nowrap {
  white-space: nowrap;
}
#end-of-page-spacer {
  height: 48px;
}
.typeahead-search input[type=text] {
  padding: 0 0 0 25px;
  border: 1px solid #C6D1AD;
  color: #000;
  vertical-align: top;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
}
.typeahead-search input[type=text].tt-hint {
  color: #aaaaaa;
}
.typeahead-search .dropdown-menu {
  width: 444px;
  padding-top: 0;
  padding-bottom: 0;
}
.typeahead-search .dropdown-menu .typeahead-result,
.typeahead-search .dropdown-menu .typeahead-result-kind {
  display: block;
  float: left;
  position: relative;
  text-decoration: none;
}
.typeahead-search .dropdown-menu .typeahead-result-content,
.typeahead-search .dropdown-menu .typeahead-result-footer {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-left: -71px;
  padding-left: 71px;
  width: 100%;
}
.typeahead-search .dropdown-menu .typeahead-result {
  background: #ffffff;
  color: #444444;
}
.typeahead-search .dropdown-menu .typeahead-result.typeahead-result-footer {
  border-top: 1px dotted #cccccc;
}
.typeahead-search .dropdown-menu .typeahead-result.typeahead-result-footer .scented-content {
  margin-left: 10px;
}
.typeahead-search .dropdown-menu .typeahead-result.typeahead-result-footer-only-result {
  border-top: 0;
}
.typeahead-search .dropdown-menu .typeahead-result .scented-content {
  margin-left: 40px;
  padding: 5px 10px 5px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.typeahead-search .dropdown-menu .typeahead-result .icon-book {
  position: absolute;
  font-size: 20px;
  margin-left: 10px;
  margin-top: 5px;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
.typeahead-search .dropdown-menu .typeahead-result .avatar-small {
  position: absolute;
  width: 25px;
  height: 25px;
  margin-left: 10px;
  margin-top: 5px;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
.typeahead-search .dropdown-menu .typeahead-result-kind {
  z-index: 2;
  width: 71px;
  padding: 5px;
  background: #eeeeee;
  border-color: transparent;
  color: #444444;
  border-right: 1px solid #cccccc;
  text-transform: capitalize;
  text-align: right;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.typeahead-search .dropdown-menu .typeahead-result-kind.last {
  padding-bottom: 15px;
}
.typeahead-search .dropdown-menu .typeahead-result-kind.typeahead-result-kind-footer {
  border-top: 1px solid #eeeeee;
}
.typeahead-search .dropdown-menu .typeahead-result-kind.typeahead-result-kind-footer-only-result {
  border-top: 0;
}
.typeahead-search .dropdown-menu .tt-is-under-cursor .typeahead-result {
  background: #2c3747;
  color: #ffffff;
}
.typeahead-search .dropdown-menu .subway-icon .pipe {
  display: none;
}
/**
 * Styles for a throbber made from a 9-block grid.
 * -------------
 * | 0 | 1 | 2 |
 * | 7 | 8 | 3 |
 * | 6 | 5 | 4 |
 * -------------
 * The result of all these animations is to have a dark blue block
 * (@colorProficient) move clockwise from numbers 0 through 7, with a light
 * blue block (@colorPracticed) trailing it. It makes one full cycle every
 * second, with the other blocks at @grayLighter.
 *
 * Like or hate this? Blame Marcia + Jason. :)
 */
.throbber-grid {
  margin: auto;
  position: relative;
  width: 96px;
}
.throbber-fallback {
  left: 0;
  position: absolute;
  top: 0;
}
.throbber-block {
  background: #dddddd;
  border-right: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  float: left;
  height: 30px;
  width: 30px;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease;
  -moz-animation-duration: 1s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: ease;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease;
}
.throbber-block.block-2,
.throbber-block.block-3,
.throbber-block.block-4 {
  border-right: 0;
}
.throbber-block.block-4,
.throbber-block.block-5,
.throbber-block.block-6 {
  border-bottom: 0;
}
.block-8 {
  background: #fdfdfd;
}
.block-0 {
  -webkit-animation-name: block0;
  -moz-animation-name: block0;
  animation-name: block0;
}
.block-1 {
  -webkit-animation-name: block1;
  -moz-animation-name: block1;
  animation-name: block1;
}
.block-2 {
  -webkit-animation-name: block2;
  -moz-animation-name: block2;
  animation-name: block2;
}
.block-3 {
  -webkit-animation-name: block3;
  -moz-animation-name: block3;
  animation-name: block3;
}
.block-4 {
  -webkit-animation-name: block4;
  -moz-animation-name: block4;
  animation-name: block4;
}
.block-5 {
  -webkit-animation-name: block5;
  -moz-animation-name: block5;
  animation-name: block5;
}
.block-6 {
  -webkit-animation-name: block6;
  -moz-animation-name: block6;
  animation-name: block6;
}
.block-7 {
  -webkit-animation-name: block7;
  -moz-animation-name: block7;
  animation-name: block7;
}
/* Webkit keyframes */
@-webkit-keyframes block0 {
  0% {
    background: #0080c9;
  }
  12.5% {
    background: #96d9ff;
  }
  25% {
    background: #dddddd;
  }
  87.5% {
    background: #dddddd;
  }
  100% {
    background: #0080c9;
  }
}
@-webkit-keyframes block1 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #0080c9;
  }
  25% {
    background: #96d9ff;
  }
  37.5% {
    background: #dddddd;
  }
}
@-webkit-keyframes block2 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #0080c9;
  }
  37.5% {
    background: #96d9ff;
  }
  50% {
    background: #dddddd;
  }
}
@-webkit-keyframes block3 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #0080c9;
  }
  50% {
    background: #96d9ff;
  }
  62.5% {
    background: #dddddd;
  }
}
@-webkit-keyframes block4 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #0080c9;
  }
  62.5% {
    background: #96d9ff;
  }
  75% {
    background: #dddddd;
  }
}
@-webkit-keyframes block5 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #0080c9;
  }
  75% {
    background: #96d9ff;
  }
  87.5% {
    background: #dddddd;
  }
}
@-webkit-keyframes block6 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #dddddd;
  }
  75% {
    background: #0080c9;
  }
  87.5% {
    background: #96d9ff;
  }
  100% {
    background: #dddddd;
  }
}
@-webkit-keyframes block7 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #dddddd;
  }
  75% {
    background: #dddddd;
  }
  87.5% {
    background: #0080c9;
  }
  100% {
    background: #96d9ff;
  }
}
/* Moz keyframes */
@-moz-keyframes block0 {
  0% {
    background: #0080c9;
  }
  12.5% {
    background: #96d9ff;
  }
  25% {
    background: #dddddd;
  }
  87.5% {
    background: #dddddd;
  }
  100% {
    background: #0080c9;
  }
}
@-moz-keyframes block1 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #0080c9;
  }
  25% {
    background: #96d9ff;
  }
  37.5% {
    background: #dddddd;
  }
}
@-moz-keyframes block2 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #0080c9;
  }
  37.5% {
    background: #96d9ff;
  }
  50% {
    background: #dddddd;
  }
}
@-moz-keyframes block3 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #0080c9;
  }
  50% {
    background: #96d9ff;
  }
  62.5% {
    background: #dddddd;
  }
}
@-moz-keyframes block4 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #0080c9;
  }
  62.5% {
    background: #96d9ff;
  }
  75% {
    background: #dddddd;
  }
}
@-moz-keyframes block5 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #0080c9;
  }
  75% {
    background: #96d9ff;
  }
  87.5% {
    background: #dddddd;
  }
}
@-moz-keyframes block6 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #dddddd;
  }
  75% {
    background: #0080c9;
  }
  87.5% {
    background: #96d9ff;
  }
  100% {
    background: #dddddd;
  }
}
@-moz-keyframes block7 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #dddddd;
  }
  75% {
    background: #dddddd;
  }
  87.5% {
    background: #0080c9;
  }
  100% {
    background: #96d9ff;
  }
}
/* Keyframes */
@keyframes block0 {
  0% {
    background: #0080c9;
  }
  12.5% {
    background: #96d9ff;
  }
  25% {
    background: #dddddd;
  }
  87.5% {
    background: #dddddd;
  }
  100% {
    background: #0080c9;
  }
}
@keyframes block1 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #0080c9;
  }
  25% {
    background: #96d9ff;
  }
  37.5% {
    background: #dddddd;
  }
}
@keyframes block2 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #0080c9;
  }
  37.5% {
    background: #96d9ff;
  }
  50% {
    background: #dddddd;
  }
}
@keyframes block3 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #0080c9;
  }
  50% {
    background: #96d9ff;
  }
  62.5% {
    background: #dddddd;
  }
}
@keyframes block4 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #0080c9;
  }
  62.5% {
    background: #96d9ff;
  }
  75% {
    background: #dddddd;
  }
}
@keyframes block5 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #0080c9;
  }
  75% {
    background: #96d9ff;
  }
  87.5% {
    background: #dddddd;
  }
}
@keyframes block6 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #dddddd;
  }
  75% {
    background: #0080c9;
  }
  87.5% {
    background: #96d9ff;
  }
  100% {
    background: #dddddd;
  }
}
@keyframes block7 {
  0% {
    background: #dddddd;
  }
  12.5% {
    background: #dddddd;
  }
  25% {
    background: #dddddd;
  }
  37.5% {
    background: #dddddd;
  }
  50% {
    background: #dddddd;
  }
  62.5% {
    background: #dddddd;
  }
  75% {
    background: #dddddd;
  }
  87.5% {
    background: #0080c9;
  }
  100% {
    background: #96d9ff;
  }
}
#profile-throbber {
  display: none;
  height: 90px;
  padding-top: 130px;
  position: absolute;
  width: 100%;
  z-index: 11 !important;
}
#profile-gif-throbber {
  background-image: url(http://www.khanacademy.org/'/images/progress-animated.gif');
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  display: none;
  height: 22px;
  left: 50%;
  margin-left: -200px;
  position: absolute;
  top: 100px;
  width: 400px;
}
/**
 * Energy points badge look. Should be used wherever we display energy points
 *
 * TODO(stephanie): Converted from energy-points.css and hence needs to be
 * less-ified/have variables extracted out.
 */
.info-box #related-video-list .video-energy-points,
.extra-link-bar .video-energy-points,
#user-info .energy-points-badge,
.energy-points-badge {
  background: #005987;
  float: right;
  line-height: 18px;
  text-align: center;
  padding: 2px 5px 3px;
  color: white;
  font-family: MuseoSans500, "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-shadow: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
#user-info .energy-points-badge {
  float: none;
  font-size: 11px;
  cursor: pointer;
}
.infinity-energy-points {
  font-size: 24px;
  vertical-align: top;
}
/**
 * For hover card tooltips
 *
 * TODO(stephanie): Converted from base-hovercard.css and hence needs to be
 * less-ified/have variables extracted out.
 */
.qtip.custom-override {
  max-width: 400px;
}
.qtip-default.custom-override {
  border-color: transparent;
  background-color: transparent;
}
.qtip-default.custom-override .qtip-tip {
  /* Because qtip seems to add inline styles in IE */
  display: none !important;
}
.qtip-default.custom-override .qtip-content {
  border: none;
  background-color: transparent;
  padding: 0 0 10px 0;
  top: -7px;
}
.hover-card-triangle {
  position: relative;
  height: 10px;
  z-index: 1;
}
.hover-card-triangle:before {
  display: block;
  position: absolute;
  left: 26px;
  top: 2px;
  content: " ";
  width: 0;
  height: 0;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #BBB;
}
.hover-card-triangle:after {
  display: block;
  position: absolute;
  left: 26px;
  top: 3px;
  content: " ";
  width: 0;
  height: 0;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #FFF;
}
.hover-card-triangle.right:after,
.hover-card-triangle.right:before {
  left: auto;
  right: 26px;
}
.hover-card-container {
  width: 400px;
  line-height: normal;
}
.hover-card-container.private {
  width: 315px;
}
.hover-card-message {
  padding: 0 0 5px 5px;
  font-size: 115%;
  line-height: 20px;
}
.hover-card-content-container {
  position: relative;
  background: #FFF;
}
.hover-card-content {
  margin: 0 10px 0 5px;
  padding: 8px 0 3px 0;
  position: relative;
}
.hover-card-content .avatar-pic-container {
  float: left;
}
.hover-card-content .user-info {
  float: left;
  font-size: 175%;
  width: 190px;
  padding-left: 10px;
}
.hover-card-content .badge-container {
  padding-top: 2px;
}
.hover-card-content .badge-container .badge-icon {
  width: 20px;
  height: 20px;
}
.hover-card-content .user-stats {
  float: left;
}
.hover-card-content .user-stats .points {
  position: absolute;
  top: 11px;
  right: 0;
}
.hover-card-content .user-stats .points-label {
  color: #999;
}
.hover-card-content .user-stats .join-date {
  position: absolute;
  bottom: 9px;
  right: 0;
  color: #999;
  font-size: 90%;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.input-block-level {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#khanType .thinHeader {
  color: #2c3747;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 24px;
  font-weight: normal;
}
#khanType .smallThinHeader {
  color: #555;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 22px;
}
#khanType .headerDescription {
  color: #898989;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 20px;
  margin-top: 2px;
}
#khanType .domainHeader {
  font-family: 'Proxima Nova Bold', sans-serif;
  font-size: 11px;
  font-weight: normal;
  line-height: 18px;
  text-transform: uppercase;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
#khanType .subjectHeader {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 52px;
  font-weight: normal;
  line-height: 58px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
#khanType .subjectDescription {
  font-family: 'Proxima Nova Bold', sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 22px;
  -webkit-font-smoothing: antialiased;
}
#khanType .topicHeader {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 28.8px;
  margin-bottom: 6px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
#khanType .topicTitle {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 30px;
  font-weight: normal;
  line-height: 48px;
}
#khanType .topicDescription,
#khanType .tutorialDescription {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 18px;
}
#khanType .tutorialTitle {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 24px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
#khanType .tutorialLink {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 18px;
}
.vertical-shadow {
  border: 1px solid #cccccc;
  border-bottom: 1px solid #aaa;
  -webkit-box-shadow: 0 1px 3px #cccccc;
  -moz-box-shadow: 0 1px 3px #cccccc;
  box-shadow: 0 1px 3px #cccccc;
}
/* Fall back colors? Eg coach-res, talks & interviews */
/* Stack Key Frame Animations */
/* Stack to current card to finished stack animations */
@-webkit-keyframes move-center-to-ur {
  85% {
    -webkit-transform: translate(510px, -202px);
    -moz-transform: translate(510px, -202px);
    -ms-transform: translate(510px, -202px);
    -o-transform: translate(510px, -202px);
    transform: translate(510px, -202px);
  }
  100% {
    -webkit-transform: translate(510px, -202px);
    -moz-transform: translate(510px, -202px);
    -ms-transform: translate(510px, -202px);
    -o-transform: translate(510px, -202px);
    transform: translate(510px, -202px);
  }
}
@-webkit-keyframes shrink-right-and-fade {
  85% {
    opacity: 0.15;
    filter: alpha(opacity=15);
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
  }
  100% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
  }
}
@-moz-keyframes move-center-to-ur {
  85% {
    -webkit-transform: translate(510px, -202px);
    -moz-transform: translate(510px, -202px);
    -ms-transform: translate(510px, -202px);
    -o-transform: translate(510px, -202px);
    transform: translate(510px, -202px);
  }
  100% {
    -webkit-transform: translate(510px, -202px);
    -moz-transform: translate(510px, -202px);
    -ms-transform: translate(510px, -202px);
    -o-transform: translate(510px, -202px);
    transform: translate(510px, -202px);
  }
}
@-moz-keyframes shrink-right-and-fade {
  85% {
    opacity: 0.15;
    filter: alpha(opacity=15);
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
  }
  100% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
  }
}
@-ms-keyframes move-center-to-ur {
  85% {
    -webkit-transform: translate(510px, -202px);
    -moz-transform: translate(510px, -202px);
    -ms-transform: translate(510px, -202px);
    -o-transform: translate(510px, -202px);
    transform: translate(510px, -202px);
  }
  100% {
    -webkit-transform: translate(510px, -202px);
    -moz-transform: translate(510px, -202px);
    -ms-transform: translate(510px, -202px);
    -o-transform: translate(510px, -202px);
    transform: translate(510px, -202px);
  }
}
@-ms-keyframes shrink-right-and-fade {
  85% {
    opacity: 0.15;
    filter: alpha(opacity=15);
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
  }
  100% {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
  }
}
/* Apply leaf to current card */
@-webkit-keyframes fly-in-leaf {
  0% {
    -webkit-transform: scale(8);
    -moz-transform: scale(8);
    -ms-transform: scale(8);
    -o-transform: scale(8);
    transform: scale(8);
    opacity: 0;
    filter: alpha(opacity=0);
  }
  66% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0.17;
    filter: alpha(opacity=17);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter: alpha(opacity=100);
  }
}
@-moz-keyframes fly-in-leaf {
  0% {
    -webkit-transform: scale(8);
    -moz-transform: scale(8);
    -ms-transform: scale(8);
    -o-transform: scale(8);
    transform: scale(8);
    opacity: 0;
    filter: alpha(opacity=0);
  }
  66% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0.17;
    filter: alpha(opacity=17);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter: alpha(opacity=100);
  }
}
@-ms-keyframes fly-in-leaf {
  0% {
    -webkit-transform: scale(8);
    -moz-transform: scale(8);
    -ms-transform: scale(8);
    -o-transform: scale(8);
    transform: scale(8);
    opacity: 0;
    filter: alpha(opacity=0);
  }
  66% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0.17;
    filter: alpha(opacity=17);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter: alpha(opacity=100);
  }
}
/* End of stack progress bar animations */
/** 
 * Leaving out the "to" or 100% state in these keyframe animations 
 * causes the fill to animate based on the inline width.
 */
@-webkit-keyframes progress-bar {
  0% {
    width: 0;
    opacity: 0.6;
    filter: alpha(opacity=60);
  }
}
@-moz-keyframes progress-bar {
  0% {
    width: 0;
    opacity: 0.6;
    filter: alpha(opacity=60);
  }
}
@-ms-keyframes progress-bar {
  0% {
    width: 0;
    opacity: 0.6;
    filter: alpha(opacity=60);
  }
}
@-webkit-keyframes progress-bar-proficient {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  66% {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  /* Keep opacity at 0 until progress bar is done filling */
}
@-moz-keyframes progress-bar-proficient {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  66% {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  /* Keep opacity at 0 until progress bar is done filling */
}
@-ms-keyframes progress-bar-proficient {
  0% {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  66% {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  /* Keep opacity at 0 until progress bar is done filling */
}
/**
 * End-of-stack calculation in-progress animations
 */
.exercises-stackview .card-container.into-pocket,
.exercises-stackview .card-container.into-pocket .card-container-inner {
  -webkit-animation-duration: 0.55s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-duration: 0.55s;
  -moz-animation-timing-function: linear;
  -moz-animation-fill-mode: forwards;
  -ms-animation-duration: 0.55s;
  -ms-animation-timing-function: linear;
  -ms-animation-fill-mode: forwards;
}
/* Start arc.
 * See http://lea.verou.me/2012/02/moving-an-element-along-a-circle/ to learn about
 * the chaining transforms (rotate, translate, rotate, translate) used here.
 */
.half-circle-arc 0% {
  -webkit-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
  -moz-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
  -ms-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
}
.half-circle-arc 100% {
  -webkit-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
  -moz-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
  -ms-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
}
@-webkit-keyframes card-up-down {
  0% {
    -webkit-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
    -moz-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
    -ms-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
  }
  100% {
    -webkit-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
    -moz-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
    -ms-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
  }
}
@-moz-keyframes card-up-down {
  0% {
    -webkit-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
    -moz-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
    -ms-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
  }
  100% {
    -webkit-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
    -moz-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
    -ms-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
  }
}
@-ms-keyframes card-up-down {
  0% {
    -webkit-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
    -moz-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
    -ms-transform: rotate(0deg) translateX(70px) rotate(0deg) translateX(-70px);
  }
  100% {
    -webkit-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
    -moz-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
    -ms-transform: rotate(-180deg) translateX(70px) rotate(180deg) translateX(-70px);
  }
}
.exercises-stackview .card-container.into-pocket {
  -webkit-animation-name: card-up-down;
  -moz-animation-name: card-up-down;
  -ms-animation-name: card-up-down;
}
/* End arc */
/* Start arc's final position adjustment */
@-webkit-keyframes card-left-right-0 {
  100% {
    -webkit-transform: translate(-515px, 45px);
    -moz-transform: translate(-515px, 45px);
    -ms-transform: translate(-515px, 45px);
    -o-transform: translate(-515px, 45px);
    transform: translate(-515px, 45px);
  }
}
@-webkit-keyframes card-left-right-1 {
  100% {
    -webkit-transform: translate(-487px, 28px);
    -moz-transform: translate(-487px, 28px);
    -ms-transform: translate(-487px, 28px);
    -o-transform: translate(-487px, 28px);
    transform: translate(-487px, 28px);
  }
}
@-webkit-keyframes card-left-right-2 {
  100% {
    -webkit-transform: translate(-459px, -6px);
    -moz-transform: translate(-459px, -6px);
    -ms-transform: translate(-459px, -6px);
    -o-transform: translate(-459px, -6px);
    transform: translate(-459px, -6px);
  }
}
@-webkit-keyframes card-left-right-3 {
  100% {
    -webkit-transform: translate(-431px, -24px);
    -moz-transform: translate(-431px, -24px);
    -ms-transform: translate(-431px, -24px);
    -o-transform: translate(-431px, -24px);
    transform: translate(-431px, -24px);
  }
}
@-webkit-keyframes card-left-right-4 {
  100% {
    -webkit-transform: translate(-403px, -41px);
    -moz-transform: translate(-403px, -41px);
    -ms-transform: translate(-403px, -41px);
    -o-transform: translate(-403px, -41px);
    transform: translate(-403px, -41px);
  }
}
@-webkit-keyframes card-left-right-5 {
  100% {
    -webkit-transform: translate(-375px, -65px);
    -moz-transform: translate(-375px, -65px);
    -ms-transform: translate(-375px, -65px);
    -o-transform: translate(-375px, -65px);
    transform: translate(-375px, -65px);
  }
}
@-webkit-keyframes card-left-right-6 {
  100% {
    -webkit-transform: translate(-347px, -80px);
    -moz-transform: translate(-347px, -80px);
    -ms-transform: translate(-347px, -80px);
    -o-transform: translate(-347px, -80px);
    transform: translate(-347px, -80px);
  }
}
@-webkit-keyframes card-left-right-7 {
  100% {
    -webkit-transform: translate(-319px, -108px);
    -moz-transform: translate(-319px, -108px);
    -ms-transform: translate(-319px, -108px);
    -o-transform: translate(-319px, -108px);
    transform: translate(-319px, -108px);
  }
}
@-moz-keyframes card-left-right-0 {
  100% {
    -webkit-transform: translate(-515px, 45px);
    -moz-transform: translate(-515px, 45px);
    -ms-transform: translate(-515px, 45px);
    -o-transform: translate(-515px, 45px);
    transform: translate(-515px, 45px);
  }
}
@-moz-keyframes card-left-right-1 {
  100% {
    -webkit-transform: translate(-487px, 28px);
    -moz-transform: translate(-487px, 28px);
    -ms-transform: translate(-487px, 28px);
    -o-transform: translate(-487px, 28px);
    transform: translate(-487px, 28px);
  }
}
@-moz-keyframes card-left-right-2 {
  100% {
    -webkit-transform: translate(-459px, -6px);
    -moz-transform: translate(-459px, -6px);
    -ms-transform: translate(-459px, -6px);
    -o-transform: translate(-459px, -6px);
    transform: translate(-459px, -6px);
  }
}
@-moz-keyframes card-left-right-3 {
  100% {
    -webkit-transform: translate(-431px, -24px);
    -moz-transform: translate(-431px, -24px);
    -ms-transform: translate(-431px, -24px);
    -o-transform: translate(-431px, -24px);
    transform: translate(-431px, -24px);
  }
}
@-moz-keyframes card-left-right-4 {
  100% {
    -webkit-transform: translate(-403px, -41px);
    -moz-transform: translate(-403px, -41px);
    -ms-transform: translate(-403px, -41px);
    -o-transform: translate(-403px, -41px);
    transform: translate(-403px, -41px);
  }
}
@-moz-keyframes card-left-right-5 {
  100% {
    -webkit-transform: translate(-375px, -65px);
    -moz-transform: translate(-375px, -65px);
    -ms-transform: translate(-375px, -65px);
    -o-transform: translate(-375px, -65px);
    transform: translate(-375px, -65px);
  }
}
@-moz-keyframes card-left-right-6 {
  100% {
    -webkit-transform: translate(-347px, -80px);
    -moz-transform: translate(-347px, -80px);
    -ms-transform: translate(-347px, -80px);
    -o-transform: translate(-347px, -80px);
    transform: translate(-347px, -80px);
  }
}
@-moz-keyframes card-left-right-7 {
  100% {
    -webkit-transform: translate(-319px, -108px);
    -moz-transform: translate(-319px, -108px);
    -ms-transform: translate(-319px, -108px);
    -o-transform: translate(-319px, -108px);
    transform: translate(-319px, -108px);
  }
}
.exercises-stackview .card-container.into-pocket-0 .card-container-inner {
  -webkit-animation-name: card-left-right-0;
  -moz-animation-name: card-left-right-0;
}
.exercises-stackview .card-container.into-pocket-1 .card-container-inner {
  -webkit-animation-name: card-left-right-1;
  -moz-animation-name: card-left-right-1;
}
.exercises-stackview .card-container.into-pocket-2 .card-container-inner {
  -webkit-animation-name: card-left-right-2;
  -moz-animation-name: card-left-right-2;
}
.exercises-stackview .card-container.into-pocket-3 .card-container-inner {
  -webkit-animation-name: card-left-right-3;
  -moz-animation-name: card-left-right-3;
}
.exercises-stackview .card-container.into-pocket-4 .card-container-inner {
  -webkit-animation-name: card-left-right-4;
  -moz-animation-name: card-left-right-4;
}
.exercises-stackview .card-container.into-pocket-5 .card-container-inner {
  -webkit-animation-name: card-left-right-5;
  -moz-animation-name: card-left-right-5;
}
.exercises-stackview .card-container.into-pocket-6 .card-container-inner {
  -webkit-animation-name: card-left-right-6;
  -moz-animation-name: card-left-right-6;
}
.exercises-stackview .card-container.into-pocket-7 .card-container-inner {
  -webkit-animation-name: card-left-right-7;
  -moz-animation-name: card-left-right-7;
}
/* End arc's final position adjustment */
/**
 * End end-of-stack calculation animations
 */
/*a light mint color*/
/* grey */
/* the default card/stack view */
/* this handles much of pre-tutorials exercise layout which is encapsulated in
  stacks and cards: i.e. the stack of mini cards, the big exercise card, etc.

*/
.current-card-container {
  position: relative;
}
.current-card-container-inner {
  background-color: #fdfdfd;
}
.card-type-endofstack .current-card-container-inner {
  background-color: #e9efdd;
}
.current-card-container,
.current-card-container-inner {
  -webkit-transition: all 0.18s ease-in-out;
  -moz-transition: all 0.18s ease-in-out;
  -o-transition: all 0.18s ease-in-out;
  transition: all 0.18s ease-in-out;
}
.card-type-endofstack #extras,
.card-type-happypicture #extras,
.card-type-endofassessment #extras {
  visibility: hidden;
}
.card-type-endoftask #extras {
  display: none;
}
.exercises-stack,
.exercises-card {
  float: left;
  width: 7%;
  /* margin-bottom: -9999px;
    padding-bottom: 9999px; */
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.exercises-card {
  width: 86%;
}
.exercises-card.full-width {
  width: 98%;
}
.current-card {
  position: relative;
  margin-bottom: 20px;
}
.current-card #answer_area_wrap {
  margin: 10px -8px 0 0;
}
.current-card #answer_area .info-box {
  overflow: visible;
}
.current-card .info-box:before {
  content: " ";
  display: block;
  border-right: 7px solid transparent;
  border-bottom: 8px solid #cccccc;
  width: 0;
  height: 15px;
  position: absolute;
  right: -1px;
  top: -24px;
}
.current-card .exercise_message {
  display: none;
  /* TODO: currently hiding all proficient/struggling/review messages */
}
.card-type-endofstack .current-card-contents {
  padding: 20px;
}
.current-card #problemarea {
  margin-top: 35px;
}
.current-card #workarea {
  margin-top: 22px;
}
.current-card #answer_area_wrap {
  margin-top: 52px;
}
#footer {
  /*
     * This crazy little sucker invokes a different rendering path
     * for the entire page, even though it's only applied to the footer.
     *
     * This hints to webkit that GPU acceleration should be used where
     * possible, which fixes this annoying bug: http://code.google.com/p/chromium/issues/detail?id=103198
     * as well as any screen flicker on macs when switching to/from GPU
     * rendering.
     *
     * If another fix for this bug is found, this can be removed.
     * See "the magic CSS bullet" here: http://www.html5rocks.com/en/tutorials/speed/html5/#toc-hardware-accell
     *
     * */
  -webkit-transform: translateZ(0);
}
/* "Calculating End of Stack" Card Styling */
.calculating-end-of-stack {
  height: 380px;
  padding: 50px;
  text-align: center;
}
.calculating-end-of-stack .card-pocket {
  width: 530px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 2;
}
.calculating-end-of-stack .card-pocket .slit {
  background: transparent url(http://www.khanacademy.org/'/images/power-mode/slit.png') no-repeat top left;
  /* data-uri('/images/power-mode/slit.png') */
}
.calculating-end-of-stack .card-pocket .slit-overlay {
  background: #e9efdd;
  height: 30px;
  position: relative;
  top: -17px;
}
.calculating-end-of-stack .calc-text-spin {
  position: relative;
  top: -15px;
}
.calculating-end-of-stack .calc-text-spin span {
  display: none;
}
.calculating-end-of-stack .throbber {
  position: relative;
  top: -5px;
}
/**
  * General Exercise area styling
  */
.exercises-content {
  padding-left: 0;
  padding-right: 0;
}
.exercises-body {
  min-height: 380px;
}
.exercises-header .topic-exercise-badge {
  width: 7%;
}
.exercises-header .topic-exercise-image {
  width: 40px;
  height: 40px;
}
.exercises-header .topic-exercise-image.inline {
  display: inline-block;
  margin: -50% 0;
}
.exercises-header .practice-exercise-topic-context {
  -webkit-transition: opacity 0.1s ease-in-out;
  -moz-transition: opacity 0.1s ease-in-out;
  -o-transition: opacity 0.1s ease-in-out;
  transition: opacity 0.1s ease-in-out;
  opacity: 0.3;
  filter: alpha(opacity=30);
  -webkit-backface-visibility: hidden;
}
.exercises-header .practice-exercise-topic-context.solid-hover:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.exercises-header .practice-exercise-topic-context .topic-exercise-badge {
  width: 20px;
  height: 20px;
  margin-right: 2px;
}
.card-type-happypicture {
  text-align: center;
}
.card-type-happypicture h4,
.card-type-happypicture .img-container {
  margin: 22px 0;
}
.card-type-happypicture .happy-picture {
  margin-left: auto;
  margin-right: auto;
}
.hover-disclosure {
  background: #F7F7F7;
  padding: 0 10px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  border: 1px solid #DDD;
  color: #777;
  cursor: default;
  display: inline-block;
}
.hover-disclosure:hover,
.hover-discolsure.hover {
  background: #777;
  color: #fff;
  text-decoration: none;
}
.review-explain {
  font-size: 12px;
  position: relative;
  top: -3px;
}
.exercise-template-old .current-card.notransition .current-card-container,
.exercise-template-old .current-card.notransition .current-card-container-inner {
  /* For temporarily disabling transitions.
         * See http://stackoverflow.com/questions/6634470/disable-turn-off-inherited-css3-transitions
         */
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: color 0 ease-in;
  transition: none;
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}
.exercise-template-old .current-card.shrinkRight .current-card-container {
  -webkit-animation: move-center-to-ur 0.18s ease-in-out 0s 1 forwards normal;
  -moz-animation: move-center-to-ur 0.18s ease-in-out 0s 1 forwards normal;
  -ms-animation: move-center-to-ur 0.18s ease-in-out 0s 1 forwards normal;
  -o-animation: move-center-to-ur 0.18s ease-in-out 0s 1 forwards normal;
  animation: move-center-to-ur 0.18s ease-in-out 0s 1 forwards normal;
}
.exercise-template-old .current-card.shrinkRight .current-card-container-inner {
  -webkit-animation: shrink-right-and-fade 0.18s ease-in-out 0s 1 forwards normal;
  -moz-animation: shrink-right-and-fade 0.18s ease-in-out 0s 1 forwards normal;
  -ms-animation: shrink-right-and-fade 0.18s ease-in-out 0s 1 forwards normal;
  -o-animation: shrink-right-and-fade 0.18s ease-in-out 0s 1 forwards normal;
  animation: shrink-right-and-fade 0.18s ease-in-out 0s 1 forwards normal;
}
.exercise-template-old .current-card.shrinkLeft .current-card-container {
  -webkit-transform: translate(-510px, -202px);
  -moz-transform: translate(-510px, -202px);
  -ms-transform: translate(-510px, -202px);
  -o-transform: translate(-510px, -202px);
  transform: translate(-510px, -202px);
}
.exercise-template-old .current-card.shrinkLeft .current-card-container-inner {
  -webkit-transform: scale(0.1);
  -moz-transform: scale(0.1);
  -ms-transform: scale(0.1);
  -o-transform: scale(0.1);
  transform: scale(0.1);
  opacity: 0;
  filter: alpha(opacity=0);
}
.exercise-template-old .current-card.shrinkRight #extras {
  visibility: hidden;
}
.exercises-content-container {
  overflow: visible;
}
.exercises-content-container .exercises-content {
  margin: 0;
}
.exercises-content-container .exercises-content .exercises-card.full-width {
  width: 100%;
}
.exercises-content-container.assessment-mode .exercises-header .section-headline {
  margin-left: 7%;
}
.tutorial-node-content .exercises-content-container .current-card-container-inner {
  border-left: 0;
  border-right: 0;
}
/* all the end-of-stack summary treatment */
/* End "Calculating End of Stack" Card styling */
/* End of Stack Card Styling */
.end-of-stack-info .title h1 {
  float: left;
}
.end-of-stack-info .stack-controls .simple-button {
  padding: 8px 0;
  display: inline-block;
  font-size: 150%;
  text-align: center;
  width: 48%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.end-of-stack-info .stack-controls .right {
  float: right;
}
.end-of-stack-info .stack-controls .left {
  float: left;
}
.end-of-stack-info .stack-stats {
  float: right;
  margin-top: -8px;
}
.end-of-stack-info .stack-stats p {
  display: inline-block;
  text-align: center;
  font-size: 150%;
  margin: 0;
  margin-left: 40px;
}
.end-of-stack-info .stack-stats img {
  height: 38px;
  vertical-align: -11px;
}
.end-of-stack-info .stack-stats .times {
  display: inline-block;
  margin: 0 7px;
}
.end-of-stack-info .progress-graph {
  background: white;
  padding: 20px;
  border: 1px solid #cccccc;
  margin-bottom: 22px;
}
.end-of-stack-info .progress-graph.current-topic {
  display: none;
}
.proficient-tick {
  vertical-align: -1px;
}
.three-col {
  float: left;
  width: 32%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.three-col.col-one,
.three-col.col-two {
  margin-right: 2%;
}
#show-topic-details {
  position: relative;
  top: -2px;
  margin-left: 10px;
}
.end-of-stack-info .stack-controls.new-style-controls {
  margin: 10px;
}
/* overrides to cards-n-stacks for tutorials */
#tutorial-page .exercises-content-container .exercises-content {
  background-color: transparent;
}
#tutorial-page .tutorial-description .card-container {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  bottom: 0;
  float: left;
  margin: 0 -5px;
  position: relative;
  top: 5px;
}
#tutorial-page .tutorial-description .card-container:last-child .card-face.card-back {
  -webkit-box-shadow: inset 0 0 0 2px white, inset 0 0 0 4px #cccccc;
  -moz-box-shadow: inset 0 0 0 2px white, inset 0 0 0 4px #cccccc;
  box-shadow: inset 0 0 0 2px white, inset 0 0 0 4px #cccccc;
  background-color: auto;
}
#tutorial-page .tutorial-description .active .card,
#tutorial-page .tutorial-description .completed .card {
  -webkit-box-shadow: 0 0 4px #cccccc;
  -moz-box-shadow: 0 0 4px #cccccc;
  box-shadow: 0 0 4px #cccccc;
  border: 1px solid #a7d2eb;
}
#tutorial-page .tutorial-description .active:last-child .card-back.card-face,
#tutorial-page .tutorial-description .completed:last-child .card-back.card-face,
#tutorial-page .tutorial-description .active .card-back.card-face,
#tutorial-page .tutorial-description .completed .card-back.card-face {
  -webkit-box-shadow: inset 0 0 0 2px white, inset 0 0 0 4px #a7d2eb;
  -moz-box-shadow: inset 0 0 0 2px white, inset 0 0 0 4px #a7d2eb;
  box-shadow: inset 0 0 0 2px white, inset 0 0 0 4px #a7d2eb;
  background-color: #f4fafd;
}
#tutorial-page .tutorial-description .active {
  margin: 0 20px;
  top: 0;
}
#tutorial-page .tutorial-description .active .card {
  height: 50px;
  width: 35px;
}
#tutorial-page .tutorial-description .card-face.card-back {
  background-color: #eee;
}
#tutorial-page .tutorial-description .completed .card {
  -webkit-box-shadow: 0 0 4px #a7d2eb;
  -moz-box-shadow: 0 0 4px #a7d2eb;
  box-shadow: 0 0 4px #a7d2eb;
}
#tutorial-page .tutorial-description .completed .card-face.card-back {
  background-color: #f4fafd;
}
.lte8 #tutorial-page .card-container {
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  zoom: 1;
}
.assessment-landing,
.assessment-instructions,
.assessment-report {
  display: table;
  width: 100%;
}
.assessment-landing .assessment,
.assessment-instructions .assessment,
.assessment-report .assessment {
  margin-top: 42px;
}
.assessment-landing .content,
.assessment-instructions .content,
.assessment-report .content,
.assessment-landing .docked-nav,
.assessment-instructions .docked-nav,
.assessment-report .docked-nav {
  display: table-cell;
  vertical-align: top;
}
.assessment-landing .docked-nav,
.assessment-instructions .docked-nav,
.assessment-report .docked-nav {
  min-width: 200px;
  position: static;
}
.assessment-landing .content,
.assessment-instructions .content,
.assessment-report .content {
  padding: 22px 0 0 22px;
  width: 100%;
}
.assessment-landing h2,
.assessment-instructions h2,
.assessment-report h2 {
  color: #2c3747;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 24px;
  font-weight: normal;
}
.assessment-landing h2 small,
.assessment-instructions h2 small,
.assessment-report h2 small {
  color: #898989;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 20px;
  margin-top: 2px;
}
.assessment-landing h3,
.assessment-instructions h3,
.assessment-report h3,
.assessment-landing .assessment-title,
.assessment-instructions .assessment-title,
.assessment-report .assessment-title {
  color: #555;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 22px;
}
.assessment-landing h3 .description,
.assessment-instructions h3 .description,
.assessment-report h3 .description,
.assessment-landing .assessment-title .description,
.assessment-instructions .assessment-title .description,
.assessment-report .assessment-title .description {
  color: #898989;
  display: block;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: normal;
  line-height: 20px;
  margin-top: 2px;
  color: #999999;
}
.assessment-landing .coach-callout img,
.assessment-instructions .coach-callout img,
.assessment-report .coach-callout img {
  height: 20px;
  width: 20px;
  margin-bottom: -3px;
}
.assessment-landing .assessment-past-results,
.assessment-instructions .assessment-past-results,
.assessment-report .assessment-past-results {
  padding-left: 28px;
}
.assessment-landing .assessment-link:link,
.assessment-instructions .assessment-link:link,
.assessment-report .assessment-link:link,
.assessment-landing .assessment-link:visited,
.assessment-instructions .assessment-link:visited,
.assessment-report .assessment-link:visited,
.assessment-landing .assessment-link:focus,
.assessment-instructions .assessment-link:focus,
.assessment-report .assessment-link:focus,
.assessment-landing .assessment-link:hover,
.assessment-instructions .assessment-link:hover,
.assessment-report .assessment-link:hover,
.assessment-landing .assessment-link:active,
.assessment-instructions .assessment-link:active,
.assessment-report .assessment-link:active {
  display: block;
}
.assessment-landing .assessment-link:link .assessment-title,
.assessment-instructions .assessment-link:link .assessment-title,
.assessment-report .assessment-link:link .assessment-title,
.assessment-landing .assessment-link:visited .assessment-title,
.assessment-instructions .assessment-link:visited .assessment-title,
.assessment-report .assessment-link:visited .assessment-title,
.assessment-landing .assessment-link:focus .assessment-title,
.assessment-instructions .assessment-link:focus .assessment-title,
.assessment-report .assessment-link:focus .assessment-title,
.assessment-landing .assessment-link:hover .assessment-title,
.assessment-instructions .assessment-link:hover .assessment-title,
.assessment-report .assessment-link:hover .assessment-title,
.assessment-landing .assessment-link:active .assessment-title,
.assessment-instructions .assessment-link:active .assessment-title,
.assessment-report .assessment-link:active .assessment-title {
  color: #2c3747;
}
.assessment-landing .assessment-link:link .assessment-title .description,
.assessment-instructions .assessment-link:link .assessment-title .description,
.assessment-report .assessment-link:link .assessment-title .description,
.assessment-landing .assessment-link:visited .assessment-title .description,
.assessment-instructions .assessment-link:visited .assessment-title .description,
.assessment-report .assessment-link:visited .assessment-title .description,
.assessment-landing .assessment-link:focus .assessment-title .description,
.assessment-instructions .assessment-link:focus .assessment-title .description,
.assessment-report .assessment-link:focus .assessment-title .description,
.assessment-landing .assessment-link:hover .assessment-title .description,
.assessment-instructions .assessment-link:hover .assessment-title .description,
.assessment-report .assessment-link:hover .assessment-title .description,
.assessment-landing .assessment-link:active .assessment-title .description,
.assessment-instructions .assessment-link:active .assessment-title .description,
.assessment-report .assessment-link:active .assessment-title .description {
  color: #a9c0d1;
}
.assessment-landing .assessment-link:focus,
.assessment-instructions .assessment-link:focus,
.assessment-report .assessment-link:focus,
.assessment-landing .assessment-link:hover,
.assessment-instructions .assessment-link:hover,
.assessment-report .assessment-link:hover {
  background-color: #fdfdfd;
  text-decoration: none;
}
.assessment-landing .assessment-link:focus .title,
.assessment-instructions .assessment-link:focus .title,
.assessment-report .assessment-link:focus .title,
.assessment-landing .assessment-link:hover .title,
.assessment-instructions .assessment-link:hover .title,
.assessment-report .assessment-link:hover .title {
  text-decoration: underline;
}
.assessment-landing .assessment-link:focus .assessment-title,
.assessment-instructions .assessment-link:focus .assessment-title,
.assessment-report .assessment-link:focus .assessment-title,
.assessment-landing .assessment-link:hover .assessment-title,
.assessment-instructions .assessment-link:hover .assessment-title,
.assessment-report .assessment-link:hover .assessment-title {
  color: #76a005;
}
.assessment-landing h3 + h2,
.assessment-instructions h3 + h2,
.assessment-report h3 + h2 {
  margin-top: -21px;
}
.assessment-instructions ul {
  list-style: disc;
}
.assessment-instructions ul li {
  font-size: 14px;
}
.assessment-instructions .instructions {
  margin-bottom: 14px;
  border-bottom: 1px solid #a9c0d1;
}
.assessment-instructions .assessment-button {
  margin-top: 28px;
  padding-bottom: 28px;
}
.assessment-report h3 {
  border-bottom: 1px solid #a9c0d1;
}
.assessment-report h3.score {
  border-bottom: 1px dotted #aaaaaa;
}
.assessment-report h3.score span {
  color: #76a005;
  float: right;
  font-family: 'Proxima Nova Bold', sans-serif;
}
.assessment-report .feedback .simple-button {
  font-size: 14px;
  margin-left: 7px;
}
.assessment-report .feedback-link {
  color: #76a005;
  font-weight: bold;
}
.assessment-report th span {
  border-bottom: 1px dotted #aaaaaa;
  display: block;
  font-weight: bold;
  margin-right: 7px;
}
.assessment-report .assessment-data {
  margin-top: 42px;
}
.assessment-report .assessment-correctness {
  padding-right: 28px;
}
.assessment-report .assessment-correctness.correct {
  color: #76a005;
}
.assessment-report .assessment-correctness.incorrect {
  color: #aaaaaa;
}
.assessment-report .assessment-accuracy {
  color: #555555;
  font-family: "courier new", courier, monospace;
  font-size: 14px;
  font-weight: bold;
  padding-right: 28px;
}
.assessment-report .assessment-table {
  font-size: 14px;
  line-height: 28px;
  margin-bottom: 7px;
  padding: 2px;
  text-align: left;
  width: 100%;
}
.coach-assessments .monoMagic {
  font-family: "Andale Mono", AndaleMono, "Lucida Console", LucidaConsole, monospace;
  color: #000000;
  position: relative;
}
.coach-assessments .assessment-summary {
  margin-bottom: 14px;
  width: 100%;
}
.coach-assessments .assessment-summary td {
  padding: 0;
}
.coach-assessments .assessment-header {
  color: #76a005;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 22px;
  padding: 12px;
  padding-left: 70px;
  position: relative;
}
.coach-assessments .assessment-header small {
  display: block;
  font-size: 16px;
  position: relative;
  top: -2px;
}
.coach-assessments .assessment-subheader {
  color: #76a005;
  font-family: 'Proxima Nova Bold', sans-serif;
  text-align: right;
  font-size: 16px;
  margin-top: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.coach-assessments .assessment-info {
  color: #76a005;
  font-size: 14px;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: normal;
  margin-top: 16px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.coach-assessments .assessment-info span,
.coach-assessments .assessment-class-stats span {
  font-family: "Andale Mono", AndaleMono, "Lucida Console", LucidaConsole, monospace;
  color: #000000;
  position: relative;
  text-transform: none;
  letter-spacing: 0;
}
.coach-assessments .logo {
  background-color: #76a005;
  border-radius: 12px;
  display: table-cell;
  height: 24px;
  left: 0;
  padding: 8px;
  position: absolute;
  top: 11px;
  width: 40px;
  text-align: center;
  vertical-align: middle;
}
.coach-assessments .topic-all {
  clear: both;
  margin-bottom: 56px;
}
.coach-assessments .report {
  font-size: 16px;
  border: 1px solid #76a005;
  width: 100%;
}
.coach-assessments .topic-header .topic-name {
  color: #76a005;
  font-family: 'Proxima Nova', sans-serif;
  margin-bottom: 10.5px;
}
.coach-assessments .topic-header .topic-name .assessment-title,
.coach-assessments .topic-header .topic-name .assessment-stats {
  font-family: "Andale Mono", AndaleMono, "Lucida Console", LucidaConsole, monospace;
  color: #000000;
  position: relative;
  display: inline-block;
  padding-left: .25em;
}
.coach-assessments th {
  background-color: #f4fed9;
  border-bottom: 1px solid #76a005;
  color: #356700;
  font-size: 14px;
  padding: 7px;
  padding-left: 14px;
  text-align: left;
}
.coach-assessments .assessment-class-stats th {
  background-color: #d7fb76;
  border-width: 0;
  color: #356700;
  text-transform: uppercase;
}
.coach-assessments td {
  padding: 14px;
}
.coach-assessments .score-header {
  border-bottom-width: 0;
  text-align: right;
}
.coach-assessments .report-score {
  background-color: #f4fed9;
  text-align: right;
}
.coach-assessments .student-data span {
  font-family: "Andale Mono", AndaleMono, "Lucida Console", LucidaConsole, monospace;
  color: #000000;
  position: relative;
  font-size: 14px;
}
.coach-assessments .student-data .report-info a {
  text-decoration: underline;
}
.coach-assessments a.correct,
.coach-assessments a.incorrect {
  color: #d7fb76;
  position: relative;
  text-decoration: none;
}
.coach-assessments a.correct span,
.coach-assessments a.incorrect span {
  position: absolute;
  left: 1px;
  top: -3px;
}
.coach-assessments a.correct:focus,
.coach-assessments a.incorrect:focus,
.coach-assessments a.correct:hover,
.coach-assessments a.incorrect:hover {
  color: #76a005;
}
@media print {
  /**
      * --"quis leget haec?"
      * --"nemo hunc legit praeter ego"
      */
  .coach-assessments span {
    top: 3px;
    left: -3px;
  }
  .coach-assessments a.correct span,
  .coach-assessments a.incorrect span {
    left: -2px;
    top: 1px;
  }
}
#skip-question-button,
#opt-out-button {
  margin-top: 15px;
}
.skip-question-button-tooltip {
  background: #333333;
  border: 0px solid #333333;
  /* border color used for arrow */
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  color: #fdfdfd;
  padding: 15px 30px 15px 15px;
  width: 215px;
}
.skip-question-button-tooltip .qtip-close {
  background: transparent;
  border: 0;
  color: #fdfdfd;
  right: 10px;
  top: 10px;
}
.skip-question-button-tooltip .qtip-close .ui-icon {
  font-size: 24px;
  height: 18px;
}
/**
 * Read-only historical problem viewing mode
 */
.read-only .exercises-stackview {
  visibility: hidden;
}
.read-only .leaves-container {
  display: none;
}
/**
 * End read-only historical problem viewing mode
 */
/**
 * our .@{domain} {color: white;} overrides mathjax eqs
 * FIXME(marcos): domain-colors mixins should not define color: @white;
 * except for in actual mixins, but not for .math, .{@domain}, et al.
 */
.MathJax .math {
  color: #444;
}
.exercises-body {
    /* Activate GPU rendering */
    -webkit-transform: translatez(0);
}

div.exercises-card {
    width: 753px;
}

body.debug #workarea,
body.debug #hintsarea {
    outline: 1px dashed #ddd;
}

body.debug #extras .debug-mode {
    display: none;
}
