
body {
	font-family: 'Poppins', Arial; color: #111; font-size: 13px; line-height: 1.25em;
}

* {
	outline: none; font-weight: 300;
	font-family: 'Poppins', Arial;
}

a {
	cursor: pointer;
}

.cursor-pointer {
	cursor: pointer;
}

b {
	font-weight: 700;
}

.disabled-silent {
	background: #fff !important; border: none !important; font-weight: bold !important;
}

.font-size-040 { font-size: 0.40em; }
.font-size-050 { font-size: 0.50em; }
.font-size-060 { font-size: 0.60em; }
.font-size-070 { font-size: 0.70em; }
.font-size-080 { font-size: 0.80em; }
.font-size-090 { font-size: 0.90em; }
.font-size-100 { font-size: 1.10em; }
.font-size-110 { font-size: 1.10em; }
.font-size-120 { font-size: 1.20em; }
.font-size-130 { font-size: 1.30em; }
.font-size-140 { font-size: 1.40em; }
.font-size-150 { font-size: 1.50em; }
.font-size-160 { font-size: 1.60em; }
.font-size-170 { font-size: 1.70em; }
.font-size-180 { font-size: 1.80em; }
.font-size-190 { font-size: 1.90em; }
.font-size-200 { font-size: 2.00em; }

.width-auto {
	min-width: auto !important;
	width: auto !important;
}

small {
	font-weight: 300;
}

input + small, textarea + small, select + small {
	display: block; margin-top: 4px;
}

.btn {
	position: relative; border-radius: 3px; font-weight: 400; border-radius: 999px;
	padding-top: 0.5rem; padding-bottom: 0.5rem;
}

.text-terciary {
	color: #888; font-weight: 300 !important;
}

span.field-error {
    display: block; font-size: 0.9em; color: #d00; margin-top: 6px;
}

.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle {
	background-color: #eee;
}

.dropdown-item:hover {
    color: #fff !important;
}

.form-check-label span.field-error {
    display: block; font-size: 0.9em; color: #d00;
}

.form-check-label > input {
    margin-top: 2px;
}

.form-check-label:hover > span:not(.field-error) {
    text-decoration: underline; cursor: pointer;
}

input[type="radio"]:checked + span {
    font-weight: bold;
}

.form-group {
    margin-bottom: 24px;
}

.form-control {
	font-weight: 300;
}

.form-control.empty {
	padding: 0; border: none;
}

.form-group label {
    margin: 0; padding: 0; font-weight: 400; margin-bottom: 4px;
}

.flex-even {
    flex: 1 1 0;
}

.flex-static {
    flex: 0 0 auto;
}

/* *** */
.form.white {
	background: #fff; background: rgba(255,255,255,0.95);
}

.form input, .form select, .form textarea, .form-field {
    box-shadow: none !important; border: none; border-bottom: 1px solid #338; padding: 6px 0; line-height: 1em; height: auto;
}

textarea {
	line-height: 1.4em !important;
}

.btn.dropdown-toggle {
    box-shadow: none !important; border: none; border-bottom: 1px solid #338; padding: 8px 8px; line-height: 1em; height: auto; background: none; border-radius: 0px;
}

/* *** */
.with-background {
	background: url(../img/background.jpg);
	background-size: 100%;
}

/* *** */
.loading-indicator-g {
	background: #2463c9 url(loading-2.gif?r=0) no-repeat center center;
	display: none; width: 32px; height: 32px; position: absolute; left: 0px; top: 5px;
}

html.busy .loading-indicator-g {
	display: inline-block !important;
}

html.busy * {
	cursor: wait;
}

.loading-indicator-block {
    position: absolute; display: none;
    left: 0; top: 0; width: 100%; height: 100%;
	background: #482879 url(loading-block.gif?r=0) no-repeat center center;
	border-radius: 999px;
}

.form.busy .loading-indicator-block {
	display: inline-block;
}

html.busy .loading-indicator-block.global {
	display: inline-block;
}

/* *** */
.hidden {
	display: none;
}

.x-dead {
	display: none !important;
}

.x-hidden {
	display: none !important;
}

.x-hidden1 {
	display: none !important;
}

.x-visible0 {
	display: none !important;
}

a.inv {
	display: none;
}

a.inv.active {
	display: inline-block;
}

/* *** */
.app {
	margin: 0; padding: 0; position: relative;
}

/* ***** */
.checkbox-list {
	display: block;
}

.checkbox-list > div {
	margin-top: 6px;
}

.checkbox-list > div > label {
	position: relative; display: block; margin-bottom: 4px;
}

.checkbox-list > div > label:hover {
	text-decoration: underline; cursor: pointer;
}

.checkbox-list input[type="checkbox"] {
	min-width: auto !important; width: auto !important;
	box-shadow: none !important;
}

.checkbox-list.no-search > input {
	display: none;
}

.table td a:not(.btn) {
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* ** */
.table th[data-sort] {
    text-decoration: underline; cursor: pointer; text-underline-offset: 4px; position: relative;
}

.table th[data-sort]:hover {
    text-decoration: underline;
}

.table th[data-sort].active {
    background: #eee; color: #338; text-decoration: none;
}

.table th[data-sort].active:after {
    display: none; position: absolute; left: 0px; top: -12px; background: #eee; color: #338;
	padding: 2px 8px 0 8px; border-radius: 0; font-size: 0.8em;
}

.table thead.order-asc th[data-sort].active:after {
    display: block; content: "\25B2";
}

.table thead.order-desc th[data-sort].active:after {
    display: block; content: "\25BC";
}

/* *** */
.photo {
	display: inline-block; margin-right: 4px;
}

.photo img {
	display: inline-block; border-radius: 999px; border: 2px solid #fff;
}

.photo > span {
	margin-left: 2px; margin-right: 2px;
}

.photo img {
	box-shadow: 0px 0px 8px -2px rgba(0,0,0,0.5);
}

.photo:not(.static) img, .photo.lg-shadow img {
	box-shadow: 0px 0px 16px -2px rgba(0,0,0,0.5);
}

.photo:not(.static) img:hover {
	cursor: pointer;
	box-shadow: 0px 0px 16px rgba(0,0,0,0.7);
}

/* *** */
.no-click {
	pointer-events: none;
}

.cursor-default {
	cursor: default !important;
}

/* *** */
.table.boxed {
	position: relative;
    border: 1px solid #ccc;
    box-shadow: 0px 4px 8px -6px rgba(0,0,0,0.5);
	border-radius: 5px;
}

.table.boxed tr:first-child td {
    border-top: 4px solid #ccc;
}

.table.boxed td .btn-danger {
    position: absolute; right: 0; top: 0px; background: #888; border: 1px solid #888;
    padding: 8px 6px 12px 14px; border-radius: 0 0 0 99px;
}

.table.boxed td .btn-danger:hover {
    background: #c00; border: 1px solid #c00;
}

.table.boxed a.border-0:active {
	background: none !important;
	border-color: transparent !important;
}

.table.boxed td, .table.boxed th {
    padding: 0.5rem 0.6rem;
}

/* *** */
h5 {
    text-align: center; margin: 6px 0 16px 0; padding: 12px 0; font-size: 1.2em;
    background: #eeeeee; color: #2463c9; border-radius: 5px; font-weight: 700;
}

h4 {
	font-weight: 300 !important;
}

h4 a {
	float: right; font-weight: bold; font-size: 1.5em; padding: 0 16px; margin-top: -6px; border-radius: 3px;
	text-decoration: none;
	color: #333;
}

h4 a:hover {
	background: #333; cursor: pointer; color: #fff;
	text-decoration: none;
}

h1 {
	display: block; font-weight: 600 !important; font-size: 1em; color: #48c; letter-spacing: 1px; border-top: 3px solid #48c; border-bottom: 1px solid #48c; padding: 12px 0; text-transform: uppercase; line-height: 1em;
	margin: 0; margin-bottom: 32px;
}

h2 {
    display: block; font-weight: 400; font-size: 1.3em; color: #48c; padding: 0; margin: 24px 0 16px 0;
}

.modal-open .modal {
    top: 20%;
}

.modal-backdrop {
	opacity: 0.8 !important;
	z-index: 9995 !important;
}

.bootbox.modal { z-index: 9999 !important; }

/* *********** */
.nav-tabs {
	border: none; margin-bottom: 24px; display: flex;
}

.nav-tabs a {
	display: inline-block; padding: 12px 8px; background: #eee; flex: 1 1 0; text-align: center; text-decoration: none;
	font-size: 1.0em;
}

.nav-tabs a.active {
    background: #39e; color: #fff; border-radius: 3px;
}


.nav-tabs.sub a {
	display: inline-block; padding: 12px 8px; background: #eee; flex: 1 1 0; text-align: center; text-decoration: none;
	font-size: 1.1em; color: #555;
}

.nav-tabs.sub a.active {
    background: #77d; color: #fff; border-radius: 3px;
}

/* *********** */
#sidebar {
	position: fixed; left: 0; top: 0; margin-left: -270px; min-width: 270px; max-width: 270px; min-height: 100%; height: 100%; z-index: 9999; box-sizing: border-box;
	background: #2463c9; color: #fff; transition: all 0.2s; overflow-y: auto;
}

.app.sidebar-visible #sidebar {
	margin-left: 0; box-shadow: 4px 0px 6px 2px rgba(0,0,0,0.3);
}

.app {
	margin-left: 0;
	transition: margin-left 0.2s;
}

/*.app.sidebar-visible {
	margin-left: 260px;
	transition: margin-left 0.3s;
}*/

#sidebar .sidebar-header {
	padding: 19px 16px; text-align: left; background: #1453b9;
}

#sidebar .sidebar-header > img {
	height: 48px;
}

#sidebar .sidebar-header > b {
	float: right; margin-top: 35px; margin-right: 8px;
}

#sidebar ul.components {
    padding: 0;
}

#sidebar ul p {
    padding: 1.0rem 0.5rem 0.0rem 1.6rem; font-size: 1.2em; line-height: 1.25; display: block; color: #fff; margin: 0; font-weight: 300; text-align: left;
}

#sidebar ul p span {
    float: right; margin-top: -8px;
}

#sidebar ul li a {
    padding: 10px 24px; font-size: 1.1em; display: block; color: #fff;
}

#sidebar ul li a span.messages-unread {
	display: inline-block; background: #fc3939; color: #fff; padding: 0.2rem 0.6rem; border-radius: 999px;
	margin-left: 0.6rem !important;
}

#sidebar ul li a:hover {
    color: #4483e9; background: #fff; text-decoration: none;
}

#sidebar ul li.active > a, a[aria-expanded="true"] {
    color: #fff; background: #0443a9;
}

#sidebar ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #0443a9;
}

#sidebar ul li img {
    height: 24px; vertical-align: middle; margin-right: 4px;
}

#sidebar > div > button > i {
	color: #fff; margin-right: 10px;
}

.navbar > button {
	font-weight: normal;
}

.navbar > button > i {
	color: #fff; margin-right: 10px;
}

/* *** */
.dialog {
	display: block; position: fixed; right: 0; top: 0px; height: 100%; width: 100%; overflow-y: hidden; z-index: 9900; pointer-events: none;
	background: rgba(0,0,0,0.0);
}

.dialog.visible {
	display: block;
	background: rgba(0,0,0,0.9);
}

.dialog > .container-fluid, .dialog > .container-fluid > .row {
    height: 100%; padding: 0;
}

.dialog > .container-fluid > .row > .dialog-content {
    width: 100%; height: 100%; padding: 24px 16px; overflow-y: auto; scrollbar-width: thin; background: #fff; box-sizing: border-box; box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.5);
	pointer-events: all;
}

.dialog .form {
	padding-bottom: 32px;
}

.dialog > .container-fluid > .row > .dialog-content {
    transform-style: preserve-3d;
    transform-origin: 50% 50%;
    transform: perspective(1500px) scaleX(0.1) rotateX(90deg);
    transition: all 0.25s;
}

.dialog.visible > .container-fluid > .row > .dialog-content {
    transform: perspective(1500px) scaleX(1) rotateX(0deg);
    transition: all 0.25s;
}

.dialog {
    transition: background-color 0.4s;
}

.dialog.visible {
    transition: background-color 0.4s;
}

.dialog h4 {
    display: block;
    background: #2463c9; color: #fff;
    margin: -24px -16px 24px -16px !important;
    padding: 24px 16px 24px 32px !important;
}

.dialog h4 a {
	float: right; font-weight: bold; font-size: 1.5em; padding: 0 16px; margin-top: -6px; border-radius: 3px;
	text-decoration: none;
	color: #fff;
}

.dialog h4 a:hover {
	background: #4483e9; cursor: pointer; color: #fff;
	text-decoration: none;
}

/* *** */
.green1, .green0, .red1, .red0 {
	padding: 4px 1px 2px 4px; border-radius: 3px;
	color: #555;
}

.green1:hover, .green0:hover, .red1:hover, .red0:hover {
    color: #fff; cursor: pointer;
}

.green1 { color: #080; }
.green1:hover, .green0:hover { background: #080; }

.red1 { color: #a00; } 
.red1:hover, .red0:hover { background: #800; }

/* *** */
.schedule {
	font-size: 1em; line-height: 1em;
}

.schedule .cell {
	border-bottom: 1px solid #ddd; padding-top: 6px;
}

.schedule .cell.left-border {
	border-left: 1px solid #ddd;
}

.schedule .cell.th {
	padding: 8px 0; font-weight: 400; font-size: 0.8em; text-transform: uppercase;
}

.schedule .cell.th2 {
	padding: 13px 0 0 0;
}

.schedule .cell.td {
	padding: 0; font-size: 0.9em; line-height: 1em;
}

.schedule .d-flex.hoverable:hover {
	background: #f7f7f7;
}

.schedule .cell.hoverable:hover {
	background: #ddd !important;
}

.schedule .cell.hoverable.selected_start {
	background: #07d;
}

.schedule .cell.hoverable.selected {
	background: #0d7;
}

.schedule .cell.hoverable.booked {
	background: #c33;
}

.schedule .icon-left, .schedule .icon-right {
    display: inline-block; background: #ddd; padding: 7px 10px 6px 10px;
    border-radius: 3px; line-height: 0;
}

.schedule .icon-left:hover, .schedule .icon-right:hover {
    background: #aaa; cursor: pointer;
}

/* *** */
.cropper {
    position: fixed; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; z-index: 9999;
}

.cropper > div.btn {
    position: absolute; top: 12px; right: 50%; z-index: 9999;
    margin-right: -85px; padding: 8px 32px;
    margin-top: 35px; 
}

.cropper > div.btn-success {
    margin-top: 35px; 
    margin-right: 15px;
}

/* **** */
.steps {
    text-align: center; font-size: 1.2em; display: flex; margin-bottom: 48px;
}

.steps > em, .steps > b {
    flex: 1 1 0; align-self: start; font-style: normal; font-weight: 300;
}

.steps > * > em {
    display: inline-block; font-style: normal; background: #09f; color: #fff; padding: 2px 6px; border-radius: 999px;
}

.steps > * > span {
    display: block; margin-top: 8px;
}

.steps > b > span {
    font-weight: 500; color: #09f;
}

.steps > b > em {
    margin-top: -12px; margin-bottom: 12px; transform: scale(1.5);
}

.steps > i {
    font-size: 3em; font-style: normal; padding: 0 10px; align-self: center; flex: 0 0 auto;
}

/* **** */
.lcard {
    border: none;
}

.lcard > b {
    background: linear-gradient(#0c8,#0a6); color: #fff; padding: 8px 0;
    text-align: center;
    border-radius: 5px; margin-bottom: 12px;
    font-size: 1.3em; line-height: 1.5em;
	position: relative;
	cursor: pointer;
}

.lcard > b:hover {
    background: linear-gradient(#0a6,#084);
}

.lcard > b > i {
    background: #fff; color: #0a6;
    border-radius: 999px;
    padding: 4px 2px 0 5px;
    display: none;
    position: absolute; top: -8px; left: -8px;
    box-shadow: 0px 0px 12px -4px #000;
}

.lcard.selected > b {
	background: linear-gradient(#0a6,#084);
}

.lcard.selected > b > i {
	display: inline-block;
}

.lcard > em {
    position: absolute; right: -6px; top: -8px;
    background: linear-gradient(#ea6,#c84); color: #fff; font-style: normal;
    padding: 4px 24px;
    border-radius: 999px;
    transform: rotate(15deg);
    box-shadow: 0px 0px 12px -4px #000;
}

.lcard > div {
    background: #7ac;
    display: flex;
    color: #fff;
    border-radius: 999px;
    margin-bottom: 3px;
    font-size: 1.1em;
    padding: 8px 0;
}

.lcard > div > b {
    flex: 1 1 0; text-align: right;
}

.lcard > div > span {
    flex: 1 1 0; text-align: center;
}

/* ******* */
.checkbox {
    cursor: pointer;
}

.checkbox > svg {
    display: none;
}

.checked0-hidden:not(.checked1) {
	display: none !important;
}

.checkbox > .unchecked {
    display: inline-block; vertical-align: middle;
}

.checkbox.checked1 > .checked {
    display: inline-block; vertical-align: middle;
}

.checkbox.checked1 > .unchecked {
    display: none;
}

.checkbox > span {
    vertical-align: middle; margin-left: 8px;
}

.checkbox.checkbox-small > svg {
    width: 18px; margin-right: 6px;
}

/* **** */
.tabs-fade > div {
	display: none !important; height: 0;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.tabs-fade > div.active {
	display: block !important; height: auto;
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

.tabs-fade > div.inactive {
	display: block !important; height: auto;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* **** */
.btn-favorited {
    position: absolute; right: 8px; top: 0; font-size: 1.0em; text-transform: uppercase; font-weight: 700; color: #999; z-index: 1;
}

.btn-favorited:hover {
    cursor: pointer; color: #555;
}

.btn-favorited.active {
    color: #c00;
}

/* **** */
.btn-blocked {
    position: absolute; left: 8px; top: 0; font-size: 1.0em; text-transform: uppercase; font-weight: 700; color: #999; z-index: 1;
}

.btn-blocked:hover {
    cursor: pointer; color: #555;
}

.btn-blocked.active {
    color: #00c;
}

/* *** */
.info-card {
    border: 1px solid #bbb; padding: 10px 24px; box-shadow: 0px 4px 8px -6px #000; border-radius: 9px;
}

/* *** */
.balance {
    display: block; margin-top: 24px; padding-left: 24px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.1);
}

.balance > span {
    display: block; font-size: 1.4em; margin-top: 4px;
}

/* *** */
.status-button {
    display: inline-block; font-size: 0; line-height: 0; vertical-align: middle;
    border-radius: 999px; padding: 5px; margin-top: -3px;
}

.status-button:hover {
    cursor: help;
}

/* ******* */

:root {
	--gray-offset: rgba(0, 0, 0, 0.03);
	--gray-border: rgba(0, 0, 0, 0.15);
	--gray-light: rgba(0, 0, 0, 0.4);
	--gray-mid: rgba(0, 0, 0, 0.7);
	--gray-dark: rgba(0, 0, 0, 0.9);
	--green-light: #E0F2F1;
	--green-mid: #009688;
	--green-dark: #00766C;
	--body-color: var(--gray-mid);
	--headline-color: var(--gray-dark);
	--accent-color: #0066f0;
	--radius: 6px;
}

.sr-root {
	display: flex; flex-direction: column; justify-content: flex-start; width: 100%; min-width: 320px; height: auto; min-height: 100vh; padding: 48px 20px;
}

.sr-header {
	margin-top: 64px; margin-bottom: 32px;
}

.sr-payment-summary {
	margin-bottom: 20px; text-align: center;
}

.sr-main, .sr-content {
	display: flex; flex-direction: column; justify-content: center; height: 100%;
}

.sr-main {
	width: 100%;
}

.sr-content {
	display: none; padding-left: 48px;
}

.sr-header__logo {
	background-image: var(--logo-image); height: 24px; background-position: center; background-size: contain; background-repeat: no-repeat; width: 100%;
}

.sr-field-error {
	color: var(--accent-color); text-align: left; font-size: 13px; line-height: 17px; margin-top: 12px;
}

.sr-form-row {
	margin: 16px 0;
}

.sr-input, .sr-select, .sr-payment-form input[type="text"], .sr-payment-form input[type="number"] {
	border: 1px solid var(--gray-border); border-radius: var(--radius); padding: 5px 12px; height: 44px; width: 100%; transition: box-shadow 0.2s ease; background: white; -moz-appearance: none; -webkit-appearance: none; appearance: none; color: #32325d;
}

.sr-input:focus, .sr-payment-form input[type="text"]:focus, .sr-payment-form button:focus, .focused {
	box-shadow: 0 0 0 1px rgba(50, 151, 211, 0.3), 0 1px 1px 0 rgba(0, 0, 0, 0.07), 0 0 0 4px rgba(50, 151, 211, 0.3); outline: none; z-index: 9;
}

.sr-input::placeholder, .sr-payment-form input[type="text"]::placeholder, .sr-payment-form input[type="number"]::placeholder {
	color: var(--gray-light);
}

.sr-card-element {
	padding-top: 12px;
}

.sr-payment-form input[autocomplete="cc-name"] {
    font-size: 1.2em !important;
}

.sr-price {
    display: block; text-align: center; font-size: 2em; line-height: 1em; margin: 20px 0; font-weight: bold;
}

.sr-price.hidden {
	display: none !important;
}

.sr-price:before {
    content: "Amount to be billed:"; font-size: 0.5em; display: block; font-weight: 300;
}

/* ***** */
.cc-elem {
    display: inline-block; width: 300px; height: 150px; color: #fff; margin: 10px 0; border-radius: 5px; position: relative; background: linear-gradient(#35c,#24a); box-shadow: 0px 4px 8px rgba(0,0,0,0.4);
}

.cc-elem .cc-number {
    position: absolute; left: 24px; top: 50px; font-size: 1.3em; font-family: monospace !important; font-weight: bold; text-shadow: 0 2px 3px rgba(0,0,0,0.5);
}

.cc-elem .cc-exp {
    position: absolute; left: 24px; bottom: 20px; font-size: 1.2em; font-family: monospace !important; font-weight: bold; padding-left: 30px; text-shadow: 0 2px 3px rgba(0,0,0,0.5);
}

.cc-elem .cc-exp:before {
    content: "GOOD"; font-size: 0.5em; position: absolute; left: 0; top: -4px; font-weight: normal; text-shadow: none;
}

.cc-elem .cc-exp:after {
    content: "THRU"; font-size: 0.5em; position: absolute; left: 0; top: 4px; font-weight: normal; text-shadow: none;
}

.cc-elem .cc-logo {
    position: absolute; right: 12px; bottom: 12px; background-size: 100% 100%; width: 61px; height: 38px;
}

.cc-elem .cc-delete {
    position: absolute; right: -10px; top: -10px; background: #c00; color: #fff; border-radius: 999px; padding: 8px 5px 6px 7px; box-shadow: 0px 2px 8px rgba(0,0,0,0.7);
}

.cc-elem .cc-delete:hover {
    background: #f00; cursor: pointer;
}

.cc-elem .cc-favorite {
    position: absolute; left: 4px; top: 4px; background: none; color: #fff; border-radius: 999px; padding: 6px 4px 6px 7px; font-size: 1.5em; opacity: 0.3;
}

.cc-elem .cc-favorite:hover {
    color: #ff0; cursor: pointer; opacity: 1;
}

.cc-fav-1 .cc-favorite {
	color: #ff0 !important; opacity: 1;
}

.cc-elem.cc-visa .cc-logo { background-image: url(../img/card-visa.png); font-size: 0; }
.cc-elem.cc-visa { background: linear-gradient(#404aca, #000a8a); }

.cc-elem.cc-mastercard .cc-logo { background-image: url(../img/card-mastercard.png); font-size: 0; }
.cc-elem.cc-mastercard { background: linear-gradient(#555, #333); }

.cc-elem.cc-amex .cc-logo { background-image: url(../img/card-amex.png); font-size: 0; }
.cc-elem.cc-amex { background: linear-gradient(#0080cf, #00509f); }

.cc-elem.cc-discover .cc-logo { background-image: url(../img/card-discover.png); font-size: 0; }
.cc-elem.cc-discover { background: linear-gradient(#dc3600, #ac1602); }

.cc-elem.cc-diners .cc-logo { background-image: url(../img/card-diners.png); font-size: 0; }
.cc-elem.cc-diners { background: linear-gradient(#a3a5c9, #636589); }

.cc-elem.cc-credit .cc-logo { background-image: url(../img/card-credit.png); font-size: 0; }
.cc-elem.cc-credit { background: linear-gradient(#333, #111); }

/* *** */
.rating-info {
    display: block; border: 1px solid #ddd; text-align: left; width: 100%; box-sizing: border-box; margin-bottom: 12px;
    box-shadow: 0px 0px 8px -4px rgba(0,0,0,0.5);
    padding: 12px;
    border-radius: 9px;
}

.rating-info > b {
    display: block; font-weight: 300; margin-bottom: 2px; font-size: 0.8em;
}

.rating-info > span {
    display: block; width: 120px; height: 24px; position: relative; margin: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='lightgray' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");
}

.rating-info > span > span {
    width: 120px; height: 24px; position: absolute; left: 0; top: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='orange' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");
}

.rating-info > p {
    font-size: 0.8em; font-style: italic; margin: 8px 0 0 0;
    border-left: 4px solid #ddd; padding: 4px;
}

.rating-score {
    display: inline-block; width: 120px; height: 24px; position: relative; margin: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='lightgray' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");
}

.rating-score > span {
    width: 120px; height: 24px; position: absolute; left: 0; top: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='orange' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");
}

.rating-score.small {
    width: 80px; height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgray' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");
}

.rating-score.small > span {
    width: 80px; height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='orange' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");
}

/* *** */
tr.interest_status_1 > td {
    background: #dfd;
}

tr.interest_status_2 > td {
    opacity: 0.4;
}

/* *** */
tr.request_status_3 td {
	opacity: 0.7; background: rgba(128,128,128,0.2);
}

tr.request_status_3 .status-button, tr.request_status_3 .status-label {
    display: none;
}

tr.request_status_0 td {
	background: rgba(255,128,128,0.05);
}

tr.pending_request_status_2 td {
	opacity: 0.7; background: rgba(255,128,128,0.2) !important;
}

tr.pending_request_status_1 td {
	opacity: 0.7; background: rgba(128,255,128,0.2) !important;
}

tr.request_status_5 td {
	background: rgba(0,128,255,0.05);
}

/* *** */
.card-b {
    font-size: 1.1em; line-height: 1.5em;
}

.shadowy {
    box-shadow: 0px 0px 24px rgba(0,0,0,0.15); border-radius: 9px;
}

/* *** */
.request_card {
	background: #fff; padding: 12px; border-radius: 9px; font-size: 1.2em;
    box-shadow: 0px 0px 16px rgba(0,0,0,0.2);
}

.request_card > .badge {
    background: #ddd;
}

.request_card .x-info {
    font-size: 0.7em;
}

.request_card .x-sitter {
    background: #f7f7f7; border-radius: 9px; padding: 8px 12px;
}

.request_card .x-family {
    background: #f7f7f7; border-radius: 9px; padding: 8px 12px;
}

.request_card .x-family > em {
    float: right; font-style: normal; margin-top: 16px;
}

.request_card .x-sitter:hover {
    box-shadow: 0px 0px 16px rgba(0,0,0,0.2); cursor: pointer;
}

.request_card .x-family:not(.static):hover {
    box-shadow: 0px 0px 16px rgba(0,0,0,0.2); cursor: pointer;
}

/* *** */
.message_card {
    background: #fff; margin: 8px 0; padding: 12px; border-radius: 9px;
    border: 1px solid #ddd;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
}

.message_card.thread {
    cursor: pointer;
}

.message_card.thread:hover {
    box-shadow: 0px 0px 24px rgba(0,0,0,0.2);
}

.message_card > b {
    float: left;
}

.message_card > b > div:last-child {
    margin-left: -20px;
}

.message_card > i {
    float: left; font-style: normal; font-weight: 700; margin-top: 6px; margin-left: 12px;
}

.message_card > i > span {
    display: block; font-size: 0.8em; color: #444;
}

.message_card > em {
    clear: both; display: block; color: #000; margin-top: 56px; font-style: normal; margin-left: 106px; line-height: 1.4em;
}

.message_card.s_0 * {
    font-weight: bold; color: #6324c9;
}

/* *** */
.password-group {
    position: relative;
}

.password-group input {
    padding-right: 32px;
}

.password-group i {
    position: absolute; padding: 6px 8px; right: 8px; top: 1.4rem; font-size: 1.4em; cursor: pointer;
}

.password-group i:hover {
    color: #2463c9;
}

.password-group.alt input {
    padding-right: 38px;
}

.password-group.alt i {
    position: absolute; padding: 6px 4px; right: 0; top: 24px; font-size: 1.4em; cursor: pointer;
}

/* *** */
label.x-required:after {
    content: '*'; color: #f00; margin-left: 6px;
}

/* *** */
.sitter-card {
	border: none; padding: 8px !important; border-radius: 5px;
  	box-shadow: 0 0 16px -8px rgba(0,0,0,0.5);
}

.sitter-card:hover {
	cursor: pointer; box-shadow: 0 0 16px -4px rgba(0,0,0,0.5);
}

.sitter-card > span {
	float: left; padding: 8px; margin-right: 6px; margin-top: 2px; cursor: pointer; border-radius: 999px;
    transition: background-color 0.25s ease;
}

.sitter-card > span:hover {
    background: #ddd;
}

.sitter-card > div > b {
	display: block; margin-top: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.sitter-card > div > em {
	display: block; font-style: normal; color: #888; font-size: 0.9em;
}

.sitter-card > div > i {
	display: block; font-style: normal; font-size: 0.8em;
}

/** ***** */
span.circle { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 999px; }

span.circle-0 { background: #383; }
span.circle-1 { background: #c33; }
span.circle-2 { background: #ccc; }

/** ***** */
.is_summable_0 td *, .is_summable_0 td {
	color: #999 !important;
}

#air-datepicker-global-container {
    z-index: 99999 !important;
}

.header-text > span {
    display: none !important;
}

/* *** */
.btn-secondary.border-0 {
    background: #fff !important; color: #444 !important; border: none !important;
}

.btn-secondary.border-0:hover {
    background: #eee !important; color: #333 !important;
} 

/* *** */
.dialog-fixed-top .modal-dialog {
    margin-top: 0px !important;
    top: 12vh !important;
}
