/*
Theme Name:   The Perch North Coast
Theme URI:    https://theperchnorthcoast.com/
Description:  Custom Wordpress theme for The Perch North Coast
Author:       Jake Woods
Author URI:   https://jakewoods.io
Template:     generatepress
Version:      0.1
License: 	  GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  djw
*/

@font-face {
    font-family: 'Merchant ThinCondensed';
    src: url('./fonts/Merchant-ThinCondensed.woff2') format('woff2'),
         url('./fonts/Merchant-ThinCondensed.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/** ----------------------------------------
 ** Custom Properties
 ** ----------------------------------------
    Sets custom properties to be used
 	repeatedly and consistently across site. 
 ** --------------------------------------- */
 :root {
	--head-font: Merchant ThinCondensed, serif;
	/* * CHANGE THIS TO THE HEADLINE FONT SET IN THE CUSTOMISER */
	--body-font: Gill Sans, Helvetica, Arial, sans-serif;
	/* * CHANGE THIS TO THE BODY FONT SET IN THE CUSTOMISER */
	--head-weight: normal;
	--body-weight: 400;
	--fs-body: clamp(1rem, 0.974rem + 0.1299999999999999vw, 1.13rem);
	--fs-head-xxl: clamp(4rem, 3.45rem + 2.75vw, 6.75rem);
	--fs-head-xl: clamp(2.875rem, 2.375rem + 2.5vw, 5.375rem);
	--fs-head-h1: clamp(2.5rem, 2.15rem + 1.7500000000000002vw, 4.25rem);
	--fs-head-h2: clamp(2.175rem, 1.9349999999999998rem + 1.2000000000000002vw, 3.375rem);
	--fs-head-h3: clamp(1.85rem, 1.6700000000000002rem + 0.8999999999999999vw, 2.75rem);
	--fs-head-h4: clamp(1.625rem, 1.5rem + 0.625vw, 2.25rem);
	--fs-head-h5: clamp(1.375rem, 1.3rem + 0.375vw, 1.75rem);
	--fs-head-h6: clamp(1.25rem, 1.22rem + 0.1499999999999999vw, 1.4rem);
	--fs-head-s: clamp(1rem, 0.974rem + 0.1299999999999999vw, 1.13rem);
	--fs-head-pre: clamp(1rem, 0.974rem + 0.1299999999999999vw, 1.13rem);
	--fs-head-body-xxl: clamp(1.25rem, 1.15rem + 0.5vw, 1.75rem);
	--fs-head-body-xl: clamp(1.13rem, 1.0159999999999998rem + 0.5700000000000001vw, 1.5rem);
	--fs-head-body-l: clamp(1.11rem, 1.082rem + 0.1399999999999999vw, 1.25rem);
	--fs-head-body-s: clamp(0.95rem, 0.9339999999999999rem + 0.08000000000000007vw, 1.03rem);
	--fs-head-body-xs: clamp(0.89rem, 0.888rem + 0.010000000000000009vw, 0.9rem);
	--sect-side-pad: 2rem;
	--sect-v-pad-xs: 1rem;
	--sect-v-pad-s: 2rem;
	--sect-v-pad-m: 3.5rem;
	--sect-v-pad-d: 5rem;
	--sect-v-pad-l: 7.5rem;
	--sect-v-pad-xl: 10rem;
	--cont-w-l: 1920px;
	--cont-w-d: 1400px;/* Standard section width - set in customizer - ujpdate here if changed! */
	--cont-w-m: 922px;/* 1024px */
	--cont-w-s: 768px;/* 768px */
	--cont-w-xs: 540px;/* 640px */
	--spac-x-0-25: 0.25rem;/* 4px */
	--spac-x-0-5: 0.5rem;/* 8px */
	--spac-x-0-75: 0.75rem;/* 12px */
	--spac-x-1: 1rem;/* 16px */
	--spac-x-1-25: 1.25rem;/* 20px */
	--spac-x-1-5: 1.5rem;/* 24px */
	--spac-x-1-75: 1.75rem;/* 28px */
	--spac-x-2: 2rem;/* 32px */
	--spac-x-2-5: 2.5rem;
	--spac-x-3: 3rem;/* 48px */
	--spac-x-4: 4rem;/* 64px */
	--spac-x-5: 5rem;
	--spac-x-6: 6rem;/* 96px */
	--spac-x-8: 8rem;/* 128px */
	--spac-x-12: 12rem;/* 192px */
	--spac-x-16: 16rem;/* 256px */
	--spac-x-24: 24rem;/* 384px */
	--spac-x-32: 32rem;/* 512px */
	--spac-x-40: 40rem;/* 640px */
	--spac-x-48: 48rem;/* 768px */
	--navigation-height: 96px;
	--inset-text: 4rem;
}

@media(min-width: 769px) and (max-width: 1024px) {
	:root {
		--sect-side-pad: 1.5rem;
		--sect-v-pad-m: 2rem;
		--sect-v-pad-d: 4rem;
		--sect-v-pad-l: 6rem;
		--sect-v-pad-xl: 7.5rem;
		--navigation-height: 88px;
		--inset-text: 3rem;
	}
}

@media(max-width: 768px) {
	:root {
		--sect-side-pad: 1rem;
		--sect-v-pad-xs: 1rem;
		--sect-v-pad-s: 1.25rem;
		--sect-v-pad-m: 1.5rem;
		--sect-v-pad-d: 3rem;
		--sect-v-pad-l: 4.5rem;
		--sect-v-pad-xl: 6rem;
		--navigation-height: 80px;
		--inset-text: 2rem;
	}
}


/** ----------------------------------------
 ** Helper Classes
 ** ----------------------------------------
    Useful classes to do specfic things.
 ** --------------------------------------- */

 /* Used to remove elements visually while preserving them in the DOM for SEO */
.hide-me {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
    clip-path: inset(0px 0px 99.9% 99.9%);
    overflow: hidden;
    height: 1px;
    width: 1px;
    padding: 0;
    border: 0;
}

/* No Underline */
.no-ul, .no-ul a {
	text-decoration: none;
}


/** ----------------------------------------
 ** Base Theme Overrides
 ** ----------------------------------------
    Sets custom properties to be used
 	repeatedly and consistently across site. 
 ** --------------------------------------- */
/* Mobile Menu Trigger Button */
.mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:hover, .mobile-menu-control-wrapper .menu-toggle:focus, .has-inline-mobile-toggle #site-navigation.toggled {
	background-color: transparent;
}


/* Preps page for parallax hero */
div#page {
	position: relative;
	z-index: 5;
}


/** ----------------------------------------
 ** Container Widths
 ** ----------------------------------------
    Sets the max width for containers
 ** --------------------------------------- */
.container-width-d {max-width: var(--cont-w-d);}
.container-width-m {max-width: var(--cont-w-m);}
.container-width-s {max-width: var(--cont-w-s);}
.container-width-xs {max-width: var(--cont-w-xs);}


/** ----------------------------------------
 ** Typography
 ** ----------------------------------------
    Sets the global typography
 ** --------------------------------------- */

 /* Default Body / p font settings */
p {
	font-family: var(--body-font);
	font-size: var(--fs-body);
	font-weight: var(--body-weight);
	line-height: 1.5;
	margin-bottom: var(--spac-x-1-5);
}

/* Default Headings weight, margin, font-family */
h1,
h2,
h3,
h4,
h5,
h6,
.gb-headline-xxl,
.gb-headline-xl,
.gb-headline-h1,
.gb-headline-h2,
.gb-headline-h3,
.gb-headline-h4,
.gb-headline-h5,
.gb-headline-h6 {
	font-family: var(--head-font);
	font-weight: var(--head-weight);
	margin-bottom: var(--spac-x-1);
}

/* Heading font-size and line-height */
.gb-headline-xxl {
	font-size: var(--fs-head-xxl);
	line-height: 1.05;
}

.gb-headline-xl {
	font-size: var(--fs-head-xl);
	line-height: 1.05;
}

h1,
.gb-headline-h1 {
	font-size: var(--fs-head-h1);
	line-height: 1.05;
}

h2,
.gb-headline-h2 {
	font-size: var(--fs-head-h2);
	line-height: 1.1;
}

h3,
.gb-headline-h3 {
	font-size: var(--fs-head-h3);
	line-height: 1.15;
}

h4,
.gb-headline-h4 {
	font-size: var(--fs-head-h4);
	line-height: 1.1;
}

h5,
.gb-headline-h5 {
	font-size: 1.375rem;
	font-size: var(--fs-head-h5);
	line-height: 1.25;
}

h6,
.gb-headline-h6 {
	font-size: 1.25rem;
	font-size: var(--fs-head-h6);
	line-height: 1.4;
}

.gb-headline-s {
	font-family: var(--body-font);
	font-size: var(--fs-head-s);
	letter-spacing: 2px;
	text-transform: uppercase;
}

.gb-headline-pre {
	font-size: var(--fs-head-pre);
	text-transform: uppercase;
	letter-spacing: .1em
}

/* Additional Body font-size */

.gb-headline-body-xxl,
.gb-headline-body-xl,
.gb-headline-body-l,
.gb-headline-body-d,
.gb-headline-body-s,
.gb-headline-body-xs {
	font-family: var(--body-font);
}

.gb-headline-body-xxl {
	font-size: var(--fs-head-body-xxl);
}

.gb-headline-body-xl {
	font-size: var(--fs-head-body-xl);
}

.gb-headline-body-l {
	font-size: var(--fs-head-body-l);
}

.gb-headline-body-d {
	font-size: var(--fs-body);
}

.gb-headline-body-s {
	font-size: var(--fs-head-body-s);
}

.gb-headline-body-xs {
	font-size: var(--fs-head-body-xs);
}

/* Very large Headline styles */
@media (min-width: 1024px) {
	.tp--very-large {
		font-size: 8.75vw;
	}
}

@media (min-width: 1650px) {
	.tp--very-large {
		font-size: 144px;
	}
}

/* Add top margin to blog post H2-H6 */

#post-content :is(h2, h3, h4, h5, h6) {
	margin-top: var(--spac-x-3);
}

#post-content p {
	line-height: 1.8;
	/* max-width: 68ch; */
}

p:last-child {
	margin-bottom: 0;
}

/* Remove bottom margin on last paragraph in container (front end) */
.gb-container p:last-child:last-of-type {
	margin-bottom: 0px;
}

/* Remove bottom margin on last paragraph in container (editor) */
.block-editor-block-list__layout .gb-container p:nth-last-child(2) {
	margin-bottom: 0px;
}


/** Inset Text Styles */
.tp--inset-text {
	padding-left: var(--inset-text);
}

@media (max-width: 1023px) {
	.tp--inset-text {
		padding-left: var(--inset-text);
	}
}

@media (max-width: 768px) {
	.tp--inset-text {
		padding-left: var(--inset-text);
	}
}


/* * List Styles */
#content ul,
#content ol {
	margin-left: var(--spac-x-1-25)
}

#content li {
	font-family: var(--body-font);
	font-size: var(--fs-body);
	font-weight: var(--fs-body-weight);
	line-height: var(--spac-x-1-75);
}


/** ----------------------------------------
 ** Links
 ** ----------------------------------------
    Basic link styles are set in the customiser
	but you can extend them here
 ** --------------------------------------- */
a, p a, .inside-article a, .paging-navigation a, .comments-area a, .page-header a {

}
a:hover, p a:hover, .inside-article a:hover, .paging-navigation a:hover, .comments-area a:hover, .page-header a:hover {

}


/** ----------------------------------------
 ** Header
 ** ----------------------------------------
    Styles the site masthead
 ** --------------------------------------- */
.site-header {
	z-index: 10;
}

.site-header .inside-header,
.site-header .inside-header #sticky-navigation .inside-navigation {
    padding: calc( var(--sect-side-pad) / 2 ) var(--sect-side-pad);
	max-width: var(--cont-w-l);
}

.site-header .inside-header ul li a {
	color: var(--surface-50);
}

.site-header .inside-header #sticky-navigation {
	background-color: var(--contrast-950);
	box-shadow: 0px 10px 24px -10px rgba(15,16,26,0.24);
	-webkit-box-shadow: 0px 10px 24px -10px rgba(15,16,26,0.24);
	-moz-box-shadow: 0px 10px 24px -10px rgba(15,16,26,0.24);
}

#sticky-navigation .inside-navigation {
}

#sticky-navigation .inside-navigation .menu-toggle {
	color: var(--primary-500);
}

#sticky-navigation .inside-navigation .navigation-branding {
	margin-left: 0;
	order: 1;
}

#sticky-navigation .inside-navigation .navigation-branding img {
	height: 64px;
	padding: 0;
}

#sticky-navigation .inside-navigation button.menu-toggle {
	line-height: 64px;
	order: 2;
	padding-right: 0;
}

/* Cloudbeds Button Widget 
@media (max-width: 767px) {
	#sticky-navigation .inside-navigation {
		align-items: center;
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		gap: 0;
		justify-content: flex-start;
	}
	#sticky-navigation .inside-navigation .navigation-branding {
		order: initial;
	}
}


#sticky-navigation .inside-navigation div:has(#CBWidget) {
    order: 3;
}
*/

/** Navigation CTA - w/ Cloudbeds Button 
#mobile-menu-control-wrapper {
	flex-direction: row-reverse;
}
**/

/** Navigation merge */
@media (max-width: 767px) {
	.site-header .inside-header {
    	padding: var(--sect-side-pad);
	}
}


/** ----------------------------------------
 ** Main Navigation 
 ** ----------------------------------------
    Styles the mobile navigation
 ** --------------------------------------- */
#generate-slideout-menu::after {
	background-image: url("https://dev.theperchnorthcoast.com/wp-content/uploads/2023/11/tp-background-pattern-dark-pattern.png");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

#generate-slideout-menu .inside-navigation {
	height: 100%;
	justify-content: center;
	max-width: var(--cont-w-d);
	padding: var(--sect-v-pad-l) var(--sect-side-pad);
	position: relative;
	z-index: 5;
}

#generate-slideout-menu .inside-navigation .main-nav {
	width: 100%;
}

#generate-slideout-menu .inside-navigation ul {
	gap: var(--spac-x-1-5);
}

#generate-slideout-menu .inside-navigation ul li {
	text-align: left!important;
}

#generate-slideout-menu .inside-navigation ul li a {
	font-family: var(--head-font);
	font-size: var(--fs-head-h2);
	line-height: calc( var(--fs-head-h2) * 1.618 );
}

#generate-slideout-menu .inside-navigation ul li ul.sub-menu li a {
	font-family: var(--body-font);
	font-size: var(--fs-head-h6);
	line-height: calc( var(--fs-head-h6) * 1.618 );
	text-transform: uppercase;
}

@media (max-width: 400px) {
	#generate-slideout-menu .inside-navigation  {
		flex-direction: column;
		flex-wrap: nowrap;
		gap: var(--spac-x-1-5);
	}

	#generate-slideout-menu .inside-navigation ul {
		gap: var(--spac-x-1-25);
	}

	#generate-slideout-menu .inside-navigation ul li a {
		font-size: var(--fs-head-h3);
		line-height: calc( var(--fs-head-h3) * 1.618 );
	}
}


/** ----------------------------------------
 ** Footer
 ** ----------------------------------------
    Styles the site footer
 ** --------------------------------------- */
/** Footer Menu */
#global-footer .tp--global-footer__footer-menu {
	width: 100%;
}
#global-footer .tp--global-footer__footer-menu ul {
	justify-content: space-between;
}
#global-footer .tp--global-footer__footer-menu ul li a {
	font-family: var(--body-font);
	font-weight: 400;
	letter-spacing: 2.5px;
	text-transform: uppercase;
}

/** Footer Contact Details */
#global-footer .tp--global-footer__content-bottom a,
#global-footer .tp--global-footer__content-bottom p {
	margin-bottom: 0;
	text-decoration: none;
}

@media (max-width: 922px) {
	#global-footer .tp--global-footer__footer-menu ul,
	#global-footer .tp--global-footer__policies-menu ul {
		align-items: center;
		flex-direction: column;
	}

	#global-footer .tp--global-footer__policies-menu ul {
		gap: var(--spac-x-0-5);
	}
}


/** ----------------------------------------
 ** Forms
 ** ----------------------------------------
    Basic styles for Fluent Forms
 ** --------------------------------------- */
 form.frm-fluent-form label {
	color: var(--contrast-500);
	font-family: var(--body-font);
	font-size: var(--fs-head-body-s);
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label:after {
    color: var(--accent);
}

form.frm-fluent-form .ff-el-input--label {
	margin-bottom: var(--spac-x-0-25);
}

/* Inputs, Text Areas & Selects */
form.frm-fluent-form input,
form.frm-fluent-form textarea,
form.frm-fluent-form select {
	background-color: transparent;
	border-color: var(--primary-500)!important;
	border-radius: 0!important;
	color: var(--contrast-950)!important;
	font-family: var(--body-font);
	font-size: var(--fs-body-s);
	padding: var(--spac-x-0-75);
	-webkit-border-radius: 0!important;
	-moz-border-radius: 0!important;
	-ms-border-radius: 0!important;
	-o-border-radius: 0!important;
}
form.frm-fluent-form input::placeholder,
form.frm-fluent-form textarea::placeholder,
form.frm-fluent-form select::placeholder {
	color: var(--text-500);
}
form.frm-fluent-form input:focus,
form.frm-fluent-form textarea:focus,
form.frm-fluent-form select:focus {
	background-color: var(--surface-100)!important;
	border-color: var(--contrast-50)!important;
}

select.ff-el-form-control:not([size]):not([multiple]) {
	height: auto;
}

form.frm-fluent-form select option:first-child {
	color: var(--surface-700);
}

/* Submit Button */
button.ff-btn-submit {
	background-color: var(--primary-500);
	border-radius: 0;
	color: var(--contrast-950);
	font-family: var(--body-font)!important;
	font-size: var(--fs-body);
	font-weight: var(--head-weight);
	padding: var(--spac-x-1) var(--spac-x-1-5)!important;
	text-transform: uppercase;
	width: 100%;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	-o-border-radius: 0;
}
button.ff-btn-submit:hover {
	background-color: var(--contrast-950);
	color: var(--surface-50);
}
.ff_submit_btn_wrapper {
	margin-bottom: 0!important;
}



/** ----------------------------------------
 ** Hero Sections
 ** ----------------------------------------
    Styles the parallax hero sections
 ** --------------------------------------- */
.tp--parallax-hero {
	display: grid;
	grid-template-areas: "stack";
	height: 100vh;
	min-height: 100vh;
	position: relative;
	z-index: 0;
}

.tp--parallax-hero > * {
	animation: parallax ease-in-out;
	animation-timeline: scroll(self);
	grid-area: stack;
	position: relative;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.tp--parallax-hero .tp--parallax-hero__headline-wrap {
	--parallax-speed: -8;
	animation: parallax ease-in-out;
	height: 100%;
	max-width: 100%;
	width: 100%;
	z-index: 3;
	-webkit-animation: parallax ease-in-out;
}

.tp--parallax-hero .tp--parallax-hero__headline {
	color: var(--primary-950);
	max-width: var(--cont-w-d);
	padding-inline: var(--sect-side-pad);
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	transform: translate(-50%, -50%);
	width: 100%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
}

.tp--parallax-hero .tp--parallax-hero__button-wrap {
	--parallax-speed: -12;
	animation: parallax ease-in-out;
	height: 100%;
	max-width: 100%;
	width: 100%;
	z-index: 3;
	-webkit-animation: parallax ease-in-out;
}

.tp--parallax-hero .tp--parallax-hero__button-container {
	display: flex;
	position: absolute;
	right: 32%;
	top: 80%;
}

.tp--parallax-hero .tp--parallax-hero__button {
	transition: all .4s;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	-ms-transition: all .4s;
	-o-transition: all .4s;
}
.tp--parallax-hero .tp--parallax-hero__button:hover {
	transform: scale(110%);
	-webkit-transform: scale(110%);
	-moz-transform: scale(110%);
	-ms-transform: scale(110%);
	-o-transform: scale(110%);
}

.tp--parallax-hero figure {
	display: inline-flex;
	height: 100%;
	max-width: 100%;
	position: relative;
	width: 100%;
	z-index: 2;
}

.tp--parallax-hero figure:nth-of-type(1) {
	--parallax-speed: -128;
}
.tp--parallax-hero figure:nth-of-type(1) img {
	position: absolute;
	right: 8%;
	top: 24%;
	width: 20%;
}

.tp--parallax-hero figure:nth-of-type(2) {
	--parallax-speed: -40;
}
.tp--parallax-hero figure:nth-of-type(2) img {
	position: absolute;
	top: 8%;
	left: 4%;
	width: 32%;
}

.tp--parallax-hero figure:nth-of-type(3) {
	--parallax-speed: -64;
}
.tp--parallax-hero figure:nth-of-type(3) img {
	position: absolute;
	top: 68%;
	left: 17%;
	width: 24%;
}

@keyframes parallax {
	from {
	  transform: translateY(0);
	  -webkit-transform: translateY(0);
	  -moz-transform: translateY(0);
	  -ms-transform: translateY(0);
	  -o-transform: translateY(0);
	}
	to {
	  transform: translateY(calc(var(--parallax-speed) * 80px));
	  -webkit-transform: translateY(calc(var(--parallax-speed) * 80px));
	  -moz-transform: translateY(calc(var(--parallax-speed) * 80px));
	  -ms-transform: translateY(calc(var(--parallax-speed) * 80px));
	  -o-transform: translateY(calc(var(--parallax-speed) * 80px));
	}
}



/** ----------------------------------------
 ** Home Page Styles
 ** ----------------------------------------
	Custom styles for the home page
 ** --------------------------------------- */
/** Offset Image Grid Section */



/** ----------------------------------------
 ** Post Archive Styles
 ** ----------------------------------------
	Custom styles for the post archives
 ** --------------------------------------- */
#post-archive .tp--archive-query__grid-item a {
	margin-bottom: 0;
	text-decoration: none;
}



/** ----------------------------------------
 ** Accommodation Page
 ** ----------------------------------------
	Custom styles for the accommodation page
 ** --------------------------------------- */
.tp--accomodation-types__item-grid .gb-grid-column {
	height: 100%;
}



/** ----------------------------------------
 ** Contact Page
 ** ----------------------------------------
	Custom styles for the contact page
 ** --------------------------------------- */
.tp--contact__contact-col a {
	text-decoration-color: var(--primary-500);
	-moz-text-decoration-color: var(--primary-500);
}

.tp--contact__address p {
	font-size: var(--fs-head-body-xl);
}



/** ----------------------------------------
 ** Explore the North Coast Page
 ** ----------------------------------------
	Custom styles for the explore the North
	Coast page
 ** --------------------------------------- */

/** Towns Query Loop Styles **/
@media (min-width: 1024px) {
	.tp--towns-query .gb-grid-column:nth-child(even) .gb-grid-wrapper {
		flex-direction: row-reverse;
	}
}

@media (max-width: 767px) {
	.tp--towns-query .tp--towns-query__text-wrap.tp--inset-text {
		padding-left: 0;
	}
}



/** ----------------------------------------
 ** Guest Info Page
 ** ----------------------------------------
	Custom styles for the Guest Information
	Page
 ** --------------------------------------- */
.page-guest-information #guest-info ul.djwb--social-navigation {
    margin-left: 0;
}

@media (max-width: 1023px) {
	.gb-accordion__item .tp--guest-info--title {
		padding-right: 40px;
		position: relative;
	}
	.gb-accordion__item .tp--guest-info--title::after {
		background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZD0iTTEyLjc1IDlhLjc1Ljc1IDAgMCAwLTEuNSAwdjIuMjVIOWEuNzUuNzUgMCAwIDAgMCAxLjVoMi4yNVYxNWEuNzUuNzUgMCAwIDAgMS41IDB2LTIuMjVIMTVhLjc1Ljc1IDAgMCAwIDAtMS41aC0yLjI1eiIvPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTIgMS4yNUM2LjA2MyAxLjI1IDEuMjUgNi4wNjMgMS4yNSAxMlM2LjA2MyAyMi43NSAxMiAyMi43NVMyMi43NSAxNy45MzcgMjIuNzUgMTJTMTcuOTM3IDEuMjUgMTIgMS4yNU0yLjc1IDEyYTkuMjUgOS4yNSAwIDEgMSAxOC41IDBhOS4yNSA5LjI1IDAgMCAxLTE4LjUgMCIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+');
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		content: '';
		height: 24px;
		width: 24px;
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
		transition: transform 0.3s ease; /* Animation for rotation */
	}
	
	.gb-accordion__item.gb-accordion__item-open .tp--guest-info--title::after {
		transform: translateY(-50%) rotate(45deg); /* Rotate 45 degrees */
	}
	
}

@media (min-width: 1024px){
	.tp--guest-info--accordion-item > .gb-accordion__content {
		max-height: inherit !important;
		
} 

	.tp--guest-info--title {
		cursor: default;
		pointer-events: none;
	}

	.tp--guest-info--buttons-wrap {
    	position: sticky;
    	top: 120px;
	}
}



/** ----------------------------------------
 ** Social Media Navigation
 ** ----------------------------------------
	Styles the Social Media navigation block
 ** --------------------------------------- */
/* Main Content */
#content ul.tp--social-icons {
	margin-left: 0;
}

/* Slideout Panel */
ul.djwb--social-navigation.tp--slideout-social-navigation {
    display: flex;
    align-items: flex-start;
    width: 100%;
}