/* App Specific CSS Document */

html {
	color: #333;
	background-color: #efefef;
}
/* Prevent click highlighting */
*, *:before, *:after {
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	-webkit-tap-highlight-color: transparent;

	-webkit-touch-callout: none;
  -webkit-user-select: none; /* Chrome/Safari */
	-khtml-user-select: none;
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
	/* Not implemented in browsers yet */
	-o-user-select: none;
	user-select: none;
}
input, select, textarea {
  -webkit-user-select: text; /* Chrome/Safari */
	-khtml-user-select: text;
  -moz-user-select: text; /* Firefox */
  -ms-user-select: text; /* IE10+ */
	/* Not implemented in browsers yet */
	-o-user-select: text;
	user-select: text;
}
p {
	letter-spacing: 1px;
	line-height: 23px;
	font-weight: 400;
	font-size: 12px;
	margin-top: 0px;
}

div.group-row {
	padding-top: 10px;
	padding-bottom: 10px;
}
div.group div.group-row:nth-child(odd) {
	background-color: rgba(0,0,0,0.06);
}
div.group div.group-row:nth-child(even) {
	background-color: rgba(0,0,0,0.02);
}
div.group .tbl-cell {
	width: 50%;
}
div.group .group-hidden {
	display: none;
}

table {
	width: 100%;
	border-collapse: collapse;
}
table.list .edit {
	float: none;
}
table.list tr:nth-child(odd) {
	background-color: #eeeeee;
}
table.list tr:nth-child(even) {
	background-color: #e5e5e5;
}
table.list td {
	padding: 7px 0px;
	font-size: 12px;
}
table.list tr.label td {
	font-size: 10px;
	letter-spacing: 1px;
	font-weight: 200;
	color: #aaa;
}
table.list tr.blast td {
	font-weight: 500;
	line-height: 32px;
	letter-spacing: 1px;
	cursor: pointer;
}
table.list tr.blast td.email-created,
table.list tr.blast td.email-failed,
table.list tr.blast td.email-delivered,
table.list tr.blast td.email-opened,
table.list tr.blast td.email-clicked {
	font-size: 22px;
}
table.list tr.disputed:nth-child(odd) {
	background-color: rgba(115,0,0,0.098);
}
table.list tr.disputed:nth-child(even) {
	background-color: rgba(115,0,0,0.098);
}
table.list tr:hover,
table.list tr.disputed:hover {
	background-color: #fff;
}
table.list tr.label:hover {
	background-color: #eeeeee;
}
tr.blast div.email-created,
tr.blast div.email-failed,
tr.blast div.email-delivered,
tr.blast div.email-opened,
tr.blast div.email-clicked {
	font-size: 22px;
	display: table-cell;
	letter-spacing: -1px;
}
table.list td.email-created,
div.email-created {
	font-size: 11px;
	color: rgba(136,136,136,0.7);/*gray*/
}
table.list td.email-failed,
div.email-failed {
	font-size: 11px;
	color: rgba(223,49,46,0.5);/*red*/
}
table.list td.email-delivered,
div.email-delivered {
	font-size: 11px;
	color: rgba(148,31,182,0.5);/*purple*/
}
table.list td.email-opened,
div.email-opened {
	font-size: 11px;
	color: rgba(31,81,182,0.6);/*blue*/
}
table.list td.email-clicked,
div.email-clicked {
	font-size: 11px;
	color: rgba(7,130,13,0.7);/*green*/
}
table.list tr.receipt-item td:first-child {
	border-left: 3px solid #bebebe;
}
table.list tr.receipt-hl:nth-child(odd){
	background-color: rgba(0,0,255,0.09);
}
table.list tr.receipt-hl:nth-child(even) {
	background-color: rgba(0,0,255,0.09);
}
table.list tr.receipt-item.receipt-glow:nth-child(odd){
	background-color: rgba(0,0,255,0.05);
}
table.list tr.receipt-item.receipt-glow:nth-child(even) {
	background-color: rgba(0,0,255,0.05);
}
table.list tr.receipt-item.receipt-glow td:first-child {
	border-left: 3px solid rgba(0,0,255,0.15);
}
table td.pad {
	padding-left: 20px;
}
table.list .smalltxt {
	font-size: 11px;
	letter-spacing: 0px;
}

.tbl.list .tbl-row .tbl-cell {
	padding: 9px 0px 9px 10px;
	font-size: 13px;
}
.tbl.list .tbl-row.label .tbl-cell {
	font-size: 10px;
	letter-spacing: 1px;
	font-weight: 200;
	color: #aaa;
}
.tbl.list .tbl-row .tbl-cell span {
	vertical-align: middle;
}
.tbl.list .tbl-row.label:nth-child(odd) {
	background-color: transparent;
}
.tbl.list .tbl-row.label:nth-child(even) {
	background-color: transparent;
}
.tbl.list .tbl-row:nth-child(odd) {
	background-color: #eeeeee;
}
.tbl.list .tbl-row:nth-child(even) {
	background-color: #e5e5e5;
}
.tbl.list .tbl-row:hover {
	background-color: #fafafa;
}
.row-footer {
  font-size: 20px;
  font-weight: 800;
  background-color: inherit;
  color: #999;
}

.brand-color {
	color: #443287;
}
.red {
	color: rgba(223,49,46,0.5);
}
.green {
	color: rgba(7,130,13,0.7);
}
.bold {
	display: inline-block;
	font-size: 15px;
	font-weight: 700;
}
.gray {
	color: rgba(153,153,153,0.9);
}
.solid {
	vertical-align: middle;
}
.font-small {
	font-size: 12px;
}
.input-small {
	width: 50px;
}
.input-small input {
	padding-left: 0px;
	padding-right: 0px;
}

/* Simulated Links */
.link {
	color: #a083e4;
	font-weight: 500;
	cursor: pointer;
}
/* Active Row */
.online,
.list tr.online:nth-child(odd) {
	background-color: rgba(0,153,0,0.2);
}
.list tr.online:nth-child(even) {
	background-color: rgba(0,153,0,0.18);
}
.highlight,
.list tr.highlight:nth-child(odd) {
	background-color: rgba(247,229,141,0.4);
}
.list tr.highlight:nth-child(even) {
	background-color: rgba(247,229,141,0.5);
}
.list tr.online:hover,
.list tr.highlight:hover {
	background-color: #fff;
}

/* Alternating Backgrounds */
.series label {
	margin: 0px -20px;
	width: 100%;
	display: block;
	padding: 8px 20px;
	color: #959595;
	cursor: pointer;
}
.series label:nth-child(odd) {
	background-color: #e9e9e9;
}
.series label:nth-child(even) {
	background-color: #e0e0e0;
}
.series label:hover {
	background-color: #efefef;
}
.series label input:checked + span {
	font-weight: bold;
	color: #888;
}

/* Credit Card input */
.in-exp-month,
.in-exp-year,
.in-cvv,
.in-zip {
	padding-left: 5px;
	padding-right: 2px;
}

/* Buy Menu Flow */
.class-title {
	text-align: center;
	margin-bottom: 3px;
}

.amount {
	white-space: nowrap;
}
.amount-sign {
	display: inline-block;
	vertical-align: top;
	font-size: 20px;
	color: #666;
	line-height: 50px;
	padding-right: 3px;
}
.amount-dollars {
	display: inline-block;
}
.amount-cents {
	display: inline-block;
	vertical-align: top;
	font-size: 5vmin;
	color: #444;
	line-height: 40px;
	padding-left: 4px;
	letter-spacing: -2px;
}
.amount-spacer {
	display: inline-block;
	padding: 3px;
}

.rate-value {
	display: inline-block;
}
.rate-label {
	display: inline-block;
	vertical-align: top;
	font-size: 16px;
	color: #666;
	line-height: 50px;
	padding-left: 5px;
	letter-spacing: 0px;
}
.rate-symbol {
	display: inline-block;
	vertical-align: top;
	font-size: 20px;
	color: #666;
	line-height: 50px;
	padding-right: 3px;
}
.rate-spacer {
	display: inline-block;
	vertical-align: top;
	padding: 0px 3px;
	font-size: 30px;
	color: #666;
}
.percent-symbol {
	color: #bbb;
	font-size: 14px;
	line-height: 14px;
	padding: 9px 2px;
}


.icon {
	background-color: rgba(255,0,0,0.5);
	width: 12px;
	height: 11px;
	display: inline-block;
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
}
.studio .icon-card,
.icon-card {
	opacity: 0.7;
	height: 12px;
	display: inline-block;
	vertical-align: middle;
}


.col-edge {
	margin: 0px 0px;
}
.col-edge-qtr {
	margin: 0px 10px;
}
.col-qtr {
	width: 50%;
	display: inline-block;
}
.col-edge-qtr .box-med {
	margin: 20px 10px;
}
.col-half {
	width: 100%;
	display: inline-block;
	vertical-align: top;
}
.col-half .box-wrap,
.col-half .top {
	width: 100%;
	max-width: none;
}
.col-half .dev-med,
.col-half .dev-lrg {
	display: none;
}
.col-full {
	width: 100%;
	display: inline-block;
	vertical-align: top;
	text-align: center;
}


.page {
	width: 100%;
	text-align: left;
	display: inline-block;
	margin-top: 20px;
	position: relative;
}
.page-close {
	position: absolute;
	right: 0px;
	cursor: pointer;
	font-size: 30px;
	font-weight: 800;
	color:#888;
	padding-right: 20px;
}
.page-close:hover {
	color: #666;
}
.page#members-list {
	margin-top: 0px;
}
.title {
	color: #614591;
	font-weight: 800;
	text-align: left;
	padding-bottom: 20px;
  position: relative;
}
.title .subscript {
	padding-left: 8px;
	color: #bbb;
	font-size: 9px;
	letter-spacing: 0px;
	font-weight: 600;
}
.title-short {
	padding-bottom:10px;
}
.title div.edit {
	padding: 0px 10px;
}
.title .close {
	padding: 0px 0px 0px 10px;
}
.title button {
	margin: 0px 10px;
}
.title-simple {
	color: #614591;
	font-weight: 600;
	text-align: left;
	padding-bottom: 20px;
}
.subtitle {
	color: #bbb;
}
.text {
    color: #333;
    font-size: 23px;
    font-weight: 400;
    line-height: 36px;
    text-align: center;
    padding: 0px 40px 20px;
    margin: 0px -20px;
    overflow-wrap: break-word;
}
.text strong {
	color: #444;
	font-weight: 600;
}
.in-large {
	font-size: 18px;
	line-height: 22px;
	text-align: center;
}
.strong {
	color: #443287;
	font-weight: 600;
	opacity: 0.8;
}
.edge {
	margin: 0px -20px;
}
.footer {
	padding: 20px 0px;
	font-size: 10px;
	text-align: center;
	color: #bbb;
}
.legal {
	color: #999;
}
.full {
	width: 100%;
}
.hide {
	display: none;
}
.slash {
	font-size: 19px;
	vertical-align: middle;
	color: #bbb;
}
.gift {
	font-size: 10px;
	padding: 4px 5px;
	border-radius: 5px;
	background-color: rgba(164,215,255,0.5);
	line-height:12px;
}
.gift img {
	height: 12px;
	opacity: 0.3;
	display: inline-block;
	vertical-align: middle;
}
.note {
	font-size: 10px;
	padding: 4px 5px;
	border-radius: 5px;
	background-color: rgba(255,235,143,0.6);
	line-height:12px;
}
.note-member {
	margin-bottom: 5px;
}
.code {
	font-size: 10px;
	padding: 4px 5px;
	border-radius: 5px;
	background-color: rgba(237,210,237,0.6);
	line-height:12px;
}
.tag,
.dispute {
	font-size: 10px;
	padding: 4px 5px;
	border-radius: 5px;
	background-color: rgba(215,215,215,0.8);
	line-height:12px;
}
.warn {
	font-size: 11px;
	padding: 4px 5px;
	border-radius: 5px;
	background-color: rgba(186,126,0,0.25);
	color: rgba(186,126,0,1);
	text-align: center;
	line-height: 12px;
}
.fail {
	font-size: 11px;
	padding: 4px 5px;
	border-radius: 5px;
	background-color: rgba(186,0,0,0.15);
	color: rgba(186,0,0,1);
	text-align: center;
	line-height: 12px;
}
.warn img,
.fail img {
	height: 10px;
	display: inline-block;
	vertical-align: middle;
}
.warn span,
.fail span {
	vertical-align: middle;
}
.nowrap {
	white-space: nowrap;
}
.double {
	white-space: nowrap;
	display: inline-block;
}
.double button {
	margin: 0px;
}
.rsvp-bg {
	background-color: #74c6de;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  -webkit-border-top-left-radius: 20px;
     -moz-border-radius-topleft: 20px;
          border-top-left-radius: 20px;
  -webkit-border-top-right-radius: 20px;
     -moz-border-radius-topright: 20px;
          border-top-right-radius: 20px;
  -webkit-box-shadow:inset 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow:inset 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  box-shadow:inset 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
}
.rsvp-bg .rsvp {
	color: #fff;
	font-size: 11px;
	line-height: 11px;
	text-align: center;
	padding: 4px 0px 4px;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.bar-green {
	background: linear-gradient(#62c462, #51a351);
	background: -o-linear-gradient(#62c462, #51a351);
	background: -moz-linear-gradient(#62c462, #51a351);
	background: -webkit-linear-gradient(#62c462, #51a351);
}
.bar-red {
	background-color: #bd362f;
  opacity: 0.65;
}


.page-bar {
	position: fixed;
	top: 64px;
	z-index: 71;
	width: 100%;
}
.page-bar-spacer {
	width: 100%;
	height: 34px;
}
.page-bar-inner {
	width: 100%;
	height: 34px;
	line-height: 34px;
	background-color: #007abf;
	color: #eee;
	background: linear-gradient(#5d45a2, #443287);
	background: -o-linear-gradient(#5d45a2, #443287);
	background: -moz-linear-gradient(#5d45a2, #443287);
	background: -webkit-linear-gradient(#5d45a2, #443287);
}
.page-back {
	display: inline-block;
	vertical-align: top;
	font-size: 20px;
	height: 34px;
	padding: 0px 10px 0px 15px;
	cursor: pointer;
}
.page-refresh {
	display: inline-block;
	vertical-align: top;
	font-size: 20px;
	height: 34px;
	padding: 0px 10px;
	cursor: pointer;
}
.page-info {
	display: inline-block;
	vertical-align: top;
	font-size: 20px;
	height: 34px;
	padding: 0px 10px;
	cursor: pointer;
}
.page-back img,
.page-refresh img,
.page-info img {
	height: 14px;
	opacity: 0.7;
	display: block;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.page-info img {
	-webkit-filter: invert(100%);
	filter: invert(100%);
}
.page-back:hover,
.page-refresh:hover,
.page-info:hover,
.page-button:hover {
	background-color: rgba(0,0,0,0.2);
}
.page-title,
.page-amount {
	display: inline-block;
	vertical-align: top;
	font-size: 11px;
	line-height: 34px;
	padding: 0px 0px 0px 0px;
}
.page-amount {
	padding: 0px 0px 0px 7px;
}
.page-right {
	vertical-align: middle;
	float: right;
  display: flex;
}
.page-button {
	padding: 0px 30px 0px 15px;
	font-size: 11px;
	height: 34px;
	line-height: 34px;
	cursor: pointer;
}
.page-menu {
	display: none;
	position: absolute;
	right: 0px;
	background-color: #333;
	z-index: 50;
}
.page-menu-row {
	padding: 10px 0px;
}
.page-menu-nav {
	font-size: 14px;
	width: 140px;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	color: #ccc;
	cursor: pointer;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.page-menu-nav:hover {
	color: #eee;
	background-color: #222;
}
.page-menu-nav input {
	border-radius: 0px;
	text-align: center;
	position: relative;
	z-index: 100000;
}
.page-right-sel .page-button {
	background-color: rgba(0,0,0,0.2);
	color: #ddd;
}
.page-right-sel .page-menu {
	display: inline-block;
}


.drawer {
	width: 100%;
	height: 0px;
	overflow: scroll;
	z-index: 70;
	-webkit-overflow-scrolling: touch;

	background-color: #ddd;

	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease;
}
.drawer-label {
	font-size: 12px;
	background-color: #aaa;
	color: #eee;
	margin-bottom: 15px;
  vertical-align: middle;
}
.drawer-profile {
	width: 100%;
	height: auto;
	padding: 10px 0px;
	background: linear-gradient(#ddd, #ccc);
	background: -o-linear-gradient(#ddd, #ccc);
	background: -moz-linear-gradient(#ddd, #ccc);
	background: -webkit-linear-gradient(#ddd, #ccc);
}
.drawer-profile .box-profile {
	cursor: pointer;
}
.scroll-arrow {
	position: absolute;
	right: 10px;
	bottom: 50px;
	opacity: 0.7;
	pointer-events: none;
}


.edit {
	float: right;
	height: 16px;
	cursor: pointer;
	display: inline-block;
	opacity: 0.3;
}
.edit-left {
	position: absolute;
	top: 0px;
	left: 0px;
	margin: 20px;
}
.edit-right {
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 20px;
}
.edit:hover {
	opacity: 0.5;
}
div.edit,
span.edit {
	opacity: 1;
}
div.edit:hover,
span.edit:hover {
	opacity: 1;
}
div.edit img,
span.edit img {
	height: 16px;
	opacity: 0.3;
}
div.edit:hover img,
span.edit:hover img {
	opacity: 0.5;
}
.extra {
	float: none;
	padding: 7px 15px 18px 15px;
}
.right-mod {
	text-align: right;
	float: right;
	width: 300px;
}


.invert {
	-webkit-filter: invert(100%);
	filter: invert(100%);
}
.lock {
	display: inline-block;
	opacity: 0.2;
	height: 16px;
}
.action {
	display: inline-block;
	text-align: center;
	cursor: pointer;
	vertical-align: top;
	width: 80px;
	height: 105px;
	position: relative;
}
.action-original,
.action-circle {
	display: inline-block;
	border-radius: 100%;
	width: 60px;
	height: 60px;
	position: relative;
	cursor: pointer;

	background: linear-gradient(#5d45a2, #443287);
	background: -o-linear-gradient(#5d45a2, #443287);
	background: -moz-linear-gradient(#5d45a2, #443287);
	background: -webkit-linear-gradient(#5d45a2, #443287);
}
.action-original img,
.action-circle img {
	width: 50%;
	position: absolute;
	left: 50%;
	top: 50%;
  -webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */
  -ms-transform: translate(-50%, -50%); /* IE 9 */
	transform: translate(-50%, -50%);
	opacity: 0.9;
}
.action-profile {
	margin-left: 15px;
	vertical-align: middle;
}
.action-label {
	font-size: 12px;
	font-weight: 700;
	line-height: 13px;
	padding: 1px 0px 0px;
	color: #444;
}
.action:hover img {
	opacity: 1.0;
}


.box {
	background-color: #f6f6f6;
	color: #999;
	padding: 20px;
	/*border: 1px solid #CCC;*/
	display: inline-block;
	vertical-align: top;
	text-align: left;
	position: relative;

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

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;

	webkit-box-shadow: 0 0 2px rgba(0,0,0,0.19), 0 2px 2px rgba(0,0,0,0.12);
  box-shadow: 0 0 2px rgba(0,0,0,0.19), 0 2px 2px rgba(0,0,0,0.12);
}
.box-popup {
	width: calc(100% - 40px);
	max-width: 320px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 0px 40px rgba(18, 12, 12, 0.7);
	-webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
}
.box-full {
	width: 100%;
}
.box-small {
	width: 300px;
	display: inline-block;
	margin: 20px 10px 10px;
}
.box-pic {
	width: 300px;
	display: inline-block;
	margin: 20px 10px 10px;
	padding: 0px;
}
.mobile .box-responsive,
.box-responsive {
	width: 85%;
	display: inline-block;
	margin: 20px 10px 10px;
}
.mobile .col-50,
.col-50 {
	width: 100%;
	vertical-align: top;

	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.mobile .col-50-left,
.mobile .col-50-right {
	padding: 0px;
}
.box-med {
	padding: 20px 0px;
	display: block;
	margin: 20px;
}
.box-tight {
	padding: 10px 0px 20px;
}
.box-dual {
	display: inline-block;
	width: 50%;
	vertical-align: middle;
	text-align: center;
}
canvas {
	vertical-align:top;
}
.box-wrap {
	width: 100%;
	max-width: 500px;
	padding: 0px 10px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.view-memb .box-wrap {
	padding: 0px;
}
.box-form {
	max-width: 390px;
	display: inline-block;
	margin: 20px 10px 10px;
}
.box-dyn {
	min-width: 250px;
	display: block;
	padding: 0px;
	padding-bottom: 20px;
	margin: 20px 10px;
}
.box-dyn .title,
.box-dyn .box-main-title {
	padding: 20px;
}
.box-subinner {
	padding: 10px 10px 0px;
	margin-bottom: 5px;
	background-color: rgba(0,0,0,0.1);
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.box-outer {
	display: inline-block;
	vertical-align: top;
	text-align: center;
}
.box-max {
	padding: 20px;
	max-width: 350px;
}
.box-online {
	position: absolute;
	top: 5px;
	right: 7px;
	font-size: 11px;
	letter-spacing: 0.5px;
	color: #1fa025;
}
.box-offline {
	position: absolute;
	top: 5px;
	right: 7px;
	font-size: 11px;
	letter-spacing: 0.5px;
	color: #999;
}
.box-profile {
	width: 64px;
	height: 64px;
	display: inline-block;
	vertical-align: middle;
	background-color: #bbb;
	position: relative;

	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
}
.box-profile img {
	width: 70%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.box-profile-med {
	width: 48px;
	height: 48px;
	margin: 8px 0px 8px 20px;
	vertical-align: middle;
}
.box-profile-thumb {
	width: 42px;
	height: 42px;
	margin-right: 5px;
	vertical-align: middle;

	opacity: 0.9;
}
.box-profile-mini {
	width: 32px;
	height: 32px;
	margin-right: 0px;
	vertical-align: middle;
}
.box-profile-tiny:hover,
.box-profile-thumb:hover  {
	opacity: 1;
}
.box-profile.box-profile-border {
	border: 3px #fdfdfd solid;
}
.box-profile-thumb.box-profile-border {
	border: 2px #fdfdfd solid;
}
.box-profile-tiny {
	width: 24px;
	height: 24px;
	margin-right: 5px;
	vertical-align: middle;

	opacity: 0.7;
}
table.list tr:hover .box-profile-tiny,
table.list tr:hover .box-profile-thumb {
	opacity: 1;
}
.box-right {
	float: right;
	padding-left: 20px;
	width: 166px;
}
.box-title {
	color: #666;
	font-weight: 600;
	padding: 1px 0px 2px;
	letter-spacing: -0.5px;
	text-align: left;
	font-size: 14px;
	overflow: hidden;
}
.box-title img {
	 height: 12px;
	 display: inline-block;
}
.box-text {
	padding: 4px 0px;
	letter-spacing: -0.5px;
	text-align: left;
	font-size: 12px;
	line-height: 12px;
}
img.indicator {
	height: 12px;
	margin: 0px 0px -1px 0px;
	display: inline-block;
	opacity: 0.3;
}
.box-text img.indicator {
	height: 12px;
	margin: 0px 0px -1px 5px;
	display: inline-block;
	opacity: 0.3;
}
.box-text-student {
	color: #999;
	font-weight: 600;
}
.box-text-kiosk,
.box-text-instructor,
.box-text-trainer,
.box-text-staff,
.box-text-manager,
.box-text-accountant {
	color: #007abf;
	font-weight: 600;
}
.box-text-owner {
	color: rgba(0,153,0,0.7);
	font-weight: 600;
}
.box-male {
	margin: 20px 10px 10px;
	box-shadow: inset 0 0 15px rgba(72,130,195,0.3);
	border-color: rgba(72,130,195,0.3);
	border: 1px solid #ccc;
	/*background-color: rgba(72,130,195,0.15);
	color: rgba(72,130,195,1);*/
}
.box-female {
	margin: 20px 10px 10px;
	box-shadow: inset 0 0 15px rgba(211,113,191,0.3);
	border-color: rgba(211,113,191,0.3);
	border: 1px solid #ccc;
	/*background-color: rgba(211,113,191,0.15);
	color: rgba(211,113,191,1);*/
}
.box-gender {
	margin: 20px 10px 10px;
	box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
	border-color: rgba(0,0,0,0.3);
	border: 1px solid #ccc;
}

.box-male .box-profile {
	background-color: rgba(123,169,221,0.5);
}
.box-female .box-profile {
	background-color: rgba(211,113,191,0.5);
}

.box-super {
	border: 1px solid #CCC;
	box-shadow: inset 0 0 15px rgba(0,0,0,0.3);
}
.box-user {
	border-style: solid;
}
.box-guest {
	border-style: dashed;
}
.box-hover:hover {
	background-color: rgba(255,255,255,0.9);
}
.box-main-title {
	color: #443287;
	font-size: 16px;
	font-weight: 600;
}
.box-med .box-main-title {
	padding: 0px 20px 20px;
}
.box-small .box-main-title,
.box-max .box-main-title {
	padding: 0px 0px 20px;
}
.box-value {
	font-size: 60px;
	font-weight: 500;
	line-height: 60px;
	text-align: center;
	color: #444;
	letter-spacing: -2px;
}
.box-value img {
	display: inline-block;
}
.box-subvalue {
	font-size: 10vmin;
	font-weight: 500;
	line-height: 60px;
	text-align: center;
	color: #444;
	letter-spacing: -3px;
}
.box-subtitle {
	text-align: center;
	font-weight: 600;
	line-height: 29px;
	letter-spacing: 0px;
	color: #443287;
}
.box-value-negative .amount-dollars,
.box-value-negative .amount-cents {
	color: rgba(186,0,0,0.8);/*red*/
}
.box-value-positive .amount-dollars,
.box-value-positive .amount-cents {
	color: #039427;/*green*/
}
.box-click:hover {
  background-color: #fefefe;
	cursor: pointer;
}

.box-dark {
	min-width: 300px;
	height: 190px;
	border-radius: 30px;
	position: relative;

	background: linear-gradient(#666, #444);
	background: -o-linear-gradient(#666, #444);
	background: -moz-linear-gradient(#666, #444);
	background: -webkit-linear-gradient(#666, #444);
}
.box-dark img {
	max-width: 80%;
	max-height: 95%;
	position: absolute;
	left: 50%;
	top: 50%;
  -webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */
  -ms-transform: translate(-50%, -50%); /* IE 9 */
	transform: translate(-50%, -50%);
}
.box-dark:hover {
	background: none;
	background-color: #444;
}
.box-dark span {
	font-size: 36px;
	color: #eee;
	width: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
  -webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */
  -ms-transform: translate(-50%, -50%); /* IE 9 */
	transform: translate(-50%, -50%);
}
.card-small {
	min-width: 160px;
	width: 160px;
	height: 100px;
	border-radius: 20px;
}
.card-small span {
	font-size: 18px;
}
.dark-block {
	background-color: rgba(0,0,0,0.05);
	margin: 0px -20px 0px;
	padding: 20px 20px 7px;
}
.dark-block-limit {
	background-color: rgba(0,0,0,0.05);
	padding: 10px 20px 7px;
	text-align: center;
	display: none;
}
.dark-block-cent {
	display: inline-block;
	max-width: 300px;
}

/* Full Row */
.col-edge-full {
	margin: 20px 0px 20px;
}
.col-tbl {
	width: 100%;
	display: block;
	table-layout: fixed;
}
.col-tbl-row {
	display: block;
}
.col-tbl-cell {
	display: block;
	vertical-align: top;
}

/* Member */
.member-buttons {
	text-align: center;
	background-color: rgba(0,0,0,0.07);
	padding: 20px 0px 10px;
	margin-top: 0px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.member-buttons .dropdown {
	display: inline-block;
}
.member-search {
	display: inline-block;
	margin-bottom: 0px;
	margin-right: 0px;
	vertical-align: middle;
	max-width: 140px;
  padding: 10px 0px 10px 7px;
  font-size: 17px;
	line-height: 22px;

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

	-webkit-border-top-left-radius: 6px;
	-moz-border-radius-topleft: 6px;
	border-top-left-radius: 6px;

	-webkit-border-bottom-left-radius: 6px;
	-moz-border-radius-bottomleft: 6px;
	border-bottom-left-radius: 6px;
}
.btn-large.member-search-btn,
.member-search-btn {
	margin-left: 0px;
	padding-left: 6px;
	padding-right: 6px;

	-webkit-border-top-left-radius: 0px;
	-moz-border-radius-topleft: 0px;
	border-top-left-radius: 0px;

	-webkit-border-bottom-left-radius: 0px;
	-moz-border-radius-bottomleft: 0px;
	border-bottom-left-radius: 0px;
}
.profile-pic {
	padding: 0px;
	max-width: 300px;
	overflow: hidden;
}
.profile-pic img {
	width: 100%;
}


/* Circle Checkmark */
.circle-green {
	display: inline-block;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	background-color: green;
	width: 40px;
	height: 40px;
	position: relative;
	vertical-align: middle;
	margin: 10px 10px 10px 0px;
}
.circle-green img {
	width: 60%;
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}


/* Triangle */
.triangle {
	position: relative;
}
.triangle::after {
	content: '';
	position: absolute;
	border-color: transparent;
	border-style: solid;
	border-width: 30px;
	top: 0;
	cursor: pointer;
}
.triangle.tri-topleft::after {
  border-top-left-radius: 3px;
	left: 0;
}
.triangle.tri-topright::after {
  border-top-right-radius: 3px;
	right: 0;
}


/* Messages */
.msg {
	padding-top: 5px;
	padding: 0px;
	position: relative;
	overflow: hidden;

	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
.msg-icon {
	position: absolute;
	top: 11px;
	right: 8px;
	z-index: 10;
	opacity: 0.7;
	-webkit-filter: invert(100%);
	filter: invert(100%);
	max-width: 20px;
	max-height: 16px;
	cursor: pointer;
}
.msg-bar {
	color: rgba(0,0,0,0.4);
	padding: 10px 10px 0px;
	cursor: pointer;

	border-top-left-radius: 10px;
	-moz-border-top-left-radius: 10px;
	-webkit-border-top-left-radius: 10px;

	border-top-right-radius: 10px;
	-moz-border-top-right-radius: 10px;
	-webkit-border-top-right-radius: 10px;
}
.msg.triangle.tri-topleft::after {
  border-top-left-radius: 9px;
}
.msg.triangle.tri-topright::after {
  border-top-right-radius: 9px;
}
.msg.msg-unread .msg-bar,
.msg.msg-unread .msg-brief {
	background-color: rgba(0,150,0,0.1);
}
.msg.msg-unread .msg-date:after {
	position: absolute;
	display: inline-block;
	background-color: red;
	content: 'NEW';
	color: #fff;
	margin-top: -3px;
	margin-left: 10px;
	padding: 3px 3px;
	opacity: 0.9;

	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.msg-date {
	font-size: 12px;
	line-height: 12px;
}
.msg-time {
	display: none;
}
.msg-brief {
	padding: 16px 20px;
	font-size: 15px;
	line-height: 23px;
	color: #888;
	cursor: pointer;
	min-height: 23px;
}
.msg-content {
	display: none;
	font-size: 15px;
	line-height: 23px;
	color: #888;
	min-height: 23px;

  -webkit-user-select: text; /* Chrome/Safari */
	-khtml-user-select: text;
  -moz-user-select: text; /* Firefox */
  -ms-user-select: text; /* IE10+ */
	/* Not implemented in browsers yet */
	-o-user-select: text;
	user-select: text;
}
.msg.msg-open .msg-icon {
	opacity: 0.8;
}
.msg.msg-open .msg-bar,
.msg.msg-open .msg-brief {
	background-color: rgba(0,0,0,0.07);
}
.msg.msg-open .msg-date {
	color: rgba(0,0,0,0.5);
}
.msg.msg-open .msg-time {
	display: inline-block;
}
.msg.msg-open .msg-content {
	display: block;
}
.msg.msg-open.msg-unread .msg-date:after {
	display: none;
}

/* Support Buttons */
.support-buttons {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 30px;
	margin: 24px 0px 32px;
	padding: 0px 20px;
}
.support-button {
	background-color: #f8f8f8;
    color: #707070;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.19), 0 2px 2px rgba(0, 0, 0, 0.12);
	padding: 10px 20px;
	cursor: pointer;
	transition: background 0.3s ease;
	min-width: 255px;
	width: 100%;
}
.support-button:hover:not(.support-button-disabled) {
	background-color: #fff;
}
.support-button-disabled {
	opacity: 0.6;
	cursor: default;
}
.support-button-title {
	font-size: 18px;
	line-height: 18px;
	margin: 10px 0px;
	font-weight: 600;
	letter-spacing: 2px;
}
.support-button-icon {
	font-size: 30px;
	line-height: 30px;
	margin: 10px 0px;
}
.support-button-text {
	position: relative;
}
.support-text-copied {
	display: none;
	color: #fff;
	background-color: green;
	position: absolute;
	top: 130%;
	left: 50%;
	transform: translateX(-50%);
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	padding: 5px 10px;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.19), 0 2px 2px rgba(0, 0, 0, 0.12);
}
/* For Medium Screen Desktop */
@media only screen and (min-width: 992px) {
	.support-buttons {
		flex-direction: row;
	}
	.support-button {
		max-width: 380px;
	}
}

/* Blast Creator */
.creator-outer {
	zoom: 58%;
}
.creator-outer .tip-guide {
	zoom: 165%;
	z-index: 32;
}
.creator-border {
	min-height: 400px;
}
.creator {
	background-color: #dddddd;
  display: block;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: visible;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.creator-options-pane {
	width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
	z-index: 19;
}
.creator-options {
	background-color: #e8e8e8;
	display: table-cell;
	vertical-align: top;
	width: 300px;
  position: fixed;
  top: 98px;
  bottom: 0px;
	right: -400px;
	-webkit-transition: right 1s; /* Safari */
  transition: right 1s;
	z-index: 1;
}
.creator-buttons {
	font-size: 14px;
	font-weight: bold;
	margin: 20px 0px;
}
.creator-buttons input {
	display: none;
}
.creator-image-item {
	position: relative;
}
.creator-image-item span {
	position: absolute;
	right: 0px;
	font-size: 24px;
	line-height: 32px;
	font-weight: bold;
	color: #fff;
	background-color: #ccc;
	opacity: 0.5;
	width: 32px;
	height: 32px;
	border-radius: 100%;
	cursor: pointer;

	box-shadow: 0px 0px 6px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 6px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 6px rgba(0,0,0,0.3);
}
.creator-image-item:hover span {
	opacity: 1.0;
}
.creator-image-item img {
	width: 100%;
}
.creator-option {
	background-color: #f3f3f3;
	border: 7px dashed #777;
	padding: 30px;
	margin: 10px 5px;
}
.creator-option:hover {
	background-color: #fff;
	border-color: #999;
	cursor: pointer;
}
.creator-block:hover {
	outline: 3px dashed #ccc;
	position: relative;
}
.creator-block.creator-block-selected {
	outline: 3px dashed #999;
	position: relative;
}
.creator-block .creator-label,
.creator-block .creator-modifiers {
	display: none;
}
.creator-block.creator-block-selected .creator-label {
	display: inline-block;
	position: absolute;
	top: -20px;
	left: 5px;
	font-size: 14px;
	letter-spacing: 0.5px;
	color: #999;
}
.creator-block.creator-block-selected .creator-modifiers {
	display: inline-block;
	position: absolute;
	z-index: 10;
}
.creator-block.creator-block-selected textarea {
	background-color: rgba(255,255,255,0.2);
}
.creator-block .creator-modifiers-top-right {
	top: -35px;
	right: 0px;
}
.creator-block .creator-modifiers-bottom-right {
	bottom: -35px;
	right: 0px;
}
.creator-block .creator-modifiers-bottom-left {
	bottom: -35px;
	left: 0px;
}
.creator-block .creator-modifier-group {
	display: inline-block;
	position: relative;
	width: 40px;
	height: 40px;
	vertical-align: middle;
}
.creator-block .creator-modifier {
	display: inline-block;
	color: #eee;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 20px;
	text-align: center;
	vertical-align: middle;
	background-color: #888;
	cursor: pointer;
  overflow: hidden;

	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
.creator-block .creator-modifier-group .creator-modifier {
	position: absolute;
	top: 0px;
	bottom: 0px;
	right: 0px;
	left: 0px;
  -webkit-transition: top 0.5s; /* Safari */
  transition: top 0.5s;
}
.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(2) {
	top: -40px;
	bottom: auto;
}
.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(3) {
	top: -80px;
	bottom: auto;
}
.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(4) {
	top: -120px;
	bottom: auto;
}
.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(5) {
	top: -160px;
	bottom: auto;
}
.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(6) {
	top: -200px;
	bottom: auto;
}
.creator-block .creator-modifier-group .creator-modifier.creator-modifier-sel,
.creator-block .creator-modifier-sel {
	background-color: #bbb;
}
.creator-block .creator-modifier-group .creator-modifier {
	color: #fff;
	background-color: #666;
}
.creator-block .creator-modifier-group .creator-modifier:nth-child(1) {
	color: #eee;
	background-color: #888;
	z-index: 11;
}
.creator-block .creator-modifier-group .creator-modifier:hover,
.creator-block .creator-modifier:hover {
	color: #fff;
	background-color: #ccc;
}
.creator-block .creator-modifier img {
	-webkit-filter: invert(100%);
	filter: invert(100%);
	height: 40%;
	margin: auto;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.creator-block .creator-modifier input {
	width: 30px;
	height: 36px;
	line-height: 36px;
  padding: 0px;
  margin: 0px;
  background-color: transparent;
  border: 0px solid transparent;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.creator-modifier img.creator-modifier-medium {
	height: 60%;
}
.creator-modifier img.creator-modifier-bigger {
	height: 75%;
}
.creator-outer .creator-block .creator-modifier-group,
.creator-outer .creator-block .creator-modifier,
.creator-outer .creator-block .creator-modifiers .creator-modifier,
.creator-outer .creator-block .creator-modifier-group
.creator-outer .creator-block .creator-modifier-group .creator-modifier.creator-modifier-sel,
.creator-outer .creator-block .creator-modifier-sel  {
	width: 60px;
	height: 60px;
	line-height: 60px;
	font-size: 30px;
}
.creator-outer .creator-block .creator-modifier input {
	width: 46px;
	height: 50px;
	line-height: 50px;
  margin-top: 5px;
}
.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(2) {
	top: -60px;
	bottom: auto;
}
.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(3) {
	top: -120px;
	bottom: auto;
}
.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(4) {
	top: -180px;
	bottom: auto;
}
.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(5) {
	top: -240px;
	bottom: auto;
}
.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(6) {
	top: -300px;
	bottom: auto;
}
.creator-block textarea {
	font-size: 15px;
	line-height: 18px;
	color: rgb(51,51,51);
	background-color: transparent;
	margin: 0px;
	padding: 0px;

	border: none;
  overflow: auto;
  outline: none;
	border-radius: 0px;

  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;

  resize: none;
}
.blast-options {
	display: table;
	width: 100%;
	background-color: #c6c6c6;
  position: fixed;
  top: 98px;
  width: 100%;
}
.blast-content {
	margin-top: 50px;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
}
.blast-subject {
	display: table-cell;
	padding: 5px;
	vertical-align: middle;
}
.blast-subject input {
	margin-bottom: 0px;
	font-size: 16px;
}
.blast-subject .blast-subject-error {
	border-color: #ff0000;
}
.blast-menu {
	display: table-cell;
	line-height: 50px;
}
.blast-menu-options {
	display: table;
	width: 100%;
	background-color: #c6c6c6;
}
.blast-menu-options-scroll {
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
}
.blast-target {
	width: 1%;
	position: relative;
}
.blast-target label {
	display: block;
	min-width: 32px;
	height: 50px;
	cursor: pointer;
	white-space: nowrap;
	line-height: 46px;
	padding: 0px 10px;
}
.blast-target label:hover {
	background-color: rgba(0,0,0,0.05);
}
.blast-target.blast-target-active label {
	background-color: rgba(0,0,0,0.1);
}
.blast-target.blast-view label {
	background-color: rgba(0,0,0,0.2);
}
.blast-target.blast-target-disabled.blast-view label {
	background-color: rgba(157,8,17,0.6);
}
.blast-format-disabled {
	background-color: rgba(157,8,17,0.6);
	text-align: center;
	min-width: 320px;
	padding: 7px 0px;
	color: #fff;
	font-size: 14px;
}
.blast-target input[type="checkbox"] {
	vertical-align: middle;
	margin: -4px 0px 0px;
}
.blast-target img.blast-icon {
	padding: 0px;
	opacity: 0.3;
}
.blast-target.blast-target-active img.blast-icon {
	opacity: 0.8;
}
.blast-target.blast-view img.blast-icon {
	opacity: 1.0;
}
.blast-close {
	cursor: pointer;
	position: absolute;
	font-size: 20px;
	font-weight: 800;
	color: #aaa;
	background-color: #c6c6c6;
	width: 48px;
	margin: 0px 2px;
	padding: 3px 0px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}
.blast-close:hover {
	background-color: rgb(222, 185, 185);
	color: #fff;
}
.blast-send {
	width: 1%;
}
.blast-send button {
	margin: 0px 0px;
	position: relative;
}
.blast-send .caret {
	position: absolute;
	bottom: 3px;
	left: 0px;
	right: 0px;
	margin: auto;
}
div.blast-main {
	width: 600px;
	margin: auto;
	margin-top: 40px;
	margin-bottom: 40px;
	background-color: #ffffff;
	border: 1px #969696 solid;
	letter-spacing: 1px;
	line-height: 18px;
	font-family: Helvetica,Arial,sans-serif;
}
img.blast-logo {
	display: block;
	width: 100%;
	margin: auto;
}

/* Creator Properties */
.creator-props {
	display: table;
	width: 100%;
	font-size: 12px;
	margin-top: 20px;
  background-color: #e8e8e8;
}
.creator-props .creator-props-left {
	display: table-cell;
	vertical-align: middle;
	height: 35px;
	padding: 5px 0px 5px 20px;
	text-align: left;
}
.creator-props .creator-props-right {
	display: table-cell;
	vertical-align: middle;
	width: 100px;
	height: 35px;
	padding: 5px 20px 5px 0px;
}
.creator-props input {
	padding: 0px;
	margin: 0px;
	background-color: transparent;
	border-color: transparent;
}
.creator-props select,
.creator-props input[type="text"],
.creator-props input[type="number"] {
	color: inherit;
	height: 34.5px;
	background-color: #fff;
	border-color: transparent;
	padding-left: 10px;
}
.creator-props button {
	padding-left: 5px;
	padding-right: 5px;
	margin: 0px;
}

/* Creator Templates */
.creator-templates-section {
  position: fixed;
  bottom: 0px;
  z-index: 32;
	padding: 2px 0px 0px;
	text-align: left;
	-webkit-transition: bottom 1s; /* Safari */
  transition: bottom 1s;
}
.creator-templates-tabgroup {
	position: absolute;
	top: -30px;
	padding-left: 5px;
}
.creator-templates-tab {
	background-color: #bfbfbf;
	color: #666;
	font-size: 14px;
	display: inline-block;
	cursor: pointer;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	padding: 7px 12px;
	margin: 0px 5px;
}
.creator-templates-tab-sel {
	background-color: #d2d2d2;
	color: #2f2f2f;
}
.creator-template-none {
	line-height: 26px;
  background-color: #e1e1e1;
  padding: 10px;
}
.creator-templates-scroll {
	overflow-x: scroll;
	overflow-y: visible;
	-webkit-overflow-scrolling: touch;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
}
.creator-templates {
	display: table;
	background-color: #d2d2d2;
	width: 100%;
	height: 100%;
	min-height: 120px;
	text-align: left;
  border-collapse: separate;
  border-spacing: 10px;
}
.creator-template {
	display: table-cell;
	border-radius: 10px;
	padding: 10px 0px 30px;
	background-color: #e8e8e8;
	color: #555;
	min-width: 200px;
	cursor: pointer;
	font-size: 13px;
	line-height: 20px;
	position: relative;
}
.creator-template:hover {
	color: #333;
	background-color: #f2f2f2;
}
.creator-template:hover .creator-template-details {
	opacity: 0.6;
}
.creator-template-brief {
	padding: 0px 20px 0px;
}
.creator-template.creator-template-sel {
	color: #333;
	background-color: #f6f6f6;
}
.creator-template.creator-template-sel .creator-template-details {
	opacity: 0.7;
}
.creator-template .creator-template-details {
	padding: 10px 0px 0px;
	text-align: left;
	opacity: 0.4;
	padding: 0px 13px;
	box-sizing: border-box;
	width: 100%;
	position: absolute;
	bottom: 0;
}
.creator-template .creator-template-details img {
	display: inline-block;
	height: 16px;
	margin: 0px 10px 0px 0px;
	opacity: 0.5;
}
.creator-template .creator-template-details span {
	display: inline-block;
	float: right;
	font-size: 12px;
}
@media only screen and (min-width: 600px) {
	.creator-outer {
		zoom: 100%;
	}
	.creator-outer .tip-guide {
		zoom: 100%;
	}
	.creator {
		display: table;
	}
	.creator-block .creator-modifiers-top-right {
		top: -25px;
		right: -15px;
	}
	.creator-block .creator-modifiers-bottom-right {
		bottom: -25px;
		right: -15px;
	}
	.creator-block .creator-modifiers-bottom-left {
		bottom: -25px;
		left: -15px;
	}
	.creator-block .creator-modifier-group,
	.creator-block .creator-modifier,
	.creator-block .creator-modifier-sel,
	.creator-outer .creator-block .creator-modifier-group,
	.creator-outer .creator-block .creator-modifier,
	.creator-outer .creator-block .creator-modifiers .creator-modifier,
	.creator-outer .creator-block .creator-modifier-group
	.creator-outer .creator-block .creator-modifier-group .creator-modifier.creator-modifier-sel,
	.creator-outer .creator-block .creator-modifier-sel {
		font-size: 14px;
		width: 30px;
		height: 30px;
		line-height: 30px;
	}
	.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(2),
	.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(2) {
		top: -30px;
	}
	.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(3),
	.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(3) {
		top: -60px;
	}
	.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(4),
	.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(4) {
		top: -90px;
	}
	.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(5),
	.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(5) {
		top: -120px;
	}
	.creator-block .creator-modifier-group:hover .creator-modifier:nth-child(6),
	.creator-outer .creator-block .creator-modifier-group:hover .creator-modifier:nth-child(6) {
		top: -150px;
	}
	.creator-block .creator-modifier input,
	.creator-outer .creator-block .creator-modifier input {
		width: 24px;
		height: 30px;
		line-height: 30px;
		margin-top: 0px;
	}

	.creator-options-pane {
		display: none;
	}

	.blast-menu {
		display: none;
	}
}


/* Blasts */
.blast-send-type {
	display: inline-block;
	padding: 0px 15px 15px 10px;
	cursor: pointer;
}
.blast-send-disabled {
	opacity: 0.8;
}
.blast-send-disabled input.toggle-round + label:before {
	background-color: #ccc;
	cursor: auto;
}
.blast-send-disabled input.toggle-round:checked + label:before {
	background-color: #ccc;
}
.blast-send-type.blast-send-disabled,
.blast-send-disabled .toggle + label,
.blast-send-disabled input.toggle-round + label:after {
	cursor: auto;
}
.blast-level {
	display: inline-block;
	padding: 10px 5px;
	margin: 10px;
	cursor:pointer;
}
.blast-member-count {
	color: #666;
	vertical-align: top;
	margin-left: 5px;
}
.blast-level .blast-member-count {
	color: #aaa;
}

/* Analytics */
.record-label {
  display: table;
  width: 100%;
}
.record-label .record-item {
  padding: 10px 0px;
  color: #aaa;
  background-color: rgba(0,0,0,0);
  font-size: 10px;
  line-height: 10px;
}
.record-label .record-item-left {
  padding-left: 20px;
}
.record-sort {
  font-weight: 600;
}
.triangle-up {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;

  border-bottom: 5px solid rgba(0,0,0,0.25);
  margin-bottom: 1.5px;
  margin-left: 1px;
}
.triangle-down {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;

  border-top: 5px solid rgba(0,0,0,0.25);
  margin-bottom: 1.5px;
  margin-left: 1px;
}

.record {
  display: table;
  width: 100%;
  margin: 10px 0px;
	cursor: pointer;
}
.record-footer {
  display: table;
  width: 100%;
  color: #555;
  font-size: 16px;
  font-weight: 600;
}
.record:hover .record-item {
  background-color: #e0e0e0;
}
.record.record-sel .record-item {
  background-color: #5b5b5b;
	color: #fefefe;
}
.record.record-selsub .record-item {
  background-color: transparent;
	color: #fefefe;
}
.record-row {
  display: table-row;
}
.record-item {
  color: #888;
  text-align: center;
  padding: 20px 0px;
  display: table-cell;
  width: 10%;
  background-color: #ececec;
  vertical-align: middle;
}
.record-nopad {
	padding: 0px;
}
.record-item-less {
	padding: 10px 0px;
}
.record-item-small {
	font-size: 12px;
}
.record-item-chunk {
	display: inline-block;
	vertical-align: middle;
	padding-left: 5px;
}
.record-item-chunck-small {
	font-size: 12px;
	line-height: 12px;
	padding-top: 2px;
}
.record-item-chunck-small img {
	display: inline-block;
	vertical-align: middle;
	height: 12px;
}
.record-item-chunck-small span {
	vertical-align: middle;
}
.record-item-chunck-small img.record-icon {
	display: inline-block;
	vertical-align: middle;
	height: 10px;
	opacity: 0.3;
}
.record-item-left {
  text-align: left;
  width: auto;
  padding-left: 20px;
}
.record-item-right {
  text-align: right;
  width: auto;
}
.record-item-color {
	width: 10px;
}
.record-selsub .record-item-color {
	width: 0px;
}
.record-empty {
  display: table-cell;
  width: auto;
}
.record-group {
	margin-top: -10px;
	border-left: 5px solid #c5c5c5;
	border-right: 5px solid #c5c5c5;
	border-bottom: 5px solid #c5c5c5;
	padding-bottom: 5px;
}
.record-subgroup .record {
	margin: auto;
}
.record-subgroup .record .record-item {
	padding-top: 10px;
	padding-bottom: 10px;
}
.record-subgroup .record:nth-child(odd) .record-item {
	background-color: #f6f6f6;
}
.record-cell-hl {
	background-color: rgba(93,69,162,0.7);
	padding: 7px;
	border-radius: 15px;
	color: #fff;
}

/* Activity Feed */
.vue-load {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.15);
	z-index: 100;
  left: 0;
  top: 0;
}
.vue-load .la-line-scale-party {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}
.activity-scroll {
	overflow-y: scroll;
	overflow-x: visible;
	max-height: 530px;
	padding-top: 18px;
	margin-top: 2px;
	position: relative;
}
.activity-none {
	color: #999;
	font-size: 11px;
	padding: 20px 0px 0px;
}
.activity {
	padding-right: 20px;
}
.activity-icon {
	width: 50px;
	height: 50px;
	border-radius: 100%;
	background-color: #887ab7;
	border: 3px solid #fdfdfd;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
	position: relative;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
}
.activity-icon-sub {
	width: 37px;
	height: 37px;
	border-radius: 100%;
	background-color: #887ab7;
	border: 3px solid #fdfdfd;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
	position: relative;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
}
.activity-icon img,
.activity-icon-sub img  {
	max-width: 50%;
	max-height: 50%;
	position: absolute;
	margin: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.activity-line {
	height: 1px;
	width: 15px;
	background-color: #ccc;
	margin-top: 28px;
}
.activity-vline {
	width: 1px;
	height: 95%;
	background-color: #ccc;
	margin-left: 28px;
	position: absolute;
}
.activity-line-sub {
	height: 1px;
	width: 15px;
	background-color: #ccc;
	margin-top: 21px;
}
.activity-vline-sub {
	width: 1px;
	height: 80%;
	background-color: #ccc;
	margin-left: 21px;
	position: absolute;
}
.activity-box {
	width: 100%;
	min-height: 40px;
	margin: 0px 0px 35px;
	padding: 10px 10px 10px 15px;
	font-size: 14px;
	line-height: 25px;
	position: relative;
}
.activity-box:hover {
	background-color: #fefefe;
}
.activity-sub-text {
	color: #aaa;
	font-size: 11px;
  line-height: 11px;
  padding-top: 10px;
	padding-left: 10px;
}
.activity-box-sub {
	width: 100%;
	padding: 7px;
	font-size: 12px;
	margin-bottom: 20px;
}
.activity-box-sub pre {
	white-space: break-spaces;
	font-family: inherit;
	margin: 0px;
}
.activity-profile {
	position: absolute;
	bottom: -30px;
	right: -20px;
}
.activity-date {
	position: absolute;
	bottom: -27px;
	right: 40px;
	font-size: 12px;
}
.activity-filters {
	display: block;
	text-align: center;
	padding: 7px 0px;
	font-size: 12px;
}
.activity-filter-label {
	display: inline-block;
	padding: 5px 7px;
	margin: 0px 4px;
	color: #999;
	font-size: 11px;
}
.activity-filter {
	display: inline-block;
	padding: 5px 7px;
	border-radius: 15px;
	margin: 0px 4px;
	color: #555;
	cursor: pointer;
}
.activity-filter:hover {
	background-color: #ccc;
	color: #fefefe;
}
.activity-filter-hl:hover,
.activity-filter-hl {
	background-color: #999;
	color: #fefefe;
	cursor: default;
}
.activity-count-top {
	display: inline-block;
	font-size: 12px;
	color: #999;
	padding: 5px 7px;
	margin: 0px 4px;
}
.activity-count {
	font-size: 13px;
	color: #999;
	width: 56px;
	padding-right: 15px;
}
.activity-loadmore {
	padding-left: 10px;
	padding-right: 30px;
}
.activity-arrow-parent {
	position: relative;
}
.activity-arrow-up,
.activity-arrow-down {
	width: 100%;
  background-color: rgba(0,0,0,0.2);
  position: absolute;
  padding: 7px 0px;
  color: #fff;
	z-index: 10;
}
.activity-arrow-up {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.2),
    rgba(0,0,0,0.1)
  );
}
.activity-arrow-down {
	bottom: 0px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.1),
    rgba(0,0,0,0.2)
  );
}
.activity-arrow-up .caret {
	border-bottom: 10px dashed;
	border-bottom: 10px solid \9;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	border-top: 0px;
}
.activity-arrow-down .caret {
	border-top: 10px dashed;
	border-top: 10px solid \13;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
}

/* Timespan */
.timespan-action {
  display: inline-block;
  margin: 0px 10px;
  padding: 10px 0px;
  color: #555;
  font-weight: 600;
  font-size: 20px;
  line-height: 20px;
  letter-spacing: -0.5px;
  vertical-align: middle;
  cursor: pointer;
  position: relative;
}
.timespan-arrow {
  display: inline-block;
  width: 25px;
  height: 25px;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border: 1px solid rgba(0,0,0,0.2);
  text-align: center;
  vertical-align: middle;
  margin-top: -3px;
  margin-left: 2px;
}
.timespan-arrow span {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;

  border-top: 5px solid rgba(0,0,0,0.3);
  margin-bottom: 2px;
}
.timespan-arrow-hl,
.timespan-action:hover .timespan-arrow {
  background-color: rgba(0,0,0,0.1);
}
.timespan-dropdown {
	display: none;
  position: absolute;
  right: 0;
  padding: 10px 10px 0px;
  background-color: #ddd;
  border: 1px solid #ccc;
  cursor: default;
	z-index: 1000;

  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  webkit-box-shadow: 0 0 2px rgba(0,0,0,0.19), 0 2px 2px rgba(0,0,0,0.12);
  box-shadow: 0 0 2px rgba(0,0,0,0.19), 0 2px 2px rgba(0,0,0,0.12);
}
.timespan-down {
  display: inline-block;
  outline: none;
}
.timespan-request {
	display: table;
	width: 300px;
}
.timespan-options {
  font-size: 12px;
}
.timespan-options .tbl-cell {
  padding: 15px 0px;
  text-align: center;
  color: #888;
  cursor: pointer;
}
.metric-title {
	font-size: 20px;
	font-weight: 800;
	margin: 3px 0px 22px;
}
.metric-mini {
	color: #333;
	font-size: 18px;
}
.metric-mini-title {
	font-size: 12px;
}


/* Referral Code */
.referral-code {
	color: #999;
	font-size: 70px;
	font-weight: 800;
	text-align: center;
	padding: 40px 0px;

  -webkit-user-select: text; /* Chrome/Safari */
	-khtml-user-select: text;
  -moz-user-select: text; /* Firefox */
  -ms-user-select: text; /* IE10+ */
	/* Not implemented in browsers yet */
	-o-user-select: text;
	user-select: text;
}


/* Shop */
.shop-header {
	background-color: #dedede;
}
.tbl-cell.shop-header-first {
	width: 1%;
	vertical-align: top;
}
.shop-header-click {
	display: inline-block;
	padding: 15px 20px;
	vertical-align: middle;
	cursor: pointer;
	white-space: nowrap;
}
.shop-header-click-sel,
.shop-header-click:hover {
	background-color: rgba(0,0,0,0.1);
}
.shop-header-icon {
	display: inline-block;
	height: 30px;
	opacity: 0.8;
	vertical-align: middle;
	margin-right: 5px;
}
.shop-header-title {
	display: inline-block;
	vertical-align: middle;
	text-align: left;
	font-size: 20px;
	line-height: 20px;
}
.shop-header-tags {
	display: inline-block;
	vertical-align: middle;
	padding-left: 5px;
}
.shop-header-tag {
	display: inline-block;
	vertical-align: middle;
	font-size: 14px;
	margin: 3px;
	padding: 5px;
	border-radius: 6px;
	background-color: rgba(0,0,0,0.1);
}
.shop-header-tag-del {
	font-weight: 800;
	font-size: 24px;
	line-height: 14px;
	color: #888;
	vertical-align: middle;
	cursor: pointer;
	padding: 5px 5px 5px 3px;
	margin: 0px -5px;
	display: none;
}
.shop-header-tag:hover .shop-header-tag-del {
	display: inline;
}
.shop-header-tag-del:hover {
	color: #333;
}
.shop-right {
	text-align: right;
	vertical-align: middle;
}
.shop-header-cart img {
	height: 30px;
	display: block;
}
.shop-main {
	position: relative;
}
.shop-menu-fade {
	position: absolute;
	background: rgba(0,0,50,0.4);
	width: 100%;
	height: 100%;
	min-height: 800px;
}
.shop-menu {
	position: absolute;
	left: -250px;
	top: 0px;
	width: 250px;
	height: 100%;
	min-height: 800px;
	background-color: #e3e3e3;
	z-index: 10;
	transition: left 0.5s;
}
.shop-menu-group {
	border-left: 10px solid rgba(0,0,0,0.3);
	border-top: 1px solid rgba(0,0,0,0.3);
	border-bottom: 3px solid rgba(0,0,0,0.3);
	background-color: rgba(0,0,0,0.03);
}
.shop-menu-item-target {
	outline: 2px dashed #888;
}
.shop-menu-item {
	font-size: 16px;
	padding: 16px 5px 16px 20px;
	cursor: pointer;
}
.shop-menu-item input[type=checkbox] {
	margin-left: -6px;
	margin-right: 10px;
}
.shop-menu-item:hover {
	background-color: rgba(0,0,0,0.05);
}
.shop-menu-item-sel:hover,
.shop-menu-item-sel {
	background-color: rgba(0,0,0,0.05);
}
.shop-menu-search {
	padding: 10px 10px 10px 20px;
}
.shop-menu-plus img {
	display: inline-block;
	min-width: 24px;
	height: 24px;
	opacity: 0.3;
	vertical-align: middle;
	visibility: hidden;
}
.shop-menu-item:hover .shop-menu-plus img,
.shop-menu-item-sel:hover .shop-menu-plus img {
	visibility: visible;
}
.shop-menu-item input.shop-menu-item-edit {
	color: #333;
	height: 24px;
	font-size: 16px;
	line-height: 24px;
	background-color: transparent;
	margin: 0px;
	padding: 0px;
	border: none;
	display: inline-block;
}
.shop-menu-item input.shop-menu-item-edit::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #999;
  opacity: 1; /* Firefox */
	font-size: 14px;
}
.shop-menu-item input.shop-menu-item-edit:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #999;
	font-size: 14px;
}
.shop-menu-item input.shop-menu-item-edit::-ms-input-placeholder { /* Microsoft Edge */
  color: #999;
	font-size: 14px;
}
.shop-menu-down {
	display: inline-block;
	line-height: 1;
	content: '\u02C6';
	font-size: 30px;
	line-height: 24px;
	float: right;
	color: #999;
	margin-bottom: -20px;
}
.shop-products {
	text-align: left;
}
.shop-product {
	display: table;
	width: 100%;
	padding: 20px;
	border-bottom: 1px solid #ccc;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.shop-product:hover {
	background-color: rgba(0,0,0,0.05);
}
.shop-product-area {
	display: table-row;
}
.shop-product-preview {
	width: 150px;
	height: 120px;
	background-color: #fff;
	border-radius: 10px;
	border: 1px solid #ccc;
	overflow: hidden;
	display:table-cell;
	vertical-align: middle;
	text-align: center;
}
.shop-product-preview img {
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
.shop-product-info {
	display: table-cell;
	padding-left: 20px;
}
.shop-product-content {
	display: table;
	width: 100%;
}
.shop-product-title {
	display: block;
	text-align: right;
	font-size: 16px;
	padding-top: 10px;
}
.shop-product-price {
	display: block;
	text-align: right;
	font-size: 18px;
	font-weight: 600;
	padding: 10px 0px;
}
.shop-product-button {
	padding: 5px 10px 7px;
	color: #efefef;
	font-size: 18px;
	line-height: 18px;
	font-weight: 600;
	letter-spacing: 2px;
	text-align: center;
	cursor: pointer;
}
.shop-product-button img {
	height: 18px;
	display: inline;
	vertical-align: middle;
}
.shop-product-button span {
	vertical-align: middle;
}
/* For tablets */
@media only screen and (min-width: 600px) {
	.shop-menu-fade {
		display: none;
	}
	.shop-menu {
		left: 0px;
	}
	.shop-products {
		margin-left: 250px;
	}
	.shop-product {
		margin: 10px;
		width: auto;
		display: inline-block;
		border-radius: 10px;
		border-bottom: none;
	}
	.shop-product-area {
		display: block;
	}
	.shop-product-preview {
		width: 250px;
		height: 200px;
	}
	.shop-product-info {
		display: block;
		padding: 0px;
	}
	.shop-product-content {
		margin: 10px 0px;
	}
	.shop-product-title {
		display: table-cell;
		text-align: left;
		font-size: 14px;
		padding: 0px;
	}
	.shop-product-price {
		display: table-cell;
		font-size: 14px;
		padding: 0px;
	}
	.shop-product-button {
		padding: 15px;
	}
}

/* Tip Guide */
.tip-fade:before {
  content: "";
	background-color: rgba(255,255,255,0.3);
  -webkit-backdrop-filter: blur(0.7px);
  backdrop-filter: blur(0.7px);
	position: fixed;
	top: -10000px;
	bottom: -10000px;
	left: -10000px;
	right: -10000px;
	z-index: 50;
}
.tip {
  position: relative;
	z-index: 51;
}
.tip-guide {
	width: max-content;
  display: inline-block;
  position: absolute;
  z-index: 101;
  transition: opacity 0.5s;
}
.tip-hide {
	opacity: 0;
}
.tip-text {
  background-color: #443287;
  color: #fff;
  font-size: 13px;
  line-height: 20px;
	font-weight: normal;
  text-align: center;
  border-radius: 6px;
  padding: 10px;
	margin: 0px;
	width: 100%;
	max-width: 180px;
	font-family: 'Open Sans', sans-serif;
  white-space: pre-wrap;       /* Since CSS 2.1 */
  white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */
}
.tip-text div {
	margin: 10px 0px 3px;
	font-size: 12px;
	color: rgba(255,255,255,0.8);
	white-space: nowrap;
  display: flex;
  justify-content: space-around;
}
.tip-text button,
.tip-text button:focus {
	margin: 0px 7px;
  border: 0px;
  background: none;
  box-shadow: none;
  text-shadow: none;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.25);
}
.tip-text button:hover {
	background-color: rgba(255, 255, 255, 0.8);
  color: #333;
}
.tip-text:before {
  content: "";
  display: inline-block;
  position: absolute;
}
.tip-top .tip-text:before {
  border-top: 7px solid #443287;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  bottom: -7px;
  left: 50%;
  transform: translateX(-50%);
}
.tip-top-left .tip-text:before {
  border-top: 7px solid #443287;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  bottom: -7px;
  left: 80%;
  transform: translateX(-50%);
}
.tip-top-right .tip-text:before {
  border-top: 7px solid #443287;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  bottom: -7px;
  left: 20%;
  transform: translateX(-50%);
}
.tip-top {
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(100% + 10px);
}
.tip-top-left {
  left: 50%;
  transform: translateX(-86%);
  bottom: calc(100% + 10px);
}
.tip-top-right {
  left: 50%;
  transform: translateX(-20%);
  bottom: calc(100% + 10px);
}
.tip-bottom .tip-text:before {
  border-bottom: 7px solid #443287;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  top: -7px;
  left: 50%;
  transform: translateX(-50%);
}
.tip-bottom-left .tip-text:before {
  border-bottom: 7px solid #443287;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  top: -7px;
  left: 80%;
  transform: translateX(-50%);
}
.tip-bottom-right .tip-text:before {
  border-bottom: 7px solid #443287;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  top: -7px;
  left: 20%;
  transform: translateX(-50%);
}
.tip-bottom {
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 10px);
}
.tip-bottom-left {
  left: 50%;
  transform: translateX(-86%);
  top: calc(100% + 10px);
}
.tip-bottom-right {
  left: 50%;
  transform: translateX(-20%);
  top: calc(100% + 10px);
}
.tip-right .tip-text:before {
  border-right: 7px solid #443287;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  left: -7px;
  top: 50%;
  transform: translateY(-50%);
}
.tip-right {
  top: 50%;
  transform: translateY(-50%);
  left: calc(100% + 10px);
}
.tip-right-bottom .tip-text:before {
  border-right: 7px solid #443287;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  left: -7px;
  top: 20%;
  transform: translateY(-50%);
}
.tip-right-bottom {
  top: 50%;
  transform: translateY(-20%);
  left: calc(100% + 10px);
}
.tip-left .tip-text:before {
  border-left: 7px solid #443287;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  right: -7px;
  top: 50%;
  transform: translateY(-50%);
}
.tip-left {
  top: 50%;
  transform: translateY(-50%);
  right: calc(100% + 10px);
}
.tip-left-bottom .tip-text:before {
  border-left: 7px solid #443287;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  right: -7px;
  top: 20%;
  transform: translateY(-50%);
}
.tip-left-bottom {
  top: 50%;
  transform: translateY(-20%);
  right: calc(100% + 10px);
}

/* Tip Progress */
.tour-bg {
	display: inline-block;
	width: 130px;
	font-size: 12px;
	line-height: 12px;
	padding: 10px;
	margin: 25px 0px 30px;
	color: #fff;
	background-color: #bbb;
	border-radius: 18px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	text-align: left;
}
.tour-info {
	white-space: nowrap;
	display: flex;
	align-items: center;
}
.tour-info span {
	display: inline-block;
	vertical-align: middle;
	position: relative;
}
.tour-info img {
	display: block;
	height: 14px;
  opacity: 0.7;
  display: block;
 	-webkit-filter: invert(100%);
 	filter: invert(100%);
	margin-right: 5px;
}
.tour-bar {
	position: absolute;
	width: 50%;
	height: 34px;
	background-color: rgba(0,0,0,0.5);
	top: 0px;
	left: 0px;
	opacity: 0.5;
	border-top-right-radius: 18px;
	border-bottom-right-radius: 18px;
  transition: width 1s;
}
span.tour-percent {
	display: none;
  text-align: center;
  flex: 2;
}
.tour-bg:hover {
	color: #fff;
	background-color: #999;
}
.tour-bg:hover .tour-info img {
	opacity: 0.9;
}
.tour-bg:hover .tour-bar {
	opacity: 0.7;
}
.tour-bg:hover .tour-text {
	display: none;
}
.tour-bg:hover .tour-percent {
	display: inline-block;
}



/* Tabs */
.tab-group {
	position: relative;
	text-align: left;
  margin: 10px 20px 0px;
}
.tab-group .tab-buttons {
	position: absolute;
	margin-top: 10px;
	margin-right: 20px;
	z-index: 50;
	top: 58px;
	right: 0;
}
.tab {
	display: inline-block;
	color: #999;
	background-color: #e5e5e5;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 15px 20px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	font-size: 20px;
	line-height: 20px;
	letter-spacing: 0px;
	margin: 0px 0px;
  min-width: 30px;
	text-align: center;
	cursor: pointer;
}
.tab:hover {
	background-color: #fefefe;
}
.tab span {
	vertical-align: middle;
	padding-left: 5px;
}
.tab img {
	height: 20px;
	display: inline-block;
	vertical-align: middle;
	opacity: 0.3;
  filter: alpha(opacity=30); /* For IE8 and earlier */
}
.tab-sel {
	color: #555;
	background-color: #f6f6f6;
	border-bottom: 1px solid #f6f6f6;
}
.tab-sel img {
	opacity: 0.6;
  filter: alpha(opacity=60); /* For IE8 and earlier */
}
/* For tablets */
@media only screen and (min-width: 600px) {
	.tab-group {
		margin: 10px 30px 0px;
		padding-left: 10px;
	}
	.tab {
		margin: 0px 10px;
	}
}



/* Studios */
.studio .studio-country {
	font-size: 18px;
}
.studio img {
	height: 11px;
	opacity: 0.3;
	display:inline-block;
	vertical-align: middle;
}
.studio .studio-app img {
	height: 13px;
	opacity: 0.3;
	display:inline-block;
}
.studio .studio-logo img {
	height: auto;
	opacity: 1;
	max-width: 100px;
	max-height: 40px;
	display:inline-block;
}
.studio .studio-logo span {
	font-size: 18px;
	font-weight: bold;
	color: #666;
}
.studio .studio-plan {
	display: block;
	vertical-align: middle;
}
.list tr.studio-unverified:nth-child(odd) {
	background-color: rgba(166,132,83,0.14);;
}
.list tr.studio-unverified:nth-child(even) {
	background-color: rgba(166,132,83,0.20);
}


/* Studio Classes */
.class-list .class-item:nth-child(odd) {
	background-color: #e5e5e5;
}
.class-list .class-item:nth-child(even) {
	background-color: #eeeeee;
}
.class-list .class-item:hover {
	background-color: #fff;
}
.class-list .class-item:nth-child(odd).class-staff {
	background-color: rgba(161,161,199,0.35);
}
.class-list .class-item:nth-child(even).class-staff {
	background-color: rgba(161,161,199,0.25);
}
.class-list .class-staff .class-title {
	color: #7373a0;
}
.class-list .class-item:nth-child(odd).class-unavailable {
	background-color: rgba(199,161,161,0.35);
}
.class-list .class-item:nth-child(even).class-unavailable {
	background-color: rgba(199,161,161,0.25);
}
.class-list .class-unavailable .class-title {
  color: #b68686;
}
.class-list .class-item:nth-child(odd).class-hidden {
	background-color: rgba(166,132,83,0.20);
}
.class-list .class-item:nth-child(even).class-hidden {
	background-color: rgba(166,132,83,0.15);
}
.class-list .class-hidden .class-title {
	color: #af9a7b;
}
.class-list .class-staff .box-profile-thumb,
.class-list .class-unavailable .box-profile-thumb,
.class-list .class-hidden .box-profile-thumb {
	opacity: 0.5;
}
.class-item .edit {
	display: none;
	vertical-align: middle;
	padding-bottom: 3px;
}
.class-item:hover .edit {
	float: none;
	display: inline-block;
}
.class-item:hover .box-profile-thumb {
	opacity: 1;
}
.class-edit {
	display: none;
	padding: 20px 30px;
}
.class-category {
	background-color: #5d45a2;
	color: #eee;
	font-size: 12px;
	padding: 7px 20px;
	margin: 10px 0px 10px;
}
.class-category-small {
	background-color: #5d45a2;
	color: #eee;
	font-size: 12px;
	padding: 5px 10px;
	margin: 10px -20px 5px;
	cursor: pointer;
}
.class-group-title {
	color: #eee;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0px;
	line-height: 12px;
	padding: 8px 10px;
	margin: 10px 0px 10px 0px;
	border-radius: 5px;
	cursor: pointer;
}
.class-group-time {
	display: block;
	padding: 2px 0px 2px 15px;
	cursor: pointer;
}
.class-dot {
	width: 12px;
	height: 12px;
	margin: 9px;
	border-radius: 100%;
}
.class-main {
	padding: 20px;
}
.class-title {
	color: #333;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 1px;
	word-break: break-word;
	vertical-align: middle;
}
.class-title-sub {
	color: #999;
	font-size: 11px;
	line-height: 11px;
	font-weight: 600;
	letter-spacing: 0px;
	padding-left: 15px;
}
.class-desc-week {
	display: none;
	width: 100%;
}
.class-description {
	display: none;
	width: 100%;
	padding: 0px 30px 10px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.class-desc-week p,
.class-description p {
	color: #555;
	font-size: 20px;
	font-weight: 300;
	line-height: 30px;
}
.class-time {
	font-size: 14px;
	line-height: 20px;
	padding-top: 1px;
	color: #777;
}
.class-add-instructor {
	float: right;
	font-size: 40px;
	font-weight: 600;
	cursor: pointer;
	line-height: 35px;
}
.class-instructor,
.class-timeslot {
	color: #999;
	padding: 5px 10px 5px 15px;
	vertical-align: middle;
	line-height: 34px;
}
.class-instructor:hover,
.class-timeslot:hover {
	color: #333;
	background-color: #fff;
}
.class-instructor:hover .class-instructor-close,
.class-timeslot:hover .class-timeslot-close {
	color: #333;
}
.class-timeslot-close,
.class-instructor-close {
	display: inline-block;
	float: right;
	font-weight: 600;
	font-size: 30px;
	line-height: 34px;
	padding: 5px;
	cursor: pointer;
	color: #bbb;
}
.class-timeslot-close {
	line-height: 24px;
}
.class-instructor:hover .box-profile-thumb {
	opacity: 1;
}
#class-instructors .class-instructor:nth-child(odd),
#class-timeslots .class-timeslot:nth-child(odd) {
	background-color: #eeeeee;
}
#class-instructors .class-instructor:nth-child(even),
#class-timeslots .class-timeslot:nth-child(even) {
	background-color: #e5e5e5;
}
.timeslots-none {
	display: inline-block;
	padding-top: 10px;
	font-size: 12px;
}
.class-rsvp {
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	margin-top: 10px;
	margin-left: 5px;
	margin-right: 5px;
}
.class-rsvp-num {
	color: rgba(30,153,30,1);/* Green */
	font-size: 30px;
	font-weight: 700;
}
.class-rsvp-text {
	font-size: 12px;
	font-weight: 300;
}

/* Class Levels */
.class-level {
	display: block;
	margin: 0px -20px;
	color: #666;
}
.class-level-color {
	width: 10px;
}
.class-level-class {
	padding: 12px 0px 12px 13px;
	font-size: 16px;
}
.class-level-class span {
	font-size: 14px;
	font-weight: 300;
}
.class-level input {
	margin: 2px 5px 5px 0px;
}
.class-sub-levels {
	display: block;
	padding: 0px 20px 0px 0px;
	text-align: right;
}
.class-sub-levels label {
	white-space: nowrap;
}
.class-level:nth-child(odd) {
	background-color: #e3e3e3;
}
.class-level:nth-child(even) {
	background-color: #ededed;
}

.member-level {
	margin: 0px -20px;
}
.member-level label {
	display: block;
	padding: 5px;
}
.member-level:nth-child(odd) {
	background-color: #e3e3e3;
}
.member-level:nth-child(even) {
	background-color: #ededed;
}

.price-sublevel {
	padding: 10px 30px 0px;
	margin: 0px -20px;
	text-align: right;
	font-size: 14px;
	line-height: 14px;
	display: block;
	color: #777;
}
.price-level {
	padding: 11px 30px;
	margin: 0px -20px;
	text-align: right;
	font-size: 14px;
	line-height: 24px;
	display: block;
	color: #333;
}
.price-level:nth-child(even) {
	background-color: #e6e6e6;
}
.price-level:nth-child(odd) {
	background-color: #ededed;
}
.price-title {
	display: inline-block;
	float: left;
	text-align: left;
	font-size: 18px;
	letter-spacing: 1px;
	line-height: 24px;
}
.price-desc {
	padding-top: 2px;
	color: #555;
	font-size: 12px;
	line-height: 17px;
	letter-spacing: 1px;
	text-align: left;
}
.price-subtitle {
	display: inline-block;
	padding-right: 10px;
	color: #aaa;
	font-size: 9px;
	line-height: 17px;
	vertical-align: top;
	padding-top: 2px;
}
.price-amount {
	display: inline-block;
	vertical-align: bottom;
}
.price-agree {
	cursor: pointer;
	font-size: 10px;
	text-align: left;
	display: block;
	padding-top: 7px;
	padding-bottom: 7px;
}

/* Challenges */
.challenge {
	margin: 10px 5px 10px;
	padding-bottom: 10px;
}
.challenge button {
	margin-top: -3px;
	margin-bottom: 0px;
}
.challenge-category {
	padding: 5px 10px;
	margin: 10px -10px 10px -10px;
	font-size: 13px;
}
.challenge-menu {
	display: none;
	text-align: right;
	font-size: 10px;
	padding-top: 15px;
}
.challenge-latest-left {
	font-size: 12px;
	line-height: 14px;
	text-align: left;
	vertical-align: bottom;
}
.challenge-latest-left div {
	display: inline-block;
	color: #666;
}
.challenge-latest-right {
	color: #666;
	font-size: 30px;
	line-height: 30px;
	text-align: right;
	letter-spacing: -0.5px;
}
.challenge-desc {
	display: none;
}
.challenge-desc p {
	font-size: 16px;
	padding: 10px 0px 5px;
}

/* Progress Bar */
.progress-bar {
	background-color: rgba(0,0,0,0.1);
	height: 20px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	overflow: hidden;
}
.progress-bar div {
	height: 20px;
	border-radius: 10px 5px 5px 10px;
}
.progress-good {
	background-color: rgba(83,166,83,1);
}
.progress-warn {
	background-color: rgba(223,150,72,1);
}
.progress-maxed {
	background-color: rgba(200,63,63,1);
}
.progress-label {
	font-size: 12px;
	color: #b1b1b1;
}

/* QR Scanning */
.keycard-hover {
	display: inline-block;
	position: relative;
	width: 250px;
	height: 155px;
	margin: 5px 0px 10px;
}
.keytag-hover {
	display: inline-block;
	position: relative;
	width: 300px;
	height: 141px;
	margin: 5px 0px 0px;
}
.keycircle-hover {
	display: inline-block;
	position: relative;
	width: 240px;
	height: 240px;
	margin: 5px 0px 0px;
}
.keycard {
	display: inline-block;
	position: absolute;
	left: 0;
	width: 250px;
	height: 155px;
	cursor: pointer;
	background-color: #fff;

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

	box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
	-moz-box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
	-webkit-box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
}
.keytag {
	display: inline-block;
	position: absolute;
	left: 0;
	width: 300px;
	height: 141px;
	cursor: pointer;

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

	box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
	-moz-box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
	-webkit-box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
}
.keycircle {
	display: inline-block;
	position: absolute;
	left: 0;
	width: 240px;
	height: 240px;
	cursor: pointer;

	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;

	box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
	-moz-box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
	-webkit-box-shadow: 3px 5px 6px rgba(0,0,0,0.3);
}
.keycard-front,
.keytag-front,
.keycircle-front {
	-webkit-transform: rotateX(0deg) rotateY(0deg);
	-webkit-transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;

	-moz-transform: rotateX(0deg) rotateY(0deg);
	-moz-transform-style: preserve-3d;
	-moz-backface-visibility: hidden;

	transform: rotateX(0deg) rotateY(0deg);
  transform-style: preserve-3d;
	backface-visibility: hidden;

	/* -- transition is the magic sauce for animation -- */
	-o-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.keycard-hover.flip .keycard-front,
.keytag-hover.flip .keytag-front,
.keycircle-hover.flip .keycircle-front {
	z-index: 20;
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.keycard-back,
.keytag-back,
.keycircle-back {
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;

	-webkit-transform: rotateY(-180deg);
	-webkit-transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;

	-moz-transform: rotateY(-180deg);
	-moz-transform-style: preserve-3d;
	-moz-backface-visibility: hidden;

	transform: rotateY(-180deg);
  transform-style: preserve-3d;
	backface-visibility: hidden;

	/* -- transition is the magic sauce for animation -- */
	-o-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.keycard-hover.flip .keycard-back,
.keytag-hover.flip .keytag-back,
.keycircle-hover.flip .keycircle-back {
	z-index: 25;
	-webkit-transform: rotateX(0deg) rotateY(0deg);
	-moz-transform: rotateX(0deg) rotateY(0deg);
	transform: rotateX(0deg) rotateY(0deg);
}
.keycard-back img {
	height: 120px;
	margin: auto;
	padding: 17px 0px 0px 0px;
}
.keytag-back img {
	height: 120px;
	margin: auto;
	vertical-align: middle;
	padding: 10px 0px 0px 40px;
}
.keycircle-back img {
	height: 120px;
	margin: auto;
	vertical-align: middle;
	padding: 60px;
}

/* Sales */
.modify {
	display: none;
}
.modify input,
.modify select {
	width: 90px;
	height: 26px;
	line-height: 26px;
	text-align: center;
	margin: 2px 0px 0px;
	padding: 10px 0px;
}
.modify select {
	width: 170px;
}
.modify button {
	margin-top: 2px;
	margin-left: -1px;
}
.modify input.small {
	width: 60px;
}
.modify input.large {
	width: 160px;
}
.hidden-date {
	padding: 3px 0px;
}

/* Passes */
.passes {
	font-size: 80px;
	line-height: 70px;
	text-align: center;
	padding-bottom: 20px;
	color: rgba(0,153,0,0.7);/* Green */
	font-weight: 600;
}
.points {
	font-size: 70px;
	line-height: 70px;
	text-align: center;
	padding-bottom: 20px;
	color: rgba(31,81,182,0.6);/* Blue */
	font-weight: 600;
}
.points-amount {
	font-weight: 600;
	font-size: 16px;
}
tr td.rewards,
.rewards {
	padding-left: 10px;
	color: #777;
	font-size: 15px;
	font-weight: 600;
	text-align: left;
}
.passes-icon {
	margin: auto;
	padding: 20px 0px 30px;
}
.passes-icon-med {
	display:inline-block;
	height: 14px;
	opacity: 0.4;
}
.passes-icon-small {
	display:inline-block;
	height: 11px;
	opacity: 0.3;
}
.passes-icon-tiny {
	display:inline-block;
	height: 10px;
	opacity: 0.3;
}
.passes-icon-micro {
	display:inline-block;
	height: 8px;
	opacity: 0.3;
}
.pass-row:nth-child(odd) {
	background-color: #e3e3e3;
}
.pass-row:nth-child(even) {
	background-color: #ededed;
}
.pass-row .pass-left,
.pass-row .pass-right {
	font-size: 10px;
	padding: 4px 10px;
}

.pass-pop-row {
	background-color: #ededed;
	cursor: pointer;
}
.pass-pop-row.selected {
	background-color: rgba(0,150,0,0.1);
}
.pass-pop-row input {
	margin-bottom: 0px;
}
.pass-pop-row .pass-left,
.pass-pop-row .pass-right {
	font-size: 18px;
	padding: 15px 15px;
	border-top: 10px solid #f6f6f6;
	border-bottom: 10px solid #f6f6f6;
}
.pass-row .pass-left,
.pass-pop-row .pass-left {
	width: 65%;
	padding-right: 0px;
}
.pass-row .pass-right,
.pass-pop-row .pass-right {
	width: 35%;
	text-align: right;
	padding-left: 0px;
}
.pass-pop-row .pass-left,
.pass-book-row .pass-left {
	padding-left: 20px;
	font-weight: 600;
	color: #666;
}
.pass-pop-row .pass-left img {
	display:inline-block;
	height: 12px;
	opacity: 0.6;
}
.pass-book-row .pass-right {
	padding-right: 20px;
}
.pass-book-option {
	margin-right: 10px;
}
.pass-book-text {
	color: #aaa;
  font-size: 12px;
  line-height: 17px;
	letter-spacing: 1px;
  padding-top: 2px;
}
.pass-pop-text {
	font-size: 14px;
	color: #888;
	font-weight: 400;
	padding-top: 1px;
}

.pop-text {
	font-size: 16px;
	padding-bottom: 10px;
	text-align: center;
	line-height: 24px;
}
.pop-text span {
	font-style: italic;
	font-weight: bold;
}
.pop-inv-amount input {
	margin: 0px;
	text-align: center;
}
.pop-inv-stock {
	width: 30%;
	font-size: 20px;
	text-align: center;
}

.package-icon {
	display: inline-block;
	height: 18px;
}
.package-count {
	letter-spacing: 0px;
	font-size: 22px;
	font-weight: 600;
	color: #000;
}
.mobile .package-title,
.package-title {
	word-break: break-word;
	letter-spacing: 0px;
	font-size: 22px;
	font-weight: 600;
	line-height: 28px;
	color: #555;
	padding: 18px 0px 18px 20px;
	text-align: left;
}
td .package-title {
	padding-left: 0px;
}
.package-text {
	letter-spacing: 1px;
	font-size: 12px;
	line-height: 17px;
	color: #777;
	padding-top:2px;
}
.package-price {
	display: inline-block;
	vertical-align: middle;
}
.package-cost {
	white-space: nowrap;
	color: #666;
	font-size: 16px;
	line-height: 16px;
	padding-right: 5px;
	vertical-align: top;
}
.package-cost-labels {
	display: inline-block;
	vertical-align: top;
	padding-top: 10px;
	padding-right: 2px;
}
.package-cost-tax {
	color: #777;
	font-size: 10px;
	line-height: 10px;
}
.package-select {
	margin-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	text-align: center;
}
.package-input {
	float: right;
	width: 44px;
	vertical-align: middle;
	margin-bottom: 0px;
	text-align: center;
	position: relative;
	padding-left: 0px;
	padding-right: 0px;
}
.package-input input {
	text-align: center;
	margin-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 7px;
	padding-bottom: 13px;
}

.package-input-textarea {
	text-align: left;
	margin-bottom: 0px;
	padding-left: 7px;
	padding-right: 7px;
	padding-top: 7px;
	padding-bottom: 13px;
}
.package-input-text {
	position: absolute;
	bottom: 0;
	font-size: 9px;
	line-height: 9px;
	text-align: center;
	width: 100%;
	margin-bottom: 2px;
	color: #aaa;
}
.package-input-full {
	vertical-align: middle;
	margin-bottom: 0px;
}
.tbl-cell .package-input {
	float: none;
	display: inline-block;
}
.package-price {
	color:#222;
	font-size: 40px;
	line-height: 40px;
	font-weight: 600;
	letter-spacing: -2px;
}
.package-free {
	color:#222;
	font-size: 33px;
	line-height: 40px;
	font-weight: 600;
	letter-spacing: -2px;
}
.package-detail {
	color: #777;
	font-size: 10px;
	white-space: nowrap;
}
.cart-none {
	background-color: #ccc;
	color: #555;
	font-size: 14px;
	text-align: center;
	margin: -20px -20px 0px;
	padding: 20px;
}
.cart-list select {
	color: #624691;
}
.count-indicator {
	display: none;
	border-radius: 100%;
	background-color: red;
	color: #fff;
	width: 23px;
	height: 23px;
	line-height: 23px;
	text-align: center;
	position: absolute;
	bottom: 5px;
	right: 0px;
}
.nav-on .count-indicator {
	display: block;
	bottom: 5px;
	right: 4px;
}
.menu-item .count-indicator {
	display: block;
	bottom: none;
	top: 8px;
	right: 10px;
	line-height: 22px;
}
.action .count-indicator {
	display: block;
	bottom: none;
	top: 39px;
	right: 4px;
}
.btn-image .count-indicator {
	bottom: 0px;
	right: -10px;
}
.package-list {
	width: 100%;
	display: table;
}
.package-item {
	display: table-row;
	padding: 20px 0px 20px 40px;
	outline: none;
}
.package-list .package-item:nth-child(odd) {
	background-color: #eeeeee;
}
.package-list .package-item:nth-child(even) {
	background-color: #e5e5e5;
}
.package-list .package-item:hover {
	background-color: #fff;
}
.package-item-text {
	font-size: 10px;
	letter-spacing: 0px;
}
.mobile .package-edit,
.package-edit {
	width: 20px;
	text-align: center;
	display: inline-block;
	vertical-align: middle;
}
.package-edit .edit {
	float: none;
	padding-right: 4px;
	display: none;
}
.package-list .package-item:hover .edit {
	display: inline-block;
}
.package-list-label {
	color: #eee;
	background-color: #443287;
	margin: 10px 0px 10px;
	padding: 8px 20px;
	font-size: 12px;
	cursor: pointer;
}
.package-list-count {
	float: right;
	font-size: 12px;
	background-color: rgba(0,0,0,0.25);
	line-height: 20px;
	width: 20px;
	border-radius: 100%;
	text-align: center;
}
.package-inv {
	color: #bbb;
	font-size: 12px;
	font-weight: 600;
  line-height: 17px;
	border: 1px solid #cacaca;
	margin: 2px 3px;
	padding: 1px 4px;
	border-radius: 7px;
}
.package-item:hover .package-instock {
}

#package-classes .package-class:nth-child(odd) {
	background-color: #eeeeee;
}
#package-classes .package-class:nth-child(even) {
	background-color: #e5e5e5;
}
.package-class {
	padding:10px 20px 10px 30px;
}
.package-class .class-title {
	color: #777;
}
#package-classes .package-class:hover .class-title {
	color: #333;
}
#package-classes .package-class:hover {
	background-color: #fff;
}
#package-classes .package-class:hover .package-class-close {
	color: #333;
}
.package-class-close {
	float: right;
	font-size: 30px;
	font-weight: 600;
	line-height: 20px;
	padding: 0px 5px;
	cursor: pointer;
	color: #bbb;
}
.package-options {
	padding:0px 0px 15px;
}
.package-option-item {
	display: block;
	padding: 10px 5px;
}
.package-options .package-option-item:nth-child(odd) {
	background-color: #eeeeee;
}
.package-options .package-option-item:nth-child(even) {
	background-color: #e5e5e5;
}
.package-option-title {
	display: inline-block;
	vertical-align: middle;
}
.package-option-desc {
	font-size: 10px;
	letter-spacing: 0px;
}
input.toggle-round + label.package-option-toggle {
	float: right;
	margin-top: 5px;
}

.package-archive {
	display: none;
}
.package-archive.not-hidden {
	display: table-row;
}
.package-item.package-archive:nth-child(odd) {
	background-color: rgba(199,161,161,0.35);
}
.package-item.package-archive:nth-child(even) {
	background-color: rgba(199,161,161,0.25);
}
.package-item:hover.package-item.package-archive {
	background-color: rgba(199,161,161,0.55);
}
.package-archive .package-title,
.package-archive .package-count,
.package-archive .package-text,
.package-archive .package-cost,
.package-archive .package-cost-tax,
.package-archive .package-price,
.package-archive .package-detail {
	color: #bfa6a6;
}
.package-item:hover.package-archive .package-title,
.package-item:hover.package-archive .package-count,
.package-item:hover.package-archive .package-text,
.package-item:hover.package-archive .package-cost,
.package-item:hover.package-archive .package-cost-tax,
.package-item:hover.package-archive .package-price,
.package-item:hover.package-archive .package-detail {
	color: #777;
}
.package-archive img {
	opacity: 0.2;
}
.package-archive button img {
	opacity: 1.0;
}

.package-item.package-staff:nth-child(odd) {
	background-color: rgba(166,132,83,0.15);
}
.package-item.package-staff:nth-child(even) {
	background-color: rgba(166,132,83,0.15);
}
.package-item:hover.package-item.package-staff:nth-child(even) {
	background-color: rgba(166,132,83,0.35);
}
.package-staff .package-title,
.package-staff .package-count,
.package-staff .package-text,
.package-staff .package-cost,
.package-staff .package-cost-tax,
.package-staff .package-price,
.package-staff .package-detail {
	color: #c0af97;
}
.package-staff img {
	opacity: 0.2;
}
.package-staff button img {
	opacity: 1.0;
}

.package-private .package-title,
.package-private .package-count,
.package-private .package-text,
.package-private .package-cost,
.package-private .package-cost-tax,
.package-private .package-price,
.package-private .package-detail {
	color: #bbb;
}
.package-item:hover.package-private .package-title,
.package-item:hover.package-private .package-count,
.package-item:hover.package-private .package-text,
.package-item:hover.package-private .package-cost,
.package-item:hover.package-private .package-cost-tax,
.package-item:hover.package-private .package-price,
.package-item:hover.package-private .package-detail {
	color: #777;
}
.package-private img {
	opacity: 0.2;
}
.package-private button img {
	opacity: 1.0;
}
.package-item:hover.package-private img {
	opacity: 0.7;
}

.package-hidden {
	display: none;
}
.package-hidden.not-hidden,
.package-admin.package-hidden {
	display: table-row;
}
.package-item.package-admin.package-hidden:nth-child(odd) {
	background-color: rgba(161,161,199,0.35);
}
.package-item.package-admin.package-hidden:nth-child(even) {
	background-color: rgba(161,161,199,0.25);
}
.package-item:hover.package-admin.package-hidden {
	background-color: rgba(161,161,199,0.55);
}
.package-hidden.package-admin .package-title,
.package-hidden.package-admin .package-count,
.package-hidden.package-admin .package-text,
.package-hidden.package-admin .package-cost,
.package-hidden.package-admin .package-cost-tax,
.package-hidden.package-admin .package-price,
.package-hidden.package-admin .package-detail {
	color: #a6abbf;
}
.package-item:hover.package-hidden.package-admin .package-title,
.package-item:hover.package-hidden.package-admin .package-count,
.package-item:hover.package-hidden.package-admin .package-text,
.package-item:hover.package-hidden.package-admin .package-cost,
.package-item:hover.package-hidden.package-admin .package-cost-tax,
.package-item:hover.package-hidden.package-admin .package-price,
.package-item:hover.package-hidden.package-admin .package-detail {
	color: #777;
}
.package-hidden.package-admin img {
	opacity: 0.2;
}
.package-hidden.package-admin button img {
	opacity: 1.0;
}


#pkg-tag-groups {
	display: table;
	width: 100%;
}
.pkg-tag-group {
	display: table-row;
	width: 100%;
}
.pkg-tag-group-name {
	width: 80px;
}
.pkg-tag-group-act {
	display: inline-block;
	white-space: nowrap;
}
.pkg-tag-input-title {
	width: 60px;
	padding-left: 0px;
	padding-right: 0px;
	text-align: center;
}
.pkg-tag-group-tags {
	display: table-cell;
	vertical-align: top;
	padding: 10px 0px 10px 30px;
}
.pkg-tag-group-tags .tag-item:first-child .close {
	display: none;
}
.pkg-tag-group-tags .tag-item {
	margin-top: 2px;
	margin-bottom: 2px;
	background-color: #888;
	vertical-align: top;
	margin-left: 0px;
	margin-right: 8px;
}
.pkg-tag-group-close.close {
	display: table-cell;
	float: none;
	vertical-align: middle;
	text-align: right;
	padding-right: 15px;
}
.pkg-product-select {
	margin-bottom: 0px;
}
.pkg-product-inventory {
	width: 60px;
}
.pkg-product-input {
	padding-left: 0px;
	padding-right: 0px;
	margin-bottom: 0px;
	text-align: center;
}
.pkg-product-button {
	width: 30px;
}
.pkg-product-cell {
	padding-left: 10px;
}
.pkg-product-stock button {
	display: inline-block;
	margin: 0px;
	width: 40%;
	padding: 7px 3px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}
.pkg-product-stock button img {
	max-width: 10px;
}
.pkg-product-stock input {
	display: inline-block;
	text-align: center;
	margin-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	width: 60%;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}


/* Shopping Cart */
.cart-item-tag-group {
	width: auto;
	margin-left: 6px;
}
.cart-item-start-select {
	margin: 0px;
	max-width: 250px;
}
.cart-item-cycles {
	display: inline-block;
	position: relative;
}
.cart-item-cycles img {
	height: 12px;
	position: absolute;
	top: 6.5px;
	left: 5px;
	opacity: 0.25;
}
.cart-item-cycles input {
	margin: 0px;
	width: 50px;
	padding: 5px 0px 5px 10px;
}
.cart-item-subscribe {
	font-size: 10px;
	cursor: pointer;
}
.cart-item-subscribe-agree {
	margin-bottom: 2px;
}
.cart-toggle {
	text-align: right;
	padding: 0px 10px 10px 0px;
	font-size: 10px;
}


.member-options {
	display: table;
	width: 100%;
}
.member-options .member-option {
	display: table-row;
	color: #888;
	cursor: pointer;
}
.member-option-left {
	display: table-cell;
	padding: 10px 20px;
	font-size: 12px;
	line-height: 21px;
}
.member-option-right {
	display: table-cell;
	width: 1%;
	padding: 20px;
	vertical-align: middle;
}
.member-options .member-option:nth-child(odd) {
	background-color: #eeeeee;
}
.member-options .member-option:nth-child(even) {
	background-color: #e5e5e5;
}

/* Buy Menu */
.chooser-fade {
	background-color: rgba(0,0,50,0.4);
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 60;
	overflow-x: auto;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	text-align: center;
}
.chooser {
	width: calc(100% - 50px);
	max-width: 340px;
	margin: 170px 0px 100px;
	box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
}
.chooser-none {
	background-color: #ccc;
	color: #555;
	font-size: 14px;
	text-align: center;
	margin: 10px -20px 20px;
	padding: 10px;
}
.chooser-auto {
	width: calc(100% - 30px);
    max-width: 540px;
}
.chooser-cart {
    width: calc(100% - 40px);
    max-width: 460px;
}
.chooser-text {
	font-size: 15px;
	padding-top: 10px;
}
.chooser-currency {
	color: #999;
	font-size: 24px;
	line-height: 24px;
}
.chooser-input {
	font-size: 34px;
	letter-spacing: -2px;
	display: inline-block;
	color: #666;
	width: 80px;
	padding-left: 0px;
	padding-right: 0px;
	text-align: center;
	margin-bottom: 0px;
}
.chooser-cost {
	font-size: 40px;
	line-height: 40px;
	letter-spacing: -2px;
	padding: 0px 0px 5px;
	display: inline-block;
	vertical-align: middle;
}
.charge-total {
	padding-top: 10px;
	font-size: 14px;
	line-height: 14px;
}
.chooser-extra {
	font-size: 15px;
	line-height: 17px;
	color: #aaa;
}


.increment {
	border-top: transparent 10px solid;
}
.increment-prefix {
	color: #888;
	font-size: 12px;
	line-height: 24px;
}
.increment-value {
	width: 50px;
	height: 60px;
	font-size: 24px;
	letter-spacing: -2px;
	display: inline-block;
	text-align: center;
	margin-bottom: 0px;
	padding: 5px 0px;
}
.increment-left {
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}
.increment-right {
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}
.increment button {
	margin: 0px;
	width: 30px;
	height: 30px;
}
.increment button.plus {
	border-top-left-radius: 0px;
	border-top-right-radius: 3px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.increment button.minus {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 3px;
}
.increment button.plus-left {
	border-top-left-radius: 3px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.increment button.minus-left {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 0px;
}


.cal-main {
	position: relative;
}
.cal-profiles {
	text-align: right;
	margin: 0px 45px -20px 0px;
}
.mobile .cal-profiles,
.cal-profiles {
	display: none;
}
.cal-profile {
	display: inline-block;
	background-color: #e0e0e0;
	padding: 7px 20px 8px;
	margin-right: 5px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	cursor: pointer;
	vertical-align: bottom;
	color: #777;
}
.cal-profile .box-profile {
	margin-right: 0px;
	opacity: 0.6;
}
.cal-profile-sel {
	background-color: #f6f6f6;
	opacity: 1.0;
	padding: 13px 20px 12px;
	cursor: auto;
	margin-bottom: -1px;
}
.cal-profile-sel .box-profile {
	margin-right: 10px;
	opacity: 0.9;
}
.cal-profile .cal-logo {
	height: 42px;
	display: block;
	margin: 0px;
}
.cal-profile-name {
	display: none;
	vertical-align: middle;
	text-align: center;
}
.cal-profile-sel .cal-profile-name {
	display: inline-block;
}
.cal-profile-day {
	text-align: center;
	width: 100%;
	height: 100%;
}
.cal-profile-hour {
	display: inline-block;
	width: 16%;
	line-height: 35px;
	letter-spacing: 0px;
	color: #efefef;
	background-color: #df312e;
	border-collapse: collapse;
	text-align: center;
	cursor: pointer;
}
.cal-profile-halfhour {
	width: 8%;
}
.cal-hour-on {
	background-color: #07820d;
}
.mobile .cal-event,
.cal-event {
	display: none;
}

/* Popup Toast */
.toast {
	position: fixed;
	bottom: 10px;
	right: 30px;
	z-index: 40;
	text-align: right;
	max-width: 320px;
}
.toast .close {
	margin-left: 10px;
}
.toast .close:hover {
	color: #eee;
}
.toast-card {
	display: inline-block;
	margin: 10px 0px;
	padding: 10px 15px;
	border-radius: 5px;
	color: #fff;
	text-align: left;
}
.toast-green {
	background-color: rgba(0,110,0,0.6);
}
.toast-red {
	background-color: rgba(150,0,0,0.6);
}
.toast button {
	background: none;
	background-color: rgba(0,0,0,0.2);
	color: #eee;
	border: none;
	box-shadow: none;
	text-shadow: none;
	margin: 0px 0px 0px 5px;
}
.toast button:focus,
.toast button:active,
.toast button:hover {
	background-color: rgba(0,0,0,0.3);
	color: #fff;
}
.toast-enter-active,
.toast-leave-active {
  transition: all 1s;
}
.toast-enter,
.toast-leave-to {
  opacity: 0;
  transform: translateX(30px);
}
/* List Add/Remove Animation */
.flip-list-move {
  transition: transform 1s;
}
.flip-list-enter-active,
.flip-list-leave-active {
  transition: all 1s;
}
.flip-list-enter,
.flip-list-leave-to {
  opacity: 0;
}
.flip-list-leave-active {
  transition: all s;
}
/* Bounce Animation */
.bounce-enter-active {
  animation: bounce-in 0.7s;
}
.bounce-leave-active {
  animation: bounce-out 0.7s;
}
.bounce-enter-active.modlist-sub-row {
  animation: none;
}
.bounce-leave-active.modlist-sub-row {
  animation: none;
}


.notify-fade,
.notify-success,
.notify-fail {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 60;
	background-color: rgba(0,0,50,0.4);
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.notify-success {
	background-color: rgba(0,50,0,0.5);
}
.notify-fail {
	background-color: rgba(50,0,0,0.5);
}
.notify {
	width: 290px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
}
.notify-wide {
	width: 100%;
	max-width: 90%;
	min-height: 200px;
	max-height:70%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
/* For tablets */
@media only screen and (min-width: 600px) {
	.notify-wide {
		max-width: 600px;
	}
}
.form-text {
	position: relative;
	overflow-y: scroll;
	min-height: 200px;
	max-height: 400px;
	background-color: #fff;
	box-shadow: inset 0 0 5px #aaa;
	white-space: pre-wrap;
	font-size: 16px;
	color: black;
	padding: 20px;
	margin-bottom: 15px;
}
.notify-success .title {
	color: #039427;/*green*/
}
.notify-fail .title {
	color: #df312e;/*red*/
}
.notify .title {
	padding-bottom: 5px;
}
.prompt-text {
	color: #333;
	font-size: 20px;
	font-weight: 400;
	line-height: 36px;
	text-align: center;
	padding: 0px 0px 20px;
	overflow-wrap: break-word;
}
.notify-text {
	color: #333;
	font-size: 23px;
	font-weight: 400;
	line-height: 36px;
	text-align: center;
	padding: 20px 0px;
	margin: 0px -20px;
	overflow-wrap: break-word;
}
.failed-text {
	color: #333;
	font-size: 24px;
	font-weight: 400;
	line-height: 36px;
	text-align: center;
	padding: 5px 0px 20px;
	margin: 0px -20px;
}
.transfer-text {
	color: #333;
	font-size: 24px;
	font-weight: 400;
	line-height: 36px;
	text-align: center;
	padding: 0px 0px 10px;
	margin: 0px -20px;
}
.book-title {
	color: #333;
	font-size: 30px;
	font-weight: 300;
	line-height: 30px;
	text-align: center;
	padding: 10px 0px 0px;
}
.book-text {
	color: #333;
	font-size: 18px;
	font-weight: 400;
	line-height: 36px;
	text-align: center;
	padding: 0px 0px 10px;
}
.book-subject {
	font-size: 20px;
	font-weight: 400;
	line-height: 28px;
	text-align: center;
	padding: 10px 0px;
}
.book-name {
	font-size: 20px;
	color: #777;
	font-weight: 600;
	display: inline-block;
}
.book-option {
	display: block;
	font-size: 20px;
	text-align: center;
	padding: 15px 10px 15px 0px;
	margin: 5px 0px;
	background-color: rgba(0,0,0,0.1);
	vertical-align: middle;
	line-height: 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.book-option input {
	margin-bottom: 4px;
	vertical-align: middle;
}
.book-option select {
	color: #999;
	vertical-align: middle;
	margin: 0px 0px 0px 5px;
	max-width: 100px;
}

.sale-tbl {
	margin-top: 10px;
	background-color: #e3e3e3;
}
.sale-left {
	font-size: 12px;
	line-height: 12px;
	text-align: left;
	width: 60%;
	padding: 10px 0px 10px 40px;
}
.sale-right {
	font-size: 12px;
	line-height: 12px;
	text-align: right;
	width: 40%;
	padding: 10px 40px 10px 0px;
}
.sale-left img {
	display:inline-block;
	height: 10px;
	opacity: 0.3;
}

.calendar-button {
	float: right;
	margin-right: 10px;
}
.calendar-month {
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	padding: 0px 0px 20px;
	vertical-align: middle;
}
.calendar-month span {
	vertical-align: middle;
}
.cal-arrow-left {
	display: table-cell;
	text-align: right;
}
.cal-title {
	display: table-cell;
	width: 1%;
	white-space: nowrap;
	min-width: 170px;
}
.cal-arrow-right {
	display: table-cell;
	text-align: left;
}
.cal-arrow-left div,
.cal-arrow-right div,
.cal-arrow {
	color: #ccc;
	font-size: 30px;
	line-height: 20px;
	display: inline-block;
	padding: 0px 20px 5px;
	vertical-align: middle;
	cursor: pointer;
}
.cal-arrow-left div:hover,
.cal-arrow-right div:hover,
.cal-arrow:hover {
	color: #999;
}
.calendar-pad {
	margin: 0px 20px 0px 20px;
}
.mobile .calendar .tbl-cell,
.calendar .tbl-cell {
	height: 40px;
	text-align: center;
	vertical-align: middle;
	z-index: -1;
	width: 14.28%;
	border: 0px;
}
.calendar .show-day {
}
.mobile .cal-day,
.cal-day {
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	font-weight: 400;
	padding: 5px;
	color: #999;
	letter-spacing: 0px;
}
.mobile .cal-day-weekend,
.cal-day-weekend {
	color: #ccc;
}
.mobile .cal-day-event,
.cal-day-event {
	background-color: #0074cd;
	color: #fff;
	width: 36px;
	height: 36px;
	line-height: 36px;
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	display: inline-block;
	vertical-align: middle;
	padding: 0px;
	cursor: pointer;
}
.mobile .cal-day-today,
.cal-day-today {
	background-color: rgba(255,235,143,0.6);
}
.mobile .cal-day-today .cal-day,
.cal-day-today .cal-day {
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	font-weight: 800;
}
.mobile .calendar .cal-days .tbl-cell,
.calendar .cal-days .tbl-cell {
	height: auto;
	text-align: center;
	padding: 7px 10px;
	font-size: 12px;
	background-color: #ccc;
	color: #777;
}
.calendar .show-day:hover {
	background-color: #fff;
}
.mobile .cal-item,
.cal-item {
	display: none;
	color: #eee;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0px;
	line-height: 12px;
	padding: 8px 10px;
	margin: 0px 10px 10px 10px;
	border-radius: 5px;
}
.cal-item .cal-time {
	padding-left: 10px;
}
.cal-item .close {
	color: #eee;
	font-size: 18px;
	font-weight: 600;
	display: none;
}
.cal-item:hover .close {
	display: inline-block;
}
.cal-item .close:hover {
	color: #fff;
}
.cal-circle,
.cal-number {
	position: absolute;
	top: 50%;
	left: 50%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.mobile .cal-mob,
.cal-mob {
	display: inline-block;
}
.mobile .cal-desk,
.cal-desk {
	display: none;
}


.event-day {
	background-color: #5d45a2;
	color: #eee;
	margin: 0px 0px 0px;
	padding: 9px 0px;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
}
.event-checkin {
	background-color: #5d45a2;
	color: #eee;
	margin: 10px 0px 10px;
	padding: 8px 20px;
	font-size: 12px;
	cursor: pointer;
	vertical-align: middle;
}
.event-checkin:hover {
	opacity: 0.8;
	color: #fff;
}
.event-checkin img {
	height: 12px;
	margin-top: -2px;
	margin-right: 5px;
	display: inline-block;
	vertical-align: middle;

 	-webkit-filter: invert(100%);
 	filter: invert(100%);
}
.event-count {
	float: right;
	font-size: 12px;
	background-color: rgba(0,0,0,0.25);
	line-height: 20px;
	width: 20px;
	border-radius: 100%;
	text-align: center;
}
.event-list .event-item:nth-child(odd),
.staff-list .staff-item:nth-child(odd)  {
	background-color: #e5e5e5;
}
.event-list .event-item:nth-child(even),
.staff-list .staff-item:nth-child(even) {
	background-color: #eeeeee;
}
.staff-list {
	width: 100%;
}
.event-list {
	display: table;
	width: 100%;
}
.event-item {
	display: table-row;
	font-size: 14px;
	cursor: pointer;
}
.event-list .event-item:hover {
	background-color: #f9f9f9;
}
.event-item-hour {
	margin-top: 0px;
	margin-bottom: 10px;
}
.event-item-staff {
	margin-top: 20px;
}
.event-item-pre {
  display: table-cell;
  vertical-align: middle;
  width: 13px;
}
.event-item-private .box-profile {
  display: table-cell;
  vertical-align: middle;
	margin-left: 0px;
	margin-right: 10px;
}
.event-item-dot {
  border-radius: 100%;
  width: 12px;
  height: 12px;
  margin: 9px;
  background-color: #555;
}
.event-item-left {
	display: table-cell;
	padding: 15px 0px 15px 20px;
	font-size: 14px;
}
.event-item-private {
	display: table-cell;
	padding: 15px 0px 15px 5px;
	font-size: 14px;
}
.event-item-mid {
	display: table-cell;
	padding: 15px 15px 15px 0px;
	vertical-align: middle;
  text-align: right;
}
.event-item-right {
	display: table-cell;
	padding: 10px 15px 10px 5px;
	vertical-align: middle;
	text-align: right;
	width: 1px;
}
.event-item-cent {
	display: table-cell;
	padding: 15px 0px 15px 0px;
	vertical-align: middle;
  text-align: center;
}
.event-item-title {
	font-size: 17px;
	line-height: 17px;
	color: #555;
	font-weight: 500;
	vertical-align: middle;
	padding-bottom: 2px;
}
.event-item-title-sub {
	color: #999;
	font-size: 11px;
	line-height: 11px;
	font-weight: 500;
	letter-spacing: 0px;
	padding-left: 15px;
	vertical-align: top;
}
.event-item-text {
	padding-top: 2px;
	display: inline-block;
}
.event-item-text img {
	height: 11px;
	display: inline-block;
	opacity: 0.4;
}
.event-item-session {
	font-size: 30px;
	font-weight: 300;
	white-space: nowrap;
	letter-spacing: -0.5px;
}
.event-item-icon {
	height: 20px;
	float: right;
	opacity: 0.23;
  filter: alpha(opacity=23); /* For IE8 and earlier */
}
.event-item-icon:hover {
	opacity: 0.5;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.event-item .close {
	font-size: 30px;
	font-weight: 800;
}
.event-ratio {
	display: inline-block;
	padding-right: 5px;
	font-size: 17px;
	letter-spacing: -1px;
	text-align: center;
}
.event-ratio-icon {
	display: inline-block;
	height: 12px;
	vertical-align: middle;
	padding-left: 3px;
}
.events {
	padding: 0px;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;

  -webkit-border-bottom-right-radius: 0px;
  -webkit-border-bottom-left-radius: 0px;
  -moz-border-radius-bottomright: 0px;
  -moz-border-radius-bottomleft: 0px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.events .event-day {
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

.cal-day-blue {
	background-color: rgba(0,116,205,1.0);
	background-color: rgba(1,106,188,1.0);
}
.cal-day-red {
	background-color: rgba(205,0,0,0.8);
	background-color: rgba(228,53,53,1.0);
}
.cal-day-green {
	background-color: rgba(21,176,0,0.8);
	background-color: rgba(120,193,14,1.0);
}
.cal-day-orange {
	background-color: rgba(205,130,0,1.0);
	background-color: rgba(247,108,39,1.0);
}
.cal-day-purple {
	background-color: rgba(21,176,0,0.8);
	background-color: rgba(126,69,211,1.0);
}

#date-list .date-item:nth-child(odd) {
	background-color: #eeeeee;
}
#date-list .date-item:nth-child(even) {
	background-color: #e5e5e5;
}
.date-item {
	padding: 15px;
	color: #999;
	font-size: 12px;
	font-weight: 600;
}
#date-list .date-item:hover,
#date-list .date-item:hover .close {
	color: #666;
	background-color: #eee;
}


.label .failed {
	display: inline-block;
}
.pending {
	color: #1f51b6;
	letter-spacing: 0px;
}
.canceled {
	color: #941fb6;
	letter-spacing: 0px;
}
.line {
	height: 1px;
	background-color: rgba(0,0,0,0.07);
	margin: 15px 20px 20px;
}
.full-img {
	margin: auto;
	max-width: 100%;
	max-height: 200px;
}
.success span,
.failed span,
.pending span,
.canceled span {
	vertical-align: middle;
}


/* Form */
.label {
	color: #bbb;
	font-size: 11px;
	letter-spacing: 0px;
	font-weight: 600;
}
.label.pad {
	padding-top: 5px;
	padding-bottom: 0px;
	margin-bottom: 10px;
}
.label a {
	color: #888;
}
.label a:hover {
	color: #444;
}
.label-text {
	font-size: 10px;
	font-weight: 200;
	line-height: 16px;
}
.label-period {
	color: #888;
	font-size: 10px;
	font-weight: 200;
	line-height: 10px;
	padding-bottom: 3px;
}
.label-popup {
	text-align: right;
  padding-bottom: 10px;
  padding-right: 10px;
}
.item {
	color: #999;
	font-size: 0.8em;
	letter-spacing: 0.5px;
}
.form {
	width: 250px;
	margin: auto;
	text-align: left;
}
.form-chunk {
	display: block;
	vertical-align: top;
	margin: 30px 0px;
}
.form-modify {
	width: 350px;
	text-align: left;
}
.form .title,
.form-modify .title {
	padding-bottom: 20px;
}
.saved-info {
	padding: 10px;
	background-color: #ddd;
	text-align: center;
	border-radius: 10px;
	font-weight: 600;
	margin-bottom: 25px;
	color: #555;
	position: relative;
}
.saved-info .count-indicator {
	display: inline-block;
}
.saved-pending {
	padding: 10px;
	background-color: #bec5dd;
	text-align: center;
	border-radius: 10px;
	font-weight: 600;
	margin-bottom: 25px;
	color: #555;
}
.saved-error {
	padding: 10px;
	background-color: #ddbebe;
	text-align: center;
	border-radius: 10px;
	font-weight: 600;
	margin-bottom: 25px;
	color: #555;
}
.form-option {
	cursor: pointer;
	font-size: 10px;
}
.form-option label {
	cursor: pointer;
	display: block;
	margin: 0px -20px;
	padding: 5px 20px;
}
.form-horz {
	margin: 10px -10px 0px;
}
.form-horz input,
.form-horz select {
	margin: 0px;
}
.form-horz button {
	height: 34.5px;
	white-space: nowrap;
	margin: 0px;
}
.form-wide {
	display: none;
	vertical-align: middle;
}
.form-wide input,
.form-wide select {
	margin-bottom: 0px;
}
.form-wide input[type="tel"] {
	padding-left: 0px;
	padding-right: 0px;
	width: 50px;
	text-align: center;
}

.purchase {
	text-align: center;
}
.purchase-discount select {
	margin-bottom: 5px;
}
.purchase-subtotal {
	font-size: 10px;
}
.purchase-subtotal-amount {
	font-size: 12px;
	color: #777;
}
.purchase-user {
	display: inline-block;
	text-align: center;
	color: inherit;
	margin: 0px 0px 20px;
}
.purchase-user-pic {
	display: inline-block;
	width: 120px;
	height: 120px;
	border-radius: 100%;
	background-color: #bbb;
    background-size: cover;
    background-position: center;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
}
.purchase-user-name {
	font-size: 20px;
	font-weight: 600;
}
input.input-quantity {
	width: 50px;
}
.logo {
	display: inline-block;
	height: 30px;
}

.refund-subtotal {
	color: #777;
	text-align: right;
	margin: 0px 15px 15px;
}
.refund-subtotal-amount {
	padding: 0px 0px 0px 7px;
}


/* Admin */
.adm-bar {
	background-color: #0093d4;
	color: #eaeaea;
	font-weight: 600;
	height: 40px;
	line-height: 40px;
}
.adm-left {
	width: 50%;
	display: inline-block;
	text-align: left;
	padding-left: 20px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.adm-right {
	width: 50%;
	display: inline-block;
	text-align: right;
	padding-right: 20px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}


/* Navigation */
.nav-bar-spacer {
	width: 100%;
	height: 64px;
}
.nav-bar {
	position: fixed;
	top: 0px;
	z-index: 80;

	width: 100%;
	height: 64px;

	background: linear-gradient(#444, #222);
	background: -o-linear-gradient(#444, #222);
	background: -moz-linear-gradient(#444, #222);
	background: -webkit-linear-gradient(#444, #222);
}
.nav-shadow {
	box-shadow: 0px 7px 10px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 7px 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 7px 10px rgba(0,0,0,0.2);
}
.nav-right {
	float: right;
}
.nav-nologo {
	max-width: 150px;
	line-height: 20px;
	color: #eaeaea;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 1px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	top: 50%;
  -webkit-transform: translateY(-50%); /* Chrome, Safari, Opera */
  -ms-transform: translateY(-50%); /* IE 9 */
	transform: translateY(-50%);
}
.nav-logo {
	max-width: 150px;
	max-height: 50px;
	height: auto;
	display: block;
	margin: 0px;
	position: relative;
	top: 50%;
  -webkit-transform: translateY(-50%); /* Chrome, Safari, Opera */
  -ms-transform: translateY(-50%); /* IE 9 */
	transform: translateY(-50%);
}
.nav-item {
	height: 64px;
	line-height: 64px;
	color: #dadadd;
	padding: 0px 15px;
	letter-spacing: 0px;
	display: inline-block;
	cursor: pointer;
	vertical-align: middle;
}
.nav-item:hover,
.nav-click:hover .nav-item,
.nav-sub-item:hover {
	color: #fff;
	background-color: #222;

	transition: background-color 0.2s linear, color 0.2s linear;
	-o-transition: background-color 0.2s linear, color 0.2s linear;
	-moz-transition: background-color 0.2s linear, color 0.2s linear;
	-webkit-transition: background-color 0.2s linear, color 0.2s linear;
}
.nav-back {
	font-size: 40px;
	line-height: 56px;
}
.nav-text {
	font-size: 30px;
	font-weight: 700;
}
.nav-click {
	display: inline-block;
  vertical-align: top;
	position: relative;
}
.nav-click .nav-item {
	display: block;
}
.nav-sub {
	background-color: #222;
	display: none;
	position: absolute;
	float: right;
	right: 0px;
}
.nav-click:hover .nav-sub {
	display: block;
}
.nav-icon {
	display: inline-block;
  vertical-align: middle;
	opacity: 0.7;
  filter: alpha(opacity=70); /* For IE8 and earlier */
	max-width: 32px;
	max-height: 30px;
}
.nav-click:hover .nav-icon {
	opacity: 0.9;
  filter: alpha(opacity=90); /* For IE8 and earlier */
}
.nav-sub-item {
	height: 40px;
	line-height: 40px;
	padding: 0px 8px;
	display: block;
	color: #dadadd;
	cursor: pointer;
	white-space: nowrap;
}
.nav-item-sel {
	color: #75c9ff;
}
.profile-name {
	color: #ccc;
	vertical-align: middle;
	display: inline-block;
	line-height: normal;
	text-align: center;
}
.profile-name-light {
	color: #333;
	vertical-align: middle;
	display: inline-block;
	line-height: normal;
	text-align: center;
	padding-right: 10px;
	font-weight: 700;
	cursor: pointer;
}
.profile-level {
	color: #007abf;
	line-height: normal;
}
.profile-icon {
	height: 12px;
	display: inline-block;
	vertical-align: middle;
}


/* Left Nav */
.menu-fade {
	display: none;
	background-color: rgba(0,0,50,0.4);
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 50;
	overflow: hidden;
}
.menu-outer {
	display: none;
	position: fixed;
	left: auto;
	right: -250px;
	width: 170px;
	height: 100%;
	background-color: #333;
	z-index: 50;
	overflow: hidden;
}
.menu-scroll {
	overflow-x: hidden;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	height: 100%;
	width: 200px;
	position: relative;
}
.menu {
	width: 170px;
	text-align: left;
	padding-bottom: 100px;
}
.menu-arrow {
	width: 170px;
	background-color: rgba(0,0,0,0.5);
	position: fixed;
	padding: 5px 0px;
	color: #fff;
	display: none;
}
.menu-arrow-bot {
	bottom: 0;
}
.menu-arrow-bot .caret {
	border-top: 10px dashed;
	border-top: 10px solid \13;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
}
.menu-arrow-top {
  top: 0;
  margin-top: 98px;
}
.menu-arrow-top .caret {
	border-bottom: 10px dashed;
	border-bottom: 10px solid \9;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	border-top: 0px;
}
.menu-category {
	color: #aaa;
	padding: 5px 15px;
	background-color: #222;
	font-size: 10px;
	letter-spacing:0px;
	display: block;
}
.menu-item {
	color: #ccc;
	padding: 11px 0px 11px 20px;
	cursor: pointer;
	position: relative;
	vertical-align: middle;
	font-size: 12px;
}
.menu-item .menu-icon {
	width: 35px;
	text-align: center;
	display: inline-block;
	vertical-align: middle;
}
.menu-item img {
	display: block;
	max-width: 19px;
	max-height: 19px;
	opacity: 0.8;
}
.menu-item span {
	vertical-align: middle;
	font-size: 11.5px;
	line-height: 16px;
}
.menu-item .menu-add {
	float: right;
	margin-right: 10px;
	opacity: 0.4;
}
.menu-item .menu-add:hover {
	opacity: 0.8;
}
.menu-item.nav-item-sel {
	background-color: #443287;
	color: #eee;
}
.menu-item:hover {
	color: #eee;
	background-color: #191919;
}
.menu-item:hover img {
	opacity: 1.0;
}
.menu-social {
	position: relative;
	vertical-align: middle;
	text-align: center;
}
.menu-social-cell {
	display: inline-block;
	text-align: center;
}
.menu-social .menu-icon {
	display: inline-block;
	cursor: pointer;
	padding: 10px 10px;
	vertical-align: middle;
}
.menu-social .menu-icon img {
	display: block;
	text-align: center;
	max-width: 23px;
	max-height: 19px;
	opacity: 0.8;
}
.menu-social .menu-icon:hover {
	background-color: #191919;
}
.menu-social .menu-icon:hover img {
	opacity: 1.0;
}


/* Toggle Checkbox */
.toggle-outer {
	color: #aaa;
	font-size: 12px;
	vertical-align: middle;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
label.toggle-outer {
	cursor: pointer;
}
.toggle-outer select {
	margin-top: 5px;
	margin-bottom: 0px;
}
.toggle-row {
	display: block;
	padding: 15px 0px 20px;
}
.toggle-row label {
	float: right;
	margin-top: 1px;
}
.toggle {
	position: absolute;
	margin-left: -9999px;
	visibility: hidden;
}
.toggle + label {
	display: inline-block;
	position: relative;
	cursor: pointer;
	outline: none;
	user-select: none;
	vertical-align: middle;
}
input.toggle-round + label {
	padding: 2px;
	width: 40px;
	height: 20px;
	background-color: #ccc;
	border-radius: 20px;
	margin-top: -3px;
}
input.toggle-round + label:before,
input.toggle-round + label:after {
	display: block;
	position: absolute;
	top: 1px;
	left: 1px;
	bottom: 1px;
	content: "";
}
input.toggle-round + label:before {
	right: 1px;
	background-color: #de8383;
	border-radius: 20px;
	transition: background 0.4s;
}
input.toggle-round + label:after {
	width: 22px;
	background-color: #fff;
	border-radius: 100%;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
	transition: margin 0.4s;
}
input.toggle-round:checked + label:before {
	background-color: #8ce196;
}
input.toggle-round:checked + label:after {
	margin-left: 20px;
}
.toggle-small {
	cursor: pointer;
}
.toggle-small input.toggle-round + label{
	width: 24px;
	height: 12px;
	border-radius: 12px;
}
.toggle-small input.toggle-round + label:before {
	border-radius: 12px;
}
.toggle-small input.toggle-round + label:after {
	width: 14px;
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
}
.toggle-small input.toggle-round:checked + label:after {
	margin-left: 12px;
}
.toggle-small div {
	display: inline-block;
	width: 40px;
	font-size: 13px;
	font-weight: 400;
	color: #aaa;
}


#ptr {
	position: absolute;
	top: 96;
	left: 0;
	width: 100%;
	color: #fff;
	z-index: 10;
	text-align: center;
	height: 0px;
}
#ptr div.pull-box {
  position: relative;
	width: auto;
	height: auto;
	font-size: 20px;
	line-height: 35px;
	height: 300px;
	background: linear-gradient(rgba(0,0,0,0.9), rgba(0,0,0,0.7));
	background: -o-linear-gradient(rgba(0,0,0,0.9), rgba(0,0,0,0.7));
	background: -moz-linear-gradient(rgba(0,0,0,0.9), rgba(0,0,0,0.7));
	background: -webkit-linear-gradient(rgba(0,0,0,0.9), rgba(0,0,0,0.7));
  -webkit-transform: translate(0%, -100%); /* Chrome, Safari, Opera */
  -ms-transform: translate(0%, -100%); /* IE 9 */
	transform: translate(0%, -100%);
}
#ptr div.pull-box div {
	opacity: .9;
	position: absolute;
	bottom: 5px;
	display: inline-block;
  -webkit-transform: translate(-50%, 0%); /* Chrome, Safari, Opera */
  -ms-transform: translate(-50%, 0%); /* IE 9 */
	transform: translate(-50%, 0%);
}
#ptr div.pull-box img {
	height: 48px;
	margin-left: auto;
	margin-right: auto;
	transition: all .25s ease;
  -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  -ms-transform: rotate(0deg); /* IE 9 */
	transform: rotate(0deg);
}
.ptr-refresh #ptr div.pull-box img {
	-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
  -ms-transform: rotate(180deg); /* IE 9 */
	transform: rotate(180deg);
}
.ptr-loading #ptr div.pull-box,
.ptr-reset #ptr div.pull-box {
	display: none;
}
.ptr-loading #ptr, .ptr-reset #ptr {
	transition: all .25s ease;
}


/* Email Account Settings */
.setting-opt {
	padding: 20px 25px;
	color: #999;
	display: block;
	margin: 0px -20px;
}
.setting-opt .caption {
	color: #999;
	font-weight: 600;
	margin-bottom: 4px;
}
.setting-opt label {
	float: right;
	margin-top: 1px;
}
.setting-opt input {
}
.setting-opt textarea {
	margin: 5px 0px 0px;
}
.setting-opt:nth-child(odd) {
	background-color: #eeeeee;
}
.setting-opt:nth-child(even) {
	background-color: #e5e5e5;
}
.setting-opt:hover {
	background-color: #dedede;
	color: #777;
}
.setting-opt .setting-input {
	text-align: center;
	padding-left: 0px;
	padding-right: 0px;
	margin: 0px;
}
.sub-settings .setting-opt:nth-child(odd) {
	color: #888;
	border-left: 5px #ccc solid;
	background-color: rgba(0,0,0,0.1);
}
.sub-settings .setting-opt:nth-child(even) {
	color: #888;
	border-left: 5px #ccc solid;
	background-color: rgba(0,0,0,0.05);
}
.sub-sub-settings .setting-opt:nth-child(odd) {
	color: #888;
	border-left: 10px #c7c7c7 solid;
	background-color: rgba(0,0,0,0.1);
	padding: 10px 25px 15px;
}
.sub-sub-settings .setting-opt:nth-child(even) {
	color: #888;
	border-left: 10px #c7c7c7 solid;
	background-color: rgba(0,0,0,0.05);
	padding: 10px 25px 15px;
}
.setting-opt .setting-sub-opt,
.setting-sub-opt {
	float: none;
	display: block;
	padding: 15px 0px 0px;
}
.setting-opt-details {
	font-size: 10px;
	letter-spacing: 0px;
}
.setting-flex {
	display: flex;
}
.setting-flex .label {
	flex: 2;
}
.setting-flex input {
	flex: 1;
}
.setting-profile {
	width: 40px;
	height: 40px;
	border-radius: 100%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center;
}
.settings {
	padding: 0px 25px;
}
.settings input {
	margin: 0px 0px;
	font-size: 13px;
	padding-left: 0px;
	padding-right: 0px;
}
.settings:nth-child(odd) {
	background-color: #eeeeee;
}
.settings:nth-child(even) {
	background-color: #e5e5e5;
}
.settings:hover {
	background-color: #f3f3f3;
}
.settings-disabled,
.settings-disabled .settings:hover,
.settings-disabled.setting-opt:nth-child(odd),
.settings-disabled.setting-opt:nth-child(even) {
	opacity: 0.5;
	background-color: transparent;
}
.settings-disabled input {
	background-color: transparent;
	border: none;
}
.settings-pad {
	padding-top: 10px;
	padding-bottom: 10px;
}
.settings-title {
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	text-align: center;
	padding: 10px 0px;
	margin: 0px -20px 5px;
}
.settings-title .label {
	color: #ccc;
	padding-top: 5px;
}
.settings .label {
	font-size: 13px;
	color: #777;
}
.settings .label-sub {
	color: #bbb;
	font-size: 11px;
	letter-spacing: 0px;
	font-weight: 600;
}
.label.error {
	color: #cd7977;
	font-size: 10px;
	outline: none;
}
.settings-failed {
	color: #fff;
	font-size: 10px;
	font-weight: 400;
	text-align: center;
	background-color: #cd7977;
	padding: 10px;
	margin: 0px -20px 5px;
}
.settings-disputed {
	color: #fff;
	font-size: 10px;
	font-weight: 400;
	text-align: center;
	background-color: #e29642;
	padding: 10px;
	margin: 0px -20px 5px;
}


/* Sales Listings */
.after5 {
	display: none;
}
.paid-cash,
.paid-credit,
.paid-check,
.paid-receipt {
	display: inline-block;
	height: 12px;
	vertical-align: middle;
	-webkit-filter: invert(100%) opacity(50%);
  filter: invert(100%) opacity(50%);
}
.paid-free {
	display: inline-block;
	height: 14px;
	vertical-align: middle;
	-webkit-filter: opacity(50%);
	filter: opacity(50%);
}
.paid-text {
	display: inline-block;
	vertical-align: middle;
}
.paid-bank {
	display: inline-block;
	height: 12px;
	vertical-align: middle;
	-webkit-filter: opacity(50%);
	filter: opacity(50%);
	margin-top: -2px;
}
.paid-receipt {
	display: inline-block;
	height: 19px;
	vertical-align: middle;
	-webkit-filter: opacity(50%);
	filter: opacity(50%);
}
.paid-balance {
	display: inline-block;
	height: 12px;
	vertical-align: middle;
	-webkit-filter: opacity(60%);
	filter: opacity(60%);
}
.pend-recur {
	display: inline-block;
	height: 12px;
	vertical-align: middle;
	-webkit-filter: opacity(30%);
	filter: opacity(30%);
	padding-left: 1px;
	margin-bottom: 0px;
}

/* Invoices */
.failed-invoices {
	width: 100%;
	background-color: rgba(150,0,0,0.5);
	margin-top: -20px;
	margin-bottom: 10px;
	color: #fff;
	font-weight: bold;
	padding: 20px;
	text-align: center;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.failed-desc {
	color: rgba(255,220,220,1.0);
	line-height: 22px;
}
.failed-total {
	width: 30%;
	color: rgba(255,220,220,1.0);
	font-size: 40px;
	line-height: 40px;
	font-weight: 400;
	text-align: center;
}

/* Chekcins */
.checkin-color {
	width: 12px;
	height: 51px;
	display: inline-block;
	vertical-align: middle;
}
table.list td .checkin-color {
	margin: -10px 0px;
}
.checkin-pass {
	display: inline-block;
	vertical-align: middle;
	height: 12px;
}
.checkin-pass-title {
	display: inline;;
	vertical-align: middle;
}
.checkin-container {
	text-align: center;
	margin-left: -10px;
	margin-right: -10px;
}
.checkin-profile {
	display: inline-block;
	margin-bottom: 12px;
}
.checkin-labels {
	display: inline-block;
	vertical-align: middle;
	padding: 0px 7px;
}
.checkin-profile-title {
	font-size: 14px;
}
.checkin-profile-name {
	font-size: 17px;
	font-weight: 600;
	color: #888;
}
.check-profile-circle {
	background-color: rgba(0,0,0,0.045);
  border-radius: 32px;
}
.check-profile-round {
	background-color: rgba(0,0,0,0.045);
  border-radius: 10px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
.anim-jump {
  animation: bounce-in 0.7s;
}
@keyframes bounce-in {
  0% {
    transform: scale(1);
		background-color: transparent;
  }
  50% {
    transform: scale(1.1);
		background-color: rgba(0,150,0,0.2);
  }
  100% {
    transform: scale(1);
		background-color: transparent;
  }
}
.anim-delete {
  animation: bounce-out 0.7s;
}
@keyframes bounce-out {
	  0% {
	    transform: scale(1);
			background-color: transparent;
	  }
	  50% {
			background-color: rgba(150,0,0,0.2);
	  }
	  100% {
	    transform: scale(1.1);
			opacity: 0;
	  }
}

.anim-group-jump-item {
  transition: all 1s;
}
.anim-group-jump-enter-active {
  animation: bounce-in 0.7s;
}
.anim-group-jump-leave-active {
  animation: bounce-out 0.7s;
}

/* Checks */
.check-outer {
	background-color: #fff;
}
.check {
	display: inline-block;
	width: 900px;
	height: 410px;
	border-top: 20px solid #b9371e;
	margin: 60px 0px;
	position: relative;
}
.check-deposited {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
	font-size: 50px;
}
.check input {
	border: 0px solid transparent;
	background-color: transparent;
	margin: 0px;
	padding: 0px;
	color: #999;
	border-radius: 0px;
}
.check .tbl-cell {
	vertical-align: top;
}
.check-business {
	padding: 20px;
	display: inline-block;
}
.check-business .check-name {
	line-height: 20px;
	font-size: 20px;
	font-weight: 600;
	color: #444;
}
.check-business .check-address {
	line-height: 15px;
	font-size: 15px;
	padding-top: 5px;
	color: #444;
}
.check .check-num {
	float: right;
	display: inline-block;
	text-align: right;
	padding: 20px 20px 0px 0px;
	font-size: 23px;
	line-height: 23px;
	color: #666;
}
.check .check-date {
	max-width: 200px;
	margin-right: 150px;
	text-align: right;
	color: #999;
}
.check .check-date-input {
	color: #333;
	font-size: 30px;
	line-height: 30px;
	text-align: center;
	border-bottom: 1px solid #666;
}
.check-nameamount {
	width: 100%;
	margin-top: 25px;
}
.check-orderof {
	text-align: right;
	color: #999;
	line-height: 14px;
	font-size: 14px;
	padding-top: 10px;
}
.check .check-recipient {
	line-height: 40px;
	font-size: 40px;
	border-bottom: 1px solid #666;
	border-right: 1px solid #666;
	padding-left: 40px;
	color: #333;
}
.check-dollarsign {
	font-size: 40px;
	line-height: 40px;
	padding-left: 20px;
}
.check .check-amount {
	line-height: 40px;
	font-size: 40px;
	border: 1px solid #aaa;
	width: 190px;
	padding-left: 5px;
	color: #333;
}
.check-written {
	text-align: left;
	padding-top: 25px;
}
.check-written input {
	width: 720px;
	font-size: 26px;
	line-height: 26px;
	border-bottom: 1px solid #666;
	margin-left: 20px;
	margin-right: 10px;
	padding-left: 20px;
	color: #333;
}
.check-written img {
	display: inline-block;
	opacity: 0.6;
	margin-left: 20px;
}
.check-written span {
	display: inline-block;
	padding-top: 20px;
	color: #999;
}
.check-notesignature {
	margin-top: 35px;
}
.check .check-for {
	color: #999;
	line-height: 40px;
	padding-top: 15px;
	padding-left: 40px;
}
.check .check-note {
	color: #333;
	font-size: 20px;
	line-height: 20px;
	text-align: center;
	letter-spacing: 0.5px;
	border-bottom: 1px solid #666;
	width: 280px;
	padding-top: 21px;
}
.check .check-signature {
	color: #333;
	font-size: 40px;
	line-height: 40px;
	text-align: center;
	border-bottom: 1px solid #666;
	margin-right: 40px;
	width: 350px;
	font-family: Snell Roundhand, cursive;
}
.check-signature-label {
	color: #999;
	text-align: right;
	margin-right: 40px;
}
@font-face {
  font-family: 'micr_encodingregular';
  src: url('fonts/micrenc-webfont.woff2') format('woff2'),
       url('fonts/micrenc-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
.tbl.check-micr {
	font-family: 'micr_encodingregular';
	font-size: 38px;
	font-weight: 800;
	width: auto;
	margin: 10px 0px 0px 60px;
	color: #000;
}
.tbl-cell.check-routing {
	white-space: nowrap;
}
.tbl-cell.check-account {
	white-space: nowrap;
	padding-left: 30px;
	padding-right: 3px;
}
.tbl-cell.check-routing input,
.tbl-cell.check-account input,
.tbl-cell.check-number input
 {
	display: inline;
	font-family: 'micr_encodingregular';
	font-size: 38px;
	font-weight: 800;
	color: #000;
}
.check-endorse {
	color: #aaa;
	width: 300px;
  margin-left: -50px;
  margin-top: 180px;
  transform: rotate(-90deg);
  /* Safari */
  -webkit-transform: rotate(-90deg);
  /* Firefox */
  -moz-transform: rotate(-90deg);
  /* IE */
  -ms-transform: rotate(-90deg);
  /* Opera */
  -o-transform: rotate(-90deg);
  /* Internet Explorer */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.check-endorse-signature {
	font-family: Snell Roundhand, cursive;
	font-size: 40px;
	line-height: 40px;
	height: 40px;
	border-bottom: 1px solid #333;
	width: 300px;
	display: inline-block;
	text-align: center;
	color: #333;
	margin-top: 20px;
}
@media print {
	div.check-outer {
		background-image: none;
	}
	.check {
		margin: 100px 0px 100px;
	}
}

/* Timesheets */
.clock {
	display: inline-block;
	text-align: right;
}
.clock select {
  width: 125px;
}
@media only screen and (min-width: 600px) {
	.clock {
	  position: absolute;
	  top: -11px;
	  right: 20px;
	}
}
.clock input {
	width: 150px;
  margin: 0px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}
.clock button {
	margin: 0px;
	vertical-align: middle;
	height: 40px;
}
input.clock-title {
  width: 125px;
  padding: 10px 5px 10px 10px;
	display: inline-block;
	vertical-align: middle;
	font-size: 16px;
	color: #777;
	line-height: 16px;
	margin: 0px;
	background-color: transparent;
	border: 1px transparent solid;
	min-width: 100px;
}
.clock-title:hover {
	background-color: #fff;
	border: 1px #fff solid
}
.clock-title:focus {
	background-color: #fff;
	border: 1px #dadada solid;
}
.clock-time {
	display: inline-block;
	vertical-align: middle;
	font-size: 30px;
	font-weight: 200;
	line-height: 40px;
	padding: 0px 7px;
}
button .clock-time {
	text-align: center;
	font-size: 20px;
	width: 80px;
	padding: 0px;
}
.timeclock-profile {
	display: inline-block;
  vertical-align: middle;
}
.timeclock-hide {
	display: none;
}
table.list tr.timeclock:hover {
	background-color: #fff;
}
.timeclock {
	color: #555;
}
table.list tr.timeclock-active {
	background-color: rgba(247,229,141,0.4);
}
.timeclock input {
	width: 45px;
	margin-top: 6px;
	text-align: center;
	margin: 0px;
	padding: 5px 0px;
	background-color: transparent;
	border-width: 0px;
	vertical-align: middle;
}
.timeclock input:focus {
	background-color: #fff;
}
.timeclock select {
	width: 40px;
	margin: 0px;
}
.timeclock span {
	vertical-align: middle;
}
.timeclock .time-edit {
	width: 100px;
}
.timeclock .time-staff {
	padding-left: 10px;
}
.timeclock .time-duration {
	font-size: 22px;
	color: #555;
}
.timeclock .time-interval {
	font-size: 13px;
	color: #555;
	white-space: nowrap;
}
.timeclock .time-interval span {
	display: inline-block;
}
.timeclock .close {
	float: none;
}
.time-mod {
	display: none;
}
.timeclock .time-title {
	width: 100px;
}
.timeclock .time-mod-date {
	width: 70px;
}
.clock-list {
	border-top: 6px solid #f6f6f6;
	border-bottom: 6px solid #f6f6f6;
}
.clock-list td {
	font-weight: 600;
	background-color: #5d45a2;
  color: #f9f9f9;
	font-size: 16px;
	cursor: pointer;
}
.clock-list .clock-total {
	color: #aaa;
	font-weight: 400;
}
.clock-list .package-list-count {
	float: none;
	display: inline-block;
}
.clock-fingerprint {
	display: inline-block;
	opacity: 0.7;
	width: 150px;
	padding: 10px 0px 5px;
}
.clock-text {
	color: #333;
	font-size: 23px;
	font-weight: 400;
	line-height: 36px;
	text-align: center;
	padding: 0px 0px;
	margin: 0px -20px;
	overflow-wrap: break-word;
}



/* Tags */
.tag-item {
	background-color: rgba(255,255,255,0.2);
	color: #eee;
	padding: 7px 10px;
	margin: 8px 5px 5px;
	display: inline-block;
	text-align: left;
	vertical-align: middle;
	cursor: pointer;

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

	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.tag-profile {
	background-color: rgba(255,255,255,0.2);
	color: #eee;
	margin: 5px;
	display: inline-block;
	vertical-align: top;
	text-align: left;
	cursor: pointer;

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

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.task-box .tag-profile {
	background-color: rgba(0,0,0,0.2);
}
.tag-profile .close {
	line-height: 36px;
	cursor: pointer;
	padding: 0px 10px 0px 5px;
	display: none;
	color: #ddd;
	float: none;
	vertical-align: middle;
}
.tasks-menu .tag-profile .close {
	display: inline-block;
}
.task-tags .tag-profile .task-profile {
	margin: 0px;
}
.task-section {
	position: relative;
	padding-bottom: 46px;
}
.task-tags {
	position: absolute;
	vertical-align: bottom;
	bottom: auto;
  right: 15px;
  top: 20px;
}
.task-followers {
	position: absolute;
	vertical-align: bottom;
	bottom: 0px;
	right: 0px;
}
.task-tags .tag-item .close,
.task-followers .tag-profile .close {
	margin-left: 5px;
	color: #fff;
	opacity: 0.5;
	display: none;
}
.tag-item:hover .close,
.tag-profile:hover .close {
	display: inline-block;
}
.task-tags .tag-item .close:hover,
.tag-profile .close:hover {
	opacity: 1;
	color: #fff;
}
.input-list {
	width: 120px;
	float: right;
	margin-top: 5px;
	margin-bottom: 0px;
}
.dropdown-item {
	overflow-x: hidden;
}


/* Location Map */
.location-nav {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 30;
	margin-top: 20px;
	margin-right: 20px;
	width: 30px;
	cursor: pointer;
}
.location-nav img {
	width: 100%;
}
.location-info {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 30;
	margin-bottom: 20px;
	pointer-events: none;
}
.location-info-box {
	background-color: rgba(0,0,0,0.5);
	color: #fff;
	padding: 20px;
	border-radius: 10px;
	display: inline-block;
	pointer-events: auto;
}
.location-title {
	font-size: 24px;
	line-height: 24px;
	padding-bottom: 10px;
}
.location-text {
  -webkit-user-select: text; /* Chrome/Safari */
	-khtml-user-select: text;
  -moz-user-select: text; /* Firefox */
  -ms-user-select: text; /* IE10+ */
	/* Not implemented in browsers yet */
	-o-user-select: text;
	user-select: text;
}


/* Drop Down Menu */
.dropdown-action {
	display: none;
}


/* Arrows */
.arrow {
	display: inline-block;
	opacity: 0.2;
	margin: 5px 7px;
}
.arrow:hover {
	opacity: 1.0;
}
.arrow-left {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right:10px solid black;
}
.arrow-right {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left:10px solid black;
}


/* Tasks */
.task {
	display: inline-block;
}
.task-note {
  z-index: 1;
	position: relative;
	background-color: #f0f0f0;
	vertical-align: top;
	width: 200px;
	height: 170px;
	margin: 5px 5px 5px;
	cursor: pointer;
  white-space: normal;

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

	webkit-box-shadow: 0 0 2px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.19);
  box-shadow: 0 0 2px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.19);
}
.task-ghost {
	background-color: #bbb;
}
.task-ghost > div {
	visibility: hidden;
}
.task-closed {
	webkit-box-shadow: 0 0 2px rgba(0,0,0,0.12);
  box-shadow: 0 0 2px rgba(0,0,0,0.12);
}
.task-closed:hover {
	webkit-box-shadow: 0 0 2px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.19);
  box-shadow: 0 0 2px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.19);
}
.task-create {
	width: 80px;
	margin-left: 20px;
	background-color: rgba(230,230,230,1);
}
.task-orgs {
	width: 10px;
}
.task .task-content {
	vertical-align: top;
	position: relative;
}
.task-due-option {
	text-align: right;
	display: block;
}
input.pop-task-due-inputs {
	display: none;
	margin-bottom: 0px;
	text-align: center;
	padding-left: 0px;
	padding-right: 0px;
}
.pop-task-due-select {
	float: right;
	height: 38px;
	font-size: 12px;
	text-align: right;
	line-height: 35px;
	white-space: nowrap;
}
.task-top {
	position: absolute;
  top: 0px;
  left: 0px;
	width: 100%;
	text-align: center;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	color: #fff;
	font-size: 10px;
	line-height: 10px;
	padding: 3px 0px;
  height: 16px;
  box-sizing: border-box;
	z-index: 10;
}
.task-due {
	background-color: rgba(229,191,84,1.0);/* yellow */
}
.task-due-today {
	background-color: rgba(224,165,111,1.0);/* orange */
}
.task-due-past {
	background-color: rgba(183,130,131,1.0);/* red */
}
.task-done {
	background-color: rgba(119,187,119,1.0);/* green */
}
.task-text {
	margin: 0px;
	padding: 15px 5px 0px 10px;
	font-size: 14px;
	line-height: 24px;
	font-family: 'Open Sans', sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	height: 170px;
	background-color: transparent;
	border: 0px;
	color: inherit;
	resize: none;
	cursor: pointer;
	box-sizing: border-box;
	overflow: hidden;
}
.task-label {
	padding: 15px 5px 10px 10px;
	font-size: 14px;
	line-height: 24px;
}
.task-action {
	z-index: 11;
	display: none;
	width: 40px;
	height: 40px;
	position: absolute;
	top: -5px;
	right: -5px;
	text-align: center;
	background-color: #eee;
	border-bottom-left-radius: 10px;
	border-top-right-radius: 10px;
	border-radius: 100%;
  box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
}
.task-action img {
	display: inline-block;
	max-width: 45px;
	max-height: 18px;
	padding: 5px 10px;
	margin: 5px 2px;
	opacity: 0.2;
}
.task-action:hover {
	background-color: rgba(100,230,100,1);
}
.task-action:hover img {
	opacity: 1.0;
}
.task-action-drag {
	right: auto;
	left: -5px;
	cursor: grab;
}
.task-action-drag:hover {
	background-color: rgba(51,207,238,1);
}
.task-action-drag:active {
	cursor: grabbing;
}
.task:hover .task-action {
	display: block;
	opacity: 1;
}

.task-create .task-label {
	display: none;
	color: #999;
	font-size: 16px;
	text-align: center;
	padding: 0px 0px 0px;
}
.task-plus {
  color: #ccc;
  font-size: 100px;
  text-align: center;
  margin-top: 70px;
  margin-bottom: 25px;
}
.task-create:hover {
	width: 120px;
	background-color: #f0f0f0;
}
.task-create:hover .task-label {
	color: #999;
	display: block;
}
.task-create:hover .task-plus {
	color: #999;
}

.task-timesheets {
}
.task-timesheets .task-clock {
	position: absolute;
	top: -56px;
	right: 20px;
	padding: 7px;
	background-color: #f3f3f3;
	box-sizing: border-box;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	white-space: nowrap;
}
.task-clock .clock-time {
	line-height: 30px;
	text-align: center;
}
.task-clock .clock-time > div {
	font-size: 12px;
	line-height: 12px;
	color: #666;
}
.task-clock input {
	line-height: 20px;
	padding-right: 0px;
}
.task-clock .task-profile {
	width: 42px;
	height: 42px;
}
.task-timesheets .task-clock > button {
	width: 42px;
	height: 42px;
}
.task-clock .task-profile button {
	display: none;
}
.task-clock:hover > button {
	display: inline-block;
}
.task-clock:hover > button img {
	width: 19px;
	height: 19px;
}
.task-timesheets input {
	width: 140px;
  margin: 0px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
  background: none;
  border: none;
	min-width: 140px;
}
.task-timesheets .task-stop input {
	min-width: 50px;
}
.task-timesheets input:hover {
	background-color: #fff;
	border: 0px;
}
.task-timesheets input:focus {
	background-color: #fff;
	border: 0px;
}
.task-timesheets .clock-start,
.task-timesheets .clock-stop {
	margin: 0px;
	vertical-align: middle;
	width: 36px;
	height: 36px;
	border-radius: 100%;
	background: none;
	border: none;
	box-shadow: none;
	position: relative;
}
.task-timesheets .clock-start {
	background-color: rgba(152, 120, 183, 0.8);
}
.task-timesheets .clock-stop {
	background-color: rgba(187,86,88,0.8);
}
.task-timesheets button img {
	opacity: 0.4;
	width: 16px;
	height: 16px;
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}
.task-timesheets .clock-stop:hover {
	background-color: rgba(187,86,88,1.0);
}
.task-timesheets .clock-start:hover {
	background-color: rgba(152, 120, 183, 1.0);
}
.task-timesheets button:hover img {
	opacity: 0.7;
}
.task-timesheets .clock-item {
	display: flex;
	margin: 10px 0px 0px;
	align-items:center;
}
.task-timesheets .clock-item:hover {
	background-color: rgba(247,229,141,0.4);
}
.clock-item .clock-item-profile {
	flex: 0;
}
.clock-item input {
	flex: 2;
	background-color: transparent;
	color: #444;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
.clock-item input:hover {
	background-color: rgba(255,255,255,0.7);
}
.clock-item input:focus {
	background-color: rgba(255,255,255,1);
}
.clock-item .clock-dates {
	flex: 1;
	white-space: nowrap;
	font-size: 12px;
	line-height: 16px;
  text-align: center;
}
.clock-item .clock-time {
	flex: 2;
	white-space: nowrap;
	text-align: center;
}
.clock-item .clock-action {
	min-width: 40px;
	flex: 0;
	white-space: nowrap;
	text-align: right;
}
.clock-item .close {
	flex: 0;
	margin: 0px 0px 0px 5px;
}

.task-subtasks {

}
.subtasks-progress-bar {
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 10px;
	background-color: #bbb;
	text-align: left;
	overflow: hidden;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}
.subtasks-progress-bar div {
	height: 100%;
	border-radius: 5px;
	background-color: #49864a;
  -webkit-transition: width 1s ease-in-out;
  -moz-transition: width 1s ease-in-out;
  -o-transition: width 1s ease-in-out;
  transition: width 1s ease-in-out;
}
.subtasks-header {
	display: flex;
}
.subtasks-header button {
	border: 0px solid #fff;
	background: none;
	box-shadow: none;
	color: #999;
	white-space: nowrap;
}
.subtasks-header .subtasks-progress {
	width: 100%;
	margin: 15px 10px;
	height: 6px;
	border-radius: 3px;
	background-color: #bbb;
	text-align: left;
	overflow: hidden;
}
.subtasks-header .subtasks-progress div {
	height: 100%;
	border-radius: 3px;
	background-color: #49864a;
  -webkit-transition: width 1s ease-in-out;
  -moz-transition: width 1s ease-in-out;
  -o-transition: width 1s ease-in-out;
  transition: width 1s ease-in-out;
}
.subtasks-header .subtasks-percent {
	line-height: 36px;
	font-size: 12px;
  min-width: 36px;
  text-align: right;
}
.subtask-item {
	display: flex;
	margin: 0px 0px 0px;
	padding: 0px 0px 0px 10px;
	background-color: #f3f3f3
}
.subtask-ghost {
	background-color: #ddd;
	border-radius: 5px;
}
.subtask-ghost > div,
.subtask-ghost > textarea {
	visibility: hidden;
}
.subtask-checkbox {
	display: inline-block;
	flex-grow: 1;
	width: 18px;
	height: 18px;
	border: 2px solid #999;
	margin: 5px 5px 0px 0px;
	cursor: pointer;
}
.subtask-checkbox:hover {
	background-color: #bbb;
}
.subtask-text {
	flex-grow: 5;
	color: #444;
	border: 0px solid #fff;
	background-color: transparent;
	padding: 9px 10px;
	margin: 0px;
}
.subtask-actions {
	color: rgba(0,0,0,0.2);
	font-size: 30px;
	font-weight: 800;
	cursor: pointer;
	padding: 5px 0px 5px 5px
}
.subtask-actions:hover {
	color: rgba(0,0,0,0.5);
}
.subtask-text:hover {
	background-color: rgba(255,255,255,0.7);
}
.subtask-text:focus {
	background-color: rgba(255,255,255,1);
}
.subtask-done .subtask-checkbox {
	background-color: #999;
}
.subtask-done .subtask-text {
	color: #777;
	text-decoration: line-through;
}

.task-group {
	padding: 50px 0px 10px 0px;
}
.task-group-extra {
	display: inline-block;
	background-color: #eee;
	border-radius: 10px;
	cursor: pointer;
}
.task-group-extra .tasks-count {
	display: inline-block;
	padding: 15px 10px;
	margin: 0px 10px;
	vertical-align: middle;
	flex: 1;
	text-align: center;
	border-bottom: 3px solid transparent;
	position: relative;
}
.task-count-indicator {
	display: inline-block;
	position: absolute;
  top: 54%;
  left: 54%;
	color: #eee;
	font-size: 12px;
	line-height: 18px;
	text-align: center;
	letter-spacing: -0.5px;
	height: 18px;
	width: 18px;
	border-radius: 100%;
	background-color: #999;
}
.task-extras .task-count-indicator {
  top: 68%;
  left: 60%;
}
.extras-mini .task-count-indicator {
	top: 60%;
}
.task-today-due {
	background-color: #d08a4b;
}
.task-past-due {
	background-color: #b5696a;
}
.task-group-extra .tasks-count img {
	opacity: 0.2;
	height: 21px;
	display: inline-block;
	vertical-align: bottom;
}
.task-group-extra:hover {
	background-color: #f7f7f7;
}
.task-group-extra:hover .tasks-count {
	border-bottom: 3px solid #bbb;
}
.task-group-extra .tasks-count-sel img {
	opacity: 0.5;
}
.task-group-extra .tasks-count-sel,
.task-group-extra .tasks-count-sel:hover  {
	border-bottom: 3px solid #888;
}
.task-group-viewer {
	display: inline-block;
	width: 100%;
	max-width: 500px;
	vertical-align: top;
}
.task-group-button {
	display: inline-block;
	vertical-align: top;
}
.task-group-title {
	display: flex;
	max-width: 500px;
	margin: 0px 0px 20px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	background-color: #eee;
  padding-right: 8px;
	gap: 20px;
}
.task-group-bar {
	display: inline-block;
	width: 10px;
	position: relative;
}
.task-group-bar input {
	position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  border: none;
  opacity: 0;
}
.task-group-title .task-profile {
  width: 54px;
  height: 54px;
}
.task-group-title img {
	display: inline-block;
	max-width: 100px;
	max-height: 54px;
	vertical-align: middle;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.task-group-title span {
	color: #666;
	font-size: 20px;
	vertical-align: middle;
	line-height: 34px;
}
.task-name {
	display: inline-block;
	width: auto;
	min-width: 54px;
	margin: 10px 0px 10px;
	padding: 0px;
	color: #666;
	font-size: 20px;
	font-family: Arial;
	font-weight: 570;
	background-color: transparent;
	border: none;
}
.task-name::placeholder {/* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #aaa;
  opacity: 1; /* Firefox */
}
.task-name::-ms-input-placeholder {/* Internet Explorer 10-11 */
  color: #aaa;
  opacity: 1; /* Firefox */
}
.task-name::-ms-input-placeholder {/* Microsoft Edge */
  color: #aaa;
  opacity: 1; /* Firefox */
}
.task-group-title .tasks-count {
	display: inline-block;
	padding: 15px 0px;
	vertical-align: middle;
	cursor: pointer;
	flex: 1;
	text-align: center;
}
.task-group-title .tasks-count span {
	opacity: 0.2;
	font-size: 20px;
	line-height: 15px;
	display: inline-block;
	vertical-align: bottom;
}
.task-group-title .tasks-count img {
	opacity: 0.2;
	height: 21px;
	display: inline-block;
	vertical-align: bottom;
}
.task-group-title .tasks-count-sel img {
	opacity: 0.5;
}
.task-group-title .tasks-count:hover {
	background-color: rgba(255,255,255,0.5);
	border-bottom: 3px solid #bbb;
}
.task-group-title .tasks-count-sel,
.task-group-title .tasks-count-sel:hover  {
	border-bottom: 3px solid #888;
}
.task-category {
	display: block;
	color: #888;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 1px;
	margin: 10px 0px 0px;
	padding: 0px 0px 0px 20px;
	border-radius: 8px;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}
.task-category div {
	display: inline-block;
}
.task-category img {
  opacity: 0.2;
  height: 21px;
	margin: 0px 12px;
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
}
.task-category img:hover {
  opacity: 0.4;
}
.task-category .task-tag {
	display: inline-block;
  background-color: #aaa;
	vertical-align: middle;
  color: #eee;
  padding: 0px 8px 0px 0px;
  margin: 0px 5px 0px;
  text-align: left;
	font-size: 12px;
	line-height: 22px;
  border-radius: 14px;
  -moz-border-radius: 14px;
  -webkit-border-radius: 14px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
	white-space: nowrap;
}
.task-tag span {
	display: inline-block;
	padding: 0px 8px;
  background-color: rgb(0, 0, 0, 0.15);
  border-radius: 14px;
	letter-spacing: 0px;
	position: relative;
}
.task-tag span input {
	position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  border: none;
  opacity: 0;
}
.task-tag input {
	display: inline-block;
  width: auto;
  font-size: 12px;
  line-height: 22px;
  padding: 0px;
  margin: 0px;
  border-radius: 0px;
  border: 0px;
  background-color: transparent;
  color: #eee;
  letter-spacing: 1px;
}
.tasks-bg {
	background-color: #d5d5d5;
	margin-top: 0px;
}
.tasks-list {
	width: auto;
  overflow-x: scroll;
  overflow-y: visible;
  white-space: nowrap;
	-webkit-overflow-scrolling: touch;
	overflow: -moz-scrollbars-none;
	-ms-overflow-style: none;
}
.tasks-list::-webkit-scrollbar {
  display: none;
}
.task-indicator {
	height: 100%;
}
.task-indicator .tbl-cell {
	z-index: 10;
}
.task-indicator-top {
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius-topleft: 10px;
  border-top-left-radius: 10px;
}
.task-indicator-bot {
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-radius-bottomleft: 10px;
  border-bottom-left-radius: 10px;
}
.task-profiles {
	position: absolute;
	bottom: 0px;
	right: 0px;
	padding: 0px 5px 10px;
	text-align: right;
	display: block;
	box-sizing: border-box;
}
.task-profile {
	width: 36px;
	height: 36px;
	margin-right: 0px;
  display: inline-block;
  vertical-align: middle;
  background-color: #bbb;
  position: relative;
  border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center;
}
.task-profile-mini {
	width: 28px;
	height: 28px;
	margin-right: 5px;
	vertical-align: middle;
}
.task-assigned {
	box-shadow: 0px 0px 0px 4px #969696;
}
.task-profile-mini.task-assigned {
	box-shadow: 0px 0px 0px 2px #969696;
}
.task-details {
	font-size: 12px;
	line-height: 15px;
}

/* Mini Activity Feed */
.mini-activity {
	margin: 30px 0px 10px;
    font-size: 12px;
    line-height: 18px;
}
.mini-activity .mini-activity-item {
	padding: 5px 0px 5px 10px;
	margin: 0px 0px 0px -10px;
}
.mini-activity .mini-activity-item:hover {
	background-color: rgba(255,255,255,0.5);
}
.mini-activity .mini-activity-item > div,
.mini-activity .mini-activity-item > a,
.mini-activity .mini-activity-item span {
	display: inline-block;
	vertical-align: middle;
}
.mini-activity-icon {
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 100%;
	margin: 0px;
	vertical-align: middle;
	position: relative;
	-webkit-filter: invert(100%);
	filter: invert(100%);
	opacity: 0.6;
	margin: 0px 5px 0px 0px;
}
.mini-activity-icon img {
	width: 50%;
	height: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.mini-activity-by {
	padding: 0px 0px 0px 20px;
}
.mini-activity-profile img {
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 100%;
	vertical-align: middle;
	margin: 0px 0px 0px 5px;
}
.mini-activity-ago {
	padding: 0px 0px 0px 20px;
}
.mini-activity-sub {
	padding: 5px 0px 5px 18px;
	position: relative;
}
.mini-activity-sub > div,
.mini-activity-sub > a,
.mini-activity-sub span {
	display: inline-block;
	vertical-align: middle;
}
.mini-activity-sub-line {
	position: absolute;
    top: -3px;
    left: 25px;
    width: 1px;
    height: 7px;
	background-color: #bbb;
}


/* Vue.js Tasks */
.task-fade {
	background-color: rgba(0,0,50,0.4);
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 60;
	overflow-x: hidden;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.task-pad {
	padding: 20px;
	top: 180px;
  max-width: 560px;
  min-width: 370px;

  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
  -moz-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
}
.task-box {
	width: 100%;
  background-color: #f3f3f3;
  color: #999;
  padding: 30px 15px 5px 25px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
	margin-bottom: 100px;
	position: relative;

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

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;

  box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
  -moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
  -webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.7);
}
.task-padding {
	position: relative;
	padding-bottom: 46px;
}
.task-title textarea,
.task-details textarea,
.comment-input textarea {
	background-color: transparent;
	border: 0px solid #fff;
  color: #444;
  font-size: 14px;
  line-height: 24px;
  resize: none;
	overflow: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.task-title {
	font-size: 16px;
	font-weight: 900;
	margin: 20px 0px 10px;
}
.task-title textarea:hover,
.task-details textarea:hover,
.comment-input textarea:hover {
	background-color: rgba(255,255,255,0.7);
}
.task-title textarea:focus,
.task-details textarea:focus,
.comment-input textarea:focus {
	background-color: rgba(255,255,255,1);
}
.task-button,
.datetime-picker input {
	color: #444;
	background-color: #dadada;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	font-size: 12px;
	margin-bottom: 10px;
	padding-left: 0px;
	padding-right: 0px;
}
.task-input {
	display: inline-block;
	position: relative;
}
.task-input label {
	font-size: 16px;
	font-weight: 800;
	display: block;
	color: #fff;
	width: 31px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	vertical-align: top;
	margin-bottom: 10px;
	border-right: 0px;
	background-color: rgba(0,0,0,0.2);
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.task-input label img {
	width: auto;
	height: auto;
	max-width: 16px;
	max-height: 16px;
	padding: 0px;
	opacity: 0.6;

  position: absolute;
  top: 0;
  bottom: 0;
	left: 0;
	right: 0;
  margin: auto;
}
.task-box .task-input label img {
	opacity: 1.0;
}
.task-input label:hover {
	background-color: rgba(0,0,0,0.3);
}
.task-input label:hover img {
	opacity: 0.9;
}
.task-input input {
	width: 100px;
	border: solid 0px #000;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}
.task-input-due input {
	color: #fff;
	background-color: #e5bf54;/* yellow */
}
.task-input.task-input-due label {
	background-color: #ddab20;/* darker yellow */
}
.task-input-due-today input {
	color: #fff;
	background-color: #eba666;/* orange */
}
.task-input.task-input-due-today label {
	background-color: #e6852c;/* darker orange */
}
.task-input-due-past input {
	color: #fff;
	background-color: #b78283;/* red */
}
.task-input.task-input-due-past label {
	background-color: #bb5658;/* darker red */
}
.task-input-done input {
	color: #fff;
	background-color: #77bb77;/* green */
}
.task-input.task-input-done label {
	background-color: #5faa5f;/* darker green */
}
.task-more-btn.btn-small.btn-long {
	margin: 0px 0px 0px;
  border: 0px;
  background: transparent;
  box-shadow: none;
  text-shadow: none;
  color: #bbb;
}
.task-more-btn.btn-small.btn-long:hover {
	color: #999;
  background-color: #ddd;
}
.task-expand {
	padding: 20px 40px 10px;
	font-size: 14px;
}
.task-expand .tbl-cell {
	padding: 5px 0px;
}
/* For tablets */
@media only screen and (min-width: 600px) {
	.task-pad {
		width: 100%;
	}
}

/* Task Extras - bottom left */
.task-extras {
	position: absolute;
	bottom: 5px;
	left: 5px;
	display: flex;
	gap: 10px;
}
.extra-pill {
  height: 36px;
	color: #fff;
	font-size: 12px;
	line-height: 36px;
	text-align: right;
	background-color: #d5d5d5;
	border-radius: 18px;
	white-space: nowrap;
	display: flex;
	cursor: pointer;
}
.extra-pill-sel {
	background-color: #bbb;
}
.extra-pill span {
	vertical-align: top;
  padding: 0px 8px 0px 3px;
}
.extra-icon {
	display: inline-block;
	position: relative;
	width: 36px;
	height: 36px;
	border-radius: 100%;
	background-color: #bbb;
}
.extra-icon img {
	width: auto;
	height: auto;
	max-width: 16px;
	max-height: 16px;
	padding: 0px;

  position: absolute;
  top: 0;
  bottom: 0;
	left: 0;
	right: 0;
  margin: auto;
}
.extra-comments {
	background-color: rgba(120, 136, 183, 0.7);
}
.extra-comments .extra-icon,
.extra-comments.extra-pill-sel {
	background-color: rgb(120, 136, 183);
}
.extra-subtasks {
	background-color: rgba(118, 168, 118, 0.7);
}
.extra-subtasks .extra-icon,
.extra-subtasks.extra-pill-sel {
	background-color: rgb(118, 168, 118);
}
.extra-timesheets {
	background-color: rgba(152, 120, 183, 0.7);
}
.extra-timesheets .extra-icon,
.extra-timesheets.extra-pill-sel {
	background-color: rgb(152, 120, 183);
}
.extras-mini {
	bottom: 10px;
	left: 10px;
	gap: 5px;
}
.extras-mini .extra-pill {
  height: 20px;
	line-height: 20px;
}
.extras-mini .extra-pill span {
	letter-spacing: -0.5px;
}
.extras-mini .extra-icon {
	width: 20px;
	height: 20px;
}
.extras-mini .extra-icon img {
	max-width: 10px;
	max-height: 10px;
	opacity: 0.8;
}

/* Task Comments */
.comment-input {
	position: relative;
}
.comment-input textarea {
	font-size: 13px;
  margin: 10px 0px 0px;
}
.comment-input button {
	position: absolute;
	bottom: -24px;
	right: 5px;
	color: #eee;
	background: none;
	background-color: #76ab88;
	text-shadow: none;
	border: 0px solid #fff;
	box-shadow: none;
	margin: 0px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
  z-index: 1;
}
.comment-input button:hover {
	background-color: #5faa79;
	color: #fff;
}
.comment-item {
	position: relative;
	margin: 10px 0px 0px;
	text-align: right;
}
.comment-card {
	display: inline-block;
	width: auto;
	padding: 10px 15px;
	margin: 14px 14px 0px;
	border-radius: 5px;
	border: 0px;
	color: #fff;
	font-size: 14px;
	text-align: left;
	background-color: #ccc;
  white-space: pre-wrap;
  font: 400 14px system-ui;
	line-height: 21px;
}
.comment-date {
	position: absolute;
	right: 34px;
	top: 0px;
	color: #aaa;
	font-size: 11px;
	line-height: 11px
}
.comment-profile {
	width: 30px;
	height: 30px;
  opacity: 0.9;
	position: absolute;
	right: 0px;
	top: 0px;

  border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

  background-position: center;
}
.comment-self {
	text-align: left;
}
.comment-self .comment-card {
	background-color: #bbb;
}
.comment-self .comment-date {
	right: auto;
	left: 34px;
}
.comment-self .comment-profile {
	right: auto;
	left: 0px;
}

.task-groups {
	min-width: 10px;
	height: 100%;
	display: flex;
	flex-direction: column;
	position: absolute;
	left: 0px;
	top: 0px;
  z-index: 10;
}
.group-item {
	flex: 1;
}
.group-item:first-child {
	border-top-left-radius: 10px;
}
.group-item:last-child {
	border-bottom-left-radius: 10px;
}
.group-item .close {
	display: none;
	padding: 3px;
}
.group-item:hover .close {
	display: inline-block;
}

/* Task Menu Input */
.tasks-menu-fade {
	z-index: 49;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(255,255,255,0);
}
.tasks-menu {
	background-color: rgba(213,213,213,1);
	padding: 0px 20px;
	text-align: left;
	width: 100%;
	color: #bbb;
	z-index: 59;
	box-sizing: border-box;
	width: 100%;
	transition: background-color 0.1s;
	position: fixed;
	opacity: 0.7;
}
.tasks-menu:hover {
	opacity: 1.0;
	background-color: #443287;
	box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
}
@media only screen and (min-width: 768px) {
	.tasks-menu {
	  width: calc(100% - 170px);
	}
}
.tasks-menu-label {
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	margin-right: 8px;
    color: #aaaaaa;
    font-weight: bold;
}
.tasks-menu .tasks-menu-pill {
	border-width: 0px;
	box-shadow: none;
	background: none;
	background-color: rgba(0,0,0,0.2);
	color: #b6b6b6;
	margin: 0px;
}
.tasks-menu .tasks-menu-pill:hover {
	background-color: rgba(0,0,0,0.3);
	color: #fff;
}
.tasks-menu .tag-profile {
	vertical-align: middle;
}
.tbl.tasks-menu-input {
	width: auto;
	display: inline-block;
	vertical-align: middle;
}
.tasks-menu-input label,
.tasks-menu-input input {
	margin-bottom: 0px;
}
.tasks-menu-input label {
	cursor: pointer;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
	position: relative;
}
.tasks-menu-input-sel label {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
.task-input-due.tasks-menu-input-sel input {
  min-width: 150px;
}


/* Popup Chats */
.chat-modal {
	position: fixed;
	bottom: 10px;
	right: 30px;
	z-index: 40;
	text-align: right;
	max-width: 340px;
	width: 100%;
	margin-bottom: 10px;
	border-radius: 15px;

  box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
  -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
  -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
}
.chats-scroll {
  max-height: 600px;
  overflow-x: hidden;
  overflow-y: scroll;
	padding: 10px 19px 0px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  background-color: rgba(100,100,150,1);
}
.chat-none {
  padding-bottom: 10px;
  color: #ccc;
  text-align: center;
}
.chat-item {
	position: relative;
	padding: 0px 0px 10px;
}
.chat-card {
	display: inline-block;
	width: auto;
	padding: 10px 15px;
	margin: 0px 0px 14px;
	border-radius: 5px;
	border: 0px;
	color: #fff;
	font-size: 14px;
	text-align: left;
	background-color: rgba(68,50,135,1.0);
  white-space: pre-wrap;
  font: 400 14px system-ui;
	line-height: 21px;
  box-shadow: 0px 5px 7px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 5px 7px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0px 5px 7px rgba(0,0,0,0.2);
}
.chat-date {
	position: absolute;
	right: 17px;
	bottom: 6px;
	color: #aaa;
	font-size: 11px;
}
.chat-profile {
	width: 30px;
	height: 30px;
  opacity: 0.9;
	position: absolute;
	right: -14px;
	bottom: 10px;

  border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

  background-position: center;
}
.chat-self {
	text-align: left;
}
.chat-self .chat-card {
	background-color: rgba(93,69,162,1.0);
}
.chat-self .chat-date {
	right: auto;
	left: 17px;
}
.chat-self .chat-profile {
	right: auto;
	left: -14px;
}
.chat-input,
.chat-input .tbl-row  {
	height: 100%;
}
.chat-input textarea {
	font-size: 14px;
	line-height: 21px;
	margin-bottom: 0px;
	padding: 8px 0px 8px 10px;
  resize: none;
	border: 0px solid #fff;
	border-radius: 0px;
	border-bottom-left-radius: 15px;
}
.chat-input button {
	height: 100%;
	margin: 0px;
  color: #eee;
  background: none;
  background-color: #aaa;
  text-shadow: none;
  border: 0px solid #fff;
	border-radius: 0px;
	border-bottom-right-radius: 15px;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}
.chat-input button:hover,
.chat-input button:focus {
	background-color: #999;
	color: #fff;
}
.chat-close {
	top: -14px;
	right: -14px;
	position: absolute;
	z-index: 41;
	text-align: center;
	color: #ccc;
	display: inline-block;
	font-weight: bold;
	font-size: 28px;
	line-height: 32px;
	width: 32px;
	height: 32px;
	border-radius: 100%;
	cursor: pointer;
	background: linear-gradient(#5d45a2, #443287);
	background: -o-linear-gradient(#5d45a2, #443287);
	background: -moz-linear-gradient(#5d45a2, #443287);
	background: -webkit-linear-gradient(#5d45a2, #443287);
  box-shadow: 0px 5px 7px rgba(0,0,0,0.4);
  -moz-box-shadow: 0px 5px 7px rgba(0,0,0,0.4);
  -webkit-box-shadow: 0px 5px 7px rgba(0,0,0,0.4);
}
.chat-close:hover {
	color: #eee;
}
.chat-toggle {
	z-index: 40;
	bottom: 10px;
	right: 30px;
	position: fixed;
	display: inline-block;
	width: 64px;
	height: 64px;
	border-radius: 100%;
	vertical-align: middle;
	cursor: pointer;
	background: linear-gradient(#5d45a2, #443287);
	background: -o-linear-gradient(#5d45a2, #443287);
	background: -moz-linear-gradient(#5d45a2, #443287);
	background: -webkit-linear-gradient(#5d45a2, #443287);
  box-shadow: 0px 5px 7px rgba(0,0,0,0.4);
  -moz-box-shadow: 0px 5px 7px rgba(0,0,0,0.4);
  -webkit-box-shadow: 0px 5px 7px rgba(0,0,0,0.4);
}
.chat-toggle img {
	height: 32px;
	margin: 0px auto;
	padding: 16px 0px;
	opacity: 0.5;
	-webkit-filter: invert(100%);
	filter: invert(100%);
}
.chat-toggle:hover img {
	opacity: 0.8;
}
/*.slidechat-move {
  transition: transform 1s;
}*/
.slidechat-enter-active,
.slidechat-leave-active {
  transition: all 1s;
}
.slidechat-enter,
.slidechat-leave-to {
  opacity: 0;
  transform: translateX(30px);
}

/* .slideup-move {
  transition: transform 1s;
} */
.slideup-enter-active,
.slideup-leave-active {
  transition: all 1s;
}
.slideup-enter {
  opacity: 0;
  transform: translateX(30px);
}
.slideup-leave-to {
  opacity: 0;
  transform: translateX(-30px);
}


/* Vue.js Typeahead */
.typeahead {
	position: relative;
	display: inline-block;
	outline: none;
}
.typeahead input {
	padding-right: 0px;
	height: 36px;
}
.typeahead-dropdown {
	position: absolute;
  top: 100%;
  left: 0;
  max-width: 300px;
  z-index: 70;
  float: left;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  text-align: left;
  background-color: #f6f6f6;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.typeahead-dropdown div {
	display: block;
  padding: 5px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
  cursor: pointer;
  overflow-x: hidden;
	outline: none;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.typeahead-dropdown div:hover,
.typeahead-dropdown .typeahead-dropdown-default {
  text-decoration: none;
	color: #fff;
  background-color: #f5f5f5;
	background: linear-gradient(#5d45a2, #443287);
	background: -o-linear-gradient(#5d45a2, #443287);
	background: -moz-linear-gradient(#5d45a2, #443287);
	background: -webkit-linear-gradient(#5d45a2, #443287);
}


/* Vue.js DateTimePicker */
.year-month-wrapper{
  background-color: #5d45a2;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	text-align: center;
}
.datetime-picker{
  position: relative;
	vertical-align: top;
}
.calendar-div{
  min-width: 280px;
  box-shadow: 1px 2px 5px rgba(0,0,0,0.2);
  background: #FFF;
  position: absolute;
  display: inline-block;
  left: 0;
  top: 35px;
  color: #444;
  font-size: 14px;
  padding-bottom: 5px;
  z-index: 100;
	margin: 3px 0px 20px;
	border-radius: 10px;
}
.calendar-today {
	background-color: #e2e2e2;
}
.port, .days{
  display: inline-block;
  width: 30px;
  height: 30px;
	line-height: 30px;
  padding: 3px;
  margin: 2px;
  border-radius: 100%;
  text-align: center;
  vertical-align: top;
  cursor: pointer;
}
.headers {
	height: 14px;
	margin: 3px 0px;
}
.headers .days{
  color: #5d45a2;
  font-weight: bold;
  padding: 0px 3px;
  margin: 0px 2px;
  line-height: 14px;
  height: 14px;
  font-size: 14px;
	cursor: auto;
}
.port:hover{
  color: #5d45a2;
  font-weight: bold;
}
.activePort, .activePort:hover {
  background-color: #5d45a2;
  color: white;
}
.month-setter, .year-setter{
  margin: 0 1px;
  width: 48.2%;
  color: white;
  font-weight: 900;
  display: inline-block;
}
.nav-l:hover, .nav-r:hover {
  background-color: rgba(0,0,0,0.25);
}
.nav-l, .nav-r {
  display: inline-block;
  width: 25px;
  color: white;
  font-size: 16px;
  cursor: pointer;
  border: 0;
  padding: 7px;
  margin:0;
}
.nav-l:focus, .nav-r:focus{
  outline: none;
}
.nav-l{
  float: left;
}
.nav-r{
  float: right;
}
.month, .year{
  width: 40px;
  display: inline-block;
  color: white;
  padding: 7px 0px;
}
.hour-selector, .minute-selector{
  width: 30px;
  display: inline-block;
  text-align: center;
  font-weight: bold;
  position: relative;
  cursor: pointer;
}
.time-separator{
  display: inline-block;
  font-weight: bold;
	width: 5px;
}
.time-picker{
  margin: 10px
}
.nav-t, .nav-d{
  font-weight: bold;
  cursor: pointer;
}
.scroll-hider {
  display: none;
  vertical-align:top;
  overflow:hidden;
  border:0;
  position: absolute;
  top: -40px;
  left: 0;
  box-shadow: 0 0 3px #333;
  background-color: white;
}
.scroll-hider ul {
  padding:5px;
  margin:-5px -13px -5px -5px;
  list-style-type: none;
  height: 100px;
  overflow: auto;
  width:55px;
  color: #999;
  overflow-x: hidden;
}
.showSelector{
  display:inline-block;
}
li.dtp-li-active{
  background-color: #ed4d00;
  color: white;
}
li.dtp-li{
  padding: 4px;
  font-size: 16px;
  width: 100%;
  cursor: pointer;
}
.time-picker{
  display: inline-block;
}
.noDisplay{
  display: none;
}
.okButton{
  float: right;
  margin-right: 10px;
}

textarea.resize {
	overflow: hidden;
	resize: none;
}


/* Videos */
.vid {
	background-color: #fcfcfc;
	display: inline-block;
	margin: 20px 15px;
	width: 340px;
  height: 192px;
	text-align: left;
	vertical-align: middle;
  background-color: #333;
	position: relative;
	cursor: pointer;

	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
}
.vid-create {
	background-color: #777;
}
.vid-create .vid-label {
	background-color: rgba(0,0,0,0);
	color: #aaa;
}
.vid-plus {
  color: #aaa;
  font-size: 130px;
  text-align: center;
  margin-top: 74px;
}
.vid-create:hover {
	background-color: #555;
}
.vid-create:hover .vid-plus {
	color: #eee;
}
.vid-create:hover .vid-label {
	color: #fff;
}
.vid-label {
	position: absolute;
	bottom: 0;
	color: white;
	background-color: rgba(0,0,0,0.6);
	padding: 8px 10px;
	width: 100%;
	font-size: 17px;
	font-weight: 600;
	line-height: 24px;
	text-align: center;
	letter-spacing: 1.5px;

	-webkit-border-bottom-left-radius: 15px;
	-moz-border-bottom-left-radius: 15px;
	border-bottom-left-radius: 15px;
	-webkit-border-bottom-right-radius: 15px;
	-moz-border-bottom-right-radius: 15px;
	border-bottom-right-radius: 15px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.vid-title {
	font-size: 20px;
	line-height: 20px;
	font-weight: 400;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #555;
}
.vid-img-main {
	width: 100%;
  min-height: 192px;
	border: 1px #ddd solid;
  background-color: #333;

	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	position: relative;
	cursor: pointer;
}
.vid-text {
	padding-top: 10px;
	font-size: 16px;
	line-height: 22px;
	letter-spacing: 1px;
  white-space: pre-wrap;       /* Since CSS 2.1 */
  white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */
}
.vid-text img {
	max-height: 20px;
	opacity: 0.5;
	display: inline-block;
	vertical-align: middle;
}
.vid-step {
	padding: 10px;
}
.vid-edit {
	float: right;
	height: 20px;
}

.vid-search {
	width: 280px;
	display: inline-block;
}
.vid-search input {
	text-align: center;
}

.vid-img {
	width: 100%;
	border: 1px #ddd solid;
	cursor: pointer;
}
.vid-how {
	color: #aeaeae;
	font-size: 12px;
	text-align: center;
	padding-top: 5px;
}
.player-frame {
	position: absolute;
	top: 50%;
	left: 50%;

	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* Sleek UI */
.sleek-class-title {
	text-align: center;
	font-size: 20px;
	font-weight: 300;
	letter-spacing: 2px;
	margin: 0px -20px 10px;
}
/* Private Party */
.party-title {
	text-align: center;
	font-size: 20px;
	font-weight: 300;
	letter-spacing: 2px;
	margin: 10px -20px 10px;
}

/* Members */
.member-force-row.member-row,
.member-row {
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px;
	display: block;
	vertical-align: top;

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

	box-sizing: inherit;
	-moz-box-sizing: inherit;
	-webkit-box-sizing: inherit;

	position: relative;
	text-align: left;
	background: linear-gradient(#eeeeee, #e0e0e0);
	background: -o-linear-gradient(#eeeeee, #e0e0e0);
	background: -moz-linear-gradient(#eeeeee, #e0e0e0);
	background: -webkit-linear-gradient(#eeeeee, #e0e0e0);
}
.member-row:hover {
	background: rgba(255,255,255,0.9);
	cursor: pointer;
}
.member-male {
	-webkit-box-shadow: inset 0 0 15px rgba(72,130,195,0.3);
	-moz-box-shadow: inset 0 0 15px rgba(72,130,195,0.3);
	box-shadow: inset 0 0 15px rgba(72,130,195,0.3);
	border-color: rgba(72,130,195,0.3);
}
.member-female {
	-webkit-box-shadow: inset 0 0 15px rgba(211,113,191,0.3);
	-moz-box-shadow: inset 0 0 15px rgba(211,113,191,0.3);
	box-shadow: inset 0 0 15px rgba(211,113,191,0.3);
	border-color: rgba(211,113,191,0.3);
}
.member-gender {
	-webkit-box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
	box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
	border-color: rgba(0,0,0,0.3);
}
.member-female.member-glow {
	-webkit-box-shadow: inset 0 0 20px rgba(210,210,0,0.6);
	-moz-box-shadow: inset 0 0 20px rgba(210,210,0,0.6);
	box-shadow: inset 0 0 20px rgba(210,210,0,0.6);
}
.member-male.member-glow {
	-webkit-box-shadow: inset 0 0 20px rgba(210,210,0,0.6);
	-moz-box-shadow: inset 0 0 20px rgba(210,210,0,0.6);
	box-shadow: inset 0 0 20px rgba(210,210,0,0.6);
}
.member-cell-profile {
	display: table-cell;
	width: 1%;
}
.member-force-row .member-profile,
.member-profile {
	width: 48px;
	height: 48px;
	margin: 15px 20px;
}
.member-force-row .member-position,
.member-position {
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 1px 15px 0px 5px;
	letter-spacing: 0px;
	text-align: left;
	font-size: 12px;
	line-height: 12px;
	border-bottom: #ccc solid 1px;
}
.member-position div {
	display: inline-block;
}
.member-position img {
	height: 12px;
	max-width: 12px;
	margin: 0px 0px -1px 5px;
	display: inline-block;
	opacity: 0.3;
}
.member-position img.ml-rep {
	opacity: 0.7;
}
.member-force-row .member-name,
.member-name {
	display: table-cell;
	color: #6f6f6f;
	font-size: 18px;
	font-weight: 400;
	padding-bottom: 5px;
	letter-spacing: 0px;
}
.member-details {
	display: table-cell;
	color: #aaa;
	font-size: 14px;
	font-weight: 600;
}
.member-details-tbl {
	display: table;
	width: 100%;
	max-width: 170px;
}
.member-details-balance {
	margin-right: -5px;
}
.member-details-balance-red {
	color: rgba(223,49,46,0.5);/*red*/
}
.member-details-balance-green {
	color: rgba(7,130,13,0.7);/*green*/
}
.member-icon {
	height: 12px;
	display: inline-block;
	vertical-align: middle;
	opacity: 0.3;
}
.member-icon-value {
	display: inline-block;
	height: 11px;
	opacity: 0.3;
}
.member-force-row .member-checkin-button,
.member-checkin-button {
	display: table-cell;
	width: 1%;
	padding-right: 20px;
	vertical-align: middle;
	position: static;
}
.member-force-row .member-indicator,
.member-indicator {
	display: table-cell;
	width: 1%;
	padding-right: 20px;
	vertical-align: middle;
	white-space: nowrap;
	text-align: left;
	float: none;
	position: static;
	top: auto;
	right: auto;
}
.member-force-row .member-indicator div,
.member-indicator div {
	text-align: left;
	position: static;
	top: auto;
	right: auto;
}
.member-force-row .member-checkin-button > div,
.member-checkin-button > div {
	text-align: left;
	position: static;
	top: auto;
	right: auto;
}
.member-force-row .member-indicator img,
.member-indicator img {
	display: inline-block;
	max-width: 32px;
	max-height: 28px;
	opacity: 0.7;
	padding-left: 5px;
	vertical-align: middle;
}
.member-indicator img:hover {
	opacity: 1;
}
.member-force-row .member-checkins,
.member-checkins {
	color: #84be84;
	font-size: 28px;
	font-weight: 600;
	line-height: 28px;
	vertical-align: middle;
}
.member-force-row .member-checkins img,
.member-checkins img {
	padding-right: 1px;
}
.member-checkins:hover {
	color: #53a653;
}
.member-checkins:hover img {
	opacity: 1;
}
.member-force-row .member-space,
.member-space {
	right: auto;
}
/* For tablets */
@media only screen and (min-width: 600px) {
	.studio .studio-plan {
		display: inline-block;
	}
	.member-row {
		width: 290px;
		margin: 20px 10px 10px;

		background: #f6f6f6;
		color: #999;
		padding: 20px 0px 20px 20px;
		border: 1px solid #CCC;
		display: inline-block;
		vertical-align: top;
		text-align: left;

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

		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
	.member-profile {
		width: 64px;
		height: 64px;
		margin: 0px;
		margin-right: 20px;
	}
	.member-position {
		display: block;
		position: static;
		padding: 4px 0px;
		border-bottom: 0px;
	}
	.member-name {
		color: #666;
		font-size: 14px;
		font-weight: 600;
		padding: 1px 0px 2px;
		letter-spacing: -0.5px;
	}
	.member-checkin-button {
		float: right;
		padding: 0px;
	}
	.member-indicator {
		float: right;
		padding: 0px;
		position: absolute;
	}
	.member-indicator div {
		text-align: right;
		position: absolute;
		top: -19px;
		right: 9px;
	}
	.member-checkin-button > div {
		text-align: right;
		position: absolute;
		top: -21px;
		right: -1px;
	}
	.member-indicator img {
		max-width: 14px;
		max-height: 12px;
	}
	.member-space {
		/* right: 70px; */
	}
	.member-checkins {
		font-size: 14px;
	}
	.member-checkins img {
		padding-right: 2px;
	}
}
.box-inactive {
	box-shadow: inset 0 0 15px rgba(72,72,72,0.3);
	border-color: rgba(130,130,130,0.3);
}
.box-inactive .member-name {
	color: #999;
}
.box-inactive .member-profile {
	-webkit-filter: grayscale(100%) opacity(50%);
	filter: grayscale(100%) opacity(50%);
}
.box-archive {
	box-shadow: inset 0 0 15px rgba(164,9,0,0.3);
	border-color: rgba(164,9,0,0.1);
}
.box-archive .member-name {
	color: #999;
}
.box-archive .member-profile {
	-webkit-filter: grayscale(100%) opacity(50%);
	filter: grayscale(100%) opacity(50%);
}

/* Groups */
.grp-qtr {
	display: inline-block;
	width: 100%;
}

/* Devices */
.hide-mobile {
	display: none;
}
.mobile {
	display: none;
	max-width: 440px;
	vertical-align: top;
}
.mobile .event-checkin {
	margin-bottom: 0px;
}
.mobile .box-med {
	margin: 20px 10px;
}
.mobile .nav-off,
.nav-off {
	display: none;
}
.nav-on {
}
.dev-mob-only {
	display: table-cell;
}
.dev-tab {
	display: none;
}
.dev-small {
	display: none;
}
.dev-med {
	display: none;
}
.dev-med-inline {
	display: none;
}
.mob-med {
	display: block;
}
.dev-lrg {
	display: none;
}

/* For iPhone 5 small screens */
@media only screen and (max-width: 320px) {
	.nav-logo {
		max-width: 150px;
	}
	.nav-item {
		padding: 0px 10px;
	}
	.vid {
		width: 300px;
		height: 169px;
		margin: 10px;
	}
	.mobile .box-responsive,
	.box-responsive {
		width: 300px;
	}
	.chooser-auto,
	.chooser-cart {
		min-width: 300px;
	}
}
/* For tablets */
@media only screen and (min-width: 600px) {
	.hide-mobile {
		display: block;
	}
	span.hide-mobile {
		display: inline-block;
	}
	.dev-mob-only {
		display: none;
	}
	.dev-tab {
		display: table-cell;
	}
	.dev-small {
		display: none;
	}
	.dev-med {
		display: none;
	}
	.dev-lrg {
		display: none;
	}

	.col-edge {
		margin: 0px 30px;
	}
	.col-edge-qtr {
		margin: 0px 30px;
	}
	.col-edge-qtr .box-med {
		margin: 20px 20px;
	}
	.col-qtr {
		width: 50%;
	}
	.col-half {
		width: 100%;
	}
	.col-edge-full {
		margin: 20px 30px 20px;
	}
	.col-full .box-wrap,
	.col-full .top {
		width: 100%;
		max-width: none;
		display: inline-block;
	}

	.grp-qtr {
		width: 50%;
	}

	.form-horz {
		float: right;
		margin: -10px auto 0px;
	}
	.form-wide {
		float: right;
		max-width: 300px;
		margin-top: -10px;
	}

	.box-subvalue {
		font-size: 44px;
	}
	.amount-cents {
		font-size: 24px;
	}

	.event-item-mid {
		padding-right: 20px;
	}
	.event-item-icon {
		padding: 0px 5px;
		margin-right: 15px;
	}
}
/* For Small Screen Desktop */
@media only screen and (min-width: 768px) {
	.alarm-inner {
		margin-left: 170px;
		max-width: 100%; /*750px*/
		display: block;
	}
	.page {
		margin-left: 170px;
		width: auto;
		max-width: 100%; /*750px*/
		display: block;
	}
	.page#view-member {
		padding:0px 20px;
	}
	.page#members-list {
		margin-top: 20px;
	}
	.member-buttons {
		text-align: right;
		padding:20px 20px 10px;
	}
	.menu-outer {
		left: 0;
		right: auto;
		display: block;
	}
	.nav-off {
		display: inline-block;
	}
	.nav-on {
		display: none;
	}
	.dev-tab {
		display: table-cell;
	}
	.dev-small {
		display: table-cell;
	}
	.dev-med {
		display: none;
	}
	.dev-lrg {
		display: none;
	}

	.col-qtr {
		width: 50%;
	}
	.col-half {
		width: 100%;
	}
	.col-dyn {
		width: 100%;
		max-width: 1100px;
		display: inline-block;
		vertical-align: top;
	}

	.box-responsive {
		width: 500px;
	}
	.col-50 {
		width: 50%;
		display: inline-block;
	}
	.col-50-left {
		padding-right: 4px;
	}
	.col-50-right {
		padding-left: 4px;
	}

	.cal-profiles {
		display: block;
	}

	.package-option-item {
		padding: 10px 30px;
	}
	.package-title {
		padding: 18px 0px 18px 40px;
	}
	.package-edit {
		width: 40px;
	}
}
/* For Medium Screen Desktop */
@media only screen and (min-width: 992px) {
	.dev-tab {
		display: table-cell;
	}
	.dev-small {
		display: table-cell;
	}
	.dev-med {
		display: table-cell;
	}
	.dev-med-inline {
		display: inline-block;
	}
	.mob-med {
		display: none;
	}
	.dev-lrg {
		display: none;
	}

	.col-qtr {
		width: 50%;
	}
	.col-half {
		width: 50%;
	}

	.calendar .tbl-cell {
		height: 150px;
		text-align: left;
		vertical-align: top;
		border: 1px solid #dedede;
	}
	.cal-day,
	.cal-day-event,
	.cal-day-weekend,
	.cal-day-number,
	.cal-day-today .cal-day-number {
		background-color: transparent;
		text-align: left;
		line-height: inherit;
		font-size: 12px;
		line-height: 12px;
		font-weight: 600;
		padding: 10px;
		color: inherit;
		width: auto;
		height: auto;
		padding: 10px;
		box-shadow: none;
	}
	.cal-event {
		display: block;
	}
	.cal-day-today {
		background-color: rgba(255,235,143,0.3);
	}
	.calendar .show-day:hover {
		background-color: #fff;
	}
	.calendar .show-day:hover .cal-item {
		color: #fff;
	}
	.cal-item {
		display: block;
	}
	.cal-mob {
		display: none;
	}
	.cal-desk {
		display: inline-block;
	}

	.nav-off {
		display: inline-block;
	}
	.nav-on {
		display: none;
	}

	.col-edge-full {
		margin: 40px 50px 20px;
	}
	.col-tbl {
		display: table;
	}
	.col-tbl-row {
		display: table-row;
	}
	.col-tbl-cell {
		display: table-cell;
	}
	.col-tbl-cell .box-med {
		margin: 0px;
	}

	.dropdown-action {
		display: inline-block;
	}
}
/* For Wide Screen Desktop */
@media only screen and (min-width: 1200px) {
	.nav-off {
		display: inline-block;
	}
	.nav-on {
		display: none;
	}
	.dev-tab {
		display: table-cell;
	}
	.dev-small {
		display: table-cell;
	}
	.dev-med {
		display: table-cell;
	}
	.dev-lrg {
		display: table-cell;
	}

	.col-qtr {
		width: 25%;
	}
	.col-half {
		width: 50%;
	}
	.col-full .box-wrap,
	.col-full .box-med {
		width: 50%;
		max-width: none;
		display: inline-block;
	}

	.grp-qtr {
		width: 25%;
	}

	.event-item-mid {
		padding-right: 30px;
	}

	.class-main {
		white-space: nowrap;
		display: table-cell;
		vertical-align: top;

	  box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  -webkit-box-sizing: border-box;
	}
	.class-description {
		vertical-align: top;
		padding-top: 10px;
	}
}
@media print {
	html {
		background-color: #fff;
	}
	.nav-bar,
	.nav-bar-spacer,
	.box-main-title,
	.page-bar,
	.page-bar-spacer,
	.cal-arrow,
	.legal {
		display: none;
	}
	.page {
		margin-top: 0px;
	}
	.box {
		background-color: #fff;
		color: #999;
		padding: 0px;
		margin: 0px;
		padding-top: 10px;
		border: 0px solid #CCC;
	}

	.calendar .tbl-cell {
		width: auto;
		height: auto;
		text-align: left;
		vertical-align: top;
		border: 1px solid #dedede;
	}
	.cal-day,
	.cal-day-event,
	.cal-day-weekend,
	.cal-day-today .cal-day:first-child {
		background-color: transparent;
		text-align: left;
		line-height: inherit;
		font-size: 12px;
		line-height: 12px;
		font-weight: 600;
		color: inherit;
		width: auto;
		height: auto;
		padding: 0px;
		padding-left: 3px;
		box-shadow: none;
	}
	.cal-day-today {
		background-color: rgba(255,235,143,0.3);
	}
	.calendar .show-day:hover {
		background-color: #fff;
	}
	.calendar .show-day:hover .cal-item {
		color: #fff;
	}
	.cal-item {
		display: block;
		padding: 3px 1px 3px 3px;
		margin: 0px 2px 3px;
	}
	.cal-mob {
		display: none;
	}
	.cal-desk {
		display: inline-block;
	}
	.cal-event {
		display: block;
	}
	.cal-item {
		padding: 5px 0px 5px 6px;
	}

	.box-subvalue {
		font-size: 40px;
	}
	.print-hide {
		display: none;
	}
}

.kiosk .page,
.kiosk .alarm-inner {
	margin-left: 0px;
}
.nav-bar .page,
.page-bar .page {
	margin-top: 0px;
	margin-left: 0px;
	max-width: 100%;
	display:block;
  padding: 0px;
}




/* Buttons */
button {
  display: inline-block;
  *display: inline;
  padding: 2px 10px;
  margin: 5px 0px 5px 0px;
  margin-left: .3em;
  font-size: 12px;
  line-height: 20px;
  color: #333333;
  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #f5f5f5;
  *background-color: #e6e6e6;
  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  *border: 0;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

button:hover,
button:focus,
button:active,
button.active,
button.disabled,
button[disabled] {
  color: #333333;
  background-color: #e6e6e6;
  *background-color: #d9d9d9;
}

button:active,
button.active {
  background-color: #cccccc \9;
}

button:first-child {
  *margin-left: 0;
}

button:hover,
button:focus {
  color: #333333;
  text-decoration: none;
  background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
     -moz-transition: background-position 0.1s linear;
       -o-transition: background-position 0.1s linear;
          transition: background-position 0.1s linear;
}

button:focus {
  outline: none;
}

button.active,
button:active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}

button.disabled,
button[disabled] {
  cursor: default;
  background-image: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}

.btn-image {
	display:inline-block;
  padding: 10px 10px;
  font-size: 16.5px;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  margin-left: 0px;
	position: relative;
}
.btn-kiosk {
	width: 280px;
	display:inline-block;
  padding: 10px 0px;
  font-size: 16.5px;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  margin-left: 0px;
}
.btn-icon {
	font-size: 30px;
	padding: 0px 5px;
	height: 34.5px;
	vertical-align: top;
	margin: 0px;
	margin-bottom: 12px;
}
.btn-long {
  width: 100%;
  padding: 10px 0px;
  font-size: 16.5px;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  margin-left: 0px;
  display:block;
}
.btn-right {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;

	-webkit-border-top-left-radius: 0px;
	-moz-border-radius-topleft: 0px;
	border-top-left-radius: 0px;

	-webkit-border-bottom-left-radius: 0px;
	-moz-border-radius-bottomleft: 0px;
	border-bottom-left-radius: 0px;
}
.inpt-left {
	margin-bottom: 0px;

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

	-webkit-border-top-left-radius: 6px;
	-moz-border-radius-topleft: 6px;
	border-top-left-radius: 6px;

	-webkit-border-bottom-left-radius: 6px;
	-moz-border-radius-bottomleft: 6px;
	border-bottom-left-radius: 6px;
}

.btn-large {
  padding: 10px 18px;
  font-size: 17.5px;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}
.btn-large [class^="icon-"],
.btn-large [class*=" icon-"] {
  margin-top: 4px;
}
.btn-reg {
	padding: 7px;
}
.btn-text {
	font-size: 10px;
}
.btn-text img {
	height: 8px;
}
.btn-title {
	font-size: 12px;
}

.btn-small {
  padding: 5px 6px;
  margin-top: 0px;
  font-size: 10.5px;
  line-height: 10.5px;
  letter-spacing:0.05em;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}
.btn-small [class^="icon-"],
.btn-small [class*=" icon-"] {
  margin-top: -1px;
}

.btn-blue.active,
.btn-liblue.active,
.btn-green.active,
.btn-orange.active,
.btn-red.active,
.btn-black.active,
.btn-gray.active,
.btn-brand.active {
  color: rgba(255, 255, 255, 0.75);
}
.btn-brand img {
	height: 16px;
	margin-top: -2.5px;
}

/* Button Brand */
.btn-brand {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #443287;
  *background-color: #5d45a2;
  background-image: -moz-linear-gradient(top, #5d45a2, #443287);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5d45a2), to(#443287));
  background-image: -webkit-linear-gradient(top, #5d45a2, #443287);
  background-image: -o-linear-gradient(top, #5d45a2, #443287);
  background-image: linear-gradient(to bottom, #5d45a2, #443287);
  background-repeat: repeat-x;
  border-color: #443287 #443287 #5d45a2;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-brand:hover,
.btn-brand:focus,
.btn-brand:active,
.btn-brand.active,
.btn-brand.disabled,
.btn-brand[disabled] {
  color: #ffffff;
  background-color: #443287;
  *background-color: #5d45a2;
}
.btn-brand:active,
.btn-brand.active {
  background-color: #443287 \9;
}

/* Button Blue */
.btn-blue {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #006dcc;
  *background-color: #0044cc;
  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
  background-image: linear-gradient(to bottom, #0088cc, #0044cc);
  background-repeat: repeat-x;
  border-color: #0044cc #0044cc #002a80;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active,
.btn-blue.active,
.btn-blue.disabled,
.btn-blue[disabled] {
  color: #ffffff;
  background-color: #0044cc;
  *background-color: #003bb3;
}
.btn-blue:active,
.btn-blue.active {
  background-color: #003399 \9;
}

/* Button Orange */
.btn-orange {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #faa732;
  *background-color: #f89406;
  background-image: -moz-linear-gradient(top, #fbb450, #f89406);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));
  background-image: -webkit-linear-gradient(top, #fbb450, #f89406);
  background-image: -o-linear-gradient(top, #fbb450, #f89406);
  background-image: linear-gradient(to bottom, #fbb450, #f89406);
  background-repeat: repeat-x;
  border-color: #f89406 #f89406 #ad6704;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active,
.btn-orange.active,
.btn-orange.disabled,
.btn-orange[disabled] {
  color: #ffffff;
  background-color: #f89406;
  *background-color: #df8505;
}
.btn-orange:active,
.btn-orange.active {
  background-color: #c67605 \9;
}

/* Button Red */
.btn-red {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #da4f49;
  *background-color: #bd362f;
  background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
  background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
  background-repeat: repeat-x;
  border-color: #bd362f #bd362f #802420;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-red:hover,
.btn-red:focus,
.btn-red:active,
.btn-red.active,
.btn-red.disabled,
.btn-red[disabled] {
  color: #ffffff;
  background-color: #bd362f;
  *background-color: #a9302a;
}
.btn-red:active,
.btn-red.active {
  background-color: #942a25 \9;
}

/* Button Green */
.btn-green {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #5bb75b;
  *background-color: #51a351;
  background-image: -moz-linear-gradient(top, #62c462, #51a351);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#51a351));
  background-image: -webkit-linear-gradient(top, #62c462, #51a351);
  background-image: -o-linear-gradient(top, #62c462, #51a351);
  background-image: linear-gradient(to bottom, #62c462, #51a351);
  background-repeat: repeat-x;
  border-color: #51a351 #51a351 #387038;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-green:hover,
.btn-green:focus,
.btn-green:active,
.btn-green.active,
.btn-green.disabled,
.btn-green[disabled] {
  color: #ffffff;
  background-color: #51a351;
  *background-color: #499249;
}
.btn-green:active,
.btn-green.active {
  background-color: #408140 \9;
}

.load-more-scroll {
	display: block;
  text-align: center;
	margin-top: 15px;
  margin-bottom: 0px;

  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

/* Button Light Blue */
.btn-lblue {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #49afcd;
  *background-color: #2f96b4;
  background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
  background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: linear-gradient(to bottom, #5bc0de, #2f96b4);
  background-repeat: repeat-x;
  border-color: #2f96b4 #2f96b4 #1f6377;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-lblue:hover,
.btn-lblue:focus,
.btn-lblue:active,
.btn-lblue.active,
.btn-lblue.disabled,
.btn-lblue[disabled] {
  color: #ffffff;
  background-color: #2f96b4;
  *background-color: #2a85a0;
}
.btn-lblue:active,
.btn-lblue.active {
  background-color: #24748c \9;
}

/* Button Light Blue */
.btn-liblue {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #49afcd;
  *background-color: #3a9cb4;
  background-image: -moz-linear-gradient(top, #74c6de, #639eb4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#79c5de), to(#639eb4));
  background-image: -webkit-linear-gradient(top, #74c6de, #639eb4);
  background-image: -o-linear-gradient(top, #74c6de, #639eb4);
  background-image: linear-gradient(to bottom, #74c6de, #639eb4);
  background-repeat: repeat-x;
  border-color: #639eb4 #639eb4 #4687a2;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-liblue:hover,
.btn-liblue:focus,
.btn-liblue:active,
.btn-liblue.active,
.btn-liblue.disabled,
.btn-liblue[disabled] {
  color: #ffffff;
  background-color: #639eb4;
  *background-color: #639eb4;
}
.btn-liblue:active,
.btn-liblue.active {
  background-color: #4687a2 \9;
}

/* Button Black */
.btn-black {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #363636;
  *background-color: #222222;
  background-image: -moz-linear-gradient(top, #444444, #222222);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#222222));
  background-image: -webkit-linear-gradient(top, #444444, #222222);
  background-image: -o-linear-gradient(top, #444444, #222222);
  background-image: linear-gradient(to bottom, #444444, #222222);
  background-repeat: repeat-x;
  border-color: #222222 #222222 #000000;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-black:hover,
.btn-black:focus,
.btn-black:active,
.btn-black.active,
.btn-black.disabled,
.btn-black[disabled] {
  color: #ffffff;
  background-color: #222222;
  *background-color: #151515;
}
.btn-black:active,
.btn-black.active {
  background-color: #080808 \9;
}

/* Button Gray */
.btn-gray {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #b6b6b6;
  *background-color: #888;
  background-image: -moz-linear-gradient(top, #bbb, #999);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bbb), to(#999));
  background-image: -webkit-linear-gradient(top, #bbb, #999);
  background-image: -o-linear-gradient(top, #bbb, #999);
  background-image: linear-gradient(to bottom, #bbb, #999);
  background-repeat: repeat-x;
  border-color: #999 #999 #000000;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active,
.btn-gray.active,
.btn-gray.disabled,
.btn-gray[disabled] {
  color: #ffffff;
  background-color: #999;
  *background-color: #858585;
}
.btn-gray:active,
.btn-gray.active {
  background-color: #777 \9;
}

.btn-left {
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	padding-right: 12px;
	height: 100%;
	max-height: 62px;
	margin-right: 0px;
	border-right-color: rgba(0, 0, 0, 0.25);
}
.btn-right {
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	padding-left: 6px;
	padding-right: 6px;
	margin-left: 0px;
	height: 100%;
	max-height: 42px;
	border-left-color: rgba(255, 255, 255, 0.3);
}
.btn-close {
	font-size: 20px;
	line-height: 20px;
}
.btn-fade-icon {
	opacity: 0.9;
	padding: 0px;
}
.btn-vert {
	padding-top: 4px;
	padding-bottom: 5px;
	padding-left: 3px;
	padding-right: 3px;
}
.btn-vert span {
	writing-mode: tb-rl;
	font-size: 12px;
}
.vert {
	writing-mode: tb-rl;
	font-size: 10px;
	padding-left: 5px;
	padding-right: 5px;
	margin-top: -3px;
	margin-bottom: -7px;
	display: inline-block;
}

.input-list {
	position: relative;
}
.input-list input {
	margin: 0px;
}
.list-group {
	position: absolute;
  top: 100%;
  left: 0;
  max-width: 300px;
  z-index: 70;
  float: left;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  text-align: left;
  background-color: #f6f6f6;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.list-group a {
  display: block;
  padding: 5px 20px 5px 10px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
  cursor: pointer;
  overflow-x: hidden;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.list-group a:hover,
.list-group a:focus {
  color: #ffffff;
  text-decoration: none;
  outline: 0;
  background-color: #337ab7;
}

/* Drop Down Menu */
.caret {
  display: inline-block;
  width: 0;
  height: 0;
	margin-bottom: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.caret-right {
  display: inline-block;
  width: 0;
  height: 0;
	margin-bottom: 2px;
  vertical-align: middle;
  border-left: 4px dashed;
  border-left: 4px solid \9;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}
.dropup,
.dropdown {
  position: relative;
	outline: none;
	display: inline-block;
}
.dropdown .nav-off {
	vertical-align: initial;
}
.dropdown-toggle:focus {
  outline: 0;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
	max-width: 300px;
  z-index: 50;
  display: none;
  float: left;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  text-align: left;
	background-color: #f6f6f6;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
}
.dropdown-menu ul {
  list-style: none;
	padding-inline-start: 0px;
}
.dropdown-menu.pull-right {
  right: 0;
  left: auto;
}
.dropdown-menu.pull-right-mobile {
  right: auto;
  left: auto;
}
@media only screen and (min-width: 600px) {
	.dropdown-menu.pull-right-mobile {
	  right: 0;
	  left: auto;
	}
}
.dropdown-menu .divider {
  height: 1px;
  margin: 5px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.dropdown-menu span {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #aaa;
  white-space: nowrap;
}
.dropdown-menu span.label {
  display: block;
  padding: 3px 20px;
  clear: both;
	font-size: 11px;
  font-weight: normal;
  line-height: 1.42857143;
  color: #aaa;
  white-space: nowrap;
}
.dropdown-menu li {
	width: 100%;
}
.dropdown-menu li > a,
.dropdown-menu li > label {
  display: block;
  padding: 5px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
	cursor: pointer;
	overflow-x: hidden;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.dropdown-menu li > label.half {
	width: 50%;
	display: inline-block;
}
.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-menu li > label:hover,
.dropdown-menu li > label:focus {
  text-decoration: none;
	color: #fff;
  background-color: #f5f5f5;
	background: linear-gradient(#5d45a2, #443287);
	background: -o-linear-gradient(#5d45a2, #443287);
	background: -moz-linear-gradient(#5d45a2, #443287);
	background: -webkit-linear-gradient(#5d45a2, #443287);
}
.dropdown-menu .active > a,
.dropdown-menu .active > a:hover,
.dropdown-menu .active > a:focus {
  color: #ffffff;
  text-decoration: none;
  outline: 0;
  background-color: #337ab7;
}
.dropdown-menu .disabled > a,
.dropdown-menu .disabled > a:hover,
.dropdown-menu .disabled > a:focus,
.dropdown-menu .disabled > label,
.dropdown-menu .disabled > label:hover,
.dropdown-menu .disabled > label:focus {
  color: #777;
}
.dropdown-menu .disabled > a:hover,
.dropdown-menu .disabled > a:focus,
.dropdown-menu .disabled > label:hover,
.dropdown-menu .disabled > label:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  cursor: not-allowed;
}
.dropdown-menu li > a:hover .bold,
.dropdown-menu li > a:focus .bold,
.dropdown-menu li > label:hover .bold,
.dropdown-menu li > label:focus .bold {
	color: #fff;
}
.open > .dropdown-menu {
  display: block;
}
.open > a {
  outline: 0;
}
.pull-right > .dropdown-menu {
  right: 0;
  left: auto;
}
.dropup .caret {
  border-top: 0;
  border-bottom: 4px dashed;
  border-bottom: 4px solid \9;
  content: "";
}
.dropup .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 2px;
}
.dropdown-menu.full {
	width: 300px;
}
.dropdown-header {
	padding: 0px 5px;
	box-sizing: border-box;
	background-color: rgba(0,0,0,0.05);
}
.dropdown-item-100 {
	width: 100%;
	margin-bottom: 0px;
	display: block;
	text-align: center;
}
.dropdown-item-50 {
	width: 50%;
	margin-bottom: 0px;
	display: inline-block;
}
div.dropdown-item-50 {
	padding: 10px 0px;
	text-align: center;
	font-size: 10px;
}
div.dropdown-item-50:hover {
	background-color: #dedede;
	color: #777;
	cursor: pointer;
}
.dropdown-opt {
	padding: 11px 10px;
	color: #999;
	display: block;
	line-height: 13px;
}
.dropdown-opt label {
	float: right;
	margin-top: 1px;
}
.dropdown-opt input[type=checkbox] {
	margin: 5px 0px 0px;
}
.dropdown-opt input[type=text] {
}
.dropdown-opt:hover {
	background-color: #dedede;
	color: #777;
}
.dropdown-menu .right-icon {
	height: 14px;
	float: right;
	opacity: 0.3;
	padding: 3px 5px 3px 0px;
	margin-right: -20px;
	cursor: pointer;
}
.dropdown-menu li > a:hover .right-icon,
.dropdown-menu li > a:focus .right-icon,
.dropdown-menu li > label:hover .right-icon,
.dropdown-menu li > label:focus .right-icon {
	-webkit-filter: invert(100%);
	filter: invert(100%);
	opacity: 0.5;
}
.dropdown-menu li > a:hover .right-icon:hover,
.dropdown-menu li > a:focus .right-icon:hover,
.dropdown-menu li > label:hover .right-icon:hover,
.dropdown-menu li > label:focus .right-icon:hover {
	opacity: 0.8;
}

/* Infinite */
.inf-small {
	font-size: 28px;
	font-weight: 300;
	margin-top: -4px;
	display: inline-block;
	vertical-align: middle;
}
.inf-small2 {
	font-size: 28px;
	font-weight: 300;
	margin-top: -6px;
	display: inline-block;
	vertical-align: middle;
}

/* Filters */
li label.filter-category,
li a.filter-category {
	background-color: #eee;
	padding-left: 15px;
	line-height: 20px;
	font-size: 12px;
	font-weight: 400;
	color: #888;
}
li a.filter-option {
	padding-left: 25px;
}
li a.filter-private {
	color: #aaa;
}
li a.filter-staff {
	background-color: rgba(166,132,83,0.15);
}
li a.filter-archive {
	background-color: rgba(199,161,161,0.25);
}
li a.filter-hidden {
	background-color: rgba(161,161,199,0.25);
}
.dropdown-menu li > label.filter-category:hover,
.dropdown-menu li > label.filter-category:focus {
	color: #888;
	background: none;
	background-color: #eee;
}

.member-menu {
	overflow: hidden;
}
.member-menu input {
	margin-top: 10px;
}
.member-menu li:nth-child(even) {
	background-color: #e9e9e9;
}
.member-menu li {
	color: #999;
	font-size: 16px;
	line-height: 32px;
	padding: 0px 10px;
	white-space: auto;
	min-width: 300px;
}
.member-menu label {
	display: block;
}

/* Class Level Drop Down */
li a.class-level-item {
	padding-left: 15px;
	line-height: 20px;
	font-weight: 600;
	white-space: normal;
	min-width: 240px;

}
li a.class-level-sub-item {
	white-space: normal;
	min-width: 230px;
	padding-left: 30px;
	color: #666;
}