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

@font-face {
  font-family: 'Oswald';
  font-weight: 300;
  font-style: normal;
  src: url('../fonts/Oswald-300/Oswald-300.eot');
  src: url('../fonts/Oswald-300/Oswald-300.eot?#iefix') format('embedded-opentype'),
       local('Oswald Light'),
       local('Oswald-300'),
       url('../fonts/Oswald-300/Oswald-300.woff2') format('woff2'),
       url('../fonts/Oswald-300/Oswald-300.woff') format('woff'),
       url('../fonts/Oswald-300/Oswald-300.ttf') format('truetype'),
       url('../fonts/Oswald-300/Oswald-300.svg#Oswald') format('svg');
}

@font-face {
  font-family: 'Oswald';
  font-weight: 400;
  font-style: normal;
  src: url('../fonts/Oswald-regular/Oswald-regular.eot');
  src: url('../fonts/Oswald-regular/Oswald-regular.eot?#iefix') format('embedded-opentype'),
       local('Oswald Regular'),
       local('Oswald-regular'),
       url('../fonts/Oswald-regular/Oswald-regular.woff2') format('woff2'),
       url('../fonts/Oswald-regular/Oswald-regular.woff') format('woff'),
       url('../fonts/Oswald-regular/Oswald-regular.ttf') format('truetype'),
       url('../fonts/Oswald-regular/Oswald-regular.svg#Oswald') format('svg');
}

@font-face {
  font-family: 'Oswald';
  font-weight: 700;
  font-style: normal;
  src: url('../fonts/Oswald-700/Oswald-700.eot');
  src: url('../fonts/Oswald-700/Oswald-700.eot?#iefix') format('embedded-opentype'),
       local('Oswald Bold'),
       local('Oswald-700'),
       url('../fonts/Oswald-700/Oswald-700.woff2') format('woff2'),
       url('../fonts/Oswald-700/Oswald-700.woff') format('woff'),
       url('../fonts/Oswald-700/Oswald-700.ttf') format('truetype'),
       url('../fonts/Oswald-700/Oswald-700.svg#Oswald') format('svg');
}

body { font-size:15px; line-height:1.6em; }
p { margin-bottom: 1.5em; }

#hd-nav nav,
#left-nav .list-group-header,
.course,
.section,
.week-header,
.graphs-title,
.welcome-header,
h1, 
h2, 
h3
{
	font-family: 'Oswald', sans-serif; 
}
h1, h2 {
	color: #005fc1;
	margin-bottom: 1em;
}
h1 { font-size:3rem; margin-top:0; font-weight: 700; }
h2 { font-size:2.5rem; margin-top: 1.5em; }
h3 { font-size:2rem; }

.page-width	{ max-width:960px; margin:0 auto; text-align:left; }

#hd,
#ft { background-color:#e6e6e6; padding:1px 0; }

#hd-logo { max-width:300px; display:block; margin: 20px auto 38px 0; }
#hd-contact a { color:#fff; }
#hd-logo img { max-width:100%; }
#hd-nav { min-height: 50px; overflow: auto; line-height:3.125em }
#hd-nav nav { float:left; }
#hd-nav ul { list-style-type:none; margin-bottom:0; padding:0; }
#hd-nav li { display:inline-block; text-transform:uppercase; }
#hd-nav a { padding:5px 10px; }
@media (min-width: @screen-sm-min) {
	#hd-nav a { padding-left:20px; padding-right:20px; }
}
#hd-nav a:hover { background-color:rgba(255,255,255,0.15); border-radius:3px; color:#fff; text-decoration:none; }
#hd-nav .fa { margin-right: 5px; }
.nav-user { text-align:right; padding-right:16px; }
#hd-nav #hamburger { display:none; } /* disabled on all pages */
.dashboard #hd-nav #hamburger { display:inline-block; } /* enabled on just the dashboard */
#hd-details {
    background-color: #FFFFFF;
    overflow: auto;
    color: #656565;
    padding: 5px 0;
    font-weight: 300;
    font-size: 16px;
    border-bottom: 1px solid #CDCCCC;
    font-family: 'Oswald', sans-serif;
	 text-align: right;
    min-height: 33px;
}
#hd-details .hd-course { float:left; }
#hd-details .hd-user { text-align:right; }

.alert > h2,
.alert > h3 { color:inherit; }

h2 > .glyphicon:first-child,
h3 > .glyphicon:first-child,
.btn > .glyphicon:first-child,
.btn > .fa:first-child {
	margin-right:5px;
}
.btn > .glyphicon:last-child,
.btn > .fa:last-child {
	margin-right: 0;
}

.alert { margin-top:1em; margin-bottom:1em; }
.alert > h2:first-child,
.alert > h3:first-child {
	margin:0.5em 0 1em 0;
}
.alert p { margin-bottom:1em; }
dl dd { margin-bottom:1em; }

.btn.help {
	border-radius:2em;
}


#hd-nav,
#hd-nav a,
.course,
.graphs-header,
.welcome-header {
	background-color: #005fc1;
	color: #fff;
	font-size: 16px;
}

#bd .page-width { padding-top:30px; padding-bottom:30px; }


/* sticky footer */
/** 
* 1. Avoid the IE 10-11 `min-height` bug. 
* 2. Set `flex-shrink` to `0` to prevent some browsers from 
*    letting these items shrink to smaller than their content's default 
*    minimum size. See http://bit.ly/1Mn35US for details. 
* 3. Use `%` instead of `vh` since `vh` is buggy in older mobile Safari. 
*/ 

html { height:100%; }
body {
	display: flex; 
	flex-direction: column; 
	height: 100%; /* 1, 3 */ 
} 
#hd, 
#ft { 
	flex: none; /* 2 */
} 
#bd { 
	flex: 1 0 auto; /* 2 */ 
	padding: var(--space) var(--space) 0; 
	width: 100%; 
} 
#bd::after { 
	content: '\00a0'; /*   */ 
	display: block; 
	margin-top: var(--space); 
	height: 0px; 
	visibility: hidden; 
} 
@media (--break-lg) { 
	#bd { 
		padding-top: var(--space-lg); 
	} 
	#bd::after { 
		margin-top: var(--space-lg); 
	} 
} 
#bd--full { 
	padding: 0; 
} 
#bd--full::after { 
	content: none; 
} 
/*
body {
	display: flex;
	min-height: 100vh;
	flex-direction: column;
}
#bd {
	flex: 1;
	width: 100%;
}
*/

/* help popups */
body.popup { padding:1em; }
body.popup h1 { font-size:3rem; }


.course { margin-top:-1px; margin-left:-1px; margin-right:-1px; /*size of border*/ }
.course,
.section,
.graphs-header,
.welcome-header { padding:15px; }
.course-title,
.section-title { float:left; width:70px; padding-left:5px; font-weight:400; }
.course-name,
.section-name { margin-left: 10px; }
.course-name,
.section-name,
.graphs-header { font-weight:300; }
.section-name { float:left; margin-right: 200px; }
.section-continue { float:right; }
.section { overflow:auto; }
.status,
.graphs,
.welcome {
	border: 1px solid #ddd;
	border-radius: 4px;
	/*
	-webkit-box-shadow: 0px 0px 17px 5px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 17px 5px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 17px 5px rgba(0,0,0,0.1);
	*/
}
.welcome-body { padding: 1em; }
.graphs-content { padding: 1em 1em 0 1em }
.graphs-footer { padding: 1em; }
.status, .alerts, .graphs, .welcome { margin-bottom: 1em; }
.fa { position:relative; top:-1px; }
.section {
	position: relative;
	border-radius: 0;
}
.section-title,
.section-name {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
#left-nav a { 
	display:block; 
	line-height: 19px;
	vertical-align:middle;
}
#left-nav .fa { font-size:16px; line-height:1em; vertical-align:middle; }
.fa { margin-right: 8px; }
#hambuger .fa { margin-right:0; } /* turn off the margin on hambuger icon */
.section,
.week-tasks .fa-check,
.week-tasks .fa-arrow-right,
#left-nav .course-work a {
	color: #019415;
}
.section,
.course-work {
	background-color: #dff0d8;
	border-color: #d6e9c6;
}
.weeks { padding: 1em 1em 0 1em; }
.week-header,
.list-group-header {
	color: #024A94;
}
.list-group-header {
	font-size: 16px;
}
.week-dates,
.task-date {
	font-size: 12px;
}
.week-tasks .task-date { color: #666; }
.week-header { 
	border: 1px solid #ddd;
	position: relative;
	padding: 8px 15px;
	text-align: right;
}
.week-header .fa { position:relative; top:-1px; }
.week-number {
	float:left;
}
.week-dates { text-align:right; }
.weeks .fa { font-size:16px; }
.week-tasks { text-align:right; }
.week-tasks ol { overflow:auto; padding: 0.5em 15px; }
.week-tasks li,
.week-tasks .fa { line-height: 2em; }
.week-tasks .task-name { float:left; clear:left; }
.list-group-header,
.week-header {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d9d9d9+100 */
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(255,255,255) 0%, rgb(217,217,217) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgb(255,255,255) 0%,rgb(217,217,217) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgb(255,255,255) 0%,rgb(217,217,217) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d9d9d9',GradientType=0 ); /* IE6-9 */
}
.week-tasks ol { list-style-type:none; }
#left-nav a {
	color: #333;
}
#ft { padding:3em 0 2.5em 0; }
.ft-links { text-align:right; }
#ft a { white-space:nowrap; }


.weeks .webinar-details,
.weeks .webinar-details .fa { color: #666; font-size:12px; line-height:2em; vertical-align:middle; }
.weeks .webinar-details { padding-left: 1em; }
.weeks li { display:block; overflow:auto; padding:5px 0; }
.weeks li,
.weeks .fa { line-height: 16px; vertical-align:middle; }
.status .btn { 
	background-image:none;
	border: none;
}
.btn .fa { margin-right:0; }
.navbar-toggle {
	float:none;
	margin: 0;
}


.navbar-collapse {
	padding: 0;
}
/* chart colors */
.progress-bar-essay { background: #464298; }
.progress-bar-practical { background: #706BD4; }
.progress-bar-webinar { background: #A09CF5; }

.progress-bar { min-width:2em; }
.graphs-values { text-align:right; font-size:11px; }
.graphs-values-0 { float:left; }
.graphs .progress { margin-bottom: 15px; }
.graphs .progress,
.graphs-label { height: 30px; }
.graphs-header { text-align:right; }
.graphs-title { float:left; line-height:28px; vertical-align:middle; }
.graphs-help { font-size:12px; }
.average,
.graphs-footer { border-top:1px solid #ddd; }
.graphs-footer { background-color: #E6E6E6; }
.graphs-legend { list-style-type: none; padding:0; font-size:12px; margin-bottom:0; }
.graphs-legend li { display: inline-block; margin-right:1em; }
.graphs-legend li:first-child { margin-left:0; }
.graphs-legend span { display: inline-block; width:15px; height:15px; position:relative; top:3px; margin-right:3px; }
.graphs-label { text-align: right; }
.average .graphs-label { font-weight:bold; }
.graphs-label,
.graphs-legend { line-height: 30px; vertical-align:middle; }
.graphs .average { 
	padding-top:15px;
}
.graphs-header .form-control {
	 height: 26px;
	 padding: 0px 6px;
	 font-size: 13px;
	 border-radius: 2px;
}
.graphs-header .form-control:focus {
	border-color: transparent;
	-webkit-box-shadow: none;
	box-shadow: none;
}

/* class for intake document legal agreement text */
.intake-legal {
	background-color: #f3f3f3;
	padding: 1em;
}
.intake-legal p:last-child {
	margin-bottom:0;
}

/* the select/go form to review reading pages */
.nav-pages { float:right; }
.nav-pages .btn { line-height:1; }
@media (max-width: 767px) {
	.nav-pages { float:none; }
	.nav-pages .form-group { display:inline-block; }
}

/* the textarea character count */
.char-count { float:right; }
.char-count .form-control { display:inline-block; width:auto; }

/* written responses pages have a label inside h2 */
h2 label { display:inline; }

.well { clear:both; }

/* being responsive media queries */
@media (max-width: 767px) {
	#hd-logo {
		text-align:center;
		margin: 30px auto;
	}
	.ft-legal,
	.ft-links {
		text-align:center;
  }
	h1, h2, h3 { clear:both; }
}
@media (max-width: 500px) {
	.hd-course { float:none; display:block; }
	.hd-user { display:block; }
}
@media (max-width: 450px) {
	.section-continue { float:none; margin:1em 0 0 0; text-align:center; }
	.section-name { float:none; margin-right:0; }
	.section-title, .section-name {
		position: static;
		top: 0;
		transform: none;
	}
	.completed-date { display:none; }
}
@media (max-width: 991px) {
	.page-width { padding-left: 1em; padding-right: 1em; }
	.graphs-label { text-align:left; }
}

@media print {
	a[href]:after {
		content: "";
	}
	.noprint { display:none !important; }

	#hd-logo { max-width:250px; margin:0 0 2em 0; }
	#hd { border-bottom: 1px solid #ccc; }
	#ft { padding: 1em 0 0 0; }
	#hd-nav,
	#hd-details,
	.ft-links,
	.signature .panel-footer { display:none; }

	body { font-size:11pt; }

	h1 { font-size:2.5rem; }
	h2 { font-size:2rem; }
	h3 { font-size:1.5rem; }
	
	.ft-legal { text-align:right; font-size:10pt; }
}



#menu a {
	line-height: 1.75em;
}


/********************************************************
**
**  Menu page left/right columns
**
********************************************************/

/* column layout */
#layout {
	align-content: stretch;
	align-items: flex-start;
	display: flex;
	flex-direction: row-reverse;
	flex-wrap: wrap;
	justify-content: space-between;
}
#layout > * {
	width: 100%;
}
@media (min-width:768px) {
	#layout .col-left {
		width: 60%;
	}
	#layout .col-right {
		width: 40%;
	}
}
@media (min-width:992px) {
	#layout > * {
		width: 50%;
	}
}


/********************************************************
**
**  Alerts System
**
********************************************************/

#alerts .panel-heading {
	font-family: 'Oswald', sans-serif;
	transition: background 0.5s;
}
#alerts .panel-heading {
	background-image: none;
	transition: background 0.5s;
}
#alerts .panel-heading:hover {
	background: #1a4a73;
}
#alerts .panel-heading a {
	position: relative;
	display: block;
	color: white;
	text-decoration: none;
}
#alerts .panel-heading a:hover {
	text-decoration: underline;
}
#alerts .fa-caret-down {
	margin: 0;
	position: absolute;
	right: 0;
	top: 50%;
	transition: transform 0.5s;
	transform: translateY(-50%) rotate(-180deg);
	/*transition-delay: 0;*/
}
#alerts.panel-expanded .fa-caret-down {
	transform: translateY(-50%) rotate(0deg);
}
#alerts .alert-title {
	font-weight: bold;
}
#alerts .alert-title,
#alerts .alert-body {
	text-align: left;
}

#alerts .alert-body {
	position: relative;  /* anchor for any children with position=absolute */
	height: 4em;		 /* default height 3 rows (roughly 4 line heights) */
	overflow: hidden;	 /* and anything longer should be hidden           */
}

.panel-title > a,
.list-group-item > a {
	display:block;
}

/* alerts expand/collapse */

#alerts .alert .alert-body {
	position: relative; /* anchor positioned children to this element */
	height: 4em;	/* max-height of the alert message body */
	overflow: hidden;	/* anything beyond the height, will be hidden */
}

/* styling of more/less links
/* required by all examples
*/
#alerts .more-toggle {
	/* link covers entire area */
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
#alerts .more-toggle .icon {
	/* position in bottom right corner */
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 2px 5px;
	text-decoration: none; /* remove link underline */
	width: 20px;
	height: 20px;
	background-color: rgba(255,255,255,0.66); /* semi-transparent white */
	color: black;
	display: flex; /* allows us to center contents */
	align-items: center;
	justify-content: center;
	border-radius: 2px;
}
#alerts .more-toggle:hover .icon {
	cursor: pointer;
	text-decoration: none;
	background-color: black;
	color: white;
}
#alerts .more-toggle .icon:after {
	font-size: smaller;
	position: relative;
	top: 2px; /* minor adjustment to vertical center */
	content: "\25BC";  /* add down caret */
}
#alerts .expanded .more-toggle .icon:after {
	top: 1px; /* minor adjustment to vertical center */
	content: "\25B2";  /* add up caret */
}