/*!********************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./assets/scss/pages/property.scss ***!
  \********************************************************************************************************************************************************************/
/*
This file should only contain global mixins that can help organize your SCSS better.

If your project uses many mixins then it is suggested to split you mixins into many files.
*/
/*
*   == Media query mixin ==
*   These are the standard breakpoints set by foundation,
*   However add/change/remove if needed.
*
*   e.g
*
*    .site-header {
*    padding: 2rem;
*    font-size: 1.8rem;
*    @include mq('medium') {
*        padding-top: 4rem;
*        font-size: 2.4rem;
*       }
*    }
*
*   By default the mediaQuery is set to min-width
*/
/*
*   == Font sizes ==
*
*   Use for setting dynamic font sizes.
*   Add/change/remove as needed.
*   This mixin relies on the $breakpoint keys from above
*   
*   e.g 
*   h1 {
*       @include font-size($h--1);
*   }
*   
*   Full eg can be found in variables.scss
*/
/*
*   == Pseudo element ==
*
*   Use this for ::before and ::after elements
*
*   e.g 
*   a::after {
*        @include pseudo;
*   }
*/
/*
*   == Responsive ratios ==
*
*   Use for creating scalable elements e.g images that maintain a ratio
*
*   e.g 
*   div {
*       @include responsive-ratio(16,9);
*   }
*/
/*
*   == Image zoom on hover ==
*
*   Use for creating a zoom in effect when hovering on images.
*
*   Tweak as needed.   
*
*   e.g 
*   div {
*       @include hoverZoomImage(1.05);
*   }
*/
/*
*   == Create box ==
*
*   Use to create boxes.
*
*   e.g 
*   div {
*       @include box(200px, 300px);
*   }
*   div {
*       @include box(200px);
*   }
*/
/*
*   == Font faces ==
*
*  Use this to quickly add a custom font-face to a project.
*
*   e.g 
*   h1 {
*       @include fontFace(Roboto, "./assets/Roboto", normal, normal);
*   }
*/
.featured {
  background: #f0ece3;
  margin: 0;
  padding: 3em 0;
  position: relative;
}
@media (min-width: 750px) {
  .featured {
    padding: 5em 0;
  }
}
@media (min-width: 1250px) {
  .featured {
    padding: 6em 0;
  }
}
.featured .grid-x {
  position: relative;
}
@media (min-width: 650px) {
  .featured__slider--container {
    padding: 20px;
  }
}
.featured__slider--container h3 {
  margin-top: 2em;
}
@media (min-width: 750px) {
  .featured__slider--container h3 {
    margin-top: 1em;
  }
}
@media (min-width: 1050px) {
  .featured__slider--container h3 {
    min-height: 90px;
  }
}
@media (min-width: 1150px) {
  .featured__slider--container h3 {
    min-height: auto;
  }
}
.featured__slider--container img {
  height: auto;
}
.featured__slider--container .icons__container {
  display: inline-block;
  padding: 0 10px;
}
.featured__slider--container .icons__container svg {
  height: 20px;
  width: 20px;
  -o-object-fit: contain;
     object-fit: contain;
  display: inline-block;
}
.featured__slider--container .icons__container p {
  display: inline-block;
}
@media (min-width: 750px) {
  .featured__slider--container .subtitle {
    min-height: 75px;
  }
}
@media (min-width: 850px) {
  .featured__slider--container .subtitle {
    min-height: 50px;
  }
}
@media (min-width: 1050px) {
  .featured__slider--container .subtitle {
    min-height: 65px;
  }
}
@media (min-width: 1300px) {
  .featured__slider--container .subtitle {
    min-height: auto;
  }
}
.featured .swiper-button-prev,
.featured .swiper-button-next {
  top: 25%;
  background: rgba(255, 255, 255, 0.5215686275);
}
@media (min-width: 750px) {
  .featured .swiper-button-prev,
  .featured .swiper-button-next {
    margin: 0 20px;
    top: 12%;
    transform: translateY(100%);
  }
}
@media (min-width: 1050px) {
  .featured .swiper-button-prev,
  .featured .swiper-button-next {
    top: 20%;
    background: transparent;
  }
}
@media (min-width: 1450px) {
  .featured .swiper-button-prev,
  .featured .swiper-button-next {
    background: transparent;
  }
}
.featured .featured-prev {
  left: 0;
}
@media (min-width: 650px) {
  .featured .featured-prev {
    left: 20px;
  }
}
@media (min-width: 750px) {
  .featured .featured-prev {
    margin: 0;
  }
}
@media (min-width: 1050px) {
  .featured .featured-prev {
    left: -3.5%;
  }
}
@media (min-width: 1650px) {
  .featured .featured-prev {
    left: -5.5%;
  }
}
.featured .featured-next {
  right: 0;
}
@media (min-width: 650px) {
  .featured .featured-next {
    right: 20px;
  }
}
@media (min-width: 750px) {
  .featured .featured-next {
    margin: 0;
  }
}
@media (min-width: 1050px) {
  .featured .featured-next {
    right: -3.5%;
  }
}
@media (min-width: 1650px) {
  .featured .featured-next {
    right: -5.5%;
  }
}

/*
Imports only in this file.
*/
/*
Colours should only contain colour variables of the base and global kind.

All colours for specific components or elements should go into their own local file.
*/
/*
This file should only be used for functions used across a project
*/
/*
Pixels to rems
*/
/*
Strip units from number
*/
/*
This file should contain only variables that will be shared across SCSS Files.

These do NOT include colours, z-indexes, media queries, etc.

Eg. $global-header-height: 250px;

Use a global prefix so that it is clear where the definition is when used in other files
*/
/*
This file is for the use of SCSS animations only.
*/
@keyframes nudgeRight {
  from {
    transform: translateX(0) scale(1);
  }
  to {
    transform: translateX(5px) scale(1.02);
  }
}
@keyframes fadeInUp {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0%);
    opacity: 1;
  }
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Jost";
  font-style: normal;
  font-weight: 300;
  src: url(.././fonts/Jost-Light.ttf) format("truetype");
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Jost";
  font-style: normal;
  font-weight: 600;
  src: url(.././fonts/Jost-Medium.ttf) format("truetype");
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Noto Serif Display";
  font-style: normal;
  font-weight: 200;
  src: url(.././fonts/NotoSerifDisplay-ExtraLight.ttf) format("truetype");
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Noto Serif Display";
  font-style: normal;
  font-weight: 300;
  src: url(.././fonts/NotoSerifDisplay-Light.ttf) format("truetype");
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Caveat";
  font-style: normal;
  font-weight: 400;
  src: url(.././fonts/Caveat-Regular.ttf) format("truetype");
}
/*
This file is to contain any and all font family declarations.
*/
/*
This file should only contain global mixins that can help organize your SCSS better.

If your project uses many mixins then it is suggested to split you mixins into many files.
*/
/*
*   == Media query mixin ==
*   These are the standard breakpoints set by foundation,
*   However add/change/remove if needed.
*
*   e.g
*
*    .site-header {
*    padding: 2rem;
*    font-size: 1.8rem;
*    @include mq('medium') {
*        padding-top: 4rem;
*        font-size: 2.4rem;
*       }
*    }
*
*   By default the mediaQuery is set to min-width
*/
/*
*   == Font sizes ==
*
*   Use for setting dynamic font sizes.
*   Add/change/remove as needed.
*   This mixin relies on the $breakpoint keys from above
*   
*   e.g 
*   h1 {
*       @include font-size($h--1);
*   }
*   
*   Full eg can be found in variables.scss
*/
/*
*   == Pseudo element ==
*
*   Use this for ::before and ::after elements
*
*   e.g 
*   a::after {
*        @include pseudo;
*   }
*/
/*
*   == Responsive ratios ==
*
*   Use for creating scalable elements e.g images that maintain a ratio
*
*   e.g 
*   div {
*       @include responsive-ratio(16,9);
*   }
*/
/*
*   == Image zoom on hover ==
*
*   Use for creating a zoom in effect when hovering on images.
*
*   Tweak as needed.   
*
*   e.g 
*   div {
*       @include hoverZoomImage(1.05);
*   }
*/
/*
*   == Create box ==
*
*   Use to create boxes.
*
*   e.g 
*   div {
*       @include box(200px, 300px);
*   }
*   div {
*       @include box(200px);
*   }
*/
/*
*   == Font faces ==
*
*  Use this to quickly add a custom font-face to a project.
*
*   e.g 
*   h1 {
*       @include fontFace(Roboto, "./assets/Roboto", normal, normal);
*   }
*/
/*
This file should only contain global mixins that can help organize your SCSS better.

If your project uses many mixins then it is suggested to split you mixins into many files.
*/
/*
This file should contain globally defined styles for the project.

That could mean setting global font size, adding global box sizing, etc.

This file should NOT contain any configurations, mixins, variables. ONLY styling and @includes
*/
* {
  box-sizing: border-box;
}

section {
  margin: 3em 0;
}
@media (min-width: 750px) {
  section {
    margin: 5em 0;
  }
}
@media (min-width: 1250px) {
  section {
    margin: 6em 0;
  }
}

section:last-child {
  margin-bottom: 0px !important;
}

section.contact {
  margin-bottom: 3em !important;
}
@media (min-width: 750px) {
  section.contact {
    margin-bottom: 5em !important;
  }
}
@media (min-width: 1250px) {
  section.contact {
    margin-bottom: 6em !important;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Noto Serif Display", "sans-serif";
  color: hsl(0, 0%, 0%);
  font-weight: 300;
}

h1 {
  font-size: calc(2.25rem + (1vw - 3.5px) * 0.8485);
}
@media (min-width: 2000px) {
  h1 {
    font-size: 50px;
  }
}

h2 {
  font-size: calc(2rem + (1vw - 3.5px) * 0.7879);
}
@media (min-width: 2000px) {
  h2 {
    font-size: 45px;
  }
}

@media screen and (min-width: 350px) {
  h3 {
    font-size: 1.75rem;
  }
}
@media screen and (min-width: 550px) {
  h3 {
    font-size: 1.75rem;
  }
}
@media screen and (min-width: 750px) {
  h3 {
    font-size: 1.875rem;
  }
}
@media screen and (min-width: 1050px) {
  h3 {
    font-size: 2rem;
  }
}
@media screen and (min-width: 1250px) {
  h3 {
    font-size: 2rem;
  }
}

@media screen and (min-width: 350px) {
  h4 {
    font-size: 1.5625rem;
  }
}
@media screen and (min-width: 550px) {
  h4 {
    font-size: 1.5625rem;
  }
}
@media screen and (min-width: 750px) {
  h4 {
    font-size: 1.75rem;
  }
}
@media screen and (min-width: 1050px) {
  h4 {
    font-size: 1.875rem;
  }
}
@media screen and (min-width: 1250px) {
  h4 {
    font-size: 1.875rem;
  }
}

@media screen and (min-width: 350px) {
  h5 {
    font-size: 1.125rem;
  }
}
@media screen and (min-width: 550px) {
  h5 {
    font-size: 1.125rem;
  }
}
@media screen and (min-width: 750px) {
  h5 {
    font-size: 1.25rem;
  }
}
@media screen and (min-width: 1050px) {
  h5 {
    font-size: 1.375rem;
  }
}
@media screen and (min-width: 1250px) {
  h5 {
    font-size: 1.375rem;
  }
}

@media screen and (min-width: 350px) {
  h6 {
    font-size: 1rem;
  }
}
@media screen and (min-width: 550px) {
  h6 {
    font-size: 1rem;
  }
}
@media screen and (min-width: 750px) {
  h6 {
    font-size: 1.125rem;
  }
}
@media screen and (min-width: 1050px) {
  h6 {
    font-size: 1.25rem;
  }
}
@media screen and (min-width: 1250px) {
  h6 {
    font-size: 1.25rem;
  }
}

.home .banner h1 {
  font-size: calc(2.25rem + (1vw - 3.5px) * 0.8485);
}
@media (min-width: 2000px) {
  .home .banner h1 {
    font-size: 50px;
  }
}

label,
body,
p,
a {
  font-family: "Jost", "sans-serif";
  font-size: 16px;
  color: hsl(0, 0%, 0%);
}

p span {
  font-family: "Jost", "sans-serif" !important;
}

.p--small {
  font-size: 16px;
}

.p--medium {
  font-size: 18px;
}

.review-text {
  font-family: "Noto Serif Display", "sans-serif";
}
@media screen and (min-width: 350px) {
  .review-text {
    font-size: 1.75rem;
  }
}
@media screen and (min-width: 550px) {
  .review-text {
    font-size: 1.75rem;
  }
}
@media screen and (min-width: 750px) {
  .review-text {
    font-size: 1.875rem;
  }
}
@media screen and (min-width: 1050px) {
  .review-text {
    font-size: 2rem;
  }
}
@media screen and (min-width: 1250px) {
  .review-text {
    font-size: 2rem;
  }
}

a:visited,
a:hover,
a:focus {
  color: black;
}

img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: hsl(0, 0%, 0%);
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}

.grid-container {
  width: 100%;
  max-width: 90%;
  margin: 0 auto;
  padding: 0;
}
.grid-container.fluid {
  max-width: 100%;
}

.grid-x {
  width: 90%;
  max-width: 1500px;
  margin-left: auto;
  margin-right: auto;
}
.grid-x.full {
  width: 100%;
  max-width: 100%;
}

.content {
  padding: 8vh 0;
}

.content-home {
  padding: 0;
}

#content-block-1 {
  padding: 50px 0;
}

#testimonial-block {
  background: #380435;
  padding: 75px;
  text-align: center;
}
#testimonial-block p {
  color: hsl(0, 0%, 100%);
}

#wpadminbar {
  position: fixed;
  z-index: 10;
}

#full-width-image-section {
  display: block;
  min-height: 50vh;
  background-position: center;
  background-size: cover;
}

.img-zoom {
  position: relative;
  margin: auto;
  overflow: hidden;
  width: 100%;
  cursor: pointer;
}
.img-zoom img {
  max-width: 100%;
  display: block;
  width: 100%;
  transform: scale(1);
  transition: 0.5s ease;
  -o-object-fit: cover;
     object-fit: cover;
}

.img-zoom:hover img {
  transform: scale(1.1);
}

body {
  overflow-x: hidden;
}

[data-aos=clip-reveal] {
  -webkit-clip-path: inset(0 100% 0 0);
  clip-path: inset(0 100% 0 0);
  transition: 1s cubic-bezier(0.66, -0.01, 0.21, 0.97) !important;
}
[data-aos=clip-reveal].aos-animate {
  -webkit-clip-path: inset(0);
  clip-path: inset(0);
}

.error404 [data-aos^=fade][data-aos^=fade] {
  opacity: 1;
}
.error404 [data-aos=fade-down] {
  transform: translate3d(0, 0px, 0);
}
.error404 .header__logo img {
  filter: brightness(0) !important;
}
.error404 .header__navList li a {
  color: hsl(0, 0%, 0%) !important;
}
.error404 .header__hamburgerMenu span {
  background-color: hsl(0, 0%, 0%) !important;
}
.error404 .content-404 .grid-x {
  margin-top: 10em;
}
@media (min-width: 750px) {
  .error404 .content-404 .grid-x {
    margin-top: 10em;
  }
}
@media (min-width: 1050px) {
  .error404 .content-404 .grid-x {
    margin-top: 15em;
  }
}
@media (min-width: 1250px) {
  .error404 .content-404 .grid-x {
    margin-top: 15em;
  }
}
.error404 .content-404 a {
  padding: 15px 45px;
  background: transparent;
  color: #59c3c7;
  border: 1px solid #59c3c7;
  display: block;
  width: 100%;
  margin-bottom: 1em;
}
.error404 .content-404 a:hover {
  color: #59c3c7;
}
@media (min-width: 750px) {
  .error404 .content-404 a {
    width: -moz-fit-content;
    width: fit-content;
    display: inline-block;
  }
}
.error404 header .header__left ul li:hover .sub-menu {
  border-bottom: 1px solid hsla(0, 0%, 50%, 0.11);
}

body:has(.is-open) {
  height: 100vh;
  overflow-y: hidden;
}

.icon {
  width: 16px;
  height: 16px !important;
  -o-object-fit: contain;
     object-fit: contain;
}

.subtitle {
  text-transform: uppercase;
  font-size: 0.975rem;
}
@media (min-width: 750px) {
  .subtitle {
    font-size: 1.125rem;
  }
}

.mobile-position {
  text-align: center;
}
@media (min-width: 750px) {
  .mobile-position {
    text-align: left;
  }
}

.white h1,
.white h2,
.white h3,
.white h4,
.white h5,
.white p,
.white a {
  color: #fff;
}

.signature {
  font-family: "Caveat", "cursive";
  font-size: 2.8125rem;
}

.detail-scrolldown {
  height: 80px;
  bottom: 30px;
  width: 50px;
  z-index: 2;
  text-align: center;
  cursor: pointer;
  margin: 10px auto;
}
.detail-scrolldown .scrolldown-line {
  display: inline-block;
  transition: all 1500ms cubic-bezier(0.77, 0, 0.175, 1);
  width: 1px;
  height: 61px;
  background-color: #000000;
  transform: scale(1, 0);
  transform-origin: top;
}
.detail-scrolldown .scroll_loop {
  animation: scrollLoop 4000ms cubic-bezier(0.77, 0, 0.175, 1) infinite;
  animation-delay: 1s;
}

@keyframes scrollLoop {
  0% {
    transform: scale(1, 0);
    transform-origin: top;
  }
  40% {
    transform: scale(1, 1);
    transform-origin: top;
  }
  41% {
    transform-origin: bottom;
    transform: scale(1, 1);
  }
  81% {
    transform: scale(1, 0);
    transform-origin: bottom;
  }
  82% {
    transform-origin: top;
    transform: scale(1, 0);
  }
}
.swiper-button-prev:after,
.swiper-button-next:after {
  content: none !important;
}
.swiper-button-prev svg,
.swiper-button-next svg {
  width: 18px;
  height: 18px;
  -o-object-fit: contain;
     object-fit: contain;
}

.swiper-button-prev {
  left: 100px;
}

.swiper-button-next {
  right: 100px;
}

.book-now {
  position: fixed;
  z-index: 9999;
  right: -61px;
  transform: rotate(90deg);
  top: 80%;
}
.book-now a {
  background-color: #380435;
  border: none;
  color: #fff;
  text-transform: uppercase;
  padding: 15px 45px;
}
.book-now a:hover {
  background: darken #380435, 20%;
}

.img-size {
  padding-top: 56.6%;
  position: relative;
  overflow: hidden;
}
.img-size:after {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.img-size img {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: 0.5s ease;
  left: 0;
}

.property-banner {
  margin: 0;
}
.property-banner__container {
  padding: 1em;
  position: relative;
}
.property-banner__container:first-of-type {
  display: none;
}
@media (min-width: 750px) {
  .property-banner__container:first-of-type {
    display: inline-block;
  }
}
.property-banner__container:first-of-type .property-banner__container--btn {
  display: none;
}
@media (min-width: 750px) {
  .property-banner__container {
    padding: 0 3.5em;
  }
  .property-banner__container:first-of-type {
    padding-right: 1em;
  }
  .property-banner__container:last-of-type {
    padding-left: 1em;
  }
}
.property-banner__container img {
  height: 45vh;
}
@media (min-width: 1050px) {
  .property-banner__container img {
    height: 65vh;
  }
}
@media (min-width: 1250px) {
  .property-banner__container img {
    height: 80vh;
  }
}
.property-banner__container--btn {
  position: absolute;
  top: 50%;
  right: 5%;
  left: 5%;
  padding: 1em;
  text-align: center;
  transform: translateY(-50%);
}
@media (min-width: 750px) {
  .property-banner__container--btn {
    top: auto;
    bottom: 5%;
    right: 5%;
    left: auto;
    padding-right: 3.5em;
    transform: translateY(0);
  }
}
.property-banner__container--btn a:hover {
  border-color: #fff;
  color: #fff;
}

.menu-tabs {
  margin: 2em 0;
  border-bottom: 1px solid rgba(128, 128, 128, 0.301);
  padding-bottom: 1.5em;
}
.menu-tabs__container ul {
  margin: 0;
  list-style: none;
}
.menu-tabs__container ul li {
  list-style: none;
  display: inline-block;
  padding: 5px 15px;
}
.menu-tabs__container ul li a {
  text-transform: uppercase;
  position: relative;
}
.menu-tabs__container ul li a::after {
  content: "";
  position: absolute;
  display: block;
  left: auto;
  right: 0;
  bottom: -4px;
  width: 0%;
  height: 1px;
  transition: 0.25s ease-in-out all;
}
.menu-tabs__container ul li a:hover::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  left: 0;
  right: auto;
  background-color: #58c4c6;
}

@media (min-width: 750px) {
  .property-info__text {
    padding-right: 20px;
  }
}
.property-info__text--icons .subtitle {
  display: inline-block;
  margin: 15px 0;
}
.property-info__text--icons .subtitle:first-of-type {
  border-right: 1px solid black;
  padding-right: 10px;
}
.property-info__text--icons .subtitle:last-of-type {
  padding-left: 10px;
}
.property-info__text--icons .icons {
  margin-bottom: 1.5em;
}
.property-info__text--icons .icons__container {
  display: inline-block;
  padding: 0 10px;
}
.property-info__text--icons .icons__container:first-child {
  padding-left: 0;
}
.property-info__text--icons .icons__container svg {
  height: 20px;
  width: 20px;
  -o-object-fit: contain;
     object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}
.property-info__text--icons .icons__container p {
  display: inline-block;
  margin: 0;
  vertical-align: top;
}
.property-info__text--left {
  margin-top: 1em;
}
@media (min-width: 750px) {
  .property-info__text--left {
    margin-top: 2.5em;
  }
}
.property-info__text--left button {
  color: #000;
  text-transform: uppercase;
  display: inline-block;
  text-decoration: underline;
  border: none;
  cursor: pointer;
}
.property-info__text--left button:focus, .property-info__text--left button:hover, .property-info__text--left button:visited {
  color: black;
}
.property-info__text .accordion {
  margin: 0;
  margin-top: 2em;
}
.property-info__text .accordion li:first-of-type .accordion-content {
  display: flex;
  flex-flow: row wrap;
}
.property-info__text .accordion li:first-of-type .accordion-content p {
  width: 50%;
}
@media (min-width: 750px) {
  .property-info__text .accordion li:first-of-type .accordion-content p {
    width: 50%;
  }
}
@media (min-width: 1250px) {
  .property-info__text .accordion li:first-of-type .accordion-content p {
    width: 30%;
  }
}
.property-info__text .accordion .accordion-content {
  border: none;
}
.property-info__text .accordion .accordion-content p,
.property-info__text .accordion .accordion-content div,
.property-info__text .accordion .accordion-content li {
  font-size: 14px;
  font-weight: 500;
}
.property-info__text .accordion ul {
  margin: 0;
  margin-top: 1em;
}
.property-info__text .accordion li.accordion-item {
  list-style: none;
  padding-bottom: 10px;
  margin-bottom: 25px;
  border-bottom: 1px solid #59c3c7;
}
.property-info__text .accordion li.accordion-item a.accordion-title {
  font-size: 18px;
  text-transform: uppercase;
  color: black;
  border-left: none;
  border-right: none;
  position: relative;
  display: block;
  width: 100%;
  border: none;
}
.property-info__text .accordion li.accordion-item a.accordion-title:before {
  content: none;
}
.property-info__text .accordion li.accordion-item a.accordion-title:after {
  content: "";
  background-image: url(.././fonts/angle-up-thin.svg);
  padding: 10px;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  position: absolute;
  background-size: 16px 16px;
  background-repeat: no-repeat;
  transform: rotate(-180deg);
}
.property-info__text .accordion li.accordion-item .accordion-content {
  font-size: 25px;
}
.property-info__text .accordion li.accordion-item .accordion-content a {
  text-transform: none;
}
.property-info__text .accordion li.accordion-item .accordion-content p {
  display: inline-block;
  padding-right: 10px;
}
.property-info__text .accordion li.accordion-item .accordion-content p i {
  font-size: 18px;
  color: #58c4c6;
  padding-right: 10px;
}
.property-info__text .accordion li.accordion-item.is-active a.accordion-title:after {
  content: "";
  transform: rotate(0deg);
  transition: 0.2s;
}
.property-info__text .accordion li.accordion-item.is-active .accordion-content {
  border: none;
}
.property-info__text .accordion li.accordion-item.is-active .accordion-content a {
  text-transform: none;
}
@media (min-width: 750px) {
  .property-info__calendar {
    padding-right: 20px;
  }
}
.property-info__calendar .calendar-container__wrapper {
  box-shadow: 0px 10px 15px -3px #380435 0, 0, 0, 0.1;
  padding: 1.5rem;
}
.property-info__calendar .calendar-container h2 {
  margin-bottom: 1.5rem;
}
.property-info__calendar .calendar-container .calendar-key {
  margin-bottom: 1.5rem;
}
.property-info__calendar .calendar-container .calendar-key .calendar-key__color--selected {
  width: 10px;
  height: 10px;
  display: inline-block;
  background: #380435;
  border-radius: 180px;
}
.property-info__calendar .calendar-container .calendar-key .calendar-key__item {
  padding: 0 0.5rem;
}
.property-info__calendar .calendar-container .calendar-key .calendar-key__item .calendar-key__color--unavailable {
  background: #ededed;
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 180px;
}
.property-info__calendar .calendar-container .calendar-key .calendar-key__item .calendar-key__color--available {
  background: transparent;
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 180px;
  border: 1.5px solid #380435;
}
.property-info__calendar .calendar-container .month-selector span {
  border: none;
}
.property-info__calendar .calendar-container .month-selector__select {
  font-size: 1rem;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  padding: 0.5rem 1.5rem;
  outline: none;
}
.property-info__calendar .calendar-container .calendar {
  border: none;
}
.property-info__calendar .calendar-container .calendar__header {
  font-weight: 600;
  color: #380435;
}
.property-info__calendar .calendar-container .calendar__day {
  font-weight: 600;
  background: #ededed;
}
.property-info__calendar .calendar-container .calendar__day--not-booked {
  background: #fff;
}
.property-info__calendar .calendar-container .calendar__day--selectable {
  background: #fff;
  color: #380435;
}
.property-info__calendar .calendar-container .calendar__day--selectable span {
  border: 1px solid #380435 !important;
  border-radius: 180px;
}
.property-info__calendar .calendar-container .calendar__day--selectable:hover {
  cursor: pointer;
}
.property-info__calendar .calendar-container .calendar__day--selectable:hover span {
  border-radius: 180px;
}
.property-info__calendar .calendar-container .calendar__day--selectable .calendar__day-number {
  border: none;
}
.property-info__calendar .calendar-container .calendar__day--selected span {
  background: #680762;
  color: #000;
  border-radius: 180px;
}
.property-info__calendar .calendar-container .calendar__day--rangeSelect {
  background: transparent;
}
.property-info__calendar .calendar-container .calendar__day--rangeSelect span {
  background: #680762;
  color: #fff;
  border-radius: 180px;
}
.property-info__calendar .calendar-container .calendar__day--selectedEnds {
  background: transparent;
}
.property-info__calendar .calendar-container .calendar__day--selectedEnds span {
  background: #680762;
  color: #ffffff;
  border-radius: 180px;
}
.property-info__calendar .calendar-container .reset-dates {
  width: 100%;
  display: block;
  color: #380435;
  border: 1px solid #380435;
  padding: 0.8rem 2.5rem;
  font-size: 1.1rem;
  letter-spacing: 0.125rem;
  max-width: -moz-fit-content;
  max-width: fit-content;
  display: block;
  margin: 0 auto;
  transition: background 0.2s ease-in-out;
}
.property-info__calendar .calendar-container .reset-dates:hover {
  background: #380435;
  color: #fff;
}
.property-info__calendar .calendar-container .calendar-price-display__book,
.property-info__calendar .calendar-container .calendar-price-enquiry {
  padding: 1rem 1.5rem;
  font-size: 0.975rem;
  font-weight: 300;
  text-transform: uppercase;
  width: 100%;
  line-height: 1;
  margin-top: 0.5rem;
}
@media (min-width: 750px) {
  .property-info__calendar .calendar-container .calendar-price-display__book,
  .property-info__calendar .calendar-container .calendar-price-enquiry {
    display: inline-block;
  }
}
.property-info__calendar .calendar-container .calendar-price-display__book {
  background: #380435;
  border-radius: 0;
}
.property-info__calendar .calendar-container .calendar-price-display__book:hover {
  background: #680762 !important;
  color: white;
}
.property-info .calendar__day-range--hover span {
  background: #680762;
  color: #ffffff;
  border-radius: 180px;
}
.property-info .night-selector {
  height: 50px;
  padding-left: 10px;
  outline: none;
}
.property-info .calendar-price-display a {
  border-radius: 0;
  background: #380435;
}

.read-more-content,
.read-more {
  display: none;
  margin-top: 1rem;
}
.read-more-content.expanded .read-more,
.read-more.expanded .read-more {
  display: block;
}

.property-map {
  position: static !important;
}

/* Pop up gallery */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}
.mfp-wrap .mfp-container {
  text-align: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 30%;
  padding: 0 8px;
  box-sizing: border-box;
}
@media (min-width: 550px) {
  .mfp-wrap .mfp-container {
    top: 0;
  }
}
.mfp-wrap .mfp-container:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.mfp-wrap .mfp-container .mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}
.mfp-wrap .mfp-container .mfp-content .mfp-figure {
  cursor: pointer;
}
.mfp-wrap .mfp-container .mfp-content .mfp-figure .mfp-close {
  overflow: visible;
  cursor: zoom-out;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation;
  color: #fff;
  right: 10px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
  top: 50px;
  position: absolute;
  font-size: 25px;
}
.mfp-wrap .mfp-container .mfp-content .mfp-figure img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}
.mfp-wrap .mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  z-index: 9999;
}
.mfp-wrap .mfp-arrow-left {
  left: 5%;
}
.mfp-wrap .mfp-arrow-right {
  right: 5%;
}
.mfp-wrap .mfp-arrow-left:before {
  content: "\f053";
  font-family: "Font Awesome 6 Pro";
  color: #fff;
  font-size: 22px;
}
.mfp-wrap .mfp-arrow-right:before {
  content: "\f054";
  font-family: "Font Awesome 6 Pro";
  color: #fff;
  font-size: 22px;
}
.mfp-wrap .mfp-counter {
  color: #fff;
  text-align: center;
}

.map {
  margin: 0;
}
.map__responsive {
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
}
@media (min-width: 1250px) {
  .map__responsive {
    padding-bottom: 40%;
  }
}
.map__responsive iframe {
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  position: absolute;
}
.map__text {
  padding: 2em 2em 3em 2em;
}
@media (min-width: 1050px) {
  .map__text {
    padding: 0 10%;
  }
}
@media (min-width: 1050px) {
  .map__text p:last-of-type {
    margin: 2em 0;
  }
}

.gallery {
  margin: 0;
  padding: 3em 0;
  background: #f0ece3;
}
@media (min-width: 750px) {
  .gallery {
    padding: 5em 0;
  }
}
@media (min-width: 1050px) {
  .gallery {
    padding: 6em 0;
  }
}
.gallery .grid-x {
  position: relative;
}
.gallery__title {
  margin-bottom: 1.5em;
}
.gallery__btn {
  margin-top: 1.5em;
}
.gallery__slider--container a img {
  height: 30vh;
}
@media (min-width: 1250px) {
  .gallery__slider--container a img {
    height: 45vh;
  }
}
.gallery .swiper-button-prev,
.gallery .swiper-button-next {
  top: 49.5%;
  background: rgba(255, 255, 255, 0.5215686275);
}
@media (min-width: 500px) {
  .gallery .swiper-button-prev,
  .gallery .swiper-button-next {
    top: 48.5%;
  }
}
@media (min-width: 1050px) {
  .gallery .swiper-button-prev,
  .gallery .swiper-button-next {
    top: 47.5%;
  }
}
@media (min-width: 1250px) {
  .gallery .swiper-button-prev,
  .gallery .swiper-button-next {
    top: 50.5%;
  }
}
@media (min-width: 1450px) {
  .gallery .swiper-button-prev,
  .gallery .swiper-button-next {
    background: transparent;
  }
}
.gallery .featured-prev {
  left: 0%;
}
@media (min-width: 1450px) {
  .gallery .featured-prev {
    left: -3.5%;
  }
}
@media (min-width: 1650px) {
  .gallery .featured-prev {
    left: -5.5%;
  }
}
.gallery .featured-next {
  right: 0;
}
@media (min-width: 1450px) {
  .gallery .featured-next {
    right: -3.5%;
  }
}
@media (min-width: 1650px) {
  .gallery .featured-next {
    right: -5.5%;
  }
}