@import url(https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;1,100&display=swap);

  .logo-row-list li {
    margin-bottom: 2.5rem
  }
.logo-row-list li img {
      width: 240px
    }
@media (min-width: 768px){
    .logo-row-list li img {
        width: 350px
    }
      }
@media (min-width: 768px){
    .logo-row-list li+li {
        margin-left: 2rem;

        border-left: 2px solid #ababab
    }
      }
@media (min-width: 1024px){
    .logo-row-list li+li {
        margin-left: 3rem
    }
      }
@media (min-width: 1440px){
    .logo-row-list li+li {
        margin-left: 5rem
    }
      }


    .contact-card-area .contact-card-section:last-child {
      margin-bottom: 0;
    }

.contact-card-area .user-post {
    display: block;
    color: #757779;
    font-size: 0.66rem;
    letter-spacing: 0.7px;
    margin: .2rem 0 .3rem
  }

@media (min-width: 768px) {

.contact-card-area .user-post {
      margin: 0;

      font-size: 0.85rem;

      letter-spacing: 0.47px
  }
    }

@media (min-width: 1280px) {

.contact-card-area .user-post {
      font-size: 1rem
  }
    }

.contact-card-area .user-name {
    font-weight: 400;
    font-size: 1.5rem;
    color:#000
  }

.contact-card-area .user-name+.tel-field {
      margin-top: 0.5rem;
    }

@media (min-width: 768px) {

.contact-card-area .user-name {
      font-size: 1.75rem
  }
    }

@media (min-width: 1024px) {

.contact-card-area .user-name {
      font-size: 2rem
  }
    }

.contact-card-area .tel-field {
    color: #1a232f;
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 1px;
    white-space: nowrap
  }

@media (min-width: 1440px) {

.contact-card-area .tel-field {
      font-size: 1.25rem
  }
    }

.contact-card-area .img-wrap img {
      position: relative;
      z-index: 10;
      width: 100%;
      max-width: 212px;
      /*border:1px solid #d4d4d4;*/
    }

.contact-card-area .content-wrap {
    width: 85%;
    padding-left: 2.25rem;
    margin-left: -1.25rem
  }

@media (min-width: 768px){

.contact-card-area .content-wrap {
      padding-left: 3.25rem
  }
    }

@media (min-width: 1440px) {

.contact-card-area .content-wrap {
      min-height: 280px
  }
    }

.contact-card-area {
  /*&.small-cards {*/
}

@media (min-width: 1440px) {

.contact-card-area .user-name {
      font-size: 1.75rem;

      margin-bottom: .75rem
  }
    }

@media (min-width: 640px) {
      .contact-card-area .tel-list li {
        margin-top: 0.75rem;
        position: relative;
        display: inline-block;
        line-height: 1
      }
        .contact-card-area .tel-list li+li {
          margin-left: 0.625rem;
          padding-left: 0.625rem
        }
          .contact-card-area .tel-list li+li:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            border-left: 1px solid;
          }
    }

@media (min-width: 1024px) {
      .contact-card-area .tel-list li {
        display: block
      }
        .contact-card-area .tel-list li+li {
          margin-left: 0;
          padding-left: 0
        }
          .contact-card-area .tel-list li+li:before {
            display: none;
          }
    }

.contact-card-area .social-list{
    /*border-top: 1px solid #d4d4d4;*/
    margin-top: 1.25rem;
    margin-left: -2rem
  }

.contact-card-area .social-list li a svg{
          fill: #032347;
        }

.contact-card-area .contact-card-section {
    margin-bottom: 3.75rem
  }

.contact-card-area .contact-card-section:last-child {
      margin-bottom: 0;
    }

.contact-card-area .img-wrap {
    /*@screen xl {*/
    /*    max-width: 140px;*/
    /*}*/
  }

.contact-card-area .content-wrap {
    min-height: auto
  }

@media (min-width: 768px) {

.contact-card-area .content-wrap {
      padding-top: 1.5rem;

      padding-bottom: 1.5rem
  }
    }

@media (min-width: 1440px) {

.contact-card-area .content-wrap {
      padding-top: 1rem;

      padding-bottom: .75rem
  }
    }

.contact-card-area {
  /*}*/
}

@media (min-width: 1440px) {

.contact-us-section .container.container-fluid {
        max-width: 1440px
    }
      }

.form {
  width: 100%
}
@media (min-width: 1024px) {
  .form {
    width: 51.464%
}
  }
.form label {
    display: block;
    font-size: 1.25rem;
    display: block;
    font-size: 1rem;
    color: #1a1a1a;
    letter-spacing: 0.75px;
    padding-bottom: 0.5rem;
    font-weight: 500;
    padding-top: 0.5rem
  }
@media (min-width: 1440px) {
  .form label {
      font-size: 1.25rem;

      padding-bottom: 0.5rem
  }
    }
.form label.required-label:after {
        content: '*';
        padding-left: 4px;
      }
.form input,
    .form textarea {
    width: 100%;
    border-width: 1px;
    --border-opacity: 1;
    border-color: #b7b7b7;
    border-color: rgba(183, 183, 183, var(--border-opacity));
    font-size: 1.25rem;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    margin-bottom: 1rem;
    letter-spacing: 0.6px;
    transition: border-color .3s ease;
    font-size: 1rem;
    padding: .6rem .75rem
  }
@media (min-width: 1024px) {
  .form input,
    .form textarea {
      padding-top: 0.5rem;

      padding-bottom: 0.5rem
  }
    }
@media (min-width: 1440px) {
  .form input,
    .form textarea {
      padding-top: 0.75rem;

      padding-bottom: 0.75rem;

      padding-left: 1.25rem;

      padding-right: 1.25rem;

      padding-left: .938rem;

      padding-right: .938rem;

      font-size: 1.125rem
  }
    }
.form input:focus,
        .form input:active,
        .form textarea:focus,
        .form textarea:active {
      outline: none;
      outline: 2px solid transparent;
      outline-offset: 2px;
      --border-opacity: 1;
      border-color: #002349;
      border-color: rgba(0, 35, 73, var(--border-opacity));
      transition: border-color .3s ease;
    }
@media (min-width: 1440px) {
  .form textarea {
      padding-bottom: .4rem
  }
    }
.form .button {
    /*font-size: 24px;*/
    font-size: 16px;
    font-weight: 600;
    padding: 1.4rem 3rem;
    margin-top: .5rem;
    letter-spacing: 0.6px;
    background-color: #132335
  }
@media (min-width: 1024px) {
  .form .button {
      margin-top: 0.25rem;

      padding: .65rem 1.45rem;

      font-size: 	0.6875rem
  }
    }
@media (min-width: 1440px) {
  .form .button {
      padding: 1rem 2.29rem;

      font-size: 1rem
  }
    }
@media (min-width: 1024px) {
  .form .form-field-group .form-field {
        width: 50%
    }
      }
.form .video-chat-option label.video-left-label {
      font-size: 1rem;
      font-weight: 400;
      letter-spacing: 0px;
      color: #4d4d4f
    }
@media (min-width: 1280px) {
  .form .video-chat-option label.video-left-label {
        font-size: 1.1rem
    }
      }
.form .video-chat-option .video-right-labels {
      align-items: center;
      position: relative;
      color: #4d4d4f;
      top: 2px
    }
.form .video-chat-option .video-right-labels label {
        font-size: 0.9rem;
        font-weight: 400;
        padding-right: .6rem
      }
.form .video-chat-option .video-right-labels label.yes-value {
          padding-left: .6rem;
          margin-left: 10px;
        }
.form .video-chat-option .video-right-labels label.toggle-switch {
          margin-bottom: 3px
        }
.form .video-chat-option .video-right-labels label.toggle-switch ._3QxTi{
            background-color:#143c65!important;
            transition: background-color .2s;
            height: 12px;
            margin-top: 5px;
            width:50px
          }
.form .video-chat-option .video-right-labels label.toggle-switch ._3QxTi._3YMB2{
              background-color: rgb(102, 187, 106)!important;
            }
.form .video-chat-option .video-right-labels label.toggle-switch ._ju7HT{
            width:24px;
            height:24px;
            bottom: -3px;
            border:2px solid #143c65
          }
.form .video-chat-option .video-right-labels label.toggle-switch ._ju7HT._3YMB2{
              border:2px solid #66bb6a;
            }
.form .video-chat-option .video-right-labels label.toggle-switch input {
            display: none;
          }
@media (min-width: 1280px) {
  .form .video-chat-option .video-right-labels label {
          font-size: 1rem
      }
        }

._2-ZbH {
  display: inline-block;
  height: 20px;
  position: relative;
  width: 40px;
  margin-bottom: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

._3QxTi {
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  position: absolute;
  transition: background-color .2s;
  border-radius: 34px;
}

._3maKS {
  width: 0;
  height: 0;
  overflow: hidden;
}

._ju7HT {
  bottom: 2px;
  height: 16px;
  left: 2px;
  position: absolute;
  width: 16px;
  border-radius: 50%;
  transform: translateX(0);
  outline: none;
}

._ju7HT._3YMB2 {
  transform: translateX(20px);
}




  .contact-us-section .section-title {
    padding-top: 3rem;
    padding-bottom: 1.75rem;
    font-style:normal
  }
@media (min-width: 1024px){
    .contact-us-section .section-title {
      padding-top: 4rem;

      margin-bottom: 4rem;

      text-align: center;

      margin-bottom: 4.3rem
  }
    }
.contact-us-section .contact-card-area {
    width: 100%
  }
@media (min-width: 1024px){
    .contact-us-section .contact-card-area {
      width: 48.536%;

      padding-right: 2.5rem
  }
    }
@media (min-width: 1440px){
    .contact-us-section .contact-card-area {
      padding-right: 5.75rem
  }
    }
@media (min-width: 1024px){
    .contact-us-section .request-form {
      padding-left: 2.5rem
  }
    }
@media (min-width: 1440px){
    .contact-us-section .request-form {
      padding-left: 5.75rem
  }
    }

.nav-bar {
  display: none;
  margin-top: 1.5rem
}

@media (min-width: 1024px){

  .nav-bar {
    padding-top: 4px
}
  }

@media (min-width: 1280px){

  .nav-bar {
    display: block
}
  }

.nav-bar li {
    display: inline-block;
    padding-left: 1rem;
    padding-right: 1rem
  }

.nav-bar li:last-child {
      padding-right: 0;
    }

.nav-bar li:first-child {
      padding-left: 0;
    }

@media (min-width: 1024px) {

  .nav-bar li {
      padding-left: 1.5rem;

      padding-right: 1.5rem
  }

      .nav-bar li:last-child {
        padding-right: 0;
      }

      .nav-bar li:first-child {
        padding-left: 0;
      }
    }

.nav-bar a {
    display: inline-block;
    font-family: Proxima Nova, proxima-nova, sans-serif;
    text-align: center;
    --text-opacity: 1;
    color: #221f20;
    color: rgba(34, 31, 32, var(--text-opacity));
    font-weight: 500;
    text-transform: uppercase;
    padding-bottom: 1.5rem;
    letter-spacing: 0.9px;
    font-size:1rem;
    font-weight: 400
  }

.nav-bar a.active {
      border-bottom: 5px solid #fff;
      position: relative;
      background:transparent;
      /*&:after{*/
      /*     position: absolute;*/
      /*     content: ' ';*/
      /*     top: -47px;*/
      /*     bottom: 0;*/
      /*     left: -1rem;*/
      /*     right: -1rem;*/
      /*     background: #ededed;*/
      /*     min-height: 120px;*/
      /*     z-index: -1;*/
      /*     border-bottom: 1px solid lightgrey;*/
      /* }*/
    }

.nav-bar a.nav-link{
      color:#000;
    }

.header {
  position: fixed;
  --text-opacity: 1;
  color: #002349;
  color: rgba(0, 35, 73, var(--text-opacity));
  background-color: transparent;
  /*box-shadow: 0 0 10px rgba(24, 25, 26, 0.2);*/
  border-bottom: 1px solid lightgrey;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 1000
}

.header .holder {
    position: relative;
    margin-top: 1.25rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    height: 40px
  }

@media (min-width: 768px) {

.header .holder {
      height: 80px
  }
    }

@media (min-width: 1024px) {

.header .holder {
      height: 100px
  }
    }

@media (min-width: 1024px) {

.header .holder {
      padding-left: 2.5rem;

      padding-right: 2.5rem
  }
    }

.header .holder .holder-jr {
      height: 40px
    }

@media (min-width: 768px) {

.header .holder .holder-jr {
        height: 80px
    }
      }

.header .holder .nav-bar {
      /*padding-right: 7rem;*/
      padding-right: 0;
      height: 56px
    }

@media (min-width: 1024px) {

.header .holder .nav-bar {
        padding-right: 7rem
    }
      }

@media (min-width: 1280px) {

.header .holder .nav-bar {
        padding-right: 2.25rem
    }
      }

.header .holder .nav-bar a {
        line-height: 2.75;
        color:#fff!important
        /*@apply text-blue-600;*/
      }

.header .holder .nav-bar a.active {
          /*@apply border-blue-600;*/
        }

@media (min-width: 1024px) {

.header .holder {
      /*&:after {*/

      /*    @apply absolute left-0 w-full bg-white;*/

      /*    height: 1px;*/

      /*    bottom: 2px;*/

      /*    content: '';*/

      /*    z-index: -1;*/

      /*}*/
  }
    }

.inside-white-header .headroom.headroom--unfixed .header{
        background:transparent
      }

.inside-white-header .headroom.headroom--unfixed .header .holder .badge-img{
            filter: none!important;
          }

.inside-white-header .headroom.headroom--unfixed .header .holder .nav-bar a{
              color: #000!important
            }

.inside-white-header .headroom.headroom--unfixed .header .holder .nav-bar a.active{
                border-color: #002349;
              }

.inside-white-header .headroom.headroom--pinned .header{
        background:#fff
      }

.inside-white-header .headroom.headroom--pinned .header .holder .badge-img{
            filter: none;
          }

.headroom.headroom--unfixed {
    position: absolute !important;
    z-index: 1000 !important
  }

.headroom.headroom--unfixed .header{
      background:transparent
    }

.headroom.headroom--unfixed .header .holder .badge-img{
          filter: brightness(0) invert(1);
        }

.headroom.headroom--pinned {
    z-index: 1000 !important
  }

.headroom.headroom--pinned .header{
      background:#fff;
    }

.headroom.headroom--pinned .brand-title strong {
        --text-opacity: 1;
        color: #002349;
        color: rgba(0, 35, 73, var(--text-opacity));
      }

.headroom.headroom--unpinned {
    z-index: 10000 !important
  }

.headroom.headroom--unpinned .header{
      background:#fff;
    }

.headroom.headroom--unpinned .brand-title strong {
        --text-opacity: 1;
        color: #002349;
        color: rgba(0, 35, 73, var(--text-opacity));
      }

@media (min-width: 1024px) {
      .headroom.headroom--pinned .header {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity));
        position: fixed;
        --text-opacity: 1;
        color: #002349;
        color: rgba(0, 35, 73, var(--text-opacity));
        box-shadow: 0 0 10px rgba(24, 25, 26, 0.2)
      }
          .headroom.headroom--pinned .header .nav-bar a {
            color:#000!important
          }
            .headroom.headroom--pinned .header .nav-bar a.active {
              --border-opacity: 1;
              border-color: #002349;
              border-color: rgba(0, 35, 73, var(--border-opacity));
            }
      .headroom.headroom--unpinned .header {
        position: static;
      }
  }

@media (min-width: 1024px) {

.headroom--pretend-pinned {
    margin-top: 100px
}
  }

.headroom--pretend-pinned .headroom.headroom {
      z-index: 1000 !important
    }

.headroom--pretend-pinned .headroom.headroom .brand-title strong {
          --text-opacity: 1;
          color: #002349;
          color: rgba(0, 35, 73, var(--text-opacity));
        }

@media (min-width: 1024px) {
      .headroom--pretend-pinned .headroom .header {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity));
        position: fixed;
        --text-opacity: 1;
        color: #002349;
        color: rgba(0, 35, 73, var(--text-opacity));
        box-shadow: 0 0 10px rgba(24, 25, 26, 0.2)
      }
          .headroom--pretend-pinned .headroom .header .nav-bar a {
            --text-opacity: 1;
            color: #002349;
            color: rgba(0, 35, 73, var(--text-opacity))
          }
            .headroom--pretend-pinned .headroom .header .nav-bar a.active {
              --border-opacity: 1;
              border-color: #002349;
              border-color: rgba(0, 35, 73, var(--border-opacity));
            }
    }

/* I don't know where to put thissssss - MK */

.matterport-aspect-ratio {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%
}

.matterport-aspect-ratio iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0; top: 0;
  }

@media (min-width: 1024px) {
  .neutralize-pt24 .md\:pt-24 {
    padding-top: 0;
  }
}

.tourNotice {
  padding: 1.75rem 0;
  text-align: center
}

.tourNotice div {
    font-size: 1.0rem;
    display: inline-block
  }

@media (min-width: 1024px) {

.tourNotice div {
      font-size: 1.3rem;

      background: url('/images/vr.svg') left center no-repeat;

      background-size: contain;

      padding-left: 2.67rem
  }
    }

.headroom.headroom--pinned .header[data="holidayhomes"] {
  background-color: #003a69;
  border-bottom: 1px solid transparent
}

.headroom.headroom--pinned .header[data="holidayhomes"] .nav-bar a{
      color: #fff!important;
    }

.headroom.headroom--unfixed .header[data="seaglass"] .holder .badge-img{
      filter:none;
    }

.headroom.headroom--unfixed .header[data="islandia"] {
  background-color: #fff
}

.headroom.headroom--unfixed .header[data="islandia"] .holder .badge-img{
      filter:none;
    }

.headroom.headroom--unfixed .header[data="islandia"] .nav-bar a{
      color: #003a69!important;
    }

/*site specific styles header*/

.site-hh .headroom .header{
      border-bottom: 1px solid transparent
    }

@media (min-width: 1024px) {

.site-hh .headroom .header .nav-bar a.active {
              border-color: rgba(255, 255, 255, 1)
          }
            }

@media (min-width: 1024px) {

.site-hh .headroom.headroom--unfixed .header {
          background: #003a69
      }
        }

.site-hh .headroom.headroom--unpinned {
      z-index: 10000 !important
    }

.site-hh .headroom.headroom--unpinned .header{
        background:#003a69
      }

.site-hh .headroom.headroom--unpinned .header .toggle-btn span{
            background: #fff;
          }

.site-hh .headroom.headroom--pinned .toggle-btn span{
          background: #fff;
        }

/*title color: #11365e;*/

@media (min-width: 1024px) {

.site-islandia .headroom.headroom--unfixed .header {
          /*background: #003a69;*/
      }
        }

.site-islandia .headroom.headroom--unfixed .header .toggle-btn span{
            background: #1c4b71;
          }

.site-islandia .headroom.headroom--unpinned .header .nav-bar a{
            color: #1c4b71;
          }

.site-islandia .headroom.headroom--unpinned .header .toggle-btn span{
            background: #1c4b71;
          }

@media screen and (max-width: 400px) {
  .headroom.headroom--unfixed .header[data="islandia"] .holder .badge-img {
    max-height: 25px;
  }
}

@media screen and (max-width: 350px) {
  .headroom.headroom--unfixed .header[data="islandia"] .holder .badge-img {
    max-height: 20px;
  }
}

.site-sgp .headroom.headroom--pinned .holder a span,.site-sgp .headroom.headroom--unpinned .holder a span{
            background-size: 200px 31px;
            width: 200px;
            height: 31px;
            top: -5px;
            /*  max-width: 346px;*/
            /*  position: absolute;*/
            /*  top: -5px;*/
            /*left: 2%;*/
            background-image:url('/images/seaglass-logo-blue.svg');
            background-repeat: no-repeat;
            position: absolute
          }

@media (min-width: 640px) {

.site-sgp .headroom.headroom--pinned .holder a span,.site-sgp .headroom.headroom--unpinned .holder a span{
              background-size: 200px 31px;

              width: 200px;

              height: 31px;

              top: -5px;

              left: 2%
          }
            }

@media (min-width: 768px) {

.site-sgp .headroom.headroom--pinned .holder a span,.site-sgp .headroom.headroom--unpinned .holder a span{
              background-size: 281px 44px;

              width: 281px;

              height: 44px;

              top: 8px;

              left: 2%
          }
            }

@media (min-width: 1024px) {

.site-sgp .headroom.headroom--pinned .holder a span,.site-sgp .headroom.headroom--unpinned .holder a span{
              background-size: 333px 52px;

              width:333px;

              height:52px;

              top: 20px
          }
            }

@media (min-width: 1280px) {

.site-sgp .headroom.headroom--pinned .holder a span,.site-sgp .headroom.headroom--unpinned .holder a span{
              background-size: 346px 54px ;

              width:346px;

              height:54px;

              top: 10%
          }
            }

.site-sgp .headroom.headroom--pinned .holder a span,.site-sgp .headroom.headroom--unpinned .holder a span{
            /* background-size: 346px 54px ;*/
            /* width:346px;*/
            /* height:54px;*/
            /*max-width: 346px;*/
            /*position: absolute;*/
            /*  top: 10%;*/
            /*transform: translateX(-50%);*/
          }

.site-sgp .headroom.headroom--pinned .menu-area .badge-img,.site-sgp .headroom.headroom--unpinned .menu-area .badge-img{
          display: block;
        }

.site-sgp .headroom.headroom--pinned .badge-img,.site-sgp .headroom.headroom--unpinned .badge-img{
        display: none;
        /*&:before{*/
        /*    position: absolute;*/
        /*    content:'';*/
        /*    background-image:url('/images/Seaglass-logo-SLW.svg');*/
        /*    background-size: 346px 54px;*/
        /*    width:346px;*/
        /*    height:54px;*/
        /* }*/
      }

@media (max-width: 1024px) {
  .hh-gallery .site-hh .headroom.headroom--unfixed .header {
    background: #003a69;
  }
}

@media (min-width: 1280px) {

.header .holder .holder-jr .badge-img{
          height: 60px;

          max-height: 3.75rem
      }
        }
.toggle-btn {
  width: 50px;
  height: 36px;
  position: fixed;
  margin-top: .4rem;
  transform: rotate(0deg);
  transition: .5s ease-in-out;
  cursor: pointer;
  z-index: 10;
  top: 0.5rem;
  right: 0.9rem;
  transform: scale(0.75)
}

@media (min-width: 640px) {

.toggle-btn {
    /*display: inline-block;*/

    zoom: 1

    /*top: 1.875rem;*/

    /*right: 2.5rem;*/
}
  }

@media (min-width: 768px) {

.toggle-btn {
    display: inline-block;

    top: 1.875rem;

    right: 2.5rem
}
  }

@media (min-width: 1024px) {

.toggle-btn {
    display: inline-block
}

    .toggle-btn.opener {
      position: absolute;
      top: 0.9375rem;
    }
  }

@media (min-width: 1280px) {

.toggle-btn {
    display:none
}
  }

.toggle-btn span {
    display: block;
    position: absolute;
    height: 6px;
    width: 100%;
    background: #fff;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out
  }

.toggle-btn span:nth-child(1) {
      top: 0;
    }

.toggle-btn span:nth-child(2) {
      top: 12px;
    }

.toggle-btn span:nth-child(3) {
      top: 24px;
    }

.toggle-btn:focus,
    .toggle-btn:active {
    outline: none;
  }

/*styles for the different brands*/

.site-hh .is-opened .toggle-btn {
      width: 35px;
      height: 35px
    }

.site-hh .is-opened .toggle-btn.closer span {
          --bg-opacity: 1;
          background-color: #fff;
          background-color: rgba(255, 255, 255, var(--bg-opacity));
          /*background-color: #332c20;*/
          height: 4px;
        }

.site-hh{
      .headroom--pinned .toggle-btn span, .headroom--unpinned .toggle-btn span {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity));
      }
        .headroom--pinned .toggle-btn.closer span, .headroom--unpinned .toggle-btn.closer span {
          --bg-opacity: 1;
          background-color: #fff;
          background-color: rgba(255, 255, 255, var(--bg-opacity));
          /*background-color: #332c20;*/
        }
}

.headroom--pinned .toggle-btn.closer span, .headroom--unpinned .toggle-btn.closer span {
  background-color: #332c20;
}

.is-opened .badge-img.mobile-menu{
      filter:none!important;
    }

.is-opened .toggle-btn {
    width: 35px;
    height: 35px
  }

.is-opened .toggle-btn.closer span {
        /*@apply bg-white;*/
        background-color: #332c20;
        height: 4px;
      }

.is-opened .toggle-btn span {
      margin-left: -15px;
      width: 125%
    }

@media (min-width: 768px) {

.is-opened .toggle-btn span {
        width: 150%
    }
      }

.is-opened .toggle-btn span:nth-child(1) {
        top: 12px;
        transform: rotate(135deg);
      }

.is-opened .toggle-btn span:nth-child(2) {
        opacity: 0;
        left: -60px;
      }

.is-opened .toggle-btn span:nth-child(3) {
        top: 12px;
        transform: rotate(-135deg);
      }

.headroom--pinned .toggle-btn span, .headroom--unpinned .toggle-btn span {
      background: #000;
      /*@apply bg-blue-600;*/
    }

.headroom--pinned .toggle-btn.closer span, .headroom--unpinned .toggle-btn.closer span {
        /*@apply bg-white;*/
        background-color: #332c20;
      }

.menu-area {
  position: fixed;
  width: 100%;
  left: 0;
  right: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
  background-color: #f7f1ed;
  /*background-color: rgba(0, 35, 73, 1);*/
  /*background-color: rgba(0, 0, 0, var(--bg-opacity));*/
  overflow: auto;
  transition: opacity linear 0.3s, visibility linear 0.3s;
  height: calc(100vh + 100px);
  z-index: 10000
}

.menu-area.is-opened {
    opacity: 1;
    visibility: visible;
  }

.menu-area .badge-img.mobile-menu{
      padding-top: 15%;
      max-height: none;
      width: 50%;
      margin: 0 auto;
      max-width: 21rem;
    }

/*Brand specific styles*/

.site-hh .menu-area {
    background-color: #003a69
  }

.site-hh .menu-area .menu-list li+  li{
          border-top: solid 1px rgba(255, 255, 255, 0.2);
        }

.site-hh .menu-area .menu-list .nav-link {
        color: #fff
      }

.site-hh .menu-area .menu-list .nav-link:hover, .site-hh .menu-area .menu-list .nav-link.active{
          /*color: #2654a1;*/
          color: #0084aa;
        }

.site-islandia{
  /*& .menu-area {*/
  /*      background-color: #003a69;*/
  /*    & .menu-list {*/
  /*        & li{*/
  /*            &+  li{*/
  /*                 border-top: solid 1px rgba(255, 255, 255, 0.2);*/
  /*             }*/
  /*        }*/
  /*        & .nav-link {*/
  /*              color: #1c4b71;*/
  /*        &:hover, &.active{*/
  /*                      color: #2654a1;*/
  /*              }*/
  /*        }*/
  /*    }*/
  /*}*/
}

.menu-list {
  --text-opacity: 1;
  color: #fff;
  color: rgba(255, 255, 255, var(--text-opacity));
  display: flex;
  flex-direction: column;
  align-items: center;
  text-transform: uppercase;
  /*width: 100%;*/
  width: 50%;
  max-width: 30rem;
  position: relative;
  left: 50%;
  padding-top: 5%;
  /*padding-top: 15%;*/
  font-size: 1.875rem;
  transform: translateX(-50%)
}

.menu-list li {
    font-family: Proxima Nova, proxima-nova, sans-serif;
    font-size: 1.5rem;
    text-transform: none;
    -webkit-animation-name: animate-left;
            animation-name: animate-left;
    -webkit-animation-duration: 0.5s;
            animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
    display: block;
    width: 100%;
    text-align: center
  }

.menu-list li+ li {
      /*border-top: solid 1px rgba(255, 255, 255, 0.2);*/
      border-top:solid 1px rgba(51, 44, 32, 0.2);
    }

.menu-list .nav-link {
    display: block;
    padding: 0.7rem 1rem;
    letter-spacing: 1px;
    color: #332c20
  }

.menu-list .nav-link:hover, .menu-list .nav-link.active{
      /*@apply text-yellow-100;*/
      color:#337bb6;
    }

@media (min-width: 1024px) {

.menu-list .nav-link {
      padding: 1.625rem 0.625rem
  }
    }

.menu-list.is-opened li {
      -webkit-animation-name: animate-right;
              animation-name: animate-right;
      -webkit-animation-duration: 0.5s;
              animation-duration: 0.5s;
      -webkit-animation-fill-mode: both;
              animation-fill-mode: both;
      -webkit-animation-timing-function: linear;
              animation-timing-function: linear;
    }

@-webkit-keyframes animate-left {
  0% {
    opacity: 0;
    transform: translateX(-40px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes animate-left {
  0% {
    opacity: 0;
    transform: translateX(-40px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@-webkit-keyframes animate-right {
  0% {
    opacity: 1;
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    transform: translateX(40px);
  }
}

@keyframes animate-right {
  0% {
    opacity: 1;
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    transform: translateX(40px);
  }
}

.hero-area {
  overflow: hidden
}

@media all and (max-width:767px) {

.hero-area.min-h-screen{
      /*min-height:calc(100vh - 124px);*/

      /*height:calc(100vh - 124px);*/

      min-height:435px;

      height:435px;

      margin-top: 0
  }
    }

@media all and (max-width:767px) {

.hero-area .wrap.min-h-screen{
        /*min-height:calc(100vh - 124px);*/

        min-height:435px
    }
      }

@media all and (max-width:767px) {

.hero-area .holder.min-h-screen{
        min-height:435px
    }
      }

.hero-area .scroll-link {
    font-size: 1.125rem;
    display: none;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2rem;
    z-index: 40
  }

.hero-area .scroll-link span {
      opacity: 0;
      -webkit-animation: fadeInUp .5s ease both;
              animation: fadeInUp .5s ease both;
      -webkit-animation-delay: 2.5s;
              animation-delay: 2.5s;
    }

@media (min-width: 768px) {

.hero-area .scroll-link {
      display: block
  }
    }

.hero-area.hero-bg-area .wrap:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: linear-gradient(to bottom,
                rgba(64, 64, 64, 0.64) 0%,
                rgba(64, 64, 64, 0.2) 25%,
                rgba(64, 64, 64, 0.2) 70%,
                rgba(64, 64, 64, 0.64) 100%);
        z-index: 30;
      }

.hero-area.hero-bg-area .holder {
      position: absolute;
      width: 100%;
      left: 0;
      top: 0;
      padding: 0;
      z-index: 40;
      background: rgba(0,0,0,.15)
    }

@media (min-width: 1024px) {

.hero-area.hero-bg-area .holder {
        padding: 20px 45px
    }
      }

@media (min-width: 1024px) {

.hero-area.hero-bg-area .holder {
        padding: 40px 65px
    }
      }

.hero-area.hero-bg-area .holder .headline {
        --text-opacity: 1;
        color: #fff;
        color: rgba(255, 255, 255, var(--text-opacity));
        opacity: 0;
        -webkit-animation: fadeInUp .5s ease both;
                animation: fadeInUp .5s ease both;
        -webkit-animation-delay: 2.3s;
                animation-delay: 2.3s;
        line-height: 1.2;
        letter-spacing: 1px;
        padding: 0.75rem 0;
        font-weight: 300;
        text-transform: uppercase
      }

@media (min-width: 1024px) {

.hero-area.hero-bg-area .holder .headline {
          line-height: 1;

          font-size: 3.75rem
      }
        }

@media (min-width: 1440px) {

.hero-area.hero-bg-area .holder .headline {
          font-size: 4rem
      }
        }

.hero-area.hero-bg-area .holder .content {
        width: 100%;
        padding: 1.25rem;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-shadow: 0 0 11px rgba(0,0,0,.5)
      }

.hero-area.hero-bg-area .holder .content span {
          letter-spacing: 1.6px;
          -webkit-animation: fadeInUp .5s ease both;
                  animation: fadeInUp .5s ease both;
          -webkit-animation-delay: 1.5s;
                  animation-delay: 1.5s;
        }

.hero-area.hero-bg-area .holder .content li {
          letter-spacing: 0.8px;
          opacity: 0;
          -webkit-animation: fadeInUp .5s ease both;
                  animation: fadeInUp .5s ease both;
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s;
        }

@media (min-width: 640px) {

.hero-area.hero-bg-area .holder .content {
          padding: 2rem
      }
        }

@media (min-width: 768px) {

.hero-area.hero-bg-area .holder .content {
          padding: 1.25rem
      }
        }

.hero-area.hero-bg-area .holder .content ul:last-of-type li{
              /*font-size: 1.2rem;*/
              text-transform: none;
              font-size: 1.75rem;
              font-weight: 200
            }

@media (min-width: 1024px) {

.hero-area.hero-bg-area .holder .content ul:last-of-type li{
                font-size: 2.75rem
            }
              }

.hero-area.hero-bg-area .holder a .badge-img {
        display: none;
        z-index: 40;
        opacity: 0;
        -webkit-animation: fadeInUp .5s ease both;
                animation: fadeInUp .5s ease both;
        -webkit-animation-delay: 3s;
                animation-delay: 3s;
        max-width: 262px;
        height: 52px
      }

@media (min-width: 768px) {

.hero-area.hero-bg-area .holder a .badge-img {
          display: block;

          right: 45px;

          bottom: 35px
      }
        }

@media (min-width: 1440px) {

.hero-area.hero-bg-area .holder a .badge-img {
          display: block;

          right: 65px;

          bottom: 55px;

          padding-left: 1.25rem
      }
        }

@media all and (max-width:767px) {

.hero-area.hero-bg-area .holder.min-h-screen{
          /*min-height:calc(100vh - 124px);*/

          min-height:435px
      }
        }

@media all and (max-width: 767px) and (max-height: 440px) {

.hero-area.hero-bg-area .holder.min-h-screen{
          min-height:100vh
      }
        }

.hero-area.hero-slider-area .swiper-slide:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: linear-gradient(to bottom,
                rgba(35, 35, 35, 0.35) 0%,
                rgba(35, 35, 35, 0.2) 25%,
                rgba(35, 35, 35, 0.2) 70%,
                rgba(35, 35, 35, 0.35) 100%);
        z-index: 10;
      }

.hero-area.hero-slider-area .swiper-slide img {
        -webkit-animation: fadeInAndScale 2s ease both;
                animation: fadeInAndScale 2s ease both;
        /* animation-delay:1.5s; */
      }

.hero-area.hero-slider-area .swiper-pagination {
      display: none;
      -webkit-animation: fadeInUp .5s ease both;
              animation: fadeInUp .5s ease both;
      -webkit-animation-delay: 3s;
              animation-delay: 3s;
    }

.hero-area.hero-slider-area .slide-content {
      -webkit-animation: fadeInUp .5s ease both;
              animation: fadeInUp .5s ease both;
      -webkit-animation-delay: 2.3s;
              animation-delay: 2.3s;
    }

.hero-area .bg-image-wrap {
    position: relative;
    z-index: 10;
    background-color: #fff;
    -webkit-animation: none;
            animation: none
  }

@media (min-width: 768px) {

.hero-area .bg-image-wrap {
      -webkit-animation:fadeInAndScale 2s ease both;
              animation:fadeInAndScale 2s ease both

      /* animation-delay:1.5s; */
  }
    }

@media all and (max-width:767px) {

.hero-area .bg-image-wrap {
      background-size: auto 435px
  }
    }

.hero-area .bg-image-wrap.gallery {
    -webkit-animation: none;
            animation: none;
  }

.hero-area .presented-logo-block img {
      opacity: 0;
      -webkit-animation: fadeInUp .5s ease both;
              animation: fadeInUp .5s ease both;
      -webkit-animation-delay: 2.5s;
              animation-delay: 2.5s;
      max-height: 300px;
    }

.hero-area .presented-logo-block span {
      opacity: 0;
      -webkit-animation: fadeInUp .5s ease both;
              animation: fadeInUp .5s ease both;
      -webkit-animation-delay: 2.5s;
              animation-delay: 2.5s;
    }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes fadeInAndScale {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }

  50% {
    opacity:1;
  }

  100% {
    transform:scale(1);
  }
}

@keyframes fadeInAndScale {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }

  50% {
    opacity:1;
  }

  100% {
    transform:scale(1);
  }
}

@-webkit-keyframes slideInAndScale {
  0% {
    transform: scale(1.2);
  }

  100% {
    transform:scale(1);
  }
}

@keyframes slideInAndScale {
  0% {
    transform: scale(1.2);
  }

  100% {
    transform:scale(1);
  }
}

.top-badges {
  top:auto;
  bottom:25px;
  left: 1.25rem
}

.top-badges .status-badge {
    float: left;
    color: #fff;
    background-color: #9e3f4b;
    opacity: .9;
    margin: 0 4px 5px 4px;
    padding: 0.75rem 1.4rem;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    text-transform: uppercase
  }

.top-badges .status-badge.type-openhouse {
      background-color: rgba(22,64,105,0.90196);
    }

.top-badges .status-badge.type-3dtour {
      background: url('/images/vr-white.svg') 14px 50% no-repeat #7c775c;
      background-size: 24px 24px;
      padding-left: 47px;
    }

.top-badges .status-badge.type-video {
      background: url('/images/video_icon.svg') 14px 50% no-repeat #7c775c;
      background-size: 24px 24px;
      padding-left: 47px;
    }

.top-badges .status-badge.status-sold {
      background-color: rgba(159,130,50,0.90196);
    }

@media (min-width: 640px) {

.top-badges {
    top:auto;

    bottom:25px
}
  }

@media (min-width: 768px) {

.top-badges {
    top:auto;

    bottom:25px
}
  }

@media (min-width: 1024px) {

.top-badges {
    top: 150px;

    bottom:auto
}
  }

/*site specific styles*/

.site-hh .top-badges .status-badge {
      background-color:#585957;
      opacity: .7
    }

.site-hh .top-badges .status-badge.type-openhouse {
        background-color:#585957;
      }

.site-hh .top-badges .status-badge.type-3dtour {
        background: url('/images/vr-white.svg') 14px 50% no-repeat #585957;
        background-size: 24px 24px;
        padding-left: 47px;
      }

.site-hh .top-badges .status-badge.type-video {
        background: url('/images/video_icon.svg') 14px 50% no-repeat #585957;
        background-size: 24px 24px;
        padding-left: 47px;
      }

.site-hh .top-badges .status-badge.status-sold {
        background-color:#585957;
      }

.site-sgp .top-badges .status-badge {
      background-color:#003a69
    }

.site-sgp .top-badges .status-badge.type-openhouse {
        background-color:#3782a5;
      }

.site-sgp .top-badges .status-badge.type-3dtour {
        background: url('/images/vr-white.svg') 14px 50% no-repeat #3782a5;
        background-size: 24px 24px;
        padding-left: 47px;
      }

.site-sgp .top-badges .status-badge.type-video {
        background: url('/images/video_icon.svg') 14px 50% no-repeat #3782a5;
        background-size: 24px 24px;
        padding-left: 47px;
      }

.site-sgp .top-badges .status-badge.status-sold {
        background-color:#3782a5;
      }

.site-islandia .top-badges .status-badge {
      float: left;
      color: #fff;
      font-weight: 300;
      background-color:#003a69;
      font-size: 1.1rem;
      letter-spacing: 1px
    }

.site-islandia .top-badges .status-badge.type-openhouse {
        background-color:#003a69;
      }

.site-islandia .top-badges .status-badge.type-3dtour {
        background: url('/images/vr-white.svg') 14px 50% no-repeat #003a69;
        background-size: 24px 24px;
        padding-left: 47px;
      }

.site-islandia .top-badges .status-badge.type-video {
        background: url('/images/video_icon.svg') 14px 50% no-repeat #003a69;
        background-size: 24px 24px;
        padding-left: 47px;
      }

.site-islandia .top-badges .status-badge.status-sold {
        background-color:#003a69;
      }

@media all and (max-width:767px) {

.hero-slider-section .swiper-container{
      /*height:calc(100vh - 124px)!important;*/

      height:435px!important
  }
    }

@media all and (max-width:767px) {
    .hero-slider-section   .swiper-button-prev,
    .hero-slider-section   .swiper-button-next {
      padding-top: 40px;
    }
  }

@media all and (max-width:767px) {

.hero-slider-section .slide-content .content-inner{
        bottom: 1.25rem!important
    }
      }

@media (min-width: 1280px) {

.hero-slider-section .slide-content .content-inner{
        padding-right: 0;

        padding-left: 3.75rem;

        bottom: 2rem

        /*width: 50%;*/
    }
      }

.hero-slider-section .slide-content .content-inner .slide-title{
        font-family: Proxima Nova, proxima-nova, sans-serif;
        line-height: 1.2;
        font-weight: 400;
        letter-spacing: 1px
      }

@media (min-width: 1024px) {

.hero-slider-section .slide-content .content-inner .slide-title{
          font-size: 3rem
      }
        }

@media all and (max-width:767px) {

.hero-slider-section .slide-content .content-inner .slide-title{
          font-size:1.875rem
      }
        }

.hero-slider-section .slide-content .content-inner .slide-title span{
          display: block;
          font-size: 1.2rem
        }

@media (min-width: 1024px) {

.hero-slider-section .slide-content .content-inner .slide-title span{
            font-size: 2.25rem
        }
          }

.inner-content-deets .hero-slider-section .slide-content .content-inner{
        padding-left: 3rem;
        padding-right: 3rem
      }

@media (min-width: 1280px) {

.inner-content-deets .hero-slider-section .slide-content .content-inner{
          padding-left: 6rem;

          padding-right: 6rem
      }
        }

.inner-content-deets .hero-slider-section .slide-content .content-inner .slide-title{
          font-weight: 300;
          font-size: 1.5rem;
          line-height: 1.3
        }

@media (min-width: 768px) {

.inner-content-deets .hero-slider-section .slide-content .content-inner .slide-title{
            font-size: 1.5rem
        }
          }

@media (min-width: 1024px) {

.inner-content-deets .hero-slider-section .slide-content .content-inner .slide-title{
            font-size: 1.75rem
        }
          }

@media (min-width: 1280px) {

.inner-content-deets .hero-slider-section .slide-content .content-inner .slide-title{
            font-size: 2.75rem
        }
          }

.inner-content-deets .hero-slider-section .slide-content .price{
        font-weight: 600
      }

@media (min-width: 1024px) {

.inner-content-deets .hero-slider-section .slide-content .price{
          font-size: 2.5rem
      }
        }

@media (min-width: 1280px) {

.inner-content-deets .hero-slider-section .slide-content .price{
          font-size: 2.5rem;

          letter-spacing: 0
      }
        }

.bg-top-center{
  background-position: top center;
}

/*.hero-area.hero-bg-area {*/

/*    & .holder{*/

/*        &  .content{*/

/*            &.align-hero-text-left{*/

/*                 position: absolute;*/

/*                 bottom:10%;*/

/*                 left:0;*/

/*                 transform: none;*/

/*                 top: auto;*/

/*              }*/

/*           }*/

/*      }*/

/*}*/



  .brand-title strong {
    display: none;
    margin-top: -0.5rem;
    font-weight: 400;
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity));
    text-align: left;
    font-family: Proxima Nova, proxima-nova, sans-serif;
    text-transform: uppercase;
    cursor: pointer;
    font-size: 1.5rem;
    letter-spacing: 1px;
    text-shadow: 0 0 11px rgba(0,0,0,.25)
  }
@media (min-width: 1024px){
    .brand-title strong {
      display: block
  }
    }
@media (min-width: 1280px){
    .brand-title strong {
      font-size: 2.25rem;

      letter-spacing: 3.6px
  }
    }