/* 2025-10-09T23:46:16+02:00 */
/* general.css */
html {
	--club-color-bg-light: #2c57a7;
	--club-color-bg-light-aa: #728fc4;
	--club-color-txt-on-light: #ffffff;
	--club-color-bg-dark: #030089;
	--club-color-bg-dark-aa: #5755b0;
	--club-color-bg-dark-ff: #8180c4;
	--club-color-txt-on-dark: #ffffff;
	--club-color-table-title: #555555;
	--club-color-table-title-aa: #777777;
	--club-color-txt-on-table-title: #ffffff;

	--bgcolor-sorting: var(--club-color-table-title);
	--color-sorting: var(--club-color-txt-on-table-title);

	--bgcolor-total: var(--club-color-table-title);
	--color-total: var(--club-color-txt-on-table-title);

	--color-link: blue;

	--bgcolor-tblTitle: #fff;
	--color-tblTitle: #000;

	--bgcolor-odd: #f9f9f9;
	--bgcolor-even: #e9e9e9;

	--color-on-link: #ccc;
	--color-on-link-active: yellow;

	--font: Lucida Sans Unicode, Lucida Grande, sans-serif;
}

/**
 * LAYOUT
 */

html, body, table {
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-family: var(--font);
	font-size: 13px;
}
html, body {
	margin: 0;
	padding: 0;
	min-width: -webkit-fit-content;
	min-width: -moz-fit-content;
	min-width: fit-content;
}
html {
	height: 100%;
}
body {
	min-height: 100%;
	display: flex;
	flex-direction: column;
}

#frame {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 100vh;
	position: relative;
}
#header_row_2 {
	display: flex;
	flex-direction: row;
}
#upper_row_club_logo,
#td_leftframe_cal_etc {
	flex: 0 0 17rem;
	width: 17rem;
}
#td_leftframe_cal_etc {
	padding-bottom: 70px;
	position: relative;
}
@media (min-width: 1000px) {
	#left_frame_sticky.sticky,
	#left_frame_sticky2.sticky {
		width: 17rem;
		min-width: 0;
		position: fixed;
	}
	#left_frame_sticky2 .to-top {
		text-align: center;
	}
	#left_frame_sticky2 .to-top button {
		background: transparent;
		width: 100%;
		border: 0;
		font-weight: bold;
		color: var(--club-color-txt-on-light);
	}
	#left_frame_sticky2:not(.sticky) .to-top {
		display: none;
	}
}
#left_frame_footer_content {
	position: absolute;
	left: 0;
	bottom: 0;
	color: white;
	width: 17rem;
	text-align: center;
	line-height: 25px;
	height: 50px;
}
#left_frame_footer_content a {
	color: inherit;
}
#left_frame_footer_content .product-logo {
	display: block;
	margin: 0 10px;
}
#left_frame_footer_content .product-logo img {
	max-width: 100%;
	max-height: 100%;
}

#upper_row_club_banner {
	flex: 1;
	align-self: center;
}
#upper_row_club_address {
	flex: 0;
	display: flex;
	align-items: center;
}
#upper_row_club_address ul {
	margin: 0;
	padding: 0;
	columns: 2;
}
#upper_row_club_address li {
	list-style: none;
	padding-right: 20px;
	white-space: nowrap;
}
#upper_row_club_address a {
	color: inherit;
}
#tr_content {
	display: flex;
	flex-direction: row;
	flex: 1;
	-ms-flex: 1 0 0px;
}
.main-page-content-td {
	flex: 1;
	margin-left: 8px;
	z-index: 2;
	background: white;
}
.main-page-content {
	padding: 13px 5px 5px 5px;
	position: relative;
	z-index: 3;
	background: white;
	min-width: 34rem;
}
body.print .main-page-content {
	padding: 2px;
}

#left_frame_footer .product-logo {
	display: block;
	height: 50px;
}
#left_frame_footer .product-logo img {
	display: inline-block;
	max-height: 50px;
	max-width: 90%;
}



/**
 * HEADER
 */

img.clublogo {
	display: block;
	width: 17rem;
	height: 100px;
	object-fit: contain;
}



/**
 * COMPONENTS
 */

textarea:not(.code) {
	resize: vertical;
}
.wysiwyg-load,
.cke,
.cke.cke_reset {
	width: 720px;
}
.cke_chrome.cke_focus {
	outline: solid 1px blue !important;
	outline: -webkit-focus-ring-color auto 5px !important;
}

summary {
	white-space: nowrap;
}

details.costs-path {
	font-size: 80%;
	background-color: lightyellow;
	text-align: left;
}
details.costs-path p {
	margin: 0;
}

.with-save-footer {
	padding-bottom: 49px;
}
.save-footer {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	background: white;
	height: 33px;
	padding-top: 7px;
	padding-bottom: 7px;
	padding-left: calc(17rem + 13px);
	border-top: solid 2px black;
	text-align: center;
}



.hide-on-desktop {
	display: none;
}



/**
 * MESSAGES
 */

#message_s {
	display: block;
	margin: 0;
	padding: 5px;
}

#floating-message {
	position: fixed;
	bottom: 20px;
	left: 20px;
	padding: 7px 20px;
	z-index: 3423;
	font-weight: bold;
	font-size: 20px;
}

#message_s > li,
.message.info {
	display: block;
	list-style: none;
	margin-bottom: 6px;
	padding: 10px;
	background-color: #2c57a7;
	color: white;
}
#message_s > li.warning,
.message.warning {
	background-color: orange;
	color: black;
	padding: 10px;
}
#message_s > li.error,
.message.error {
	background-color: #c00;
	color: white;
}
#message_s > li.success,
.message.success {
	background-color: green;
	color: white;
}



/**
 * SCHEDULE/MOBILE/RESSTART BUTTONS
 */


.schedule-index-buttons {
	display: flex;
	flex-flow: row wrap;
}
.button2-container {
	display: inline-flex;
	flex-flow: row wrap;
}
.schedule-index-buttons input[type="radio"] {
	position: absolute;
	visibility: hidden;
	width: 0;
	height: 0;
}
.schedule-index-button,
.button2 {
	box-sizing: border-box;
	padding: 8px;
	margin: 0;
	font-size: 16px;
	border: solid 1px #ccc;
	color: inherit;
	text-align: center;
	background: #ddd;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eee), color-stop(100%, #ccc));
	background: -webkit-linear-gradient(top, #eee 0%, #ccc 100%);
	background: linear-gradient(to bottom, #eee, #ccc);
}
.schedule-index-button {
	display: block;
	float: left;
	width: 50%;
}
input:checked + .schedule-index-button,
.schedule-index-button:active,
.schedule-index-button:focus,
.schedule-index-button.selected,
.button2.active,
.button2:active,
.button2:focus {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d00), color-stop(100%, #b00));
	background: -webkit-linear-gradient(top, #d00 0%, #b00 100%);
	background: linear-gradient(to bottom, #d00, #b00);
	color: #fff !important;
}



/**
 * FORM ELEMENTS v3
 */

.form3 {
	max-width: 350px;
}
.form-item3,
.form-submit3{
	margin-bottom: 1em;
}
.form-item3-honey {
	height: 1px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0.01;
}
.form-item3 label {
	display: block;
	text-align: left;
	padding-bottom: 11px;
	position: relative;
	text-transform: uppercase;
	font-size: 90%;
	font-weight: bold;
}
.form-item3 label:after {
	content: "";
	display: block;
	height: 1px;
	width: 70%;
	background-color: #000;
	position: absolute;
	left: 0;
	bottom: 6px;
}
.form-item3 .widget .text,
.form-item3 .widget select,
.form-item3 .widget select * {
	background-color: #f7f7f7;
	color: #000;
	border: solid 1px #aaa;
	border-radius: 4px;
}
.button3 {
	border: 0;
	padding: 10px;
	text-align: center;
	border-radius: 4px;
	font-family: var(--font);
	font-size: inherit;
	font-weight: bold;
	cursor: pointer;
	background-color: #555555;
	background-color: var(--club-color-table-title);
	color: #ffffff;
	color: var(--club-color-txt-on-dark);
}
.button3.active,
.button3:hover,
.button3:active,
.button3:focus {
	text-decoration: none;
	background-color: #777777;
	background-color: var(--club-color-table-title-aa);
	color: #ffffff;
	color: var(--club-color-txt-on-dark);
}
.button3:disabled,
.button3:disabled:hover,
.button3:disabled:active,
.button3:disabled:focus {
	background-color: #aaa;
	cursor: not-allowed;
}


/**
 * RENDERED FORM ELEMENTS (v2.5?)
 */

.rendered-form {
	--widget-width: 280px;
}
.rendered-form input:not(.auto-width).text,
.rendered-form select:not(.auto-width),
.rendered-form textarea:not(.auto-width) {
	width: var(--widget-width);
}
.rendered-form .ms-search + .br-user-select {
	width: calc(var(--widget-width) - 5em - .25em);
}

.oneBorder.rendered-form th.tblTitle {
	vertical-align: top;
	padding-top: 8px;
}

.form3.rendered-form input:not(.auto-width).text,
.form3.rendered-form select:not(.auto-width),
.form3.rendered-form textarea:not(.auto-width) {
	width: 350px;
}
.form3.rendered-form .ms-search + .br-user-select {
	width: calc(350px - 5em - .25em);
}



/**
 * DEBUG FOOTER
 */

details.debug {
	background-color: white;
	color: black;
}
details.debug summary {
	padding: 5px;
	border-top: solid 1px #000;
	cursor: pointer;
}
details.debug[open] summary,
details.debug summary:focus {
	background-color: #ddd;
}
details.debug > pre {
	padding: 0 10px;
}



.general-notice {
	position: relative;
	background: #387c9b;
	color: white;
	padding: 20px;
	padding-right: 40px;
}
.general-notice + .general-notice {
	margin-top: 10px;
}
.close-general-notice {
	position: absolute;
	right: 17px;
	top: 17px;
	padding: 2px;
}
.close-general-notice img {
	display: block;
}
.general-notice-content {
}
.general-notice-content > p:first-child {
	margin-top: 0;
}
.general-notice-content > p:last-child {
	margin-bottom: 0;
}
.general-notice-content a {
	color: yellow;
}
.general-notice-content a:hover,
.general-notice-content a:focus {
	color: white;
}



.mpc-sticky-wrapper,
.fold-in-menu-wrapper {
	position: sticky;
	top: 5px;
	right: 5px;
}
.mpc-sticky-wrapper.left {
	right: auto;
	left: 5px;
}
.mpc-sticky,
.fold-in-menu {
	position: absolute;
	top: 0;
	right: 0;
}
.mpc-sticky-wrapper.left .mpc-sticky {
	right: auto;
	left: 0;
}



.fold-in-menu {
	max-height: calc(100vh - 15px);
	overflow: hidden;
	overflow-y: auto;
	top: 13px;
	right: 5px;
}
.fold-in-menu-wrapper .fold-in-menu {
	top: 0;
	right: 0;
}
table.fold-in-menu,
.fold-in-menu > table,
.fold-in-menu > form > table {
	min-width: 9em;
}
.fold-in-menu:not(.folded-in),
.fold-in-menu-wrapper .fold-in-menu {
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}
.fold-in-menu.folded-in .fold-in-menu-section {
	display: none !important;
}
.fold-in-menu .fold-in-menu-toggler {
	padding: 0 !important;
}
.fold-in-menu:not(.fold-in-menu-inited) th.fold-in-menu-toggler {
	padding: 8px;
}
.fold-in-menu .menu-toggler-label {
	display: block;
	width: 100%;
	border: 0;
	background: transparent;
	color: inherit;
	font-weight: inherit;
	padding: 8px;
	cursor: pointer;
	text-align: center;
}
.fold-in-menu .menu-toggler-label:before {
	content: "- ";
}
.fold-in-menu.folded-in .menu-toggler-label:before {
	content: "+ ";
}



.ms-search + .br-user-select {
	margin-left: 0.25em;
}
.br-user-select + .ms-msg {
	margin-left: 0.25em;
}

.ms-search {
	width: 5em;
}
.ms-msg {
	color: green;
}
.ms-no-results {
	color: red;
}
.ms-too-many-results {
	color: #bbb;
}



ul.simple-td-list {
	margin: 0 0 0 1em;
	padding: 0;
}



.res-messages.has-messages {
	border: solid 1px red;
	background-color: #f7f7f7;
}



.to-mobile {
	font-size: 14px;
	text-transform: uppercase;
}

#header_row_1 {
	font-size: 13px;
	line-height: 28px;
	padding-right: 5px;
}
#header_row_1 .profile-link {
	padding-left: 22px;
	position: relative;
}
#header_row_1 .profile-link:not([href]):hover {
	text-decoration: none;
}
#header_row_1 .profile-avatar {
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -9px;
	height: 18px;
}
#header_row_1 .user-name {
	text-transform: uppercase;
	font-size: 12px;
}
#header_row_3 {
	height: 5px;
}

.form-item {
	margin-bottom: 6px;
}

#login-form-container {
	padding: 4px 8px;
}
#login-form-container form {
	margin-bottom: 1em;
}

h2.lcol-hd {
	margin: 0;
	padding: 2px 0 2px 8px;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 16px;
	line-height: 28px;
	text-align: center;
}

ul#main-menu,
ul#main-menu ul {
	display: block;
	margin: 0;
	padding: 0;
}
ul#main-menu ul { /* root */
	padding: 0 0 0 15px;
}
#main-menu li {
	list-style: none;
	display: block;
	padding: 0;
}
#main-menu a:first-child {
	display: block;
	position: relative;
	padding: 5px 0 5px 8px;
}
#main-menu li.active a:first-child {
	background-color: #030089;
	background-color: var(--club-color-bg-dark);
	color: #fff;
	color: var(--club-color-txt-on-dark);
}
#main-menu li.active a,
#main-menu li a:hover,
#main-menu li a:focus {
	position: relative;
	width: calc(100% + 6px);
}
#main-menu li a:hover,
#main-menu li a:focus,
#main-menu li.active a:hover,
#main-menu li.active a:focus {
	background-color: #728fc4;
	background-color: var(--club-color-bg-light-aa);
	text-decoration: none;
}
#main-menu a.nb {
	display: inline;
}

h1 {
	margin: 0 0 15px;
}

h1 + .menu {
	margin-top: -10px;
	padding-left: 15px;
}

p, ul, ol, .form-actions {
	margin: 15px 0;
}

fieldset {
	margin: 10px 0;
}
legend {
	font-size: 110%;
	font-weight: bold;
}

img.userpicture {
	max-width: 200px;
	max-height: 200px;
}

body.center {
	height: 100%;
}
body.center #content {
	display: table;
	height: 100%;
	width: 100%;
}
body.center #content > div {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}
body.center form {
	display: inline-block;
	text-align: left;
}

body.skeleton > div.padder {
	padding: 10px;
}
body.skeleton p,
body.skeleton h2,
body.skeleton h3,
body.skeleton table {
	margin: 0 0 12px;
}
body.skeleton .up {
	background: #f4f4f4;
	box-shadow: 0 0 15px #bbb;
}

td.checkboxified.checked.bg {
	background-color: #afa;
}
td.checkboxified.unchecked.bg {
	background-color: #faa;
}

table.reservation img.userpicture {
	max-width: 100px;
	max-height: 100px;
	display: block;
}

.bigger {
	font-size: 16px;
}
.big-notify {
	font-size: 22px;
}

.nosho {
	height: 0;
	overflow: hidden;
	visibility: hidden;
}

.pager a + a {
	margin-left: .25em;
}
.pager .active {
	display: inline-block;
	font-weight: bold;
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
}

p.p-error,
td.td-error {
	color: red;
	text-align: center;
}

p.overlay-footer {
	margin: 15px 0 0;
}

html.framework #frame .overlay-return {
	display: none;
 }

html table.oneBorder td.res-make-messages {
	background-color: #d00;
	color: #fff;
	padding: 8px;
}
td.res-make-messages > ul {
	margin: 0;
	padding: 0 0 0 25px;
}

table.oneBorder .flashable tr { -webkit-transition: background-color 2000ms ease-in; -moz-transition: background-color 2000ms ease-in; -o-transition: background-color 2000ms ease-in; }

.clear { clear:both; }

p.ntm { margin-top:0; }

#ajax_loading { z-index: 90000; position: fixed; top: 10px; left: 10px; display: none; background-color: white; border: solid 10px #777; }
#ajax_loading div { padding: 6px 10px; line-height: 1; border: solid 10px #f00; }
#ajax_loading td { font-size: 18px; font-weight: bold; color: red; }

.ab-display.interactive .ab-summary {
	cursor: pointer;
}

#mootooltip {
	background-color: #2c57a7;
	background-color: var(--club-color-table-title);
	color: #fff;
	color: var(--club-color-txt-on-table-title);
	border: solid 1px #fff;
	padding: 7px;
	max-width: 400px;
	min-width: 220px;
	word-wrap: break-word;
	display: none;
	z-index: 6;
}
#mootooltip.show {
	display: block;
}
html.nomootooltip #mootooltip.show {
	display: none;
}
#mootooltip > .title {
	font-weight: bold;
}

#mootooltip img {
	max-width: 100%;
}

#datepicker table,
#colorpickerdiv table {
	border: solid 1px black;
	background-color: white;
}
#datepicker input,
#colorpickerdiv input {
	font-size: 12px;
	width: 100%;
	padding: 2px;
}
#colorpickerdiv td {
	width: 12px;
	height: 12px;
}
#datepicker .title {
	white-space: nowrap;
}
#datepicker td {
	background-color: #666;
	color: #fff;
	text-align: center;
	cursor: pointer;
	width: 1.7em;
}
#datepicker tr.weekdays th {
	text-align: center;
}
#datepicker td.today {
	background-color: #a00 !important;
}
#datepicker table tfoot tr.footer th { padding:0; }

pre {
	font-size: 9pt;
	tab-size: 4;
}
form {
	margin: 0;
}

/*td { text-align:left; }*/

html.html h3.subtitle,
html.html p.subtitle {
	margin: -20px 0 0 10px;
}

a {
	color: blue;
	color: var(--color-link);
	text-decoration: none;
}
a img {
	border: 0;
}
a:hover,
a:focus {
	color: #555;
	text-decoration: underline;
}



input,
select,
textarea,
[contenteditable],
button {
	border: solid 1px #999;
	border-radius: 4px;
	font-family: var(--font);
	color: black;
	padding: 4px;
	font-size: 13px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
input:disabled,
select:disabled,
textarea:disabled,
[contenteditable]:disabled,
button:disabled,
input[readonly],
select[readonly],
textarea[readonly],
[contenteditable][readonly],
button[readonly] {
	background-color: #ddd;
}

input.see-through,
select.see-through,
textarea.see-through {
	background-color: transparent;
	color: inherit;
	font-weight: inherit;
}

::-moz-placeholder {
	color: #bbb;
}
::-webkit-input-placeholder {
	color: #bbb;
}
:-ms-input-placeholder {
	color: #bbb;
}
::placeholder {
	color: #bbb;
}

button.image {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
}
section.textarea {
	min-height: 100px;
}
input.checkbox,
input[type=checkbox],
input[type=radio],
input[type=file] {
	border: 0;
}
.block-labels label:after {
	content: "\A";
	white-space: pre;
}
.cols-3 {
	columns: 3;
	overflow: hidden;
}

textarea.code {
	font-family: monospace;
	white-space: pre;
	word-wrap: normal;
	tab-size: 4;
}
textarea.code.with-error {
	--error-line: -2;
	--error-size: 1;
	--line-height: 18px;
	line-height: var(--line-height);
	background-image: linear-gradient(
		to bottom,
		white calc((var(--error-line) - 1) * var(--line-height)),
		yellow calc((var(--error-line) - 1) * var(--line-height)),
		yellow calc((var(--error-line) + var(--error-size) - 1) * var(--line-height)),
		white calc((var(--error-line) + var(--error-size) - 1) * var(--line-height))
	);
	background-origin: content-box;
	background-attachment: local;
	background-repeat: no-repeat;
}

input.error,
textarea.error {
	border-color: red;
	outline: solid 1px red;
}

a.button,
a.button:hover,
a.button:focus,
input.button,
button.button {
	border: solid 1px #333;
	border-color: #ccc #333 #333 #ccc;
	padding: 6px 12px;
	font-size: 14px;
	color: black;
	text-decoration: none;
	background: #ddd;
	background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eee), color-stop(100%, #ccc));
	background: #ddd -webkit-linear-gradient(top, #eee 0%, #ccc 100%);
	background: #ddd linear-gradient(to bottom, #eee, #ccc);
	border-radius: 2px;
	cursor: pointer;
}
a.submit,
input.submit,
button.submit {
	font-weight: bold;
}
a.button:active,
input.button:active,
button.button:active {
	background: #bbb;
	background: #bbb -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ccc), color-stop(100%, #999));
	background: #bbb -webkit-linear-gradient(top, #ccc 0%, #999 100%);
	background: #bbb linear-gradient(to bottom, #ccc, #999);
	color: #fff !important;
}
a.button:disabled,
input.button:disabled,
button.button:disabled {
	opacity: 0.6;
	cursor: default;
}
a.button:not(.oncing):disabled,
input.button:not(.oncing):disabled,
button.button:not(.oncing):disabled {
	cursor: not-allowed;
}

html.html input.date,
html.html input.time,
html.html input.int,
html.html input.price,
html.html input.bigprice {
	text-align: center;
	padding-left: 1px;
	padding-right: 1px;
}
html.html input.date {
	width: 9em;
}
html.html input.color {
	width: 6em;
	text-align: left;
	font-family: monospace;
}
html.html input.time {
	width: 4.4em;
}
html.html input.int {
	width: 3em;
	text-align: center;
}
html.html input.bigint {
	width: 4.5em;
	text-align: center;
}
html.html input.price {
	width: 5.5em;
}
html.html input.bigprice {
	width: 6.5em;
}
html.html input.account-nr {
	width: 12.5em;
	text-align: left;
}
html.html input.ext-id {
	width: 5em;
}


/* IE10's 'clear cross' in EVERY input */
::-ms-clear {
	display: none;
}

/* number spinners */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
}
input[type=number] {
	-moz-appearance: textfield;
}


.b {
	font-weight: bold;
}
.unb {
	font-weight: normal;
}
.i {
	font-style: italic;
}
.u {
	text-decoration: underline;
}
.center, .c, .c td, .c th {
	text-align: center;
}
.right,
.c .right {
	text-align: right;
}
input.right {
	padding-right: .25em;
}
th,
.left,
.c .left,
table.left td,
.tblUpTitle.left,
.tblUpTitle th.left,
.tblUpTitle td.left,
.tblTitle > .tblUpTitle:not(.c):not(.right) {
	text-align: left;
}
.tblUpTitle th,
th.tblUpTitle {
	text-align: center;
}

.fl { float:left; }
.fr { float:right; }

.lbborder th.tblUpTitle,
.lbborder tr.tblUpTitle > th {
	padding-right: 6em;
}

.fw {
	width: 100%;
	display: block;
	box-sizing: border-box;
}
.h {
	cursor: pointer;
}
.move {
	cursor: move;
}
.help {
	cursor: help;
}
.no-records {
	font-style: italic;
	text-align: center;
}
.too-many-records {
	text-align: center;
	font-weight: bold;
	text-transform: uppercase;
	background-color: orange;
}

img.picker-icon {
	cursor: pointer;
	margin-left: 0.35em;
	height: 1.2em;
	min-height: 16px;
	vertical-align: middle;
}

p.help,
td.help,
ul.help,
ol.help,
div.help {
	cursor: default;
	font-size: 16px;
	color: #2C57A7;
}
p.help a,
td.help a,
ul.help a,
ol.help a,
div.help a {
	color: orange;
}

.button.cancel,
.red,
.help.red,
table tr td .red,
table tr th .red,
table tr td.red,
table tr th.red {
	color: red;
}
.green {
	color: green;
}
.lime {
	color: lime;
}
.black {
	color: black;
}
.white {
	color: white;
}
.blue {
	color: blue;
}
.orange {
	color: orange;
}

.reservation-warning > p:first-child {
	margin-top: 0;
}
.reservation-warning > p:last-child {
	margin-bottom: 0;
}

table.full-width {
	width: 99.6%;
}

table.oneBorder {
	border: solid 1px #ccc;
	background-color: #fff;
	border-spacing: 2px;
	color: #000;
}
table.oneBorder td,
table.oneBorder th {
	vertical-align: top;
	padding: 7px 6px;
	font-weight: normal;
}
table.oneBorder tr > .tblUpTitle,
table.oneBorder tr.tblUpTitle > *,
table.oneBorder tr.tblTitle > * {
	padding-top: 7px;
	padding-bottom: 7px;
	font-weight: bold;
}
table.oneBorder thead tr.tblTitle:first-child,
table.oneBorder thead tr.tblUpTitle:first-child + tr.tblTitle,
table.oneBorder thead tr.tblUpTitle:first-child + tr.tblTitle + tr.tblTitle {
	background-color: #eee;
}
table.oneBorder tr.top > *,
table.oneBorder tr > .top,
table.oneBorder tr > td[valign=top],
table.oneBorder tr > th[valign=top] {
	vertical-align: top;
}


span.status { display:inline-block; width:1.1em; height:1.1em; border-radius:20px; background-color:gold; }
span.status.red { background-color:red; }
span.status.green { background-color:green; }
span.status.blue { background-color:blue; }


html table.oneBorder.pad0 td,
html table.oneBorder.pad0 th,
html table.oneBorder tr.pad0 td,
html table.oneBorder tr.pad0 th,
html table.oneBorder td.pad0,
html table.oneBorder th.pad0 {
	padding-left: 0;
	padding-right: 0;
}

html table.oneBorder.pad1 td,
html table.oneBorder.pad1 th,
html table.oneBorder tr.pad1 td,
html table.oneBorder tr.pad1 th,
html table.oneBorder td.pad1,
html table.oneBorder th.pad1 {
	padding-left: 1px;
	padding-right: 1px;
}

html table.oneBorder.pad2 td,
html table.oneBorder.pad2 th,
html table.oneBorder tr.pad2 td,
html table.oneBorder tr.pad2 th,
html table.oneBorder td.pad2,
html table.oneBorder th.pad2 {
	padding-left: 2px;
	padding-right: 2px;
}

.tblTitle {
	background-color: #fff;
	background-color: var(--bgcolor-tblTitle);
}
.tblTitle,
.tblTitle a,
.tblTitle a:hover {
	color: #000;
	color: var(--color-tblTitle);
	font-weight: inherit;
}

.tblUpTitle {
	background-color: #555;
	background-color: var(--club-color-table-title);
}
.tblUpTitle,
.tblUpTitle a,
.tblUpTitle a:hover {
	color: #fff;
	color: var(--club-color-txt-on-table-title);
}

.tblSorting {
	background-color: var(--bgcolor-sorting);
}
.tblSorting,
.tblSorting a,
.tblSorting a:hover {
	color: var(--color-sorting);
}

.tblTotal {
	background-color: var(--bgcolor-total);
}
.tblTotal,
.tblTotal a,
.tblTotal a:hover {
	color: var(--color-total);
}



/* table zebra */
tr.tblTitle > * {
	border-bottom: solid 1px #999;
}
tr + tr.zebra > *,
tr + tr.even > *,
tr + tr.odd > *,
tbody + tbody.zebra > :first-child > *,
tbody + tbody.even > :first-child > *,
tbody + tbody.odd > :first-child > * {
	border-top: solid 1px #ccc;
}
.bg-odd {
	background-color: #eee;
}
.bg-even {
	/*background-color: #ddd;*/
}



tr.bt > *,
tr.even + tr.bt.odd > *,
tr.odd + tr.bt.even > * {
	border-top: solid 1px #111;
}
tr.bt3 > *,
tr.even + tr.bt3.odd > *,
tr.odd + tr.bt3.even > * {
	border-top: solid 3px #111;
}

tr.bb > *,
tr.even + tr.bb.odd > *,
tr.odd + tr.bb.even > * {
	border-bottom: solid 1px #111;
}
tr.bb2 > *,
tr.even + tr.bb2.odd > *,
tr.odd + tr.bb2.even > * {
	border-bottom: solid 2px #111;
}



/* new & old list/overview */
.tblUpTitle .on-link,
.tblUpTitle .on-link:hover {
	color: var(--color-on-link);
}
.tblUpTitle .on-link.on-active,
.tblUpTitle .on-link.on-active:hover {
	color: var(--color-on-link-active);
}



/* buyable period colors */
.buyable-past .buyable-period {
	color: red;
}
.buyable-future .buyable-period {
	color: blue;
}
.buyable-current .buyable-period {
	color: green;
}



/* membership pause */
a.ms-pause:not(.paused) {
	opacity: 0.3;
}



/* drag & hilite */
tr.iselected {
	background-color: rgba(255, 0, 0, 0.2);
}
tr.selected {
	background-color: rgba(255, 0, 0, 0.4);
}
tr.last-dragged {
	background-color: #C6F7C6;
}
tr.dragging,
tbody.hilited tr,
tr.hilited,
tbody.odd tr.hilited,
tbody.even tr.hilited,
td.hilited,
input.hilited,
.tblTitle.hilited,
.hilited > .tblTitle {
	background-color: #b9dde9;
}
html.animate tr.hl-ready {
	-webkit-transition: background-color 2000ms linear;
	-moz-transition: background-color 2000ms linear;
}

.drag-container .drag-handle {
	width: 30px;
	min-width: 30px;
	text-align: center;
	cursor: move;
}



input.noticing {
	border: solid 1px green;
	background-color: #eee;
}

.tooltip-tip {
	background-color: midnightblue;
	border: solid 1px white;
	padding: 5px;
	color: white;
	font-size: 12px;
	font-family: verdana;
	opacity: 0.85;
	filter: filter: alpha(opacity=85);
}

.club_light {
	background-color: #2c57a7;
	background-color: var(--club-color-bg-light);
	color: #fff;
	color: var(--club-color-txt-on-light);
}
.club_dark {
	background-color: #030089;
	background-color: var(--club-color-bg-dark);
	color: #fff;
	color: var(--club-color-txt-on-dark);
}
.club_light a,
.club_light a:hover,
.club_dark a,
.club_dark a:hover {
	color: inherit;
}


table.oneBorder.prompt tr > td,
table.oneBorder.prompt tr > th {
	padding: 7px 10px;
}
.oneBorder.prompt .message > div {
	max-width: 550px;
	margin: 0 auto;
	white-space: pre-line;
}


.required-label:after {
	content: " *";
	color: red;
	font-weight: bold;
}



.clearfix:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

@media print {
	#header_row_1,
	#header_row_2,
	#header_row_3,
	#td_leftframe_cal_etc {
		display: none;
	}
}

/* overlay.css */
div.lightbox table {
	background-color:#fff;
}
div.overlay {
	position: fixed;
	top: 0;
	left: 0;
	background: #fff url(/images/loader.gif) no-repeat center center;
	width: 100%;
	height: 100%;
	opacity: 0.6;
	filter: alpha(opacity=60);
	z-index: 6;
}
div.overlay.loaded {
	background-image: none;
}
div.lightbox {
	position: absolute;
	top: 0;
	left: 0;
	clear: both;
	padding-right: 15px;
	z-index: 6;
}
div.lightbox div.lbborder {
	border-radius: 5px;
	border: solid 0px #eee;
	box-shadow: 3px 3px 15px #aaa;
	background-color: #fff;
	padding: 7px;
	display: inline-block;
	position: relative;
}
div.lightbox div.lbborder .top-buttons {
	position: absolute;
	top: 1px;
	right: 0px;
	padding: 5px;
	background-color: white;
	border-top-right-radius: 5px;
}
div.lightbox div.lbborder .top-buttons a {
	display: block;
	float: left;
}
div.lightbox div.lbborder .top-buttons a + a {
	margin-left: .5em;
}
div.lightbox div.lbborder .top-buttons img {
	display: block;
}
td.draghandle, th.draghandle {
	cursor:move;
}




.lightbox.centerize {
	width: 100%;
	height: 100%;
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0;
	padding-right: 0;
	text-align: center;
}
.lightbox.centerize:before {
	content: "";
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -0.25em;
}
.lightbox.centerize .lbborder {
	display: inline-block;
	vertical-align: middle;
	text-align: left;
}

/* matrix.css */
#mootooltip .m-hilited {
	color: yellow;
	font-weight: bold;
}

table.matrix.invalid td {
	padding: 20px;
	font-size: 14px;
	width: 150px;
	color: red;
}

.mpc-sticky-wrapper {
	top: 0;
}
.mpc-sticky-wrapper.left .mpc-sticky.matrix-nav {
	left: 11px;
}
.matrix-nav {
	background: white;
	display: flex;
	padding: 20px;
	padding-left: 0;
	--hor-space: 20px;
}
.matrix-nav h1 {
	display: inline-block;
	margin-bottom: 0;
	margin-right: var(--hor-space);
	text-transform: uppercase;
	font-size: 22px;
	line-height: 30px;
	align-self: center;
	white-space: nowrap;
}
.matrix-nav a + h1 {
	margin-left: var(--hor-space);
}
.matrix-nav a.matrix-date-nav {
	align-self: center;
	font-size: 20px;
	line-height: 30px;
	height: 30px;
	width: 30px;
	min-width: 30px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	background: var(--club-color-table-title);
	color: var(--club-color-txt-on-dark);
	border-radius: 20px;
}
.matrix-nav a.matrix-date-nav.disabled {
	opacity: 0.5;
	pointer-events: none;
}
.matrix-nav a.matrix-date-nav:focus,
.matrix-nav a.matrix-date-nav:hover,
.matrix-nav a.matrix-date-nav:active {
	background: var(--club-color-table-title-aa);
	color: var(--club-color-txt-on-dark);
}
.matrix-nav a + a {
	margin-left: 5px;
}
.matrix-nav select {
	margin-left: var(--hor-space);
	text-transform: uppercase;
	font-weight: bold;
	border-radius: 4px;
}
.matrix-nav select option {
	font-weight: bold;
}
.matrix-nav .button3 {
	margin-left: var(--hor-space);
}

#ethrly-container {
	/*background: white;*/
	/*padding: 10px;*/
	/*box-shadow: -5px 5px 0px 10px rgba(255, 255, 255, 0.8);*/
}
#ethrly-button {
	display: flex;
	z-index: 4;
}
#ethrly-button a {
	text-align: center;
	font-weight: bold;
	font-family: sans-serif;
	text-transform: uppercase;
	color: black;
}
#ethrly-container.open #ethrly-button .toggle {
	margin-right: 20px;
}
#ethrly-container .toggle img {
	vertical-align: middle;
}
#ethrly-button a.refresh {
	margin-left: auto;
	align-self: center;
}
#ethrly-container:not(.open) .refresh,
#ethrly-container.open .toggle img,
#ethrly-container:not(.open) #ethrly-lights {
	display: none;
}
#ethrly-lights {
	margin-top: 10px;
	position: absolute;
	max-height: calc(100vh - 100px);
	overflow: auto;
}
#ethrly-lights table {
	margin-top: -1px;
	width: 100%;
}

#matrix_div {
	z-index: 3;
}

#matrix_div > #userclasses-activities-table {
	margin: 0 100px;
}
#userclasses-activities-table .activity-instance * {
	cursor: pointer;
}
#userclasses-activities-table img {
    max-width: 150px;
    max-height: 70px;
}

td.matrix-column {
	vertical-align: top;
}

table.matrix {
	--border-width: 1px;
	--background-color: white;

	font-size: 13px;
	font-family: var(--font);
	text-align: center;
	border-collapse: collapse;
	background: var(--background-color);

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

table.matrix td,
table.matrix th {
	padding: 4px;
	border: solid var(--border-width) #aaa6;
	cursor: default;
	width: 14em;
	font-family: var(--font);
	text-align: center;
}
table.matrix th.matrix-timeslot {
	padding: 2px 0;
	width: 1px;
	border: none;
}
table.matrix th.empty,
table.matrix td.empty {
	height: 1.4em;
}

table.matrix td.hilited-bound {
	opacity: 0.5;
}

table.matrix .matrix-header-force-width {
	width: 5.5em;
}
table.matrix .matrix-header th {
	padding: 5px;
}
table.matrix thead.matrix-header tr:first-child th {
	padding-top: 0;
}
table.matrix tfoot.matrix-header tr:last-child th {
	padding-bottom: 0;
}
table.matrix .matrix-header th.header-name {
	font-size: 110%;
}
table.matrix .matrix-header th {
	border: solid var(--border-width) white;
}

.matrix-header th.barbaan {
	padding: 0 !important;
}
.matrix-header th.barbaan button {
	display: block;
	width: 100%;
	padding: 5px;
	border: 0;
	background-color: black;
	color: white;
	font-weight: bold;
	cursor: pointer;
}
.matrix-header img {
	display: block;
	margin: 0 auto;
}

table.matrix img {
	max-width: 6.5em;
	max-height: 6.5em;
}

.matrix-timeslot.current-time {
	background-color: lightgreen;
}

img.matrix-userpic {
	max-width: 200px;
	max-height: 200px;
	margin-right: 5px;
}

#interactive-reservation-notice {
	position: fixed;
	bottom: 20px;
	right: 20px;
	display: block;
	padding: 20px;
	background: black;
	background: -webkit-linear-gradient(-45deg, #000 0%, #444 100%);
	background: linear-gradient(135deg, #000 0%, #444 100%);
	background-size: 400% 400%;
	color: white;
	z-index: 76543;
	border: solid 2px white;
	box-shadow: 0 0 0px 2px black;
	border-radius: 3px;

	-webkit-animation: hilite 3s ease infinite;
	-moz-animation: hilite 3s ease infinite;
	-o-animation: hilite 3s ease infinite;
	animation: hilite 3s ease infinite;
}
#interactive-reservation-notice,
#interactive-reservation-notice:focus,
#interactive-reservation-notice:hover {
	text-decoration: none;
}

.slot.slot.slot.slot.slot.moving,
.slot.slot.slot.slot.slot.copying,
.slot.slot.slot.slot.slot.opened {
	background: black;
	background: -webkit-linear-gradient(-45deg, #000 0%, #444 100%);
	background: linear-gradient(135deg, #000 0%, #444 100%);
	background-size: 400% 400%;
	color: white;

	-webkit-animation: hilite 3s ease infinite;
	-moz-animation: hilite 3s ease infinite;
	-o-animation: hilite 3s ease infinite;
	animation: hilite 3s ease infinite;
}
.slot.slot.slot.slot.slot.moving *,
.slot.slot.slot.slot.slot.copying *,
.slot.slot.slot.slot.slot.opened * {
	background: transparent none;
	color: white;
}



@-webkit-keyframes hilite {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}
@-moz-keyframes hilite {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}
@-o-keyframes hilite {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}
@keyframes hilite {
	0%{background-position:0% 50%}
	50%{background-position:100% 50%}
	100%{background-position:0% 50%}
}

/* calendar.css */
#tbl_calendar {
	border-collapse: collapse;
	width: 100%;
	min-width: 100%;
	font-size: 13px;
	-webkit-user-select: none;
	background-color: white;
}
#td_leftframe_cal_etc #tbl_calendar {
	border-right: solid 1px #999;
}
body.mobile #tbl_calendar {
	border: solid 1px #ddd;
}
#tbl_calendar #calendar_date_title,
#tbl_calendar .month.prev,
#tbl_calendar .weekdays td {
	border-right: 0;
}
#tbl_calendar #calendar_date_title,
#tbl_calendar .month.next,
#tbl_calendar .weekdays td {
	border-left: 0;
}
#tbl_calendar td:first-child {
	border-left: 0;
}
#tbl_calendar td:last-child {
	border-right: 0;
}
#tbl_calendar thead tr td {
	border-top: 0;
	background-color: #555555;
	background-color: var(--club-color-table-title);
	color: #ffffff;
	color: var(--club-color-txt-on-dark);
}
#tbl_calendar thead tr td,
#tbl_calendar tbody tr:last-child td {
	border-bottom: 0;
}
#tbl_calendar td {
	border: solid 1px #ddd;
	width: 20px;
	height: auto;
	overflow: hidden;
	text-align: center;
	color: #000;
	text-decoration: none;
	background-color: white;
	padding: 0;
}
#tbl_calendar #calendar_date_title {
	text-transform: uppercase;
}
#tbl_calendar tr.weekdays td {
	padding: 5px 0;
	background-color: white;
	color: black;
	font-weight: bold;
}
#tbl_calendar td.empty {
	color: #ccc;
}
#tbl_calendar td.today {
	background-color: #8180c4;
	background-color: var(--club-color-bg-dark-ff);
	color: #ffffff;
	color: var(--club-color-txt-on-dark);
}
#tbl_calendar td.selected {
	background-color: #030089;
	background-color: var(--club-color-bg-dark);
	color: #ffffff;
	color: var(--club-color-txt-on-dark);
}
#tbl_calendar thead td.month:hover,
#tbl_calendar tbody td:hover,
#tbl_calendar tbody td.empty:hover {
	background-color: #ddd;
	color: #000;
}
#tbl_calendar a,
#tbl_calendar a:hover,
#tbl_calendar a:focus {
	padding: 5px 0;
	color: inherit;
	text-decoration: none;
	display: block;
}

table + .sub-cal {
	margin-top: 0;
}
.sub-cal input {
	width: 100%;
}
.sub-cal.search + .sub-cal.search input {
	border-top: 0;
}

/* rc_popups.css */
.rc_popup {
	position: absolute;
	border: solid 1px #000;
	border-color: #bbb #555 #555 #bbb;
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-family: verdana;
	z-index: 114;
	white-space: nowrap;
}

.rc_popup li {
	display: block;
	list-style: none;
}
.rc_popup li.break {
	height: 6px;
	background-color: #eee;
}
.rc_popup li.hide-option {
	display: none;
}

.rc_popup a {
	display: block;
	padding: 2px 4px 2px 24px;
	background-color: #eee;
	background-position: 4px center;
	background-repeat: no-repeat;
	line-height: 24px;
	cursor: pointer;
	text-decoration: none;
	color: #333;
}

.rc_popup a:hover,
.rc_popup a:focus {
	color: #fff;
	background-color: #aaa;
}



table.rc_popup td {
	background-color: #eee;
	cursor: pointer;
	padding: 4px;
}
table.rc_popup tr:hover td {
	background-color: #aaa;
	color: #fff;
}
table.rc_popup td.a {
	width: 16px;
	text-align: center;
	border-right-width: 0;
}
table.rc_popup td.b {
	font-weight: normal;
	border-left-width: 0;
}
table.rc_popup td img {
	border: none;
	width: 16px;
	height: 16px;
}

table.rc_popup tr.break td,
table.rc_popup tr.break:hover td {
	background-color: #eee;
	height: 10px;
	font-size: 1px;
	padding: 0;
	cursor: default;
}

/* jonathan.css */
div.overlay {
	background-color: #000;
}

div.lightbox div.lbborder {
	box-shadow: 3px 3px 25px rgba(0,0,0,.3)
}

a.button, a.button:hover, a.button:focus, input.button, button.button {
	border: 0;
	box-shadow: none;
}

a.button:hover, button:hover, input.button:hover {
	opacity: .8;
}

.button.cancel {
	background: #EA0322;
	opacity: 0.7;
	color: #FFF;
}

a.submit, input.submit, button.submit {
	color: #171d2c
}

#mootooltip {
	border: 0;
	box-shadow: 3px 3px 25px rgba(0,0,0,.3);
}

.general-notice {
	background: rgb(56 124 155 / 80%);
	margin: 10px;
}

.players {
	font-size: .85rem;
}

#header_row_3 {
	display: none;
}

#header_row_2 {
	box-shadow: 1px 1px 10px rgba(0,0,0,.1);
	z-index: 6;
}