.settings {
	color: inherit;
	height: auto;
	margin-top: 0px;
	padding:0px;
	transform-origin: 0% 0%;
	transition: all 0.2s ease-in;
}

.push {
	margin-top: -432px;
	transition: all 0.2s ease-in;
}

.settings-show {
	animation: late-show 0.3s linear;
	animation-fill-mode: forwards;
	
	/*opacity: 1;*/
	visibility: visible;
	margin-top: 0px;
	transform: scale(1,1);
	transition: all 0.2s ease-out;
}

.settings-hide {
	animation: late-show-rev 0.3s linear;
	animation-fill-mode: forwards;
	transform: scale(1,0);
	visibility: collapse;
}

.spinner-settings {
	visibility: collapse;
}

.config_notify {
	color: rgba(73, 197, 73, 0.0);
	visibility: collapse;
	transition: all 0.1s ease-out;
}

.config_notify_success {
	color: rgb(73, 197, 73);
}

.config_notify_pending {
	color: rgb(183, 32, 12);
}

.show {
	visibility: visible;
}

.bi {
	vertical-align: -.125em;
	fill: currentColor;
}

.ni {
	fill: currentColor;
}

.themed-grid-col {
	padding-top: .75rem;
	padding-bottom: .75rem;
	background-color: rgba(86, 61, 124, .15);
	border: 1px solid rgba(86, 61, 124, .2);
}

.themed-grid-col-light {
	padding-top: .75rem;
	padding-bottom: .75rem;
	background-color: rgba(155, 134, 185, 0.15);
	border: 1px solid rgba(155, 134, 185, .2);
}

.themed-container {
	padding: .75rem;
	margin-bottom: 1.5rem;
	background-color: rgba(0, 123, 255, .15);
	border: 1px solid rgba(0, 123, 255, .2);
}

.role-decoration-deactivated {
	color: rgb(102, 102, 102);
	background-color: rgb(146, 146, 146);
	padding:6px;
	border-radius:8px;
}

.role-decoration-client {
	color: rgb(238, 222, 201);
	background-color: rgb(54, 113, 161);
	padding:6px;
	border-radius:8px;
}

.role-decoration-personal-trainer {
	color: rgb(0,0,0);
	background-color: rgb(218, 179, 53);
	padding:6px;
	border-radius:8px;
}

.role-decoration-administrator {
	color: rgb(241, 177, 73);
	background-color: #358597;
	padding:6px;
	border-radius:8px;
}

.alert-animated {
	transition: all 0.5s ease-in-out;
	width:fit-content;
	max-width: 100%;
	margin-left:auto !important;
	margin-right:auto !important;
}

#alert_well {
	pointer-events:none;
	position: fixed;
	left:0;
	right:0;
	top:10rem;
	width:auto;
	z-index: 50;
}

.alert {
	margin-left: auto !important;
	margin-right: auto !important;
	box-shadow: 0px 5px 30px 10px #4b4b4f3c;
	pointer-events:auto;
}

.fade-margins {
	opacity:0%;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}

body {
	position:relative;
	min-height:100%;
}

.footer {
	margin-top: auto !important;
}

.footer a {
	color: rgba(255, 255, 255, 0.5);
}

.btn-url {
	color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-url:hover {
	color: #fff;
  background-color: #5c636a;
  border-color: #565e64;
}

.btn-url:focus {
  color: #fff;
  background-color: #5c636a;
  border-color: #565e64;
  box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
}

.btn-url:after {
	content: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-box-arrow-up-right" viewBox="0 0 16 16">  <path fill-rule="evenodd" d="M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z"/>  <path fill-rule="evenodd" d="M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z"/></svg>');
	margin: auto 3px;
}

.consent {
	z-index: 1065;
	background: var(--bs-light);
	height: auto;
	text-align:center;
	padding: 0.5rem;
	box-shadow: 0px 0px 80px rgba(3, 6, 20, 0.7);
	border-color: rgba(7, 25, 82, 0.6);
	border-radius: 6px 6px 0px 0px;
	border-width: 2px 2px 0px;
	border-style: solid;
	margin-bottom: 2px;
}

.nav-top {
	padding: 0.5rem 1rem;
	height: 6rem;
}

.nav-img {
	width: 24px;
	height: 24px;
}

.nav-entry {
	align-items:center;
	display:flex;
	height: 100%;
}

.nav-color {
	color: inherit;
}
.nav-color:hover {
	color: inherit;
}

.nav-badge {
	line-height: 24px;
	width: 24px;
	height:auto;
	position: relative;
	margin-top: -70%;
	margin-left:auto;
	margin-right: 10%;
	background-color: #f00;
	color: #fff;
	border-radius: 0.5rem;
	text-align: center;
	overflow:hidden;
	animation: pulse-in 0.3s ease-in-out;
	animation-fill-mode: forwards;
}

@media (max-width: 515px) {
	.nav-top {
		padding: 0.4rem 0.3rem;
		font-size: 14px;
		height: 5rem;
	}
}

@media (max-width: 400px) {
	.nav-top {
		padding: 0.25rem 0.25rem;
		margin: auto;
		font-size: 12px;
		height: 4rem;
	}
	
	.nav-image {
		width: 18px;
		height: 18px;
	}
}

.consent-size {
	width: 100%;

	opacity: 0;
	bottom: 16px !important;
	visibility: hidden;
}

@media (min-width: 600px) {
	.consent-size {
		width: 600px !important;
	}
}

.consent p {
	margin:0;
	padding:0;
}

.consent-show {
	opacity: 1;
	bottom: 0px !important;
	visibility: visible;
}

.consent-anim {
	transition: opacity 0.5s ease-out, bottom 0.5s ease-out, visibility 0.5s linear;
}

.small-gutter {
	--bs-gutter-x: 1.0rem;
}

@media (max-width: 600px) {
	.small-gutter {
		--bs-gutter-x: 0.3rem;
	}
}

.btn-remove {
	padding: 0.25rem;
	margin: 0.25rem;
	background-color: transparent;
	color: var(--bs-dark);
	transition: all 0.15s ease-in-out;
	border-radius: 0.25rem !important;
}

.btn-remove:hover {
	background-color: #f00;
	color: #fff;
}

.group-bind {
	margin:0px !important;
	padding:0.25rem;
	border-radius: 0.25rem;
	transition: all 0.15s ease-in-out;
}

.group-bind:hover {
	background-color: rgb(242, 216, 175);
}

.pulse {
	transition: all 0.3s ease-in-out;
}

.pulse:hover {
	animation: pulse 0.3s ease-in-out;
	animation-fill-mode: forwards;
}

@keyframes pulse {
	0% {scale: 1; color: #000}
	50% {scale: 1.2; color: #444}
	100% {scale: 1.1; color: #000}
}

@keyframes late-show{
	0% {opacity: 0}
	80% {opacity: 0}
	100% {opacity: 1}
}

@keyframes late-show-rev{
	0% {opacity: 1}
	20% {opacity: 0}
	100% {opacity: 0}
}

@keyframes pulse-in {
	0% {scale:0} 50% {scale:1.1} 100%{scale:1}
}

@keyframes opacity-in {
	0% {opacity:0} 100%{opacity:1}
}
@keyframes pulse-bounce {
	0% {scale:1} 100% {scale:1.05}
}

.maintenance {
	background-color: rgb(216, 72, 37);
	padding: 0.25rem;
	color: #fff;
	text-align: center;
}

.tag {
	color: #EFEFEF;
	border-radius: 5rem;
	padding: 0.25rem 0.75rem;
	box-shadow: 0 0 0 1px #58585833, 0 0 0 3px;
	margin: 0.25rem 0;
}

.tag+.tag {
	margin-left: 0.25rem;
}

.tag:hover {
	color: #ffffd4;
}

.tagcounter {
	margin-left: 0.25rem;
}

.tagcounter:empty {
	display:none
}

.tagcounter:before {
	content: '('
}

.tagcounter:after {
	content: ')'
}

.tag-hollow {
	color: #303030;
	box-shadow: 0 0 16px 16px #58585866 inset;
}

.slot-cancelled {
	background-color: rgba(98, 0, 0, 0.089);
}
.slot-cancelled:before {
	content: '(Cancelled)';
}

.slot-state-cancelled {
	background-color: #f00;
}
.slot-state-cancelled:before {
	content: 'Cancelled';
}

.slot-state-confirmed {
	background-color: rgb(36, 202, 44);
}
.slot-state-confirmed:before {
	content: 'Confirmed';
}

.slot-state-expired {
	background-color: rgb(123, 123, 123);
}
.slot-state-expired:before {
	content: 'Expired';
}

.type-hidden {
	max-height: 0.5rem;
	overflow:hidden;
	transition: max-height 0.5s ease-out, background-color 0.5s ease-out;
	background-color: #e0dbdb !important;
}

.type-hidden-displayed {
	background-color: #fff !important;
}

.type-shadow {
	box-shadow: 0px 0px 2px 2px #0004;
	overflow:hidden;
}

.accordion-input:checked {
	~ .accordion-content {
		max-height: 5rem;
		padding-top: 0px !important;
		padding-bottom: 0px !important;
	};
	~ .accordion-checked {
		display:inherit
	};
	~.accordion-unchecked {
		display:none
	};
}

.accordion-checked {
	display:none;
}
.accordion-unchecked {
	display:inherit;
}

.accordion-content {
	max-height: 0rem;
	overflow:hidden;
	padding-top:-20px;
	padding-bottom:-20px;
	transition: all 0.35s;
}


.not-modal {
	opacity: 1;
	animation: opacity-in 0.35s linear;
	animation-fill-mode: none;

	position: fixed;
	left:0;right:0;bottom:0;top:0;
	z-index: 800;
}

.not-modal > *, .not-modal > * > *, .not-modal > * > * > * {
	z-index: inherit;
}

.not-modal-backdrop {
	opacity: 0.5;
	background-color: #000;

	position: fixed;
	left:0;right:0;bottom:0;top:0;
}

.not-contents-anim {
	animation: 0.15s ease-in-out 0.2s 2 alternate pulse-bounce;
	animation-fill-mode: none;
	position:relative;
	width: 70%;
	top: 5%;
	max-height: 90%;
	margin:auto;
}

@media (max-width: 515px) {
	.not-contents-anim {
		width: 85%;
	}
}

@media (max-width: 400px) {
	.not-contents-anim {
		width: 95%;
	}
}

.not-modal-content {
	border-radius: 0.25rem;
	background-color: #fff;
	position: static;
	width: 100%;
	max-height: 90vh;
	overflow:auto;
	padding: 0.5rem;
	margin-top: -1.5rem;
}

.not-modal-content > .row {
	padding: 0.125rem 0.125rem;
	border-bottom: 1px solid #c7c7c7;
	margin:0;
}

.not-div {
	font-weight: bold;
}

.not-read {
	background-color: #fbfbfb;
}

.not-read:hover {
	background-color: #fafaff;
}

.not-unread {
	background-color: #f1f1f1;
}

.not-unread:hover {
	background-color: #f0f0ff;
}

.not-topic {
	font-weight: bold;
}

.not-content {
	
}

.not-ts {
	font-size: 80%;
}

.not-actions {
	padding:0;
	margin:0;
}

.not-actions > a {
	border: 1px solid #000;
}

.not-action {
	text-align: center;
	margin-top: 0.25rem;
	margin-left: 1rem;
	margin-right: 1rem;
	border-style:solid;
	border-color: #d3d3d3;
	border-width: 1px;
	border-radius: 1rem;
	color: #fff;
	align-items:center;
	display:grid;
}

.not-unread > .not-topic:before {
	content: '\25CF';
	color:rgb(241, 177, 73);
	text-shadow: 1px 1px 2px #000a;
	padding-right: 0.5rem;
}

.not-close {
	position:relative;
	text-align:right;
	height:0; overflow:visible;
}

.opacity-0 {
	transition: opacity 0.35s;
	opacity: 0;
	pointer-events: none;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

.hide-interacted {
	opacity: 0.0;
}

.view-interacted {
	opacity: 1.0;
}

.anim-opacity {
	transition: opacity 0.15s;
}

@media (prefers-reduced-motion: reduce) {
	.anim-opacity {
		transition: none;
	}
}