/* ---------------------------
    #base
--------------------------- */

*, *::before, *::after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}

html, body {
	width: 100%;
	min-height: 100%;
	margin: 0;
	padding: 0;
	color: #000;
	font-family: 'Helvetica', 'Arial', sans-serif;
	font-size: 12px;
	line-height: 1.75;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background: #eeeff4;
}

main {
	padding: 0 0 40px;
	background-color: #eeeff4;
}

h1 {
	margin: 0 0 15px;
	padding: 10px 0 0 0;
}

.header--secondary {
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
}

@media only screen and (min-width: 600px) {
	.header--inline {
		display: inline-block;
		margin-right: 10px;
	}
}

footer {
	clear: both;
	padding: 30px 0 0 0;
	font-size: 0.85em;
	font-style: italic;
}

a {
	color: #a04440;
}

a:hover {
	opacity: 0.8;
}

.clear {
	clear: both;
}

.container {
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 15px;
}

.container::after {
	content: '';
	display: table;
	clear: both;
}

/* .primary { */
	/* overflow: hidden; */ /* TODO: Is this necessary? */
/* } */

.primary::after {
	content: '';
	display: table;
	clear: both;
}

.list--plain {
	margin: 0;
	padding: 0;
	list-style: none;
}

.js--toggle-tgt {
	display: none;
	clear: both;
	padding: 10px 0 20px;
}

.right {
	float: right;
}

.left {
	float: left;
}


/* ---------------------------
    #grid
--------------------------- */

.cols--3 {
	margin-right: -10px;
	margin-left: -10px;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.cols--3 .col {
	float: left;
	width: 33.3333333%;
	width: calc(100%/3);
	padding: 0 10px;
}


/* ---------------------------
    #icons
--------------------------- */

.i--alert {
	display: inline-block;
	width: 18px;
	height: 18px;
	vertical-align: middle;
	background: url('/Images/alert-circle.png') no-repeat 0 0;
	background-size: 18px 18px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	opacity: 0.7;
}


/* ---------------------------
    #logo
--------------------------- */

.logo {
	float: left;
	padding: 10px 0 0 0;
}

.logo--img {
	display: block;
	margin: 0;
	padding: 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.logo--img a {
	display: block;
}


/* ---------------------------
    #forms
--------------------------- */

::-webkit-input-placeholder {
	text-transform: uppercase;
}

:-moz-placeholder {
	text-transform: uppercase;
}

::-moz-placeholder {
	text-transform: uppercase;
}

:-ms-input-placeholder {
	text-transform: uppercase;
}

input[type="text"], input[type="password"], input[type="number"], input[type="search"], textarea, input[type="email"], input[type="tel"] {
	width: 100%;
	max-width: 250px;
	padding: 7px;
	font-size: 0.9em;
	line-height: 1;
	border: 1px solid #ededed;
	border-radius: 2px;
	transition: box-shadow 0.2s;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="search"]:focus, textarea:focus, input[type="email"]:focus, input[type="tel"]:focus {
	outline: none;
	box-shadow: 0 0 2px 1px #ffe57c, 0 0 2px 1px #ffe57c;
}

input.input--readonly, input[readonly] {
	font-weight: bold;
	border-color: transparent;
}

input.input--readonly:focus, input[readonly]:focus {
	box-shadow: none;
}

.input--narrow {
	max-width: 12em;
}

.input--date {
	max-width: 100%;
}

.label--block {
	display: block;
	padding: 8px 0;
	line-height: 1;
}

.label--inline {
	display: inline-block;
	margin: 0 5px 0 0;
	padding: 5px 0;
}

.label--inline input[type="radio"], .label--inline input[type="checkbox"] {
	vertical-align: top;
}

.faux-input {
	display: block;
	width: 250px;
	padding: 7px;
	font-size: 0.9em;
	border: 1px solid #ededed;
	border-radius: 2px;
}

.faux-input--filled {
	color: inherit;
	font-weight: bold;
	text-decoration: none;
}

.form--list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.form--list > li {
	margin: 0 0 5px;
}

.block--wysiwyg {
	width: 100%;
}

.block--scroll {
	display: block;
	max-height: 125px;
	overflow-y: auto;
}



/* ---------------------------
    #buttons
--------------------------- */

.button {
	display: inline-block;
	padding: 7px 14px;
	color: #464646;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
	background: #f7f7f7;
	border: 1px solid #e2e2e2;
	border-radius: 2px;
	box-shadow: 0 0 3px 0 #e2e2e2;
	cursor: pointer;
}

.button--clicked {
	background: #7fff7f;
}

.button--small {
	padding: 4px 8px;
}

.button--primary {
	background: #ffe57c; /* TODO: Primary Color */
}

.button--text {
	padding: 7px;
	color: #cd6560;
	font-size: 0.9em;
	text-transform: none;
	background: none;
	border: none;
	box-shadow: none;
}

.button--text:hover {
	text-decoration: underline;
}


/* ---------------------------
    #site-nav
--------------------------- */

.toggle-wrap {
	position: relative;
}

.site-nav--visible {
	position: relative;
	left: 250px;
	overflow: hidden;
}

.site-nav--visible header .site-nav__list {
	left: 0;
}

.site-nav__toggle {
	position: absolute;
	top: 10px;
	left: 10px;
	display: block;
	width: 18px;
	height: 14px;
	border-bottom: 2px solid #fff;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
}

.nav-toggle__top {
	display: block;
	position: absolute;
	top: 0;
	height: 2px;
	width: 100%;
	background: #fff;
}

.nav-toggle__middle {
	display: block;
	position: absolute;
	bottom: 4px;
	width: 100%;
	height: 2px;
	background: #fff;
}

/*.site-nav {
	clear: both;
	width: 100%;
	margin: 15px 0 0;
	background: #f8f5f6;
	border-top: 1px solid #e1e1e1;
	border-bottom: 1px solid #e1e1e1;
}

.site-nav__list {
	display: table;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.site-nav__list > li {
	float: left;
}

.site-nav__list a {
	display: block;
	padding: 15px 20px;
	color: #464646;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 0.2s, color 0.2s;
}*/
.site-nav__list {
	position: fixed;
	top: 0;
	left: -250px;
	bottom: 0;
	width: 250px;
	margin: 0;
	padding: 0;
	list-style: none;
	background: #f8f5f6;
	border-right: 1px solid #e1e1e1;
}

.site-nav__list a {
	display: block;
	padding: 10px 15px;
	color: #464646;
	font-weight: bold;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 0.2s, color 0.2s;
}

.site-nav__list .site-nav--active, .site-nav__list .site-nav--active:hover {
	color: #fff;
	background: #005a9e;
}

.site-nav__list a:hover {
	color: #fff;
	background: #005a9e;
}

@media only screen and (min-width: 880px) {
	.site-nav__toggle {
		display: none;
	}

	.site-nav {
		clear: both;
		width: auto;
		margin: 15px 0 0;
		background: #f8f5f6;
		border-top: 1px solid #e1e1e1;
		border-bottom: 1px solid #e1e1e1;
	}

	.site-nav__list, .sub-nav__list {
		width: 100%;
		max-width: 1200px;
		margin: 0 auto;
	}

	/* .site-nav__list {
		position: static;
		display: table;
		width: auto;
		margin: 0 auto;
		border: none;
	} */

	/* .site-nav__list > li {
		float: left;
	} */
	
	/* .site-nav__list a {
		padding: 15px 20px;
		text-align: center;
	} */
	
	.site-nav__list {
		position: static;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		width: auto;
		margin: 0 auto;
		padding: 0;
		list-style: none;
		border: none;
	}

	.site-nav__list > li {
		flex: 0 1 auto;
	}

	.site-nav__list a {
		padding: 15px;
		text-align: center;
	}
	
	.site-nav {

	}
}


/* ---------------------------
    #sub-nav
--------------------------- */

/* TODO: Primary Color */
/*.sub-nav {
	background: #ffeda3;
}*/

.sub-nav__list {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.sub-nav__list > li {
	float: left;
}

.sub-nav__list a {
	display: block;
	padding: 6px 8px;
	color: #333;
	font-size: 0.95em;
	line-height: 1.25;
	text-decoration: none;
}

.sub-nav__list .sub-nav--active {
	font-weight: bold;
}

@media only screen and (min-width: 880px) {
	.sub-nav__list a {
		padding: 7px 10px;
		font-size: 1em;
		line-height: 1.5;
	}
}


/* ---------------------------
    #user-nav
--------------------------- */

/*.user {
	float: right;
	padding: 15px 0 10px;
}*/
.user {
	float: right;
	padding: 0 10px;
	text-align: right;
}

.user__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.user__list > li {
	float: left;
}

.user__list > .user__welcome {
	float: none;
	font-weight: bold;
}

.user__list > li::after {
	content: '\00a0|\00a0';
}

.user__list > .user__welcome::after, .user__list > li:last-child::after {
	content: '';
}

.user__list a {
	display: inline-block;
	font-size: 0.9em;
	text-decoration: none;
}

@media only screen and (min-width: 770px) {
	.user {
		position: absolute;
		top: 10px;
		right: 0;
		bottom: 0;
		float: none;
	}
}


/* ---------------------------
    #unfinished-requests
--------------------------- */

.unfinished {
	float: right;
	clear: right;
}

.unfinished__text {
	color: #cd6560; /* TODO: Primary Color */
	text-decoration: none;
	text-transform: uppercase;
}

.unfinished__count {
	display: inline-block;
	padding: 0.5em;
	color: #fff;
	line-height: 0.5;
	background: #cd6560; /* TODO: Primary Color */
	border-radius: 100%;
}


/* ---------------------------
    #header-alert
--------------------------- */

.alert {
	position: absolute;
	right: 0;
	bottom: 5px;
	padding: 5px;
	font-size: 0.9em;
	background: #ffff00;
}

.alert h2 {
	display: inline;
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
}

.alert h2::after {
	content: ':';
}

.alert p {
	display: inline;
	color: #333;
	font-weight: bold;
}


/* ---------------------------
    #vendor-select
--------------------------- */

.vendor-select {
	padding-top: 15px;
}

.vendor-select h2 {
	margin: 0 0 5px;
	padding: 0;
	font-size: 1em;
}


/* ---------------------------
    #basic-table
--------------------------- */

.table {
	width: 100%;
	color: #333;
	font-size: 12px;
	border-collapse: collapse;
}

.table th, .table td {
	padding: 3px;
	font-weight: normal;
	text-align: left;
}

.table--top th, .table--top td {
	vertical-align: top;
}

.table .cell--right {
	text-align: right;
}

.table thead th {
	font-weight: bold;
/*	background: #f9f9f9;*/
	background: #eaeaea; /* Old browsers */
	background: -moz-linear-gradient(top,  #fcfcfc 0%, #eaeaea 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#eaeaea)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #fcfcfc 0%,#eaeaea 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #fcfcfc 0%,#eaeaea 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #fcfcfc 0%,#eaeaea 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #fcfcfc 0%,#eaeaea 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#eaeaea',GradientType=0 ); /* IE6-9 */
}

.table tbody tr:nth-child(even) td, .table tbody tr:nth-child(even) th {
	background: #f2f2f2;
}

.table .row--highlight td, .table .cell--highlight {
	background: #ffeda3 !important;
}

.table .row--error td, .table .row--error a {
	color: #aaa;
	font-style: italic;
	/*background: rgba(125, 0, 0, 0.1);*/
}

.table .row--total td, .table .row--total th {
	font-weight: bold;
	border-top: 1px solid #aaa;
}

.table .button {
	margin-top: 2px;
	margin-bottom: 2px;
}

.no-results {
	font-size: 1.1em;
	font-weight: bold;
}

.border-left {
	/* border-left: 1px solid #dcdcdc; */
}

.border-right {
	/* border-right: 1px solid #dcdcdc; */
}

.survey-results {
	width: auto;
	table-layout: fixed;
	border-collapse: separate;
}

.survey-results th, .survey-results td {
	width: 4em;
	/* padding: 6px 8px; */
	padding: 2px;
}

.survey-results th {
	font-weight: bold;
}

.survey-results .question-cell {
	width: 35%;
}

/* .cell--positive {
	color: #11c330;
} */

.cell--negative {
	color: #dc3e3e;
}


/* ---------------------------
    #scrollable-table
--------------------------- */

.table-wrapper {
	max-height: 135px;
	margin: 0 0 25px;
	border: 1px solid #ddd;
	overflow-y: auto;
}

.table-wrapper--tall {
	max-height: 435px;
}

.table-wrapper--resize {
	max-height: none;
	height: 135px;
	resize: vertical;
}

.table-wrapper--tall.table-wrapper--resize {
	height: 435px;
}


.table-wrapper .no-results {
	margin: 0;
	padding: 5px 10px;
}


/* ---------------------------
    #dashboard
--------------------------- */

.header--dashboard {
	margin: 0;
	padding: 0;
	font-size: 1.4em;
}


/* ---------------------------
    #survey-results
--------------------------- */

.survey-results th, .survey-results td {
	line-height: 1.25;
	text-align: right;
}

/* .survey-results tbody th {
	padding-top: 30px;
} */

.survey-results tbody tr:nth-child(even) td, .survey-results tbody tr:nth-child(even) th {
	background: #fff;
}

.survey-results tbody tr.row--alt td {
	background: #f2f2f2;
}

.empty-row td {
	height: 70px;
}

.survey-results tbody tr:first-child th {
	padding-top: 5px;
}

.survey-answers li {
	clear: both;
	padding: 5px 0;
	border-bottom: 1px solid #ddd;
	overflow: hidden;
}

.survey-answers li:last-child {
	border-bottom: none;
}

.survey-answers .question, .survey-answers .answer {
	float: left;
	width: 50%;
	padding: 0 10px;
}

.survey-answers .question {
	text-align: right;
}

.demo {
	clear: both;
	margin: 15px 0;
	/* padding: 15px; */
	/* background: #efefef; */
	overflow: hidden;
}

.demo .left, .demo .right {
	width: 49%;
}

.demo h2 {
	margin: 0;
	padding: 0 0 0.25em;
}


/* ---------------------------
    #course-criteria
--------------------------- */

@media only screen and (min-width: 720px) {
	.course-criteria {
		float: right;
		/* width: 265px; */
		margin-left: 15px;
		overflow: hidden;
	}
}

.course-criteria .edit-form .left {
	width: 75px;
}

.course-criteria .edit-form .right {
	width: 150px;
}

.course-criteria input[type="text"] {
	width: 100%;
}


/* ---------------------------
    #edit-form
--------------------------- */

.edit-form .left, .edit-form .right, .edit-form.left, .edit-form.right {
	float: none;
}

.edit-form {
	margin: 0;
	padding: 0;
	list-style: none;
}

.edit-form > li {
	clear: both;
	margin: 0 0 1em;
	min-height: 3em;
}

.edit-form > li::after {
	content: '';
	display: table;
	clear: both;
}

.edit-form label {
	display: block;
	padding: 0 0 3px;
	font-size: 1.15em;
	font-weight: bold;
}

.edit-form .custom-select {
	width: 100%;
	max-width: 400px;
}

.form-separator {
	clear: both;
	height: 1px;
	margin-bottom: 30px;
	border-top: 1px solid #ccc;
}

.edit-actions {
	clear: left;
	padding-top: 10px;
}

.edit-form__address input {
	margin-bottom: 5px;
}

@media only screen and (min-width: 800px) {
	.primary {
		float: left;
		width: 60%;
		padding: 0 10px 0 0;
	}

	.edit-form {
		padding-top: 15px;
	}

	.edit-form .custom-select {
		width: auto;
	}

	.edit-form .left {
		float: left;
		width: 33.3333333%;
	}

	.edit-form .right {
		float: right;
		width: 66.6666666%;
	}

	.edit-form label {
		font-size: 1em;
		padding: 8px 0;
	}

	.edit-form.right, .edit-form.left {
		width: 50%;
	}

	.edit-form.right {
		float: right;
	}

	.edit-form.left {
		clear: both;
		float: left;
	}

	.edit-form.left .left, .edit-form.left .right, .edit-form.right .left, .edit-form.right .right {
		float: none;
	}

	.edit-form.left .right .form-value, .edit-form.right .right .form-value {
		padding-right: 0;
		padding-left: 0;
	}

	.edit-form.left .label--block, .edit-form.right .label--block {
		padding: 0 0 3px;
		line-height: 1;
	}
}


/* ---------------------------
    #input-types
--------------------------- */

.edit-form .input--city {
	float: left;
	width: 46%;
	margin: 0 1% 5px 0;
}

.edit-form .input--state {
	float: left;
	width: 20%;
	margin: 0 1% 5px;
}

.edit-form .input--zip {
	float: left;
	width: 30%;
	margin: 0 0 0 1%;
}

.edit-form__group {
	display: block;
	max-width: 250px;
	overflow: hidden;
}

.input--cost, .edit-form .input--cost {
	max-width: 75px;
	text-align: right;
}

.input--date, .edit-form .input--date {
	max-width: 90px;
}

.edit-form .input--name {
	width: 49%;
}


/* ---------------------------
    #tabs
--------------------------- */

.tabs {
	margin: 30px 0;
	overflow: hidden;
}

.tabs__nav {
	position: relative;
	z-index: 20;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tabs__nav > li {
	float: left;
	margin: 0 5px 0 0;
}

.tabs__link {
	display: block;
	margin: 0 0 -2px 0;
	padding: 10px 20px;
	line-height: 1;
	border: 1px solid transparent;
	border-bottom-width: 2px;
	border-radius: 3px 3px 0 0;
}

.tabs__link--active {
	color: #333;
	text-decoration: none;
	background: #fff;
	border-color: #ddd #ddd #fff #ddd;
}

.tabs__content {
	display: none;
	clear: both;
	position: relative;
	z-index: 10;
	padding: 10px 20px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 0 0 3px 3px;
}

.tabs__content--active {
	display: block;
}


/* ---------------------------
    #filters
--------------------------- */

.filters-wrap {
	display: inline-block;
}

.button--filter {
	margin: 0 0 10px;
}

.filters {
	display: none;
	width: 96%;
	max-width: 400px;
	margin: 0 0 10px;
	padding: 10px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 3px;
	box-shadow: 1px 1px 3px 2px rgba(0, 0, 0, 0.1);
}

.filters::after, .filters::before {
	bottom: 100%;
	left: 8.5%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.filters::before {
	border-color: rgba(221, 221, 221, 0);
	border-bottom-color: #ddd;
	border-width: 16px;
	margin-left: -16px;
}

.filters::after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #fff;
	border-width: 15px;
	margin-left: -15px;
}


.filters--active {
	display: block;
	position: absolute;
	right: 2%;
	left: 2%;
	z-index: 100;
}

.filters-wrap--sidebar {
	float: right;
}

.sidebar .filtered--header {
	margin-top: 15px;
}

.filters-wrap--sidebar .filters--active {
	left: auto;
	z-index: 1100;
}

.filters-wrap--sidebar .filters::after, .filters-wrap--sidebar .filters::before {
	right: 2.5%;
	left: auto;
}

.filters__list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	overflow: hidden;
	margin: 0 -5px;
}

.filters__list > div {
	width: 50%;
	padding: 0 5px 10px;
}

/* .filters__list {
	margin: 0 -10px;
	overflow: hidden;
}

.filters__list > div {
	float: left;
	width: 50%;
	padding: 0 10px 10px;
}

.filters__list > div:nth-child(2n+1) {
	clear: both;
} */

.filters__list .custom-select {
	margin-top: 0;
	width: 100%;
}

.filters__actions {
	padding-top: 5px;
}

.filters__list > .filter-date {
	/* clear: both; */
	width: 100%;
}

.filter-date {
	overflow: hidden;
}

.filter-date > label {
	float: left;
	width: 50%;
	padding: 0 5px;
}

.filter-date > label:first-child {
	padding-left: 0;
}

.filter-date > label:last-child {
	padding-right: 0;
}

/* .filters input[type="text"], .filters input[type="search"] {
	width: 100%;
	margin: 10px 0 0;
}

.filters input[type="text"]:first-child, .filters input[type="search"]:first-child {
	margin-top: 0;
}

.filters .filter-selects {
	margin: 10px -5px;
	overflow: hidden;
}

.filters .filter-select {
	float: left;
	width: 33.3333333333%;
	padding: 0 5px;
}

.filters .filter-select--full {
	width: 100%;
	padding: 0 5px;
}

.filter-select--full .custom-select {
	width: 100%;
}

.filter-select .custom-select {
	display: block;
	margin-top: 0;
}

.filter-date {
	padding: 0 0 10px;
	overflow: hidden;
}

.filter-date h2 {
	clear: both;
	margin: 0;
	padding: 0 0 5px;
	font-size: 1em;
	line-height: 1;
}

.filter-date label {
	display: block;
	float: left;
	width: 50%;
}

.filter-date label:first-child {
	padding-right: 10px;
}
.filter-date label:last-child {
	padding-left: 10px;
} */


/* ---------------------------
    #reports
--------------------------- */

.reports-wrap {
	display: inline-block;
}

.reports {
	display: none;
	width: 96%;
	max-width: 400px;
	margin: 0 0 10px;
	padding: 10px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 3px;
	box-shadow: 1px 1px 3px 2px rgba(0, 0, 0, 0.1);
}

.reports::after, .reports::before {
	bottom: 100%;
	left: 8.5%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.reports::before {
	border-color: rgba(221, 221, 221, 0);
	border-bottom-color: #ddd;
	border-width: 16px;
	margin-left: -16px;
}

.reports::after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #fff;
	border-width: 15px;
	margin-left: -15px;
}

.reports--active {
	display: block;
	position: absolute;
	left: 8%;
	z-index: 100;
}

/* ---------------------------
    #sidebar
--------------------------- */

.sidebar h2 {
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
}

.sidebar {
	padding: 15px 0 30px;
}

@media only screen and (min-width: 800px) {
	.sidebar {
		float: right;
		width: 40%;
		/* margin: -30px 0 0 0; */
		padding: 0 0 0 10px;
	}
}


/* ---------------------------
    #recommended-educators
--------------------------- */

.recommended-ed {
	overflow: hidden;
}

.educator-map {
	width: 100%;
	height: 175px;
}

@media only screen and (min-width: 600px) {
	.educator-table, .educator-map {
		float: left;
		width: 50%;
	}

	.educator-table {
		padding: 0 10px 0 0;
	}

	.educator-map {
		padding: 0 0 0 10px;
	}
}

@media only screen and (min-width: 800px) {
	.educator-table, .educator-map {
		float: none;
		width: auto;
		padding: 0;
	}

	.educator-map {
		height: 275px;
	}
}


/* ---------------------------
    #pagination
--------------------------- */

.pagination {
	display: flex;
	align-items: center;
	margin: 10px 0;
}

.pagination a {
	display: block;
	float: left;
	margin: 0 0 5px;
	padding: 2px;
	width: 2.25em;
	text-align: center;
	text-decoration: none;
	border: 1px solid #ddd;
	background: #fff;
}

.pagination .active, .pagination .inactive {
	color: inherit;
	font-weight: bold;
}

.pagination .prev, .pagination .next {
	width: 4em;
}

.pagination .prev {
	margin: 0 10px 5px 0;
}

.pagination .next {
	margin: 0 0 5px 10px;
}

.pagination ol {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.pagination li {
	display: inline;
}


/* ---------------------------
    #tooltip
--------------------------- */

.tooltip {
	position: relative;
	background: #fff;
	border: 1px solid #ddd;
	overflow: visible;
}

.tooltip::before, .tooltip::after {
	content: '';
	position: absolute;
	bottom: 100%;
	left: 70%;
	width: 0;
	height: 0;
	border: solid transparent;
	pointer-events: none;
}

.tooltip::before {
	margin-left: -21px;
	border-width: 21px;
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #ddd;
	border-radius: 3px;
}

.tooltip::after {
	margin-left: -20px;
	border-width: 20px;
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #fff;
}


/* ---------------------------
    #request-popup
--------------------------- */

.request-popup {
	/*display: inline-block;*/
	display: none;
	position: absolute;
	right: 0;
	z-index: 2000;
	padding: 35px 10px 10px;
	border: 1px solid #ddd;
	border-radius: 3px;
}

.request-popup__close {
	position: absolute;
	top: 0;
	right: 15px;
	font-size: 1.5em;
	font-weight: bold;
	text-decoration: none;
}

.request-popup__bio, .request-popup__cal {
	float: left;
}

.request-popup__bio {
	width: 225px;
}

.request-popup__cal {
	width: 425px;
	text-align: center;
}


/* ---------------------------
    #autocomplete-popup
--------------------------- */

.tt-menu {
	width: 100%;
	border: 1px solid #dedede;
	margin: 12px 0;
	background: #fff;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
}

.tt-suggestion {
	padding: 5px 10px;
}

.tt-suggestion:hover, .tt-suggestion.tt-cursor {
	background: #ffeda3;
}

.tt-hint {
	color: #aaa;
}


/* ---------------------------
    #custom-select
--------------------------- */

.custom-select {
	position: relative;
	margin-top: 0.5em;
	padding: 0;
}

.custom-select select {
	width: 100%;
	margin: 0;
	padding: 0.6em 1.9em 0.5em 0.8em;
	color: #444;
	font-size: 1em;
	font-family: helvetica, sans-serif;
	font-weight: bold;
	line-height:1.3;
	background: none;
	border: 1px solid transparent;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.custom-select::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 1em;
	z-index: 2;
	width: 9px;
	height: 8px;
	margin-top: -4px;
	background-image: url('/Images/select-arrow.png');
	background-repeat: no-repeat;
	background-size: 100%;
	pointer-events: none;
}

.custom-select:hover {
	border:1px solid #888;
}

.custom-select select:focus {
	color: #222;
	background-color:transparent;
	border-color: transparent;
	box-shadow: 0 0 2px 1px #ffe57c, 0 0 2px 1px #ffe57c;
	outline: none;
}

.custom-select option {
	font-weight:normal;
}

x:-o-prefocus, .custom-select::after {
	display:none;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.custom-select select::-ms-expand {
		display: none;
	}

	.custom-select select:focus::-ms-value {
		color: #222;
		background: transparent;
	}
}

@-moz-document url-prefix() {
	/* .custom-select {
		overflow: hidden;
	} */

	.custom-select select {
		width: 120%;
		width: -moz-calc(100% + 3em);
		width: calc(100% + em);
	}
}

.custom-select select:-moz-focusring {
	color: transparent;
	text-shadow: 0 0 0 #000;
}


/* ---------------------------
    #multiselect
--------------------------- */

.js--multiselect {
	position: relative;
}

.js--multiselect .button {
	width: 100%;
}

.multiselect__options {
	display: none;
	position: absolute;
	z-index: 3;
	width: 120%;
	max-height: 200px;
	margin-left: -1px;
	padding: 2px 6px 0 2px;
	background: #f7f7f7;
	border: 1px solid #e2e2e2;
	box-shadow: 0 0 3px 0 #e2e2e2;
	overflow-y: auto;
}

.multiselect--customscroll {
	max-height: none;
	overflow-y: visible;
}

.multiselect--customscroll .multiselect__scroll {
	max-height: 200px;
	overflow-y: auto;
}

.multiselect__options > label {
	display: block;
	clear: both;
	margin: 3px 0 12px;
	padding: 0;
}

.multiselect__options > label input[type="checkbox"], .multiselect__options .multiselect__scroll input[type="checkbox"] {
	float: left;
	margin-top: 0;
}

.multiselect--active .multiselect__options {
	display: block;
}

.custom-select .faux-input {
	width:100%;
	margin:0;
	background:none;
	border: 1px solid transparent;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size:1em;
	font-family: helvetica, sans-serif;
	font-weight: bold;
	color: #444;
	padding: 0.6em 1.9em 0.5em 0.8em;
	line-height:1.3;
}

@media only screen and (min-width: 800px) {
	.js--multiselect {
		max-width: 275px;
	}
}


/* ---------------------------
    #login-page
--------------------------- */

.login__banner {
	width: 100%;
}

.login__banner img {
	display: block;
	width: 100%;
	height: auto;
}

.login__content {
	margin: 0 auto;
	padding: 15px;
}

.login__form {
	margin-bottom: 30px;
}

.login__form input[type="text"], .login__form input[type="password"] {
	width: 100%;
}

.login__form h2 {
	margin: 0;
	padding: 0 0 5px;
	font-size: 0.9em;
}

.login__articles {
	clear: both;
	margin-bottom: 0;
	padding: 30px 0 0 0;
	list-style: none;
}

.login__articles + .login__articles {
	padding-top: 0;
}

.login__articles > li {
	padding-bottom: 30px;
}

.login__articles h2 {
	margin: 10px 0 5px;
	padding: 0;
	font-size: 1.25em;
	line-height: 1.25;
}

.login__articles p {
	margin: 0 0 15px;
	padding: 0;
}

.login__articles img {
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}

.login__read-more::after {
	content: '\00a0>'
}

@media only screen and (min-width: 460px) {
	.login__form {
		float: right;
		width: 50%;
		padding: 0 0 0 10px;
	}

	.login__text {
		float: left;
		width: 50%;
		padding: 0 10px 0 0;
	}

	.login__articles > li {
		overflow: hidden;
	}

	.login__articles img {
		float: left;
		width: 33.33333333%;
		margin-right: 10px;
	}

	.login__articles-content {
		overflow: hidden;
	}
}

@media only screen and (min-width: 770px) {
	.login__form {
		width: 33.33333333%;
	}

	.login__text {
		width: 66.66666666%;
	}

	.login__articles {
		overflow: hidden;
		margin: 0 -15px;
	}

	.login__articles > li {
		float: left;
		width: 33.3333333333%;
		padding: 0 15px 30px;
	}

	.login__articles img {
		float: none;
		width: 100%;
	}

	.login__articles--quarters > li {
		width: 25%;
	}

	.login__articles--half {
		max-width: 1000px;
		margin: 0 auto;
	}

	.login__articles--half > li {
		width: 50%;
		margin-bottom: 30px;
	}

	.login__articles--half > li:nth-child(2n+1) {
		clear: both;
	}
}

@media only screen and (min-width: 770px) {
	.login__articles--center {
		width: 66.66666%;
		margin: 0 auto;
	}

	.login__articles--center > li {
		width: 50%;
	}
}

@media only screen and (min-width: 15000px) {
	/*.login__form {
		float: right;
		width: 33.33333333%;
		padding: 0 0 0 15px;
	}

	.login__text {
		float: left;
		width: 66.66666666%;
		padding: 0 10px 0 0;
	}*/
}


/* ---------------------------
    #calendar
--------------------------- */

.calendar__wrap {
	display: inline-block;
	overflow: hidden;
}

.sidebar .calendar tbody td {
	padding: 5px 35px 20px 5px;
}

.calendar {
	float: left;
	width: 100%;
	margin: 0 0 10px;
	font-size: 0.9em;
	border-collapse: collapse;
	table-layout: fixed;
}

.calendar th {
	padding: 5px;
	font-size: 1em;
	font-weight: normal;
	background: #ccc;
	border: 1px solid #ccc;
}

.calendar tbody td {
	padding: 5px 40px 25px 5px;
	font-size: 1em;
	text-align: left;
	vertical-align: top;
	border: 1px solid #ccc;
	cursor: pointer;
}

.calendar .cell--empty {
	background: #efefef;
	cursor: default;
}

.calendar .cell--busy {
	background: #f9dada;
}

.calendar .cell--busy-preferred {
	background: linear-gradient(35deg, #f9dada 0%, #f9dada 79%, #ffa0a0 80%, #ffa0a0 100%);
}

.calendar .cell--busy-empty {
	background: linear-gradient(35deg, #f9dada 0%, #f9dada 49%, #ffffff 51%, #ffffff 100%);
}

.calendar .cell--empty-busy {
	background: linear-gradient(35deg, #ffffff 0%, #ffffff 49%, #f9dada 51%, #f9dada 100%);
}

.calendar .cell--busy-scheduled {
	background: linear-gradient(35deg, #f9dada 0%, #f9dada 49%, #ffeda3 51%, #ffeda3 100%);
}

.calendar .cell--scheduled-busy {
	background: linear-gradient(35deg, #ffeda3 0%, #ffeda3 49%, #f9dada 51%, #f9dada 100%);
}

.calendar .cell--scheduled-scheduled {
	background: linear-gradient(35deg, #ffeda3 0%, #ffeda3 47% , #c0c0c0 49%, #c0c0c0 51%, #ffeda3 53%, #ffeda3 100%);
}

.calendar .cell--empty-scheduled {
	background: linear-gradient(35deg, #ffffff 0%, #ffffff 49%, #ffeda3 51%, #ffeda3 100%);
}

.calendar .cell--scheduled-empty {
	background: linear-gradient(35deg, #ffeda3 0%, #ffeda3 49%, #ffffff 51%, #ffffff 100%);
}

.calendar .date--selected {
	border: 1px red solid;
}

.calendar .cell--scheduled {
	background: #c8e7ff;
	cursor: default;
}

.calendar__notes {
	float: left;
	padding: 0 0 0 10px;
}

.calendar__wrap h2 {
	margin: 10px 0 5px;
	padding: 0;
	font-size: 1em;
}

.calendar-controls {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

.calendar-control {
	flex: 1;
}

.calendar-left {
	text-align: left;
}

.calendar-center {
	flex: 2;
	text-align: center;
}

.calendar-right {
	text-align: right;
}

.calendar__legend {
	overflow: hidden;
	margin: 0 -5px;
	padding: 5px 0;
}

.legend__item {
	float: left;
	width: 33.33333333%;
	padding: 0 5px;
}

.legend__swatch {
	display: inline-block;
	width: 11px;
	height: 11px;
	margin-right: 2px;
	border: 1px solid #aaa;
}

.legend__swatch--available { background: #fff; }
.legend__swatch--booked { background: #ffeda3; }
.legend__swatch--unavailable { background: #f9dada; }

.cell-border {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border: 2px solid red;
}

.calendar .date--selected {
	border: 2px solid red;
}

.date--delete {
	position: absolute;
	display: none;
	top: -10px;
	right: -10px;
	z-index: 2000;
	line-height: 0.5;
	height: 1.75em;
	width: 1.75em;
	border: 1px solid #aaa;
	background: #fff;
	font-weight: bold;
	text-align: center;
	border-radius: 100%;
}

/* ---------------------------
    #pikaday
--------------------------- */

/*!
 * Pikaday
 * Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
 */

 .pika-single {
	z-index: 9999;
	display: block;
	position: relative;
	color: #333;
	background: #fff;
	border: 1px solid #ccc;
	border-bottom-color: #bbb;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*
clear child float (pika-lendar), using the famous micro clearfix hack
http://nicolasgallagher.com/micro-clearfix-hack/
*/
.pika-single:before,
.pika-single:after {
    content: " ";
    display: table;
}
.pika-single:after { clear: both }
.pika-single { *zoom: 1 }

.pika-single.is-hidden {
    display: none;
}

.pika-single.is-bound {
    position: absolute;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
}

.pika-lendar {
    float: left;
    width: 240px;
    margin: 8px;
}

.pika-title {
    position: relative;
    text-align: center;
}

.pika-label {
    display: inline-block;
    *display: inline;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
    background-color: #fff;
}
.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    filter: alpha(opacity=0);
    opacity: 0;
}

.pika-prev,
.pika-next {
    display: block;
    cursor: pointer;
    position: relative;
    outline: none;
    border: 0;
    padding: 0;
    width: 20px;
    height: 30px;
    /* hide text using text-indent trick, using width value (it's enough) */
    text-indent: 20px;
    white-space: nowrap;
    overflow: hidden;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 75% 75%;
    opacity: .5;
    *position: absolute;
    *top: 0;
}

.pika-prev:hover,
.pika-next:hover {
    opacity: 1;
}

.pika-prev,
.is-rtl .pika-next {
    float: left;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==');
    *left: 0;
}

.pika-next,
.is-rtl .pika-prev {
    float: right;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=');
    *right: 0;
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
    cursor: default;
    opacity: .2;
}

.pika-select {
    display: inline-block;
    *display: inline;
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.pika-table th,
.pika-table td {
    width: 14.285714285714286%;
    padding: 0;
}

.pika-table th {
    color: #999;
    font-size: 12px;
    line-height: 25px;
    font-weight: bold;
    text-align: center;
}

.pika-button {
    cursor: pointer;
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 5px;
    color: #666;
    font-size: 12px;
    line-height: 15px;
    text-align: right;
    background: #f5f5f5;
}

.pika-week {
    font-size: 11px;
    color: #999;
}

.is-today .pika-button {
    color: #33aaff;
    font-weight: bold;
}

.is-selected .pika-button {
    /*color: #fff;*/
    color: #333;
    font-weight: bold;
    /*background: #33aaff;*/
    background: #ffe57c;
    /*box-shadow: inset 0 1px 3px #178fe5;*/
    border-radius: 3px;
}

.is-disabled .pika-button {
    pointer-events: none;
    cursor: default;
    color: #999;
    opacity: .3;
}

.pika-button:hover {
    /*color: #fff !important;*/
    /*background: #ff8000 !important;*/
    color: #333 !important;
    background: #ffe57c !important;
    box-shadow: none !important;
    border-radius: 3px !important;
}

/* styling for abbr */
.pika-table abbr {
    border-bottom: none;
    cursor: help;
}


/* ---------------------------
    #responsive-tables
--------------------------- */

@media only screen and (max-width: 767px) {
	.pinned {
		position: absolute;
		top: 0;
		left: 0;
		width: 35%;
		background: #fff;
		border-right: 1px solid #ccc;
		border-left: 1px solid #ccc;
		overflow: hidden;
		overflow-x: scroll;
	}

	.pinned table {
		width: 100%;
		border-right: none;
		border-left: none;
	}

	.pinned table th, .pinned table td {
		white-space: nowrap;
	}

	.pinned td:last-child {
		border-bottom: 0;
	}

	.resp-table-wrapper {
		position: relative;
		margin-bottom: 20px;
		border-right: 1px solid #ccc;
		overflow: hidden;
	}

	.resp-table-wrapper .scrollable {
		margin-left: 35%;
		overflow: scroll;
		overflow-y: hidden;
	}

	.table--scroll {
		max-width: 100%;
		overflow-y: auto;
	}

	.responsive td, .responsive th {
		/*position: relative;*/
		white-space: nowrap;
		/*overflow: hidden;*/
	}

	/*.responsive th:first-child, .responsive td:first-child, .responsive.pinned td {
		display: none;
	}*/
}


/* ---------------------------
    #modal-close-overlay
--------------------------- */

.modal-click {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #fff;
	opacity: 0;
}


/* ---------------------------
	#article-page
--------------------------- */

.article__page {
	max-width: 60em;
}

.article__page h1 {
	line-height: 1.25;
}

.article__page h2 {
	margin: 0;
	padding: 30px 0 0 0;
	font-size: 1.5em;
}

.article__page p {
	margin: 0;
	padding: 0 0 1.25em;
}


/* ---------------------------
	#cluster-select
--------------------------- */

.cluster-input-wrap {
	width: 100%;
	padding: 4px 8px;
	position: relative;
}

.cluster-input-wrap .cluster-input {
	max-width: none;
}

.cluster-submit {
	display: block;
	position: absolute;
	top: 0;
	right: 16px;
	bottom: 0;
	width: 12px;
	height: 12px;
	margin: auto;
	background: url('/Images/search.png') no-repeat 0 0;
	background-size: 12px 12px;
	border: none;
	font-size: 0;
	cursor: pointer;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

li.cluster-select__item {
	padding: 4px;
	overflow: hidden;
}

.cluster-select__item input {
	float: left;
	margin: 0 5px 0 0;
}

.cluster-select__item label {
	padding: 0;
	font-weight: normal;
}

.cluster-select__city, .cluster-select__id {
	font-size: 0.8em;
}

.cluster-select__city {
	display: block;
	padding-top: 2px;
}

.cluster-select__text {
	overflow: hidden;
}


/* ---------------------------
	#evaluation-edit
--------------------------- */

.eval-edit {
	margin: 0 0 20px;
	border-top: 1px solid #ddd;
}

.eval-edit > li {
	padding: 15px;
	border-bottom: 1px solid #ddd;
	overflow: hidden;
}

.eval-edit > li span {
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3;
	-ms-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.eval-edit > .question--todelete span {
	opacity: 0.4;
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3;
	-ms-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.question__section {
	float: left;
	width: 30%;
	padding: 0 5px;
}

.question__section--narrow {
	float: left;
	width: 10%;
	padding: 0 5px;
}

.label--delete {
	display: inline-block;
	clear: both;
	padding: 10px 5px 0;
	margin: 0;
}

.question__order {
	max-width: 3em !important;
	text-align: center;
}

.question__section .custom-select {
	margin-top: 0;
}


/* ---------------------------
	#errors
--------------------------- */

.errors {
	margin: 0 0 10px;
	padding: 10px;
	color: #333;
	border: 1px solid #e48c8c;
	background: #ffe9ec;
}

.errors h2 {
	margin: 0;
	padding: 0;
	font-size: 1.25em;
}

.errors p {
	margin: 5px 0 0 0;
	padding: 0;
}


/* ---------------------------
	#boxes
--------------------------- */

.box {
	padding: 15px;
	background: #fff;
	border: 1px solid #e2e2e2;
}

.box::after {
	content: '';
	display: table;
	clear: both;
}

.box--rounded {
	border-radius: 8px;
}

.box--spaced {
	margin-top: 30px;
}

.box .table-wrapper {
	margin-bottom: 0;
}

.box + .box {
	margin-top: 30px;
}


/* ---------------------------
	#new-edit-form
--------------------------- */

.input-form {
	margin: 0;
	padding: 0;
	list-style: none;
}

.input-form--edit {}

.input-form--view {}

.input-form__row {
	/* clear: both; */
	clear: left;
	padding-top: 1.25em;
	/* overflow: hidden; */
}

.input-form__row::after {
	content: '';
	display: table;
	clear: both;
}

.input-form__row:first-child {
	margin-top: 0;
}

.input-form .right, .input-form .left {
	float: none;
}

.input-form .label--block {
	font-weight: bold;
	line-height: 1.25;
}

.input-form .input-form__left {
	float: left;
	width: 33.333333333%;
}

.input-form .input-form__right {
	float: right;
	width: 66.666666666%;
}

.input-form.left, .input-form.right {
	width: 50%;
}

.input-form.right .input-form__left, .input-form.right .input-form__right,
.input-form.left .input-form__left, .input-form.left .input-form__right {
	float: none;
	width: 100%;
}

.input-form.left .form-value, .input-form.right .form-value, .input-form.left .label--block, .input-form.right .label--block {
	padding: 0;
}

.form-value {
	display: inline-block;
	padding: 8px;
	line-height: 1.25;
}

.input-form .input--date {
	max-width: 90px;
}

/* .form-value .custom-select {
	margin-top: 5px;
} */

#clusterSelect li {
	clear: both;
}

.form-value p {
	margin-top: 0;
}

.page-header {
	width: 100%;
}

.faux-table {
	display: table;
	width: 100%;
}

.faux-table li {
	display: table-row;
}

.course-criteria .faux-table .right, .course-criteria .faux-table .left {
	display: table-cell;
	float: none;
	width: auto;
	padding: 8px 0;
}

/* ---------------------------
    #multiSelectCalendar
--------------------------- */

.calendarMonth-wrap {
	position: absolute;
	min-width: 265px;
	background: #fff;
	border: 1px solid #ddd;
}

.calendarMonth {
    background-color: white;
    border: 1px solid #A0A0A0;
    padding: 8px;
    width: 240px;
    cursor: pointer;
    border: 1px solid #ccc;
    border-bottom-color: #bbb;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
}

.calendarMonth--month {
    width: 100%;
    border-collapse: collapse;
}

.calendarMonth--month th {
    border-collapse: collapse;
    border-spacing: 0;
    box-sizing: border-box;
    color: #999;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    height: auto;
    line-height: 25px;
    padding: 0px;
    vertical-align: middle;
    text-align: center;
}

.calendarMonth--date {
    border-collapse: collapse;
    border-spacing: 0;
    box-sizing: border-box;
    color: #666;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    height: auto;
    line-height: 15px;
    padding: 5px;
    vertical-align: middle;
    /* width: 32px; */
    width: 14.285714285714286%;
    background-color: #f8f8f8;
    text-align: right;
}

.calendarMonth--date-selected, .calendarMonth--date:hover {
    background-color: #fbe99f;
}

.calendarMonth--date-timeset {
    color: #333;
    font-weight: bold;
    background-color: #ffe57c;
}

.calendarMonth-prev {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==);
    width: 16px;
}

.calendarMonth-title {
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    font-weight: bold;
}

.calendarMonth-next {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=);
    width: 16px;
}

.calendarMonth-prev, .calendarMonth-next {
    width: 20px;
    height: 30px;
    background-size: 75% 75%;
    border: none;
    text-indent: 100%;
    white-space: nowrap;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0.5;
}

.calendarMonth-prev:hover, .calendarMonth-next:hover {
    opacity: 1;
}

.calendar--selected {
	background: rgba(0, 134, 199, 0.4);
}

.js--sortable thead th {
	text-decoration: underline;
	cursor: pointer;
}

.sorted--asc::after {
	content: '\00a0\25b2';
}

.sorted--desc::after {
	content: '\00a0\25bc';
}

.calendar .cell--preferred:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  top: 36px;
  left: 45px;
  border: 6px solid transparent;
  border-right: 6px solid #f0a0a0;
  border-bottom: 6px solid #ffa0a0;
}

.calendar-toggle, .calendar-toggle-link::before {
	display: inline-block;
	width: 16px;
	height: 16px;
	line-height: 1;
	background: url('/Images/calendar.png') no-repeat 0 0;
	background-size: 16px 16px;
	border: none;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	opacity: 0.7;
	cursor: pointer;
}

.calendar-toggle-link::before {
	content: '';
	margin-right: 5px;
	vertical-align: sub;
}

.calendar-toggle-link {
	font-weight: bold;
}

.datelist-date {
	margin-top: 5px;
}

.datelist-remove {
	display: inline-block;
	margin-right: 5px;
}


/* ---------------------------
	#dashboard-calendar
--------------------------- */

.dash-calendar {
	margin-top: 30px;
}

.calendar__table {
	width: 100%;
	border: 1px solid #ddd;
	border-radius: 4px;
	border-collapse: collapse;
	table-layout: fixed;
}

.calendar__table tr {
	display: block;
}

.calendar__cell {
	display: none;
	position: relative;
	padding: 10px 10px 10px 60px;
	background: #fff;
	border-bottom: 1px solid #ddd;
}

.calendar__no-events {
	margin-top: -2px;
	padding: 10px;
	background: #fff;
	border: 1px solid #ddd;
}

.calendar__cell--has-events {
	display: block;
}

.calendar__number {
	position: absolute;
	top: 5px;
	left: 10px;
	color: #ccc;
	line-height: 1;
	font-size: 32px;
}

.calendar__button {
	display: inline-block;
	width: 12px;
	height: 24px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: none;
	border: none;
	border-top: 12px transparent solid;
	border-bottom: 12px transparent solid;
	cursor: pointer;
}

.calendar__button--prev {
	border-right: 12px #888 solid;
}

.calendar__button--next {
	border-left: 12px #888 solid;
}

.calendar__title-wrap {
	margin-bottom: 5px;
	text-align: center;
}

.calendar__title {
	display: inline-block;
	margin: 0 auto;
}

.calendar__month {
	display: inline-block;
	width: 270px;
	margin: auto;
	font-size: 18px;
	text-align: center;
}

.calendar__popup {
	position: absolute;
	z-index: 200;
	padding: 5px;
	font-size: 0.9em;
	background: #fff;
	border: 1px solid #c1c1c1;
	box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.4);
	visibility: hidden;
}

@media only screen and (min-width: 650px ) {
	.calendar__no-events {
		display: none;
	}

	.calendar__table tr {
		display: table-row;
	}

	.calendar__cell {
		display: table-cell;
		width: 14.28571428571429%;
		width: calc(100% / 7 );
		height: 125px;
		padding: 25px 5px 5px;
		vertical-align: top;
		background: #fefefe;
		border: 1px solid #ddd;
	}

	.calendar__cell--other-month {
		background: #fafafa;
		border: none;
	}

	.calendar__number {
		left: 5px;
		font-size: 1em;
	}
}


/* ---------------------------
	#charts
--------------------------- */

.charts {
	margin: 30px -15px 0;
	overflow: hidden;
}

.chart__header {
	margin: 0 0 0.25em 0;
	padding: 0;
	font-size: 1.25em;
}

.chart-wrap {
	float: left;
	/* width: 25%; */
	padding: 0 15px 15px;
}


/* ---------------------------
	#notifications
--------------------------- */

.notifications {
	display: inline-block;
	position: relative;
}

.notifications__count {
	display: inline-block;
	height: 2em;
	min-width: 2em;
	padding: 6px;
	color: #ff0000;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	background-color: #fff;
	border-radius: 100%;
	cursor: pointer;
}

.notifications__inner {
	position: absolute;
	right: 0;
	top: 100%;
	z-index: 4000;
	width: 325px;
	max-height: 8em;
	margin-top: 5px;
	color: #000;
	background-color: #fff;
	border: 1px solid #aaa;
	border-radius: 2px;
	overflow-y: auto;
}

.notifications__list {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
}

.notification, .notification--old {
	padding: 5px;
	font-size: 0.9em;
	font-weight: bold;
	border-top: 1px solid #eee;
}

.notification--old {
	opacity: 0.5;
	background: rgba(0, 0, 0, 0.1);
	border-top-color: rgba(0, 0, 0, 0.1);
}

.notification a {
	color: #000 !important;
	text-decoration: underline;
}

.notification:first-of-type {
	border-top: none;
}


/* ---------------------------
	#alerts
--------------------------- */

.global-alerts {
	margin-bottom: 10px;
	padding: 8px 12px 6px;
	font-size: 1.1em;
	font-weight: bold;
	line-height: 1;
	background: #fff9df;
	/* background: #fff; */
	border: 1px solid #ddd;
	border-radius: 5px;
}

.global-alert {
	position: relative;
	margin-top: 10px;
	padding-left: 30px;
	line-height: 1.35;
}

.global-alert:first-child {
	margin-top: 0;
}

.global-alert__icon {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-top: -3px;
	background: url('/Images/alert.png') no-repeat 0 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	vertical-align: middle;
}


/* ---------------------------
	#popup-alert
--------------------------- */

.popup-alert {
	position: relative;
	z-index: 7000;
}

.popup-alert__background {
	display: block;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.5);
}

.popup-alert__modal {
	position: fixed;
	top: 50%;
	right: 0;
	left: 0;
	transform: translateY(-50%);
	max-width: 400px;
	margin: auto;
	padding: 10px;
	background: #fff9df;
	border: 1px solid #ddd;
	border-radius: 5px;
}

.popup-alert__close {
	position: absolute;
	top: 0;
	right: 5px;
	display: block;
	height: auto;
	padding: 8px;
	font-weight: bold;
	line-height: 1;
	text-decoration: none;
	background: none;
	border: none;
}

.popup-alert__header {
	margin: 0;
	padding: 0;
	font-size: 1.25em;
	text-transform: uppercase;
}

.popup-alert .global-alert {
	font-size: 1.15em;
}

/* div.spacingMenu > ul {
    width: 1200px;
    margin: auto;
}

div.spacingMenu > ul {
    text-align: justify;
    min-width: 500px;
    position: relative;
    left: -20px;
    top: 10px;
}

div.spacingMenu > ul:after {
    content: '';
    display: inline-block;
    width: 100%;
}

div.spacingMenu > ul > li {
    display: inline-block;
    padding-left: 6px;
    padding-right: 6px;
}

div.spacingMenu > ul > li > a {
    font-size: 14px;
    font-family: Helvetica, Arial;
    color: #464646;
    text-decoration: none;
    font-weight: bold;
} */

/* .spacedMenuItem:hover {
    background-color: #f0f0c0;
} */

.spacingMenu > ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.spacedMenuItem {
	flex: 1 0 auto;
}

.spacingMenu a {
	display: block;
	padding: 4px;
	color: #464646;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
}

.sub-nav .spacingMenu > ul {
	display: block;
	overflow: hidden;
}

.sub-nav .spacingMenu li {
	float: left;
}

.sub-nav .spacingMenu a {
	padding: 5px 20px;
	font-size: 12px;
}


/* --- Denied Reason Popup --- */

.denied-popup {
	display: none;
	position: absolute;
	top: 5px;
	right: -150px;
	z-index: 3000;
	width: 200px;
	padding: 5px;
	color: #333;
	font-size: 0.9em;
	line-height: 1.5;
	background: #fff;
	border: 1px solid #ddd;
}

.denied-popup-toggle {
	font-size: 0.9em;
}


/* --- Access Updates --- */

.access {
	clear: right;
	float: right;
	padding: 10px 0 10px 10px;
}

.access__dropdown {
	/* position: absolute;
	left: 70px; */
	max-width: 155px;
}

.access__submit {
	/* position: absolute;
	left: 225px; */
	display: inline-block;
	width: 29px;
	height: 24px;
	margin-left: 5px;
	font-size: 0;
	background: url('/Images/account-check_white.png') no-repeat 0 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	border: none;
	cursor: pointer;
	vertical-align: middle;
}

@media only screen and (min-width: 880px) {
	.access {
		float: none;
		clear: none;
		position: absolute;
		top: 10px;
		left: 0;
		padding: 0 15px;
	}
}


/* --- language select --- */

.user__list > .user__language {
	display: inline-block;
}

.user__list > .user__language::after {
	display: none;
}

.language__dropdown {
	display: block;
}


/* --- flex embed --- */
.flex-embed {
	display: block;
	position: relative;
	overflow: hidden;
}

.flex-embed::after {
	content: '';
	display: block;
	width: 100%;
	padding-bottom: 66.2162%;
}

.flex-embed iframe, .flex-embed object, .flex-embed embed {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.login__content .flex-embed {
	margin-bottom: 10px;
}


/* ---------------------------
	#site-header
--------------------------- */

@media only screen and (min-width: 880px) {
	.site-header {
		display: flex;
		align-items: center;
		padding: 10px;
	}

	.access, .vendor-select {
		order: 1;
		position: static;
	}

	.vendor-select {
		float: none;
		padding-top: 0;
		padding-right: 10px;
	}

	.logo {
		flex: 2 0 auto;
		order: 2;
		padding-top: 0;
	}

	.user {
		order: 3;
		position: static;
	}

	.site-nav {
		margin-top: 0;
	}
}

.user__welcome, .user__language {
	text-align: right;
	float: right;
}

.user__language {
	margin-right: 15px;
}

.user__list {
	clear: both;
}


/* --- field errors --- */

.error {
	margin-top: 3px;
	color: #d8000c;
	font-size: 0.9em;
	font-style: italic;
	font-weight: bold;
}

.field-error input, .field-error textarea {
	/* background: #ffbaba; */
	background: #ffd3d3;
	border-color: #ff8c92;
}


/* --- error list --- */

.page-errors {
	margin: 12px 0;
	padding: 8px 12px 0;
	/* background: #ffbaba; */
	background: #ffd3d3;
	border: 1px solid #ff8c92;
	border-radius: 2px;
}

.page-errors__header {
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: bold;
}

.page-errors__list {
	margin: 0;
	padding: 8px 0 0 1.5em;
}

.page-errors__item {
	margin: 0;
	padding-bottom: 8px;
}

.upload-note {
	color: red;
	font-style: italic;
}

.cluster-popup {
    display: none;
    position: absolute;
    background: white;
    border: 1px solid #ccc;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    min-width: 300px;
    z-index: 100;
}

.cluster-popup input.search {
    width: 180px;
}
    
.cluster-popup.show {
    display: block;
}

.cluster-popup ul {
    list-style: none;
    padding: 0;
    margin: 10px 0;
    max-height: 300px;
    overflow-y: auto;
}

.cluster-popup li {
    padding: 5px 0;
}

.cluster-popup input[type="text"] {
    padding: 5px;
    margin-right: 10px;
}

.cluster-popup button {
    padding: 5px 10px;
}

.search-container {
    position: relative;
    display: inline-block;
}

.search-container input[name="ItemSearch"] {
    padding: 5px;
    padding-right: 25px; /* Make room for the clear button */
    margin-right: 10px;
}
	
.clear-search {
    position: absolute;
    right: 20px; /* Adjust based on the margin-right of input */
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #999;
    font-size: 14px;
    padding: 0 5px;
    display: none; /* Hidden by default */
}

.clear-search:hover {
    color: #666;
}

/* Show the clear button when input has content */
.search-container input[name="ItemSearch"]:not(:placeholder-shown) + .clear-search {
    display: block;
}

.loading {
    position: relative;
    cursor: wait;
    pointer-events: none;
    opacity: 0.7;
}

.loading::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -8px;
    border: 2px solid #666;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}
