a {
	text-decoration: none;
}

h2 {
	font-size: 30px;
	font-weight: 600;
}

h3 {
	font-size: 26px;
	font-weight: 600;
}

input, select, textarea {
    outline: 0 !important;
    height: 40px;
    padding: 0 8px;
    border-radius: 10px;
    border: 1px solid lightgrey;
}

.hr {
    border: 1px solid var(--tertiary-colour) !important;
    height: 2px !important;
    opacity: 1 !important;
    background-color: unset;
}

textarea {
    height: unset;
    padding: 8px;
}

input[type=checkbox], input[type=radio] {
    width: 20px !important;
    margin-right:10px;
    height: 15px !important;
}

.s9-container {
	padding-inline: 15px;
}

.button-spacer {
	.btn-wrapper {
		margin: 0 15px;
	}
}

.p-margin-0 {
	margin-bottom: 0;
}

.light-blue-title {
    color: var(--secondary-colour) !important;
}

.spinner {
	height: 20px;
	width: 20px;
	display: block;
	border: 3px solid var(--primary-colour);
	border-bottom-color: var(--secondary-colour);
	border-radius: 50px;
	animation: spin infinite linear 1.5s;
}

.btn-primary, #ih-submit, #payment-button input, #outstanding--booking input, #trade-button input {
	padding: 0.5rem 2rem;
}

#ih-submit, #payment-button input, #outstanding--booking input, #trade-button input {
	background-color: var(--primary-colour);
	color: var(--primary-contrast);
	border: none;
	border-radius: 0.375rem;

	&:hover, &:focus {
		box-shadow: 0 0 100px 100px rgba(255,255,255,.1) inset;
	}
}

#outstanding--booking {
	width: 100%;
	.outstanding-pay {
		text-align: center;
	}
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(359deg);
	}
}

#nav-area {
	z-index: 3;
	box-shadow: 0 -6px 15px -15px rgba(0, 0, 0, 0.75);
	background-color: var(--primary-colour) !important;
	transition: .3s ease;
	align-items: normal;

	.nav-logo {
		width: 170px;
		position: relative;
		top: -17px;
	}

	.white {
		display: block;
	}
	.blue {
		display: none;
	}

	#navbar-main {
		background: none;
		padding: 0;
	}

    .navbar-brand {
        margin-right: 0;
    }

    #menu-primary {
        padding-top: 15px;
    }

	.topnav {
		opacity: 1;
		transition: .3s ease;

		.nav-link {
			padding: .5rem 1rem;
			font-weight: 600;

			@media (max-width: 767px) {
				padding: .5rem;
			}

			a i {
				color: var(--light-colour);
				text-shadow: 0 0 2px var(--primary-colour);

                &:hover, i {
                    color: var(--primary-colour);
                }
			}
		}
	}

	&.scrolled {
		background-color: var(--page-colour) !important;
		top: -38px !important;
		box-shadow: 0 6px 15px -15px rgba(0, 0, 0, 0.75);

		.topnav {
			visibility: hidden;
			opacity: 0;

			@media (max-width: 767px) {
				height: 57px;
			}
		}

		.nav-logo {
			top: 0;
		}

		.white {
			display: none;
		}
		.blue {
			display: block;
		}

		.nav-item a {

			color: var(--primary-colour);

			&:hover {
				color: var(--secondary-colour);
			}
		}
	}

	.nav-item a {
		color: white;

		&:hover {
			color: var(--secondary-colour);
		}
	}

	#navbar-main {
		.nav-item {
			a.nav-link {
				text-transform: uppercase;
				padding: .5rem 1rem;
				font-weight: 600;
			}
		}
	}
}

#content-area {

	.breadcrumb {
		a {
			margin: 0 5px;

			&:first-child {
				margin-left: 0 !important;
			}
		}
		p {
			margin: 0 5px;
		}

		@media (max-width: 767px) {
			justify-content: center;

			p {
				text-align: center;
			}
		}
	}

	#notification--wrapper {
		.notification-field {
			background-color: var(--primary-colour);
			color: white;
			padding: 0.5rem;
			border-radius: 0.375rem;;
			p {
				margin: 0;
			}

			i {
				margin: 1rem;
			}

			@media (max-width: 992px) {
				p {
					display: flex;
					flex-direction: column;
					align-items: center;
					margin: 1rem;
					text-align: center;
				}
			}
		}
	}

	.holiday-inspiration, .blog-inspiration {

		display: grid;
		grid-auto-rows: auto;

		h5 {
			color: var(--light-colour);
			font-weight: 600;
		}
	}

	.blog-inspiration {
		grid-template-columns: repeat(4, 1fr);
	}

	.inspiration-card {
		background-size: cover;
		background-position: center;

		a {
			display: flex;
			justify-content: space-between;
			align-items: flex-end;
			padding: 15px;
			min-height: 250px;
			height: 100%;
			text-decoration: none;
            /* Marc 11/02 */
			/*background-image: linear-gradient(45deg, var(--primary-colour) 0%, transparent 70%);*/
            background-image: linear-gradient(45deg, var(--primary-colour) 0%, transparent 20%);
			transition: .3s ease;
			font-weight: 500;
            text-shadow: 0 0 10px rgba(0,0,0,0.9);

			&:hover {

				.card-arrow {
					background-color: rgba(205, 158, 40, 1);
				}
			}

			.card-details {
				color: var(--page-colour);
			}

			.card-arrow {
				color: var(--page-colour);
				background-color: rgba(21, 53, 88, .6);
				padding: 3px 10px;
				border-radius: 5px;
				transition: .3s ease;
			}
		}
	}

	.card-title-bg {
		display: flex;
		justify-content: center;
		align-items: center;

		h3 {
			color: white;
			padding: 0.5rem 1rem;
			margin: 0;
			text-transform: uppercase;
			font-weight: 600;
			font-size: 24px;
		}
	}

	.home-hero {
		position: relative;
		padding-inline: 0;

		.row {
			margin-inline: 0;
		}

		.home-slider, .page-slider {
			position: relative;
			overflow: hidden;
			height: 75vh;


			.col {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				display: none;
				padding: 0;


				&:first-child {
					display: block;
				}

				figure {
					height: 100%;
					width: 100%;


					img {
						object-fit: cover;
						object-position: center;
						height: 100% !important;
						width: 100%;
					}
				}
			}
		}

		.page-slider {
			height: 50vh;
		}

		.hero-overlay {
			height: 100%;
			width: 100%;
			gap: 2em;

			&:before {
				content: "";
				background: #000000;
				opacity: 20%;
				height: 100%;
				width: 100%;
				position: absolute;
				top: 0;
				left: 0;
			}

			h1 {
				color: var(--light-colour);
				margin: 0;
				z-index: 1;
				letter-spacing: 10px;
				text-transform: uppercase;
				position: relative;
				text-shadow: 0 0 10px rgba(0,0,0,0.9);
			}

			p {
				color: var(--light-colour);
				z-index: 1;
				font-size: 1.2rem;
				position: relative;
				text-shadow: 0 0 4px rgba(0,0,0,0.9);
				margin: 0;
				text-align: center;
			}

			.btn-wrappers {
				display: flex;
				justify-content: center;
				z-index: 1;
			}
		}

		@media(min-width: 767px) {
			.hero-overlay {
				h1, p, .span-title {
					max-width: 65vw;
				}
			}
		}
	}

	/* Trustpilot Reviews */
	#s9-slider-trustpilot_review-1 {
		a.trustpilot-review {
			margin: 0 0.5em;
		}
	}

	div.trustpilot-reviews {
		a.trustpilot-review {
			width: calc(25% - 15px);
			padding: 10px;
			background-color: var(--page-colour);
			text-decoration: none;

			h3 {
				-webkit-box-orient: vertical;
				display: -webkit-box;
				-webkit-line-clamp: 1;
				overflow: hidden;
			}

			p.review-content {
				-webkit-box-orient: vertical;
				display: -webkit-box;
				-webkit-line-clamp: 4;
				overflow: hidden;
			}

			span.review-meta {
				opacity: 0.8;
			}
		}
	}

	.light-bg {
		background-color: var(--nav-colour);
	}

	/* Holiday PopUp */
	#book-popup, #image-popup, #ask--question, #ask--brochure, #see--tc {
		position: fixed;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 25%;
		background-color: var(--page-colour);
		z-index: 5;
		padding: 1rem;
		border-radius: 10px;
		display: none;

		#book_airport {
			text-transform: capitalize;
		}

		h3 {
			text-align: center;
		}

		input {
			border: none;
			text-align: center;
		}

		select {
			height: 40px;
			padding: 10px;
			border: 1px solid var(--primary-colour);
			border-radius: 10px;
		}

		.airport, .passengers, #per--person {
			label {
				width: 100%;
			}
			text-align: center;
		}

		#per--person {
			height: 100px;
		}

		.close {
			text-align: right;
			i {
				margin-right: 5px;
			}
		}

		.confirm {
			text-align: center;
		}
	}

	#image-popup {
		width: 90%;
		height: 90%;
		top: 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}

	#see--tc {
		top: 50%;
		width: 60%;
		max-height: 100%;

		#terms--text {
			max-height: 75vh;
			overflow-y: auto;
		}
	}

	#ask--question, #ask--brochure {
		width: 40%;
		height: 60%;
		background-color: var(--nav-colour);

		.form-control {
			border-bottom: 2px solid var(--primary-colour);
			border-radius: 0;
		}

		textarea {
			height: 200px;
		}

		#id, label[for="id"] {
			display: none;
		}
	}

	#img-popupclose {
		padding: 5px 10px;
		background-color: var(--primary-colour);
		color: white;
		&:hover {
			color: var(--tertiary-colour);
		}
	}

	#book-overlay {
		position: fixed;
		background-color: black;
		opacity: 0.4;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 3;
		display: none;
	}

    .hide-hotel-load, .hide-review {
        display: none;
    }

    .review-btn-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
    }

	.booknow-aside {
		border-radius: 10px;
		box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);
	}

	.booknow-aside .holiday-box {
		min-width: 100%;

		p {
			text-align: left;
			margin: 0;
		}

		.glance-highlight-checkout {
			color: var(--tertiary-colour);
			font-size: 1.2em;
		}

		.room-box, .passenger-box {
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
		}

		.rooms--count {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
		}

		.sup-info {
			&:after {
				content: url("/wp-content/uploads/info__.png");
			}
		}

		.itin-title {
			color: var(--primary-colour);
		}
	}

	.booknow-fields {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;

		hr {
			border: 1px solid var(--tertiary-colour);
			height: 2px !important;
			opacity: 1;
			background-color: unset;
		}

		.summary-title {
			text-transform: unset;
			text-align: left;
		}

		.button-fields {
			a {
				min-width: 100%;
			}
		}

		.sale-effects {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.discount, .previous {
			color: var(--secondary-colour);
			font-weight: 600;
		}
		.previous {
			text-decoration: line-through;
		}
		.glance-highlight-item {
			text-transform: unset;
		}

		.from-price {
			color: var(--primary-colour);
			span {
				font-size: 0.8rem;
				text-transform: none;
			}
		}

		.summary-featured-hol {
			width: 100%;
			height: 150px;
			background-position: center;
			background-size: cover;
			background-repeat: no-repeat;
		}

		.summary-box, .passenger-box, .room-box, .transfers-box, .flights-box {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.flights-box {
			.flight-info:last-child {
				p {
					text-align: right;
				}
			}
		}

		.room-supp {
			p {
				text-align: right;
			}
		}

		.transfers-box {
			.luggage {
				p {
					text-align: right;
				}
			}
		}

		.passenger-box{
			.passenger {

			}
		}

		.summary-box {
			background: var(--primary-colour);
			min-width: 100%;
			border-radius: 0 0 10px 10px;

			p, .itin-title, .itin-title-small {
				color: white;
			}

			.itin-title-small {
				font-size: 1rem;
			}

			.summary-prices, .summary-totals {
				display: flex;
				flex-direction: column;
				justify-content: center;
			}

			.coupon-hidden {
				display: none;
			}

			.summary-totals {
				.itin-title, .itin-title-small {
					text-align: left;
				}
				p:last-child {
					margin: 0;
				}
			}

			.summary-prices {
				p {
					text-align: right;
				}

				p:last-child {
					margin: 0;
				}
			}
		}
	}

	/* Checkout */
	#checkout, #holiday, #overview, #highlights, #itinerary, #accommodation, #location, #reviews, #dates--price {
		scroll-margin-top: 150px;
		position: relative;

		.checkout-body {
			box-shadow: none !important;

			.checkout-form-card {
				box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);
			}

			.steps {
				background: var(--light-colour);
				border-top: none !important;

				.step {
					display: none;

					&.current {
						display: block;
					}

					.fields {
						display: flex;
						gap: 1em;
						flex-wrap: wrap;

						.field, .itin-field {
							display: flex;
							flex-direction: column;
						}

						#passenger-details-container {
							width: 100%;
						}
					}
				}
			}

			.airport {
				display: flex;
				justify-content: space-between;
				align-items: center;
				p {
					margin-bottom: 0;
				}

				.room-button {
					min-width: 200px;
				}
			}

			.passenger-field {
				display: flex;
				justify-content: space-between;
				align-items: center;
				flex-wrap: nowrap;
				background-color: #f1f1f1;
				padding: 10px;
				border-radius: 10px;

				p {
					margin-bottom: 0;
				}

				select {
					width: 40%;
				}

				.delete-room {
					border: none;
					background-color: unset;
				}
			}

			.flights, .lead-passenger, .passenger-add, .passenger-room, .misc, .payment, .extras, .trade {

				.title-container {
					display: flex;
					justify-content: space-between;
					align-items: flex-start;
					padding-bottom: 10px;
				}

				.title {
					color: var(--primary-colour);
					margin-bottom: 0;
					border-radius: 10px 10px 0 0;
					text-transform: unset;
				}

				.checkout-form-card {
					border-radius: 10px;
				}

				.flights-titles {
					display: flex;
					align-items: flex-start;
					justify-content: space-between;

					h4:last-child {
						text-align: right;
					}
				}

				.flights-info-grey {
					background-color:#f1f1f1;
					border-radius: 10px;
					padding: 10px 0;
				}
			}

			.extra-box {
				display: flex;
				justify-content: flex-start;
				align-items: center;

				background-color:#f1f1f1;
				border-radius: 10px;
				padding: 10px;

				h4, p {
					width: 75%;
					margin-bottom: 0;
				}

				h4 {
					width: 25%;
					margin-right: 20px;
				}
			}

			.travel-information {
				width: 100%;
				border-radius: 10px;
				display: flex;
				flex-direction: column;

				.travel-row {
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 10px;

					div {
						width: 25%;
					}
					.travel-info {
						width: unset !important;
					}
				}

				.mobile-travel {
					display: none;
					color: var(--secondary-colour);
					font-weight: 700;
				}

				.header {
					color: var(--secondary-colour);
					font-weight: 700;
				}
			}

			.passenger-field {
				height: unset;
				label {
					margin-right: 15px;
				}
			}

			#discount--code {
				text-transform: uppercase;
			}
		}

		.first-look-field {
			display: flex;
			justify-content: space-between;
			align-items: center;

			span {
				text-transform: uppercase;
			}
		}

		.glance-highlight-fields {
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
			padding: 10px 2px;
		}

		.glance-highlight-item {
			color: var(--secondary-colour);
			text-transform: uppercase;
		}

		.highlight-fields {
			padding-left: 0;

			li {
				margin-left: 15px;
			}
		}

		.other-referral-field {
			display: none;
		}

		.location-image {
			width: 100%;
		}

		.tag-wrapper {
			display: flex;
			justify-content: flex-start;
			align-items: center;
			flex-wrap: wrap;
		}

		.tag-block {
			padding: 5px;
			margin: 2px;
			border: 1px solid var(--primary-colour);
			user-select: none;

			img {
				width: 15px;
				margin-right: 5px;
			}
		}

		.highlight-fields {
			columns: 2;

			li::marker {
				content: "\2713";
				color: var(--secondary-colour);
				font-size: 1.2rem;
			}

			span {
				margin-left: 5px;
			}
		}

		.dates-header {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.lead-passenger, .passenger-add {

            #ih_checkout_other_title {
                visibility: hidden;
            }

			.checkout-form-card {
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				align-items: flex-start;
				width: 100%;
			}

            .title {
                width: 100%;
            }
		}

		.walking-group-block {
			display: none;
		}

		#payment-container {
			position: absolute;
			bottom: 16px;
			right: 28px;
		}
	}

	/* Contact Page */
	.contact-block {

		p {
			margin-bottom: 0;
		}
		.icons {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;

			a {
				font-size: 1.4rem;
				margin: 10px 0;

				i {
					margin-right: 10px;
				}

				&:last-child {
					text-decoration: underline;
				}
			}
		}
	}

	/*Itinerary*/

	.itin-field {
		width: 98%;
	}

	.itin-piece {
		display: flex;
		align-items: flex-start;
		border-bottom: 1px solid #d9d9d9;
	}

	.itin-counter {
		width: 40px;
		height: 40px;
		border: 3px solid var(--tertiary-colour);
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-right: 10px;
		span {
			color: var(--primary-colour);
			margin: 0;
		}
	}
	.itin-detail[open] {
		.itin-title {
			&:after{
				transform: rotate(180deg);
			}
		}
	}
	.itin-detail {
		width: 100%;
		/* margin-left: -60px; */
		/* padding-left: 60px; */
		
		.itin-title {
			
			list-style: none;
			position: relative;
			padding-top: 0px;
			font-size: 1.1rem;
			color: var(--primary-colour);

			
			&::after {
				position: absolute;
				right: 5px;
				content: " ▼";
			}
		}
		.itin-title + * {
			margin-top: 10px;
		}

		:last-child {
			margin-bottom: 0;
			padding-bottom: 0;
		}
	}

	.itin-detail[open] {

		p {
			animation: animateDown 0.2s linear forwards;
		}

		.itin-title {
			list-style: none;

			&::after {
				content: " ▼";
			}
		}
	}

	/* FAQ */
	.faq-container {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 20px;
 		counter-reset: faq-counter;	
	}

	.faq-item {
		position: relative;
		width: 100%;
		counter-increment: faq-counter;
		border-bottom: 1px solid #d9d9d9;
		padding-left: 20px !important;

		border-left: 5px solid #cd9e28;
		padding-bottom: 20px !important;


	}
	.itin-title {
		font-size: 1.2rem;
		padding-top: 0;
	}
	

	.faq-container.is-featured {
		justify-content: center;
	}

}

.holiday-tabs, .checkout-tabs {
	justify-content: flex-start;
	flex-wrap: wrap;

	.tab {
		padding: 5px 15px 5px 0;
		user-select: none;
		transition: .3s ease;
		cursor: pointer;
		border-bottom: 3px solid var(--nav-colour);
		position: relative;

		i {
			color: var(--primary-colour);
			font-size: 0.95rem;
			margin-right: 7px;
		}

		&.active {
			border-bottom: 3px solid var(--primary-colour);
		}

	}
}

.checkout-tabs {
	.tab {
		cursor: default;
	}
}

.field, .full-width {
	width: 48%;
	display: flex;
	flex-direction: column;

	label {
		margin: 2px 0;
	}
}

.field {
	margin: 0 5px 1rem 0;

	input, select {
		width: 100%;
	}

	input[type=checkbox] {
		width: 20px;
		margin-right:10px;
		height: 15px;
	}
	input[type=submit] {
		height: unset;
	}
}

.full-width {
	width: 100%;
	margin-bottom: 1rem;

    p {
        margin-bottom: 0;
    }

	textarea {
		height: 150px;
	}

	.terms {
		margin: 0;
		font-size: 0.8rem;
	}
}

.title-copy {
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;

	.checkbox {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		width: 100%;

        label {
            margin-right: 3px;
        }
	}

	input[type=checkbox] {
		width: 20px;
		margin-right:10px;
		height: 15px;
	}
}

.blue-bg {
	background-color: var(--primary-colour);
	color: var(--footer-top-text-colour);

	h3, a, h2, h4 {
		color: var(--footer-top-text-colour);
	}

	a {
		&:hover {
			color: var(--bs-nav-link-hover-color);
		}
	}
}

footer {
	background: #f1f1f1;

	.payments {
		i {
			color: var(--footer-top-text-colour);
		}
	}

	.certs {
        display: flex;
        column-gap: 20px;
        justify-content: center;

		img {
			width: 100%;
            height: 40px;
		}
	}

	hr {
		height: 1px !important;
		width: 100% !important;
	}

	.brand-links {
		flex-direction: column;
		row-gap: 1em;

		div:has(.navbar-brand) {
			display: flex;

			.navbar-brand {
				flex-grow: 0;
			}
		}

		div {
			justify-content: center !important;
		}
	}

	.site-info {
		flex-direction: column;
	}

	.payments {
		.row {
			flex-direction: row;

			.col {
				flex-grow: 0;
			}
		}

		img {
			width: 50px;
		}
	}

	.involved-nav a {
		padding: 0;
		color: var(--primary-colour);
	}
}

.footer-logo img {
	max-height: 50px;
}

/* Holiday Cards */
.holiday-card, .brochure-card, .trustpilot-review, .holiday-card-search, .hotel-card, .form-card, .checkout-form-card {
	border-radius: 10px;
	border-width: 0;
    box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);
	margin: 1em;
	transition: transform .2s;

	.card-img {
		position: relative;
		min-height: 200px;
		background-position: center;
		background-size: cover;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;

		.type-icon {
			position: absolute;
			right: 10px;
			bottom: 10px;
			color: var(--light-colour);
			text-shadow: 0 0 3px var(--primary-colour), 0 0 2px var(--primary-colour), 0 0 1px var(--primary-colour);
		}
	}

	.card-body {
		padding: .7em;
		color: var(--text-colour);

		.card-title {
			margin-bottom: .2em;
			text-transform: uppercase;
			font-size: 19px;
			font-weight: 600;
			min-height: 47px;
		}

		.card-review {
			font-size: .8em;
			margin-bottom: .8em;
            min-height: 37px;

			i {
				color: var(--quaternary-colour);
			}
		}

		.card-text {
			font-size: .9em;
			p {
				min-height: 75px;
				margin-bottom: 0;
			}

			.a-wrapper {
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
		}
	}

	.card-footer {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;
		background: none;
		border: 0;
		padding: .7em;
		gap: 1em;

		p.card-price {
			margin-bottom: 0;
			display: flex;
			flex-direction: row-reverse;
			gap: .5em;
			color: var(--text-colour);
		}
	}
}

.holiday-card, .brochure-card, .trustpilot-review, .holiday-card-search, .hotel-card, .form-card {
	&:hover {
		box-shadow: 10px 10px 48px rgba(2, 2, 2, 0.25);
		transform: scale(1.01);
	}
}

.holiday-card-search {
	padding: 0;

	.card-body {
		padding: 0;

		.card-title, .card-review, .card-desc {
			padding: .3em .7em;
			margin: 0;
		}

		.card-review, .card-desc {
			padding: 0.7em;
		}

		.card-title {
			min-height: 85px;
			display: flex;
			align-items: center;
			justify-content: flex-start;
		}

		h4 {
			margin: 0;
			font-size: 20px;
			font-weight: 600;
		}
	}
}

.hotel-card {
	padding: 0;
	width: 200px;
	margin: 10px !important;

	.card-img {
		min-height: 100px;
	}

	&:hover {
		box-shadow: 0 4px 8px rgba(2, 2, 2, 0.1);
		transform: none;
	}
}

.gallery-item {
	.card-img {
		border-radius: 10px;
		cursor: pointer;
	}
}

.gallery-item.holiday-card {
	height: unset !important;

}

.gallery-wrapper {
	justify-content: space-between;
	align-items: center;

	.s9-slide-item {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

.gallery-main {
	width: 100%;
	margin: 0;
	border-radius: 10px;
	border-width: 0;
	box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);
	transition: transform .2s;

	.main-img {
		width: 100%;
		height: 350px;
		border-radius: 10px;
	}

	#main--holiday--img {
		height: 550px;
		border-radius: 10px;
		cursor: pointer;
	}

	.card-img {
		min-height: 200px;
		background-position: center;
		background-size: cover;
	}

}

/* Promotional Banner */
#banner {
	.page-banner {
		height: 10vh;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 10px;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        text-shadow: 0 0 10px rgba(0,0,0,0.9);
		text-align: center;

		h2 {
			margin: 0;
		}

		.blue {
			color: var(--primary-colour);
		}

		.white {
			color: var(--light-colour);
		}

		.light_blue {
			color: var(--secondary-colour);
		}

		.gold {
			color: var(--quaternary-colour);
		}
	}

	.bg_blue {
		background-color: var(--primary-colour);
	}
	.bg_white {
		background-color: var(--light-colour);
	}
	.bg_light_blue {
		background-color: var(--secondary-colour);
	}
	.bg_gold {
		background-color: var(--quaternary-colour);
	}
}

.trustpilot-review {
	&:hover {
		transform: none;
	}

	.card-body {
		min-height: 250px;

		h3 {
			color: var(--primary-colour);
			text-transform: none;
			font-weight: 500;
			margin-top: 0.5rem;
		}
	}
}

/* Holiday Slider */
.s9-slider {
	padding-inline: 60px;

	.s9-slide-control {
		position: absolute;
		z-index: 1;
		top: 50%;
		transform: translatey(-50%);
		background: none;
		color: var(--secondary-colour);
		border: 0;
		font-size: 2.5em;
		opacity: .8;

		&.s9-slider-prev {
			left: 10px;
		}

		&.s9-slider-next {
			right: 10px;
		}
	}

	.s9-slider-track {
		display: flex;
		align-items: stretch;

		.s9-slide-item {
			opacity: .4;
			transform: scale(0.9);
			/*transition: .5s ease;*/
			height: unset;

			&.active {
				opacity: 1;
				transform: scale(1);

				.holiday-card {
					margin: 1em;
				}
			}

			&:not(.active) {
				transition: .3s ease;
			}

			.holiday-card {
				transition: margin .3s ease;
				height: calc(100% - 25px);
				margin-inline: -.5em;
			}
		}
	}
}

.holiday-card-des {
	overflow: hidden;
	height: auto;

	.card-img {
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}

	.card-link {
		display: flex;
		justify-content: center;
		align-items: center;
		text-decoration: none;
		padding: 6em 0;
		background: rgba(21, 53, 88, 0.2);
		transition: .3s ease;
		text-align: center;
		padding-inline: 15px;

		&:hover {
			background: rgba(21, 53, 88, .6);
		}

		.card-title {
			color: var(--page-colour);
			text-transform: uppercase;
		}
	}

	@media(min-width: 992px) {
		margin: 1rem;
		.card-link {
			padding: 8em 0;
		}
	}
}

#newsletter {

	.newsletter-form {
		display: flex;
		align-items: center;
		justify-content: flex-start;

		.newsletter-input {
			width: 55%;
			border-radius: 0;
			border-bottom: 2px solid var(--primary-colour);
			margin-right: 5px;
		}
	}

	.order-copy {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;
	}
}

.brochure-img {
	height: 250px !important;
    margin: 10px 0;

    @media(min-width: 992px) {
        position: absolute;
        top: 50%;
        transform: rotate(-10deg) translateY(-50%);
        margin: 0;
    }
}

.bro-large {
	display: flex;
	justify-content: center;
	align-items: flex-start;

    @media(min-width: 992px) {
        top: unset;
        margin: 100px 0;
    }
}

/*MY ACCOUNT*/
#register--form, #password--form, #passport--form {

	display: flex;
	flex-wrap: wrap;
	align-items: center;

	#ih_password_checker {
		display: none;
	}

	.full-width {
		input, select {
			width: 99%;
		}
	}
}

#password--form {
	padding-right: 1.5rem;
}

.current--booking {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.passport-container, .booking-item, .white-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;

    padding: 30px;
    border-radius: 10px;
    box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);

    h3 {
        text-transform: unset;
        width: 100%;
    }

	input, select {
		height: 40px;
		padding: 0 8px;
	}

    &:hover {
        box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.25);
    }
}

.account-title {
    display: flex;
    justify-content: space-between;
    align-items: center;

    p {
        margin: 0;
    }
}

.booking-item {
    padding: 0;
}


.form-container {
	display: flex;
	justify-content: center;
	align-items: center;
}

#default-form {
	max-width: 70%;
	margin: auto;

	.form-control, .form-select {
		border-bottom: 2px solid var(--primary-colour);
		border-radius: 0;
	}
}

.mobile-summary {
    display: none;
}

.booknow-certs {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	img {
		height: 50px;
		margin: 0 10px;
	}
}

@keyframes animateDown {
	0% {
		opacity: 0;
		transform: translatey(-15px);
	}
	100% {
		opacity: 1;
		transform: translatey(0);
	}
}
body.single-post .position-fixed#nav-area {
	position:sticky!important;
}

table.content {
	tr {
		&:first-child {
			font-weight: bold;
			color:#fff;
			background-color:var(--heading-colour); 
		}
	}
	td {
		padding:5px 20px;
		border:1px solid #d9d9d9;
	}
}

h2,h3 {
	margin-top: 2rem;
	text-transform: uppercase;
	&:first-child {
		margin-top: 0;
	}
}

ul {
	&.list-unstyled {
		list-style: disc;
		margin-left: 1rem;

		li {
			margin-bottom: 0.3rem;
		}
	}
}
.has-medium-font-size {
	font-size: 1.4rem!important;
}
.has-small-font-size {
	font-size: 1rem!important;
}

.form-card, .checkout-form-card {
	/*background-color: var(--nav-colour);*/
	padding: 30px;
	margin: 0;

    h4.title{
        font-weight: 600;
    }

	input, select {
		height: 40px;
		width: 100%;
		margin-top: 0.25em;
        border-radius: 10px;
        border: 1px solid lightgrey;
	}

	input[type="text"], input[type="password"], input[type="email"] {
		padding: 0 8px;

		&:hover, &:focus {
			background-color:#0c92c533!important;
			border-width:1px;
			transition: background-color 0s ease-in-out 0s!important; 
		}
	}
	input[type="submit"] {
		width: auto;
	}
	input[type=checkbox] {
		width: 20px;
		margin-right:10px;
		height: 15px;
	}
}

.form-card {
	height: 100%;

	&:hover {
		transform: unset !important;
	}
}

input:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 1000px #b48e2933 inset !important;
	-webkit-text-fill-color: #000 !important;
	transition: background-color 5000s ease-in-out 0s; 
	border-width:1px;
}

.info-booking {
    width: 100%;
	img {
		width: 100%;
        height: 250px;
        object-fit: cover;
		border-radius: 10px 10px 0 0;
	}

	h4 {
		padding: 0 30px;
	}
}

.account-form-card {
	display: flex;
    flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	border-radius: 10px;
    width: 100%;

    .heading {
        font-weight: 600;
        color: var(--primary-colour);
    }

    p {
        margin-bottom: 0;
        color: var(--secondary-colour);
    }
}

.booking-column {
    display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
	padding: 0 30px 30px;
}

.departure-date {
    display: flex;
    justify-content: space-between;
    align-items: center;
	flex-wrap: wrap;
    .d:nth-child(even) {
        text-align: right;
    }
}

.account-buttons {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;

	.gold-buttons {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 50%;
		a {
			color: #a4842e;
			font-weight: 500;

			&:hover {
				color: var(--primary-colour);
			}
		}
	}
}

.status-booking, .amend-booking-container  {
	width: 48%;
}

.user-button-list {
	padding-right: 1.5rem;
}

.min-w-but {
	flex-direction: row !important;
	a {
		min-width: 255px;
	}
}

.amend-booking-container {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;

	a {
		margin: 5px;

		i {
			margin-left: 5px;
		}
	}

	ul {
		padding: 0;
		width: 100%;
	}

	li {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
}
.bookings-archive {
	display: flex;
	align-items: center;
	justify-content: center;
}

#payment-button, #trade-button {
	display: none;
}

.change-passenger {
    select {
        width: auto;
        margin-top: 0;
    }
}

#checkout {
    h2, h3 {
        text-transform: unset;
    }
}

.passenger-flex {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.coupon {
	align-items: flex-start;
    flex-wrap: wrap;
	padding: 30px 0;

	input {
		margin-top: 0;
		height: 40px;
		box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);

		&::placeholder {
			text-transform: none;
		}
	}
}

#coupon--result {
    width: 100%;
    margin: 10px 0;
}

#discount--code {
	width: 50%;
    border-radius: 10px;
    border: 1px solid lightgrey;
    padding: 0 8px;
}

.misc-two {
	padding: 30px 0;

	.payment-info {
		display: flex;
		justify-content: space-between;
		align-items: center;

        p {
            width: 75%;
        }
	}

	.payment-img {
		display: flex;
		justify-content: space-between;
		align-items: center;

		img {
			width: 50px;
		}
	}
}

.marketing-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;

	input, p {
		margin: 0 !important;
	}
	p {
		width: 90%;
	}
}

.useful {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    align-items: center;

    .useful-item {
        color: var(--primary-colour);
        /*box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.40);*/
        border-radius: 10px;
        width: 25%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
		margin-bottom: 10px;

        p, i {
            margin: 0;
            text-align: center;
            font-size: 1.25rem;
        }

        i {
            margin-bottom: 10px;
            font-size: 2rem;
        }
    }

    @media(max-width: 768px) {

		align-items: flex-start;

        .useful-item {
            width: 25%;
        }
    }
}

.unset-transform {
    text-transform: unset;
}

.confirmation {
	width: 100%;
}

.payment-bundle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;

    .deposit-bundle, .input {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 42%;
    }

    .input-bundle {
        width: 40%;
    }

    input {
        margin-top: 0;
        margin-bottom: 4px;
    }

    label, p {
        font-size: 1.1rem;
        font-weight: 500;
    }

    .blue {
        color: var(--primary-colour);
        margin: 0;
    }
}

.trade-links-container {
	.trade-link {
		border-radius: 10px;
		position: relative;
		display: flex;
		flex-direction: column;
		box-shadow: 10px 10px 48px rgba(0, 0, 0, 0.15);
	}

	.card-img {
		min-height: 200px;
		background-position: center;
		background-size: cover;
		border-radius: 5px 5px 0 0;
	}
	.card-body {
		padding: 0.7em;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		min-height: 100px;
	}
}

.guide-img, .brochure-trade {

	/*img {*/
	/*	width: 60%;*/
	/*}*/

	a {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

.brochure-trade {
	figure {
		width: 100%;
	}

	.btn-wrappers {
		display: flex;
		justify-content: space-evenly;
		align-items: center;
	}
}

.hub-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
    align-items: center;

    p {
        width: 80%;
    }
}

.documents {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: 30px;
}

.dates-table {
	width: 100%;
	text-align: center;

	.date-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 10px 0;
		border-bottom: 1px solid var(--secondary-colour);

		div {
			width: 17%;
		}
	}

	.date-row:nth-child(even) {
		background-color: var(--nav-colour)
	}

	.dates-header {
		color: var(--primary-colour);
		font-weight: 700;
	}

	.mobile-date {
		display: none;
	}

	.sold-out {
		display: flex;
		align-items: center;
		justify-content: center;
		color: #8e1b11;
		height: 40px;
		font-weight: 600;
	}

	.small-red {
		font-size: 0.8rem;
		color: #8e1b11;
		padding: 5px 0;
	}

	.offer {
		color: var(--tertiary-colour);
		font-weight: bold;
	}
}

.star-rating-container {
    direction: rtl;
    display: inline-block;
    position: relative;

    input {
        opacity: 0;
        position: absolute;

        &:checked ~ i,
        i:hover {
            color: var(--quaternary-colour);
        }
    }

    input:checked ~ label i,
    label i:hover,
    label:hover ~ label i {
        color: var(--quaternary-colour);
    }

    input:checked:disabled ~ label i {
        color: var(--secondary-colour);
    }

    input:disabled ~ label {
        pointer-events: none;
    }

    i {
        font-size: 36px;
        color: #dddddd;
        cursor: pointer;
        position: relative;
    }
}

.star-field {
    width: unset;
}

.account-page-title {
    text-transform: uppercase;
    text-align: left;
}

.password-response {
    display: none;
}

.four-oh-four-display {
	display: flex;
	align-items: center;
    justify-content: space-between;
	margin: 5rem 0;

	.text {
		width: 40%;
		padding: 0 30px;
	}

    img {
        padding: 0 30px;
    }

}

@media (max-width: 992px) {

	.holiday-tabs, .checkout-tabs {
		.tab {
			padding: 5px;
		}
	}

	.hero-overlay {
		h1 {
			font-size: 1.6rem !important;
		}

		p {
			font-size: 1rem !important;
		}
	}

	.home-slider {
		height: 50vh !important;
	}

	.page-slider {
		height: 40vh !important;
	}

	.mobile-summary {
		display: block;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 3;
		transition: max-height 0.5s ease;
		max-height: 8vh;
	}

	.title-button {
		text-align: center;
		position: relative;
		h3, h4 {
			margin: 0;
		}
	}

	.btn-wrappers {
		justify-content: space-between;
		flex-direction: column;
	}

	.button-spacer {
		.btn-wrapper {
			margin: 10px;
		}
	}

	#main--holiday--img {
		height: 400px !important;
	}

	.mobile-footer {
		padding-right: calc(var(--bs-gutter-x) * .5) !important;
	}

	.mobile-display-arrow {
		font-size: 1.5rem;
		position: absolute;
		right: 20px;
		top: 5px;
		#close-summary {
			display: none;
		}
	}

	.mobile-none {
		display: none !important;
	}

	.mobile-aside {
		border-radius: 10px 10px 0 0 !important;
		height: 100%;
		overflow-y: auto;

	}

	.mobile-aside-blue {
		background-color: var(--primary-colour);
		h3, h4, p, span, .itin-title {
			color: var(--primary-contrast) !important;
		}

		.mobile-display-arrow {
			a {
				color: var(--primary-contrast) !important;
			}
		}

		.previous, .discount, .from-price h2 {
			color: var(--nav-colour) !important;
		}
	}

	.mobile-aside-white {
		background-color: var(--nav-colour);

		h2, h3, h4, p, span, .itin-title {
			color: var(--primary-colour) !important;
		}

		.mobile-display-arrow {
			a {
				color: var(--primary-colour) !important;
			}
		}
	}

	.passenger-field {
		select {
			width: auto !important;
		}
	}


	#see--tc {
		width: 90% !important;
	}

	.inspiration-card {
		margin-bottom: 10px;
		border-radius: 10px;

		a {
			border-radius: 10px;
		}
	}

	.user-button-list {
		padding-right: 0 !important;
		text-align: center;
	}

	#password--form {
		padding-right: 0 !important;
	}

	.min-w-but {
		min-width: 100% !important;
		a {
			width: 100%;
		}
	}

	.amend-booking-container, .status-booking {
		width: 100% !important;
	}

	.account-buttons {
		flex-direction: column-reverse;

		.gold-buttons {
			width: 100%;
			margin-top: 1rem;
		}
	}

	.account-title {
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}

	.status-booking {
		ul {
			padding-left: 0.5rem;
		}
	}

	.field {
		width: 100%;
		margin: 0 0 1rem 0;
	}

	#banner {
		.page-banner {
			padding: 10px;
			h2 {
				font-size: 24px;
			}
		}
	}

	.four-oh-four-display {
		flex-wrap: wrap;

		.text {
			width: unset;
		}
	}

	#book-popup {
		width: 50% !important;
	}

	#ask--question, #ask--brochure {
		width: 75% !important;
		height: 75% !important;
		top: 50% !important;
		padding: 0.5rem !important;

		.container p {
			margin-bottom: 0.5rem;
		}
		h3 {
			margin-bottom: 0.25rem;
		}
	}

	.extra-box {
		flex-direction: column;
		align-items: flex-start !important;
		p, h4 {
			width: 100% !important;
			margin: 0 !important;
		}
	}

	.travel-information {
		display: flex;

		.travel-row {
			padding: 5px;
			flex-direction: column;
		}

		div {
			width: 100% !important;
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.header {
			display: none !important;
		}

		.mobile-travel {
			display: block !important;
			width: 50% !important;
		}

		.travel-info {
			text-align: right;
		}
	}
}

@media (max-width: 767px) {

	#content-area {
		#order {
			text-align: center !important;
		}
	}

	.title-copy {
		flex-wrap: wrap;
	}

	.custom-filter {
		border-radius: 10px 10px 0 0 !important;
		font-size: 26px;
		font-weight: 600;
	}

	#main--holiday--img {
		height: 250px !important;
	}

	.mobile-padding {
		padding-inline: 20px;
	}

	.holiday-tabs, .checkout-tabs, .tag-wrapper {
		justify-content: center !important;
	}

	.long-description-field, #holiday--desc--title, .avg-review, #glance, .mobile-title, .review-rating {
		text-align: center;
	}

	.glance-highlight-fields {
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;

		.glance-highlight-item {
			width: 100%;
			text-align: center;
		}
	}

	.hotel-card {
		margin: 0 !important;
	}

	#book-popup {
		width: 90% !important;
	}

	div.cols-3 {
		text-align: center;
	}
	#ask--brochure {
		width: 85% !important;
		height: 90% !important;
	}

	.contact-block {
		.icons {
			a {
				font-size: 1.1rem !important;
			}
		}
	}

	footer {
		.certs {
			flex-wrap: wrap;
			row-gap: 20px;
		}
	}

	.email-small {
		margin-top: 1rem !important;
		word-wrap: anywhere;
	}

	.trade-nav-container {
		flex-direction: column;
		gap: 20px;
	}

	.trade-nav {
		align-items: flex-start;
	}

	.trade-link {
		margin-bottom: 2rem;
	}

	.marketing-input {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		margin-bottom: 5px;

		input {
			margin: 10px 10px 10px 0;
		}
	}

	.deposit-bundle {
		width: 100% !important;
		margin-bottom: 10px;

		.input-bundle {
			width: auto !important;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			input {
				margin: 0 5px 0 0 !important;
			}
		}
	}


	.megamenu {
		li {
			gap: 5px !important;
		}
	}

	.megamenu-text {
		flex-wrap: wrap;
		justify-content: center !important;

		.megamenu-text-con {
			width: 100% !important;
			margin-bottom: 0.5rem;
			align-items: center !important;
			text-align: center;
		}
	}

	#menu-secondary {
		display: none;
	}
	.hero-overlay {
		gap: 1em !important;
		h1 {
			font-size: 1.4rem !important;
		}

		p {
			font-size: 1rem !important;
		}
	}

	#book-popup {
		width: 75% !important;
	}
	.dates-header {
		display: none !important;
	}

	.dates-table {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

		.date-row {
			flex-wrap: wrap;
			width: 85%;
			border-radius: 10px;
			border: none !important;
			background-color: var(--nav-colour) !important;
			padding: 0 !important;
			margin-bottom: 30px;

			div, h4 {
				width: 50%;
				min-height: 30px;
				margin: 0;
				padding: 10px 0;
			}

			h4 {
				&:first-of-type {
					padding-top: 20px;
				}
			}

			div {
				&:first-of-type {
					padding-top: 20px !important;
				}
			}

			.sold-out {
				height: 60px !important;
				text-align: center;
				width: 100%;
			}

			.small-red {
				padding: 10px 0;
			}

			.book-now-pop {
				width: 90% !important;
			}
		}
	}

	.mobile-date {
		display: block !important;
	}

	.mobile-order-1 {
		order: -1;
		background-color: var(--secondary-colour) !important;
		color: var(--light-colour) !important;
		width: 100% !important;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		i {
			margin-right: 5px;
		}
	}

	.mobile-order-1-empty {
		display: none;
		width: 100% !important;
	}

	.mobile-book-now {
		width: 100% !important;
		padding-bottom: 20px;
	}
}

.trade-nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;

    .trade-nav {
        display: flex;
        border-radius: 10px;
        justify-content: space-between;
        align-items: center;
        gap: 20px;

        p {
            margin: 0;
        }
    }
}

.review {
	/*width: 50%;*/
	text-align: center;
	min-height: 140px;
}

.flash {
	position: absolute;
	left: 0;
	top: 10px;
	padding: 5px 10px;
	border-radius: 0 4px 4px 0;
	background-color: var(--primary-colour);
	color: var(--light-colour);
	text-transform: uppercase;
	font-weight: 600;
}