/*************
Overlay Styles
*************/
@media only screen and (min-width: 1025px) {
  .pop-overlay-d {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 5;
  }

  .pop-overlay-d.show-popup {
    display: block;
  }
}

@media only screen and (max-width: 1024px) {
  .no-scroll.no-scroll-m {
    overflow: hidden;
  }
}

@media only screen and (min-width: 1025px) {
  .no-scroll.no-scroll-d {
    overflow: hidden;
  }
}

/*************
Pop Up Styles
*************/
.c-site-pop-up {
  display: none;
  padding: 0;
  position: fixed;
  margin: 0;
  z-index: 6;
}

@media only screen and (max-width: 1024px) {
  .c-site-pop-up{
    transition: all 1.25s;
    z-index: 21;
    /*Mobile pos*/
    position: fixed;
    bottom: 44px;
    left: 0;
    top: unset;
  }
}

.c-site-pop-up.show-popup {
  display: block;
}

@media only screen and (min-width: 1025px) {
  .c-site-pop-up {
    height: 300px;
    width: 300px;
  }

  .c-site-pop-up.c-pop-up__circle {
    width: 350px;
    height: 350px;
  }
}

@media only screen and (max-width: 1024px) {
  .c-site-pop-up {
    width: 100%;
  }
}

.c-pop-up__wrapper {
  background: white;
}

.c-site-pop-up__content--contain {
  padding: 30px 15px;
}

@media only screen and (min-width: 1025px) {
  .c-site-pop-up__content--contain {
    padding: 30% 0 0 0;
  }
}

.c-site-pop-up__container {
  text-align: center;
}

.c-site-pop-up__title {
  font-family: 'Rector',serif;
  font-size: 21px;
  line-height: 21px;
  margin-bottom: 10px;
}

.c-site-pop-up__title img {
  max-width: 100%;
}

@media only screen and (min-width: 1025px) {
  .c-site-pop-up__title {
    font-size: 40px;
    line-height: 40px;
  }
}

.c-site-pop-up__message {
  font-family: "Euclid Circular A Regular", sans-serif;
  font-size: 15px;
  line-height: 21px;
  /*margin-bottom: 30px;*/
}

.c-site-pop-up__message .links a {
  margin: 0;
}

.c-site-pop-up__close {
  background: transparent;
  border: 0;
  border-radius: 50%;
  color: #464B53;
  height: 35px;
  padding: 0;
  position: absolute;
  right: 15px;
  top: -15px;
  width: 35px;
  z-index: 6;
}

@media only screen and (min-width: 1025px) {
  .c-site-pop-up__close {
    right: 15px;
    top: 60px;
  }
}

.c-site-pop-up__link > a {
  background: white;
  border: 1px solid #DBD7D1;
  border-radius: 2px;
  color: #125A71;
  padding: 13px 26px;
}

/************
Basic Content
************/
.c-pop-up__basic-content .c-pop-up__image,
.c-pop-up__basic-content .constraint {
  display: none;
}

.c-pop-up__basic-content .c-site-pop-up__link {
  margin-top: 15px;
}

@media only screen and (min-width: 1025px) {
  .c-pop-up__basic-content.c-site-pop-up {
    border: 1px solid rgba(0, 0, 0, 0.2);
    min-height: 400px;
    width: 675px;
  }

  .c-pop-up__basic-content .c-pop-up__wrapper,
  .c-pop-up__basic-content .c-site-pop-up__container {
    height: 100%;
  }

  .c-pop-up__basic-content .c-site-pop-up__container {
    display: flex;
  }

  .c-pop-up__basic-content .c-pop-up__image,
  .c-pop-up__basic-content .c-site-pop-up__content {
    width: 50%;
  }

  .c-pop-up__basic-content .c-site-pop-up__content {
    display: flex;
    align-items: center;
  }

  .c-pop-up__basic-content .c-site-pop-up__content--contain {
    padding: 50px;
    text-align: left;
  }

  .c-pop-up__basic-content .c-pop-up__image {
    display: block;
  }

  .c-pop-up__basic-content .c-pop-up__image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
  }

  .c-pop-up__basic-content .c-site-pop-up__close {
    right: -15px;
    top: -15px;
  }
}

/************
Shape Outside

NOTE: there should be a check added
to determine if pop up is shape or basic content
************/
.c-site-pop-up .c-pop-up__wrapper .constraint-1,
.c-site-pop-up .c-pop-up__wrapper .constraint-2,
.c-site-pop-up .c-pop-up__wrapper .constraint-3,
.c-site-pop-up .c-pop-up__wrapper .constraint-4 {
  width: 50%;
  height: 50%;
}

.c-site-pop-up .c-pop-up__wrapper .constraint-1 {
  float: left;
  shape-outside: polygon(0 0,0% 58%,58% 0%);
  clip-path: polygon(0 0,0% 58%,58% 0%);
  -webkit-shape-outside: polygon(0 0,0% 58%,58% 0%);
}

.c-site-pop-up .c-pop-up__wrapper .constraint-2 {
  float: right;
  shape-outside: polygon(100% 0%,42% 0%,100% 58%);
  clip-path:  polygon(100% 0%,42% 0%,100% 58%);
  -webkit-shape-outside: polygon(100% 0%,42% 0%,100% 58%);
}

.c-site-pop-up .c-pop-up__wrapper .constraint-3 {
  float: left;
  shape-outside: polygon(0% 100%,0% 42%,58% 100%);
  clip-path:  polygon(0% 100%,0% 42%,58% 100%);
  -webkit-shape-outside: polygon(0% 100%,0% 42%,58% 100%);
}

.c-site-pop-up .c-pop-up__wrapper .constraint-4 {
  float: right;
  shape-outside: polygon(42% 100%,100% 100%,100% 42%);
  clip-path:  polygon(42% 100%,100% 100%,100% 42%);
  -webkit-shape-outside: polygon(42% 100%,100% 100%,100% 42%);
}

/***************
Position Mobile
***************/
@media only screen and (max-width: 1024px) {
  .c-pop-up__m-pos--d {
    bottom: 0;
    left: 0;
    top: unset;
  }

  .c-pop-up__m-pos--f {
    bottom: 0;
    top: unset;
    left: 0;
    transform: translate(0%, 0%);
  }
}
/***************
Position Desktop
***************/
@media only screen and (min-width: 1025px) {
  .c-pop-up__pos--d {
    left: 50px;
    top: 50%;
    /*width: 500px;*/
    transform: translate(0%, -50%);
  }

  .c-pop-up__pos--f {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/*******************
Diamond Shape Styles
*******************/
@media only screen and (min-width: 1025px) {
  .c-pop-up__diamond.c-pop-up__pos--d {
    left: 95px;
    margin-left: 50px;
  }

  .c-pop-up__diamond .c-pop-up__wrapper {
    height: 100%;
    transform: rotate(45deg);
    width: 100%;
  }

  .c-pop-up__diamond .c-pop-up__wrapper .c-site-pop-up__container {
    height: 100%;
    transform: rotate(315deg);
    width: 100%;
  }
}

/*******************
Circle Shape Styles
*******************/
@media only screen and (min-width: 1025px) {
  .c-pop-up__circle.c-pop-up__pos--d {
    left: 95px;
    margin-left: 50px;
  }

  .c-pop-up__circle .c-pop-up__wrapper {
    border-radius: 50%;
    height: 100%;
    width: 100%;
  }

  .c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container {
    height: 100%;
    width: 100%;
  }
}

/***********
Lu'au Styles
************/
@media only screen and (max-width: 1024px) {
  .c-pop-up__luau .c-pop-up__wrapper {
    background: url('../img/beach-mobile.png') no-repeat center;
    background-size: cover;
  }
}

@media only screen and (min-width: 1025px) {
  .c-pop-up__luau.c-pop-up__diamond {
    height: 300px;
    width: 300px;
  }

  .c-pop-up__luau.c-pop-up__diamond.c-pop-up__pos--f {
    height: 450px;
    width: 450px;
  }

  .c-pop-up__luau.c-pop-up__circle {
    height: 350px;
    width: 350px;
  }

  .c-pop-up__luau.c-pop-up__circle.c-pop-up__pos--f {
    height: 475px;
    width: 475px;
  }

  /* Default Sticky Pos */
  .c-pop-up__luau .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/luau-diamond.png');
    background-size: contain;
    background-repeat: no-repeat;
    content: "";
    height: 142%;
    position: absolute;
    right: -61px;
    top: -64px;
    width: 142%;
  }

  .c-pop-up__luau.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/luau-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
  }

  .c-pop-up__luau .c-pop-up__wrapper .c-site-pop-up__container:after {
    background: url('../img/luau-fig.png');
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 297px;
    position: absolute;
    right: -21px;
    top: -154px;
    width: 382px;
  }

  .c-pop-up__luau.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:after {
    background: url('../img/luau-fig.png');
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 297px;
    position: absolute;
    right: 37px;
    top: -78px;
    width: 86%;
  }

  /* Full size Pos */
  .c-pop-up__luau.c-pop-up__pos--f .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/luau-diamond.png');
    background-size: contain;
    background-repeat: no-repeat;
    content: "";
    height: 142%;
    position: absolute;
    right: -93px;
    top: -95px;
    width: 142%;
  }

  .c-pop-up__luau.c-pop-up__pos--f.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/luau-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
  }

  .c-pop-up__luau.c-pop-up__pos--f .c-pop-up__wrapper .c-site-pop-up__container:after {
    background: url('../img/luau-fig.png');
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 457px;
    position: absolute;
    right: -34px;
    top: -224px;
    width: 569px;
  }

  .c-pop-up__luau.c-pop-up__pos--f.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:after {
    background: url('../img/luau-fig.png');
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 457px;
    position: absolute;
    right: 53px;
    top: -106px;
    width: 406px;
  }

  /*Gradient*/
  .c-pop-up__luau .c-pop-up__wrapper .c-site-pop-up__content:before {
    background: linear-gradient(310deg,#125A71 20.86%,rgba(18,90,113,0) 62.27%);
    content: "";
    height: 100.5%;
    position: absolute;
    z-index: 1;
    width: 100%;
    right: 1px;
    transform: rotate(45deg);
  }

  .c-pop-up__luau.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__content:before {
    background: linear-gradient(310deg,#125A71 20.86%,rgba(18,90,113,0) 62.27%);
    border-radius: 50%;
    content: "";
    height: 100.5%;
    position: absolute;
    z-index: 1;
    width: 100%;
    right: 1px;
    transform: rotate(45deg);
  }

  .c-pop-up__luau .c-pop-up__wrapper .c-site-pop-up__content--contain {
    color: white;
    /*padding-top: 40%;*/
    position: relative;
    z-index: 1;
  }
}
/****
Beach
****/
@media only screen and (max-width: 1024px) {
  .c-pop-up__beach .c-pop-up__wrapper {
    background: url('../img/beach-mobile.png') no-repeat center;
    background-size: cover;
  }
}

@media only screen and (min-width: 1025px) {
  .c-pop-up__beach .c-pop-up__wrapper .c-site-pop-up__container:before {
    content: "";
    position: absolute;
  }

  .c-pop-up__beach.c-pop-up__diamond .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/beach-diamond.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 140%;
    right: -60px;
    top: -60px;
    width: 140%;
  }

  .c-pop-up__beach.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/beach-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 101%;
    right: -1px;
    top: 1px;
    width: 101%;
  }
}

.c-pop-up__beach .c-pop-up__wrapper .c-site-pop-up__content--contain {
  color: black;
  /*padding-top: 30%;*/
  position: relative;
  z-index: 1;
}

/*****
Flower
*****/
@media only screen and (max-width: 1024px) {
  .c-pop-up__flower .c-pop-up__wrapper {
    background: url('../img/flower-mobile.png') no-repeat center;
    background-size: cover;
  }
}

@media only screen and (min-width: 1025px) {
  .c-pop-up__flower .c-pop-up__wrapper .c-site-pop-up__container:before {
    content: "";
    position: absolute;
  }

  .c-pop-up__flower.c-pop-up__diamond .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/flower-diamond.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 140%;
    right: -60px;
    top: -60px;
    width: 140%;
  }

  .c-pop-up__flower.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/flower-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 101%;
    right: -1px;
    top: 1px;
    width: 101%;
  }

}
.c-pop-up__flower .c-pop-up__wrapper .c-site-pop-up__content--contain {
  color: black;
  /*padding-top: 30%;*/
  position: relative;
  z-index: 1;
}

/****
Olivine
****/
.c-pop-up__olivine {
  z-index: 21;
}
.c-pop-up__olivine .c-pop-up__wrapper {
  background: none;
}
.c-pop-up__olivine .c-site-pop-up__content {
  position: relative;
  height: 100%;
}
.c-pop-up__olivine .c-site-pop-up__content--contain {
  padding: 10%;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.c-pop-up__olivine .c-site-pop-up__title {
  text-transform: uppercase;
  color: white;
  font-size: 65px;
  line-height: 50px;
  margin-bottom: 36px;
}
.c-pop-up__olivine .c-site-pop-up__title img {
  max-height: 51px;
}
.c-pop-up__olivine .c-site-pop-up__message h1,
.c-pop-up__olivine .c-site-pop-up__message h2,
.c-pop-up__olivine .c-site-pop-up__message h3,
.c-pop-up__olivine .c-site-pop-up__message h4,
.c-pop-up__olivine .c-site-pop-up__message {
  color: #1D3E2D;
}
.c-pop-up__olivine .c-site-pop-up__message {
  flex-grow: 1;
  font-family: 'FoundersGrotesk';
  font-size: 18px;
  line-height: 30px;
  padding-bottom: 24px;
}
.c-pop-up__olivine .c-site-pop-up__link a {
  background: #CEB848;
  border-radius: 3px;
  color: #1D3E2D;
  border: none;
}
@media only screen and (max-width: 1024px) {
  .c-pop-up__olivine {
    width: 100vw !important;
    padding: 0 24px;
    min-width: 0;
    top: 50%;
    left: 50%;
    bottom: auto;
    transform: translate(-50%, -50%);
  }
  .c-pop-up__olivine.is-zoomed .c-pop-up__wrapper{
    left: unset;
    padding: 0;
    top: 20px;
    transform: scale(.75) translateY(-33%);
  }

  .c-pop-up__olivine .c-pop-up__wrapper {
    background: url('../img/olivine-mobile.png') no-repeat center;
    background-size: cover;
  }

  .c-pop-up__olivine .c-site-pop-up__title {
    margin-bottom: 20px
  }

  .c-pop-up__olivine .c-site-pop-up__title img {
    max-height: 45px;
  }

  .c-pop-up__olivine .c-site-pop-up__content--contain {
    padding: 5%;
    background: #a7b48c;
  }
  .c-pop-up__olivine .c-site-pop-up__message {
    font-size: 15px;
    line-height: 21px;
  }
  .c-pop-up__olivine .c-site-pop-up__close {
    right: 10px;
    top: -10px;
  }
}

@media only screen and (min-width: 1025px) {
  .c-pop-up__olivine.c-pop-up__circle {
    min-width: 500px;
    min-height: 500px;
    max-width: 700px;
    max-height: 700px;
    width: 90vh !important;
    height: 90vh !important;
    top: 50%;
    left: 50%;
    bottom: auto;
    transform: translate(-50%, -50%);
  }
  .c-pop-up__olivine.c-pop-up__diamond {
    width: 500px;
    height: 500px;
  }
  .c-pop-up__olivine.c-pop-up__circle .c-site-pop-up__close {
    right: 10vh;
    top: 10vh;
  }
  .c-pop-up__olivine .c-site-pop-up__content--contain {
    position: absolute;
  }

  .c-pop-up__olivine .c-pop-up__wrapper .c-site-pop-up__container:before {
    content: "";
    position: absolute;
  }

  .c-pop-up__olivine.c-pop-up__diamond .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/olivine-diamond.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 140%;
    right: -100px;
    top: -100px;
    width: 140%;
  }

  .c-pop-up__olivine.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/olivine-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 100%;
    right: 0;
    top: 0;
    width: 100%;
  }
}

/***
Tree
***/
@media only screen and (max-width: 1024px) {
  .c-pop-up__tree .c-pop-up__wrapper {
    background: url('../img/trees-mobile.png') no-repeat center;
    background-size: cover;
  }
}

@media only screen and (min-width: 1025px) {
  .c-pop-up__tree .c-pop-up__wrapper .c-site-pop-up__container:before {
    content: "";
    position: absolute;
  }

  .c-pop-up__tree.c-pop-up__diamond .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/trees-diamond.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 140%;
    right: -60px;
    top: -60px;
    width: 140%;
  }

  .c-pop-up__tree.c-pop-up__circle .c-pop-up__wrapper .c-site-pop-up__container:before {
    background: url('../img/trees-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 101%;
    right: -1px;
    top: 1px;
    width: 101%;
  }
}

.c-pop-up__tree .c-pop-up__wrapper .c-site-pop-up__content--contain {
  color: black;
  /*padding-top: 30%;*/
  position: relative;
  z-index: 1;
}

/**********
Hide pop up
**********/
@media only screen and (min-width: 1025px) {
  .c-site-popup__hide-desk {
    display: none !important;
  }
}

@media only screen and (max-width: 1024px) {
  .c-site-popup__hide-mobile{
    display: none !important;
  }
}