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

/* ============================================

ZIPPORAH BASE CSS FILE | IMPORTANT NOTICE

This CSS document controls the Zipporah framework, and should not be edited without first consulting the lead designer.
Please use the dedicated 'custom' CSS file for any configurations to the style of this project.

=============================================== */

:root {
	--zip-primary-color: #009ace;
	--zip-secondary-color: #005c7c;
	--zip-success-color: #00C853;
	--zip-highlight-color: #ff4e00;
	--zip-danger-color: #B00020;
	--zip-grey: #37474f;
	--zip-box-shadow: 0 1px 1px rgba(0,0,0,0.15), 0 2px 2px rgba(0,0,0,0.15), 0 4px 4px rgba(0,0,0,0.15);
	--zip-box-shadow-2: 0 1px 1px rgba(0,0,0,0.15), 0 2px 2px rgba(0,0,0,0.15), 0 4px 4px rgba(0,0,0,0.15), 0 8px 8px rgba(0,0,0,0.15), 0 16px 16px rgba(0,0,0,0.15);
	--zip-space-unit: 2rem;
	--zip-space-unit-minus: -2rem;
}
* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-family:'Open Sans', sans-serif;
}

html.overflow-disabled,
body.overflow-disabled {
	overflow: hidden;
}

/* == IE Fixes == */

header,
main,
footer,
nav {
	display: block;
}

/* == Zip Container == */

.zip-container {
	width:calc(100% - 40px);
	max-width:1000px;
	padding:0;
	margin:auto;
	height:auto;
	position:relative;
}

body.calendar-page .zip-container,
body.site-wide .zip-container{
	max-width:none;
}

/* === Responsive Layout === */

main.container,
main .container,
main.container-fluid,
main .container-fluid,
.calendar-header .container {
	width: calc(100% - 40px);
	margin: auto;
	padding: 0;
	max-width: 1000px;
	position: relative;
	height: auto;
	background-color: transparent;
}

main.container:before,
main .container:before,
main.container:after,
main .container:after {
	display: none;
}

.container-fluid {
	max-width: none !important;
}

.site-wide .container {
	max-width: none !important;
}

body.zip-site-wide main .container,
body.zip-site-wide main.container {
	max-width: none;
}

main .content {
	max-width: none;
	overflow-x: auto;
	overflow-y: hidden;
	padding-bottom: 10vh;
}

main .row,
main .row .row,
.zipporah-row {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	width: initial;
	margin: 0;
	padding: 0;
	margin-left: -4rem;
	align-items: flex-start;
	max-width: none;
}

main .row.spacing,
.zipporah-row.spacing {
	margin-top: -20px;
}

main .row.spacing>div,
.zipporah-row.spacing>div {
	padding-top: 20px;
}

/* FIX FOR IE */

main>.row {
	flex-wrap: nowrap;
}

@media(max-width:768px) {
	main>.row {
		flex-wrap: wrap;
	}
}

/* FIX FOR IE */

.row-reverse,
.flex.reverse {
	-webkit-flex-direction: row-reverse !important;
	-ms-flex-direction: row-reverse !important;
	flex-direction: row-reverse !important;
}

.flex {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
}

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

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

.flex.column {
	-webkit-flex-direction: column;
	/* Safari 6.1+ */
	flex-direction: column;
}

.flex-row,
.flex.no-wrap {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;
}

@media(max-width:768px) {
	.flex-row.collapse {
		display: block;
		flex-wrap: wrap;
	}
}

.center-align,
.flex.center,
.row.center {
	align-items: center;
}

main *[class*="xs-col"],
main *[class*="sm-col"],
main *[class*="md-col"],
main *[class*="lg-col"] {
	padding: 0;
	padding-left: 4rem;
	transition: 0.2s ease;
	-webkit-overflow-scrolling: touch;
	flex-shrink: 0 !important;
	flex-grow: 1;
}

main *[class*="col-1"] {
	width: 8.33333333%;
}

main *[class*="col-2"] {
	width: 16.66666667%;
}

main *[class*="col-3"] {
	width: 25%;
}

main *[class*="col-4"] {
	width: 33.33333333%;
}

main *[class*="col-5"] {
	width: 41.66666667%;
}

main *[class*="col-6"] {
	width: 50%;
}

main *[class*="col-7"] {
	width: 58.33333333%;
}

main *[class*="col-8"] {
	width: 66.66666667%;
}

main *[class*="col-9"] {
	width: 75%;
}

main *[class*="col-10"] {
	width: 83.33333333%;
}

main *[class*="col-11"] {
	width: 91.66666667%;
}

main *[class*="col-12"] {
	width: 100%;
}

@media (max-width: 650px) {
	main *[class*="sm-col"] {
		width: 100%;
		min-width: 100%;
	}
}

@media (max-width: 768px) {
	main *[class*="md-col"] {
		width: 100%;
		min-width: 100%;
	}
}

@media (max-width: 1200px) {
	main *[class*="lg-col"] {
		width: 100%;
		min-width: 100%;
	}
}

/* == Layout configuration === */

main,
main.container {
	margin-bottom: 4vh;
	min-height: 50vh;
}

.ui-widget main {
	margin-top: 0;
	margin-bottom: 0;
}

@media(max-width:768px) {
	main .menu {
		max-width: none !important;
		margin-bottom: 30px;
	}
}

/* === Typography === */

main h1,
main h2,
main h3,
main h4,
main h5,
main h6,
main p {
	margin-top: 0;
	padding-top: 0;
}

main h3,
main legend,
main fieldset legend {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 16px;
	border: none;
}

a,
main a {
	color: inherit;
	transition: 0.2s ease;
	cursor: pointer;
	border: none;
}

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

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

.text-right {
	text-align: right;
}

.text-uppercase,
.text-uppercase * {
	text-transform: uppercase;
}

.text-large,
.text-large * {
	font-size: 110%;
}

.text-small,
.text-small * {
	font-size: 90%;
}

.pageHint {
	text-decoration: none;
	display: block;
	margin-bottom: 8px;
	font-size: 12px;
}

.zip-field-required-asterisk {
	color: red;
	margin-left: 5px;
}

.errorText {
	color: red;
}

h3.error {
	color: red;
	margin: 2rem 0;
}

.column-count-2 {
	column-count: 2;
}

.column-count-3 {
	column-count: 3;
}

@media(max-width:550px) {
	.column-count-2,
	.column-count-3 {
		column-count: 1;
	}
}

/* === Zip Links === */

a.zip-link {
	color: #009ace;
	text-decoration: underline;
}

a.zip-link>.fa {
	margin-right: .6em;
}

a.zip-link.zip-link-danger {
	color: #B00020;
}

.zip-content p>a {
	color: #009ace;
	text-decoration: underline;
}

/* === Form Inputs & Buttons === */

main input[type="text"],
main input[type="tel"],
main input[type="search"],
main input[type="password"],
main input[type="file"],
main input[type="number"],
main span.ui-loader,
main select,
main textarea,
main input[type="text"][id*='Cancel'],
main .select2-container {
	display: inline-block;
	width: 100%;
	max-width: none;
	margin: 0;
	font-size:1em;
	padding: .5em;
	height: auto;
	line-height: 1;
	border: solid 1px rgba(0, 0, 0, 0.3);
	background-color: white;
	font-family: inherit;
}

main .validator.validator-email {
	margin-bottom:1rem;
}

main .select2-container--default .select2-selection--single {
	height: auto;
	border:none;
}

main .select2-container {
	padding: 0 !important;
}

main.select2-selection {
	background-color: transparent;
	margin-bottom: 0;
	padding: 0;
}

main .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 1;
	font-size: 1em;
	padding: .8em;
}

main .select2-container--default .select2-selection--single .select2-selection__arrow {
	top:50%;
	transform: translateY(-50%);
}

main .mce-tinymce.mce-container.mce-panel {
	margin-bottom: 16px;
}

main input:read-only,
main input[type="text"]:read-only {
	background:#eee !important;
	border:none !important;
	color:#444 !important;
	outline: none !important;
	cursor:initial !important;
}

#submitOrganisation,
#submitClient{
	border: 1.5px solid white !important;
	box-sizing: border-box;
}

main input[type="text"].hasDatepicker {
	cursor: pointer;
	background-image: url('../content/Images/zip-datepicker-icon.png');
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: left;
	padding-left: 2.5em;
}

main input[type="color"] {
	width: 32px;
	height: 32px;
	padding: 0;
	background: transparent;
	margin-right: 12px;
	border: none;
	cursor: pointer;
}

main select {
	cursor:pointer;
}

main textarea {
	overflow: auto;
	height: 150px;
}

main span.ui-loader input {
	margin: 0 !important;
	border: none;
	padding: 0 !important;
}

main span.ui-loader input[type="text"] {
	color: #333 !important;
}

main input[type="radio"],
main input[type="checkbox"] {
	display: inline-block;
	margin: 0;
	margin-right: 6px;
	width: auto;
}

main input[type="image"] {
	width: auto;
	border: none;
}

main input[type="file"] {
	background: rgba(0, 0, 0, 0.1);
}

main input[disabled],
main select[disabled],
main input[readonly],
main select[readonly],
main textarea[readonly] {
	border:none !important;
	background-color:rgba(0,0,0,0.1) !important;
}

main select[multiple] {
	background-image: none;
	min-height: 200px;
	max-height: 350px;
	padding: 0;
	overflow: auto !important;
}

main select[multiple] option {
	padding: 8px;
	font-size: 12px;
	border-top: solid 1px rgba(0, 0, 0, 0.1);
}

@media (max-width:550px) {
	main select[multiple] {
		min-height: 1px;
	}
}

main .checkbox-alternative {
	display: block;
	margin-bottom: 24px;
}

main .checkbox-alternative label {
	display: inline-block;
	cursor: pointer;
}

main .checkbox-alternative.full-width label {
	width: 100%;
	margin: 0 0 6px !important;
	border: none;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 3px;
}

main .checkbox-alternative.full-width label:hover {
	background-color: rgba(0, 0, 0, 0.15);
}

main .checkbox-alternative>label,
main .checkbox-alternative>.zip-editor-label>label {
	display: inline-block;
	padding: 12px 24px;
	margin: 4px 0px 24px 0;
	border: solid 1px rgba(0, 0, 0, 0.3);
	position: relative;
	transition: 0.2s ease;
	font-weight: normal;
	text-align: center;
}

main .checkbox-alternative>.zip-editor-label {
	display: inline;
}

@media(max-width:450px) {
	main .checkbox-alternative>label,
	main .checkbox-alternative>.zip-editor-label>label {
		display: block;
	}
}

main .checkbox-alternative>label:hover,
main .checkbox-alternative>zip-editor-label:hover>label {
	background: rgba(0, 0, 0, 0.1);
}

main .checkbox-alternative>input[type="checkbox"],
main .checkbox-alternative>input[type="radio"] {
	display: none;
}

main .checkbox-alternative>input[type="checkbox"]:checked+label,
main .checkbox-alternative>input[type="radio"]:checked+label,
main .checkbox-alternative>input[type="checkbox"]:checked+.zip-editor-label>label,
main .checkbox-alternative>input[type="radio"]:checked+.zip-editor-label>label,
main .checkbox-alternative>input[type="checkbox"]:checked+input[type="hidden"]+label,
main .checkbox-alternative>input[type="radio"]:checked+input[type="hidden"]+label,
main .checkbox-alternative>input[type="checkbox"]:checked+input[type="hidden"]+.zip-editor-label>label,
main .checkbox-alternative>input[type="radio"]:checked+input[type="hidden"]+.zip-editor-label>label {
	background-color: #00ff99;
	border-color: rgba(0, 0, 0, 0.1);
}

main .checkbox-alternative.list {
	display: flex;
	flex-flow: row wrap;
	margin: 0 0 24px;
	align-items: stretch;
	align-content: center;
}

main .checkbox-alternative.list label {
	display: flex;
	flex: 0 0 25%;
	max-width: 25%;
	text-align: left;
	justify-content: center;
	align-items: center;
	border-left-style: hidden;
	margin: 0;
	padding: 12px;
}

main .checkbox-alternative.list label:hover {
	background: rgba(0, 0, 0, 0.1);
}

main .checkbox-alternative.list label:nth-of-type(4n+1) {
	border-left-style: solid;
}

main .checkbox-alternative.list label:nth-of-type(n+5) {
	border-top: none;
}

@media(max-width:768px) {
	main .checkbox-alternative.list label {
		flex: 0 0 50%;
		max-width: 50%;
	}
	main .checkbox-alternative.list label:nth-of-type(n+3) {
		border-top: none;
	}
	main .checkbox-alternative.list label:nth-of-type(2n+1) {
		border-left-style: solid;
	}
}

@media(max-width:450px) {
	main .checkbox-alternative.list label {
		flex: 0 0 100%;
		max-width: 100%;
	}
	main .checkbox-alternative.list label:nth-of-type(n+2) {
		border-top: none;
	}
	main .checkbox-alternative.list label:nth-of-type(n+1) {
		border-left-style: solid;
	}
}

/* -- Zip Checkbox List -- */

ul.zip-checkbox-list {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	text-indent: 0;
}

ul.zip-checkbox-list>li {
	display: block;
	position: relative;
}

ul.zip-checkbox-list>li>input[type="checkbox"],
ul.zip-checkbox-list>li>input[type="radio"] {
	position: absolute;
	left: 0;
	top: 4px;
	margin: 0;
}

ul.zip-checkbox-list>li+li {
	margin-top: 8px;
}

ul.zip-checkbox-list>li>label,
ul.zip-checkbox-list>li>.zip-editor-label {
	line-height: 1.3;
	margin: 0;
	padding-left: 24px;
}

/* -- Labels -- */

main label,
main .zip-editor-label,
main .zip-label {
	display: inline-block;
	font-weight: 400;
	margin-bottom: .5em;
	padding-right: 12px;
	line-height: 1.3;
	font-size: 14px;
}

	main .zip-editor-label label,
	main .zip-editor-label .zip-editor-label {
		padding-right: 0;
		margin: 0;
	}

	main .zip-editor-label.blank {
		display: none;
	}

	main label.checkbox {
		margin: 0;
		margin-bottom: 16px;
	}

		main label.checkbox label,
		main label.checkbox .zip-editor-label {
			margin: 0 !important;
			padding: 0;
		}

main .zip-label-hidden {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}


main .btn,
main .btn-o,
main span.btn a,
main span.btn-o a,
main .btn-cancel,
main #backButton,
main #cancelButton,
main input#cancel,
main input#submitDelete,
main input.btn-cancel,
main input#back,
main input.btn-o,
main input[type="submit"],
main input[type="button"],
main button,
main input#btnCancelCSS {
	width: auto;
	display: inline-block;
	-moz-appearance: none;
	-webkit-appearance: none;
	padding: 8px 16px;
	text-align: center;
	text-decoration: none !important;
	border-radius: 3px;
	margin: 8px 0 16px;
	line-height: 1.2;
	cursor: pointer;
	border: solid 1px rgba(0, 0, 0, 0.02);
	font-size: 1em;
	vertical-align: middle;
	float: none;
	height: auto;
}

/* === Buttons === */

main .btn,
main .btn-o,
main span.btn a,
main span.btn-o a,
main .btn-cancel,
main #backButton,
main #cancelButton,
main input#cancel,
main input#submitDelete,
main input.btn-cancel,
main input#back,
main input.btn-o,
main input[type="submit"],
main input[type="button"],
main button,
main input#btnCancelCSS {
	width: auto;
	display: inline-block;
	-moz-appearance: none;
	-webkit-appearance: none;
	padding: 8px 16px;
	text-align: center;
	text-decoration: none !important;
	border-radius: 3px;
	margin: 8px 0 16px;
	margin-right: 10px;
	line-height: 1.2;
	cursor: pointer;
	border: solid 1px rgba(0, 0, 0, 0.02);
	font-size: 1em;
	vertical-align: middle;
	float: none;
	height: auto;
}

/* Primary buttons */

.btn,
span.btn a,
input[type="submit"],
input[type="button"],
button {
	background: lightgrey;
	color: inherit;
}

.btn:hover,
span.btn a:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover {}

/* Secondary buttons */

.btn-o,
span.btn-o a,
.btn-cancel,
input.btn-cancel,
input.btn-o,
#backButton,
#cancelButton,
input[type="submit"].btn-o,
input[type="button"].btn-o,
input#cancel,
input[id*='Cancel'],
input#back,
main input#btnCancelCSS,
.btn-cancel-link,
input[type="submit"].btn-cancel-link {
	background: lightgrey;
	color: inherit;
}

.btn-o:hover,
span.btn-o a:hover,
.btn-cancel:hover,
#backButton:hover,
#cancelButton:hover,
input#cancel:hover,
input[type="submit"].btn-o:hover,
input[type="button"].btn-o:hover,
input#submitDelete:hover,
input#back:hover,
main input#btnCancelCSS:hover,
.btn-cancel-link:hover,
input[type="submit"].btn-cancel-link:hover {}

main span.btn,
main span.btn-o {
	position: relative;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	margin: 0 !important;
}

main span.btn a,
main span.btn-o a {
	text-decoration: none;
}

main .btn.delete {
	background-color: red !important;
	color: white !important;
	border-color: red !important;
}

main .btn.full-width {
	width:100% !important;
}

main .btn-text {
	background:transparent !important;
	padding:0 !important;
	color:inherit !important;
	text-decoration:underline !important;
}

main a.zip-checkout-btn {
	float:right;
	clear: both;
	font-size: 14px;
	border:solid 1px #222;
	border-radius: 2px;
	color: #222;
	margin:0 0 2em;
	display: inline-block;
	position: relative;
	padding-left:4em;
	padding-right: 1em;
	padding-top: 1em;
	padding-bottom: 1em;
	line-height: 1em;
	text-decoration: none !important;
	font-weight: 600;
	background: linear-gradient(to right, #222 50%, #fff 50%);
	background: linear-gradient(to right, var(--zip-primary-color) 50%, #fff 50%);
	background-size: 300% 100%;
	background-position:right bottom;
	color: var(--zip-primary-color);
	border-color: var(--zip-primary-color);
}

main a.zip-checkout-btn:hover {
	background-position:left bottom;
	color: #fff;
	transition: 0.5s ease;
}

main a.zip-checkout-btn i.fa {
	margin-right: 6px;
}

main a.zip-checkout-btn .zip-checkout-btn-count {
	position: absolute;
	left:0;
	top:0;
	bottom: 0;
	background-color: #222;
	background-color: var(--zip-primary-color);
	color: white;
	width: 3em;
	display: flex;
	justify-content: center;
	align-items: center;
}

@media (max-width:650px) {
	main .btn,
	main .btn-o,
	main span.btn a,
	main span.btn-o a,
	main .btn-cancel,
	main #backButton,
	main #cancelButton,
	main input#cancel,
	main input#submitDelete,
	main input.btn-cancel,
	main input#back,
	main input.btn-o,
	main input[type="submit"],
	main input[type="button"],
	main button {
		margin-bottom: 8px;
		margin-right: 0;
	}
}

/* Basket buttons */

*[class*='basket-btn'],
input[type="button"][class*='basket-btn'] {
	display: inline-block;
	text-align: center;
	border-radius: 100%;
	width: 32px !important;
	height: 32px !important;
	border: solid 1px rgba(0, 0, 0, 0.5);
	color: rgba(0, 0, 0, 0.5);
	background: transparent;
	font-size: 18px;
	padding-top: 6px;
	text-decoration: none;
	font-family: arial, sans-serif;
	margin: 0;
	position: relative;
}

.basket-btn-remove:before {
	content: 'X';
	text-align: center;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 8px;
}

.basket-btn-remove:hover {
	color: red;
	border-color: red;
}

/* Form buttons for booking/deleting in tables */

table input[id*='bookButton'],
table input[type="submit"].book {
	background: green !important;
	border-color: green !important;
	color: white !important;
}

table input[id*='bookButton']:hover,
table input[type="submit"].book:hover {
	background: DarkGreen !important;
	border-color: DarkGreen !important;
}

table input[id*='delete'],
table input#submitDelete,
table input[id*='Delete'],
table span[id*='delete'],
table button[class*='delete'],
table input.delete,
table .btn.delete,
table span.btn.delete>a,
table span.btn>a {
	background-color: red !important;
	border-color: red !important;
	color: white !important;
}

span[id*='delete'] a {
	color: white !important;
}

input[type="submit"]:disabled {
	background: #ccc !important;
	border-color: #ccc !important;
}

/* Input and button grouping */

.group-input {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	margin-bottom: 16px;
}

.group-input * {
	margin: 0 !important;
}

.group-input input[type="button"] {
	min-width: 120px;
	background-color: #ccc;
	color: #222;
	border: solid 1px rgba(0, 0, 0, 0.1);
}

.group-input input[type="button"]:hover {
	background-color: #bbb;
}

.group-input *+* {
	margin-left: 12px !important;
}

/* Checkbox option formatting */

.checkbox-row {
	display: table;
}

.checkbox-row>input[type="checkbox"],
.checkbox-row>input[type="radio"],
.checkbox-row>label,
.checkbox-row>* {
	display: table-cell !important;
}

/* Forms */

main form,
main .btn-form,
.ui-widget form {
	display: inline;
}

main hr {
	width: 100%;
	border: none;
	border-top: dotted 1px rgba(0, 0, 0, 0.1);
	clear: both;
	margin: 24px 0 24px;
}

main .btn-form form {
	margin: 0;
	padding: 0;
	border: none;
	display: inline;
	width: auto;
}

main form+form {
	margin-top: 0;
}

main form form {
	margin: 0;
	padding: 0;
	border: none;
}

.form-no-border,
.form-no-border form {
	border-top: none !important;
	padding-top: 0 !important;
}

.ui-dialog {
	box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.5);
}

.form-pop-up {
	position: fixed;
	left: 16px;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	margin: auto;
	max-width: 500px;
	background: rgba(20, 20, 20, 0.95);
	border: solid 1px #222222;
	padding: 32px;
	z-index: 5000;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
	border-radius: 5px;
	color: white;
	text-align: center;
}

@media(max-width:768px) {
	main .btn-form form {
		margin: 0;
		width: 100%;
	}
}

/* Go Back navigation */

nav.back {
	margin: 0 0 3rem;
}

nav.back>form {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	border: none;
	padding: 1.3rem;
	margin: 0;
	vertical-align: middle;
	position: relative;
	background: rgba(0, 0, 0, 0.05);
	border-left: solid 1px rgba(0, 0, 0, 0.1);
}

nav.back>form>input#backButton {
	width: 100% !important;
	text-align: left !important;
	margin: 0 !important;
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
	color: inherit !important;
	padding: 0 !important;
	font-size: 15px;
}

nav.back>form:before {
	content: url(../content/Images/zipporah-back-icon.svg) !important;
	display: inline-block;
	width: 20px;
	vertical-align: middle;
	margin-right: 12px;
}

/* Select date in booking processes */

.select-appointment-date {
	position: relative;
	overflow: visible;
	margin-top: 8px;
}

.select-appointment-date a {
	text-decoration: none !important;
}

.select-appointment-date>a.select-date {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	padding: 8px 12px;
	color: white;
	background: #222222;
}

.select-appointment-date>a.select-date:hover {
	background: #666666;
}

.select-appointment-date>input[type="text"] {
	margin: 0;
	padding-left: 50px;
}

.select-appointment-date>#calendarSubmit {
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
}

.select-appointment-date+#calendarDatePicker {
	display: none;
}

.select-appointment-date {}

/* === Tables === */

main table {
	min-width: 100%;
	text-align: left;
	border-collapse: collapse;
	position: relative;
	font-size: 14px;
}

main table table {
	margin: 0;
	box-shadow: none;
	border: none;
	min-width: 0;
}

main table+table {
	margin-top: 24px;
}

main .content table+h3 {
	margin-top: 32px;
}

main table td,
main table th {
	font-weight: normal;
	padding: 12px;
	border: none;
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
	text-align: left;
	line-height: 1.3;
	vertical-align: top;
}

main table th,
main table thead th {
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	border-bottom: solid 1px rgba(0, 0, 0, 0.2);
	border-top: solid 1px rgba(0, 0, 0, 0.2);
}

main .ui-datepicker th,
main .ui-datepicker thead th {
	background: inherit;
	color: inherit;
}

main table tr:nth-of-type(odd)>td {
	background: #eee;
}


table tr.IsExpress>td {
	background: red !important;
	color: white !important;
}

table tr.IsExpress>td>a {
	color: white !important;
}

table tr.current-booking>td {
	background-color: #66ff66 !important;
}

table.striped td {
	border: none;
}

td form {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

main table td input,
main table td input[type="text"],
main table td select {
	padding: 5px 10px;
	margin: 0;
	background: transparent;
	min-height: 0;
	height: auto;
	width: auto;
	padding: 5px;
	line-height: 1;
}


main table td input[type="text"],
main table td select {
	width:100%;
}

#calendarResults table,
#calendarDatePicker table,
.ui-datepicker table {
	min-width: 0;
	margin-bottom: 0;
	margin-top: 0;
	max-height: none;
	overflow: none;
	display: table;
	border-collapse: separate;
}

table#BookingCalendarResultsTable {
	width: 100%;
}

*[id*="calendar"] #offSet {
	width: 16px !important;
}

main table td a {
	text-decoration: underline;
	white-space: nowrap;
}

main table td input[type="submit"],
main table td input[type="button"],
main table td button,
main table td .btn,
main table td .btn>a {
	padding: 5px 10px !important;
	margin: 0 !important;
	font-size: 14px;
	width: auto;
	display: block;
	white-space: nowrap;
}

table td img {
	min-width: 16px;
}

.table-overflow {
	overflow: auto;
	margin: 16px 0;
}

.table-overflow>table {
	margin: 0;
}

@media(max-width:768px) {
	.table-overflow {
		max-height: none;
	}
}

main table.calendar {
	min-width: 100%;
	width: auto;
	border: none !important;
	clear: both;
}

main table.calendar tbody {
	border: solid 1px rgba(0, 0, 0, 0.1);
}

main table.calendar td,
main table.calendar th {
	padding: 4px !important;
	text-align: center !important;
}

main caption {
	padding: 0;
	margin: 24px 0;
	text-align: left;
}

main caption>button,
main caption>button.btn {
	margin: 0;
}

/* Fixes an issue with the weekly calendar */

table.weekly_calendar_timeheader {
	width: auto;
}

table#tableContent,
table.zipporahTable {
	white-space: normal;
}

/* Colours for Tasks */

table tr.taskComplete td {
	background: #A8DBA8;
}

table tr.taskExpired td {
	background: #DD6646;
}

table tr.taskAttention td {
	background: #E0AB45;
}

/* Table Colours for booking status */

main tr.statusCancelled,
main tr.statusCancelledByCustomer,
main tr.statusCancelledCustomerVacant,
main tr.statusCancelledRequestedRefund,
main tr.statusCancelledTreatment,
main tr.statusDeleted,
main tr.Deleted {
	background-color: indianred !important;
	color: white !important;
}

main tr.statusMissed,
main tr.statusFailedCollection,
main tr.statusFailedGoodsNotOut,
main tr.statusFailedIncorretItems,
main tr.statusFailedNotCompleted,
main tr.statusFailedOversizedGoods,
main tr.statusPostponedCollection,
main tr.statusPostponedTreatment,
main tr.statusRefundRequested,
main tr.statusTemporary {
	background-color: orange !important;
}

main main tr.statusCollected,
main main tr.statusCompletedTreatment,
main main tr.statusClosed,
main main tr.statusRefunded,
main main tr.statusRefundIssued {
	background-color: lightgreen !important;
}

main tr.statusOpen,
main tr.statusProvisional,
main tr.statusRearrangedCollection,
main tr.statusRebookable,
main tr.statusRebooked,
main tr.statusRebookedTreatment {
	background-color: ;
}

/* Table colours for attendees in self arrival */

td.meetingAttended,
td.meetingAttended ~ td {
	background-color:white !important;
	opacity:0.5;
}

td.meetingAttending,
td.meetingAttending ~ td {
	background-color: lightgreen !important;
}

td.meetingDidNotAttend,
td.meetingDidNotAttend ~ td {
	background-color: indianred;
	color: white;
}

/* Remove style from tables */

table.no-style,
table.no-style>tbody,
table.no-style>tfoot,
table.no-style>thead,
table.no-style>tbody>tr>td,
table.no-style>tbody>tr,
table.no-style>tr>td,
table.no-style>tr,
tr.no-style,
tr.no-style>td {
	width: auto;
	padding: 0;
	background: transparent !important;
	color: inherit;
	vertical-align: top;
	min-width: 0;
	border: none;
	margin: 0;
}

table.no-style>tbody>tr>td+td,
table.no-style>tr>td+td {
	padding-left: 1rem;
}

main table.no-style>tbody>tr>td>input,
main table.no-style>tbody>tr>td>select,
main table.no-style>tbody>tr>td>textarea,
main table.no-style>tr>td>input,
main table.no-style>tr>td>select,
main table.no-style>tr>td>textarea {
	margin: 0 0 16px;
}

main table.no-style>tbody>tr>td>input[type="checkbox"],
main table.no-style>tbody>tr>td>input[type="radio"],
main table.no-style>tr>td>input[type="checkbox"],
main table.no-style>tr>td>input[type="radio"] {
	width: auto !important;
	margin-right: 8px;
}

main table.no-style>tbody>tr>td>input[type="image"],
main table.no-style>tr>td>input[type="image"] {
	width: auto !important;
	margin: 0;
}

main table.no-style>tr>td.bodytext,
main table.no-style>tr>td>td.subheader,
main table.no-style>tbody>tr>td.bodytext,
main table.no-style>tbody>tr>td>td.subheader,
main table.no-style>tr>td .bodytext,
main table.no-style>tr>td>td .subheader,
main table.no-style>tbody>tr>td .bodytext,
main table.no-style>tbody>tr>td>td .subheader {
	font-weight: 600;
	padding-bottom: 8px;
}

main table.no-style>tr>td .bodytext,
main table.no-style>tr>td>td .subheader,
main table.no-style>tbody>tr>td .bodytext,
main table.no-style>tbody>tr>td>td .subheader {
	display: inline-block;
}

main table.no-style>tbody>tr>td.subheader,
main table.no-style>tbody>tr>td.subheader {
	font-weight: 600;
	font-size: 1.1rem;
	padding-bottom: 12px;
}

/* === Responsive tables === */

@media( max-width:768px) {
	main table.responsive-table,
	main table.responsive-table tbody,
	main table.responsive-table th,
	main table.responsive-table tr,
	main table.responsive-table td {
		display: block;
		width: 100%;
		max-height: none;
		white-space: normal;
	}
	main table.responsive-table tr {
		border: solid 1px #ddd;
	}
	main table.responsive-table tr+tr {
		margin-top: 20px;
	}
	main table.responsive-table th,
	main table.responsive-table thead {
		display: none;
	}
	main table.responsive-table td {
		position: relative;
		padding: 16px;
		min-height: 51px;
		padding-left: 168px;
		text-align: right !important;
		border-top: dotted 1px rgba(0, 0, 0, 0.1);
		font-size: 16px;
	}
	main table.responsive-table tr>td:nth-of-type(1) {
		border-top: none;
	}
	main table.responsive-table td+td {}
	main table.responsive-table td:before {
		content: attr(data-label);
		width: 120px;
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		padding: 16px;
		font-weight: bold;
		text-align: left !important;
		border-right: dotted 1px rgba(0, 0, 0, 0.1);
	}
	main table.responsive-table td.blank {
		display: none;
	}
	main table.responsive-table td input[type="submit"],
	main table.responsive-table td input[type="button"],
	main table.responsive-table td .btn {
		padding: 8px 16px;
		width: auto !important;
		min-width: 150px;
		font-size: 14px;
		margin: 0 auto !important;
	}
}

@media( max-width:400px) {
	main table.responsive-table td {
		position: relative;
		padding: 16px;
		text-align: left !important;
		min-height: 0;
	}
	main table.responsive-table td:before {
		content: attr(data-label);
		width: 100%;
		display: block;
		position: relative;
		padding: 0;
		margin-bottom: 8px;
		font-weight: bold;
		border-right: none;
	}
	main table.responsive-table td input[type="submit"] {
		width: 100%;
		max-width: 100%;
	}
}

/* === Data Tables Plugin === */

main .dataTables_wrapper {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	margin-bottom: 24px;
}

main .dataTables_wrapper>* {
	order: 10;
}

main .dataTables_wrapper>.dataTables_filter {
	order: 1;
	text-align: left;
	flex: 0 1 50%;
}

main .dataTables_wrapper>.dataTables_length {
	order: 2;
	text-align: right;
	flex: 1 1 auto;
}

main .dataTables_wrapper>.dataTables_length>label,
main .dataTables_wrapper>.dataTables_filter>label {
	display: block;
	font-weight: normal;
	font-size: 0;
	margin: 0;
	position: relative;
}

main .dataTables_wrapper>.dataTables_filter>label:after {
	display:inline-block;
	content:url(../content/images/zip-search-icon.svg);
	width:14px;
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	left:8px;
}

main .dataTables_wrapper>.dataTables_length>label>select {
	font-size: 14px;
	padding: 8px;
	margin: 0 8px;
	width: auto;
	border-radius: 0;
}

main .dataTables_wrapper>.dataTables_filter>label>input[type="search"] {
	font-size: 14px;
	padding: 8px;
	margin: 0;
	border-radius: 0;
	border: none;
	background-color: rgba(0, 0, 0, 0.1);
	padding-left: 32px;
}

main .dataTables_wrapper>.dt-buttons {
	order: 3;
	flex: 0 1 auto;
	text-align: right;
}

main button.dt-button,
main div.dt-button,
main a.dt-button {
	margin: 0;
	padding: 12px;
	border-radius: 2px;
	line-height: 1;
	color: #222222 !important;
}

main .dataTables_wrapper>table {
	order: 4;
	flex: 0 0 100%;
	display: block;
	overflow: auto;
	margin: 16px 0;
}

main table.dataTable tbody th,
main table.dataTable tbody td,
main table.dataTable thead th,
main table.dataTable thead td {
	font-size: 13px;
	padding: 8px;
	text-align: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

main table.dataTable thead th,
main table.dataTable thead td {
	padding-right: 24px;
}

main table.dataTable.noStyle,
main table.dataTable.noStyle tbody,
main table.dataTable.noStyle thead,
main table.dataTable.noStyle tr,
main table.dataTable.noStyle td {
	display: inline;
	padding: 0;
	background: transparent;
	border: none;
	width: 100% !important;
}

main table.dataTable.noStyle thead td {
	font-size: 0;
}

main table.dataTable.noStyle .btn,
main table.dataTable.noStyle input[type="button"],
main table.dataTable.noStyle input[type="submit"],
main table.dataTable.noStyle input.btn,
main table.dataTable.noStyle button {
	display: inline-block;
	width: auto;
	padding: 12px !important;
}

main .dataTables_info {
	font-weight: 600;
}

main .dataTables_paginate.paging_simple_numbers {
	text-align: right;
	flex: 1 1 auto;
}

main .dataTables_paginate.paging_simple_numbers a.paginate_button {
	padding: 0;
	display: inline-block;
	border: none !important;
	background: transparent !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	border-radius: 200px;
	color: #222222 !important;
	opacity: 0.7;
}

main .dataTables_paginate.paging_simple_numbers a.paginate_button.current,
main .dataTables_paginate.paging_simple_numbers a.paginate_button:hover {
	opacity: 1.0;
	color: #222222 !important;
}

main .dataTables_paginate.paging_simple_numbers a.paginate_button.disabled {
	display: none;
}

main .dataTables_paginate.paging_simple_numbers a.paginate_button.previous,
main .dataTables_paginate.paging_simple_numbers a.paginate_button.next {
	border: none !important;
	padding: 0;
}

/* === Lists === */

main ul,
main ol {
	list-style-position: inside;
	margin: 0 0 16px;
	padding-left: 0;
}

	main ol.numbers {
		list-style: decimal inside;
		padding-left: 0;
	}

		main ol.numbers > li {
			margin-bottom: 8px;
		}

			main ol.numbers > li:last-child {
				margin: 0;
			}

main .list-unstyled {
	padding: 0;
	padding-left: 0;
	list-style: none !important;
	margin: 0 0 8px;
}

	main .list-unstyled > li {
		padding-bottom: 8px;
	}

main ul.list-inline {
	margin-left: -16px;
	margin-bottom: 0;
	list-style: none !important;
	padding: 0;
}

	main ul.list-inline > li {
		display: inline-block;
		padding-left: 16px;
		padding-right: 16px;
		padding-bottom: 16px;
	}

.align-middle > li {
	vertical-align: middle;
}

.valign-top > li {
	vertical-align: top;
}

.valign-middle > li {
	vertical-align: middle;
}

.valign-bottom > li {
	vertical-align: bottom;
}

ul.checkbox-list {
	list-style: none;
	margin: 8px 0 24px;
	padding: 0;
	text-indent: 0;
}

	ul.checkbox-list > li + li {
		margin-top: 8px;
	}

.radio-button-list-fix input[type="radio"] {
	margin-right: 30px;
}

.radio-button-list-fix label {
	font-weight: normal;
	margin: 0;
}

ul.dropdown-list {
	list-style: none;
	margin: 0;
	padding: 0;
	text-indent: 0;
}

	ul.dropdown-list > li {
		padding: 0;
		margin: 0;
		border-bottom: solid 1px rgba(0, 0, 0, 0.1);
	}

		ul.dropdown-list > li > .category {
			font-size: 1.2rem;
			margin: 0;
			padding: 1rem;
			cursor: pointer;
			background: rgba(0, 0, 0, 0.1);
			border-bottom: solid 1px rgba(0, 0, 0, 0.1);
		}

		ul.dropdown-list > li > .category-items {
			display: none;
		}

			ul.dropdown-list > li > .category-items > form {
				display: block;
				border: none;
				margin: 0;
				padding: 1rem;
				font-size: 1rem;
			}

				ul.dropdown-list > li > .category-items > form input {
					padding: 0;
				}

				ul.dropdown-list > li > .category-items > form + form {
					border-top: solid 1px rgba(0, 0, 0, 0.1);
				}

ul.collection-dates {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
	text-indent: 0;
}

	ul.collection-dates > li {
		margin: 0;
		padding: 1rem 0;
		border-top: solid 1px rgba(0, 0, 0, 0.1);
	}

		ul.collection-dates > li:hover {
			background: rgba(0, 0, 0, 0.1);
		}

		ul.collection-dates > li > form {
			border: none;
			margin: 0;
			padding: 0;
		}

			ul.collection-dates > li > form .flex-row {
				align-items: center;
			}

main table td ul {
	margin: 0;
}

main ul li > p {
	display: inline;
}

main ul.list-unstyled li > .btn {
	margin: 0;
}

/* -- Zip Lists -- */

ul.zip-list {
	list-style: none;
	list-style-position: inside;
	margin: -2em 0 0 -2em;
	margin-bottom: 2rem;
	margin-bottom: var(--zip-space-unit);
	padding: 0;
}

	ul.zip-list > li {
		display: block;
		margin: 0;
		padding: 2em 0 0 2em;
	}

		ul.zip-list > li *:last-child,
		ul.zip-list > li *:only-child {
			margin-bottom: 0 !important;
		}

ul.zip-list-inline > li {
	display: inline-block;
}

ul.zip-list-bullets {
	list-style-type: disc;
}

ul.zip-list-numbers {
	list-style-type: decimal;
}

	ul.zip-list-bullets > li,
	ul.zip-list-numbers > li {
		display: list-item;
	}

ul.zip-list-group {
	margin: 1px 0 2rem 0;
	margin-bottom: var(--zip-space-unit);
}

	ul.zip-list-group > li {
		margin-top: -1px;
		padding: 1em;
		border: solid 1px #ccc;
	}

ul.zip-list-group-inline {
	margin-top: 0;
	margin-left: 1px;
	display: flex;
	flex-flow: row wrap;
}

	ul.zip-list-group-inline > li {
		margin-left: -1px;
	}

ul.zip-list-tags {
	margin: 0;
	margin-bottom: 2rem;
	margin-bottom: var(--zip-space-unit);
}

	ul.zip-list-tags > li {
		align-items: center;
		background-color: #eee;
		border-radius: 4px;
		display: inline-flex;
		flex-flow: row nowrap;
		margin-right: .75em;
		padding: .6em 1em;
		font-size: .8em;
	}

	ul.zip-list-tags *.zip-btn {
		padding: 0;
		margin: 0;
		border: none;
		color: inherit;
		background: transparent !important;
	}

ul.zip-list-flex {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-between;
}

	ul.zip-list-flex > li {
		white-space: nowrap;
	}

/* -- Zip Pagination -- */

ul.zip-pagination {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: flex-end;
}

	ul.zip-pagination > li {
	}

		ul.zip-pagination > li > a {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 2.5em;
			height: 2.5em;
			text-decoration: none;
		}

		ul.zip-pagination > li.zip-pagination-active-page > a {
			background: rgba(0,0,0,0.1);
			border-radius: 4px;
			font-weight: 600;
		}

		ul.zip-pagination > li.zip-pagination-next-page > a,
		ul.zip-pagination > li.zip-pagination-prev-page > a {
			width: auto;
			height: auto;
		}

/* === Menu === */

main .menu {
	flex-shrink: 1 !important;
	min-width: 0;
	flex-basis: 100%;
	max-width: none;
}

@media(min-width:768px) {
	main .menu {
		flex-basis: 300px;
		max-width: 350px;
	}
}

main .menu p.menu-header {
	margin-bottom: 12px;
}

main .menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

main .menu ul>li a,
main .menu ul>li h5 {
	display: block;
	width: 100%;
	text-decoration: none;
}

main .menu ul>li.username {
	font-size: 18px;
}

main .menu ul li.dropdown {
	position: relative;
}

main .menu ul li.dropdown>a {
	position: relative;
}

main .menu ul li.dropdown>a>.fa-caret-down {
	position: absolute;
	right: 0;
	top: 0;
	padding: inherit;
}

main .menu ul li.dropdown.active>a>.fa-caret-down {
	transform: rotate(180deg);
}

main .menu ul.dropdown-menu {
	display: none;
}

main .menu ul.dropdown-menu li a {
	background: rgba(0, 0, 0, 0.1);
}

main .menu ul.dropdown-menu li a:hover {
	background: rgba(0, 0, 0, 0.2);
}

main .menu-toggle,
main .menu-toggle.btn {
	display: none;
	margin: 0 0 30px;
}

main .menu-toggle.desktop {
	display: inline-block;
	padding: 8px;
	margin: 0 0 12px;
}

@media(max-width:768px) {
	main .menu {
		display: none;
	}
	main .menu ul.dropdown-menu {
		margin: 0;
	}
	main .menu-toggle,
	main .menu-toggle.btn {
		display: inline-block;
	}
}

@media(max-width:450px) {
	main .menu-toggle,
	main .menu-toggle.btn {
		width: 100%;
	}
}

/* === User display == */

ul.user-display {
	list-style: none;
	margin: -12px 0 24px -12px;
	padding: 0;
	font-size: 15px;
	line-height: 1;
}

ul.user-display>li {
	display: inline-block;
	padding-left: 12px;
	padding-top: 12px;
}

ul.user-display>li .fa {
	margin-right: 4px;
}

/* === Calendar layout === */

body.site-wide main .content-menu {
	display: none;
}

.calendar-header {
	background: rgba(0, 0, 0, 0.9);
	padding: 24px 0;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	height: 72px;
}

.calendar-header .container,
.calendar-header .container-fluid {
	overflow: visible;
}

.calendar-header a {
	text-decoration: none !important;
}

.calendar-header .btn,
.calendar-header .btn-o {
	margin: 0;
	width: auto;
	padding: 0;
	background: transparent !important;
	color: white !important;
	border: none !important;
	font-size: 18px;
}

.calendar-header+main {
	padding-top: 72px;
}

.calendar-header .calendar {
	display: none;
	position: absolute;
	right: 36px;
	min-width: 0;
	margin-top: 40px;
}

@media(max-width:768px) {
	.calendar-header {
		height: auto;
		min-height: 72px;
	}
	.calendar-header .calendar {
		position: relative;
		margin: 30px auto 0;
		right: auto;
		border-top: solid 1px rgba(255, 255, 255, 0.1);
		padding-top: 30px;
	}
}

.calendar a {
	text-decoration: none;
}

.ui-datepicker select {
	min-height: 0;
	height: auto;
	padding: 0px;
}

main .content .calendar {
	width: initial;
	display: inline-block;
}

.calendar #calendarDatePicker {
	float: none !important;
	margin: 0 !Important;
	padding: 0 !important;
}

main .calendar .ui-datepicker {
	width: auto;
	max-width: 300px !important;
	margin: 0;
}

main .ui-datepicker,
.ui-datepicker.ui-widget {
	margin-bottom: 32px;
	min-width:0 !important;
	font-size:1.1em !important;
	max-width: 300px !important;
}

.menu_main {
	padding: 16px;
	background: #eeeeee;
	border: solid 1px rgba(0, 0, 0, 0.3);
	color: #333333;
	box-shadow: none;
	font-size: 14px;
}

/* Fix for calendar selection on booking forms */

#calendarContainer {
	float: none !important;
}

.ui-datepicker select {
	display: inline-block;
	width: auto !important;
}

#calendarDatePicker {
	float: none !important;
}

#calendarContainer+div {
	float: none !important;
	text-align: left !important;
}

/* === Calendar Page Layout 2.0 === */

html.calendar-page {
	overflow: auto;
	height: 100%;
	background-color: white;
}

body.calendar-page {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	flex-direction: row-reverse;
	width: 100%;
	height: 100%;
	background: #ffffff;
	background-color: #ffffff;
}

body.calendar-page .container {
	width: 100%;
	max-width: none;
	padding: 0 32px;
}

body.calendar-page main.container {
	min-height: 0;
	margin-top: 32px;
	margin-bottom: 32px;
}

body.calendar-page main.container .content {
	padding-bottom: 0;
}

body.calendar-page .calendar {
	position: relative;
	max-width: none;
	flex-shrink: 0;
	background-color: #eeeeee;
	padding: 12px 24px;
	text-align: center;
	overflow: hidden;
	width: auto;
	flex: 0 1 auto;
	margin: 0;
	height: calc(100% - 83px);
}

body.calendar-page .calendar #calendarDatePicker {
	margin: auto !important;
	display: inline-block;
}

body.calendar-page .calendar .ui-datepicker th {
	padding: 12px 8px;
}

body.calendar-page .calendar .ui-datepicker {
	width: auto;
	margin: 0 auto;
}

body.calendar-page .calendar-content {
	flex: 1 1 100px;
	overflow: auto;
	height: calc(100% - 83px);
	padding:32px 0;
}

body.calendar-page>header {
	height: 83px;
	flex: 0 0 100%;
	align-self: flex-start;
}

body.calendar-page header {
	background: #222222;
	color: white;
	position: sticky;
	top: 0;
	z-index: 100;
	font-size: 16px;
}

body.calendar-page header ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	align-content: center;
	height: 100%;
}

body.calendar-page header ul>li>a {
	display: inline-block;
	color: white;
	text-decoration: none !important;
	padding: 16px 24px;
	vertical-align: middle;
	height: 100%;
	border-left: solid 1px rgba(255, 255, 255, 0.05);
	border-right: solid 1px rgba(255, 255, 255, 0.05);
	display: flex;
	align-items: center;
}

body.calendar-page header ul>li>a:hover {
	background-color: rgba(255, 255, 255, 0.1);
}

body.calendar-page main.container>.row {
	flex-direction: row !important;
}

body.calendar-page main.container>.row>.menu {
	display: none;
}

body.calendar-page a.back-to-top {
	text-decoration: none;
	margin: 16px 0 0;
	position: relative;
	right: 0;
	display: inline-block;
	padding: 0;
	float: none;
}

@media(max-width:768px) {
	html.calendar-page {
		overflow: auto;
	}
	body.calendar-page {
		flex-wrap: wrap;
		height: auto;
		min-height: 0;
	}
	body.calendar-page .calendar {
		width: 100%;
		flex: 1;
		flex-basis: 100%;
	}
	body.calendar-page .calendar-content {
		flex-basis: 100%;
		flex-shrink: 0;
	}
}

.zip-calendar-header {
	flex: 0 0 100%;
}

body.calendar-page>.zip-navigation {
	flex: 0 0 100%;
	height: 83px;
	margin: 0;
	z-index:100;
}

.zip-calendar-header+.calendar {
	display: block !important;
}

body.calendar-page table tr>td {
	background-color: initial;
}

/* === Weekly Fixture Calendar filters === */

.fixture-calendar-filters {
	font-size: 14px;
	margin-bottom: 16px !important;
}

.fixture-calendar-filters label {
	font-weight:600;
}

.fixture-calendar-filters a {
	text-decoration:underline;
}

.fixture-calendar-filters>ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	margin-top: -12px;
	margin-left:-12px;
	font-weight: 14px;
	margin-bottom: 24px;
	padding-bottom: 32px;
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
}

.fixture-calendar-filters>ul>li {
	flex-grow:1;
	flex-shrink: 0;
	width: 400px;
	padding-top: 12px;
	padding-left:12px;
}

.fixture-calendar-filters li label {
	position:relative;
}

.fixture-calendar-filters li label>input[type="checkbox"] {
	position:absolute;
	left:0;
	top:4px;
}

.fixture-calendar-filters li label>input[type="checkbox"]+span {
	display:inline-block;;
	padding-left:24px;
}

.fixture-calendar-filters>ul>li>ul {
	list-style: none;
	margin: 0 0 24px;
	padding:12px;
	background:rgba(0,0,0,0.1);
}

.fixture-calendar-filters>ul>li>ul>li+li {
	padding-top: 8px;
}

.fixture-calendar-filters>ul>li>ul>li>label,
.fixture-calendar-filters>ul>li>ul>li>input[type="checkbox"] {
	margin: 0;
}

.fixture-calendar-filters>ul>li>ul>li>input[type="checkbox"] {
	position: absolute;
	left: 0;
	top: 12px;
}

.fixture-calendar-filters .select-all,
.fixture-calendar-filters .select-all label,
.fixture-calendar-filters .select-all input[type="checkbox"] {
	margin: 0;
	font-weight: 600;
}

.fixture-calendar-filters .select-all input[type="checkbox"] {
	margin-right: 4px;
}

ul.fixture-calendar-nav {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-left: -12px;
	margin-top: -12px;
	margin-bottom: 16px;
	display: flex;
	flex-wrap: wrap;
}

ul.fixture-calendar-nav>li {
	padding-left: 12px;
	padding-top: 12px;
}

ul.fixture-calendar-nav>li>a {
	display: block;
	padding: 8px 16px;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 4px;
}

ul.fixture-calendar-nav>li>a:hover {
	background-color: rgba(0, 0, 0, 0.2);
}

/* === Tabs === */

#tabs {
	background: none;
	border: none;
}

.ui-tabs .ui-tabs-nav {
	border: none !important;
	background: none !important;
	padding: 0 !important;
	font-weight: 300 !important;
}

.ui-tabs .ui-tabs-panel {
	border: solid 1px #aaaaaa !important;
	overflow: auto;
	padding: 32px !important;
	margin-bottom: 24px;
}

.ui-tabs .ui-tabs-nav li {
	border-color: #aaaaaa;
	background: #eeeeee;
	font-weight: 300 !important;
	font-size: 1.1em !important;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	background: white !important;
}

.ui-tabs .ui-tabs-nav li a:focus {
	outline: none;
	border: none;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
	color: #aaaaaa !important;
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: #222222 !important;
}

main .ui-tabs.ui-widget.ui-widget-content {
	border:none;
}

@media(max-width:768px) {
	.ui-tabs .ui-tabs-panel {
		padding: 16px !important;
	}
	.ui-tabs .ui-tabs-nav li {
		width: 100%;
	}
}

/* === User Options === */

ol.user-options,
ul.user-options,
.zip-user-options {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	text-indent: 0;
}

ol.user-options>li,
ul.user-options>li,
.zip-user-options>li {
	display: block;
	width: 100%;
	border: solid 1px #aaa;
	border-radius: 3px;
	margin: 0 0 8px;
	position: relative;
	font-size: 1.2em;
	transition: 0.1s ease;
	padding: 0;
}

ol.user-options li:hover,
ul.user-options li:hover,
.zip-user-options li:hover {
	background: rgba(0, 0, 0, 0.1);
}

ol.user-options li a,
ul.user-options li a,
.zip-user-options li a {
	display: block;
	padding: 20px 20px 20px 50px;
	width: 100%;
	text-decoration: none;
}

ol.user-options .fa,
ul.user-options .fa,
.zip-user-options .fa {
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	font-size: 1em;
}

#tabs ol.user-options,
#tabs ul.user-options,
#tabs .zip-user-options {
	margin: 0;
}

/* === Progress Bar === */

#progressBar {
	padding: 0;
	font-size: .9em;
	margin: 0 0 32px;
}

#progressBar ul {
	margin: 0 0 -16px;
	padding: 0;
	list-style: none;
}

#progressBar ul li {
	display: inline-block;
	padding: 0 0 16px;
	color: #aaaaaa;
	transition: 0.2s ease;
}

#progressBar ul li:after {
	content: '/';
	display: inline-block;
	margin: 0 8px 0 16px;
	color: #666666;
}

#progressBar ul li a {
	text-decoration: none;
}

#progressBar ul li:nth-last-of-type(1)::after {
	display: none;
}

#progressBar ul li a.accessibleWorkflowStep {
	color: #666666;
	font-size: 1.1em;
}

@media (max-width:768px) {
	#progressBar {}
}

/* === Manage Bookings ===*/

fieldset.manage li a {
	color: #009ace;
}

fieldset.manage li a:after {
	content: '»';
	padding-left: 5px;
}

/* === Select Facilities === */

.select-facilities form {}

.select-facilities {}

.select-facilities .category>.row>div {
	flex-grow: 0;
}

.select-facilities .category {
	margin-bottom: 32px;
	padding-bottom: 32px;
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
}

.select-facilities .category h4 {
	margin-bottom: 12px;
}

.select-facilities .category .facility {
	padding: 16px;
	background: rgba(0, 0, 0, 0.1);
	padding-left: 76px;
	position: relative;
	margin-bottom: 1px;
}

.select-facilities .category .facility input[type="text"],
.select-facilities .category .facility .add-facility {
	width: 60px;
	text-align: center;
	background: rgba(0, 0, 0, 0.1);
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	border: none;
	cursor: pointer;
}

.select-facilities .category .facility input[type="text"]:hover {
	background: rgba(0, 0, 0, 0.2);
}

.select-facilities .category .facility .add-facility>input[type="image"] {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	margin: auto;
	transform: translateY(-50%);
}

.select-facilities .category .facility>* {
	margin: 0;
}

.zip-facility-selector > .number {
	width: 100%;
}

.zip-facility-selector label {
	margin:0;
}

/* === Catering Items === */

.viewCateringMenuContainer>div {
	margin-top: 16px;
	padding: 16px;
	background: rgba(0, 0, 0, 0.1);
}

.viewCateringMenuRemoveItem {
	margin-top: 24px;
	text-decoration: underline;
}

/* == Accordion === */

#accordion {
	margin-bottom: 24px;
}

.accordion-content {
	padding: 16px;
}

/* === SearchBookingProcess === */

#searchResultsContainer {
	margin-top: 32px;
}

.resourceListPanel {
	padding: 32px 0;
	border-top: solid 1px #eee;
}

#ResourceFeatures img {
	height: 30px;
	margin: 8px 0;
}

/* === Search Results === */

#searchResults .resourceListPanel,
#searchResults .eventListPanel {
	padding: 32px 0;
	border-top: dotted 1px rgba(0, 0, 0, 0.3);
}

#searchResults h3 {
	margin: 0 0 16px;
}

#searchResults h5 {
	margin: 0 0 16px;
}

#searchResults hr {
	margin: 24px 0;
}

#searchResults ul {
	font-weight: 600;
}

#searchResults .book-event {
	border-radius: 5px;
	padding: 16px;
	margin-top: 32px;
	background: rgba(0, 0, 0, 0.1);
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

#searchResults .book-event * {
	margin: 0;
	line-height: auto;
}

#searchResults .image img {
	box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.1);
}

#searchResults .recommended {
	background: rgba(0, 0, 0, 0.1);
	padding: 24px;
}

#searchResults .similar-event {
	background: white;
	padding: 16px;
	border-radius: 10px;
	box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
	margin-bottom: 24px;
}

#searchResults .similar-event:hover {
	box-shadow: none;
}

@media (max-width:650px) {
	#searchResults .eventListPanel .image {
		display: none;
	}
}

/* === Event Listings === */

.event-listing {
	padding-top: 30px;
	padding-bottom: 30px;
	border-top: solid 1px rgba(0, 0, 0, 0.1);
}

.event-listing p,
.recommended-events p {
	margin-bottom: 8px;
}

.event-listing p.event-series {
	text-transform: uppercase;
	font-size: 12px;
	margin-bottom: 8px;
}

.event-listing .description {
	margin: 24px 0;
	font-size: 14px;
}

.event-listing .available-dates {
	padding: 16px 0;
}

.event-listing .available-dates+.available-dates {
	border-top: solid 1px rgba(0, 0, 0, 0.1);
}

.event-listing .available-dates p {
	margin-bottom: 8px;
}

ul.event-dates {
	margin: 0;
	padding: 24px;
	list-style: none;
	background: rgba(0, 0, 0, 0.1);
	border-radius: 5px;
}

ul.event-dates>li {
	padding: 0;
	margin: 0 0 12px;
}

.event-listing .book-event {
	border-radius: 5px;
	padding: 16px;
	margin-top: 32px;
	background: rgba(0, 0, 0, 0.1);
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.event-listing .book-event * {
	margin: 0;
	line-height: auto;
}

.recommended-events .event-listing {
	background: rgba(0, 0, 0, 0.1);
	padding: 24px;
	border-radius: 5px;
}

/* === Event details === */

.event-listing.event-details {}

.event-details h3 {
	margin-bottom: 24px;
}

.event-details p {
	font-size: 14px;
	margin-bottom: 16px;
}

.event-details .terms {
	background: rgba(0, 0, 0, 0.1);
	padding: 16px;
	margin-bottom: 24px;
}

.event-details .basket p {
	margin-bottom: 8px;
}

.event-details .basket h3 {
	margin-bottom: 8px;
}

/* === Basket (events) === */

.basket {
	background: rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	margin: 16px 0;
}

.basket:hover {
	transition: 0.2s ease;
	background: rgba(0, 0, 0, 0.2);
}

.menu ul li.basket {
	position: relative;
	padding: 0;
	border: none;
	margin: 8px 0;
}

.menu ul li.basket+li {
	border: none;
}

.menu li.basket>a,
.menu li.basket a {
	padding: 0;
	padding: 16px;
	padding-left: 48px;
}

.menu li.basket a a {
	padding: 0;
}

.menu ul li.basket .fa {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
}

/* == Search Results == */

.search-results.listing {
	border-top: solid 1px rgba(0, 0, 0, 0.1);
	padding: 30px 15px;
}

.search-results.listing:nth-of-type(even) {
	background: rgba(0, 0, 0, 0.1);
}

/* == Custom Questions == */

.add-question-options {
	position: relative;
}

.add-question-options input[type="button"] {
	position: absolute;
	right: 16px;
	top: 5px;
	margin: 0;
	padding: 0;
	background: transparent;
	border: none;
	color: #333333;
	font-size: 26px !important;
	font-family: arial, sans-serif !important;
	color: #009edf;
}

/* === Resource Details page === */

.resource-images .image-gallery img {
	width: 25%;
	max-width: 80px;
}

/* === Role Group Configuration quick fix === */

.roleSelectionSelectList,
.chargeTypSelectionSelectList,
.resourceSelectionSelectList,
.roleGroupsSelectionSelectList,
.bookingtypeDetailSelectionSelectList,
.monthSelectionSelectList,
.teamBookingDetailsPatchesSelectList,
.roleSelectionSelectList,
.resourceConfigSelectList,
.statusSelectionSelectList {
	width: 46% !important;
	float: left;
	margin: 5px 0 30px;
	height: 250px !important;
	min-width: 0 !important;
}

.switchRolesButtons,
#switchMonthsButtons,
#switchRolesButtons,
#switchRoomLayoutButtons,
#switchChargeTypesButtons,
#switchResourcesButtons,
#switchSubCategoriesButtons,
#switchRoleGroupsButtons,
#switchPatchesButtons,
#switchEventSeriesDependenciesButtons,
#switchEventCategoryButtons,
#switchBookingTypesButtons,
#switchTradeSkillsButtons,
#statusSwitchRolesButtons,
#switchBookingTypeDetailsButtons {
	width: 8%;
	float: left;
	margin: 85px 0 0;
	padding: 5px;
	text-align: center;
}

.switchRolesButtons>*,
#switchMonthsButtons>*,
#switchRolesButtons>*,
#switchRoomLayoutButtons>*,
#switchChargeTypesButtons>*,
#switchResourcesButtons>*,
#switchSubCategoriesButtons>*,
#switchRoleGroupsButtons>*,
#switchPatchesButtons>*,
#switchEventSeriesDependenciesButtons>*,
#switchEventCategoryButtons>*,
#switchBookingTypesButtons>*,
#switchTradeSkillsButtons>*,
#statusSwitchRolesButtons>* {
	display: block !important;
	margin: 0 auto 1px !important;
	width: 100% !important;
	max-width: 40px !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	height: auto !important;
	min-width: 0 !important;
}

main table.assignmentTable {
	table-layout: fixed;
	margin-bottom: 30px;
	border: none;
}

main table.assignmentTable tr>th {
	background: transparent;
	color: initial;
	font-weight: 600 !important;
	font-size: 1rem;
	padding: 0;
}

main table.assignmentTable tr>td {
	width: 10%;
	text-align: center;
	padding: 0;
	border: none;
}

main table.assignmentTable tr>td:nth-of-type(odd) {
	width: 45%;
}

main table.assignmentTable tr>td>select,
main table.assignmentTable tr>td>div,
main table.assignmentTable tr>td>div>input {
	width: 100% !important;
	margin: 0 auto 5px !important;
	float: none !important;
	display: block;
}

main table.assignmentTable tr>td>div {
	padding: 0 !important;
}

main table td>select[multiple] {
	width: 100% !important;
	min-width: 100px;
}

main table td>#switchRolesButtons {
	width: 100%;
}

/* === Role Group Configuration === */

.role-group-configuration {
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	margin: 40px 0 24px;
	position: relative;
}

.role-group-configuration>label {
	flex-basis: 50%;
	flex-shrink: 0;
	font-size: 12px;
	padding: 8px 32px;
	margin: 0;
	position: absolute;
	left: 0;
	top: -33px;
	height: 33px;
	border: solid 1px rgba(0, 0, 0, 0.3);
	border-bottom: none;
}

.role-group-configuration>label+label {
	right: 0;
	left: auto;
}

.role-group-configuration>label:nth-child(2) {
	text-align: right;
}

.role-group-configuration>select[multiple],
.role-group-configuration>.buttons,
.role-group-configuration>div {
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}

.role-group-configuration>select[multiple] {
	flex: 1;
	max-width: none;
	height:250px !important;
	-webkit-appearance:none;
}

.role-group-configuration>.buttons,
.role-group-configuration>div {
	flex-basis: 80px;
	padding: 0 12px !important;
}

.role-group-configuration>.buttons>*,
.role-group-configuration>div>* {
	display: block;
	padding: 8px !important;
	width: auto !important;
	margin: 0 auto !important;
	min-width: 0 !important;
	max-width: none !important;
	background-color: #cccccc !important;
	color: #222222 !important;
	border: solid 1px rgba(0, 0, 0, 0.1) !important;
	border-radius: 0 !important;
}

.role-group-configuration>.buttons>*:hover {
	background-color: #bbbbbb !important;
}

/* === Zip Menu Items === */

ul.zip-menu-items {
	list-style: none;
	margin: 0 0 32px;
	padding: 24px;
	background: rgba(0, 0, 0, 0.1);
}

ul.zip-menu-items>li {
	display: block;
}

ul.zip-menu-items>li+li {
	margin-top: 8px;
}

ul.zip-menu-items>li:before {
	font-family: FontAwesome;
	content: "\f0da";
	display: inline-block;
	margin-right: 12px;
}

ul.zip-menu-items>li>a:hover {
	opacity: 0.5;
}

/* === Misc form fixes === */

main fieldset {
	padding: 0;
	margin: 0;
	border: none;
	min-width: 0;
	text-overflow: ellipsis;
	background: transparent;
}

main *+fieldset {
	margin: 24px 0 0;
}

main fieldset>legend {
	display:block;
	width:100%;
	padding-top:24px;
	border-top:dotted 1px rgba(0,0,0,0.1);
}

main fieldset>hr>legend {
	padding-top:0;
	border:none;
}

fieldset.checkbox legend {
	display: none;
}

fieldset>legend.hidden {
	display: none;
}

#tabs form {
	margin: 0;
	border: none;
	padding: 0;
}

.input-validation-error,
.validation-summary-errors,
.field-validation-error,
.temp-message,
.deleteQuestion {
	display: block;
	border: 3px solid #ff0000;
	background-color: #ff00001f;
	border-radius: 0;
	margin-bottom: 24px;
	padding: 16px;
}

.input-validation-error>ul,
.validation-summary-errors>ul,
.field-validation-error>ul,
.temp-message>ul,
.deleteQuestion>ul {
	list-style: none;
	margin: -12px 0 0;
	padding: 0;
}

.input-validation-error>ul>li,
.validation-summary-errors>ul>li,
.field-validation-error>ul>li,
.temp-message>ul>li,
.deleteQuestion>ul>li {
	padding: 12px 0 0;
	color: #ff0000;
	font-weight: 600;
}

#capacitySearch {
	margin: 0 0 20px;
}

.timeSliderOuter {
	display: none;
	height: 20px;
	width: 100% !important;
}

.ui-widget {
	height: auto !important;
}

main #QuestionsDiv .zip-editor-row {
	padding:0 0 24px;
	margin:0 0 24px;
	border-bottom:solid 1px rgba(0,0,0,0.1);
}

.validation-summary-valid ul {
	margin: 0;
}

.ui-tabs-nav+form,
.ui-tabs-nav+form+form {
	padding-top: 0;
	margin-top: 0;
	border: none;
}

.questionField+.questionField {
	margin-top: 32px;
}

/* === Accordion === */

main .ui-accordion .ui-accordion-content {
	background: rgba(0, 0, 0, 0.1);
	padding: 24px;
}

/* === Timer (events) === */

#timer #time {
	position: fixed;
	right: 0;
	bottom: 0;
	padding: 32px;
	background: rgba(20, 20, 20, 0.9);
	color: white;
	z-index: 500000;
}

@media(max-width:550px) {
	#timer #time {
		left: 0;
		text-align: center;
	}
}

/* == Booking type options == */

.booking-type-options {}

.booking-type-options .booking-option {
	background: rgba(0, 0, 0, 0.1);
	padding: 2rem;
	margin-bottom: 1rem;
	cursor: pointer;
	transition: 0.2s ease;
}

.booking-type-options .booking-option:hover {
	background: rgba(0, 0, 0, 0.15);
}

.booking-type-options .booking-option h3 {
	margin: 0 0 1rem;
}

.booking-type-options .booking-option p {
	margin: 0;
}

.booking-type-options .booking-option a {
	text-decoration: none;
}

/* === Zipporah Progress Bar === */

.zip-progress-bar {
	margin-bottom: 40px;
}

.zip-progress-bar label {
	display: inline-block;
	margin-bottom: 1rem;
	flex: 1;
	transition: 0.2s ease;
}

.zip-progress-bar label:nth-of-type(1) {
	text-align:left;
}

.zip-progress-bar label.back {
	cursor: pointer;
}

.zip-progress-bar label.back:hover {
	opacity: 0.5;
}

.zip-progress-bar label.back+label.step {
	text-align: center;
}

.zip-progress-bar label.next {
	opacity: 0.5;
	text-align: right;
}

@media(max-width:768px) {
	.zip-progress-bar {
		font-size: 12px;
	}
	.zip-progress-bar label.next {
		display: none;
	}
	.zip-progress-bar label.step {
		text-align: center;
		order: 1;
	}
	.zip-progress-bar label.back+label.step {
		text-align: left;
	}
	.zip-progress-bar label.back {
		text-align: right;
		order: 2;
		opacity: 0.9;
	}
}

.zip-progress-bar .progress-bar {
	width: 100%;
	background: rgba(0, 0, 0, 0.1);
	border-radius: 100px;
	height:auto;
}

.zip-progress-bar .progress-bar .progress-meter {
	background-color: #00FF99;
	height: 6px;
	border-radius: 100px;
}

/* === Zipporah real time form validation === */

main input[type="text"].validated,
main input[type="password"].validated,
main select.validated,
main textarea.validated,
main input[type="text"].input-validation-error,
main input[type="password"].input-validation-error,
main select.input-validation-error,
main textarea.input-validation-error {
	border: solid 1px #1de043;
	background-image: url(../content/Images/zip-validate-icon.svg);
	background-position: left 1rem center;
	background-repeat: no-repeat;
	background-size: auto 30%;
	padding-left: 2.5rem;
}

main input[type="text"].input-validation-error,
main input[type="password"].input-validation-error,
main select.input-validation-error,
main textarea.input-validation-error {
	border: solid 2px red;
	background-image: url(../content/Images/zip-error-icon.svg);
}

.input-validation-error+span.field-validation-error {
	display: none;
}

/* === Staff Allocation (registrars) === */

main td.staff-allocation {
	padding: 0;
}

main label.staff-allocation-toggle {
	display: block;
	padding: 8px;
	margin: 0;
	transition: 0.4s ease;
}

main label.staff-allocation-toggle:hover {
	background: rgba(0, 0, 0, 0.1);
}

main .staff-allocation-list {
	display: none;
	border-right: solid 1px rgba(0, 0, 0, 0.1);
}

main .staff-allocation-list .staff-member {
	border-top: solid 1px rgba(0, 0, 0, 0.1);
	border-left: solid 1px rgba(0, 0, 0, 0.1);
	background: rgba(0, 0, 0, 0.1);
	padding: 24px;
	flex: 1;
	flex-basis: 200px;
	flex-shrink: 0;
}

main .staff-allocation-list .flex {
	flex-wrap: wrap;
}

main .staff-allocation-list .staff-member * {
	margin: 0;
	line-height: 1;
}

main .staff-allocation-list .staff-member label.staff-id {
	font-size: 16px;
	margin: 0 0 8px;
}

main .staff-allocation-list .staff-member select {
	width: 100%;
	margin: 0 0 8px !important;
}

main .staff-allocation-list .staff-member input[type="checkbox"],
main .staff-allocation-list .staff-member p {
	margin-bottom: 8px !important;
}

main .staff-allocation-list .staff-member .btn {
	margin-top: 12px !important;
}

/* === Staff Allocation Widget (Generic) === */

.staff-allocation-widget {
	font-size: 14px;
	margin-bottom: 40px;
}

.staff-allocation-widget>ul.booking-details {
	order: 2;
	width: 100%;
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-flow: row wrap;
	border-left: solid 1px rgba(0, 0, 0, 0.05);
	border-top: solid 1px rgba(0, 0, 0, 0.2);
	background: rgba(0, 0, 0, 0.05);
}

.staff-allocation-widget>ul.booking-details>li {
	flex: 1 1 33.333%;
	min-width: 200px;
	padding: 12px;
	border-right: solid 1px rgba(0, 0, 0, 0.05);
	border-bottom: solid 1px rgba(0, 0, 0, 0.05);
	position: relative;
}

.staff-allocation-widget>ul.booking-details>li.link {
	text-decoration: underline;
}

.staff-allocation-widget>.staff {
	order: 1;
	width: 100%;
	padding: 0;
}

.staff-allocation-widget ul.staff-list {
	list-style: none;
	padding: 0;
	margin: 0;
	border: solid 1px rgba(0, 0, 0, 0.3);
	border-bottom: none;
}

.staff-allocation-widget ul.staff-list>li {
	flex: 0 1 33.333%;
	min-width: 200px;
	padding: 16px;
}

.staff-allocation-widget label {
	margin-bottom: 8px;
	display: block;
}

.staff-allocation-widget p {
	margin: 0 0 12px;
}

.staff-allocation-widget label+p {
	margin-top: 12px;
}

.staff-allocation-widget p>a {
	text-decoration: underline;
}

.staff-allocation-widget p:last-child {
	margin-bottom: 0;
}

.staff-allocation-widget label.checkbox {
	display: block;
	font-weight: normal;
	margin: 0 0 12px;
}

.staff-allocation-widget label.checkbox>input[type="checkbox"] {
	margin: 0;
}

.staff-allocation-widget select,
.staff-allocation-widget input[type="submit"] {
	padding: 4px 8px;
	border-radius: 2px;
	margin: 0 0 12px;
	font-size: 15px;
}

.staff-allocation-widget input[type="submit"] {
	width: auto;
	margin: 0;
}

.staff-allocation-widget p+input[type="submit"] {
	margin-top: 12px;
}

.allocated-staff-list {
	margin: 0 0 24px;
}

.staff-list-toggle {
	display: block;
	margin-bottom: 24px;
	cursor: pointer;
	padding: 24px 0 0;
	margin: 0 0 24px;
	border-top: solid 1px rgba(0, 0, 0, 0.1);
}

.staff-list-toggle>i.fa.active {
	transform: rotate(180deg);
	transition: 0.2s ease;
}

@media(max-width:768px) {
	.staff-allocation-widget>ul.booking-details {
		order: 1;
		border-top: solid 1px rgba(0, 0, 0, 0.05);
	}
	.staff-allocation-widget ul.staff-list {
		border-bottom: solid 1px rgba(0, 0, 0, 0.3);
	}
}

/* === UI Widgets == */

.ui-widget-content {
	min-width:50% !important;
}

main .ui-widget {
	font-family: inherit;
}

.ui-dialog .ui-dialog-content {
	padding:1em !important;
	width: 100% !important;
}

.ui-dialog .ui-dialog-content iframe {
	width:100% !important;
	height:100% !important;
	min-height: 50vh;
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea {
	display: inline-block;
	width: 100%;
	margin-bottom: 12px;
	padding: 8px;
	color: initial;
}

.ui-widget select.ui-datepicker-month,
.ui-widget select.ui-datepicker-month {
	padding: 0 !important;
}

.ui-widget input[type="checkbox"],
.ui-widget input[type="radio"] {
	width: auto;
}

.ui-widget input[type="submit"],
.ui-widget input[type="button"],
.ui-widget span.btn>a,
.ui-widget span.btn-o>a {
	width: auto;
	margin: 0 0 8px;
	border: solid 1px rgba(0, 0, 0, 0.1);
}

.ui-widget label {
	display: inline-block;
	font-weight: 600;
	margin-bottom: 6px;
}

.ui-widget span.btn,
.ui-widget span.btn-o {
	position: relative;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	margin: 0 !important;
}

.ui-widget select.ui-datepicker-month,
.ui-widget select.ui-datepicker-year {
	padding: 0 !important;
}

#feeValueSlider .ui-slider-handle {
	top: 50%;
	transform: translateY(-50%);
	z-index: 100;
	border-radius: 100px;
	box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
	border: solid 1px rgba(0, 0, 0, 0.1);
}

/* === Zipporah Widgets === */

.zip-widget {
	display: block;
	padding: 24px;
	border:solid 1px #ccc;
	margin-bottom: 24px;
}

/* === Zip Resource Details (Room and Sports Booking Processes in Generic) === */

.zip-resource-details h2 {
	margin-bottom: 12px;
}

.zip-resource-details p.location {
	margin-bottom: 24px;
}

ul.zip-resource-features {
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}

ul.zip-resource-features>li {
	display: inline-block;
}

ul.zip-resource-features>li>img {
	width: 40px;
}

.zip-resource-images {}

.zip-resource-images img {
	width: 100%;
}

.zip-resource-images ul.image-gallery {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-left: -8px;
	margin-top: 8px;
	overflow: hidden;
}

.zip-resource-images ul.image-gallery>li {
	width: 50%;
	padding-left: 8px;
	display: inline-block;
	float: left;
}

.zip-resource-images ul.image-gallery>li>img {
	width: 100%;
}

@media(max-width:768px) {
	.zip-resource-images {
		margin-bottom: 32px;
	}
}

/* == Terms and conditions == */

.zip-terms {
	padding: 16px;
	background: rgba(0, 0, 0, 0.1);
	margin-bottom: 16px;
	transition: 0.2s ease;
	position: relative;
	padding-left: 40px;
	font-size: 14px;
}

.zip-terms:hover {
	background: rgba(0, 0, 0, 0.2);
}

.zip-terms * {
	margin: 0 !important;
}

.zip-terms input[type="checkbox"] {
	position: absolute;
	left: 16px;
	top: 20px;
}

/* === Bookings display screen === */

body.zip-bookings-display {
	padding: 40px;
	font-family: open-sans, sans-serif;
	color: #222222;
}

body.zip-bookings-display main {
	margin: 0;
}

body.zip-bookings-display .time,
body.zip-bookings-display .date {
	display: inline-block;
	font-size: 4vh;
	margin: 0 0 12px;
	margin-right: 24px;
}

body.zip-bookings-display h1 {
	display: block;
	font-size: 6vh;
	margin: 0;
	margin-bottom: 40px;
}

body.zip-bookings-display ul.booking {
	list-style: none;
	margin: 0 0 40px;
	padding: 0;
	border-left: solid 4px #005c7c;
	padding-left: 20px;
	font-size: 2vh;
}

body.zip-bookings-display ul.booking li+li {
	margin-top: 8px;
}

/* === Radio Button Lists === */

main .zip-widget .radio-button-list {
	margin: 8px 0 0;
}

main .radio-button-list {
	margin-bottom: 24px;
}

main .radio-button-list label+br+br {
	display: none;
}

/* === Zipporah Navigation === */

.zip-navigation {
	display: flex;
	width: 100%;
	align-items: center;
	font-size: 14px;
	margin-bottom: 32px;
	padding: 24px 0;
	top: 0;
	z-index: 5000;
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
}

.zip-navigation>main {
	width: 100%;
	display: inline;
	margin: 0;
	padding:0;
	min-height: 0;
}

.zip-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.zip-navigation ul.navbar {
	background-color:transparent;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	border: none;
	min-height: 0;
	overflow:visible;
}

.zip-navigation ul.navbar>li {
	padding:0;
	margin:0;
}

.zip-navigation ul.navbar:before,
.zip-navigation ul.navbar:after {
	display: none;
}

.zip-navigation ul.navbar li.user-display {
	cursor: pointer;
	position: static;
}

.zip-navigation ul.navbar li.user-display>.username-icon {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	border: solid 1px rgba(0, 0, 0, 0.3);
	border-radius: 300px;
	width: 50px;
	height: 50px;
	font-size: 19px;
	text-transform: capitalize;
	position: relative;
}

.zip-navigation ul.navbar li.user-display:hover>.username-icon {
	border-color: #009ace;
	color: #009ace;
	transition: 0.2s ease;
}

.zip-navigation ul.navbar li.user-display>.username-icon>i.fa {
	font-size:12px;
	position:absolute;
	right:-50%;
	top:50%;
	transform:translateY(-50%);
}

.zip-navigation ul.navbar li.user-display>ul {
	display: none;
	position: absolute;
	text-align: left;
	width: 100%;
	max-width: 300px;
	padding: 32px;
	margin: 12px 0 0;
	background: #ffffff;
	z-index: 5000;
	box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.1);
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
}

.zip-navigation ul.navbar li.user-display>ul.active {
	background-color: #37474f;
	color: white;
	display: block;
	animation: fadeIn 0.2s ease;
	box-shadow: 0 7px 14px rgba(0, 0, 0, 0.25), 0 5px 5px rgba(0, 0, 0, 0.22);
}

.zip-navigation ul.navbar li.user-display>ul.active a:hover {
	color:inherit;
	opacity: 0.5;
}

.zip-navigation ul.navbar li.user-display>ul>li+li {
	position: relative;
	margin-top: 12px;
}

.zip-navigation ul.navbar li.user-display>ul>li a {
	display: block;
	text-decoration: none;
}

.zip-navigation ul.navbar li.user-display>ul.active>li>a {
	color:white;
}

.zip-navigation ul.navbar li.user-display>ul>li a:hover {
	opacity: 0.5;
}

.zip-navigation ul.navbar li.user-display>ul>li.username {
	display: block;
	font-size: 18px;
	font-weight: 600;
}

.zip-navigation ul.navbar>li.controls {
	margin-left: -24px;
}

.zip-navigation ul.navbar li.controls>a {
	display: inline-block;
	margin-left: 24px;
	cursor: pointer;
	vertical-align: middle;
	min-width: 20px;
}

.zip-navigation ul.navbar li.controls>a:hover {
	opacity: 0.5;
}

.zip-navigation ul.navbar li.controls .zip-calendar {
	display:none;
}

.zip-navigation ul.navbar li.controls .zip-menu-toggle::after {
	display: block;
	content: url(../Content/Images/zip-menu-icon.svg);
	width: 20px;
	padding: 0;
}

.zip-navigation ul.navbar li.controls .zip-home::after {
	display: block;
	content: url(../Content/Images/zip-home-icon.svg);
	width: 20px;
	padding: 0;
}

.zip-navigation ul.navbar li.controls .zip-calendar::after {
	display: block;
	content: url(../Content/Images/zip-calendar-icon.svg);
	width: 20px;
	padding: 0;
}

.zip-navigation.light ul.navbar li.controls .zip-menu-toggle::after {
	content: url(../Content/Images/zip-menu-icon-white.svg);
}

.zip-navigation.light ul.navbar li.controls .zip-home::after {
	content: url(../Content/Images/zip-home-icon-white.svg);
}

.zip-navigation.light ul.navbar li.controls .zip-calendar::after {
	content: url(../Content/Images/zip-calendar-icon-white.svg);
}

.zip-navigation .zip-menu {
	display: none;
	background: rgba(255, 255, 255, 0.98);
	padding: 32px 0;
	overflow: auto !important;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 5000000;
	-webkit-overflow-scrolling: touch;
}

.zip-navigation .zip-menu .zip-container {
	max-width:1000px;
}

.zip-navigation .zip-menu a.zip-menu-toggle.close {
	display: inline-block;
	width: 20px;
	margin-bottom: 40px;
	opacity: 0.5;
	z-index: 5000000;
	position: relative;
	float: none;
	top:0;
	left:0;
}

.zip-navigation .zip-menu a.zip-menu-toggle.close:hover {
	opacity: 1.0;
}

.zip-navigation .zip-menu .category {
	padding: 0 0 8vh;
}

.zip-navigation .zip-menu .category h3 {
    font-size: 22px;
    font-weight: 600;
    font-family: inherit;
    margin: 0 0 16px;
    border-bottom: dotted 1px rgba(0, 0, 0, 0.2);
    padding-bottom: 16px;
    line-height: 1;
}

.zip-navigation .zip-menu a.zip-menu-toggle.close::after {
	display: block;
	content: url(../Content/Images/zip-close-icon.svg);
}

.zip-navigation .zip-menu ul {
	font-size: 16px;
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	margin-top: -16px;
	margin-left: -24px;
}

.zip-navigation .zip-menu ul>li {
	flex-shrink:0;
	flex-grow:0;
	width:33%;
	padding-top: 16px;
	padding-left: 24px;
	position: relative;
	line-height: 1;
}

.zip-navigation .zip-menu ul>li.username {
	font-weight:600;
}

.zip-navigation .zip-menu ul>li a {
	display: block;
	text-decoration: none;
	line-height: 1.3;
	padding-left:16px;
}

.zip-navigation .zip-menu ul>li a:before {
   font-family: FontAwesome;
   content: "\f0da";
   display: inline-block;
   vertical-align: middle;
   font-weight: 900;
   position:absolute;
   left:24px;
   top:16px;
}

.zip-navigation .zip-menu ul>li a:hover {
	opacity: 0.5;
}

.zip-navigation .zip-menu ul>li a.selected {
	color: initial;
	font-weight: 600;
}

@media(max-width:1000px) {
	.zip-navigation .zip-menu ul>li {
		width:33%;
	}
}

@media(max-width:768px) {
	.zip-navigation .zip-menu .category h3 {
		font-size: 20px;
		margin: 0 0 14px;
		padding-bottom: 14px;
	}
	.zip-navigation .zip-menu ul {
		font-size: 16px;
	}
	.zip-navigation .zip-menu ul>li {
		width:50%;
	}
}

@media(max-width:550px) {
	.zip-navigation .zip-menu .category h3 {
		font-size: 18px;
		margin: 0 0 12px;
		padding-bottom: 12px;
	}
	.zip-navigation .zip-menu ul {
		font-size: 14px;
	}
	.zip-navigation .zip-menu ul>li {
		width: 100%;
	}
}

/* == Calendar Zip Navigation == */

body.calendar-page .zip-navigation {
	background-color:#37474f;
}

body.calendar-page .zip-navigation ul.navbar li.user-display>.username-icon {
	color:white;
	border-color:white;
}

body.calendar-page .zip-navigation ul.navbar li.controls .zip-calendar {
	display:inline-block;
}

body.calendar-page .zip-navigation ul.navbar li.controls .zip-menu-toggle::after {
	content: url(../Content/Images/zip-menu-icon-white.svg);
}

body.calendar-page .zip-navigation ul.navbar li.controls .zip-home::after {
	content: url(../Content/Images/zip-home-icon-white.svg);
}

body.calendar-page .zip-navigation ul.navbar li.controls .zip-calendar::after {
	content: url(../Content/Images/zip-calendar-icon-white.svg);
}

/* == Color Picker == */

.zip-color-pick {
	padding: 16px;
	background: rgba(0, 0, 0, 0.1);
	margin-bottom: 24px;
	display: flex;
	align-items: center;
}

.zip-color-pick * {
	margin: 0;
}

.zip-color-pick input[type="color"] {
	margin-right: 16px;
	outline: none !important;
}

.zip-color-pick .sp-replacer {
	padding: 0;
	border: none;
	margin-right: 16px;
}

.zip-color-pick .sp-preview {
	float: none;
	margin-right: 0;
}

.zip-color-pick .sp-dd {
	display: none;
}

/* === Zip Copyright === */

span.zip-copyright {
	font-size:12px;
	display:block;
	opacity:0.8;
	margin:32px 0 0;
}

.zip-navigation .zip-menu span.zip-copyright {
	margin:0;
}

/* === Misc === */

main img {
	display: inline-block;
	max-width: 100%;
	height: auto;
	border: none;
	vertical-align: middle;
	margin: initial;
}

.clear {
	display: block;
	width: 100%;
	clear: both;
}

.hidden {
	display: none;
}

.zip-editor-label>label {
	margin: 0;
}

hr+.btn,
hr+.btn-o {
	margin-top: 0;
}

.zip-editor-field {
	float: none;
}

.field-validation-valid {
	display: none;
}

.success-message {
	display: block;
	border: 3px solid #00ff99;
	background-color: #00ff990f;
	border-radius: 0;
	margin-bottom: 10px;
	padding: 32px;
	background-image: url(../content/images/zip-booking-confirmed.svg);
	background-repeat: no-repeat;
	background-size: 40px;
	background-position: left 18px center;
	padding-left: 80px;
	font-weight: 600;
	color: #333;
	font-size: 16px;
	margin-bottom: 24px;
}

.zip-same-address {
	height: 30px;
	margin: 16px 0;
}

.zip-same-address * {
	display: inline;
	margin: 0;
}

#tooltip {
	padding: 12px;
	background: rgba(0, 0, 0, 0.8);
	color: white;
	border-radius: 4px;
	font-size: 14px;
	position: absolute;
	display: none;
}

.zip-booking-confirmed {
	text-align: center;
}

main .defaultSkin table.mceLayout {
	width: 100% !important;
}

main .scroll,
main .scrollable {
	overflow: auto;
}

main div#dps {
	height:auto !important;
}

/* Datepicker Status */

.ui-datepicker td.slotsAvailable a {
    color :#005000 !important;
    background: palegreen !important;
    border: 2px solid #005000 !important;
}

.ui-datepicker td.noSlotsAvailable span {
    color: #600000 !important;
    background: lightpink !important;
    border: 2px solid #600000 !important;
}

/* iFrames */

iframe {
	width: 100%;
	border:none;
}

/* -- Zip Animations -- */

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 100%;
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		margin-top: -20px;
	}
	100% {
		opacity: 100%;
		margin-top: 0;
	}
}

.zip-animate-fadeIn {
	animation: fadeIn 0.5s ease;
}

.zip-animate-fadeInDown {
	animation: fadeInDown 0.5s ease;
}

/* -- Zip Calendars (Zip Design System) -- */

body.zip-calendar {
	height: 100vh;
	overflow: hidden;
	width: 100%;
	font-size: 14px;
}

body.zip-calendar .zip-calendar-wrapper {
	display: flex;
	flex-flow: row nowrap;
	height: 100%;
	overflow: hidden;
}

@keyframes zipCalendarSidebar {
	0% {
		opacity: 0;
		transform: translateX(-360px);
	}
	100% {
		opacity: 100%;
		transform: translateX(0);
	}
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar {
	animation: zipCalendarSidebar 0.25s;
	background-color:#37474f;
	background-color:var(--zip-grey);
	color: white;
	flex-grow: 1;
	flex-shrink: 0;
	height: 100%;
	overflow: auto;
	width: 360px;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-body {
	flex-grow: 1;
	flex-shrink: 0;
	height: 100%;
	overflow: auto;
	padding: 2rem;
	position: relative;
	width: calc(100% - 360px);
}

/* Calendar Sidebar */

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar.hidden {
	visibility: hidden;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar::after {
	display: block;
	content: '\00a9 \00a0 Zipporah Ltd.';
	font-size: .85em;
	opacity: 0.4;
	padding: 1.5em;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar label {
	font-weight:600;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar select.zip-select,
body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar input.zip-input {
	background-color:rgba(255,255,255,0.1);
	color:white;
	border:none;
	width: 100%;
	padding:8px;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar select.zip-select option {
	color: #222;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar>section {
	padding: 1.5em;
	border-bottom: solid 1px rgba(0, 0, 0, 0.1);
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar>section.zip-dropdown>.zip-dropdown-toggle:not(.active) {
	margin: 0;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar>section>*:last-child {
	margin-bottom: 0;
}

body.zip-calendar .zip-calendar-wrapper>.zip-calendar-sidebar label.zip-label.zip-label-checkbox {
	font-weight: normal !important;
}

.zip-calendar-sidebar section.zip-calendar-resources select.zip-select {
	margin-bottom:.75em;
}

.zip-calendar-sidebar nav ul {
	margin: 0;
	padding: 0;
}

.zip-calendar-sidebar nav ul > li {
	padding:.75em 1.5em;
	margin:0 -1.5em;
	opacity: 0.75;
}

.zip-calendar-sidebar nav ul > li:hover {
	opacity: 1.0;
	background-color: rgba(255,255,255,0.1);
	transition: 0.2s ease;
}

.zip-calendar-sidebar section.zip-calendar-resources li.zip-dropdown.active {
	opacity: 1.0;
	background-color: rgba(255,255,255,0.1);
}

.zip-calendar-sidebar section.zip-calendar-resources li.zip-dropdown.active+li.zip-dropdown.active {
	border-top:solid 1px rgba(0,0,0,0.15);
}

.zip-calendar-sidebar section.zip-calendar-resources .zip-dropdown-toggle:hover {
	opacity: 1.0;
	color: #fff;
}

.zip-calendar-sidebar section.zip-calendar-resources .zip-dropdown-toggle.active {
	margin-bottom:.75em;
}

.zip-calendar-sidebar section.zip-calendar-resources .zip-dropdown .zip-checkbox-list {
	margin-top:.75em;
	margin-bottom:.75em;
}

.zip-calendar-sidebar .zip-sidebar-toggle {
	display: inline-block;
	opacity: .5;
}

.zip-calendar-sidebar .zip-sidebar-toggle:hover {
	opacity: 1.0;
}

/* Calendar Body */

.zip-calendar-body .zip-navigation {
	padding-top:0;
	padding-bottom:2rem;
	margin-bottom: 2rem;
}

.zip-calendar-body .zip-navigation .zip-container {
	max-width:none;
	padding:0;
}

.zip-calendar-body .zip-navigation .zip-menu .zip-container {
	max-width:1200px;
	padding:0 2rem;
}

.zip-calendar-body .zip-sidebar-toggle {
	display: none;
	background-color:#37474f;
	background-color:var(--zip-grey);
	border-radius: 0px 4px 4px 0px;
	box-shadow: var(--zip-box-shadow-2);
	color: white !important;
	left:0;
	padding: 1rem;
	position: fixed;
	top:50%;
	transform: translateY(-50%);
	z-index: 999;
}

.zip-calendar-body .zip-sidebar-toggle:hover {
	box-shadow: var(--zip-box-shadow);
}

.zip-calendar-body .zip-sidebar-toggle.active {
	display: block;
}

/* -- Zip Calendar - Full Calendar Customisation -- */

.zip-calendar .fc {
	height: 90%;
}

.zip-calendar .fc .fc-view-container {
	height: 90%;
	overflow: auto;
	padding-bottom: 10%;
}

.zip-calendar .fc .fc-time-grid-container,
.zip-calendar .fc-time-grid {
	height: auto !important;
}

.zip-calendar .fc .fc-scroller {
	height: 100% !important;
}

/* FC Buttons */

.zip-calendar .fc .btn {
	border-radius: 3px;
	border: none;
	cursor: pointer;
	height: auto;
	padding: .5em 1em;
}

.zip-calendar .fc .btn:focus {
	outline: none;
}

.zip-calendar .fc .btn.btn-primary {
	background-color: #009ace;
	color: white;
}

.zip-calendar .fc .btn.btn-primary:hover,
.zip-calendar .fc .btn.btn-primary:focus,
.zip-calendar .fc .btn.btn-primary.active {
	background-color: #005c7c;
}

.zip-calendar .fc .btn.btn-primary:hover {
}

.zip-calendar .fc .btn-group .btn:not(:first-child) {
	border-radius: 0;
	border-left: solid 1px rgba(0, 0, 0, 0.1);
}

.zip-calendar .fc .btn-group .btn:first-child {
	border-radius: 3px 0 0 3px;
}

.zip-calendar .fc .btn-group .btn:last-child {
	border-radius: 0 3px 3px 0;
}


/* FC Toolbar */

.zip-calendar .fc .fc-toolbar.fc-header-toolbar {
	align-items: center;
	display: flex;
	flex-flow: row-reverse wrap;
	justify-content: space-between;
	margin-bottom: 2rem;
	margin-left: -1em;
	margin-top: -1em;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-clear {
	display: none;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-left,
.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-center,
.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-right {
	float: none;
	margin: 0;
	padding-left: 1em;
	padding-top: 1em;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-left {
	order: 3;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-center {
	align-items: center;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	order: 2;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-right {
	order: 1;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-center>.btn {
	margin: 0;
}

.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-center>h2 {
	border: none;
	font-weight: normal;
	margin: 0;
	padding: 0 1em;
}

@media(max-width: 768px) {
	.zip-calendar .fc .fc-toolbar.fc-header-toolbar {
		flex-direction: row;
	}
	.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-left {
		order: 2;
	}
	.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-center {
		order: 1;
	}
	.zip-calendar .fc .fc-toolbar.fc-header-toolbar>.fc-right {
		order: 3;
	}
}

/* FC Bookings Calendar */

.zip-calendar .fc th,
.zip-calendar .fc td {
	border-color: rgba(0, 0, 0, 0.2);
}

.zip-calendar .fc .fc-time-grid .fc-slats .fc-minor td {
	border-top-style: solid;
	border-color: rgba(0, 0, 0, 0.1);
}

.zip-calendar .fc .fc-time-grid .fc-slats td {
	font-size: .9em;
	padding: 4px;
}

.zip-calendar .fc .fc-time-grid .fc-slats tr>td:not(:first-child) {
	border-left: none;
}

.zip-calendar .fc .fc-slats td.fc-axis,
.zip-calendar .fc td.fc-axis,
.zip-calendar .fc th {
	/* Left column */
	border-right: none;
	color: #666;
	font-size: .8em;
	padding-left: 8px;
	padding-right: 8px;
	text-transform: capitalize;
}

.zip-calendar .fc th {
	color: #444;
	padding-top: 12px;
	padding-bottom: 12px;
	font-size: .9em;
	font-weight: 600;
}

.zip-calendar .fc hr.fc-divider {
	border: none;
	border-top: solid 1px rgba(0, 0, 0, 0.2);
	margin: 0;
	padding: 0;
}

.zip-calendar .alert-info {
	z-index:-100;
}

/* FC Events */

.fc-event:hover,
.fc-event:focus,
.fc-event:active {
	cursor: pointer;
}

.zip-calendar .fc-ltr .fc-time-grid .fc-event-container {
	margin: 0;
}

.zip-calendar .fc-timeline-event {
	padding: 0;
	height:auto !important;
	box-sizing: border-box;
}

.zip-calendar .fc-time-grid-event .fc-content {
	padding:12px;
}

.zip-calendar .fc .fc-event {
	background-color: #00C853;
	border-radius: 0;
	border: solid 1px rgba(0, 0, 0, 0.1);
	font-size: 1em;
}

.zip-calendar .fc .fc-event:hover {
}

.zip-calendar .fc .fc-event .fc-bg {
	display: none;
}

.zip-calendar .fc .fc-event .fc-time,
.zip-calendar .fc .fc-event .fc-title {
	font-size: 1em;
	margin: 0 0 .5em;
}

.zip-calendar .fc .fc-event .fc-title {
	font-weight: 600;
}

.zip-calendar #external-events {
	margin-bottom: 2rem;
}

.zip-calendar #external-events .fc-event.ui-draggable {
	border:none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color:#ddd;
	color:#222;
	cursor: move;
	width: 2.5rem;
	height: 2.5rem;
	font-size: 1.25rem;
}

.zip-calendar #external-events .fc-event.ui-draggable:hover {
	box-shadow: var(--zip-box-shadow-2);
	background-color: #ccc;
	transition: 0.2s ease;
}

/* FC popover tooltip */

.zip-content .popover {
	background-color: white;
	font-size: .9em;
	padding: 2rem;
	z-index: 1000;
}


/* -- Zip Dropdown (Inherited from Zip Design System to support Unified Calendars) -- */

.zip-dropdown .zip-dropdown-toggle {
	cursor: pointer;
}

.zip-dropdown .zip-dropdown-toggle:hover {
	opacity: 0.5;
	transition: 0.2s ease;
}

.zip-dropdown .zip-dropdown-toggle::after {
	content: '\f078';
	display: inline-block;
	font-family: FontAwesome;
	font-size: .9em;
	font-weight: 600;
	padding-left: 1em;
}

.zip-dropdown .zip-dropdown-toggle.active::after {
	content: '\f077';
}

.zip-dropdown .zip-dropdown-menu {
	display: none;
}

.zip-dropdown .zip-dropdown-menu.active {
	display: block;
	animation: fadeIn 0.5s ease;
}


/* -- Zip Checkbox & Radio controls (Inherited from Zip Design System to support Unified Calendars) -- */

label.zip-label.zip-label-checkbox,
label.zip-label.zip-label-radio {
	display: block;
	cursor: pointer;
	font-weight: 600 !important;
	padding-left: 1.75em;
	position: relative;
	margin: 0;
	margin-bottom: 2rem;
	margin-bottom: var(--zip-space-unit);
	transition: 0.2s ease;
}

label.zip-label.zip-label-checkbox>input[type="checkbox"],
label.zip-label.zip-label-radio>input[type="radio"] {
	left: 0;
	margin: 0;
	position: absolute;
	top: .3em;
	transform: scale(1.2);
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-inline,
label.zip-label.zip-label-radio.zip-label-radio-inline {
	display: inline-block;
	margin-right: 2em;
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-border,
label.zip-label.zip-label-radio.zip-label-radio-border {
	padding: 1em 2em 1em calc(2em + 8px);
	border: solid 1px rgba(0, 0, 0, 0.2);
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-border>input[type="checkbox"],
label.zip-label.zip-label-radio.zip-label-radio-border>input[type="radio"] {
	left: 1em;
	margin-left: 0;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-box,
label.zip-label.zip-label-radio.zip-label-radio-box {
	padding: 1em;
	border: solid 1px rgba(0, 0, 0, 0.2);
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-box:hover,
label.zip-label.zip-label-radio.zip-label-radio-box:hover {
	border-color: #009ace;
	border-color: var(--zip-primary-color);
}

	label.zip-label.zip-label-checkbox.zip-label-checkbox-box.checked,
	label.zip-label.zip-label-radio.zip-label-radio-box.checked {
		border: none;
		background-color: #18FF989f;
	}

	label.zip-label.zip-label-checkbox.zip-label-checkbox-box.disabled,
	label.zip-label.zip-label-radio.zip-label-radio-box.disabled {
		border: none;
		background-color: #B000205f;
		color: rgba(0,0,0,0.25);
	}

label.zip-label.zip-label-checkbox.zip-label-checkbox-box>input[type="checkbox"],
label.zip-label.zip-label-radio.zip-label-radio-box>input[type="radio"] {
	visibility: hidden;
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-consent {
	border: solid 2px rgba(0, 0, 0, 0.2);
	padding: 2em 2em 2em 4em;
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-consent.error {
	border-color: #B00020;
	border-color: var(--zip-danger-color);
	color: #B00020;
	color: var(--zip-danger-color);
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-consent.checked {
	border-color: #00C853;
	border-color: var(--zip-success-color);
	color: #00C853;
	color: var(--zip-success-color);
}

label.zip-label.zip-label-checkbox.zip-label-checkbox-consent>input[type="checkbox"] {
	left: 2em;
	top: calc(2em + .5em);
}

.zip-checkbox-list,
.zip-radio-list {
	margin: 0;
	margin-bottom: 2rem;
	margin-bottom: var(--zip-space-unit);
}

.zip-checkbox-list.zip-checkbox-list-inline,
.zip-radio-list.zip-radio-list-inline {
	margin-top: -1em;
}

.zip-checkbox-list>label.zip-label.zip-label-checkbox,
.zip-radio-list>label.zip-label.zip-label-radio {
	margin-bottom: 1em;
}

.zip-checkbox-list>label.zip-label.zip-label-checkbox:last-child,
.zip-radio-list>label.zip-label.zip-label-radio:last-child {
	margin-bottom: 0;
}

.zip-checkbox-list.zip-checkbox-list-inline>label.zip-label.zip-label-checkbox,
.zip-radio-list.zip-radio-list-inline>label.zip-label.zip-label-radio {
	display: inline-flex;
	margin-right: 1em;
	margin-top: 1em;
	margin-bottom: 0;
}

.zip-checkbox-list.zip-checkbox-list-group,
.zip-radio-list.zip-radio-list-group {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	font-size: .9em;
	margin: 0;
	margin-bottom: 2rem;
	margin-bottom: var(--zip-space-unit);
}

.zip-checkbox-list.zip-checkbox-list-group>label.zip-label.zip-label-checkbox,
.zip-radio-list.zip-radio-list-group>label.zip-label.zip-label-radio {
	display: block;
	flex: 1 0 100%;
	justify-content: center;
	align-items: center;
	padding: .8em 1.6em;
	margin: -1px 0 0;
	border: solid 1px #dddddd;
}

.zip-checkbox-list.zip-checkbox-list-group>label.zip-label.zip-label-checkbox:hover,
.zip-radio-list.zip-radio-list-group>label.zip-label.zip-label-radio:hover {
	background-color: #eee;
	z-index: 1;
}

.zip-checkbox-list.zip-checkbox-list-group>label.zip-label.zip-label-checkbox.checked,
.zip-radio-list.zip-radio-list-group>label.zip-label.zip-label-radio.checked {
	border-color: #37474f;
	border-color: var(--zip-grey);
	background: #37474f;
	background: var(--zip-grey);
	color: white;
	z-index: 1;
}

.zip-checkbox-list.zip-checkbox-list-group>label.zip-label.zip-label-checkbox>input[type="checkbox"],
.zip-radio-list.zip-radio-list-group>label.zip-label.zip-label-radio>input[type="radio"] {
	visibility: hidden;
}

.zip-checkbox-list.zip-checkbox-list-group.zip-checkbox-list-group-inline,
.zip-radio-list.zip-radio-list-group.zip-radio-list-group-inline {
	padding-left: 1px;
}

.zip-checkbox-list.zip-checkbox-list-group.zip-checkbox-list-group-inline>label.zip-label.zip-label-checkbox,
.zip-radio-list.zip-radio-list-group.zip-radio-list-group-inline>label.zip-label.zip-label-radio {
	flex: 0 1 auto;
	margin: -1px 0 0 -1px;
}

@media(max-width:768px) {
	.zip-checkbox-list.zip-checkbox-list-group.zip-checkbox-list-group-inline>label.zip-label.zip-label-checkbox,
	.zip-radio-list.zip-radio-list-group.zip-radio-list-group-inline>label.zip-label.zip-label-radio {
		flex: 0 1 50%;
	}
}

/* -- Zip Cards -- */

/* -- Zip Cards -- */

.zip-card {
	background-color: #fff;
	padding: 0;
	padding-bottom: 0;
	border: solid 1px rgba(0, 0, 0, 0.1);
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
	margin: 0;
	margin-bottom: 2rem;
}

.zip-card-header,
.zip-card-body,
.zip-card-footer {
	padding: 24px;
}

.zip-card-header,
.zip-card-header * {
	margin: 0;
	font-size: 1.1em;
	font-weight: 600;
}

.zip-card-image {
	display:block;
	padding: 50% 0 0;
	background-color: #37474f;
	background-size: cover;
	background-position: center;
}

.zip-card>.zip-card-body:only-child {
	border: none !important;
}

.zip-card-body>*:last-child {
	margin-bottom: 0;
}

.zip-card-body>:only-child>*:last-child {
	margin-bottom: 0;
}

.zip-card-footer *.btn {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.zip-card-footer a {
	text-decoration:underline;
}

.zip-card-header+.zip-card-body {
	border-top: solid 1px rgba(0, 0, 0, 0.1);
}

.zip-card-body+.zip-card-footer {
	border-top: solid 1px rgba(0, 0, 0, 0.1);
}

/* -- Zip Search Booking Process -- */

.zip-search-booking-process {
	display:flex;
	flex-flow:row;
	margin-top:4rem;
	align-items: flex-start;
}

.zip-search-booking-process-filters, .zip-search-booking-process-results {
}

.zip-search-booking-process-filters {
	width:300px;
	padding-right:45px;
	align-self:flex-start;
	opacity:0.9;
	transition:0.2s ease;
}

.zip-search-booking-process-filters:hover {
	opacity:1.0;
}

.zip-search-booking-process-filters-toggle {
	display:none !important;
}

.zip-search-booking-process-filters fieldset.zip-fieldset {
	margin-top:2rem;
}

.zip-search-booking-process-filters>fieldset.zip-fieldset:first-child {
	margin-top:0
}

.zip-search-booking-process-results {
	width:calc(100% - 300px);
}

.zip-search-booking-process-results .row>div {
	flex-grow:0;
}

ul.zip-search-booking-process-results-resources {
	list-style:none;
	margin:-8px 0 0;
	padding:0;
	padding-bottom:inherit;
}

ul.zip-search-booking-process-results-resources>li {
	display:inline-block;
	padding:8px .5em 0 0;
}

ul.zip-search-booking-process-results-resources>li>img {
	height:2.5em;
}

@media(max-width:768px) {

	.zip-search-booking-process {
		flex-flow:column;
	}

	.zip-search-booking-process-filters,
	.zip-search-booking-process-results {
		width:100%;
	}

	.zip-search-booking-process-filters {
		display: none;
		background-color: #fff;
		opacity: 1.0;
		padding:0;
		margin-bottom: 4rem;
	}

	.zip-search-booking-process-filters.active {
		display: block;
	}

	.zip-search-booking-process-filters-toggle {
		display:inline-block !important;
		margin:0 0 2rem !important;
		width: auto;
	}

}

/* -- Zip Resource Details -- */

.zip-resource-details-features {
	list-style:none;
	margin:0 0 2rem;
	padding:0;
	display:flex;
	flex-flow:row wrap;
	align-items:center;
}

.zip-resource-details-features>li {
	margin-right:.5em;
}

.zip-resource-details-features>li>img {
	height:2.5em;
}

.zip-resource-details-gallery {
	list-style:none;
	width:100%;
	margin:0 0 2rem;
	padding:0;
}

.zip-resource-details-gallery>li {
	width:100%;
	margin:0;
	padding:0;
}

.zip-resource-details-gallery>li>a {
	display:block;
	margin:0;
	padding:50% 0 0;
	width:100%;
	background-size:cover;
	background-position:center;
}

.zip-resource-details-gallery>li>a>img {
	width:100%;
}

/* -- Zip Fieldsets -- */

fieldset.zip-fieldset {
	display: block;
	border: 0;
	margin: 0;
	min-width: 0;
	padding: 0;
}

fieldset.zip-fieldset>legend {
	display: block;
	font-size: 1.2em;
	font-weight: bold;
	margin: 0 0 1em;
	padding: 0;
	width: 100%;
	border:0;
}

@media(max-width:768px) {
	fieldset.zip-fieldset>legend {
		font-size: 1em;
	}
}

fieldset.zip-fieldset::after {
	display: block;
	content: '';
	margin-bottom: 1rem;
	overflow: auto;
}

body:not(:-moz-handler-blocked) fieldset.zip-fieldset {
	display: table-cell;
}

/* -- Zip Pagination -- */

ul.zip-pagination {
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-flow:row nowrap;
	align-items:center;
	justify-content:flex-end;
}

ul.zip-pagination>li {
}

ul.zip-pagination>li>a {
	display:flex;
	justify-content:center;
	align-items:center;
	width:2.5em;
	height:2.5em;
	text-decoration:none;
}

ul.zip-pagination>li.zip-pagination-active-page>a {
	background:rgba(0,0,0,0.1);
	border-radius:4px;
	font-weight:600;
}

ul.zip-pagination>li.zip-pagination-next-page>a,
ul.zip-pagination>li.zip-pagination-prev-page>a {
	width:auto;
	height:auto;
}

/* Edit Container (Old Reg systems) */

ol>li #editContainer {
	margin-top:2rem;
}

/* -- Zip Image Gallery -- */

ul.zip-image-gallery {
	list-style: none;
	margin: -4px 0 0 -4px;
	padding: 0;
	display: flex;
	flex-flow: row wrap;
}

ul.zip-image-gallery > li {
	position: relative;
	width:calc(20% - 4px);
	flex-grow:0;
	flex-shrink:0;
	margin: 4px 0 0 4px;
}

ul.zip-image-gallery > li > a {
	display: block;
	padding-top:100%;
	background-size: cover;
	background-position: center;
}

ul.zip-image-gallery > li:first-child {
	width:calc(100% - 4px);
}

ul.zip-image-gallery > li:first-child > a {
	padding-top:50%;
}

/* -- Zip Accessibility -- */

a:focus,
input:focus,
select:focus,
textarea:focus,
button:focus {
	outline: solid 2px #009ace;
}

.zip-skip-to-content-link {
	position: fixed;
	left:-9999px;
	top:-9999px;
	display: block;
	background-color: white;
	padding: .5em;
	line-height: 1;
}

.zip-skip-to-content-link:hover,
.zip-skip-to-content-link:focus {
	left:0;
	top:0;
	z-index: 9999;
}

/* -- Zip Sub Menu -- */

.zip-sub-menu {
	list-style: none;
	margin: 0;
	margin-bottom: 2rem;
	margin-bottom: var(--zip-space-unit);
	padding: 2em;
	background-color: #eeeeee;
}

.zip-sub-menu>li {
	display: block;
	font-weight: 600;
	position: relative;
	padding-left: 24px;
}

.zip-sub-menu>li+li {
	margin-top: .8em;
}

.zip-sub-menu>li::before {
	content: '\f0da';
	display: block;
	font-family: 'FontAwesome';
	font-weight: 600;
	left: 0;
	margin-right: 24px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.zip-sub-menu>li>a:hover {
	opacity: 0.5;
}

.modal {
	display: none;
}

	.modal.is-open {
		display: block;
	}

/**************************\
  Basic Modal Styles
\**************************/

.modal {
	font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;
}

.modal__overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.6);
	display: flex;
	justify-content: center;
	align-items: center;
}

.modal__container {
	background-color: #fff;
	padding: 30px;
	max-width: 1500px;
	max-height: 100vh;
	border-radius: 4px;
	overflow-y: auto;
	box-sizing: border-box;
	width: 700px;
}

.modal__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
/* -- Zip Modal -- */

.zip-modal-wrapper {
	animation: fadeIn 1s ease;
	background-color: rgba(0, 0, 0, 0.5);
	bottom: 0;
	display: none;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	overflow: auto;
	z-index: 999999;
}

	.zip-modal-wrapper.active {
		display: block;
	}

.zip-modal {
	background-color: #fff;
	box-shadow: var(--zip-box-shadow-2);
	left: 0;
	margin: auto;
	max-width: 800px;
	position: absolute;
	right: 0;
	top: 20vh;
	margin-bottom: 20vh;
	width: calc(100% - 2rem);
}

.zip-modal-header,
.zip-modal-body,
.zip-modal-footer {
	padding: 24px;
}

.zip-modal-header {
	position: relative;
}

	.zip-modal-header h2 {
		margin: 0;
		font-size: 1.1em;
		font-weight: 600;
	}

	.zip-modal-header .zip-modal-close {
		position: absolute;
		right: 24px;
		top: 50%;
		transform: translateY(-50%);
	}

.zip-modal-header .zip-modal-close::after {
    content: '\f00d';
    display: inline-block;
    font-family: 'Font Awesome 5 Free', FontAwesome;
    font-size: 1em;
    font-weight: 600;
}

.modal__close {
	background: transparent;
	border: 0;
}

.modal__header .modal__close:before {
	content: "\2715";
}

.modal__content {
	margin-top: 2rem;
	margin-bottom: 2rem;
	line-height: 1.5;
	color: rgba(0,0,0,.8);
}

.modal__btn {
	font-size: .875rem;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-top: .5rem;
	padding-bottom: .5rem;
	background-color: #e6e6e6;
	color: rgba(0,0,0,.8);
	border-radius: .25rem;
	border-style: none;
	border-width: 0;
	cursor: pointer;
	-webkit-appearance: button;
	text-transform: none;
	overflow: visible;
	line-height: 1.15;
	margin: 0;
	will-change: transform;
	-moz-osx-font-smoothing: grayscale;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	transition: -webkit-transform .25s ease-out;
	transition: transform .25s ease-out;
	transition: transform .25s ease-out,-webkit-transform .25s ease-out;
    align-items:center;
}

	.modal__btn:focus, .modal__btn:hover {
		-webkit-transform: scale(1.05);
		transform: scale(1.05);
	}

.modal__btn-primary {
	background-color: #00449e;
	color: #fff;
}



/**************************\
  Demo Animation Style
\**************************/
@keyframes mmfadeIn {
	from {
		opacity: 0;
	}

    flex:1;
}

@keyframes mmfadeOut {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

@keyframes mmslideIn {
	from {
		transform: translateY(15%);
	}

	to {
		transform: translateY(0);
	}
}

@keyframes mmslideOut {
	from {
		transform: translateY(0);
	}

	to {
		transform: translateY(-10%);
	}
}

.micromodal-slide {
	display: none;
}

	.micromodal-slide.is-open {
		display: block;
	}

	.micromodal-slide[aria-hidden="false"] .modal__overlay {
		animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
	}

	.micromodal-slide[aria-hidden="false"] .modal__container {
		animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
	}

	.micromodal-slide[aria-hidden="true"] .modal__overlay {
		animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
	}

	.micromodal-slide[aria-hidden="true"] .modal__container {
		animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
	}

	.micromodal-slide .modal__container,
	.micromodal-slide .modal__overlay {
		will-change: transform;
	}

/* -- Zip Resource Card -- */

.zip-resource-card {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 4rem;
}

.zip-resource-card-image {
	display: block;
	background-color: #eeeeee;
	width: 100%;
	padding-top: 45%;
	background-size: cover;
	background-position: center;
	margin-bottom: 1rem;
}

.zip-resource-card h2 {
	margin: 0;
}

.zip-resource-card .btn {
	margin: 0;
}

.zip-resource-card ul {
	list-style: none;
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	margin: 0 0 0 -2rem;
	padding: 0;
}

	.zip-resource-card ul > li {
		padding: 1rem 0 0 2rem;
	}

	.zip-resource-card ul.zip-resource-card-info {
	}

		.zip-resource-card ul.zip-resource-card-info > li {
			font-weight: 600;
		}

			.zip-resource-card ul.zip-resource-card-info > li > span {
				display: block;
				font-size: small;
				font-weight: normal;
			}

	.zip-resource-card ul.zip-resource-card-facilities {
	}

		.zip-resource-card ul.zip-resource-card-facilities > li {
			font-weight: 600;
		}

			.zip-resource-card ul.zip-resource-card-facilities > li > span {
				display: block;
				font-size: small;
				font-weight: normal;
			}

@media(max-width:768px) {
	.zip-resource-card {
		margin-bottom: 2rem;
	}
}

/* --- Zip Form Actions --- */

.zip-form-actions {
	display: flex;
	flex-flow: row-reverse nowrap;
	align-items: center;
	justify-content: space-between;
	border-top: solid 1px rgba(0,0,0,0.1);
	padding: 2rem 0;
	margin-top: 2rem;
	width: 100%;
}

	.zip-form-actions .btn,
	.zip-form-action button,
	.zip-form-actions input[type="submit"] {
		margin: 0 0 0 1em !important;
	}

	.zip-form-actions .zip-link-cancel {
		opacity: 0.75;
	}


/* --- Zip Booking Panel --- */

.zip-booking-panel {
	border: solid 1px #ddd;
	border-radius: 12px;
	margin-bottom: 2rem;
	display: flex;
	flex-flow: row;
}

.zip-booking-panel-section {
	padding: 2rem;
	flex: 1;
}

	.zip-booking-panel-section:not(:first-child) {
		border-left: solid 1px #ddd;
	}

.zip-booking-panel ul {
	list-style: none;
	margin: -2rem 0 0 -2rem;
	padding: 0;
	display: flex;
	flex-flow: row wrap;
	align-items: flex-end;
	justify-content: space-between;
}

	.zip-booking-panel ul > li {
		padding: 2rem 0 0 2rem;
		white-space: nowrap;
	}

		.zip-booking-panel ul > li:not(:last-child) {
			flex: auto;
		}

.zip-booking-panel .zip-label {
	display: block;
	font-size: small;
	font-weight: 600;
}

.zip-booking-panel p {
	font-weight: 100;
	margin: 0;
}

.zip-booking-panel .btn {
	margin: 0;
}

@media(max-width:768px) {
	.zip-booking-panel {
		flex-flow: column;
	}

	.zip-booking-panel-section {
		padding: 2rem;
	}

		.zip-booking-panel-section:not(:first-child) {
			border-left: none;
			border-top: solid 1px #ddd;
		}
    }

.modal {
    display: none;
}

    .modal.is-open {
        display: block;
    }

/**************************\
  Basic Modal Styles
\**************************/

.modal {
    font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;
}

.modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.6);
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal__container {
    background-color: #fff;
    padding: 30px;
    max-width: 1500px;
    max-height: 100vh;
    border-radius: 4px;
    overflow-y: auto;
    box-sizing: border-box;
    width: 700px;
}

.modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
/* -- Zip Modal -- */

.zip-modal-wrapper {
    animation: fadeIn 1s ease;
    background-color: rgba(0, 0, 0, 0.5);
    bottom: 0;
    display: none;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    overflow: auto;
    z-index: 999999;
}

    .zip-modal-wrapper.active {
        display: block;
    }

.zip-modal {
    background-color: #fff;
    box-shadow: var(--zip-box-shadow-2);
    left: 0;
    margin: auto;
    max-width: 800px;
    position: absolute;
    right: 0;
    top: 20vh;
    margin-bottom: 20vh;
    width: calc(100% - 2rem);
}

.zip-modal-header,
.zip-modal-body,
.zip-modal-footer {
    padding: 24px;
}

.zip-modal-header {
    position: relative;
}

    .zip-modal-header h2 {
        margin: 0;
        font-size: 1.1em;
        font-weight: 600;
    }

    .zip-modal-header .zip-modal-close {
        position: absolute;
        right: 24px;
        top: 50%;
        transform: translateY(-50%);
    }

        .zip-modal-header .zip-modal-close::after {
            content: '\f00d';
            display: inline-block;
            font-family: 'Font Awesome 5 Free', FontAwesome;
            font-size: 1em;
            font-weight: 600;
        }

.modal__close {
    background: transparent;
    border: 0;
}

.modal__header .modal__close:before {
    content: "\2715";
}

.modal__content {
    margin-top: 2rem;
    margin-bottom: 2rem;
    line-height: 1.5;
    color: rgba(0,0,0,.8);
}

.modal__btn {
    font-size: .875rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: .5rem;
    padding-bottom: .5rem;
    background-color: #e6e6e6;
    color: rgba(0,0,0,.8);
    border-radius: .25rem;
    border-style: none;
    border-width: 0;
    cursor: pointer;
    -webkit-appearance: button;
    text-transform: none;
    overflow: visible;
    line-height: 1.15;
    margin: 0;
    will-change: transform;
    -moz-osx-font-smoothing: grayscale;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transition: -webkit-transform .25s ease-out;
    transition: transform .25s ease-out;
    transition: transform .25s ease-out,-webkit-transform .25s ease-out;
}

    .modal__btn:focus, .modal__btn:hover {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

.modal__btn-primary {
    background-color: #00449e;
    color: #fff;
}



/**************************\
  Demo Animation Style
\**************************/
@keyframes mmfadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes mmfadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes mmslideIn {
    from {
        transform: translateY(15%);
    }

    to {
        transform: translateY(0);
    }
}

@keyframes mmslideOut {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-10%);
    }
}

.micromodal-slide {
    display: none;
}

    .micromodal-slide.is-open {
        display: block;
    }

    .micromodal-slide[aria-hidden="false"] .modal__overlay {
        animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    }

    .micromodal-slide[aria-hidden="false"] .modal__container {
        animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
    }

    .micromodal-slide[aria-hidden="true"] .modal__overlay {
        animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    }

    .micromodal-slide[aria-hidden="true"] .modal__container {
        animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
    }

    .micromodal-slide .modal__container,
    .micromodal-slide .modal__overlay {
        will-change: transform;
}


/* General style fixes */

#submitClient,
#submitOrganisation {
	border: 1px solid white !important;
}

/* Confirm Details page - fixes */

#confirmDetailsBody label {
	font-size: 14px;
	font-weight: 700;
}

#confirmDetailsBody p {
	font-size: 16px;
	padding: 10px;
	border: 2px solid #f4f4f4;
	border-radius: 7px;
	min-height: 45px;
}

#additionalInfoDiv h4 {
	color: #606060;
	border-top: 2px solid #f4f4f4;
	padding-top: 10px;
}

#additionalInfoDiv label {
	color: #606060;
	font-weight: 400;
}

#addressDetails {
	padding: 10px;
	border: 2px solid #f4f4f4;
	border-radius: 7px;
	min-height: 45px;
}

	#addressDetails p {
		padding: 0;
		min-height: auto;
		border: 0px;
		margin-bottom: 5px;
	}



#continueForm2 #itemTypes .md-col-4 .row .number span{
	width: 90px;
}


/* === Loader === */

  .cm-loader {
	height: 150px;
	width: 150px;
	border: 3px solid transparent;
	border-radius: 50%;
	border-top: 4px solid var(--zip-secondary-color);
	-webkit-animation: spin 4s linear infinite;
	animation: spin 4s linear infinite;
	position: relative;
	margin: 0 auto;
  }
  
  .cm-loader::before,
  .cm-loader::after {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 6px;
	right: 6px;
	border-radius: 50%;
	border: 4px solid transparent;
  }
  
  .cm-loader::before {
	border-top-color: #D6D6D6;
	-webkit-animation: 3s spin linear infinite;
	animation: 3s spin linear infinite;
  }
  
  .cm-loader::after {
	border-top-color: var(--zip-primary-color);
	-webkit-animation: spin 1.5s linear infinite;
	animation: spin 1.5s linear infinite;
  }   
			   
  @-webkit-keyframes spin {
	  from {
		  -webkit-transform: rotate(0deg);
		   transform: rotate(0deg);
	  }
	  to {
		  -webkit-transform: rotate(360deg);
		  transform: rotate(360deg);
	  }
  }   
		  
  @keyframes spin {
	  from {
		  -webkit-transform: rotate(0deg);
		  transform: rotate(0deg);
	  }
	  to {
		  -webkit-transform: rotate(360deg);
		  transform: rotate(360deg);
	  }
  }
  


  .small-loader {
	display: inline-block;
	vertical-align: middle;
	border: 3px solid #f3f3f3;
	border-radius: 50%;
	border-top: 3px solid var(--zip-primary-color);
	width: 20px;
	height: 20px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
  }
  
  
  /* Safari */
  @-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
  }
  
  @keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
  }

  #LoadingSearchResults .loader{
	margin: 0 auto;
  }

.zip-facility-selector{
	display: block !important;
  }

  #itemTypes .block{
	display: block !important;
  }

  #itemTypes .block .md-col-4{
	display: inline-block ;
	width: 30% ;
  }


.spinner-disabled {
	width: 100% !important;
	padding: 12px !important;
	border: solid 1px rgba(0, 0, 0, 0.3) !important;
}