.owl-stage-outer {

max-height: 387px;

}

/* prevent image going too tall */

.smallPics .owl-item img {

max-height: 250px;

}


.owl-stage {
display: flex;
align-items: flex-start;  /* Align images to the top */
height: auto;  /* Adjust to fit the content */
overflow: hidden;  /* Hide the part of the next item that peeks through */
}

.owl-carousel .owl-item {
flex: 0 0 auto;  /* Prevent items from growing or shrinking */
width: 100%;  /* Ensure each item takes up the full width of the stage */
}


/* Style need to know */

/* info table styling */

table {

border-collapse: collapse;
width: 80%;
margin: 30px auto;
border: 1px solid #000;
}

th, td {
text-align: left;
padding: 8px;
}

th {
background-color: #8386A3;
text-align: left;
color: white;
}


/* Styling for the heading */
.otherCottages {

font-family: 'Arial', sans-serif;
font-size: 2rem;
color: #8386A3; /* Your provided color */
text-align: center;
text-transform: uppercase;
letter-spacing: 2px;
margin-top: 20px;
position: relative;
margin-bottom: 20px;

}

/* Adding the ruler */
.otherCottages::after {

content: "";
display: block;
width: 100%;
height: 2px;
background: linear-gradient(to right, #8386A3, #ffffff, #8386A3); /* Fancy gradient effect */
margin: 10px auto 0;

}


.otherCottagesContainer {

display: flex;
flex-direction: row;
flex-wrap: wrap; /* Enable wrapping */
gap: 4px;
padding: 20px;
background-color: #f8f9fa;
border: 1px solid #e0e0e0;
border-radius: 8px;
max-width: 100%;
margin: 20px auto;
justify-content: center;
align-items: center;

}

.otherCottagesContainer a {

display: inline-block;
font-size: 1.2rem;
color: #8386A3;
text-decoration: none;
padding: 10px 10px;
border: 1px solid transparent;
border-radius: 4px;
transition: all 0.3s ease;

}

.otherCottagesContainer a:hover {

color: #ffffff;
background-color: #8386A3;
border-color: #8386A3;
transform: translateY(-2px);

}





tr:nth-child(even) {
background-color: #f2f2f2;
}

.reevooScore {

min-width: 80px;

}

.needToKnowContainer {

padding: 30px 60px;

}

.needToKnowContainer i {

color: #ccc;
min-width: 70px;
text-align: center;

}

.needToKnowContainer h3 {

font-family: 'Gochi Hand', cursive;
font-size: 30pt;
color: #8386A3;
font-weight: normal;
margin-bottom: 30px;
border-bottom: 1px solid #ccc;
margin-top: 30px;
display: flex;
align-items: center;


}

.needToKnowContainer h4 {

font-weight: bold;
margin: 20px auto;
font-size: 18pt;


}


/* new tabs */

.resultsBox2 {

width: 100%;
margin-top: 20px;
line-height: 26px;

}



.infoTextContainer {

justify-content: left;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
padding-top: 12px;
padding-bottom: 13px;

}

.place {
margin-top: 10px;
margin-bottom: 10px;
}

.mobDesc {

margin-top: 15px;
line-height: 26px;

}

.infoText {

margin-left: 0;
margin-right: 30px;

}

.resultsBox1 {

border: 0;

}

.infoTextContainer i {

display: inline-block;
padding-right: 5px;

}

.newTabsContainer {


background: #b0a290;
background: linear-gradient(white,#cfcfcf);
max-width: 100%;
padding: 0;
box-sizing: border-box;
border-top: 1px solid #ada192;
border-bottom: 1px solid #ada192;
margin-bottom: 10px;
margin-top: 10px;
z-index: 10000000;
position: -webkit-sticky; /* Safari */
position: sticky;
top: 0;

}


.newTabsInner {

max-width: 1200px;
display: flex;
justify-content: center;
margin: auto;


}

.newTabsInner i {
	
margin-right: 10px;


}

.newTabsInner a {

display: inline-block;
margin: 0 28px;
padding: 20px;
padding-bottom: 18px;
font-size: 14pt;
color: #666666;
text-decoration: none;
border-bottom: 4px solid rgba(65, 68, 105, 0);

}

.newTabsInner a:hover {

border-bottom: 4px solid black;


}


/* hide mobile button */

.newButtonContainerMobile {

display: none !important;
position: fixed;
bottom: 0;
width: 100%;
z-index: 9999;
margin: 0;
left: 0;
box-sizing: border-box;

}

.readMoreNew {

width: 100%;
text-align: right;
margin-top: 15px;

}

a.readMoreButton2 {

border: 1px solid #ccc;
padding: 5px 15px;
border-radius: 10px;
color: black;
text-decoration: none !important;

}

a.readMoreButton2:visited {

text-decoration: none;
color: black;

}



a.readMoreButton2:hover {

text-decoration: none;
color: black;
background: #f0f0f0;

}

a.readMoreButton2 i {

font-size: 0.8em;
font-weight: bold !important;


}

.newButtonContainer {

width: 100%;
max-width: 600px;
margin: auto;

}

.newButton {

background: orange;
font-size: 15pt;
padding: 20px;
border-radius: 5px;
font-weight: bold;
width: 100%;
margin: auto;
text-align: center;
display: block;
color: white;
text-decoration: none;
margin-top: 20px;
background: #FF8C1C;
transition: background 0.2s;

}

.newButton:hover {

background: #ff7811;
text-decoration: none;
color: white;


}


.poweredBy {

width: 100%; 
font-size: 11pt;
text-align: center;
color: #878787;
margin-top: 6px;
font-weight: normal;

}

.aboutContainer {

display: flex;
width: 100%;
padding: 0 40px;
padding-top: 20px;
font-size: 13pt;
justify-content: space-between;
margin-bottom: 40px;

}

.aboutContainer div {

width: CALC(50% - 20px);


}

.aboutContainer div, .aboutContainer p {

line-height: 1.9em;


}

.faqs {

padding: 20px;
font-size: 1.2em;
}

.faqs p {

margin: 0;
padding: 0;
font-size: 13pt !important;
line-height: 40px !important;

}


#map {

width: 100%;
height: CALC(100% - 20px);
min-height: 400px;
margin-top: 20px;
padding-bottom: 20px;
margin-bottom: 50px;

}




@media only screen and (max-width: 850px) {

.newTabsInner a {
	
	margin: 0 20px;
	padding: 20px 10px;
	padding-bottom: 12px;
	font-size: 14pt;

}

}



@media only screen and (max-width: 800px) {



.newTabsInner span {
	
	display: none;
	
}

.newTabsInner i {
	
	font-size: 20pt;
	margin: auto;

	
}

.newTabsInner {
	
	justify-content: space-around;
	
}

.infoTextContainer {
	
	justify-content: space-around;
	width: 100%;
	
	
}

.infoText {
	
	text-align: center;
	margin: 0;
	padding: 0;
	font-size: 12pt;
	
}

.infoText i {
	
	display: block;
	
}

}

@media only screen and (max-width: 900px) {

.aboutContainer {

	flex-direction: column;
	
}

.aboutContainer div {

	width: 100%;
	

}

.newMap {
	
	height: 400px;
	
}


}





@media only screen and (max-width: 600px) {

.parkPic {
	width: 100%; 
	aspect-ratio: 3 / 2.2; 
}

.reevooScore {
	
	top: 10px;
	right: 20px;
	
}


.needToKnowContainer i {
	
	min-width: auto;
	
	margin-right: 10px;
}


.needToKnowContainer {

	padding: 15px;
	
}

.needToKnowContainer h3 {
	
	font-size: 24pt;
	
}

.needToKnowContainer h4 {
	

	font-size: 16pt;
	
	
}

.newTabsInner a {
	
	margin: 0 5px;
	padding: 20px 5px;
	padding-bottom: 16px;
	font-size: 13pt;
	
}

.newButton {
	
	border-radius: 0 !important;
	
}

.newButtonContainerMobile {
	
	display: block !important;
	
}

.newButtonContainer {
	
	display: none !important;
	
}

}


@media only screen and (max-width: 450px) {

.newTabsInner a {
	
	margin: 0 5px;
	padding: 20px 5px;
	padding-bottom: 14px;
	font-size: 11pt;
	
}

}


@media only screen and (max-width: 400px) {

a.newButton {
	
	font-size: 12pt;
	padding: 15px;
	
}

.newTabsInner a {
	
	margin: 0 3px;
	padding: 20px 2px;
	padding-bottom: 12px;
	font-size: 11pt;
	
}

}



	
/* New TEST CSS */
	
	
	
	
	
	
	
	
	
	











.parkDetailsContainer {

border-radius: 0;
margin: auto;
padding-bottom: 20px;
padding-top: 0;
	
}

.siteDesc p, .siteDesc2 p, .siteDesc, .siteDesc2 {

font-size: 13pt;
line-height: 1.8em;

}


.siteDesc1, .siteDesc2 {

margin-top: -15px;

}




.siteDesc div {

display: inline-block;

}

img {

image-rendering: -moz-crisp-edges !important;         /* Firefox */
image-rendering:   -o-crisp-edges !important;         /* Opera */
image-rendering: -webkit-optimize-contrast !important;/* Webkit (non-standard naming) */
image-rendering: crisp-edges !important;
-ms-interpolation-mode: nearest-neighbor !important;  /* IE (non-standard property) */
}

.parkInfo {

padding-top: 5px;

}

/* prevent image going too tall */

.smallPics .owl-item img {

max-height: 250px;

}


/* move merchant image up a bit */

.merchant {

bottom: 9px;

}

.nameHeader a {

color: #4e997c;	
transition: all .2s;


}

.nameHeader a:hover {

color: #2c6650;	
text-decoration: none;


}

/* links back to region and county */

.LWHTlink {

max-width: 1200px;
margin: 30px auto;
background: white;
border-radius: 20px;
padding: 20px;
text-align: center;
justify-content: center;
display: flex;

}

.LWHTlink a {

display: inline-block;
background: #6FA38F;
padding: 20px;
border-radius: 30px;
text-decoration: none;
margin: 0 30px;
font-size: 14pt;
color: white;


}

.LWHTlink a:hover {

background: #3c7d64;

}

/* style non hoseasons button */

.affiliateButton {

font-size: 16px;
padding: 8px 20px;
box-sizing: border-box;
border-radius: 5px;
color: white;
background: #FF8814;
text-align: center;
display: block;
font-weight: bold;
outline: none;
border: 1px solid #bc4800;
margin: auto;

/* ipad / phone button styling */

-webkit-appearance: none;
	
}

.affiliateButton:hover {

background: #FF7C35;
cursor: pointer;
text-decoration: none;
color: white;

}

h1.a3AccommName {

display: block;
margin: auto;
border-radius: 15px 15px 0 0;
margin-bottom: 0;
padding-top: 8px;
padding-bottom: 8px;
font-size: 24pt;
max-width: 1200px;

}

p {
line-height: 1.5em;
}

.milesAway {

border: 1px solid #52A4CC;
padding: 9px;
color: #52A4CC;
font-weight: bold;
border-radius: 4px;
margin: 5px 0;
display: inline-block;

}


.newWhiteBG, .faqsBG {

background: white;
max-width: 1200px;
margin: auto;
border-radius: 0 0 5px 5px;
padding-bottom: 15px;


}

.newWhiteBG {
padding: 0;
}

.newCheckBG {

background: #DDD5BF;

}

.reviewsList {

padding: 40px;

}

.newHeader {

background: linear-gradient(#137C84, #21959D);
color: white;
font-family: 'Anton', sans-serif;
font-size: 24pt;
text-align: center;
margin: auto;
padding: 15px;
max-width: 1200px;
border-top: 1px solid #41434F;
border-bottom: 1px solid #41434F;
margin-top: 20px;	
font-weight: normal;

}





.results2 {

margin-right: 40px;

}

/* countyLink */

.countyLink {

width: 100%;
text-align: right;
padding: 10px 40px 0 0;

}



.viewButton {

background: #ff8814;

}

.viewButton:hover {

background: #ff7c35;
cursor: pointer;

}




@media only screen and (max-width: 1200px) {

h1.a3AccommName {

	max-width: 100%;
	width: 100%;

}


}



@media only screen and (max-width: 900px) {

h1.a3AccommName {

	border-radius: 0;
	font-size: 22pt;

	
}


}

@media only screen and (max-width: 800px) {

.otherLodges {

	top: 8px;

	
}


}

@media only screen and (max-width: 600px) {

	a.readMoreButton2 {
		display: none;
	}
		
	.resultsBox2 {

		width: 100%;
		margin: 0;
		padding: 0 15px;
		
	}

	.mobDesc, .readmorenew, h2#fullDesc {
		
		display: none;
		
	}




	.aboutContainer {

		display: flex;
		width: 100%;
		padding: 0 20px;
		padding-top: 0;
		margin-top: -20px;

	}









	.readmorenew {
		
		border: none !important;
		display: none !important;
		
	}



	.faqs {

		padding: 10px 15px 0 15px;
		
		
	}

	.siteDesc1 p, .siteDesc2 p {
		
		font-size: 12pt;
		
	}

	.newHeader {
		
		font-size: 18pt;	
		padding: 10px;
		
	}

	.breadcrumbsContainer {
		display: none;
	}

	/* links back to region and county */

	.LWHTlink {

		max-width: 1200px;
		margin: 15px auto 35px auto;
		border-radius: 0;
		padding: 20px;
		flex-direction: column;
		
	}

	.LWHTlink a {
		
		display: inline-block;
		background: #6FA38F;
		padding: 15px;
		border-radius: 20px;
		text-decoration: none;
		margin: 10px;
		font-size: 13pt;
		
		
	}


	.resultsBox1 {

		text-align: center;

	}

	.milesAway {
		
		width: 50%;
		margin: auto;
		margin-bottom: 12px;

	}

	.rightBox {
		
		margin-bottom: -20px;
		
	}

	h1.a3AccommName {

		font-size: 18pt;
		margin-bottom: 0;
		
	}

	.mobileVersion {
		display: block;
	}


	.uniqueSellingPoint {
		
		margin: -10px auto;
		font-size: 11pt;
		font-weight: normal;
		

	}


	h2.newHeader {

		font-size: 18pt;
		padding: 10px;
		
	}

	.parkDetailsContainer {

		
		border-radius: 0;
		margin: auto;
		padding-bottom: 0;
			
	}

	.place {
		
		margin-top: 0;
		
	}

	.newCheckBG {

		background: white;
		
	}

	.featuresButton {
		background: #c4b99d;
	}


	.availabilityContainer {
		margin: 0;
		padding: 0;
	}


	.viewButton {
		
		display: block;
		width: 100%;

	}

	.results2 {

		margin: 0;
		padding: 0;
		
	}



	.weekly {
		font-size: 14pt;
		font-weight: bold;
		width: 100%;
		text-align: center;
	}

	.favourites {
		display: none;
	}

	.resultsContainer {
		
		border-bottom: 4px solid #71A591;
		padding-top: 20px;
		padding-bottom: 10px;
		box-shadow: none;
		margin: 0;
		
	}

	.resultsBox1 {
		
		display: block;
		
	}

	.nameHeader {
		
		text-align: center;
		font-size: 16pt;
		font-weight: bold;
		margin: 15px;
		width: CALC(100% = 30px);
		
	}

	.infoText {
		font-size: 12pt;
	}

	.countyName {
		
		font-size: 12pt;
		text-align: center;
		width: 100%;
		margin: 14px auto;
		
	}

	.newWhiteBG {
		border-radius: 0;
	}

	.reviewsList {

		padding: 10px;
		
	}

	h2.noMargin {
		
		margin-top: -20px;

	}

	.resultsBox2Left {

		margin: auto;
		margin-top: 10px;
		padding: 20px;
		
	}

	.resultsBox2Right {
		border: none;
	}

	.rightBox {
		
		margin-top: 10px;
	}

	/* countyLink */

	.countyLink {
		
		padding: 0;
		text-align: center;
		margin: 10px auto 20px auto;
		
	}

	.infoText i.fas {
		
		margin: auto;
		padding: 0;
		margin-bottom: 5px;
		
	}
		
		
	.parkinfo {

		clear: both;
		display: block;
	}

}

@media only screen and (max-width: 500px) {

	.infoTextContainer i {
		font-size: 16pt;
	}

	.infoTextContainer .infoText {
		font-size: 11pt;
	}

}


@media only screen and (max-width: 400px) {

	.resultsBox2Left ul {

		padding-top: 0;
		
	}

	.nameHeader {
		
		font-size: 14pt;
		
	}

}

@media only screen and (max-width: 300px) {

	.infoTextContainer i {
		font-size: 14pt;
	}

	.infoTextContainer .infoText {
		font-size: 10pt;
	}

}

/* Locations Container Styles */

.locationsContainer {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
	padding: 30px 20px;
	background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 100%);
	max-width: 1200px;
	margin: 20px auto;
	border-radius: 8px;
}

.locationBubble {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background: linear-gradient(145deg, #ffffff 0%, #f0f2f5 100%);
	color: #137C84;
	text-decoration: none !important;
	border-radius: 10px;
	padding: 20px 12px;
	text-align: center;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06),
				inset 0 1px 0 rgba(255, 255, 255, 0.8);
	border: 1px solid rgba(19, 124, 132, 0.08);
	overflow: hidden;
	min-height: 85px;
}

.locationBubble::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(145deg, #137C84 0%, #21959D 100%);
	opacity: 0;
	transition: opacity 0.3s ease;
	border-radius: 10px;
}

.locationBubble::after {
	content: '';
	position: absolute;
	top: -50%;
	left: -50%;
	width: 200%;
	height: 200%;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.locationBubble:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(19, 124, 132, 0.2),
				0 2px 6px rgba(0, 0, 0, 0.08);
	border-color: rgba(19, 124, 132, 0.15);
	text-decoration: none !important;
}

.locationBubble:hover::before {
	opacity: 1;
}

.locationBubble:hover::after {
	opacity: 1;
}

.locationBubble:hover .bubbleContent {
	color: white;
}

.locationBubble:active {
	transform: translateY(0px);
	transition: all 0.1s ease;
}

.bubbleContent {
	display: flex;
	flex-direction: column;
	gap: 4px;
	position: relative;
	z-index: 1;
	transition: color 0.3s ease;
}

.bubbleName {
	font-weight: 600;
	font-size: 14px;
	line-height: 1.25;
	letter-spacing: 0.2px;
}

.bubbleCount {
	font-size: 11px;
	opacity: 0.75;
	font-weight: 500;
	letter-spacing: 0.3px;
	text-transform: uppercase;
}

@media only screen and (max-width: 900px) {

	.locationsContainer {
		grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
		gap: 10px;
		padding: 20px 15px;
	}

	.locationBubble {
		min-height: 90px;
		padding: 16px 10px;
	}

	.bubbleName {
		font-size: 13px;
	}

	.bubbleCount {
		font-size: 11px;
	}

}

@media only screen and (max-width: 600px) {

	.locationsContainer {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		padding: 15px;
		margin: 15px auto;
		border-radius: 0;
		background: white;
	}

	.locationBubble {
		min-height: 85px;
		padding: 15px 10px;
		border-radius: 8px;
	}

	.bubbleName {
		font-size: 13px;
	}

	.bubbleCount {
		font-size: 10px;
	}

}

@media only screen and (max-width: 400px) {

	.locationsContainer {
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
		padding: 12px;
	}

	.locationBubble {
		min-height: 80px;
		padding: 12px 8px;
		border-radius: 8px;
	}

	.bubbleName {
		font-size: 12px;
	}

	.bubbleCount {
		font-size: 10px;
	}

}