/* --- Reset --- */
* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0px;
	margin: 0px;
}

html,
body {
	height: 100%;
	width: 100%;
}

body {
	font-family: 'Inter', sans-serif;
	font-weight: 300;
	background-color: #ebebee;
	color: black;
	padding-top: 80px;
}

::-webkit-input-placeholder,
:-moz-placeholder,
::-moz-placeholder,
:-ms-input-placeholder {
	color: #999;
	font-family: 'Inter', sans-serif;
	font-weight: 300;
}

p {
	font-size: 18px;
}

a:hover,
input,
textarea,
select,
button,
header {
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
	-webkit-appearance: none;
	appearance: none;
	font-family: 'Inter', sans-serif;
}

/* --- Variables --- */
:root {
	--main-bg-color: #cc0000;
	--main-bg-color-hov: #990000;
	--main-bg-text-color: #fff;
	--main-bg-text-color-hov: #fff;
}

/* --- Main styles --- */
.inner {
	max-width: 1400px;
	width: 100%;
	display: block;
	margin: 0 auto;
}

.scrolled header {
	box-shadow: 0 2px 4px 0 rgb(0 0 0 / 8%) !important;
}

header {
	background-color: white;
	position: fixed;
	padding: 10px 0;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 300;
}

header .inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

header .logo img {
	max-height: 60px;
}

header nav {
	padding: 10px 0;
}

header nav ul {
	list-style-type: none;
}

header nav ul li {
	display: inline-block;
}

header .selected {
	color: var(--main-bg-color) !important;
}

header nav ul li a {
	padding: 30px;
	text-decoration: none;
	color: black;
	font-weight: bold;
}

header nav ul li a:hover {
	text-decoration: underline;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea {
	border: solid 1px #ccc;
	padding: 20px;
	font-size: 20px;
	width: 100%;
	border-radius: 5px;
}

textarea {
	border: solid 1px #ccc;
	padding: 20px;
	font-size: 20px;
	width: 100%;
	border-radius: 5px;
	resize: none;
	height: 200px;
}

label {
	display: block;
	margin-top: 20px;
	margin-bottom: 3px;
}

button,
input[type="submit"] {
	padding: 20px;
	background-color: var(--main-bg-color);
	color: var(--main-bg-text-color);
	cursor: pointer;
	border-radius: 5px;
	font-weight: bold;
	border: none;
	min-width: 180px;
	width: 100%;
	padding: 20px;
	font-size: 20px;
	margin-top: 20px;
	
}

button:hover,
input[type="submit"]:hover {
	background-color: var(--main-bg-color-hov);
	color: var(--main-bg-text-color-hov);
}

video {
	width: 100%;
	aspect-ratio: 16 / 9;
}

.hero {
	background-color: var(--main-bg-text-color);
	color: var(--main-bg-color);
	padding-top: 50px !important;
}

.hero h1 {
	font-size: 20px;
}

.hero h2 {
	font-size: 60px;
	margin-top: 10px;
}

.hero p {
	color: black;
	margin-top: 30px;
}

.hero.together .image {
	flex: 1.5 !important;
}

.together .inner {
	display: flex;
	gap: 100px;
	flex-direction: row;
	align-items: center;
}

.together .inner .image img {
	width: 100%;
}

.together .inner .image {
	flex: 1;
}

.together .inner .text {
	flex: 1.5;
}

.touchBottom {
	padding-bottom: 0 !important;
}

.touchBottom .inner .text {
	padding-bottom: 150px !important;
}

.btn {
	margin-top: 50px;
	padding: 20px;
	font-size: 20px;
	background-color: var(--main-bg-color);
	color: var(--main-bg-text-color);
	border: none;
	outline: none;
	border-radius: 3px;
	cursor: pointer;
	display: inline-block;
	text-decoration: none;
}

.btn:hover {
	background-color: var(--main-bg-color-hov);
	color: var(--main-bg-text-color-hov);
}

.light {
	background-color: white !important;
	color: black !important;
}

.dark {
	background-color: #ebebee !important;
	color: black !important;
}

section {
	padding: 150px 0;
}



footer {
	width: 100%;
	background-color: #333333;
	color: white;
	background-image: url(assets/slanted-gradient.svg);
	background-size: cover;
	background-position: center;
}

footer .cols {
	display: flex;
	justify-content: space-between;
	gap: 50px;
	padding: 70px 0;
}

footer .cols .col {
	flex: 1;
}

footer .cols .col h5 {
	font-size: 16px;
	margin-bottom: 5px;
	color: white;
}

footer .cols .col p {
	font-size: 14px;
	color: #ebebee;
}

footer .legal {
	background-color: #242424;
}

footer .legal .inner {
	display: flex;
	justify-content: space-between;
	gap: 30px;
	padding: 20px 0;
}

footer .legal .inner a {
	color: #0099cc;
	font-weight: bold;
	text-decoration: none;
}

footer .legal .copyright {
	color: #ebebee;
}

footer .legal .watermark {
	color: white;
}

.main .text p {
	margin-top: 20px;
}

.main .btn {
	margin-top: 20px;
	padding: 20px;
	font-size: 20px;
	background-color: var(--main-bg-color);
	color: var(--main-bg-text-color);
	border: none;
	outline: none;
	border-radius: 3px;
	cursor: pointer;
	display: inline-block;
	text-decoration: none;
}

.main .btn:hover {
	background-color: var(--main-bg-color-hov);
	color: var(--main-bg-text-color-hov);
}

.main img {
	border-radius: 10px;
	
}


.guide .all {
	display: flex;
	flex-direction: column;
	gap: 50px;
	margin-top: 50px;
}

section h2 {
	font-size: 50px;
	color: #242424;
}

.guide .steps {
	display: flex;
	gap: 20px;
	background-color: white;
	justify-content: center;
	align-items: center;
}

.guide .steps .count {
	
}

.guide .steps .count .stepNo {
	font-size: 30px;
	font-weight: bold;
	background-color: var(--main-bg-color);
	border-radius: 50%;
	height: 50px;
	width: 50px;
	color: var(--main-bg-text-color);
	display: flex;
	justify-content: center;
	align-items: center;
}

.guide .steps .count .stepNo span {

}


.location {
	width: 100%;
	background-color: #333333;
	color: white;
	background-image: url(assets/rainbow-vortex.svg);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}
.location h2 {
	color: #ebebee;
}


.location .map {
	background-color: white;
	border-radius: 10px;
	width: 100%;
	padding: 20px;
}

.location .map p {
	color: #000;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	margin-top: 10px;
	
}

.location iframe {
	border: none;
	
}


.reviews .reviewsHolder {
	display: flex;
	gap: 20px;
	margin-top: 30px;
}

.reviews .review {
	display: inline-block;
	background-color: white;
	padding: 20px;
	border-radius: 10px;
	box-shadow: 0 2px 4px 0 rgb(0 0 0/8%);
	flex: 1;
}

.reviews .review .reviewBody {
	font-size: 20px;
}

.reviews .review .author {
	font-size: 16px;
	font-weight: bold;
	margin-top: 10px;
	color: #666;
}

.contact {
	background-color: white;
	
}
.contact .inner {
	display: flex; 
	align-items: center;
	justify-content: space-between;
	gap: 100px;
}


.contactUs {
	flex: 1.5;
}

.contact h2 {
	color: var(--main-bg-color);
}

.contact p {
	font-weight: bold;
	margin-bottom: 10px;
	margin-top: 10px;
}


.openingTimes {
	min-width: 400px;
	padding: 30px;
	background-color: #ebebee;
	border: solid 3px var(--main-bg-color);
	border-radius: 10px;
	box-shadow: 0px 2px 4px rgb(0 0 0 / 10%);
}


.openingTimes {
	text-align: center;
	flex: 1;
}

.openingTimes h2 {
	font-weight: bold;
	color: var(--main-bg-color);
	font-size: 30px;
	
}

.openingTimes .hours {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.openingTimes .hours div {
	font-size: 20px;
}

.openingTimes .allHours {
	margin-top: 30px;
}



/* --- Animation --- */
.animate-in {
	opacity: 0;
	transform: translateY(150px);
	transition: opacity 1s ease, transform 1s ease
}

.animate {
	opacity: 1;
	transform: none
}

form .group {
	display: flex;
	gap: 20px;
}

form .group div {
	flex: 1;
}

.turnstile {
	height: 69px;
	margin-top: 20px;
}

.notification{
    background-color:#fff;
    border-radius:5px;
    color:#000;
    font-weight:700;
    padding:20px;
    text-align:left;
    box-shadow:2px 3px 20px rgba(0,0,0,.7)
}
.notification .app{
    font-size:12px
}
.notification .message{
    font-size:22px;
    margin-top:10px
}
#notLink{
    text-decoration:none
}
.notificationArea{
    position:fixed;
    bottom:20px;
    right:20px;
    width:100%;
    max-width:400px;
    color:#fff;
    z-index:501;
    text-align:left
}
.notificationArea .msg{
    margin-top:20px;
    display:none;
    padding:30px;
    box-shadow:2px 3px 20px rgba(0,0,0,.4);
    border-radius:10px;
    background-color:#fff;
    border:solid 1px #ccc;
    color:#000;
    overflow-wrap:break-word;
    word-wrap:break-word;
    -ms-word-break:break-all;
    word-break:break-all;
    word-break:break-word;
    -ms-hyphens:auto;
    -moz-hyphens:auto;
    -webkit-hyphens:auto;
    hyphens:auto
}
.notificationArea .msg .msg-title{
    font-size:18px;
    font-weight:700;
    color:#09c
}
.notificationArea .msg .msg-body{
    font-size:22px;
    margin-top:8px;
    margin-bottom:8px
}
.notificationArea .msg .time{
    font-size:12px;
    color:#919191;
    text-transform:uppercase
}
.notificationArea .error-msg .msg-title{
    color:#b22222!important;
    background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAI0SURBVGhD7ZhNK0RRGMdnY+5GWSk772+ZyEvZWqAkSZGFKAsiNBoNIiRlRUoaG0VWpHwAmzEWVj6BjJW9DzB1r/Nc5x63M8+de2bmvhx1/vWr05znnPs8N/NrElFRUVFRUfEjekYb1p+j2V+0Ifrx/4j+UllNBvg2MpoBwBo+o9vyR89EU1bzf0NEU3Rb7ujpihh547n8AbQc7NEyeUPe9BPfvAXs0TI5Q76wY1jjdqCGlssV4y1SQf5M3rGm7Zg1pJYekyfkzSawhjGglh6TI7w23YBaqbSKadMNabTqpM34eI8xO9Bvsk7W/D6ckUKrTtrcmOhmA2xOduXtA6FrtZA2d6Y72QCwxmqA0LTqps2DmRgb4GguhtYA5h1haNVNm9C0NcDxfAdaYxG4VkW0ebLQzgY4XWxHayzgrkC1KqLNs6U2NsD5SitaYycwrTppkye11sIGgDVWYwfuDESrTtrkuUo0swGuk01oDY/vWi2kTZ6bZCMb4HarAa3B8E2ror82Le5269kA93t1aA2G+Qw/tOqmTZ6H/Vo2wONhLVrjhOdaLfbXZrnAszzVqog2vcYzrYpqk+frocq4jLeYwBqrKQQ80xOtimqTZ3uqi30HYI3VuFG2VovRJs/ySB8bANZYjQgla7VYbfK8XtQYq6O9JrDGakQweyhFq8Vq009K0io5lMUuCwPohbYlHnLoE7ssDMiX+YO2JR74lzgcxC4MErOHtDZI21JRUVFRUbElEvkBB3ktvFH9fsYAAAAASUVORK5CYII=");
    background-size:18px;
    padding-left:25px;
    background-repeat:no-repeat
}
.notificationArea .success-msg .msg-title{
    color:#32cd32!important;
    background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAEBgAABAYBmSDe8AAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAT8SURBVGiB7ZpdiBVlGMd/z5xzdtfSNcMLI+hC7IPWo3tmzroW6nYRhqVU9gUZWZTRWpZdJBKVGWh4FRVFGpn4FSQUqSmZYFkryp55x7YMpKI7MRPBzNxlz5mnizbamT27OzNnDkb4uzrnPe/zPP8/78yc92PgEpeoC5JWovbD7c39uf45wBxgKnAdcGWo2xkVPS4q34vKwabepoNds7rOpVG/NiOK1Xq0dYHlW48AtwMNMTP0AXtUdJNX8HYj+EmlJDZiu/YDwMvAjUlzBISoHANWu0V3R6L4uAFt3W2TK1ZlPXBrkoIR+LycLXf2TO/5JU5QLCO2ay8B3gDGxIlLwB9Ap3HM1qgBVqReihRM4VVgA/U3ATAW2GK79itRAyKNSMEU3hGVzqSqauRt45inR+s06ogUTOG1i2gC4CnbtdeM1mnEEXFKzn0q+lF6mhKjwD3GMZ8M12FYI7ZrTwFcoLkOwpJwtpwtF4Z7mlW/tBQBNvLfMQEwPlvOfjCgbQhVjTiucy8wu66yktHhuM6d1X4YakQRFX2p7pKCXBCVmZZvzYrQd1W1URlipFgqzgPyaaiLioq+6BbdI77ljzqBVNFW29hzw+1DjPiWvyQtgRHZ5xW811uOtTQAm6MEiMrj4baAkfbD7c3AvHT0ReK8qCxF0Ia+hhXA9ChBKnrHtG+nXT64LWBkYD3RmJ7OkRGV5W7R/bnYXZwhKqtihI7JVDJzBjcEjIhKlJstLfa7jvv+lB+nNPqW/x6QjRMc1howoqJTUxA4Kip6RkUXI+i4c+PWANMSpAloDY/ItbUIjMHznu2dsF17pqgsT5gjoDVgxLf8iXEyqeh2YEtMAZ95trfRKTmXAZuATMz4fwhoDY/I2DiZLN9aahzzsIqu5O+J3YgMXFJPDHxeC1wfp16IcQEtoR9jrRhVdEPLsZYGz/bWAZ0w8uaB5VvLPNs7Uewu3gIsi1OrCgGt4Zs97tbM/Y29jfvaD7c3G8esB+4CeqtWVfnQLbrb8z35Cb7lbw3XTsDvg78Eklm+dTpBwo7+XP/efE9+gnHMLhVdCPwZ6nPKt/xnAXL9uXXA1QnqhAloDY/I8YRJb8715w45Jecaz/b2qmhHqNBjnu39Zrv2QiCtKVBAa/hm/6GGxDeo6IG27rbJnu2VLN+aC5wCthnH7M735CcAb9aQP0xAa3hEvqwx+eSKVfnGKTn5UlvJq2Qqsxv7Gp8ByPXn3iKdSwoAFT0w+HtgWlDOlr/OlrMXqG3L5yoV/arVa51/tPXoIYCBS2pRDTnDnG/qbeoa3DDkcVswhW2i8mAKxfpUdFElUzmSLWe/A65IIScAorLZLbqLB7cNeQRmKpltKdVrFJXt2XL2U1I0McAQjVX/AG3XLgFOysXTots4Zka4seqfkqisq7+eZIjK2qrtwwXYrr0LmF83RcnYaRwTcRflX54jNA24yJwtZ8vDTvmHNWIc81O1Rf5FQoFHRzozGXHi5hbdHaLyQuqy4rNypH1f+B8dK0RanZ189+SeSScnWYJ01K4rFquNY1ZE6Rj36G2Bim4SlfCxc6qo6K/AQ57t7Y8aE2txYxyzK1vJtgG744qLwU4VnRnHBNR2PH0bsAq4KWmOwahoV6aSWV1qK32RJL7mNx8KptAhKk8CdxN/l7JXRT8G1nu2d7AWHfV+hWMiMH6gy1ngdL1e4bjEJerEX2O9t4Dhlm6SAAAAAElFTkSuQmCC");
    background-size:18px;
    padding-left:25px;
    background-repeat:no-repeat
}
.notificationArea .perm-not{
    background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAF3SURBVGhD7ZlNTsMwGEQjcQ2650JIXJGCuBmIwhYJvllEsqLn1GOnMZH8pLdoEk/mSxf98TQYDAb/mlP4Gn6Fvzure76FD2EVKv8eUviefoT3oY2ePAX28CW0+Q4prIeX0IaCempDIT21oZCe2lBIT20oZOlP+BSek2Olao3WKoPOL7WhkFTd+DEUd6EzhK7VGqGMkiFsKCRVTy+ldIi0/Iyy6NpUGwpJpSLXhqhZM2tDIUudQi3lpQ2FkCXFWstLGwrJuVZwi/LShkLWzBXdory0oZBr0hApteWlDYWUmBuipby0oZASDz1ArvxMyxA2FLImlddrOlYzhA2F5MyV1/G1c5SV04ZCyJKCWwxhQyFLnWKtQ9hQSGpNoZYhbCgk9fBfpw//g0bqxnp6TvlZrdHakvLShkJ6akMhPbWhkJ7aUEhPbQ7/5642Fyish8+hjXZGtLlAgXuqTZaqDQ6hXRptLugtpPBb+hnqs6K6/GAwGNyaafoDOdhLmHQSjEAAAAAASUVORK5CYII=");
    background-size:20px;
    background-repeat:no-repeat;
    background-position:right 30px center;
    padding-right:80px;
    cursor:pointer
}




footer ul {
	margin-left: 30px;
}

footer ul a {
	color: #fff;
}


.social {
	display: flex;
	gap: 10px;
}

.social a  {
	color: white;
	font-size: 40px;
	text-decoration: none;
}

.social a:hover {
	color: var(--main-bg-color);
}

.googleMap {
	width: 100%;
	aspect-ratio: 16 / 9;
}

.together .inner .coveredArea {
	flex: 1;
}

.together .inner .map {
	flex: 2;
}

.disabledBtn {
	background-color: #333333 !important;
	cursor: not-allowed !important;
}

.contactMethods span {
	display: inline-block;
	margin-left: 20px;
	font-size: 18px;
	color: black;
}

.contactMethods span a {
	color: var(--main-bg-color-hov);
	margin-left: 5px;
}

.contactUs a {
	color: var(--main-bg-color-hov);
}


.mobileOnly {
	display: none !important;
}





/* --- Dark mode --- 
@media (prefers-color-scheme: dark) {
	body {
		background-color: #2b2b2b;
		color: #ccc !important;
	}

	.light {
		background-color: #666666 !important;
		color: #ebebee !important;
	}

	.dark {
		background-color: #303030 !important;
		color: #ebebee !important;
	}
}
*/

/* --- Privacy policy --- */
.privacy h1 {
	font-size: 60px;
	margin-bottom: 10px;
}

.privacy h2 {
	font-size: 35px;
	margin-top: 30px;
	margin-bottom: 5px;
}

.privacy p {
	font-size: 20px;
}

.privacy p+p {
	margin-top: 20px;
}

.privacy li {
	font-size: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.privacy ul {
	margin-left: 50px;
}

.privacy ol {
	margin-left: 50px;
}

.privacy {
	padding: 20px;
}

/*
@media only screen and (max-height: 800px) {
	section {
		padding: 50px 0 !important;
	}
}
*/


/* Small desktop sizing issues --- */
@media only screen and (max-width: 1410px) {
	.inner {
		width: 95%;
	}
}

/* --- Mobile styles --- */
@media only screen and (max-width: 950px) {
	.together .inner, .contact .inner, footer .cols, .legal .inner, header .inner {
		flex-direction: column !important;
		gap: 20px;
	}

	footer .cols {
		padding: 30px 0;
	}

	.together .image {
		order: 1;
	}

	.together .text {
		order: 2;
	}

	.reviews .reviewsHolder {
		flex-direction: column;
		order: 2;
	}

	form .group {
		flex-direction: column;
		gap: 0;
	}

	.reviews .text {
		order: 1;
	}

	section {
		padding: 30px;
	}

	.hero {
		padding-top: 30px !important;
	}

	header {
		position: relative;
	}

	body {
		padding-top: 0 !important;
	}

	header nav {
		display: none; /* Hide all list items by default on smaller screens */
	}

	.contactMethods span {
		margin-top: 20px;
		margin-left: 0;
	}

	.openingTimes {
		min-width: auto !important;
	}

}