/* GENERAL */
body {
	background: #fff;
	margin: 0 auto;
	overflow-x: hidden;
}

form {
	font-family: Jost;
	font-size: 0.9em;
	color: #444;
	margin: 0 auto;
	margin-top: 0px;
	margin-bottom: 0px;
	width: 100%;
	padding: 0px;
	width: 100%;
	line-height: 1.4em;
	overflow: hidden;
}

h1 {
	font-size: 2.0em;
	letter-spacing: 0.01em;
	color: #444;
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 30px;
	text-transform: none;
	line-height: 1.3em;
}

h2 {
	font-size: 1.6em;
	letter-spacing: 0.01em;
	color: #444;
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 20px;
	text-transform: none;
	line-height: 1.3em;
}

h3 {
	font-size: 1.3em;
	color: #666;
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 16px;
	line-height: 1.4em;
}

h4 {
	font-size: 1.2em;
	margin-bottom: 10px;
	color: #444;
	font-weight: 400;
}

table + h4 {
	margin-top: 50px;
}

.light { 
	color: #888;
	font-size: 0.9em;
}

/* BUTTONS */
input {
	font-family: Jost;
	font-size: 1.0em;
	padding: 4px 5px 6px 5px;
	border: solid 1px #ccc;
	border-radius: 3px;
}

	input::placeholder {
		color: #aaa;
	}

	input[type="text"]:read-only {
		background: #f8f8f8;
	}

	input[type="checkbox"] { 
		width:1.3em;
		height:1.3em;
		vertical-align:middle;
	}

	input[type="checkbox"] + label { 
		vertical-align:middle;
		padding-left:3px;
		padding-right:20px;
	}

	input:focus {
		outline: none;
		background: #f8f8f8;
	}

.input {
	font-family: Jost;
	font-size: 1.0em;
	padding: 4px 5px 6px 5px;
	border: solid 1px #ccc;
	border-radius: 3px;
}

.textinput {
	font-family: Jost;
	font-size: 1.0em;
	padding: 5px 5px 7px 5px;
	border: solid 1px #ccc;
	border-radius: 3px;
}

.warning, .box .textinput.warning, .box .input.warning {
	border: solid 1px #ffa500;
	background: #FFF2DD;
	color: #444;
	padding: 5px 5px 7px 5px;
	font-size:1.0em;
}

.button {
	padding: 4px 15px 6px 15px;
	border: solid 1px #ccc;
	background: #f8f8f8;
	color: #222;
	transition: 0.25s;
}

.button.large { 
	font-size:1.4em;
	padding:8px 25px;
	border-radius:5px;
}

	.button:hover { 
		background: #444;
		border: solid 1px #444;
		color: #fff;
		cursor: pointer;
	}

	.button:disabled { 
		opacity:0.25;
	}

		.button:disabled:hover {
			color: #222;
			border: solid 1px #ccc;
			background: #f8f8f8;
			cursor:default;
		}

.checkboxlist {
	background: #f8f8f8;
	padding: 10px;
	text-align: left;
	margin-bottom:0px;
}

	.checkboxlist td {
		min-width: 100px;
		padding-right: 30px;
		text-align: left;
	}

	.checkboxlist input[type="checkbox"], .checkboxlist input[type="radio"] {
		width: 1.4em;
		height: 1.4em;
		vertical-align: middle;
	}

	.checkboxlist label {
		padding-left: 5px;
		vertical-align: middle;
	}

/* LOGIN */
.login {
	position: absolute;
	left: 50%;
	margin-left: -180px;
	top: 240px;
	border: solid 1px #ddd;
	padding: 10px;
	padding-bottom: 60px;
	width: 340px;
}

	.login h1 {
		background: #145CAB;
		color: #fff;
		text-decoration: none;
		font-size: 1.2em;
		padding: 10px;
		margin-left: -10px;
		margin-top: -10px;
		width: 100%;
		text-align: center;
		margin-bottom: 20px;
	}

	.login .title {
		display: inline-block;
		width: 80px;
		margin-right: 10px;
		vertical-align: middle;
	}

	.login .value {
		display: inline-block;
		max-width: calc(100% - 90px);
		vertical-align: middle;
	}

	.login .clear {
		clear: both;
		height: 10px;
	}

	.login .loginbutton {
		position: absolute;
		bottom: 15px;
		right: 15px;
	}

	.login .forgottenpassword {
		position: absolute;
		bottom: 20px;
		left: 15px;
	}

	.login .warning {
		background: #cc0000;
		padding: 8px 10px;
		color: #fff;
		margin-top: 10px;
		margin-left: -10px;
		width: 100%;
		text-align: center;
		font-size: 1.0em;
	}

/* BREADCRUMB */
.breadcrumb {
	position: absolute;
	top: 125px;
	right: 20px;
	font-size:0.85em;
}

	.breadcrumb .breadcrumbitem {
		display: inline-block;
		vertical-align: middle;
		font-size: 1.2em;
	}

		.breadcrumb .breadcrumbitem .separator {
			padding: 0px 6px;
			margin: 0px;
			border: none;
		}

	.breadcrumb a:link, .breadcrumb a:active, .breadcrumb a:visited {
		text-decoration: underline;
		color: #2C95CE;
	}

		.breadcrumb a:link:hover, .breadcrumb a:active:hover, .breadcrumb a:visited:hover {
			text-decoration: underline;
			color: #38B9FF;
		}

	.breadcrumb .help {
		display: inline-block;
		margin-right: 10px;
		vertical-align: middle;
		height: 40px;
		opacity: 0.5;
		transition: 0.25s;
	}

		.breadcrumb .help:hover {
			cursor: pointer;
			opacity: 1;
		}

		.breadcrumb .help img {
			height: 100%;
		}

/* MAIN */
.main {
	min-height: 940px;
	background: #fff;
	display: inline-block;
	vertical-align: top;
	width: calc(100% - 290px);
	padding: 20px 30px 50px 30px;
	position: relative;
	flex: 1;
}

.mobileheader {
	display: none;
}

/* TOP MENU */
.topmenu {
	position: relative;
	height: 118px;
	overflow-y:hidden;
	width: calc(100% + 60px);
	background: #f8f8f8;
	margin-left: -30px;
	margin-top: -20px;
	margin-bottom: 30px;
}

	.topmenu .menuitem {
		display: inline-block;
		margin-top:9px;
		width: 100px;
		height: 100px;
		background: none;
		position: relative;
		transition: 0.25s;
		filter: grayscale(1);
	}

	.topmenu .menuitemselected {
		display: inline-block;
		width: 100px;
		height: 100px;
		background: none;
		position: relative;
		filter: grayscale(0);
	}

	.topmenu .menuitemselected {
		opacity: 1;
	}

	.topmenu .menuitem:hover {
		cursor: pointer;
		transition: 0.25s;
		filter: grayscale(0);
	}

	.topmenu .menuitem:hover {
		background: #eee;
	}

	.topmenu .pic {
		top: 10px;
		left: 20px;
		position: absolute;
		width: 60px;
		height: 60px;
		transition: 0.25s;
		opacity: 0.25;
	}

	.topmenu .menuitemselected .pic {
		filter: grayscale(0);
		top: 10px;
		left: 20px;
		position: absolute;
		width: 60px;
		height: 60px;
		transition: 0.25s;
		opacity: 1;
	}

	.topmenu .menuitem:hover .pic {
		transform: scale(1.08);
		filter: grayscale(0);
		opacity: 1;
	}

	.topmenu .pic img {
		width: 100%;
		height: 100%;
	}

	.topmenu .label {
		position: absolute;
		bottom: 3px;
		text-align: center;
		width: 100%;
		opacity: 1;
		line-height: 1.1em;
		font-size: 0.9em;
		height: 16px;
		overflow: hidden;
	}

	.topmenu .menuitem .label {
		opacity: 0.6;
	}

	.topmenu .menuitem:hover .label {
		opacity: 0.9;
	}

.controlpanel {
	display: flex;
}

/* LEFT MENU*/
.leftmenu {
	display: inline-block;
	width: 220px;
	max-width: 220px;
	border-right: solid 1px #ddd;
	min-height: 1000px;
	background: #f8f8f8;
	flex: 1;
}

	.leftmenu .logo {
		width: 200px;
		padding: 20px 10px;
		background: #fff;
		opacity: 1;
	}

		.leftmenu .logo img {
			width: 100%;
		}

	.leftmenu .username {
		width: calc(100% - 66px);
		padding: 10px 10px 12px 56px;
		font-size: 1.2em;
		background-color: #f8f8f8;
		background-image: url(/images/base/user.png);
		background-repeat: no-repeat;
		background-size: 30px 40px;
		background-position: 6px 12px;
		border-bottom: solid 1px #ccc;
		border-top: solid 1px #ccc;
		filter: grayscale(1);
	}

	.leftmenu .country .input {
		width: 100%;
		font-size: 1.2em;
		font-weight: 600;
		background: #FEFFE0;
		border: none;
		padding: 14px 10px;
	}

	.leftmenu .contry .input:focus {
		outline: none;
	}

	.leftmenu .provider { 
	}

	.leftmenu .provider .input {
		width: 100%;
		padding: 10px 10px;
		font-size: 1.2em;
		border: solid 1px #ddd;
		background: #fffbce;
	}

	.leftmenu .property .input {
		width: 100%;
		padding: 10px 10px;
		font-size: 1.2em;
		border: solid 1px #ddd;
		background: #e0ffff;
	}

	.leftmenu .menuitem {
		background: #f8f8f8;
		transition: 0.25s;
		width: calc(100% - 20px);
		padding: 8px 10px;
		font-size: 1.2em;
		border-bottom: solid 1px #ccc;
		position: relative;
		filter: grayscale(0);
	}

		.leftmenu .menuitem:hover {
			background: #eee;
			cursor: pointer;
		}

		.leftmenu .menuitem .pic {
			display: inline-block;
			width: 45px;
			vertical-align: middle;
			transition: 0.25s;
		}

		.leftmenu .menuitem:hover .pic {
			filter: brightness(0.9);
		}

		.leftmenu .menuitem .pic img {
			width: 30px;
			filter: grayscale(0);
		}

		.leftmenu .menuitem .label {
			display: inline-block;
			vertical-align: middle;
			width: calc(100% - 55px);
			margin: 0px;
			line-height: 1.4em;
		}

			.leftmenu .menuitem .label .light {
				color: #888;
				font-size: 0.85em;
			}

		.leftmenu .menuitem .toggle {
			position: absolute;
			right: 20px;
			top: 50%;
			margin-top: -12px;
			transition: 0.25s;
			display: none;
			opacity: 0.25;
		}

			.leftmenu .menuitem .toggle:hover {
				opacity: 0.75;
			}

	.leftmenu .menuitemselected {
		background: #2E9BD7;
		color: #fff;
		transition: 0.25s;
		width: calc(100% - 20px);
		padding: 8px 10px;
		font-size: 1.2em;
		border-bottom: solid 1px #ccc;
		position: relative;
		filter: brightness(0.96);
	}

		.leftmenu .menuitemselected .pic {
			display: inline-block;
			width: 45px;
			vertical-align: middle;
			transition: 0.25s;
			filter: brightness(10) grayscale(1);
		}

			.leftmenu .menuitemselected .pic img {
				width: 30px;
				filter: grayscale(0);
			}

		.leftmenu .menuitemselected .label {
			display: inline-block;
			vertical-align: middle;
			width: calc(100% - 55px);
			line-height: 1.4em;
		}

			.leftmenu .menuitemselected .label .light {
				color: #888;
				font-size: 0.85em;
			}

		.leftmenu .menuitemselected .toggle {
			position: absolute;
			right: 20px;
			top: 50%;
			margin-top: -12px;
			transition: 0.25s;
			display: none;
			opacity: 0.25;
		}

			.leftmenu .menuitemselected .toggle:hover {
				opacity: 0.75;
			}

/* FILTERS */
.filters {
	background: #f8f8f8;
	padding: 10px;
	display: inline-block;
	border: solid 0px #fff;
	border-radius: 5px;
}

.filters.extra-padding { 
	padding:20px;
}

.filters h4 { 
	margin-top:0px;
}

	.filters .filterblock {
		display: inline-block;
		background: #eee;
		color: #888;
		border-right: solid 1px #fff;
		padding: 4px 6px 6px 6px;
		min-width: 30px;
		text-align: center;
		transition: 0.25s;
		text-transform: uppercase;
	}

		.filters .filterblock:hover {
			cursor: pointer;
			filter: brightness(0.95);
		}

		.filters .filterblock.selected {
			background: #444;
			color: #fff;
		}

	.filters .box .button, .filters .boxgap .button {
		padding: 5px 20px 6px 20px;
	}

.section {
	display: inline-block;
	vertical-align: top;
	width: 1200px;
	margin-right: 50px;
	max-width: 100%;
}

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

.box {
	display: inline-block;
	vertical-align: middle;
	margin: 5px 10px 5px 0px;
}

	.box.top {
		vertical-align: top;
		margin-right: 50px;
		margin-bottom: 50px;
	}

	.box.align-top { 
		vertical-align:top !important;
	}

	.box.bottom {
		margin-bottom: 0px;
		vertical-align: bottom;
	}

	.box .info {
		color: #444;
		font-size: 0.9em;
		margin-bottom: 3px;
		padding: 0px;
		background: none;
	}

	.box h4, .boxgap h4 {
		margin-top: 0px;
		margin-left: 5px;
		margin-bottom: 5px;
		font-size: 1.0em;
		color: #444;
	}
	.box h5 { 
		font-weight:400;
		margin-top:0px;
		margin-bottom:5px;
		font-size:0.95em;
	}

	.box .warning {
		padding: 4px 10px 6px 10px;
		background: #ffa500;
		color: #fff;
		font-weight: 400;
		font-size: 1.2em;
	}

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

.boxgap {
	display: inline-block;
	vertical-align: middle;
	margin: 5px 40px 5px 0px;
}

.gap {
	display: inline-block;
	margin-right: 30px;
}

.box input[type="text"] {
	border: solid 1px #ddd;
	border-radius: 3px;
	padding: 5px 5px 7px 5px;
}

	.box input[type="text"]:read-only {
		background: #FFFB9E;
	}

.box input[type="submit"], .boxgap input[type="submit"] {
	border: solid 1px #aaa;
	border-radius: 3px;
	padding: 5px 20px 7px 20px;
	transition: 0.25s;
	background: #f4f4f4;
	color: #444;
}

	.box input[type="submit"]:hover, .boxgap input[type="submit"]:hover {
		border: solid 1px #444;
		background: #444;
		color: #fff;
		cursor: pointer;
	}

	.box input[type="submit"]:disabled {
		opacity: 0.5;
	}

		.box input[type="submit"]:disabled:hover {
			opacity: 0.5;
			background: #f4f4f4;
			border: solid 1px #aaa;
			cursor: default;
			color: #444;
		}

.clear {
	clear: both;
	height: 30px;
}

.clear.deep { 
	height:50px;
}

.clear10 {
	clear: both;
	height: 10px;
}

.clear20 {
	clear: both;
	height: 20px;
}

/* ITEMS */
.column { 
	display:inline-block;
	margin-right:50px;
	padding-right:50px;
	border-right: solid 1px #ddd;
	min-height:1000px;
	vertical-align:top;
	max-width: 300px
}

.column.right {
	margin-right:0px;
	padding-right:0px;
	border-right:none;
	max-width:2000px;
	width: calc(100% - 410px);
}

.foldericon {
	margin-right: 0px;
	width: 24px;
	height: 24px;
	padding-bottom:4px;
	background-image: url(/images/base/folder.png);
	background-size: 24px 24px;
	background-repeat:no-repeat;
	display:inline-block;
	vertical-align:middle;
}

	.foldericon.blue {
		background-image: url(/images/base/folder-blue.png);
	}

.folderlabel {
	display: inline-block;
	vertical-align: middle;
	padding-left: 5px;
	transition: 0.25s;
}

	.folderlabel:hover {
		text-decoration: underline;
		cursor: pointer;
	}

.tabs { 
	padding-bottom:0px;
	border-bottom: solid 1px #ddd;
	margin-bottom:30px;
}

.tabs .tab { 
	display:inline-block;
	border: solid 1px #ccc;
	border-bottom:none;
	border-radius:3px;
	padding: 10px 15px;
	font-size:1.1em;
	transition: 0.25s;
}

.tabs .tab:hover { 
	background: #f8f8f8;
	cursor: pointer;
}

	.tabs .tab.selected {
		background: #EAF2FF;
	}

		.tabs .tab.selected:hover {
			background: #D3E3FD;
		}

.item {
	border: solid 1px #ddd;
	border-radius: 5px;
	padding: 10px 30px 10px 15px;
	width: 250px;
	display: inline-block;
	margin-right: 20px;
	margin-bottom: 20px;
	vertical-align: top;
	transition: 0.25s;
	height: 100px;
	font-size: 1.0em;
	position: relative;
	line-height: 1.3em;
	box-shadow: 1px 1px 9px #ddd;
	background: #fff;
}

	.item.yellow {
		background: #FFF493;
	}

		.item.yellow.light {
			background: #FFFBD1;
		}

		.item.yellow.verylight {
			background: #FFFDF2;
		}

	.item.blue {
		background: #EFF9FF;
	}

.item.fade .bottomleft { 
	background: #ffa500;
}

.additem { 
	margin-top:40px;
}

	.additem .box select,
	.additem .box .multi-select-options,
	.additem .box .multi-select-container {
		vertical-align: top;
	}

.item.disabled { 
	opacity:0.5;
}

	.item.small {
		width: auto;
		max-width: 200px;
		height: auto;
		text-align: center;
		padding: 10px 20px;
		cursor: move;
		user-select: none;
	}

	.item.small.margin { 
		margin-top:20px;
	}

	.item:hover {
		filter: brightness(0.97);
		cursor: pointer;
	}

	.item h2 {
		font-size: 1.8em;
		margin-bottom: 10px;
		font-weight: 600;
	}

	.item h3 {
		color: #444;
		margin-bottom: 2px;
		font-weight: 600;
		line-height: 1.2em;
		height: 24px;
		overflow-y: hidden;
	}

	.item .clickable {
		position: absolute;
		left: 0px;
		top: 0px;
		height: 100%;
		width: calc(100% - 45px);
	}

	.item .bottomright { 
		position: absolute;
		right:10px;
		bottom:10px;
		height:32px;
		filter:grayscale(1);
		opacity:0.5;
		transition:0.25s;
	}

	.item .bottomright:hover { 
		cursor: pointer;
		filter:grayscale(0);
		opacity:1;
	}

	.item .bottomright img { 
		height:100%;
	}

	.item .bottomleft {
		position: absolute;
		left: 0px;
		bottom: 0px;
		padding:5px 12px 6px 12px;
		background:#444;
		border: solid 0px #fff;
		border-bottom-left-radius:5px;
		color: #fff;
	}

	.item .col {
		position: absolute;
		top: 8px;
		right: 8px;
		width: 12px;
		height: 12px;
		border-radius: 6px;
		border: solid 0px #fff;
	}

.line-item {
	margin-bottom:20px;
}

.line-item table { 
	padding:10px;
	background: #f8f8f8;
	width:auto;
}

.line-item-title  {
	font-weight:400;
	margin-bottom:6px;
	color: #666;
}

.line-item-value { 
	font-weight:500;
}

.response-table td { 
	min-width:140px;
}

.title {
	display: inline-block;
	vertical-align: middle;
	width: 150px;
	margin-right: 10px;
	color: #666;
}

.title.top { 
	vertical-align:top;
	padding-top:8px;
}

	.title.toptext {
		vertical-align: top;
		padding-top: 0px;
	}

.value {
	display: inline-block;
	vertical-align: middle;
}

.value input { 
	margin-right:10px;
}

	.value .info {
		padding: 6px 10px 8px 40px;
		background-image: url(/images/base/information.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: 10px 0px;
		background-color: #f8f8f8;
		font-size: 0.9em;
		margin: 2px 0px;
	}

.placemap {
	height: 450px; 
	width: 600px; 
	border: 1px solid #ccc;
}

.clearline {
	clear: both;
	height: 0px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: solid 1px #ddd;
}

.buttons {
	margin-top: 50px;
	margin-bottom: 20px;
	font-size:1.2em;
	min-height:90px;
}

	.buttons .button { 
		margin-right:20px;
	}

	.buttons .info-label {
		background: #2C95CE;
		padding: 10px 20px;
		border-radius: 5px;
		color: #fff;
	}

/* POPUPS */
.popupbg {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: url(/images/base/bg.png);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1000;
}

	.popupbg .popup {
		width: 400px;
		max-width:100%;
		height: 600px;
		background: #fff;
		padding: 20px;
		border-radius: 3px;
		position: relative;
		box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3);
	}

	.popup.addbooking { 
		width:500px;
		height:960px;
	}

.popup.takepayment {
	width: 360px;
	height: 320px;
}

	.popup.email-preview { 
		width:840px;
		height:780px;
	}

	.popup .buttons {
		position:absolute;
		bottom:20px;
		right:20px;
		margin-bottom:20px;
		min-height:50px;
	}

	.popup h2 {
		margin-left: -20px;
		margin-top: -20px;
		margin-bottom: 30px;
		padding: 15px 20px;
		width:100%;
		border-top-left-radius: 3px;
		border-top-right-radius: 3px;
		color: #fff;
		font-size: 1.5em;
		background: #145CAB;
	}

	.popup .title { 
		width:90px;
		margin-right:10px;
		display:inline-block;
		vertical-align:middle;
	}

	.popup .value {
		width:calc(100% - 110px);
		display:inline-block;
		vertical-align:middle;
	}

	.popup .value .input { 
		max-width:100%;
	}

	.popup .clear { 
		clear:both;
		height:12px;
	}

	.popup .clear.deep { 
		height:30px;
	}

	.popup .buttons { 
		position: absolute;
		bottom:-10px;
		right:0px;
	}

	.popup .button { 
		padding:7px 20px 8px 20px;
	}

	.popup .button.reduced {
		padding:5px 20px 6px 20px;
	}

	.button.close { 
		opacity:0.5;
		margin-right:10px;
	}

/* RESULTS */
.scrollable-table { 
	width:100%;
	overflow-x:auto;
}

.scrollable-table table { 
	min-width:1200px;
}

.results {
	margin-bottom: 20px;
	line-height: 1.5em;
}

	.results .pagenumber {
		display: inline-block;
		vertical-align: middle;
		padding: 2px 5px;
		background: #f8f8f8;
		transition: 0.25s;
		margin: 0px 3px;
		text-align: center;
		width: 12px;
	}

		.results .pagenumber:hover {
			cursor: pointer;
			background: #ddd;
		}

	.results .pagenumberselected {
		display: inline-block;
		vertical-align: middle;
		padding: 2px 5px;
		background: #444;
		color: #fff;
		margin: 0px 3px;
		text-align: center;
		width: 12px;
	}

/* TABLES */
.rowheader {
	background: #444;
	color: #fff;
}

	.rowheader.small {
		font-size: 0.85em;
		line-height: 1.5em;
	}

.rowtotal {
	background: #eee;
	color: #222;
	height: 50px;
}


.rowheader .light {
	color: #ccc;
}

	.rowheader .light.white {
		color: #fff;
	}

.rowheader td, .rowtotal td {
	padding: 8px 10px 12px 10px;
	font-size: 1.2em;
}

td a:link, td a:active, td a:visited {
	text-decoration: underline;
	color: #305f31;
	transition: 0.25s;
}

	td a:link:hover, td a:active:hover, td a:visited:hover {
		text-decoration: underline;
		color: #1b2b1c;
	}

.rowlight, .rowdark {
	background: #fff;
	color: #444;
	transition: 0.25s;
	line-height: 1.25em;
}

	.rowlight.selected, .rowdark.selected {
		background: #EAF2FF;
	}

.rowlight .button, .rowdark .button { 
	margin:3px;
}

	.rowlight.fade, .rowdark.fade {
		opacity: 0.75;
	}

	.rowlight td, .rowdark td { 
		height:36px;
	}

.rowsubrow {
	background: #f8f8f8;
	color: #444;
	transition: 0.25s;
	line-height: 1.25em;
}

.rowhighlight {
	background: #FFFBCE;
	color: #444;
	transition: 0.25s;
	line-height: 1.25em;
}

.rowlight.highlight, .rowdark.highlight {
	background: #FFFBCE;
	color: #444;
}

.rowlight:hover, .rowdark:hover, .rowhighlight:hover, .rowsubrow:hover {
	filter: brightness(0.95);
	color: #444;
}

.rowlight.nohover:hover, .rowdark.nohover:hover {
	filter: brightness(1);
	cursor: default;
}

.rowlight td, .rowdark td, .rowhighlight td, .rowsubrow td {
	padding: 10px;
	border-bottom: solid 1px #ddd;
}

	.rowlight td .extra, .rowdark td .extra, .rowhighlight td .extra {
		display: inline-block;
		vertical-align: middle;
		height: 28px;
		margin: 3px;
	}

.extra img {
	height: 100%;
}

.rowlight .controls, .rowdark .controls, rowhighlight .controls {
	background: #f8f8f8;
}

/* COLOUR PICKER */
.colourpicker .colourbutton {
	width: 20px;
	height: 20px;
	margin: 5px;
	display: inline-block;
	padding: 0px;
	border-radius: 50%;
	border: solid 0px #fff;
	transition: 0.25s;
}

	.colourpicker .colourbutton:hover {
		opacity: 0.8;
		cursor: pointer;
		width: 22px;
		height: 22px;
		margin: 4px;
	}

/* Colours */
.green {
	background: #35CC3F;
	color: #fff;
}

.red {
	background: #dd0000;
	color: #fff;
}

.amber {
	background: #ffa500;
	color: #fff;
}

.grey {
	background: #888;
	color: #fff;
}

.green.light, .red.light, .amber.light, .grey.light { 
	color: #222;
	font-size:1.0em;
}

.green.light {
	background: #EDFFEE;
}

.red.light {
	background: #FFEDED;
}

.amber.light {
	background: #FFF2DD
}

.grey.light { 
	background: #f8f8f8;
}

.coloured-label { 
	padding:7px 15px;
	border-radius:5px;
	font-size:1.1em;
}

.status { 
	padding:7px 20px;
	border-radius:3px;
	color: #fff;
	text-transform: capitalize;
	font-size:1.0em;
}

.results {
	margin-bottom: 20px;
	line-height: 1.5em;
}

	.results .pagenumber {
		display: inline-block;
		vertical-align: middle;
		padding: 2px 5px;
		background: #f8f8f8;
		transition: 0.25s;
		margin: 0px 3px;
		text-align: center;
		width: 12px;
	}

		.results .pagenumber:hover {
			cursor: pointer;
			background: #ddd;
		}

	.results .pagenumber.selected {
		background: #444;
		color: #fff;
	}

.event-count { 
	display:inline-block;
	overflow:hidden;
	padding:9px 10px;
	border: solid 1px #222;
	margin-left:-1px;
	margin-top:-1px;
	width:16px;
	text-align:center;
	margin-bottom:-4px;
	transition:0.25s;
}

.event-count:hover { 
	filter:brightness(0.95);
	cursor:pointer;
}

/* PHOTOS */
.photos .photo {
	display: inline-block;
	vertical-align: top;
	margin-right: 20px;
	margin-bottom: 20px;
	overflow-x:hidden;
	position: relative;
}

.photos .phototitle {
	position: absolute;
	bottom: 5px;
	padding: 5px 10px;
	width: calc(100% - 20px);
	background: url(/images/base/bg.png);
	color: #fff;
	font-size: 0.85em;
	max-height: 30px;
	line-height: 1.3em;
}

.photos .remove {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 24px;
	height: 24px;
	transition: 0.25s;
	opacity: 0.5;
}

	.photos .remove:hover {
		cursor: pointer;
		opacity: 1;
	}

.photos .photo img {
	height: 150px;
}

.photo-size {
	margin-top: 10px;
	padding: 5px 12px;
	background: #45A545;
	color: #fff;
	font-size: 1.0em;
	border-radius: 3px;
	display:inline-block;
}

.photo-clear { 
	clear:both;
	height:0px;
}

.photo-warning {
	margin: 10px 0px;
	padding: 5px 12px;
	background: #444;
	color: #fff;
	font-size: 1.0em;
	border-radius: 3px;
	display: inline-block;
}

/* FOOTER */
.footer {
	width: 100%;
	background: #145CAB;
	height: 20px;
	padding: 12px 0px 16px 0px;
	text-align: center;
	color: #fff;
}

.cke_mergefield {
	background-color: #fff3cd;
	border: 1px dashed #f0ad4e;
	padding: 2px 4px;
	border-radius: 3px;
	font-weight: bold;
	color: #8a6d3b;
}

/* Style the autocomplete list */
.ui-autocomplete {
	font-family: inherit; /* inherit from your page, or set explicitly */
	font-size: 0.9em; /* smaller text */
	background-color: #fff;
	border: 1px solid #ccc;
	list-style-type: none;
	padding: 0;
	margin: 0;
	max-height: 200px;
	overflow-y: auto;
	z-index: 10000;
}

/* Style each item */
.ui-menu-item {
	font-family: inherit; /* match your textbox font */
	font-size: inherit;
	padding: 5px 10px;
	cursor: pointer;
}

/* Highlighted item */
.ui-menu-item-wrapper.ui-state-active {
	background-color: #007b5e;
	color: #fff;
	font-weight: normal;
}

.event-question { 
	margin-bottom:15px;
	padding-bottom:15px;
	border-bottom: solid 1px #ddd;
}

.event-question-title { 
	margin-bottom:6px;
}

.tags h3 { 
	margin-top:20px;
	margin-bottom:0px;
	border-bottom: solid 1px #ddd;
	padding-bottom:2px;
}

.event .dates { margin-top: -10px;}

.event .dates td {
	width: 360px;
	border: solid 1px #8ED7FF;
	border-radius: 5px;
	padding: 10px;
	transition: 0.25s;
}

	.event .dates td:has(input[disabled]) {
		background: #eee;
		border: solid 1px #ccc;
		opacity: 0.7;
		cursor: not-allowed;
	}

	.event .dates td:has([data-booked="1"]) {
		background: #EAFFEA !important;
		border: 1px solid #8bc48b !important;
		opacity: 1;
	}

	.event .dates td:has([data-restricted="1"]) {
		background: #FFEDD1 !important;
		border: 1px solid #ffa500 !important;
		opacity: 1;
	}


	.event .dates td:hover {
		background: #f8f8f8;
	}

.event .dates table {
	border-collapse: separate;
	border-spacing: 0 10px;
}

.event .dates .fully-booked, .event .dates .limited-spaces, .event .dates .already-booked, .event .dates .age-restricted {
	background: #444;
	color: #fff;
	text-transform: uppercase;
	padding: 3px 10px 4px 10px;
	border-radius: 3px;
	font-size: 0.9em;
}

.event .dates .limited-spaces {
	background: #145CAB;
}

.event .dates .already-booked {
	background: #338700;
}

.event .dates .age-restricted {
	background: #BC7700;
}

.event .dates input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid #2C95CE;
	background: #fff;
	vertical-align: top;
	margin-top: 2px;
	cursor: pointer;
	margin-right: 10px;
	position: relative;
}

	.event .dates input[type="checkbox"]:disabled {
		border: 2px solid #bbb;
		background: #eee;
	}

	.event .dates input[type="checkbox"]:checked {
		background-color: #2C95CE;
	}

.event .dates td label {
	vertical-align: middle;
	cursor: pointer;
	display: inline-block;
	margin-left: 8px;
	vertical-align: top;
	max-width: 90%; /* Prevent overflow if needed */
	line-height: 1.8;
}

.event .dates td.highlighted {
	background: #CEEEFF;
}

@media (max-width: 960px) {
	form {
	}

	.leftmenu { 
		display:none;
	}

	.topmenu { 
		height:auto;
		padding-left:10px;
	}

		.topmenu .menuitem, .topmenu .menuitemselected {
			width: 90px;
			height: 90px;
		}

		.topmenu .menuitem .pic, .topmenu .menuitemselected .pic {
			width: 50px;
			height: 50px;
		}

	.breadcrumb { 
		display:none;
	}

	.main { 
		padding:20px;
	}

	.mobileheader { 
		display:block;
		height:105px;
		background: #f8f8f8;
		padding:10px 20px 20px 20px;
		margin-left:-30px;
		width:calc(100% + 20px);
		margin-top:0px;
		margin-bottom:0px;
	}

	.mobileheader .logo { 
		height:60px;
		margin-top:10px;
	}

	.mobileheader .logo img { 
		height:100%;
	}

		.mobileheader .loggedin {
			margin-top: 15px;
		}


	.breadcrumb { 
		top:110px;
	}

	.title { 
		display:block;
		margin-right:0px;
		margin-bottom:3px;
	}

	.value { 
		display:block;
		width:100%;
		margin-bottom:10px;
	}
}