/*
Theme Name: Moondance Travel Co.
Author: Kristen Wall / Scott Reston
Author URI:
Version: 1.0

*/

/* fonts purchased on 10/2/2025 from Creative Market for 10K page views/mo. order #145354085 */
@font-face {
    font-family: 'ethicserif-light-webfont';
    src: url('_fonts/ethicserif-light-webfont.woff') format('woff'),
         url('_fonts/ethicserif-light-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ethicserif-lightitalic-webfont-webfont';
    src: url('_fonts/ethicserif-lightitalic-webfont.woff') format('woff'),
         url('_fonts/ethicserif-lightitalic-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
}
body, .aptos-light {
  font-family: "aptos", sans-serif;
  font-weight: 300;
  font-style: normal;
}
.aptos-light-italic {
  font-family: "aptos", sans-serif;
  font-weight: 300;
  font-style: italic;
}
/* fix chrome auto sizing for responsive images */
img {width: 100%; height: auto;}
html, body {
  height: 100%;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 75px!important; /* set this to the height of the fixed nav if there is one */
}
body {color: #46454b; background-color: #f9f8f6;}
a, a:hover, a:focus, a:visited {text-decoration: none;}
a {
  color: #828dba;
}
a:hover {
  color: #46454b;
}
ul, li {margin: 0; padding: 0;}
.icon::before {
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  }
.a, :hover, .ease, :hover:after, :hover:before {-webkit-transition: all 200ms ease;
-moz-transition: all 200ms ease;
-ms-transition: all 200ms ease;
-o-transition: all 200ms ease;
transition: all 200ms ease;}

@media (min-width: 992px) {
  html {
    scroll-padding-top: 105px!important; /* set this to the height of the fixed nav if there is one */
  }
}

iframe {aspect-ratio: 16 / 9; width: 100%; margin-bottom: 30px;}
.test-bg {background: yellow}
.test-border {border: 1px solid red}
.alignnone, .alignleft, .aligncenter, .alignright {width: 100%; height: auto;}
.alignnone { margin: 20px 0; }
.alignleft { margin: 0 20px 20px 0; float: left; }
.aligncenter {clear: both; display: block; margin: 20px auto;}
.alignright {margin: 0 0 20px 20px; float: right;}
.wp-caption-text {font-size: 12px; width: 85%; margin-top: -75px; margin-left: 20px; margin-bottom: 60px; color: #fff;}

.bg-lttan {background-color: #f9f8f6}
.bg-tan {background-color: #d4cac2}
.bg-purple {background-color: #828dba}
.bg-yellow {background-color: #f7f77c}
.bg-dkgray {background-color: #46454b}

.text-lttan {color: #f9f8f6}
.text-tan {color: #d4cac2}
.text-purple {color: #828dba}
.text-yellow {color: #f7f77c}
.text-dkgray {color: #46454b}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6,
.serif { font-family: 'ethicserif-light-webfont'; line-height: 1.1; font-weight: normal;}

h1, .h1 {font-size: 48px}
h2, .h2 {font-size: 36px;}
h3, .h3 {font-size: 32px;}
h4, .h4 {font-size: 28px;}
h5, .h5 {font-size: 22px;}
h6, .h6, p, ul, ol {font-size: 18px; line-height: 1.4}

@media (min-width: 768px) {
  h1, .h1 {font-size: 58px}
  h2, .h2 {font-size: 38px;}
}

@media (min-width: 1200px) {
  h1, .h1 {font-size: 88px}
  h2, .h2 {font-size: 58px;}
  h3, .h3 {font-size: 45px;}
  h4, .h4 {font-size: 32px;}
  h5, .h5 {font-size: 22px;}
  h6, .h6, p {font-size: 18px;}
}
strong {font-weight: 700}

.btn {
  display: inline-block;
  line-height: 1.5;
  color: #212529;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border-radius: 0.25rem;
}
@media (prefers-reduced-motion: reduce) {
  .btn {
    transition: none;
  }
}
.btn:hover {
  color: #212529;
}

.btn-primary {
  color: #fff;
  background-color: #828dba;
  border-color: #828dba;
}
.btn-primary:hover {
  color: #fff;
  background-color: #d4cac2;
  border-color: #d4cac2;
}

.btn-secondary {
  color: #212529;
  background-color: #f7f77c;
  border-color: #f7f77c;
}
.btn-secondary:hover {
  color: #fff;
  background-color: #d4cac2;
  border-color: #d4cac2;
}

.btn-lg {
  padding: 15px 25px;
  font-size: 26px;
  border-radius: 18px;
}

@media (min-width: 1200px) {
  .col-xl-20 {
    flex: 0 0 auto;
    width: 20%;
  }
}

/* FONT AWESOME PSEUDO
---------------------------
--------------------------- */
/* New Simplified Version 6 CSS */
/* Step 1: Common Properties: All required to make icons render reliably */
.icon::before {
  /* removed font- based rules */
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

/* Step 2: Reference Individual Icons */
.login::before {
  /* using style CSS custom property */
  font: var(--fa-font-solid);
  content: '\f007';
}

/* Note: Make sure to include the correct weight and Unicode value for the icon */
.tps::before {
  /* using style CSS custom property */
  font: var(--fa-font-solid);
  content: '\f1ea';
}


/* HEADER / NAVIGATION
* nav-walker will add nav-link to menus with dropdowns but not to menus in a modal which use li.menu-item, li.menu-item a
---------------------------
--------------------------- */
.fixed-top {padding: 30px}
.add-opacity {background-color: #f9f8f6;}
.navbar-brand img {width: 240px;}
.navbar-toggler {position: absolute; top: 27px; right: 15px; padding: 0; color: #fff; font-size: 28px;}
.add-opacity .navbar-toggler { color: #828dba; }
.navbar-toggler:focus { box-shadow: none;}

.modal-body {overflow-x: hidden; color: #fff!important;}
.modal-body a {color: #f7f77c;}
.modal-body a:hover {color: #828dba;}
.modal-content {background-color: transparent; border: 0;}
.btn-close-modal {position: absolute; top: 24px; right: 15px; width: 30px; height: 30px; color: #fff; background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1.5em auto no-repeat; z-index: 22; opacity: 1!important}
.modal-backdrop { background-color: #46454b; }
.modal-backdrop.show { opacity: 0.95; }

.main-nav {}
.main-nav, .main-nav ul {list-style: none;}
.main-nav li {font-size: 26px; font-family: 'ethicserif-light-webfont'; margin-bottom: 30px;}
.main-nav li a {color: #fff; }
.main-nav li ul {margin-top: 20px;}
.main-nav li ul li {font-size: 20px; margin-bottom: 10px; font-family: "aptos", sans-serif; font-weight: 300; text-align: center;}
.main-nav li.menu-item-has-children a {position: relative;}
.main-nav li.menu-item-has-children a[aria-expanded=false]:after {content:'+'; margin-left: 8px; top: 8px; position: relative;}
.main-nav li.menu-item-has-children a[aria-expanded=true]:after {content:'–'; margin-left: 8px; top: 8px; position: relative;}
.main-nav-cta {font-family: "aptos", sans-serif!important; font-size: 22px!important; margin-bottom: 45px!important;}
.main-nav-cta a {padding: 10px 15px!important; background-color: #f7f77c; color: #212529!important; border-radius: 6px; }
.main-nav-cta a:hover { background-color: #828dba; color: #fff!important }
.nav-link:hover, .nav-link:focus {
    color: #828dba;
}

#contact-modal.modal-backdrop { background-color: #828dba!important; }

.top-left-menu {position: absolute; top: 40px; left: 30px;}
.top-left-menu li.nav-item a { color: #fff }
.top-left-menu li a:hover {color: #828dba }
.add-opacity .top-left-menu li a {color: #46454b!important; }
.top-left-menu li {display: inline-block; font-size: 18px; margin-right: 30px;}
.top-left-menu li.nav-item.top-menu-cta a { padding: 10px 15px; border-radius: 12px; background-color: #f7f77c; color: #212529;  }
.top-left-menu li.top-menu-cta a {color: #212529}
.top-left-menu li.top-menu-cta a:hover { background-color: #828dba; color: #fff!important}

/* lower header below WP admin bar when logged in */
.admin-bar .fixed-top {top: 32px;}

.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
}
.dropdown-menu {
  position: relative!important;
  z-index: 1000;
  display: none;
  min-width: 20rem;
  padding: 0;
  margin: 0;
  font-size: 20px; margin-bottom: 10px; font-family: "aptos", sans-serif; font-weight: 300;
  color: #fff;
  border: 0;
  border-radius: 0;
  background-color: transparent;
}
.dropdown-menu[data-bs-popper] {
  display: block;
}
.dropdown-menu.show {transform: none!important}
.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.25rem 1rem;
  clear: both;
  font-size: 20px; margin-bottom: 10px; font-family: "aptos", sans-serif; font-weight: 300;
  color: #fff;
  text-align: inherit;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  text-align: center;
}
.dropdown-item:hover, .dropdown-item:focus {
  color: #828dba;
  background-color: transparent;
}
.dropdown-item.active, .dropdown-item:active {
  color: #828dba;
  background-color: none;
}

@media (min-width: 768px) {
  .navbar-toggler {top: 35px; right: 23px; font-size: 32px;}
  .btn-close-modal {top: 36px; right: 25px;}
  .main-nav li {font-size: 30px;}
}
@media (min-width: 992px) {
  body.modal-open {
    overflow: scroll !important; /* Keep the scrollbar visible */
    padding-right: 0 !important; /* Prevent padding adjustments */
  }
}


/* FOOTER
---------------------------
--------------------------- */
.footer {padding-top: 50px; padding-bottom: 30px;}
#footer-menu,
#social-menu {display: block;}

#footer-menu li {font-size: 15px; line-height: 1.1; margin: 20px;}
#social-menu li { font-size: 6px; margin: 0 8px; display: inline-block;}
#footer-menu li a, #social-menu .fa-circle {color: #46454b}
#footer-menu li a:hover, #social-menu li a:hover .fa-circle {color: #828dba}
#social-menu {margin: 0 20px;}
@media (min-width: 992px) {
  #footer-menu,
  #social-menu,
  #footer-menu li,
  #social-menu li { display: inline-block; }
  #footer-menu li {margin: 0 30px;}
}

/* HERO
---------------------------
--------------------------- */
.hero {position: relative}
.carousel-inner {overflow: hidden;}
.hero .carousel-item {background-repeat: no-repeat; background-size: cover; background-position: center center;  transition: transform 1.5s ease-in-out;}
.hero:hover .carousel-item {transform:scale(1.1); cursor: pointer}
.hero:after {content: ''; height: 100%; width: 100%; z-index: 1; position: absolute; top: 0; left: 0;}
.hero.hero-10:after { background-color: rgba(0,0,0,.10);}
.hero.hero-15:after { background-color: rgba(0,0,0,.15);}
.hero.hero-20:after { background-color: rgba(0,0,0,.20);}
.hero.hero-25:after { background-color: rgba(0,0,0,.25);}
.hero-int .carousel-item {height: 400px;}
.hero-title {z-index: 22; padding: 0 30px;}
.hero-carousel {height: auto;}
.hero-carousel .hero-title {position: absolute; top: 50%;
  transform: translateY(-50%); left: 0; right: 0;}
.hero-home {height: 100vh !important; min-height: 400px;}
.hero-home .carousel-item {height: 100vh !important; min-height: 400px;}
@media (min-width: 992px) {
  .hero-title {padding: 0 50px;}
  .hero-int .carousel-item {height: 900px;}
}

/* TRIP CARDS
---------------------------
--------------------------- */
.trip-grid {padding-top: 50px; padding-bottom: 0;}
.trip-card {position: relative; width: 100%; height: auto; aspect-ratio: 3/4; background-repeat: no-repeat; background-size: 225%; background-position: center center; margin-bottom: 50px; transition: background-size 1.5s ease-in-out;}
.trip-card:after {content: ''; height: 100%; width: 100%; background-color: rgba(0,0,0,.25); z-index: 1; position: absolute; top: 0; left: 0;}
.trip-card:hover {background-size: 300%; }
.trip-card:hover:after { background-color: rgba(0,0,0,.5);}
.trip-card-name {font-size: 35px; line-height: 1.1; margin-bottom: 50px; z-index: 2}
@media (min-width: 992px) {
  .trip-grid {padding-top: 70px; padding-bottom: 0;}
  .trip-card { margin-bottom: 100px}
  .trip-card-name {font-size: 45px;}
  .trip-grid-row {--bs-gutter-x: 6rem;}
}
@media (min-width: 1200px) {
  .trip-card-name {font-size: 55px;}
  .trip-grid-row {--bs-gutter-x: 8rem;}
}
@media (min-width: 1400px) {
  .trip-grid-row {--bs-gutter-x: 10rem; margin-left: 10%; margin-right: 10%}
}

/* TEAM
---------------------------
--------------------------- */
.team {padding-top: 50px; padding-bottom: 0;}
.team-header {margin-bottom: 50px}
.team-header h2 {margin-bottom: 20px;}
/* .team-member:hover .team-photo {transform: scale(1.2);} */
.team-photo-wrap {display: block; overflow: hidden!important;}
.team-photo { width: 100%; height: auto;  transition: all 1.5s ease-in-out;}
.team-name { font-size: 28px; line-height: 1.1; margin-top: 30px; margin-bottom: 15px;}
.team-title { font-size: 20px; line-height: 1.1;}
.team-modal .team-photo {max-width: 455px; max-height: 455px;}
.team-modal p {margin-top: 30px;}
.team-member {margin-bottom: 40px;}
@media (min-width: 992px) {
  .team {padding-top: 70px; padding-bottom: 0;}
  .team-header {margin-bottom: 70px}
  .team-member {margin: 0 10% 100px 10%;}
  .team-name { font-size: 35px;}
  .team-title { font-size: 26px;}
}

/* CTA
---------------------------
--------------------------- */
.cta {padding-top: 50px; padding-bottom: 50px;}
.cta.bg-purple .h2,
.cta.bg-purple p {color: #fff;}
.cta.bg-purple .btn-primary {border-color: #fff;}

@media (min-width: 992px) {
  .cta {padding-top: 70px; padding-bottom: 70px;}
}

/* TRIP DETAILS
---------------------------
--------------------------- */
.trip-details {padding-top: 30px;}
.detail-silo ul {list-style: none}
.detail-result {font-size: 17px;}
.detail-link {font-size: 13px;}
.detail-link {text-decoration: underline}
.detail-silo.mb-4 {margin-bottom: 30px!important;}

@media (min-width: 768px) {
  .detail-silo {border-left: 1px solid #fff}
  .detail-silo:nth-child(1),
  .detail-silo:nth-child(4) {border: 0}
  .trip-details-5-col .col-lg-4.detail-silo:nth-child(4) {margin-left: 16.66666667%;}
}
@media (min-width: 992px) {
  .trip-details {padding-bottom: 30px;}
}
@media (min-width: 1200px) {
  .detail-silo:nth-child(4) {border-left: 1px solid #fff}
  .detail-silo.mb-xl-0 {margin-bottom: 0!important}
  .trip-details-5-col .col-xl-2 {flex: 0 0 auto; width: 20%; }
  .trip-details-5-col .col-lg-4.detail-silo:nth-child(4) {margin-left: unset;}
}

/* IMAGE/TEXT
---------------------------
--------------------------- */
.image-text {padding-top: 50px; padding-bottom: 50px;}
.image-text .initial-text {font-size: 18px}
.image-text .initial-text a {position: relative; color: #46454b}
.image-text .initial-text a:hover { color: #828dba}
.image-text .initial-text a:focus,
.image-text .initial-text a:active { color: #46454b}
.image-text .initial-text a[aria-expanded=false]:after {content:'+'; margin-left: 5px; }
.image-text .initial-text a[aria-expanded=true]:after {content:'–';  margin-left: 5px;}
.image-text .more-text {margin-top: 10px;}
.image-text-row {margin-bottom: 100px;}
.image-text-row:last-child {margin-bottom: 0;}

@media (min-width: 992px) {
  .image-text {padding-top: 70px; padding-bottom: 70px;}
}

/* CAROUSEL
---------------------------
--------------------------- */
.carousel-intro { padding-top: 50px;}
.slick-slider-carousel { overflow: hidden; margin-left: 0; margin-right: 0; padding: 0 0 50px 0;}
.slick-slides img, .slick-slides iframe {height: 250px; margin: 0 15px; width: auto;}
.slick-slides iframe { height: 250px; width: 520px; background-color: #46454b}

@media (min-width: 768px) {
  .slick-slides img, .slick-slides iframe {height: 350px;}
  .slick-slides iframe { width: 620px; }
}
@media (min-width: 992px) {
  .slick-slides img, .slick-slides iframe {height: 450px;}
  .slick-slides iframe { width: 720px; }
}
@media (min-width: 1200px) {
  .slick-slides img, .slick-slides iframe {height: 500px;}
  .slick-slides iframe { width: 770px; }
}
@media (min-width: 1600px) {
  .slick-slides img, .slick-slides iframe {height: 550px;}
  .slick-slides iframe { width: 820px; }
}

/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 50px;
    height: 50px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
    z-index: 2;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
    opacity: .25;
}
.slick-prev:before,
.slick-next:before {
    opacity: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    z-index: 999;
}

.slick-prev:before {
    content: url(_images/icon-carousel-next.svg);
    -moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
display: inline-block;
}
.slick-next:before { content: url(_images/icon-carousel-next.svg) }
.slick-prev { left: 25px;}
.slick-next { right: 25px; }

@media (min-width: 992px) {
  .slick-slider-carousel {padding-top: 70px; padding-bottom: 70px;}
}

/* GENERAL TEXT
---------------------------
--------------------------- */
.general-text {padding-top: 50px; padding-bottom: 50px; text-align: center;}
.general-text.has-sidebar {text-align: start}
.general-text h1,
.general-text h2,
.general-text h3,
.general-text h4,
.general-text h5,
.general-text h6,
.general-text ul,
.general-text ol,
.general-text p {margin-bottom: 12px}
.general-text img, .general-text iframe {width: 100%; margin: 25px 0;}
.general-text ul,
.general-text ol {margin-left: 20px;}
.general-text a {text-decoration: underline;}

@media (min-width: 992px) {
  .general-text {padding-top: 70px; padding-bottom: 70px;}
  .general-text img, .general-text iframe {width: 90%; margin: 40px 0;}
}

/* FAQs
---------------------------
--------------------------- */
.faqs {padding-top: 50px; padding-bottom: 50px;}
.faq-single {margin-bottom: 35px}
.question {font-size: 24px; line-height: 1.1}
.question a {position: relative; color: #46454b}
.question a:hover { color: #828dba}
.question a[aria-expanded=false]:after {content:'+'; margin-left: 8px; }
.question a[aria-expanded=true]:after {content:'–';  margin-left: 8px;}
.answer {margin-top: 25px; margin-left: 6px;}
.answer ul {margin-left: 20px;}
.answer p a {text-decoration: underline}

@media (min-width: 992px) {
  .faqs {padding-top: 70px; padding-bottom: 70px;}
  .question {font-size: 39px;}
  .answer {font-size: 22px;}
}

/* INCLUDED
---------------------------
--------------------------- */
.whats-included {padding-top: 50px; padding-bottom: 50px;}
.inc-wrap { padding: 35px 40px 2px 40px;}
.inc-heading {font-size: 24px; line-height: 1; margin-bottom: 30px;}
.inc-section { margin: 0 0 45px 15px;}
.inc-subhead {font-size: 22px; line-height: 1; margin-bottom: 12px;}
.inc-list { margin-left: 30px;}
.inc-list li {position: relative; list-style: none; margin-bottom: 5px;}
.inc-list li:before {content:''; width: 18px; height: 18px; position: absolute; left: -23px; top: 4px; background-repeat: no-repeat; background-size: contain;}
.included .inc-list li:before { background-image: url(_images/icon-check-white.svg) }
.not-included .inc-list li:before { background-image: url(_images/icon-x-white.svg) }
.inc-list li a {color: #f7f77c }
.inc-list li a:hover {color: #fff; text-decoration: underline}

@media (min-width: 992px) {
  .whats-included {padding-top: 70px; padding-bottom: 70px;}
  .inc-heading {font-size: 34px;}
  .inc-subhead {font-size: 25px;}
}