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


/* Elements */

:root {
	--primary-font: 'Poppins', Arial, "sans-serif";
}

@media screen and (min-height: 501px) and (orientation:landscape)  {
  body, button, html, input, select, textarea {
      font-size: calc(1vh + 10px);
  }
}

@media screen and (min-width: 501px) and (orientation:portrait) {
	body, button, html, input, select, textarea {
    	font-size: calc(1vw + 10px);
    }
}

@media screen and (max-width: 500px), (max-height: 500px) {
	body, button, html, input, select, textarea {
    	font-size: 13px;
    }
}

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

a {
	color: inherit;
	text-decoration: none;
}

a.anchor {
    display: block;
    position: relative;
    top: -134px;
    visibility: hidden;
}

body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

body, button, html, input, select, textarea {
	color: #444;
	font-family: var(--primary-font);
}

body.popup-open {
	/*overflow: hidden;*/
	position: fixed;
}

body.preload * {
	transition: none !important;
	-webkit-transition: none !important;
	-moz-transition: none !important;
	-ms-transition: none !important;
	-o-transition: none !important;
}

button {
	border: none;
}

button .material-symbols-outlined {
	font-size: inherit !important;
}

h2 {
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}

img.round {
	border-radius: 50%;
}

input, select, textarea, button, .selectify {
	background-color: white;
	border-radius: 10px;
	color: #333;
	margin: 5px 0px;
	outline: none;
	padding: 15px;
}

input, select, textarea, .selectify {
	border: solid 1px gainsboro;
}

input:not([type=image]):not([type=range]):not([type=submit]):not(.no-focus):disabled, select:disabled {
	background-color: #f8f8fa;
	color: darkgray;
	cursor: default;
}

input[type=submit]:disabled, button:disabled {
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
}

input:not([type=checkbox]):not([readonly]):focus, select:focus, textarea:focus, .text-textarea:focus {
	background-color: #fcfcfc;
	border-color: rgba(0, 99, 191, .3);
	box-shadow: 0 0 5px #0063bf;
}

input::placeholder, textarea::placeholder {
	color: #bbb;
	font-style: italic;
}

input::-webkit-calendar-picker-indicator {
	display: none;
}

input[type=checkbox] {
	align-items: center;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    padding: 1px;
}

input[type=checkbox]:checked {
	background-color: #06e;
}

input[type=checkbox]::before {
	background-color: #fff;
	clip-path: polygon(28% 38%, 41% 53%, 75% 24%, 86% 38%, 40% 78%, 15% 50%);
	content: "";
	height: 14px;
	transform: scale(0);
	transition: 0.4s;
	width: 14px;
}

input[type=checkbox]:checked::before {
	transform: scale(1);
}

input[type=checkbox]:hover {
	color: black;
}

input[type=number] {
	padding-right: 2px;
}

/*input[type=number]::-webkit-inner-spin-button {
	height: 100%;
}*/

input[type=submit], button {
	border-radius: 60px;
	color: white;
}

input, select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}

input[data-date="1"] + input[type=time], input[data-date="1"] + input[data-date="1"] {
	border-bottom-left-radius: 0px;
	border-top-left-radius: 0px;
	border-left: 0px;
	margin-left: -10px;
}

input[data-date="1"]:has(+ input[type=time]), input[data-date="1"]:has(+ input[data-date="1"]) {
	border-bottom-right-radius: 0px;
	border-top-right-radius: 0px;
}

input[type=time] {
	padding-right: 35px;
}

input[data-date="1"], input[type=time] {
	position: relative;
}

input[type=time]:after, input[data-date="1"]:after {
	font-family: "Material symbols outlined";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}

input[type=file], input[type=password], input[type=submit], input[type=search], input[type=text], select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}

input:required[nonvalid], select:required[nonvalid], textarea:required[nonvalid], .selectify[required][nonvalid] {
	border: solid 1px red !important;
}

input:required[nonvalid] + label, select:required[nonvalid] + label, textarea:required[nonvalid] + label {
	color: red !important;
}

input:checked + .slider {
	background-color: #2196F3;
}

input:focus + .slider {
	box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

label[data-type=total] {
	font-weight: bold;
}

p {
	line-height: 1.5;
	margin: 0px;
}

select, .selectify {
	background-image: url(../images/double-arrow.png);
	background-position: right 10px center;
	background-repeat: no-repeat;
	background-size: 20px;
	padding-right: 35px !important;
	position: relative;
}

select::-ms-expand {
    display: none;
}

select.tablet-item, .selectify.tablet-item {
	background-position: right 30px center;
	padding-right: 60px;
}

span.nowrap {
	white-space: nowrap;
}

sup {
	font-size: 70%;
	margin-left: 2px;
	margin-right: 2px;
}

textarea {
	border: solid 1px gainsboro;
	border-radius: 10px;
	margin: 5px 0px;
	min-width: 220px;
	outline: none;
	padding: 10px;
	width: 100%;
}


/* Elements screen size 0px-800px*/

@media screen and (max-width: 920px), screen and (max-height: 550px) {

	a.anchor {
		top: -119px;
	}
	
	button, input, select, textarea, .selectify {
		padding: 10px;
	}
	
	select, .selectify {
		background-size: 7px;
	}
	
	textarea {
		width: calc(100% - 22px);
	}
	
}


/* Classes */

.accordion-container {
	border-bottom: 1px solid #e2e2e2;
	width: 100%;
}

.accordion-container:first-child {
	border-top: 1px solid #e2e2e2;
}

.accordion-header:hover .accordion-header-txt, .accordion-header:hover .accordion-date-txt, .accordion-header:hover .accordion-header-dropdown {
	filter: invert(0.5);
	-webkit-filter: invert(0.5);
}

.accordion-date-txt {
	color: #666;
	font-size: 90%;
}

.accordion-expansion {
	display: none;
	padding: 20px;
}

.accordion-expansion .form-section:first-child {
	border-top: none;
	padding-top: 0px;
}

.accordion-expansion.active {
	display: block;
}

.accordion-header {
	align-items: center;
	cursor: pointer;
	display: flex;
	flex-wrap: nowrap;
	padding: 12px;
}

.accordion-header > * {
	flex: 1;
}

.accordion-header-txt, .accordion-header-dropdown {
	display: inline-block;
	font-weight: bold;
	margin-bottom: 5px;
	text-align: left;
}

.accordion-header-dropdown {
	flex-grow: 0;
}

.accordion-text {
	line-height: 1.5;
	margin-bottom: 20px;
}

.action-btn {
	align-items: center;
	border: #000 solid 3px;
	border-radius: 50%;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,.2);
	color: white;
	cursor: pointer;
	display: flex;
	font-family: arial;
	height: 60px;
	justify-content: center;
	margin: 0px;
	width: 60px;
}

.action-btn:disabled {
	cursor: default;
	filter: grayscale(1) brightness(1.3);
}

.action-btn:focus {
	border-color: #000 !important;
}

.action-btn.add {
	font-size: 80%;
	font-weight: bold;
}

.action-btn.add, .action-btn.copy, .action-btn.save {
	background-image: radial-gradient(circle at 33% 33%, #3dc136, #005500);
}

.action-btn.delete {
	background-image: radial-gradient(circle at 33% 33%, #ff0000, #550000);
}

.action-btn.refresh {
	background-image: radial-gradient(circle at 33% 33%, #4477ff, #071144);
}

.action-btn.save, .action-btn.copy, .action-btn.delete, .action-btn.refresh {
	font-family: "Material symbols outlined";
	font-size: 35px;
}

.action-btn-container {
	padding: 0px 5px;
	transition: 0.7s;
}

.action-btn-container:hover {
	transform: scale(1.2);
}

.action-btn-img {
	height: 40px;
	width: 40px;
}

.action-btn-wrapper {
	align-items: center;
	bottom: 15px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-end;
	margin-left: auto;
	position: sticky;
	position: -webkit-sticky;
	position: -moz-sticky;
	position: -o-sticky;
	width: fit-content;
	z-index: 0;
}

.activity-btn-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.activity-btn-wrapper .btn:first-child {
	margin-left: 0px;
}

.activity-category {
	color: #666;
	font-size: 90%;
	text-transform: uppercase;
}

.activity-container {
	border-bottom: solid 1px #ddd;
	display: flex;
	flex-wrap: nowrap;
	gap: 15px;
	padding: 20px;
}

.activity-container:first-child {
	border-top: solid 1px #ddd;
}

.activity-text {
	align-items: center;
	display: flex;
	font-size: 90%;
}

.activity-text .btn {
	font-size: 95%;
	margin-left: 0px;
}

.activity-text.link {
	cursor: pointer;
	text-decoration: underline;
}

.activity-title {
	font-weight: 500;
}

.age-filter-wrapper {
	width: 159px;
}

.align-center {
	text-align: center !important;
}

.align-content-center {
	margin-left: auto;
	margin-right: auto;
}

.align-justify {
	text-align: justify !important;
}

.align-left {
	text-align: left !important;
}

.align-right {
	text-align: right !important
}

.article-container {
	align-items: stretch;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: center;
}

.article-tile {
	align-self: stretch;
	border: solid 1px #ccc;
	border-radius: 10px;
	height: 100%;
	padding: 30px;
	text-align: center;
}

.article-tile-container {
	cursor: pointer;
	max-width: 300px;
	width: 100%;
}

.article-tile-img {
	font-size: 200%;
}

.article-tile-title {
	font-weight: bold;
	margin-top: 20px;
}

.bold, .bold-text {
	font-weight: bold;
}

.btn {
	align-items: center;
	color: white;
	cursor: pointer;
	display: flex;
	flex-wrap: nowrap;
	gap: 0px 7px;
	justify-content: center;
	margin: 10px;
	padding: 15px 25px;
	min-width: 200px;
}

.btn[disabled] {
	background-color: gainsboro !important;
	cursor: auto;
}

.btn:hover:not([disabled]) {
	filter: brightness(1.15);
}

.btn-icon.spin {
	animation: spin 1.5s linear infinite;
	-webkit-animation: spin 1.5s linear infinite;
}

.btn-icon + span {
	margin-left: 10px;
}

.btn.long {
	min-width: 315px;
}

.btn.medium {
	min-width: 250px;
}

.btn.short {
	min-width: 160px;
}

.btn.small {
    font-size: 85%;
    padding: 10px 20px;
    min-width: 0px;
    width: auto;
}

.btn.ticket-event-btn, .btn.activity-btn {
	font-size: 75%;
	padding: 10px 15px;
	min-width: 0px;
	width: auto;
}

.btn-tab {
	border: none;
	border-radius: 0px;
	color: #fff;
	cursor: pointer;
	padding: 10px;
}

.btn-tab.active {
	filter: brightness(1.2);
}

.btn-tab .material-symbols-outlined {
	font-size: 30px !important;
}

.btn-tab:first-child {
	border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;
}

.btn-tab:hover:not(:disabled) {
	filter: brightness(1.1);
}

.btn-tab:last-child {
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
}

.btn-tab:not(:first-child) {
	border-left: solid 1px #fff;
}

.btn-tab-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	vertical-align: middle;
	width: 100%;
}

.btn-wrapper, .popup-btn-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 10px auto;
	text-align: center;
	width: 100%;
}

.btn-wrapper:not(:first-child) {
	padding-top: 20px;
}

.calendar-cell {
	background-color: #fff;
	border: solid 1px #e2e2e2;
	font-size: 12px;
	height: 70px;
	vertical-align: baseline;
	width: 13.6%;
}

.calendar-day {
	text-align: left;
}

.calendar-time-slot {
	border-radius: 2px;
	color: #fff;
	margin: 2px 0px;
	padding: 4px;
}

.calendar-wrapper {
	overflow-x: auto;
}

.calendar-wrapper.availability .calendar-cell, .calendar-wrapper.availability .calendar-time-slot {
	cursor: pointer;
}

.cart-item-img {
	height: 80px;
	margin-right: 30px;
	object-fit: cover;
	width: 80px;
}

.cart-item-price {
	color: #aa0000;
	font-size: 110%;
	font-weight: bold;
	margin: 5px 0px;
}

.cart-item-quantity {
	font-size: 80%;
}

.cart-item-total {
	color: #aa0000;
	display: inline-block;
	font-size: 120%;
	font-weight: bold;
}

.cart-item-total-text {
	display: inline-block;
	font-size: 120%;
	margin-right: 5px;
}

.cart-item-wrapper {
	border-bottom: solid 1px lightgray;
	display: flex;
	flex-wrap: nowrap;
	padding: 20px 0px;
}

.cart-text-wrapper {
	width: 100%;
}

.cart-wrapper {
	border-top: solid 1px #bbb;
}

.check {
	margin: 15px 0px;
	width: auto;
}

.check-option {
	margin-right: 15px;
	width: auto;
}

.check-text {
	display: inline-block;
	font-size: 80%;
	padding: 5px 0px;
}

.comment-tag {
	align-items: center;
	color: #0066cc;
	cursor: pointer;
	display: flex;
	gap: 5px;
	padding: 3px 0px;
	width: 100%;
}

.comment-tag-container {
	padding: 10px 0px;
}

.comment-tag-title {
	font-weight: bold;
	padding-bottom: 5px;
}

.confirmation-data {
	border: solid 1px gainsboro;
	border-radius: 5px;
	display: none;
}

@media screen and (min-width: 501px) {

	.connect > *:not(label):not(.tooltip), .connect-element {
		border-radius: 0px;
	}

	.connect > .first, .connect-element.first {
		border-top-left-radius: 10px !important;
		border-bottom-left-radius: 10px !important;
	}

	.connect > .last, .connect-element.last {
		border-top-right-radius: 10px !important;
		border-bottom-right-radius: 10px !important;
	}

	.connect > *:not(label):not(.first):not(.tooltip), .connect-element:not(.first) {
		border-left: none;
	}
	
	.form-input-wrapper.connect > *:not(label):not(.first):not(.tooltip), .connect-element:not(.first) {
		margin-left: -10px;
	}
	
	.report-filters-section.connect > *:not(label):not(.first):not(.tooltip) {
		margin-left: -5px;
	}

}

.content-flex-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 40px 20px;
    justify-content: space-evenly;
    margin-top: 50px;
}

.context {
	background-color: #fff; 
	border-radius: 10px;
	box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, .2); 
	position: absolute;
	z-index: 999;
}

.context-item {
	align-items: center;
	color: #555;
	cursor: pointer;
	display: flex;
	font-size: 14px;
	gap: 5px;
	padding: 5px 15px;
}

.context-item:hover {
	background-color: #e6e6e6;
}

.context-wrapper {
	padding: 10px 0px;
}

.cursor-move {
	cursor: move;
}

.dash {
	padding: 20px;
}

.dash-select {
	border: solid 1px gainsboro;
	border-radius: 3px;
	display: inline-block;
	font-size: 12px;
	margin: 2px;
	max-width: 125px;
	outline: none;
	padding: 5px 15px 5px 5px;
}

.dash-tile {
	background-color: #fff;
	border-radius: 5px;
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .2);
	height: 100%;
	padding: 30px;
	position: relative;
	text-align: center;
}

.dash-tile .close-tile {
	display: none;
}

.dash-tile.move {
	cursor: move;
}

.dash-tile.move .close-tile {
	display: block;
}

.dash-tile-container {
	margin: 10px 0px;
	max-width: 330px;
	padding: 0px 10px;
	width: 100%;
}

@media screen and (min-width: 550px) and (max-width: 1000px) {
	.dash-tile-container {
		width: 50%;
	}
}

.dash-tile-container.full {
	width: 100%;
}

.dash-tile-data, .dash-tile-text {
	margin-bottom: 20px;
}

.dash-tile-data {
	font-size: 250%;
}

.dash-tile-link {
	color: #0066cc;
	cursor: pointer;
	font-size: 90%;
	text-decoration: underline;
}

.dash-tile-text {
	font-size: 150%;
}

.dash-tile-text.small {
	font-size: 90%;
}

.dash-tile-title {
	font-size: 120%;
	line-height: 1.2;
	margin-bottom: 20px;
	text-transform: uppercase;
}

.dash-tiles-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.dataTableHead {
	background-color: #eeeeee;
}

.delete-btn {
	background-color: #dd0000 !important;
}

.deny-btn {
	border-radius: 2px;
	color: #fff;
	padding: 5px 10px;
	text-align: center;
	white-space: nowrap;
}

.div-btn {
	background-color: white;
	border: solid 1px gainsboro;
	border-radius: 5px;
	margin: 5px 0px;
	outline: none;
	padding: 10px;
}

.doc-input {
	box-sizing: border-box;
	width: 100%;
}

.documentation-article {
	font-size: 90%;
}

.documentation-article p, .documentation-article .para li {
	margin-bottom: 5px;
	margin-top: 5px;
}

.documentation-article .para li {
	margin-bottom: 3px;
	margin-top: 3px;
}

.ec-event.ec-draggable {
	border: solid 1px #fff;
}

.error-msg, .success-msg {
	border-radius: 10px;
	color: #fff;
	font-size: 110%;
	margin-bottom: 20px;
	padding: 10px 20px;
	text-align: center;
}

.error-msg {
	background-color: crimson;
	border: solid 3px darkred;
}

.error-tip {
	color: #ff0000;
	text-align: center;
	width: 100%;
}

.event-popup-link {
	cursor: pointer;
	text-decoration: underline;
}

.export-btn-wrapper {
	text-align: right;
	width: 100%;
}

.fc .fc-event:hover {
	cursor: pointer;
	filter: brightness(1.10);
}

.fc .fc-button-group > button:first-child {
	border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.fc-button-group > button:last-child {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}

.fc .fc-button-primary:hover:not(:disabled) {
	filter: brightness(1.15);
}

.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active {
	filter: brightness(1.3); 
}

.fc .fc-timegrid-axis-cushion {
	max-width: none;
}

.fc .fc-toolbar {
	text-align: center;
}

.fc .fc-toolbar-title {
	font-size: 140%;
	margin-bottom: 5px;
	text-align: center;
}

.fc th {
	background-color: #f2f2f2;
}

.fc-button-primary, .fc-button-active {
	border-color: #fff !important;
}

.fc-event-time {
	font-size: 85%;
}

.fc-event-title {
	font-size: 90%;
}

.fc-timegrid-slot {
	height: 1em !important;
}

.fc-day-today {
	background-color:inherit !important;
}

.filter {
	margin: 10px 10px 10px 0px;
}

.filter-wrapper {
	margin: 10px auto;
	overflow: auto;
	text-align: center;
}

.filters-flex-container {
	align-items: flex-end;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.filter-flex-wrapper {
	align-items: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 3px;
}

.flex-nowrap-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	margin: 15px 0px;
	overflow-x: auto;
	scroll-behavior: smooth;
	/*scrollbar-width: none;*/
}

.flex-nowrap-wrapper > :not(:first-child) {
	margin-left: 10px;
}

/*.flex-nowrap-wrapper::-webkit-scrollbar {
	background: transparent;
	display: none;
}*/

.flex-wrapper {
	align-items: center;
	display: flex;
	gap: 0px 10px;
}

.flex-wrapper.flex-start {
	align-items: flex-start;
}

.flex-wrapper.less-gap {
	gap: 5px;
}

.flex-wrapper.more-gap {
	gap: 20px;
}

.flex-wrapper.nogap {
	gap: 0px;
}

.flex-wrapper.nowrap {
	flex-wrap: nowrap;
}

.flex-wrapper.wrap {
	flex-wrap: wrap;
}

.flex-wrapper > * {
	flex: 1;
}

.flex-wrapper > *.noflex {
	flex: none;
}

.flex-wrapper.noflex {
	flex: 0;
}

.footer-bottom-wrapper {
	background-color: #000;
	font-size: 80%;
	padding: 10px;
	text-align: center;
}

.footer-column-wrapper {
	display: inline-block;
	width: calc(33% - 5px);
	vertical-align: top;
}

.footer-img {
	border-radius: 10px;
	display: block;
	height: 150px;
	margin: auto;
}

.footer-title {
	color: #fff;
	font-size: 85%;
	font-weight: bold;
	margin-top: 15px;
	padding: 8px 10px;
}

.footer-txt {
	color: #bbb;
	font-size: 80%;
	padding: 5px 10px;
	text-decoration: none;
}

.footer-txt a {
	color: #bbb;
	text-decoration: underline;
}

.footer-txt a:hover {
	color: #fff;
}

.footer-wrapper {
	background-color: #2b2e30;
	padding: 40px;
	transition: 0.5s ease-out;
	-webkit-transition: 0.5s ease-out;
}

.forgot {
	color: #0a7be0;
	cursor: pointer;
	font-size: 90%;
	text-align: right;
	text-decoration: none;
	width: 100%;
}

.form-check-label {
	display: inline-block;
	margin: 5px 0px;
	vertical-align: middle;
}

.form-custom-field-wrapper {
	background-color: #fff;
	border: 1px solid #e2e2e2;
	box-shadow: 0px 0px 5px -2px rgba(220,220,220,1);
	cursor: move;
	margin: 10px 0px;
	padding: 10px 10px;
}

.form-custom-field-wrapper > *:not(img) {
	margin-left: 0px !important;
}

.form-custom-fields {
	list-style: none;
    margin: 0;
	padding-left: 0px;
}

/*.form-custom-fields li > :not(:first-child), .form-custom-fields .li-flex > *:not(:first-child) {
	margin-left: 8px;
}*/

.form-custom-layout {
	border: solid 1px gainsboro;
	border-radius: 10px;
	cursor: move;
	line-height: 1.5;
	list-style: none;
    margin: 20px 0px;
	min-height: 200px;
	padding: 20px 0px;
	width: 100%;
}

.form-custom-layout {
	h1 {
		font-weight: bold;
		margin: 0px;
		padding: 0px;
	}
	h2, h3, p, ol, ul {
		margin: 0px;
	} 
}

.form-desc {
	color: #555;
}

/*.form-element-wrapper {

}*/

.form-field {
	margin: 10px 0px;
}

.form-field:hover .form-field-overlay {
	display: flex;
}

.form-field p a {
	color: -webkit-link;
	text-decoration: underline;
}

.form-field-check {
	margin-right: 5px;
}

.form-field-desc {
	font-size: 80% !important;
}

.form-field-input {
	font-size: 12px;
}

.form-field-label {
	font-size: 80%;
	min-width: 100px;
}

.form-field-overlay {
	align-items: center;
	display: none;
	height: 100%;
	justify-content: center;
	margin-left: 0px !important;
	position: absolute;
	transition: 0.5s;
	width: 100%;
}

.form-field-overlay-bgrnd {
	background-color: #d2d2d2;
	cursor: move;
	height: 100%;
	opacity: 0.2;
	width: 100%;
}

.form-field-overlay-tools {
	background-color: #333;
	border-radius: 5px;
	display: flex;
	padding: 5px;
	position: absolute;
}

.form-field-pdf {
	max-height: 500px;
}

.form-field-table {
	border-collapse: collapse;
	margin: 5px 0px;
}

.form-field-table td {
	padding-right: 10px;
}

.form-field-types {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 10px;
}

.form-header-bar {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	margin-bottom: 30px;
}

.form-header-bar .login-btn {
	margin-top: 0px;
}

.form-img {
	border-radius: 10px;
	justify-content: center;
	margin: 0px auto;
	max-height: 80px;
	max-width: 350px;
}

.form-img-wrapper {
	text-align: center;
}

.form-input, .form-select, .selectify {
	min-width: 200px;
	width: 100%;
}

.form-input:not(textarea), .form-select, .selectify {
	padding-bottom: 0px;
	padding-top: 0px;
}

@media screen and (min-height: 501px) and (orientation:landscape), screen and (min-width: 501px) and (orientation:portrait)  {
	.form-input:not(textarea), .form-select, .selectify.form-select, .adjacent {
    	height: calc(1vh + 49px);
	}
	.form-input.small:not(textarea), .form-select.small, .selectify.small, .adjacent.small {
    	height: calc(1vh + 38px);
	}
	.form-input.tablet-item:not(textarea), .form-select.tablet-item, .selectify.tablet-item {
		height: calc(1vh + 79px);
	}
}

@media screen and (max-width: 500px), (max-height: 500px) {
	.form-input:not(textarea), .form-select, .selectify.form-select {
    	height: 38px;
    }
	.form-input.tablet-item:not(textarea), .form-select.tablet-item, .selectify.tablet-item {
		height: calc(1vh + 76px);
	}
}

.form-input.full, .form-select.full, .selectify.form-select.full {
	flex-basis: auto;
}

.form-input.long, .form-select.long, .selectify.form-select.long {
	max-width: 300px;
}

.form-input.medium, .form-select.medium, .selectify.form-select.medium {
	max-width: 220px;
}

.form-input.short, .form-select.short, .selectify.form-select.short {
	min-width: 100px;
	max-width: 174px;
}

.form-input.small, .form-select.small, .selectify.form-select.small {
	font-size: 80%;
}

.form-input.tiny {
	max-width: 80px;
	min-width: 0px;
}

.form-input-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0px 10px;
	margin: 15px 0px;
	min-width: 200px;
	width: 100%;
}

.form-input-wrapper > input:not([type=submit]):not([type=checkbox]):not([type=range]):not([type=file]), .form-input-wrapper > select, .form-input-wrapper > textarea, .form-input-wrapper > .flex-wrapper, .form-input-wrapper > .selectify {
	flex: 1;
}

.form-input-wrapper.noflex {
	display: block;
}

.form-input-wrapper > .noflex {
	flex: 0;
}

.form-label {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	flex-shrink: 0;
	font-size: 92%;
	gap: 10px;
	line-height: 1.5;
	width: 150px;
}

.form-label.full {
	width: 100%;
}

.form-label.full:not(:first-child) {
	flex: 1;
}

.form-label.full + label {
	margin-left: 0px !important;
}

.form-label.long {
	width: 400px;
}

.form-label.margin {
	margin-bottom: 12px;
}

.form-label.medium {
	width: 200px;
}

.form-label.nowidth {
	width: fit-content;
}

.form-label.option {
	font-size: 90%;
	width: auto;
}

.form-label.short {
	width: 125px;
}

.form-label.small {
	font-size: 80%;
	width: 100px;
}

.form-label-desc {
	color: #555;
	font-size: 85%;
	width: 100%;
}

.form-layout {
	margin: 0px auto;
}

.form-layout:hover .form-layout-menu {
	display: flex;
}

.form-layout-field[empty] {
	background-color: #f2f2f2;
	border: dashed 1px #ddd;
	border-radius: 4px;
	cursor: pointer;
	padding: 20px;
	text-align: center;
}

.form-layout-field[empty]:before {
	content: 'Click to add content';
}

.form-layout-field .form-field {
	margin: 0px;
}

.form-layout-menu {
	background-color: #333;
	border-radius: 5px;
	display: none;
	flex-direction: column;
	gap: 5px;
	left: 100%;
	margin-left: 0px !important;
	padding: 5px;
	position: absolute;
}

.form-password {
	min-width: 210px;
	width: calc(100% - 96px);
}

.form-section {
	border-top: solid 1px #d2d2d2;
	justify-content: center;
	padding: 30px 0px;
}

.form-section.no-border {
	border: none;
}

.form-section-header {
	color: darkgray;
	font-weight: bold;
	margin-bottom: 20px;
	text-transform: uppercase
}

.form-section-line {
	border-top: solid 1px #d2d2d2;
	margin: 40px 0px;
	width: 100%;
}

.form-select.tiny {
	max-width: 125px;
}

.frequency-grid-row {
	display: flex;
	flex-wrap: nowrap;
}

.frequency-grid-row:not(:first-child) .grid-toggles {
	border-top: none;
}

.full-width {
	width: 100%;
}

.fundraiser-about-container {
	margin-top: 40px;
	min-height: 300px;
}

.fundraiser-image {
	height: 67vh;
	min-height: 330px;
	padding: 0px !important;
	width: 100%;
}

.fundraiser-image .btn {
	margin-left: auto;
	margin-right: auto;
}

.fundraiser-image-blur {
	/*backdrop-filter: blur(8px);*/
	background-color: transparent !important;
	height: 100%;
	width: 100%;
}

.fundraiser-tagline {
	font-size: 150%;
}

.fundraiser-tagline, .fundraiser-title {
	color: #fff;
	text-align: center;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.5);
}

.fundraiser-title {
	font-size: 240%;
	font-weight: bold;
	text-align: center;
}

.gallery-wrapper.remove-hover .gallery-image {
	cursor: auto !important;
	transform: none !important;
}

.gallery-image:hover .tile-overlay-content, .photo-tile:hover .tile-overlay-content {
	display: flex;
}

.grid-toggles {
	align-items: center;
	background-color: #fff;
	border: solid 1px gainsboro;
	cursor: pointer;
	display: flex;
	flex-shrink: 0;
	height: 40px;
	justify-content: center;
	width: 40px;
}

.grid-toggles:not(:first-child) {
	border-left: 0px;
}

.grid-toggles:hover {
	background-color: #f6f6f6;
}

.grid-toggles.large {
	height: 60px;
	width: 60px;
}

.grid-toggles input { 
	border: none;
	height: 0;
	margin: 0px;
	opacity: 0;
	padding: 0px;
	width: 0;
}

.grid-toggles:has(input:checked) {
	background-color: #007fff;
	color: #fff;
}

.grid-toggles input:disabled + .grid-toggle {
	cursor: auto;
	opacity: 0.6;
}

.grid-toggle {
	-webkit-transition: .4s;
	transition: .4s;
}

.header-filter, .input-filter, .select-filter, .table-filter {
	background-position: right 2px center;
    background-size: 15px;
	color: #333;
	font-size: 12px;
	min-width: 0px;
	padding: 10px 15px 10px 10px;
	width: 175px;
}

.icon-container {
	height: fit-content;
	width: fit-content;
}

.input-filter, .select-filter, .table-filter {
	height: 40px;
}

.header-filter {
	border-radius: 5px;
	margin: 3px 0px;
	padding: 6px 17px 6px 8px;
	width: 150px;
}

.header-filter-wrapper, .table-filter-wrapper {
	display: block;
	float: left;
	padding: 10px 0px;
}

.header-filter-wrapper-center, .table-filter-wrapper-center {
	display: block;
	float: none;
	padding: 10px 0px;
	text-align: center;
	width: 100%;
}

.header-filters {
	box-shadow: 2px 2px 8px 1px rgba(0,0,0,.2);
	color: white;
	display: flex;
	flex-wrap: nowrap;
	overflow: auto;
	padding: 10px;
	z-index: 1;
}

.help-btn, .public-cart-btn, .settings-btn {
	cursor: pointer;
	user-select: none;
}

.help-btn, .settings-btn {
	color: #fff;
}

.help-btn {
	color: #0066cc;
	/*font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;*/
}

.help-btn-container {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	position: absolute;
	top: 10px;
	right: 10px;
}

.highlight-row {
	background-color: #ffff6d !important;
}

.icon-button {
	cursor: pointer;
	vertical-align: middle;
	user-select: none;
}

.icon-button.add, .icon-button.approve {
	color: #0066cc;
}

.icon-button.table-action-check:before, .icon-button.table-action-tbl-check:before {
	content: 'check_box_outline_blank';
}

.icon-button.table-action-check.checked:before, .icon-button.table-action-tbl-check.checked:before {
	content: 'check_box';
}

.icon-button.delete {
	color: #ee0000;
}

.icon-button.info-btn {
	color: #39f;
	font-size: 100% !important;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.icon-button.material-symbols-outlined:not(.info-btn):not(.no-fill) {
	font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.icon-button.material-symbols-outlined.pulse {
	animation: pulse 3s infinite;
}

@keyframes pulse {
	0% {
		font-variation-settings: 'FILL' 1, 'wght' 700;
	}
	50% {
		font-variation-settings: 'FILL' 1, 'wght' 200;
	}
	100% {
		font-variation-settings: 'FILL' 1, 'wght' 700;
	}
}

.icon-button.move {
	cursor: move;
}

.icon-button.disabled {
	cursor: default;
	filter: grayscale(1);
	opacity: 0.2;
}

.icon-button.small, .material-symbols-outlined.small {
	font-size: 18px;
}

.icon-button-text {
	font-size: 90%;
	margin-left: 8px;
	user-select: none;
}

.icon-button-wrapper {
	align-items: center;
	color: #0a7be0;
	cursor: pointer;
	display: flex;
	margin-top: 10px;
	width: fit-content;
}

.icon-button-wrapper:hover, .icon-button:not(.disabled):hover {
	filter: brightness(1.25);
}

.icon-button-wrapper:hover .icon-button-text {
	text-decoration: underline;
}

.img-bgrnd {
	background-color: #D9D9D9;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20px 20px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
}

.img-bgrnd-full {
	min-height: 100vh;
}

.img-bgrnd-medium {
	height: 400px;
}

.img-bgrnd-short {
	height: 250px;
}

.img-bgrnd-tall {
	height: 600px;
}

.img-btn {
	background-color: transparent;
	border: none;
	border-radius: 0px;
	box-sizing: unset;
	cursor: pointer;
	margin: -2px;
	padding: 0px;
	height: 20px;
	vertical-align: middle;
	width: 20px;
}

.img-btn:disabled {
    filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
	opacity: 0.2;
}

.img-btn:hover {
	opacity: 0.5;
}

.img-upload-variable {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	height: 100px;
	margin: 0px auto 10px auto;
	width: 100%;
}

.indent1 {
	padding-left: 20px;
}

.input-invalid {
	border-color: red !important;
}

.invalid-bgrnd {
	background-color: #ffc2c2;
}

.justify-center {
	justify-content: center;
}

.justify-flex-end {
	justify-content: flex-end;
}

.justify-space-between {
	justify-content: space-between;
}

.label-invalid {
	color: red;
}

.large-img {
	border-radius: 10%;
	display: block;
	margin: 0px auto 10px auto;
	object-fit: cover;
	height: 150px;
	width: 150px;
}

.large-img.square {
	border: none;
	border-radius: 0px;
}

.li-flex {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	/*overflow-x: auto;*/
	position: relative;
}

.li-flex.wrap {
	flex-wrap: wrap;
}

.li-flex .form-input-wrapper {
	flex: 1;
	margin: 0px;
}

.li-flex .form-input-wrapper.no-flex {
	flex: none;
}

.li-reorder {
	background-color: #f6f6f6;
    border-radius: 10px;
    cursor: move;
    margin: 10px 0px;
    padding: 10px;
	width: 100%;
}

.li-reorder input {
	background-color: transparent;
	border: none;
	cursor: move;
	font-size: 90%;
	padding: 0px;
	user-select: none;
	width: 100%;
}

.line-spacing {
	min-height: 10px;
	white-space: pre-line;
	width: 100%;
}

.link {
	color: blue;
	text-decoration: underline;
}

.locker-room-tile {
	background-color: #fff;
	border-radius: 10px;
	height: 100%;
	padding: 30px;
	text-align: center;
}

.locker-room-tile-container {
	margin: 10px 0px;
	padding: 0px 10px;
}

.locker-room-tile-container {
	width: 33.33%;
}

@media screen and (min-width: 1060px) and (max-width: 1600px) {
	.locker-room-tile-container {
		width: 50%;
	}
}

@media screen and (max-width: 1060px) {
	.locker-room-tile-container {
		width: 100%;
	}
}

.locker-room-tile-data {
	font-size: 250%;
}

.locker-room-tile-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	padding: 5px 0px;
}

.locker-room-tile-row .locker-room-tile-text {
	padding: 5px;
}

.locker-room-tile-row > *:last-child {
	flex-shrink: 0;
	text-align: right;
}

.locker-room-tile-row > *:not(:last-child) {
	text-align: left;
}

.locker-room-tile-row > *:not(:first-child):not(:last-child) {
	width: 100%;
}

.locker-room-tile-subtitle {
	font-size: 135%;
	margin-bottom: 20px;
}

.locker-room-tile-subtitle, .locker-room-tile-title {
	line-height: 1.2;
	text-transform: uppercase;
}

.locker-room-tile-text {
	font-size: 150%;
	line-height: 1.5;
}

.locker-room-tile-title {
	font-size: 150%;
	font-weight: bold;
	margin-bottom: 10px;
}

.locker-room-tiles-wrapper {
	display: flex;
	flex-wrap: wrap;
}

.login-bgrnd {
	background-color: white;
	border-radius: 8px;
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .2);
	justify-content: center;
	margin: auto;
	max-width: 500px;
	min-width: 240px;
	padding: 40px;
	vertical-align: middle;
	width: 50%;
}

.login-header {
	align-items: center;
	border-bottom: solid 1px gray;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	margin-bottom: 30px;
	padding-bottom: 15px;
	text-align: center;
	width: 100%;
}

.login-img {
	max-height: 150px;
}

.login-img-wrapper {
	width: 100%;
}

.login-input {
	width: 100%;
}

.login-input-wrapper {
	margin: 10px 0px;
	width: 100%;
}

.login-logo-text {
	color: #111;
	font-family: 'Passion One', Arial, "sans-serif";
	font-size: 160%;
	margin-left: 0px;
	text-align: left;
	text-decoration: none;
	white-space: nowrap;
}

.login-section {
	justify-content: center;
}

.login-section-bgrnd {
	background-color: white;
	border-radius: 8px;
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .2);
	left: 50%;
	margin: auto;
	min-width: 500px;
	/*opacity: 0.9;*/
	padding: 40px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	width: 50%;
}

.login-wrapper {
	align-items: center;
	cursor: pointer;
	display: flex;
	flex-wrap: wrap;
}

.logo-text {
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	margin-left: 7px;
	text-align: left;
	text-decoration: none;
	white-space: nowrap;
}

.magnify-text {
	animation-name: magnifyText;
	-webkit-animation-name: magnifyText;	
	animation-duration: 3s;	
	-webkit-animation-duration: 3s;
	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;
}

@keyframes magnifyText {
	0% {
		font-size: 100%;
		font-weight: normal;
	}
	50%{
		font-size: 125%;
		font-weight: bold;
	}
	100% {
		font-size: 100%;
	}		
}

@-webkit-keyframes magnifyText {
	0% {
		font-size: 100%;
		font-weight: normal;
	}
	50%{
		font-size: 125%;
		font-weight: bold;
	}
	100% {
		font-size: 100%;
	}
}

.material-symbols-outlined {
	user-select: none;
}

.medium-img {
	/*border: solid 1px lightgray;*/
	border-radius: 50%;
	display: block;
	margin: 0px auto 10px auto;
	object-fit: cover;
	height: 70px;
	width: 70px;
}

.menu-item-wrapper .btn-icon {
    font-size: 120%;
}

.menu-item-wrapper span:first-child, .header-profile-menu-item span:first-child {
	margin-right: 8px;
	/*width: 24px;*/
}

.menu-items {
	cursor: pointer;
	margin-top: 10px;
	justify-content: space-between;
	text-transform: uppercase;
}

.menu-items .btn-icon:after {
	content: 'keyboard_arrow_down';
}

.menu-items.active .btn-icon:after {
	content: 'keyboard_arrow_up';
}

.message {
	background-color: mintcream;
	border: solid 1px darkseagreen;
	border-radius: 5px;
	color: darkseagreen;
	margin-bottom: 20px;
	padding: 10px;
	text-align: center;
	width: calc(100% - 22px);
}

.message-wrapper {
	border-top: solid 1px #e2e2e2;
	padding: 10px 0px;
	width: 100%;
}

.message-wrapper:last-child {
	border-bottom: solid 1px #a2a2a2;
}

.modal-close {
	color: #333;
	float: right;
	font-size: 28px;
	margin-top: -15px;
}

.modal-close:hover, .modal-close:focus {
	color: #777;
	text-decoration: none;
	cursor: pointer;
}

.modal-important-error {
	background-color: crimson;
}

.modal-important-success {
	background-color: limegreen;
}

.modal-important-tile::before {
	content: "\2022 \20";
}

.modal-important-tile {
	/*box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, .2);*/
	padding: 5px;
	text-align: left;
	width: 100%;
}

.modal-important-wrapper {
	box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, .2);
	color: #fff;
	padding: 20px;
	text-align: center;
	width: 100%;
}

.modal-important-wrapper > div:not(:first-child) {
	margin-top: 10px;
}

.modal-important-wrapper > div:not(:last-child) {
	margin-bottom: 5px;
}

.modal-wrapper {
	background-color: rgba(0,0,0,0.4);
	display: none;
	height: 100%;
	left: 0;
	overflow: auto;
	padding: 5%;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 998;
}

.modal-wrapper.cookie, .modal-wrapper.save {
	bottom: 0px;
	box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, .2);
	color: #fff;
	height: fit-content;
	padding: 15px;
	text-align: center;
	top: auto;
	width: 100%;
	z-index: 999;
}

.modal-wrapper.cookie {
	background-color: #222;
}

.modal-wrapper.save {
	background-color: transparent;
}

.modal-wrapper.side {
	height: 100vh;
	overflow: hidden;
	padding: 0px;
}

.modal-wrapper.side .popup-contents {
	flex: 1;
	overflow-y: auto;
}

.modal-wrapper.side .popup-flex-wrapper {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
}

.modal-wrapper.side .popup-footer {
	border-top: solid 1px #d2d2d2;
}

.modal-wrapper.side .popup-header {
	border-radius: 0px;
	border-bottom: solid 1px #d2d2d2;
}

.modal-wrapper.side .popup-window {
	border-radius: 0px;
	display: none;
	height: 100%;
	margin: 0px;
	position: absolute;
	right: 0;
}

.move-horizontal-img {
	display: block !important;
	margin: auto;
	text-align: center;
}

.move-vertical-img {
	display: inline-block;
	height: 20px;
	width: 20px;
}

.no-flex {
	flex: none;
}

.no-line-spacing {
	line-height: normal !important;
}

.no-margin {
	margin: 0px !important;
}

.no-padding {
	padding: 0px !important;
}

.no-td-width {
	padding: 5px;
	width: 0px;
}

.nowidth {
	width: 0px;
}

.par-tbl-img {
	/*border: solid 1px #eaeaea;*/
	border-radius: 40px;
	display: inline-block;
	height: 40px;
	margin-right: 8px;
	object-fit: cover;
	vertical-align: middle;
	width: 40px;
}

.par-tbl-name {
	display: inline-block;
	margin-left: 8px !important;
}

.para {
	line-height: 1.75;
	margin: 20px 0px;
	width: 100%;
}

.para a {
	color: #0033ff;
	text-decoration: underline;
}

.para li {
	margin: 10px 0px;
	text-align: left;
}

.para-condensed {
	line-height: 1.4;
	margin: 20px 0px;
	text-align: center;
	width: 100%;
}

.para-small {
	font-size: 80%;
	margin: 5px 0px;
}

.payment-form {
	margin: 20px auto;
	/*padding: 0px 3%;*/
	/*text-align: center;*/
	width: 100%;
}

.payment-form.paypal {
	max-width: 50%;
}

.payment-form-wrapper {
	align-items: start;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
}

.sq-card-wrapper {
	width: 100%;
}

.pdf-contents {
	height: 90vh;
	width: 100%;
}

.pdf-window {
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .6);
	height: 90vh;
	margin: auto;
	position: relative;
	top: 50%;
	transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
	width: 90%;
}

.photo-tile {
	background-color: #e2e2e2;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	cursor: move;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.photo-tile-container {
	border: solid 1px #fff;
	flex-basis: auto;
	height: 150px;
	overflow: hidden;
	position: relative;
	transition: 0.7s;
	width: 150px;
}

.photo-tile-container.upload .photo-tile {
	align-items: center;
	cursor: pointer;
	display: flex;
	justify-content: center;
}

.photo-tiles-container {
	display: flex;
	flex-wrap: wrap;
}

.popup-close, .close-tile {
	cursor: pointer;
	position: absolute;
	right: 10px;
	top: 10px;
	transition: 0.25s;
	user-select: none;
	z-index: 3;
}

.popup-close.light {
	color: #fff;
}

.popup-close:hover {
	filter: invert(0.4);
}

.popup-close-wrapper {
	position: relative;
}

.popup-contents {
	background-color: #fff;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	padding: 40px;
	position: relative;
}

.popup-contents + .popup-footer, .modal-wrapper.side .popup-contents {
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}

.popup-header {
	background-color: #f2f2f2;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	z-index: 2;
}

.popup-header .help-btn-container {
	right: 40px;
}

.popup-header.cart {
	align-items: center;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	padding: 10px;
}

.popup-header.warning {
	background-color: #cc0000;
	color: #fff;
}

.popup-icon {
	font-size: 40px !important;
	width: 100%;
}

.popup-icon.delete, .popup-text.delete, .popup-title.delete {
	color: #dd0000;
}

.popup-img {
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	height: 0;
    padding-bottom: 50%;
	width: 100%;
}

.popup-subtitle {
	font-size: 90%;
	font-weight: bold;
	margin-top: 20px;
}

.popup-text {
	font-size: 90%;
}

.popup-title {
	font-size: 140%;
	padding: 15px 0px;
	text-align: center;
	user-select: none;
}

.popup-window {
	background-color: white;
	border-radius: 8px;
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .6);
	margin: auto;
	position: relative;
	width: 420px;
}

.popup-window.full {
	width: 100%;
}

.popup-window.large {
	max-width: 1000px;
	min-width: 300px;
	width: 100%;
}

.popup-window.medium {
	max-width: 700px;
	min-width: 300px;
	width: 67%;
}

.post-author {
	font-size: 90%;
	font-style: italic;
	font-weight: bold;
	margin-top: 5px;
}

.post-container {
	cursor: pointer;
	height: 100%;
	max-width: 450px;
	width: 100%;
}

.post-container .post-img-bgrnd:hover {
	background-size: 110%;
}

.post-contents {
	font-size: 95%;
	line-height: 1.5;
	margin-top: 40px;
}

.post-contents a {
	text-decoration: underline;
}

.post-date {
	color: #aaa;
	font-size: 80%;
	margin-top: 5px;
}

.post-img {
	width: 100%;
}

.post-img-bgrnd {
	background-position: center;
	background-size: 100%;
	height: 0px;
	padding-bottom: 56.25%;
	transition: all 0.3s ease-in-out;
	width: 100%;
}

.post-link {
	cursor: pointer;
	font-size: 80%;
	margin-top: 10px;
	text-decoration: underline;
}

.post-subtitle {
	font-size: 110%;
	font-weight: bold;
	margin-top: 5px;
}

.post-text {
	font-size: 80%;
	line-height: 1.5;
	margin-top: 10px;
}

.post-title {
	font-size: 150%;
	font-weight: bold;
}

.pref-field-section-wrapper {
	overflow-x: auto;
	padding: 10px 0px;
}

.pref-fields-wrapper {
	overflow-x: auto;
	overflow-y: visible;
	padding: 20px 0px;
	width: 100%;
}

.pref-fields-wrapper:first-child {
	padding-top: 0px;
}

.pref-fields-wrapper:last-child {
	padding-bottom: 0px;
}

.pref-fields-wrapper::-webkit-scrollbar {
	display: none;
}

.pref-header-label {
	display: inline-block;
	flex: none;
	font-size: 75%;
	font-weight: bold;
	text-align: center;
	width: 208px;
}

.pref-header-label.active {
	width: 68px;
}

.pref-header-label.delete {
	width: 33px;
}

.pref-header-label.move {
	width: 25px;
}

.pref-header-label.tiny {
	width: 68px;
}

.pref-header-move {
	width: 15px;
}

.pref-header-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	margin-top: 15px;
}

.pref-sub-wrapper {
	margin: 0px 20px 0px 20px;
}

.profile-label {
	display: inline-block;
	min-width: 100px;
}

.profile-menu-img {
	display: inline-block;
	height: 20px;
	margin-right: 7px;
	object-fit: cover;
	width: 20px;
}

.profile-select {
	border: solid 1px gainsboro;
	border-radius: 5px;
	margin: 5px 0px;
	outline: none;
	padding: 10px;
	width: 220px;
}

.progress-bar {
	background-color: #fff;
	border: solid 1px gainsboro;
	border-radius: 20px;
	height: 25px;
	margin: 20px 0px;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.progress-bar-fill {
	background-color: #00ee00;
	border-radius: 20px;
	height: 100%;
	width: 0%;
}

.progress-bar-text {
	font-size: 13px;
	position: absolute;
	text-align: center;
	top: 2px;
	width: 100%;
}

.progress-bottom {
	background-color: #fff;
}

.progress-bottom, .progress-top {
	padding: 40px;
	text-align: center;
}

.progress-container {
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0 0 8px 1px rgba(0,0,0,0.2);
	margin-top: calc(-6vw - 80px);
	overflow: hidden;
	padding: 40px;
}

.progress-container-bottom {
	justify-content: space-between;
	width: 100%;
}

.progress-container-top {
	align-items: flex-start;
	justify-content: space-between;
	width: 100%;
}

.progress-gifts {
	font-size: 300%;
}

.progress-gifts, .progress-numeric-text, .progress-percent {
	line-height: 1;
}

.progress-metric {
	align-items: center;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
}

.progress-numeric-text, .progress-percent {
	font-size: 200%;
}

.progress-percent-container {
	background-color: #fff;
	border: solid 3px #aaa;
	border-radius: 100px;
	height: 180px;
	margin-left: auto;
	margin-right: auto;
	margin-top: -130px;
	position: relative;
	width: 180px;
}

.progress-percent-inner-container {
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
}

.progress-sub-text {
	color: #aaa;
	text-transform: uppercase;
	white-space: nowrap;
}

.progress-top {
	background-color: #aaa;
	padding-bottom: 20px;
}

.public-cart-btn {
	position: relative;
}

.public-cart-container {
	position: relative;
}

.public-cart-item {
	align-items: center;
	border-top: solid 1px #f2f2f2;
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	padding: 5px 0px;
	width: 100%;
}

.public-cart-item:last-child {
	border-bottom: solid 1px #f2f2f2;
}

.public-cart-item-container {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.public-cart-item-date {
	font-size: 80%;
}

@keyframes public-cart-jiggle {
	0% { transform: translateX(0); } /* Start at original position */
	25% { transform: translateX(3px); } /* Move slightly right */
	50% { transform: translateX(-3px); } /* Move slightly left */
	75% { transform: translateX(3px); } /* Move slightly right again */
	100% { transform: translateX(0); } /* Return to original position */
}

.public-cart-jiggle {
	animation: public-cart-jiggle 0.5s ease-in-out;
}

.public-cart-menu {
	background-color: #fff;
	border: solid 1px #ddd;
	border-radius: 5px;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, .28);
	display: none;
	font-size: 75%;
	font-family: var(--primary-font);
	max-width: 90vw;
	overflow: hidden;
	padding: 10px;
	position: absolute;
	right: -30px;
	width: 350px;
	z-index: 5;
}

.public-cart-menu.active {
	display: block;
}

.public-cart-total-title {
	width: 100%;
}

.public-cart-totals {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	font-weight: bold;
	padding: 5px 0px;
	width: 100%;
}

.radio-wrapper {
	display: inline-block;
	margin: 15px 15px 15px 0px;
}

.range-slider .ui-slider-handle, .range-slider .ui-slider-handle:focus {
	border-radius: 50%;
}

.rating-calc-input {
	font-size: 80%;
	margin: 5px;
	width: 30px;
	vertical-align: middle;
}

.rating-calc-label {
	display: inline-block;
	font-size: 80%;
	margin: 5px;
	vertical-align: middle;
}

.rating-input {
	display: inline-block;
	width: 250px;
}

.rectangle-img {
	border: solid 1px lightgrey;
	display: block;
	margin: 0px auto 10px auto;
	object-fit: cover;
	height: 200px;
	width: 356px;
}

.report-filters-section {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0px 5px;
	margin: 10px 0px;
}

.save-btn, .copy-btn, .btn.add, .square-btn {
	background-color: #0066cc !important;
}

.scrollbar:hover::-webkit-scrollbar-thumb {
    background-color: #ddd;
}

.scrollbar::-webkit-scrollbar {
    width: 14px;
}

.scrollbar::-webkit-scrollbar-track {
    border-radius: 10px;
}

.scrollbar::-webkit-scrollbar-thumb {
    background-clip: content-box;
    border: 4px solid transparent;
    border-radius: 10px;
	bottom: 0;
	opacity: .5;
	position: absolute;
}

.search-list {
	background-color: #fff;
	box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.3);
	overflow-y: auto;
	position: absolute;
	z-index: 3;
}

.search-list.full {
	width: 100%;
}

.search-list > div {
	margin: 0px !important;
	padding: 5px 10px;
}

.search-list > div:first-child {
	padding-top: 10px;
}

.search-list > div:last-child {
	padding-bottom: 10px;
}

.search-list > div:not(.search-list-header):hover {
	background-color: #ddd;
	cursor: pointer;
}

.search-list-city {
	color: #555;
	font-size: 90%;
}

.search-list-date {
	font-size: 95%;
	font-weight: bold;
}

.search-list-default {
	font-size: 90%;
	font-style: italic;
}

.search-list-header {
	background-color: #f2f2f2;
	font-weight: bold;
}

.search-list-item {
	align-items: center;
	border-bottom: solid 1px #eee;
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
}

.search-list-image {
	width: 50px;
}

.search-list-location {
	color: #555;
}

.search-list-title {
	font-weight: bold;
}

.search-list-wrapper {
	display: none;
	font-size: 80%;
	position: relative;
	text-align: left;
}

.search-list-wrapper.active {
	display: block;
}

.search-wrapper {
	margin: 10px auto !important;
	position: relative;
	text-align: center;
	width: 100%;
}

.search-wrapper i {
	color: #444;
	position: absolute;
	left: 0;
	margin: 10px;
	-ms-transform: translateY(50%);
	transform: translateY(50%);
}

.search-wrapper input {
	padding-left: 40px !important;
}

.section-bgrnd {
	position: relative;
}

.section-bgrnd, .section-bgrnd-accordion {
	background-color: white;
	border-radius: 1px;
	padding: 40px;
	width: 100%;
}

.section-bgrnd.dynamic-padding {
	padding: 6vw;
}

.section-bgrnd-accordion {
	border-bottom: solid 1px #eee;
    border-left: solid 1px #eee;
    border-right: solid 1px #eee;
	display: none;
}

.section-bgrnd-accordion .form-section:first-child {
	border-top: none;
	padding-top: 0px;
}

.section-bgrnd-accordion.active {
	display: block;
}

.section-header {
	background-color: #f6f6f6;
	border-left: solid 1px #eee;
	border-right: solid 1px #eee;
	border-top: solid 1px #eee;
	cursor: pointer;
	padding: 20px;
}

.section-header + .form-section {
	display: none;
}

.section-header.dark {
	background-color: #333;
	border: none;
	color: #fff;
}

/*.section-header.is-active .section-header-dropdown:after {
	content: 'keyboard_arrow_up';
}*/

.section-header.active .section-header-dropdown {
	transform: rotate(180deg);
}

.section-header.active + .form-section {
	display: block;
}

.section-header-txt, .section-header-dropdown {
	display: inline-block;
	font-weight: bold;
	text-align: left;
	text-transform: uppercase;
}

.section-header-dropdown {
	float: right;
	transition: 0.3s;
	width: fit-content;
}

/*.section-header-dropdown:after {
	content: 'keyboard_arrow_down';
}*/

.section-wrapper {
	/*box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .2);*/
	margin: auto;
	width: 100%;
}

.section-wrapper:last-child .section-header {
	border-bottom: solid 1px #eee;
}

.select-table-filter {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

.selectify {
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	text-align: left;
}

.selectify li {
	cursor: pointer;
	list-style: none;
	white-space: nowrap;
}

.selectify li[disabled] {
	color: #aaa;
	pointer-events: none;
}

.selectify.form-select li, .selectify.sub-tbl-select li {
	padding: 5px 20px;
}

.selectify.select-filter li {
	padding: 3px 10px;
}

.selectify li.active {
	background-color: #0066cc;
	color: #fff;
}

.selectify ul {
	margin: 0px;
	min-height: 24px;
	overflow-y: auto;
	padding: 0px;
}

/*.selectify.active {
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}*/

.selectify-box {
	cursor: default;
	overflow-x: hidden;
	overflow-y: hidden;
	text-wrap: nowrap;
	user-select: none;
}

.selectify-filter-wrapper {
	align-items: center;
	border-bottom: solid 1px gainsboro;
	display: flex;
	flex-wrap: nowrap;
	position: relative;
}

.selectify-filter-wrapper i {
	color: #bbb;
	cursor: default;
	left: 5px;
	position: absolute;
	user-select: none;
}

.selectify-filter-wrapper i:first-child {
	margin-left: 20px;	
}

.selectify-filter-wrapper i:last-child {
	margin-right: 20px;	
}

.selectify-input {
	border: none;
	border-radius: 0px;
	color: #888;
	font-size: 100%;
	margin: 0px;
	padding: 10px 10px 10px 35px;
	width: 100%;
}

.selectify-list {
	background-color: #fff;
	border: solid 1px gainsboro;
	display: none;
	position: fixed;
	width: auto;
	z-index: 996;
}

.selectify.active .selectify-list {
	display: block;
}

.shift {
	margin-left: 250px;
	/*transition: 0.5s ease-out;
	-webkit-transition: 0.5s ease-out;*/
}

.shift-item {
	transition: 0.5s ease-out;
	-webkit-transition: 0.5s ease-out; 
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

.sponsor-tbl-img {
	display: inline-block;
	height: 40px;
	margin-right: 8px;
	vertical-align: middle;
}

.status-message-container {
	margin-top: 20px;
	max-width: 300px;
	position: fixed;
	right: 20px;
	z-index: 999;
}

.status-message {
	border-radius: 8px;
	color: #fff;
	display: none;
	font-size: 12px;
	margin: 5px 0px;
	padding: 5px 8px;
}

.status-message i {
	margin-right: 5px;
}

.status-message.error {
	background-color: #bb0000;
}

.status-message.success {
	background-color: #11bb11;
}

.store-btn {
	border-radius: 5px;
	color: #fff;
	cursor: pointer;
	font-size: 80%;
	padding: 8px 12px;
	text-align: center;
	white-space: nowrap;
}

.store-item-desc {
	font-size: 80%;
	margin: 5px 0px;
}

.store-item-img {
	height: 150px;
	object-fit: cover;
	width: 100%;
}

.store-item-name {
	font-weight: bold;
	margin: 5px 0px;
}

.store-item-price {
	font-size: 110%;
	font-weight: bold;
	margin: 5px 0px;
}

.store-item-variation {
	font-size: 80%;
	margin: 5px 0px;
	padding: 5px;
}

.store-item-wrapper {
	margin: 5px;
	max-width: 33.32%;
	min-width: 25%;
}

.store-tabs {
	border: solid 2px #fff;
	border-radius: 0px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	margin: 0px -6px 0px 0px;
	padding: 15px 0px;
	text-align: center;
	width: calc(50% + .75px);
}

.store-tabs:hover {
	opacity: 0.75;
}

.store-tabs-click {
	background-color: #fff !important;
	color: #222 !important;
	font-weight: bold;
}

.store-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 20px;
}

.store-wrapper > div {
	flex: 1;
	padding: 10px;
	text-align: center;
}

.sub-tbl {
	border: solid 2px #e6e6e6;
	border-collapse: collapse;
	font-size: 80%;
	margin-bottom: 15px;
	margin-top: 15px;
	width: 100%;
}

.sub-tbl .icon-button {
	margin: 0px 2px;
}

.sub-tbl tbody tr:first-child .icon-button.delete.required {
    display: none;
}

.sub-tbl tfoot td, .sub-tbl thead th  {
	font-weight: bold;
	padding: 5px 5px;
	text-align: left;
}

.sub-tbl tfoot td {
	background-color: #e2e2e2;
}

.sub-tbl thead th {
	background-color: #eee;
}

.sub-tbl th.hide, .sub-tbl td.hide {
	display: none;
}

.sub-tbl tr {
	background-color: #fff;
}

.sub-tbl tbody td {
	border: solid 1px #e6e6e6;
}

.sub-tbl-input, .sub-tbl-select {
	border: none;
	border-radius: 0px;
	font-size: inherit;
	margin: 0px;
	padding: 12px 5px;
	width: 100%;
}

.sub-tbl-input.small {
	font-size: 85%;
}

.sub-tbl-tip {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	width: fit-content;
}

.sub-tbl-wrapper {
	margin-left: 0px !important;
	overflow-x: auto;
	width: 100%;
}

.sub-title {
	font-size: 130%;
	margin: 20px 0px;
	text-align: center;
}

.success-msg {
	background-color: limegreen;
	border: solid 3px darkgreen;
}

.switch {
	position: relative;
	display: inline-block;
	flex-shrink: 0;
	width: 60px;
	height: 34px;
}

.switch input { 
	opacity: 0;
	width: 0;
	height: 0;
}

.switch input:disabled + .slider {
	cursor: auto;
	opacity: 0.6;
}

.tab {
	border: solid 2px #fff;
	border-radius: 0px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	flex: 1;
	font-size: 90%;
	margin: 0px;
	padding: 15px 0px;
	text-align: center;
	/*width: calc(50% + .75px);*/
}

.tab:hover {
	filter: brightness(1.1);
}

.tab:not(:first-child) {
	border-left: 0px;
}

.tab-click {
	background-color: #fff !important;
	color: #222 !important;
	font-weight: bold;
}

.tab-item {
	border-bottom: solid 5px #fff;
    border-left: none;
    border-radius: 0px;
    border-right: none;
    border-top: none;
    color: #666;
    cursor: pointer;
	font-size: 90%;
    margin: 0px;
    padding: 10px;
    /*width: 160px;*/
}

.tab-item.active {
	border-bottom: solid 5px #383838;
    color: #383838;
    font-weight: bold;
}

.tab-section {
	display: none;
}

.tab-section.active {
	display: block;
}

.tab-section-wrapper > .section-bgrnd {
	margin-top: 0px !important;
}

.tab-section-wrapper.margin {
	margin-bottom: 20px;
	margin-top: 20px;
}

.tab-wrapper {
	align-items: center;
   	border-bottom: solid 1px #e2e2e2;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom: 15px;
    margin-top: 15px;
	/*overflow-x: auto;*/
    width: 100%;
}

/*.tab-wrapper:hover::-webkit-scrollbar-thumb {
    background-color: #ddd;
}

.tab-wrapper::-webkit-scrollbar {
    width: 14px;
}

.tab-wrapper::-webkit-scrollbar-track {
    border-radius: 10px;
}

.tab-wrapper::-webkit-scrollbar-thumb {
    background-clip: content-box;
    border: 4px solid transparent;
    border-radius: 10px;
	bottom: 0;
	opacity: .5;
	position: absolute;
}*/

.table-filter {
	border-radius: 0px;
}

.table-filter-wrapper:first-child > * {
	border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;
}

.table-filter-wrapper:last-child > * {
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
}

@media screen and (min-width: 501px) {
	.table-filter-wrapper:not(:first-child) > * {
		border-left: 0px;
	}
}

.tabs-section {
	margin-top: 10px;
	padding: 0px;
}

.tabs-wrapper {
	align-content: center;
	/*background-color: #fff;*/
	display: flex;
	flex-wrap: nowrap;
	/*margin: -40px -40px 0px -40px;*/
	/*-ms-overflow-style: none;
	overflow: -moz-scrollbars-none;
	overflow-x: auto;
	overflow-y: hidden;*/
	/*scroll-behavior: smooth;*/
	white-space: nowrap;
	width: 100%;
}

/*.tabs-wrapper::-webkit-scrollbar {
	background: transparent;
	display: none;
}*/

.tab-title {
	font-size: 110%;
	padding: 0px 10px;
}

.tab-title:hover {
	color: #999;
	cursor: pointer;
}

.table-info {
	color: #333;
	font-size: 12px;
	padding: 10px 0px;
	text-align: right;
	width: 100%;
}

.tablet-bgrnd {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 40px;
	width: 100%;
}

.tablet-bgrnd > * {
	flex: 1;
}

.tablet-btn, .tablet-item, .tablet-label {
	border: none;
	border-radius: 50px;
	font-size: 175%;
	margin: 10px auto !important;
	padding: 25px 40px;
}

.tablet-btn {
	background-color: #00cc00;
	width: 100%;
}

.tablet-btn-wrapper {
	align-items: center;
	margin: 10px auto;
	padding-top: 20px;
	text-align: center;
	width: 100%;
}

.tablet-check {
	color: #00cc00;
	font-size: 2000% !important;
	-webkit-text-stroke: 2px #fff;
}

.tablet-item-wrapper {
	margin: auto;
	width: 100%;
}

.tablet-item-wrapper.checkin {
	max-width: 500px;
}

.tablet-label {
	padding: 0px;
	width: auto;
}

.tablet-section {
	position: absolute;
	top: 50%;
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.tablet-title {
	font-size: 275% !important;
}

.task-comment, .text-textarea {
	border: solid 1px gainsboro;
	border-radius: 25px;
	color: #333;
	display: block;
	line-height: 1.2;
	min-height: 40px;
	overflow: hidden;
	width: 100%;
}

.task-comment {
	border-radius: 10px;
}

.task-comment.child {
	margin-left: 30px;
}

.task-comment-actions {
	align-items: center;
	display: none;
	flex-wrap: nowrap;
	width: 100%;
}

.task-comment-actions.active {
	display: flex;
}

.task-comment-actions.bottom {
	border-top: solid 1px gainsboro;
	justify-content: flex-end;
}

.task-comment-actions.top {
	border-bottom: solid 1px gainsboro;
	gap: 15px;
	justify-content: space-between;
	padding: 10px;
}

.task-comment-allowedit {
	display: none;
}

.task-comment-allowedit.active {
	display: flex;
}

.task-comment-date {
	font-size: 80%;
}

.task-comment-edited {
	color: #aaa;
	font-size: 85%;
	margin-left: 10px;
}

.task-comment-icon {
	cursor: pointer;
	font-size: 110% !important;
	user-select: none;
}

.task-comment-icon.task-comment-views {
	cursor: auto;
}

.task-comment-name {
	font-size: 90%;
	width: 100%;
}

.task-comment-textarea, .text-textarea {
	padding: 10px 20px;
	resize: none;
}

.task-comment-textarea {
	min-height: 70px;
	overflow: auto;
	padding: 10px;
}

.task-comment-textarea[contenteditable]:empty::before, .text-textarea[contenteditable]:empty::before {
	content: "Text Message";
	color: #bbb;
	font-style: italic;
}

.task-comment-textarea[contenteditable]:empty::before {
	content: "Comment";
}

.task-comment-textarea:focus-visible, .text-textarea:focus-visible {
	outline: none;
}

.task-comments-container {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.tbl {
	border: solid 2px #e6e6e6;
	border-collapse: collapse;
	margin-top: 10px;
	width: 100%;
}

.tbl td {
	padding: 3px;
	text-align: center;
}

.tbl th {
	color: #fff;
	font-weight: bold;
	padding: 5px 5px;
	text-align: center;
}

.tbl tbody tr:nth-child(even), .tbl tbody tr:nth-child(even) select {
	background-color: #e6e6e6;
	border: solid 1px #e6e6e6;
}

.tbl tbody tr:nth-child(odd), .tbl tbody tr:nth-child(odd) select {
	background-color: #fff;
	border: solid 1px #fff;
}

.tbl tbody tr select {
	cursor: pointer;
}

.tbl tfoot tr {
	background-color: #ccc;
}

.tbl tfoot td {
	font-weight: bold;
	padding: 20px;
}

.tbl-action-check {
	height: 15px;
	margin: 0px;
	vertical-align: middle;
	width: 15px;
}

.tbl-action-wrapper {
	align-items: center;
	display: flex;
	margin: 15px 0px;
}

.tbl-action-wrapper > *:not(:first-child) {
	border-left: 1px solid #ccc !important;
}

.tbl-action-wrapper > .tooltip {
	padding: 0px 10px;
}

.tbl-btns {
	display: block;
	float: right;
}

.tbl-check {
	margin-left: auto;
	margin-right: auto;
}

.tbl-color {
	border: solid 1px gainsboro;
	border-radius: 50%;
	display: inline-block;
	height: 20px;
	width: 20px;
}

.tbl-comment {
	font-size: 24px !important;
	user-select: none;
}

.tbl-comment-number {
	background-color: #333;
	border-radius: 10px;
	bottom: 0px;
	color: #fff;
	font-size: 10px;
	height: 16px;
	position: absolute;
	right: -6px;
	text-align: center;
	top: -6px;
	user-select: none;
	width: 16px;
}

.tbl-comment-number.new {
	background-color: #dd0000;
}

.tbl-comment-number.orange {
	background-color: #ff8800;
}

.tbl-comment-number.view {
	padding: 2px;
}

.tbl-comment-wrapper, .tbl-file-wrapper {
	align-items: center;
	display: flex;
	gap: 5px;
	position: relative;
	width: fit-content;
}

.tbl-file-wrapper {
	justify-content: center;
	width: 100%;
}

.tbl-icon-container {
	height: fit-content;
	padding: 5px 0px;
	width: fit-content;
}

.tbl-img {
	height: 45px;
	object-fit: cover;
	vertical-align: middle;
	width: 45px;
}

.tbl-img.inline {
	display: inline-block;
	margin-right: 8px;
}

.tbl-img.round {
	border-radius: 40px;
}

.tbl-img.small {
	height: 30px;
	width: 30px;
}

.tbl-label {
	padding: 10px !important;
	white-space: nowrap;
}

.tbl-select {
	border: none;
	border-radius: 0px;
	font-size: 90%;
	margin: 0px;
	padding: 12px 5px;
	width: 100%;
}

.tbl-txt {
	font-size: 90%;
}

.tbl-wrapper {
	overflow-x: auto;
	width: 100%;
}

.td-sub, .text-grey {
	color: #999;
}

.text-clear {
	clear: both;
}

.text-light {
	color: #fff;
}

.text-message-container {
	margin-bottom: 20px;
	margin-top: 20px;
	max-height: 50vh;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 0px 10px;
}

.text-received, .text-sent {
	border-radius: 22px;
	line-height: 1.2;
	margin-bottom: 20px;
	max-width: 80%;
	padding: 10px 20px;
	position: relative;
	width: max-content;
}

.text-received {
	background-color: #eee;
	float: left;
}

.text-received:before {
	content: "";
	position: absolute;
	z-index: 2;
	bottom: -2px;
	left: -7px;
	height: 20px;
	border-left: 20px solid #eee;
	border-bottom-right-radius: 16px 14px;
	transform: translate(0, -2px);
	-webkit-transform: translate(0, -2px);
}

.text-received:after {
	content: "";
	position: absolute;
	z-index: 3;
	bottom: -2px;
	left: 4px;
	width: 26px;
	height: 20px;
	background: white;
	border-bottom-right-radius: 10px;
	transform: translate(-30px, -2px);
	-webkit-transform: translate(-30px, -2px);
}

.text-send-wrapper {
	align-items: center;
	display: flex;
}

.text-send-wrapper i {
	color: #0C58A1;
	margin: 10px;
}

.text-sent {
	background-color: #0C58A1;
	color: #fff;
	float: right;
}

.text-sent:before {
	content: "";
	position: absolute;
	z-index: 0;
	bottom: -2px;
	right: -7px;
	height: 20px;
	border-right: 20px solid #0C58A1;
	border-bottom-left-radius: 16px 14px;
	transform: translate(0, -2px);
	-webkit-transform: translate(0, -2px);
}

.text-sent:after {
	content: "";
	position: absolute;
	z-index: 1;
	bottom: -2px;
	right: -56px;
	width: 26px;
	height: 20px;
	background: white;
	border-bottom-left-radius: 10px;
	transform: translate(-30px, -2px);
	-webkit-transform: translate(-30px, -2px);
}

.ticket-event-container, .activity-container {
	align-items: center;
	border-bottom: solid 1px #e2e2e2;
	border-left: solid 1px #e2e2e2;
	border-right: solid 1px #e2e2e2;
    display: flex;
    flex-wrap: nowrap;
    gap: 2px 15px;
    padding: 10px;
	width: 100%;
}

/*.ticket-event-container:first-child {
	border-top: solid 1px #ddd;
}*/

.ticket-event-container:last-child, .activity-container:last-child {
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}

/*.ticket-event-container > *, .activity-container > * {
	flex: 1;
}*/

.ticket-event-container .ticket-event-btn-container, .ticket-event-container .ticket-event-img-container, .activity-container .activity-btn-container, .activity-container .activity-img-container {
	flex: none;
}

.ticket-event-date, .ticket-event-title, .activity-date, .activity-title {
	font-weight: 500;
}

.ticket-event-date, .ticket-event-location, .ticket-event-remaining, .activity-date, .activity-location, .activity-remaining {
	font-size: 80%;
}

.ticket-event-filter, .activity-filter, .signup-event-filter {
	appearance: auto;
	border-radius: 10px;
}

.ticket-event-img, .activity-img, .signup-event-img {
	border-radius: 10%;
	object-fit: cover;
    height: 90px;
    width: 90px;
}

.ticket-event-location, .activity-location {
	color: #555;
	font-size: 75%;
}

.ticket-event-location-container, .activity-location-container {
	min-width: 275px;
	width: 33%;
}

.ticket-event-section, .activity-section {
	padding: 20px 0px 40px 0px;
}

.ticket-event-section-title, .activity-section-title {
	align-items: center;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	color: #fff;
	display: flex;
	font-size: 140%;
	font-weight: bold;
	gap: 0px 7px;
	padding: 20px;
}

.ticket-event-section-title .material-symbols-outlined, .activity-section-title .material-symbols-outlined {
	font-size: 115%;
}

.ticket-event-title-container, .activity-title-container {
	width: 100%;
}

.time-slot {
	display: inline-block;
	width: 150px;
}

.tile-overlay-content {
	align-items: center;
	background-color: #333;
	border-radius: 5px;
	display: none;
	padding: 5px;
	position: absolute;
	right: 10px;
	top: 10px;
	transition: 0.5s;
}

.tile-overlay-content .icon-button, .form-field-overlay .icon-button, .form-layout-menu .icon-button {
	color: #fff !important;
	cursor: pointer;
	margin: 2px;
}

.tile-overlay-content .icon-button:hover, .form-field-overlay .icon-button:hover, .form-layout-menu .icon-button {
	transform: scale(1.1);
}

.time-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
}

.timer-text {
	font-size: 120%;
	font-weight: bold;
	text-align: center;
}

.tip, .error-tip {
	font-size: 80%;
	padding: 5px 0px;
	text-align: center;
}

.title, h1 {
	font-size: 160%;
	font-weight: bold;
	padding: 20px;
	text-align: center;
}

.tooltip {
	display: inline-block;
	flex-grow: 0;
	position: relative;
	padding: 0px 2px;
	width: fit-content;
}

.tooltip:hover .tooltiptext {
	display: block;
}

.tooltip-img {
	background-color: #333;
	border-radius: 6px;
	bottom: 100%;
	color: #fff;
	font-size: 80%;
	right: 0;
	min-width: 42px;
	opacity: 0.9;
	padding: 5px 8px;
	position: absolute;
	text-align: center;
	z-index: 1;
}

.tooltip-img::after {
	border-color: #333 transparent transparent transparent;
	border-style: solid;
	border-width: 5px;
	content: "";
	margin-left: -5px;
	opacity: 0.9;
	position: absolute;
	left: 50%;
	top: 100%;
}

.tooltip-wrapper {
	margin: 5px 0px;
}

.tooltiptext {
	background-color: #333;
	border-radius: 6px;
	color: #fff;
	display: none;
	font-size: 70%;
	left: 100%;
	margin-left: 5px;
	min-width: 100px;
	padding: 5px 8px;
	position: absolute;
	text-align: center;
	top: 50%;
	transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
	user-select: none;
	z-index: 1;
}

.tooltiptext::after {
	border-color: transparent #333 transparent transparent;
	border-style: solid;
	border-width: 5px;
	content: "";
	margin-top: -5px;
	position: absolute;
	right: 100%;
	top: 50%;
}

.tooltiptext.info {
	min-width: 150px;
}

.tooltiptext.left {
	left: auto;
	right: 100%;
}

.tooltiptext.left::after {
	border-color: transparent transparent transparent #333;
	left: 100%;
	right: auto;
}

.tooltipevent {
	background-color: #333;
	border-radius: 6px;
	box-shadow: 1px 1px 3px 0px #888888;
	color: #fff;
	font-size: 75%;
	line-height: 1.5;
	max-width: 400px;
	min-width: 20%;
	padding: 15px;
	position:absolute;
	z-index:10001;
}

.tooltipevent.center {
	transform: translate3d(-50%,-100%,0);
}

.tooltipevent.left {
	transform: translate3d(0%,-100%,0);
}

.tooltipevent.right {
	transform: translate3d(-100%,-100%,0);
}

.tooltipevent::after {
	width:0;
	height:0;
	border:solid 5px transparent;
	border-bottom:0;
	border-top-color:#333;
	position: absolute;
	display: block;
	content: "";
	bottom:-4px;
	/*left:50%;*/
	transform:translateX(-50%);
}

.tooltipevent.center::after {
	left: 50%;
}

.tooltipevent.left::after {
	left: 10%;
}

.tooltipevent.right::after {
	left: 90%;
}

.tooltipevent::before{
	border-top-color:#333;
	bottom:-5px;
}

.ui-placeholder {
    background: #f2f2f2;
    position: relative;
}

.ui-placeholder:after, .ui-placeholder:before {
    content: " ";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 7px;
    /*background-color: #fff;*/
}

.ui-state-highlight {
	background-color: #99bbff !important;
	border: solid 1px #55aaff !important;
	color: #fff !important;
}

.ui-tooltip {
	background-color: #333;
	border: none !important;
	border-radius: 6px;
	box-shadow: 0 0 7px 1px rgba(0,0,0,0.3);
	color: #fff;
	font-family: var(--primary-font);
	font-size: 13px;
	max-width: 150px;
	white-space: pre-line;
}

.ui-tooltip::after {
	content: " ";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #333 transparent transparent transparent;
}

.upload-img-box {
	border: none;
	display: block;
	margin: 0px auto;
}

.waiver {
	margin-bottom: 8px;
}

.website-para {
	font-family: var(--primary-font);
	line-height: 1.4;
	margin: 20px 0px !important;
	width: 100%;
}

.website-title {
	font-size: 150%;
	font-weight: bold;
	margin: 0px !important;
	padding: 20px;
	text-align: center;
}

@media screen and (max-width: 920px), screen and (max-height: 550px) {
	
	.action-btn {
		height: 50px;
		width: 50px;
	}
	
	.action-btn-container {
		padding: 0px 2px;
	}
	
	.btn {
		gap: 0px 5px;
		min-width: 150px;
		padding: 12px 15px;
	}
	
	.btn-wrapper {
		min-width: 100px;
	}
	
	.check-text {
		max-width: 40px;
	}
	
	.dash-tile {
		box-shadow: none;
	}
	
	.dash-tile-data {
		margin-bottom: 20px;
	}

	.dash-tile-title {
		margin-bottom: 10px;
	}
	
	.div-btn {
		padding: 8px;
		width: calc(100% - 18px);
	}
	
	.flex-nowrap-wrapper {
		margin: 10px;
	}

	.flex-wrapper.more-gap {
		gap: 10px;
	}
	
	.footer-column-wrapper {
		text-align: center;
		width: 100%;
	}
	
	.footer-img {
		height: 50px;
		width: 50px;
	}
	
	.footer-txt {
		padding: 3px 0px;
	}
	
	.footer-wrapper {
		padding: 20px;
	}
	
	.forgot {
		width: 100%;
	}
	
	.form-img {
		max-height: 60px;
		max-width: 150px;
	}
	
	.form-input {
		min-width: 0px;
		width: 100%;
	}
	
	.form-input.short, .form-select.short {
		max-width: 120px;
	}
	
	.form-input.tiny {
		width: 48px;
	}

	.form-input-wrapper {
		margin: 5px 0px;
	}
	
	.form-input-wrapper > input:not([type=submit]):not([type=checkbox]):not([type=range]):not([type=file]), .form-input-wrapper > select, .form-input-wrapper > textarea {
		flex: none;
	}
	
	.form-label {
		width: 100px;
	}

	.form-label:not(.no-expand) {
		width: 100%;
	}

	.form-label.margin {
		margin-bottom: 5px;
	}
	
	.form-label.medium {
		width: 150px;
	}
	
	.form-label.long {
		width: 250px;
	}
	
	.form-password {
		min-width: 0px;
		width: calc(100% - 85px);
	}
	
	.form-section {
		padding: 10px 0px;
	}
	
	.form-section-line {
		margin: 30px 0px;
	}
	
	.form-select.tiny {
		max-width: 100px;
	}
	
	.header-filter {
		min-width: 100px;
	}
	
	.img-bgrnd-short {
		height: 150px;
	}
	
	.indent1 {
		padding-left: 10px;
	}
	
	.large-img {
		height: 80px;
		width: 80px;
	}
	
	.login-header {
		margin-bottom: 10px;
	}
	
	.login-img {
		max-height: 100px;
	}
	
	.login-section {
		justify-content: center;
		padding: 10px;
	}
	
	.login-section-bgrnd {
		width: 70%;
	}
	
	.logo-text {
		margin-left: 5px;
	}
	
	.medium-img {
		height: 50px;
		width: 50px;
	}
	
	.payment-form {
		width: 100%;
	}
	
	.payment-form.paypal {
		max-width: 100%;
	}
	
	.payment-form-wrapper {
		flex-wrap: wrap;
	}

	.popup-contents {
		padding: 25px;
	}

	.popup-footer {
		padding-bottom: 50px;
	}

	.popup-header .help-btn-container {
		right: 30px;
	}
	
	.popup-title {
		padding: 10px 0px;
	}
	
	.popup-window {
		width: 280px;
	}

	.popup-window.medium {
		width: 100%;
	}
	
	.pref-header-label {
		width: 100px;
	}
	
	.pref-header-label-btn {
		width: 40px;
	}
	
	.pref-header-label-full {
		width: 178px;
	}
	
	.pref-header-label-slider {
		width: 61px;
	}
	
	.pref-header-label-small {
		width: 120px;
	}
	
	.pref-header-label-tiny {
		width: 48px;
	}
	
	.pref-header-move {
		width: 24px;
	}
	
	.profile-menu-img {
		height: 15px;
		margin-right: 5px;
		width: 15px;
	}

	.progress-bar-text {
		font-size: 11px;
		top: 3px;
	}

	.progress-container {
		padding: 20px;
	}
	
	.rating-input {
		width: calc(100% - 150px);
	}
	
	.rectangle-img {
		height: 100px;
		width: 178px;
	}

	.search-list-image {
		width: 40px;
	}

	.search-list-item {
		gap: 5px;
	}
	
	.section-bgrnd, .section-bgrnd-accordion {
		margin: 0px;
		padding: 20px;
		width: auto;
	}
	
	.section-bgrnd:first-child {
		margin-top: 0px;
	}
	
	.section-bgrnd:last-child {
		margin-bottom: 0px;
	}
	
	.section-wrapper {
		box-shadow: none;
		margin: 0px;
	}
	
	.select-filter, .input-filter, .table-filter {
		padding: 8px;
	}
	
	.shift {
		margin-left: 0px;
	}
	
	.slider:before {
		height: 22px;
		width: 22px;
		left: 3px;
		bottom: 3px;
	}
	
	.ss-header-label-tiny {
		width: 58px;
	}

	.sub-tbl {
		font-size: 13px;
	}
	
	.switch {
		position: relative;
		display: inline-block;
		width: 54px;
		height: 28px;
	}
	
	.table-info {
		text-align: center;
	}

	.tablet-bgrnd {
		padding: 20px;
		width: auto;
	}

	.tbl-action-wrapper > .tooltip {
		padding: 0px 5px;
	}

	.tbl-comment-number {
		font-size: 8px;
		height: 12px;
		right: -4px;
		top: -4px;
		width: 12px;
	}

	.ticket-event-container, .activity-container {
		flex-wrap: wrap;
	}

	.ticket-event-container > *, .activity-container > * {
		flex: none;
		width: 100%;
	}

	.ticket-event-container:last-child, .activity-container:last-child {
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
	}

	.ticket-event-img, .activity-img {
		height: 60px;
		width: 60px;
	}

	.ticket-event-location-container, .activity-location-container {
		min-width: unset;
		width: 100%;
	}

	.ticket-event-section, .activity-section {
		padding-bottom: 20px;
	}

	.ticket-event-section:not(:first-of-type), .activity-section:not(:first-of-type) {
		padding-top: 20px;
	}

	.ticket-event-section-title, .activity-section-title {
		border-top-left-radius: 10px;
    	border-top-right-radius: 10px;
		gap: 0px;
		padding: 10px;
	}

	.ticket-event-title-container, .activity-title-container {
		flex-direction: row-reverse;
		justify-content: space-between;
	}

	.ticket-event-title-container > *, .activity-title-container > * {
		flex: 1;
	}
	
	.upload-img-box {
		max-width: 280px;
	}
	
	.website-para {
		margin: 10px 0px;
	}
	
	.website-title {
		padding: 10px;
	}

}

@media screen and (max-width: 500px) {

	.activity-container, .resource-timeslot-container {
		flex-wrap: wrap;
	}
	
	.activity-container > *, .resource-timeslot-container > * {
		width: 100%;
	}
	
	.header-filter {
		width: auto;
	}
	
	.header-filter-wrapper, .table-filter-wrapper {
		display: block;
		float: none;
		margin: 0px;
		padding-bottom: 5px;
		padding-top: 0px;
		text-align:center;	
	}

	.progress-container-bottom, .progress-container-top {
		justify-content: center;
	}
	
	.select-filter, .input-filter {
		margin: 0px auto;
		width: 168px;
	}

	.selectify-filter-wrapper i {
		font-size: 18px;
	}
	
	.selectify-input {
		padding-left: 25px;
	}
	
	.tbl-btns {
		float: none;
		text-align: center;
		width: 100%;
	}
	
}

@media screen and (max-width: 500px), screen and (max-height: 500px) {
	
	.form-input-wrapper {
		min-width: 0px;
		width: auto;
	}
	
	.form-section {
		padding: 10px 0px;
	}
	
	.header-filters {
		padding: 6px 10px;
	}
	
	.img-bgrnd {
		padding: 0px;
	}
	
	.input-filter, .select-filter {
		margin: 0px;
	}
	
	.input-filter, .select-filter, .table-filter {
		border-radius: 10px;
		height: auto;
		width: 168px;
	}
	
	.large-img {
		height: 100px;
		width: 100px;
	}
	
	.login-section-bgrnd {
		min-width: 200px;
		width: 90%;
	}
	
	.section-bgrnd {
		padding: 10px;
	}
	
	.tbl-img {
		height: 30px;
		width: 30px;
	}

	.tbl-img.small {
		height: 20px;
		width: 20px;
	}
	
}


/* Id Styling */


#bracket-wrapper, #dates-bracket-wrapper {
	overflow-y: auto;
	padding: 30px 0px;
}

#calendar {
	width: 100%;
}

#cart {
	cursor: pointer;
	text-align: right;
	width: 100%;
}

#cart-img {
	height: 40px;
}

#chart-dash {
	margin-top: 20px;
}

#contact-ques li, .reg-form-text-li {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
}

#contact-ques ul {
	margin-left: 0px !important;
}

/*#documentation-text {
	max-height: 500px;
	overflow-y: auto;
}*/

#editor-container {
	height: 300px;
}

#email-section a {
	color: -webkit-link;
	text-decoration: underline;
}

#header-bar {
	align-items: center;
	background-image: linear-gradient(#383838, #090909);
	box-shadow: 5px 5px 10px 0px #666666;
	display: flex;
	flex-wrap: nowrap;
	height: 60px;
	justify-content: space-between;
	padding: 0px 17px;
}

#header-logo {
	border-radius: 10px;
	height: 50px;
}

#header-logo-wrapper {
	align-items: center;
	cursor: pointer;
	display: flex;
	flex-wrap: nowrap;
}

#header-profile-img {
	border-radius: 50%;
	display: block;
	height: 45px;
	object-fit: cover;
	width: 45px;
}

#header-profile-menu {
	background-color: #fff;
	border: solid 1px #ddd;
	border-radius: 5px;
	box-shadow: 1px 1px 5px rgba(0,0,0,.28);
	font-size: 80%;
	overflow: hidden;
	padding: 10px 0px;
	position: absolute;
	right: 20px;
	top: 54px;
	transform: scaleY(0);
	transform-origin: top;
    transition: transform 0.4s ease-out;
	-webkit-transition: transform 0.4s ease-out;
	z-index: 2;
}

#header-profile-menu.open {
	transform: scaleY(1);
}

#header-profile-menu > div {
	align-items: center;
	background-color: #fff;
	cursor: pointer;
	display: flex;
	flex-wrap: nowrap;
	padding: 10px 15px;
}

#header-profile-menu div:hover {
    filter: invert(0.1);
    -webkit-filter: invert(0.1);
}

#header-profile-wrapper {
	cursor: pointer;
}

#header-wrapper {
	position: sticky;
	position: -webkit-sticky;
	position: -moz-sticky;
	position: -o-sticky;
	top: 0px;
	z-index: 996;
}

#loader {
	animation: spin 1.5s linear infinite;
	-webkit-animation: spin 1.5s linear infinite;
	border: 10px solid #f2f2f2;
	border-top: 10px solid #3498db;
	border-radius: 50%;
	height: 60px;
	left: calc(50% - 30px);
	position: fixed;
	top: calc(50% - 30px);
	width: 60px;
}

#loader-wrapper {
	align-items: center;
	background-color: #fff;
	display: flex;
	height: 100%;
	justify-content: center;
	left: 0px;
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 999;
}

@keyframes spin {
	0% { 
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform:rotate(0deg);
	}
	100% { 
		transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-o-transform: rotate(360deg);
	}
}

#login-bgrnd {
	background-image: url("../images/login-bgrnd.JPG");
}

#main-photo {
	height: 500px;
	width: 100%;
	z-index: auto;
}

/*#month {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
}

#month > div {
	flex: 1;
	margin: 0px 5px;
	
}

#month > div:first-child {
	cursor: pointer;
	text-align: right;
}

#month > div:last-child {
	cursor: pointer;
	text-align: left;
}*/

#page-bgrnd {
	background-color: #fff;
}

#page-bgrnd.fill {
	background-color: #d9d9d9;
	padding: 30px;
}

#page-bgrnd.full {
	min-height: 100vh !important;
}

#page-bgrnd.fill .section-bgrnd {
	border-radius: 20px;
}

#pass-btn {
	background-color: dodgerblue;
	border: solid 1px gainsboro;
	border-radius: 5px;
	color: white;
	cursor: pointer;
	margin: 5px 0px;
	padding: 10px;
	outline: none;
	text-align: center;
	width: 100%;
}

#profile-form-bgrnd {
	background-color: white;
	border-radius: 1px;
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, .2);
	justify-content: center;
	margin: 20px auto;
	max-width: 500px;
	min-width: 260px;
	padding: 30px;
	vertical-align: middle;
	width: 50%;
}

#reg-form-img {
	background-image: url("../images/login-bgrnd.JPG");
}

#roster-warnings-container {
	display: none;
}

#roster-warnings-container.open {
	display: block;
}

#stats-dash {
	text-align: center;
}

@media screen and (max-width: 920px), screen and (max-height: 550px) {
	
/*	#documentation-text {
		max-height: 250px;
	}*/
	
	#page-bgrnd.fill {
		padding: 20px;
	}
	
	#page-bgrnd.fill .section-bgrnd {
		border-radius: 0px;
	}
	
	#select-bgrnd {
		padding: 5px 0px;
	}
	
}

@media screen and (max-width: 500px), screen and (max-height: 500px) {
	
	#header-bar {
		height: 45px;
		padding: 0px 10px;
		text-align: center;
	}
	
	#header-logo {
		border-radius: 7px;
		max-height: 40px;
	}
	
	#header-profile-img {
		height: 34px;
		width: 34px;
	}
	
	#header-profile-menu {
		font-size: 14px;
		right: 10px;
		top: 42px;
	}
	
	#header-profile-menu div {
		padding: 5px 10px;
	}
	
	#header-profile-menu div:first-child {
		padding-top: 10px;
	}
	
	#header-profile-menu div:last-child {
		padding-bottom: 10px;
	}
	
	#login-bgrnd {
		background-image: none;
	}
	
}


/* Navigation menu styling */

.header-menu {
	align-items: center;
	cursor: pointer;
	display: none;
	flex-wrap: nowrap;
}

.header-menu.show {
	display: flex;
}

.menu-bar1.change {
	-webkit-transform: translate(0px, 9px) rotate(45deg);
	transform: translate(0px, 9px)  rotate(45deg);
}

.menu-bar2.change {
    opacity: 0;
}

.menu-bar3.change {
	-webkit-transform: translate(0px, -9px) rotate(-45deg);
	transform: translate(0px, -9px) rotate(-45deg);
}

.menu-bar1, .menu-bar2, .menu-bar3 {
	background-color: #fff;
	height: 3px;
	margin: 6px 0;
	transition: 0.5s ease-out;
	-webkit-transition: 0.5s ease-out;
	width: 30px;
}

.menu-txt {
	color: #fff;
    font-size: 90%;
    font-weight: bold;
	margin: 5px;
}

.menu-wrapper {
	border-bottom: solid 1px #C6C6C6;
}

.side-menu {
    overflow-x: hidden;
    overflow-y: auto;
	padding-bottom: 20px;
	padding-top: 60px;
	width: 250px;
    z-index: 2;
}

@media screen and (min-width: 921px), screen and (min-height: 551px) {
	.side-menu:hover::-webkit-scrollbar-thumb {
		background-color: #555;
	}
}

.side-menu::-webkit-scrollbar {
	width: 16px;
}

.side-menu::-webkit-scrollbar-track {
	border-radius: 10px;
}

.side-menu::-webkit-scrollbar-thumb {
	background-clip: content-box;
	border: 4px solid transparent;
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
	box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

.side-menu a, .menu-items {
	align-items: center;
	border-radius: 7px;
	color: #fff;
    display: flex;
	flex-wrap: nowrap;
	font-size: 85%;
	padding: 5px 12px;	
    text-decoration: none;
}

.side-menu a.active, .side-menu a:hover {
	background-color: #393939;
}

.side-menu > div:last-child {
	padding-bottom: 25px;
}

.side-menu-header {
	height: 60px;
}

.side-menu-header-img {
	border-radius: 10%;
	display: block;
	height: 85px;
	margin: 0px auto 30px auto;
	object-fit: cover;
	width: 85px;
}

.side-menu-img {
	display: inline-block;
	height: 24px;
	margin-right: 8px;
	object-fit: cover;
	width: 24px;
}

.side-menu-open {
	background-color: #fff;
	background-image: url(../images/open-arrow.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 10px;
	box-shadow: 0px 0px 3px 1px rgb(0,0,0,0.2);
	display: none;
	cursor: pointer;
	height: 100%;
	width: 15px;
}

.side-menu-toggle {
	align-items: center;
	background-color: #111;
	border-bottom-right-radius: 5px;
	border-top-right-radius: 5px;
	box-shadow: 0px 0px 8px 1px rgb(0,0,0,0.2);
	color: #fff;
	cursor: pointer;
	display: flex;
	font-size: 26px;
	height: 50px;
	justify-content: center;
	position: fixed;
	top: 50vh;
	width: 15px;
	z-index: 997;
}

.side-menu-toggle:before {
	content: '\203A';
}

.side-menu-toggle.active:before {
	content: '\2039';
}

.side-menu-toggle:hover {
	background-color: #393939;
}

.side-menu-toggle-wrapper {
	position: relative;
}

.side-menu-wrapper {
	background-color: #111;
	box-shadow: 0px 0px 8px 1px rgb(0,0,0,0.2);
	display: flex;
	flex-wrap: nowrap;
	height: 100vh;
	left: -250px;
	overflow: auto;
	position: fixed;
	top: 0px;
	transition: 0.5s ease-out;
	-webkit-transition: 0.5s ease-out;
	z-index: 997;
}

.side-menu-wrapper.open {
	left: 0px;
}

.side-menu-wrapper.right {
	height: calc(100% - 60px);
	left: auto;
	right: -250px;
	top: 60px;
}

.side-menu-wrapper.right.open {
	right: 0px;
}

@media screen and (max-width: 920px), screen and (max-height: 550px) {

	.header-menu {
		display: flex;
	}
	
	.menu-bar1.change {
		background-color: #fff;
		-webkit-transform: translate(0px, 0px) rotate(45deg);
		transform: translate(0px, 5.75px)  rotate(45deg);
	}

	.menu-bar3.change {
		background-color: #fff;
		-webkit-transform: translate(0px, 0px) rotate(-45deg);
		transform: translate(0px, -5.75px) rotate(-45deg);
	}

	.menu-bar1, .menu-bar2, .menu-bar3 {
		height: 2px;
		margin: 4px 0;
		width: 20px;
	}

	.side-menu {
		padding-top: 20px;
		width: 200px;
	}
	
	.side-menu::-webkit-scrollbar-thumb {
		background-color: #555;
		border-width: 6px;
	}

	.side-menu a {
		padding: 5px 5px 5px 10px;
	}
	
	.side-menu-header {
		height: 45px;
	}
	
	.side-menu-header-img {
		height: 50px;
		width: 50px;
	}
	
	.side-menu-img {
		display: inline-block;
		height: 18px;
		margin-right: 10px;
		width: 18px;
	}
	
	.side-menu-toggle-wrapper {
		display: none;
	}
	
	.side-menu-wrapper {
		height: calc(100vh - 45px);
		left: -200px;
		top: 45px;
	}
	
	.side-menu-wrapper.right {
		height: calc(100% - 45px);
		left: auto;
		right: -200px;
		top: 45px;
	}

}

@media screen and (max-width: 500px), screen and (max-height: 500px) {
	.side-menu a {
		font-size: 14px;
	}
}