/*   
Theme Name: Teach.com
Theme URI: ?
Description: Make a difference
Author: Brian McAllister for 2tor
Version: 1
*/

/* Normalization, some helpers and print styles from https://github.com/paulirish/html5-boilerplate */

/**

		HTML5 elements
		
*/

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/**

		Base
		
		- Correct text resizing oddly in IE6/7 when body font-size is set using em units
		- Force vertical scrollbar in non-IE
		- Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
		
*/

html { font-size: 100%;overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }

::-moz-selection { background: #fc0; color: #fff; text-shadow: none; }
::selection { background: #fc0; color: #fff; text-shadow: none; }


/**

		Links
		
*/

a {
	color: #900;
	text-decoration: none;
}

a:visited { color: #990000; }
a:hover { color: #fc0; }
a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }

.current_page_item,
.current_page_item a,
.current_page_ancestor a {
	color: #111;
}


/**

		Type normalization
		
*/

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }

blockquote {
  margin: 5px 0;
  padding: 7px 0;
  font: italic 18px/140% serif;
  text-align: center;
  border-top: 1px solid #900;
  border-bottom: 1px solid #900;
}

blockquote p { 
  margin: 0;
  font: italic 18px/140% serif;
}

.pullquote {
  float: right;
  display: block;
  width: 30%;
  margin: 1em 40px;
  padding: 10px 60px;
  font: italic 18px/140% serif;
  background-image: url(_/img/quote-open.png), url(_/img/quote-close.png);
  background-position: left top, right bottom;
  background-repeat: no-repeat;
}

dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/**

		Lists
		
*/

ul {
  margin: 1em 0;
  padding: 0 0 0 40px;
  color: #636363;
  list-style-image: url(_/img/bullet.png);
}

ul ul {
  list-style-image: url(_/img/bullet-small.png);
}

dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

ol {
  margin: 1em 0;
  padding: 0 0 0 40px;
  color: #636363;
}


/**

		Embedded content
		
		- Improve image quality when scaled in IE7: h5bp.com/d
    - Remove the gap between images and borders on image containers: h5bp.com/e 

*/

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/* Correct overflow not hidden in IE9 */
svg:not(:root) { overflow: hidden; }


/* Figures */
figure { margin: 0; }


/**

		Forms
		
*/

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/* 
		- Correct color not inheriting in IE6/7/8/9 
		- Correct alignment displayed oddly in IE6/7 
*/
legend { border: 0; *margin-left: -7px; padding: 0; }

/*
		- Correct font-size not inheriting in all browsers
		- Remove margins in FF3/4 S5 Chrome
		- Define consistent vertical alignment display in all browsers
*/
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
		- Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
		- Correct inner spacing displayed oddly in IE6/7
*/
button, input { line-height: normal; *overflow: visible; }

/* Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7 */
table button, table input { *overflow: auto; }

/*
		- Display hand cursor for clickable form elements
		- Allow styling of clickable form elements in iOS
*/
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

/* Consistent box sizing and appearance */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/* Remove inner padding and border in FF3/4: h5bp.com/l */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/* 
		- Remove default vertical scrollbar in IE6/7/8/9 
		- Allow only vertical resizing
*/
textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


/**

		Tables
		
*/

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/**

		
		···
		
		Color reference
		
		MAIN - Bright yellow	: #fc0
		MAIN - Saturated Red	: #990000
		
		TEXT - Dark grey			: #363636
		TEXT - Light grey			: #636363
			
*/

body {
	border-top: 5px solid #990000;
	border-bottom: 5px solid #990000;
}

/* Basically clearfix, but I like making it... clear (GET IT!?) */
hr:before, hr:after { content: ""; display: table; }
hr:after { clear: both; }

hr {
	clear: both;
	width: 100%;
	height: 2px;
	margin: 28px 0;
	background: #e1e1e1;
	border: 0;
	zoom: 1; 
}

/**

		Typography 

*/

@font-face {
    font-family: 'museoslab';
    src: url('_/fonts/Museo_Slab_500-webfont.eot');
    src: url('_/fonts/Museo_Slab_500-webfont.eot?iefix') format('eot'),
         url('_/fonts/Museo_Slab_500-webfont.woff') format('woff'),
         url('_/fonts/Museo_Slab_500-webfont.ttf') format('truetype'),
         url('_/fonts/Museo_Slab_500-webfont.svg#webfontyumMOUTD') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1, h2, h3, h4, h5, h6, p {
	margin: 10px 0;
	font-weight: normal;
}

h1 {
	font: 36px museoslab, sans-serif;
	color: #900;
}

h2 {
	height: 33px;
	font: bold 15px sans-serif;
	color: #363636;
	line-height: 33px;
	text-transform: uppercase;
}

.nivo-caption h2 {
  height: auto;
	font: 36px museoslab, sans-serif;
	color: #900;
	line-height: normal;
	text-transform: none;
}

h3 {
	font: 15px museoslab, sans-serif;
	color: #900;
}

h4 {
	font: bold 15px sans-serif;
	color: #fff;
}

p {
	font: 13px/1.45em sans-serif;
	color: #636363;
}

/* A few little helper classes for flourishy things */
.post-date {
	padding: 0 5px 0 0;
	font-size: 10px;
	color: #636363;
	text-transform: uppercase;
}

.section-divider {
	font: bold 11px sans-serif;
	color: #363636;
	text-transform: uppercase;
}

.more-link {
	font: bold 10px sans-serif;
}

.more-link > span {
	color: #636363;
}

/* Simply apply this class to allow space for an icon (override if not 36px x 33px) */
.with-icon {
	padding: 0 0 0 45px;
	background: 0 0 url(_/img/sprite.png) no-repeat;
}

/* Various icons. Refer to sprite.psd */
.icon-video {
	background-position: -924px -48px;
}

.icon-blog {
	background-position: -924px -81px;
}

.icon-certification {
	background-position: -924px -114px;
}

/**

		Global header
		
*/

#global-header {
	width: 960px;
	margin: 0 auto;
	position: relative;
}

.logo {
	display: block;
	width: 158px;
	height: 63px;
	padding: 15px 0;
}

#brought-to-you-by {
	display: block;
	width: 220px;
	height: 28px;
	font: 11px/28px sans-serif;
	color: #555;
	text-align: center;
	position: absolute;
	top: -5px;
	right: 0;

	background: #bfbfbf;
	background: -moz-linear-gradient(top, #bfbfbf 0%, #cdcdcd 4%, #d8d8d8 7%, #eaeaea 15%, #ebebeb 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bfbfbf), color-stop(4%,#cdcdcd), color-stop(7%,#d8d8d8), color-stop(15%,#eaeaea), color-stop(100%,#ebebeb));
	background: -webkit-linear-gradient(top, #bfbfbf 0%,#cdcdcd 4%,#d8d8d8 7%,#eaeaea 15%,#ebebeb 100%);
	background: -o-linear-gradient(top, #bfbfbf 0%,#cdcdcd 4%,#d8d8d8 7%,#eaeaea 15%,#ebebeb 100%);
	background: -ms-linear-gradient(top, #bfbfbf 0%,#cdcdcd 4%,#d8d8d8 7%,#eaeaea 15%,#ebebeb 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfbfbf', endColorstr='#ebebeb',GradientType=0 );
	background: linear-gradient(top, #bfbfbf 0%,#cdcdcd 4%,#d8d8d8 7%,#eaeaea 15%,#ebebeb 100%);
	
}

#brought-to-you-by span {
	color: #990000;
	font-weight: bold;
}

/* Header nav */
#global-nav {
	width: 100%;
	height: auto;
	border-top: 2px solid #636363;
}

#menu-global-navigation {
	width: 997px; /* This trick is for getting the items end-to-end */
	height: auto;
	margin-left: -39px;
}

/* Get ready for sprites! */
.menu-global-navigation-container a {
	display: block;
	width: auto;
	height: 33px;
	margin-left: 39px;
	padding: 15px 0;
	text-indent: -999em;
	background: url(_/img/sprite.png) no-repeat transparent;
}

.menu-global-navigation-container li {
	float: left;
}

/* Main nav item rollovers (yellow -> red) */
.globalnav-why a {
	width: 89px;
	background-position: 0 15px;
}

.globalnav-why a:hover,
.globalnav-why.current-menu-item a {
	background-position: -89px 15px;
}

.globalnav-who a {
	width: 98px;
	background-position: -178px 15px;
}

.globalnav-who a:hover,
.globalnav-who.current-menu-item a {
	background-position: -276px 15px;
}

.globalnav-what a {
	width: 164px;
	background-position: -374px 15px;
}

.globalnav-what a:hover,
.globalnav-what.current-menu-item a {
	background-position: -538px 15px;
}

.globalnav-where a {
	width: 120px;
	background-position: -702px 15px;
}

.globalnav-where a:hover,
.globalnav-where.current-menu-item a {
	background-position: -822px 15px;
}

.globalnav-how a {
	width: 197px;
	background-position: 0px -33px;
}

.globalnav-how a:hover,
.globalnav-how.current-menu-item a {
	background-position: -197px -33px;
}

.globalnav-blog a {
	width: 95px;
	background-position: -394px -33px;
}

.globalnav-blog a:hover,
.globalnav-blog.current-menu-item a {
	background-position: -489px -33px;
}


/* The sub-menus (dropdowns) showing on mouseover */

/*
		We'll use the first level to build out the dropdown container.
		The nested .sub-menus below this will be used to hold the page links.
*/
.sub-menu {
	display: none;
	width: 100%;
	height: auto;
	margin: -8px 0 0 0; /* top margin to account for the caret on top of the divider */
	padding: 30px 0 20px 0;
	position: absolute;
	left: 0;
	z-index: 999;
	background: 0 0 url(_/img/divider.png) repeat-x #fff;
	border-bottom: 2px solid #6a6a6a;
}

.ie .sub-menu {
  top: 160px;
  z-index: 9999999 !important;
}

.sub-menu a {
	text-indent: 0;
	background: none;
}

.menu-item:hover .sub-menu {
	display: block;
}

.menu-item a {
	font: 11px museoslab, sans-serif;
}

/* Yellow divider */
.globalnav-why:hover .sub-menu {
	background-position: left top;
}

.globalnav-who:hover .sub-menu {
	background-position: 130px top;
}

.globalnav-what:hover .sub-menu {
	background-position: 265px top;
}

.globalnav-where:hover .sub-menu {
	background-position: 468px top;
}

.globalnav-how:hover .sub-menu {
	background-position: 628px top;
}

/* Second list level */
.sub-menu > li {
	display: block;
	float: left;
	width: 210px; /* four columns */
	padding: 15px;
	background: transparent;
}

.sub-menu li a {
	display: inline-block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 15px 0 10px 0;
	color: #636363;
	text-transform: uppercase;
	background: transparent;
}

.sub-menu li a:hover {
	text-decoration: underline;
}

.sub-menu .sub-menu {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	position: static;
	overflow: hidden;
	background: transparent;
	border: 0;
}

.sub-menu .sub-menu li {
	float: left;
	clear: left;
	padding: 0;
}

.sub-menu .sub-menu a {
	padding: 5px 0;
	font: 13px sans-serif;
	color: #990000;
	text-transform: none;
}

/**

		Global footer
		
*/

#global-footer {
	width: 960px;
	margin: 60px auto 0;
	padding: 0 0 50px 0;
	border-top: 2px solid #636363;
}

.site-summary {
	float: right;
	width: 770px;
	font: 11px/17px sans-serif;
	color: #363636;
}

#footer-logo {
	padding: 0 0 15px 0;
}

#menu-footer-navigation {
	width: 1000px;
	margin: 25px 0 25px -15px;
}

#footer-nav a,
#footer-nav span {
	display: block;
	float: left;
	margin: 0 0 0 15px;
	font: bold 11px sans-serif;
	color: #363636;
}

#footer-nav span {
  color: #a1a1a1;
	font-weight: normal;
}

#footer-nav li:first-child span {
	display: none;
}

/**

		Global aside style
		
		This is the red sidebar block with the page fold.
		
		There are some extra styles that add specific details
		based on context. All are noted where appropriate.
		
*/

.red-with-fold {
	padding: 32px 15px;
	color: #fff;
	position: relative;
	background: right bottom url(_/img/page-fold.png) no-repeat #821313;
}

.red-with-fold h1 {
	width: 250px;
	height: 53px;
	margin: 5px auto;
	background: 0 0 url(_/img/rossier-logo-2.png) no-repeat #821313;
}

.red-with-fold .logo-tagline {
  margin: -3px 0 0 0;
  font: 17px 'Lucida Grande', sans-serif;
  text-align: center;
}

.red-with-fold .logo-tagline span {
  display: block;
  text-transform: uppercase;
}

.red-with-fold .more-info {
	width: 100%;
}

.red-with-fold h2 {
	height: auto;
	margin: 0;
	font: bold 18px sans-serif;
	color: #fc0;
}

.red-with-fold h3 {
	margin: 0 0 10px 0;
	font-size: 19px;
	color: #fff;
	text-align: left;
	text-transform: uppercase;
}

/* This was added in after the fact due to an edit - MKTG-57 */
.red-with-fold h4 {
  font-size: 16px;
  color: #fff;
  text-align: left;
}

.red-with-fold p {
	color: #fff;
	font-size: 12px;
}

.red-with-fold hr {
	width: 200%;
	height: 14px;
	margin: 20px 0 20px -50%;
	position: relative;
	background: url(_/img/sidebar-hr-bg.png) repeat-x transparent;
	border: 0;
}

.red-with-fold .apilf-harmony .lead_forms_widget {
	background-color: transparent;
	padding: 0;
}

.red-with-fold .apilf-harmony .form-group__select {
	color: #000;
}

.red-with-fold .apilf-harmony .form-group {
	margin-bottom:
}

@media (min-width: 400px) {
	.red-with-fold .apilf-harmony .col-12.col-3--laptop,
	.red-with-fold .apilf-harmony .col-3--tablet-landscape,
	.red-with-fold .apilf-harmony .col-12.col-9--tablet-landscape.col-6--laptop {
		width: 100%;
	}
	.red-with-fold .apilf-harmony .u--padding-sm--tablet-landscape {
		padding:0;
	}
}

.lead_forms_widget_modal.apilf-harmony .modal__content {
	background-color: rgba(175, 0, 0, 0.60);
}

.red-with-fold .apilf-harmony .button--action,
#lead-form-dialog .modal__content .button--action {
	padding: 7px 20px;
	font: bold 13px sans-serif;
	color: #900;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border: 1px solid #5a0000;
	background: #ffca00;
	width: 75px;
	letter-spacing: 2px
}

.red-with-fold .apilf-harmony .button--action:hover,
.red-with-fold .apilf-harmony .button--action:active,
.red-with-fold .apilf-harmony .button--action:focus,
#lead-form-dialog .modal__content .button--action:hover,
#lead-form-dialog .modal__content .button--action:active,
#lead-form-dialog .modal__content .button--action:focus {
	color: #900;
	background: #ff9800;
	cursor: pointer;
}

.red-with-fold .sidebar-widgets .span6 {
	width: 100%;
}

.red-with-fold .sidebar-widgets .lead_forms_widget .btn-primary {
	margin-top: 0;
}

#lead-form-dialog .modal-header,
#lead-form-dialog .modal-body {
	padding: 0 15px;
}

#lead-form-dialog h2,
#lead-form-dialog p {
	color: #fc0;
}

#lead-form-dialog .progress {
	border-radius: 5px;
	border: 0 none;
}

#lead-form-dialog .progress .bar {
	background-color: #ffcd00;
}

#lead-form-dialog .progress-markers .s0, 
#lead-form-dialog .progress-markers .s1, 
#lead-form-dialog .progress-markers .s2 {
	background-color: #e4c8c8;
	color: #900;
}

#lead-form-dialog .progress-markers .active-step {
	background-color: #fff;
}

#lead-form-dialog label {
	color: #fff;
	font-weight: bold;
}

#lead-form-dialog label.error {
	font-style: italic;
	font-weight: normal;
}


/* Global aside, gray with sketchy background */

.gray-sketch {
    background: url(_/img/gray-sketch.png) repeat-y;
    padding: 10px 18px;
    margin-bottom: 10px;
}

.gray-sketch h3 {
    text-transform: uppercase;
    color: #990000;
    font-size: 1.1em;
    font-weight: bold;
    font-family: "HelveticaNeue", "Helvetica Neue", "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
}

.gray-sketch p {
    color: #636363;
    font-size: 1em;
    font-family: "HelveticaNeue", "Helvetica Neue", "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
}

/* Homepage specific */
#homepage-content .red-with-fold {
	float: right;
	width: 410px;
	padding: 17px 30px 40px 30px;
	overflow: visible;
	top: -20px;
}

#homepage-content .red-with-fold:before {
	content: '';
	display: block;
	width: 0;
  height: 0;
	position: absolute;
	top: 0;
	left: -5px;
	border-color: transparent #5c0000;
  border-style: solid;
  border-width: 10px 5px 0 0;
}

#homepage-content .red-with-fold h3 {
  margin: 30px 0 0 0;
	font-size: 16px;
}

/* kludge... don't love this */
#homepage-content .red-with-fold hr {
	width: 114%;
	margin: 15px 0 15px -7%;
}

#sidebar .red-with-fold hr {
  width: 250px;
  margin: 10px 0;
  position: relative;
  left: -15px;
}

#sidebar .red-with-fold h2 {
  font-size: 14px;
  font-weight: bold;
}

/**

		Individual page styles
		
		TOC:
			- Home (_home.php)
			- Blog
			
*/

/**

		Home page specific styles (_home.php)

*/

/* Slider and slider container */
#homepage-banner {
	width: 100%;
	height: 350px;
	margin: 0 auto 10px;
	
	background: #ffffff;
	background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 23%, #f7f7f7 72%, #ebebeb 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(23%,#ffffff), color-stop(72%,#f7f7f7), color-stop(100%,#ebebeb));
	background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 23%,#f7f7f7 72%,#ebebeb 100%);
	background: -o-linear-gradient(top, #ffffff 0%,#ffffff 23%,#f7f7f7 72%,#ebebeb 100%);
	background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 23%,#f7f7f7 72%,#ebebeb 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ebebeb',GradientType=0 );
	background: linear-gradient(top, #ffffff 0%,#ffffff 23%,#f7f7f7 72%,#ebebeb 100%);
}

#homepage-slider {
	width: 1070px;
	height: 350px;
	margin: 0 0 0 -479px;
	position: absolute;	
	left: 50%;
}

.ie #homepage-slider {
  position: relative;
  z-index: 1;
  zoom: 1;
}

#homepage-slider img {
	position: absolute;
	bottom: 0;
	right: 0;
	display: none;
}

.nivo-imageLink {
	display: none;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 6;
	border: 0;
}

.nivo-slice {
	display: block;
	height: 100%;
	position: absolute;
	z-index: 5;
}

.nivo-box {
	display: block;
	position: absolute;
	z-index: 5;
}

/* Captions */
.nivo-caption {
	width: 310px;
	position: absolute;
	top: 20px;
	left: 0;
	z-index: 8;
	background: transparent;
	opacity: 0.8;
}

.nivo-caption a {
	display: inline !important;
}

.nivo-html-caption {
  display: none;
}

/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav {
	width: 165px;
	position: absolute;
	bottom: 30px;
	left: 0;
	z-index: 9;
}

.nivo-directionNav a {
	display: block;
	width: 56px;
	height: 56px;
	text-align: left;
	text-indent: -999em;
	direction: ltr;
	position: relative;
	z-index: 9;
	cursor: pointer;
	overflow: hidden;
	background: url(_/img/sprite.png) no-repeat transparent;
	border: 0;
}

/* Refer to sprite.psd for guides */
a.nivo-prevNav {
	float: left;
	background-position: 0 -96px;
}

a.nivo-prevNav:hover {
	background-position: -53px -96px;
}

a.nivo-nextNav {
	float: right;
	background-position: -112px -96px;
}

a.nivo-nextNav:hover {
	background-position: -166px -96px;
}

/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
	position: absolute;
	bottom: 53px;
	left: 60px;
	overflow: hidden;
}

.nivo-controlNav a {
	float: left;
	display: block;
	width: 15px;
	height: 15px;
	text-align: left;
	text-indent: -999em;
	direction: ltr;
	position: relative;
	z-index: 9;
	cursor: pointer;
	overflow: hidden;
	background: -225px -96px url(_/img/sprite.png) no-repeat transparent;
	border: 0;
}

.nivo-controlNav a.active {
	font-weight: bold;
	background-position: -240px -96px;
}

/* Homepage content blocks and container */
/* Homepage specific .red-with-fold... scroll up */
#homepage-content {
	width: 960px;
	margin: 0 auto;
}

/* .half-width-block for content that is 50% wide */
.half-width-block {
	float: left;
	width: 470px;
}

#homepage-video {
	margin: 0 0 30px 0; /* not sure what's up with this thing. not working right with the hr */
}

#homepage-map {
	float: right;
}

#homepage-map > div {
  position: relative;
}

#homepage-map img {
  position: absolute;
  top: 0;
  left: 0;
}

#map canvas {
  position: absolute;
  top: 2px !important;
  left: 2px !important;
}

.post-snippet p {
	font-size: 10px;
}

.latest-post {
	margin: 0 0 20px 0;
	padding: 0 0 25px 0;
	overflow: hidden;
	border-bottom: 1px dotted #666;
}

.latest-post h3 {
	margin: 5px 0 8px;
}

.latest-post img {
	float: left;
	width: 100px;
}

.latest-post img + p {
	padding: 0 0 0 120px;
}

.addthis {
	background: #eee;
}

/**

		Blog specific styles

*/

#posts {
	float: right;
	width: 680px;
}

.post {
	width: 100%;
	margin: 25px 0 0 0;
	padding: 0 0 20px 0;
	border: none;
	border-bottom: 1px dotted #111;
}

.blog-title {
  margin-bottom: 15px;
	font-size: 30px;
	color: #000;
}

.entry-title {
	margin: 5px 0;
	font-size: 24px;
}

.meta {
	font-size: 10px;
	color: #636363;
	text-transform: uppercase;
}

.meta-break {
	padding: 0 5px;
	font-size: 12px;
	vertical-align: -1px;
}

/* 
	Blog index (index.php) 
	
	.blog		- the actual index page
	.paged	- pages (pg. 2, pg. 3, etc)
*/
.first-post {
	width: 628px;
	margin: 0;
	padding: 25px;
	border: 1px dotted #111;
}

.entry-thumbnail {
	float: left;
	width: 100px;
	height: 100px;
	margin: 0 20px 0 0;
	overflow: hidden;
}

.first-post .entry-thumbnail {
	width: 240px;
	height: 170px;
	overflow: hidden;
}

.first-post .entry-thumbnail ~ .entry-text {
  padding: 0 0 0 260px;
}

.post-image-tall {
	width: 100%;
	height: auto;
}

.post-image-wide {
	width: auto;
	height: 100%;
}

.entry-thumbnail ~ .entry-text,
.entry-thumbnail ~ footer {
	padding: 0 0 0 120px; /* if there's a thumbnail, add padding */
}

.entry-text {
  color: #636363;
}


/* Navigation container (Previous & Next) */
.navigation {
	width: 680px;
	margin: 15px 0 0 0;
	float: right;
	clear: both;
}

.wp-pagenavi {
	margin: 1em 0;
	padding: 0;
	list-style: none;
	font-size: 11px;
	font-weight: bold;
}

.wp-pagenavi .pages {
    display: none;
}

.wp-pagenavi a,
.wp-pagenavi span,
.wp-pagenavi .page,
.wp-pagenavi .extend,
.wp-pagenavi .current,
.wp-pagenavi .last,
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
    border: 0 none;
}

.wp-pagenavi li {
	float: left;
	margin: 0 5px;
}

.wp-pagenavi .current {
	color: #636363;
}

.wp-pagenavi .next {
	padding: 0 8px 0 0;
	background: center right url(_/img/nav-next.png) no-repeat;
}

.wp-pagenavi .prev {
	padding: 0 0 0 8px;
	background: center left url(_/img/nav-previous.png) no-repeat;
}

/* Display 'Previous' on all pages... */
.blog .wp-pagenavi .title:before {
	content: 'Previous';
	padding: 0 0 0 8px;
	color: #636363;
	background: center left url(_/img/nav-previous.png) no-repeat;
}

/* ...except pages that aren't the first page. */
.paged .wp-pagenavi .title:before {
	display: none;
}

/* Display 'Next' on the last page only */
.wp-pagenavi li:last-child .current:after {
	content: 'Next';
	margin: 0 0 0 8px;
	padding: 0 8px 0 0;
	color: #636363;
	background: center right url(_/img/nav-next.png) no-repeat;
}

/**

		Single blog post styles
		
*/

.single #posts article {
	padding: 20px 0 0 0;
	border-top: 1px dotted #111;
}

/**

    Blog post helper styles
    
*/

.alignleft {
  float: left;
  padding: 10px;
}

.alignright {
  float: right;
  padding: 10px;
}

/**

		General page styles

*/

#page-content {
	width: 960px;
	margin: 0 auto;
}

/* Breadcrumbs bar */
#breadcrumbs {
	width: 100%;
	height: 32px;
	margin: 0 0 35px 0;
	line-height: 32px;
	background: 0 0 url(_/img/breadcrumbs.png) no-repeat;
	
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

#breadcrumbs li {
	float: left;
	display: block;
	font-size: 11px;
	overflow: auto;
}

#breadcrumbs a {
	float: left;
	display: block;
	padding: 0 30px 0 20px;
	background: center right url(_/img/breadcrumb-arrow.png) no-repeat transparent;
}

#breadcrumbs .current_page_item {
	padding: 0 0 0 20px;
	color: #363636;
	background: none;
}

/* Post (page) content */
.page-content {
	float: right;
	width: 680px;
	height: auto;
}

.page-content h1 {
	font-size: 30px;
	color: #111;
}

/* State pages */
.state > h1 {
  padding: 0 0 15px 0;
  border-bottom: 1px dotted #000;
}

.state-summary {
  float: right;
  width: 230px;
  height: auto;
}

.state-summary figure {
  text-align: center;
}

.state-summary figcaption {
  width: 188px;
  margin: 15px 0 0 0;
  padding: 20px;
  border: 2px solid #e1e1e1;
}

.state-summary figcaption h2 {
  height: auto;
  margin: 0 0 10px 0;
  font-size: 13px;
  line-height: 110%;
}

.state-summary a {
  word-wrap: break-word;
}

.state-highlights-table {
  width: 430px;
  margin: 20px 0;
  color: #636363;
  font-size: 13px;
}

.state-highlights-table ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.state-highlights-table li {
  border-top: 1px dotted #000;
  overflow: hidden;
}

.state-highlights-table li:first-child {
  border: 0;
}

.state-highlights-table h6 {
  margin: 8px 0 0 0;
  font-size: 13px;
  font-weight: bold;
  color: #363636;
  text-transform: uppercase;
}

.state-highlights-table p,
.state-highlights-table span {
  margin: 12px 0 0 0;
  padding: 0 0 12px 0;
  vertical-align: baseline;
}

.state-highlights-table p {
  float: left;
  font-weight: bold;
}

.state-highlights-table span {
  float: right;
}

/* Tables on State pages */
.state-table {
  width: 676px;
  margin: 20px 0;
  overflow: hidden;
  border: 2px solid #e1e1e1;
}

.state-table h2 {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  font: bold 13px sans-serif;
  color: #363636;
  line-height: 40px;
  text-indent: 18px;
  text-transform: uppercase;
  background: #ebebeb;
}

.state-table ul {
  float: left;
  list-style: none;
  margin: 0;
}

.state-table li {
  padding: 8px 0 0 0;
  color: #636363;
}

.state-table li:first-child {
  padding: 0;
}

.lined-vertical ul {
  border-left: 2px solid #e1e1e1;
}

.lined-vertical ul:first-of-type {
  border: 0;
}

.lined-horizontal li {
  margin-bottom: 8px;
  border-top: 1px solid #e1e1e1;
}

.lined-horizontal li:nth-child(2) {
  border: 0;
}

.state-table.two-column ul {
  width: 300px;
  padding: 18px;
}

.state-table.three-column ul {
  width: 225px;
  padding: 0;
}

.state-table.three-column li {
  padding: 8px 0 0 18px;
}

.state-table li.state-table-header {
  width: 101%;
  height: 40px;
  margin: 0;
  padding: 0;
  color: #636363;
  font-weight: bold;
  line-height: 40px;
  text-indent: 18px;
  background: #d7d7d7;
}

#become-a-teacher ul {
  width: 285px;
  padding-left: 32px;
  list-style-image: url(_/img/bullet-arrow.png);
}






/** 

		Sidebar 
		
		- see sidebar.php

*/

#sidebar {
	float: left;
	width: 250px;
	height: auto;
}

/* 
  Control which items get displayed in the sidebar. 
  
  This is where most of the magic happens for the sidebar
  menu.
*/
.sidebar-nav .children {
  display: none;
}

.sidebar-nav .current_page_item .children,
.sidebar-nav .current_page_ancestor .children {
  display: block;
}

.sidebar-nav ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.sidebar-nav li,
.sidebar-nav .menu-item a {
  margin: 10px 0;
	padding: 10px 0 0 0;
	font: 13px museoslab, sans-serif;
	text-transform: uppercase;
	border-top: 1px solid #e1e1e1;
}

.sidebar-nav li:first-child,
.sidebar-nav .menu-item:first-child a {
	border: none;
	background: none;
}

/* Currently viewed page. */
.sidebar-nav .current_page_item,
.sidebar-nav .current-parent {
	background: right 15px url(_/img/carrot.png) no-repeat;
}

/* Second level pages */
.sidebar-nav .children li {
	margin: 0 0 0 20px;
	font: 11px museoslab, sans-serif;
	text-transform: uppercase;
	list-style-image: url(_/img/bullet.png);
	border: 0;
}

/* 
  This is going to get hairy, but there's a ton of 
  nesting to account for. Here we go...
*/

/*
  Override this style to make sure _nested_ <a>s aren't dark grey.
  
  The style is originally set for the main navigation dropdown
  section headers (the grey links).
  
  We need the ul so we don't turn the real current page items red.

*/
.sidebar-nav .current_page_item ul a,

/*
  When viewing a third level subpage, make sure _its_ parent is
  still red (instead of black, as set for the main nav dropdowns).
*/
.sidebar-nav .current_page_ancestor a,

/*
  For the menu on the blog index page.
*/
.sidebar-nav .menu-item a {
  color: #900;
}

/* Make sure the hover is yellow. */
.current_page_item ul a:hover,
.sidebar-nav .menu-item a:hover {
  color: #fc0;
}

/*
  Override the style for the current third level subpage to black.
*/
.sidebar-nav .current_page_ancestor .current_page_item a,
.sidebar-nav .menu-item.current_page_item a {
  color: #000;
}

/* Social media section */
#social {
	margin: 10px 0;
}

#social ul {
	width: 191px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

#social li {
	float: left;
	margin: 0 4px;
}

.menu-social-media-container a {
	display: block;
	width: 100%;
	height: 100%;
	text-align: left;
	direction: ltr;
	text-indent: -999em;
	overflow: hidden;
	background: url(_/img/sprite.png) no-repeat transparent;
	border: 0;
}

.social-twitter a {
	width: 40px;
	height: 38px;
	background-position: -584px -48px;
}

.social-facebook a {
	width: 39px;
	height: 38px;
	background-position: -624px -48px;
}

.social-youtube a {
	width: 40px;
	height: 38px;
	background-position: -663px -48px;
}

.social-rss a {
	width: 40px;
	height: 38px;
	background-position: -703px -48px;
}

/* Sidebar sections with the grey headers */
#sidebar section,
#page-content .red-with-fold {
	margin: 20px 0;
}

#sidebar section ul {
	margin: 0;
	padding: 10px 0 20px 10px;
	list-style: none;
	border-width: 0 1px 1px 1px;
	border-style: solid;
	border-color: #e1e1e1;
}

#sidebar section li {
	margin: 5px 0;
}

#sidebar section h2 {
	width: 248;
	height: 31px;
	margin: 0;
	padding: 0 0 0 11px;
	font-size: 11px;
	color: #363636;
	line-height: 31px;
	background: #e1e1e1;
}


/**

		AddThis elements
		
		- This includes all of the page specific styles, instead of mixing it in with
			the page sections above
			
*/

.addthis_toolbox {
	width: auto;
	height: 30px;
	position: relative;
}

.addthis_toolbox a {
	display: block;
	height: 30px;
	float: right;
}

.addthis_button_facebook_like {
	width: auto;
	overflow: hidden;
}

.fb_edge_comment_widget {
  display: none !important;
}

.addthis_button_twitter_follow_native {
	width: 160px;
}

.addthis_toolbox .addthis_button_pinterest_pinit {
    top:0;
}

.addthis_button_google_plusone {
	width: 50px;
	height: 30px;
}

.addthis_button_tweet {
	width: 55px;
	margin: 0 5px 0 0;
}

/* Homepage specific */
#global-header .addthis_toolbox {
	position: absolute;
	top: 45px;
	right: 0;
}

.ie #global-header {
  z-index: 9999;
  zoom: 1;
}
	

/* Blog specific */
.postmetadata {
  clear: both;
}

.postmetadata .addthis_toolbox a {
	float: left;
}

.postmetadata .addthis_button_google_plusone {
	margin: 0 5px 0 0;
}

/* State template specific */
.state .addthis_toolbox a {
  float: left;
}

.state .addthis_button_google_plusone {
	margin: 0 5px 0 0;
}


/* 
    Teach 100 app page template
*/

#teach-100 nav ul li a {
    font-family: museoslab, sans-serif;
}

/* Fix lists in disqus. */
#dsq-content ul {
  list-style-image: none;
}




/**

		Helpers
		
*/

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }



/**

		Media queries
		
*/

@media only screen and (min-width: 480px) {
  /* Style adjustments for viewports 480px and over go here */

}

@media only screen and (min-width: 768px) {
  /* Style adjustments for viewports 768px and over go here */

}



/** 

		Print 
		
*/

@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}

/* Fix lists in disqus. */
#dsq-content ul {
list-style-image: none;
}