.rsvp-btn.expo-expired {
  cursor: no-drop;
  background: #fff;
  color: gray;
}

.city-name-float {
  margin-top: 0;
  border: solid 0px #be1f24;
}

.callout-box-sp {
  width: 100%;
  text-align: center;
  margin-top: 0rem;
  margin-bottom: 0.5rem;
}

/*
.rsvp-btn {
  font-family: "Roboto", sans-serif;
  padding: 1rem 1.5rem;
  font-size: 1.125rem;
  line-height: normal;
  color: #b20;
  font-weight: normal;
  border-radius: 5px;
  background: #fff;
  width: 100%;
  border: solid 1px #b20;
  box-shadow: 1px 2px 3px rgb(0 0 0 / 5%);
  margin-bottom: 0.5rem;
}*/

.rsvp-title-new {
  color: #fff;
  font-size: 1.25rem;
  line-height: 1.3;
  font-weight: 600;
}

.callout-box p {
  margin-bottom: 0;
}

.sub-text {font-size:13px; display:block; margin-top:-5px; opacity:.8;}

/* PHONE VIEW */
@media only screen and (max-width: 40.063em) {
  .rsvp-title-new {
    color: #fff;
    font-size: 1rem;
    line-height: 1.3;
    font-weight: 600;
  }
}

/*new style 2025*/
.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400 !important,
    /* weight */ "GRAD" 0, "opsz" 48 !important;
  font-size: 36px;
}

.callout-box {
  max-width: 100%;
  background: ;
  border-radius: 20px;
  border: solid 0px #ddd;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0);
  padding: 2rem;
  color: #fff !important;
}

.hero-callout-icon {
  margin-right: 1rem;
}

.hero-callout {
  display: flex;
  align-items: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
  padding: 1rem;
  background: #fff;
  border-radius: 8px;
  margin-bottom: 1rem;
  font-size: 1rem;
  line-height: 22px;
  color: #333 !important;
}

.blue-gradient {
  background: linear-gradient(90deg, #1e8de8 0%, #13b5ea 100%);
  color: #fff;
}

.green-gradient {
  background: linear-gradient(270deg, #7ac143 0%, #39c072 100%);
}

.pink-gradient {
  background: linear-gradient(90deg, #d60d8c 0%, #fb1fab 100%);
}

.orange-gradient {
  background: linear-gradient(270deg, #f18c21 0%, #f15f21 100%);
}

.purple-gradient {
  background: linear-gradient(90deg, #27318b 0%, #a236ac 100%);
}

.grey-gradient {
  background: linear-gradient(90deg, #737373 0%, #b8b8b8 100%);
}

.grey-bg {
  width: 100%;
  margin: 5rem 0 0 0;
  background: linear-gradient(0deg, #d9d9d9 0%, #f0f0f0 100%);
  padding: 2rem 0 5rem 0;
}

.blue-txt {
  color: #13b5ea !important;
}

.green-txt {
  color: #7ac143 !important;
}

.pink-txt {
  color: #fb1fab !important;
}

.orange-txt {
  color: #f18c21 !important;
}

.purple-txt {
  color: #a236ac !important;
}

.button.big {
  border: none;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 4px 18px rgba(0, 0, 0, 0.2);
  padding: 1rem 3rem;
  font-size: 1.25rem;
  font-family: "Roboto", sans-serif;
  position: relative;
}

.button.big:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  opacity: 0;
  transition: opacity 0.25s;
  left: 0;
  top: 0;
}

.button.big:hover:before {
  opacity: 1;
}

h1 {
  font-family: "Lato", sans-serif;
  font-size: 3.5rem;
  line-height: 4rem;
  font-weight: 400;
  color: #fff;
  letter-spacing: 0.05rem;
}

h2 {
  font-size: 2rem;
  font-family: "Lato", sans-serif;
  color: #000;
  letter-spacing: 0.05rem;
  line-height: 3rem;
  font-weight: bold;
  font-style: normal;
  padding-bottom: 1rem;
  margin-bottom: 0;
  margin-top: 5vh;
}

h2.sub-head {
  font-size: 1.5rem;
  font-family: "Roboto", sans-serif;
  color: #fff;
  letter-spacing: 0.05rem;
  line-height: 2rem;
  font-style: normal;
  margin-top: 0;
}

h2.why {
  margin-top: 0;
}

h3 {
  font-size: 1.5rem;
  line-height: normal;
  font-weight: bold;
  font-family: "Lato", sans-serif;
  margin: 0;
  padding: 0;
}

h4 {
  font-size: 1.5rem;
  line-height: normal;
  font-weight: normal;
  font-family: "Lato", sans-serif;
  margin: 1.5rem 0 1.25rem 0;
  padding: 0;
}

p {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.875rem;
  font-family: "Roboto", sans-serif;
}

li {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.875rem;
  font-family: "Roboto", sans-serif;
}

table.city-info {
  background: none;
  margin: 1rem 0 1.25rem 0;
}

table.city-info tr {
  background: none;
}

table.city-info td {
  background: none;
  padding: 0;
  font-size: 0.938rem;
  color: #333;
  line-height: 1.5rem;
}

table.city-info tr td:first-child {
  text-align: center;
}

table.city-info tr td:last-child {
  padding-left: 0.5rem;
}

table.city-info .fa {
  color: #999;
  font-size: 1rem;
}

table.school-info td {
  background: none;
  padding: 0;
  font-size: 0.938rem;
  color: #333;
  line-height: 1.5rem;
}

table.school-info {
  background: none;
  margin: 0;
}

table.school-info tr {
  background: none;
}

.section-head {
  margin-top: 6rem;
  margin-bottom: 3rem;
  text-align: center;
}

.button.city-reg {
  width: 100%;
  font-family: "Roboto", sans-serif;
  font-size: 1rem;
  box-shadow: none;
  border-radius: 5px;
  margin: 0;
  border: none;
  padding: 0.613rem 1.5rem;
  opacity: 1;
  transition: all 0.25s;
  position: relative;
}

.button.city-reg:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  opacity: 0;
  transition: opacity 0.25s;
  left: 0;
  top: 0;
}

.button.city-reg:hover:before {
  opacity: 1;
}

.city-image {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  height: 145px;
  width: 100%;
  border-radius: 10px 10px 0 0;
  display: block;
  position: relative;
}

.city-image:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 10px 10px 0 0;
  opacity: 0;
  transition: opacity 0.25s;
  left: 0;
  top: 0;
}

.city-image:hover:before {
  opacity: 1;
}

.city-tile {
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 8px 30px rgba(0, 0, 0, 0.1),
    0 4px 8px rgba(0, 0, 0, 0.05);
  margin-bottom: 2rem;
}

.outline-tile {
  border-radius: 20px;
  background: #fff;
  border: solid 2px #ebebeb;
  margin-bottom: 2rem;
  padding: 1.5rem;
  color: #333;
  text-align: left;
  font-family: "Roboto", sans-serif;
  font-size: 1rem;
  line-height: 1.675rem;
}

.shadow-tile {
  border-radius: 20px;
  background: #fff;
  border: solid 0px #ebebeb;
  margin-bottom: 2rem;
  padding: 1.5rem;
  color: #333;
  text-align: left;
  font-family: "Roboto", sans-serif;
  font-size: 1rem;
  line-height: 1.675rem;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 8px 30px rgba(0, 0, 0, 0.1),
    0 4px 8px rgba(0, 0, 0, 0.05);
}

.school-tile {
  border-radius: 10px;
  background: #fff;
  border: solid 0px #ebebeb;
  margin-bottom: 1.5rem;
  padding: 1rem;
  color: #333;
  text-align: left;
  font-family: "Roboto", sans-serif;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 8px 30px rgba(0, 0, 0, 0.1),
    0 4px 8px rgba(0, 0, 0, 0.05);
}

.school-tile h3 {
  font-size: 1.125rem;
  line-height: normal;
  padding: 0 0 0.5rem 0;
  margin: 0;
}

.icon-wrapper {
  height: 75px;
  width: 75px;
  justify-content: center;
  align-items: center;
  border-radius: 15px;
  display: flex;
  color: #fff;
}

.programs-expand {
  padding: 6px 12px;
  cursor: pointer;
  color: #fff;
  border-radius: 3px;
  font-weight: bold;
  font-size: 14px;
  line-height: normal;
  font-family: "Roboto", sans-serif;
  margin: 2rem auto;
  transition: all 0.125s;
  position: relative;
}

.programs-expand.toronto {
  background: #13b5ea;
}
.programs-expand.vancouver {
  background: #7ac143;
}
.programs-expand.haltonpeel {
  background: #fb1fab;
}
.programs-expand.calgary {
  background: #f18c21;
}
.programs-expand.ottawa {
  background: #a236ac;
}

.programs-expand:before {
  content: "Show full school list";
}
.programs-expand.show:before {
  content: "Hide full school list";
}
.programs-wrapper {
  max-height: 500px;
  position: relative;
  justify-items: center;
}

.programs-expand:after {
  content: "\f0d7";
  font-family: "FontAwesome";
  font-size: 2rem;
  position: absolute;
  left: 45%;
  top: -2.75rem;
}

.programs-expand.toronto:after {
  color: #13b5ea;
}
.programs-expand.vancouver:after {
  color: #7ac143;
}
.programs-expand.haltonpeel:after {
  color: #fb1fab;
}
.programs-expand.calgary:after {
  color: #f18c21;
}
.programs-expand.ottawa:after {
  color: #a236ac;
}

.white-gradient {
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(
    0deg,
    rgba(255, 255, 255, 1) 40%,
    rgba(255, 255, 255, 0) 100%
  );
  background: -webkit-linear-gradient(
    0deg,
    rgba(255, 255, 255, 1) 40%,
    rgba(255, 255, 255, 0) 100%
  );
  background: linear-gradient(
    0deg,
    rgba(255, 255, 255, 1) 40%,
    rgba(255, 255, 255, 0) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

.expo-hero-25 {
  height: 92vh;
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  min-height: 700px;
}

.faq-acc {
  background: none;
}

.faq-acc li.accordion-item {
  background: none;
  margin-bottom: 1rem;
  border-radius: 8px !important;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 8px 30px rgba(0, 0, 0, 0.1),
    0 4px 8px rgba(0, 0, 0, 0.05);
  border: none;
}

.faq-acc a.accordion-title {
  border-radius: 8px !important;
  border: none;
  background: #fff;
  padding: 1.5rem;
  font-family: "Roboto", sans-serif;
  font-size: 1.25rem;
  line-height: normal;
  font-weight: bold;
  text-decoration: none;
  transition: all 0.25s;
  display: flex;
  align-items: center;
  padding-right: 3.5rem;
}

.faq-acc a.accordion-title:hover {
  background: #f1f1f1;
}

.faq-acc li.accordion-item.is-active a.accordion-title {
  border-radius: 8px 8px 0 0 !important;
  border: none;
  display: flex;
  padding-right: 3.5rem;
}

.accordion-title:before {
  font-family: "FontAwesome";
  content: "\f107";
  right: 1.5rem;
  margin-top: -0.55rem;
}

.faq-acc.toronto a {
  color: #13b5ea;
}
.faq-acc.vancouver a {
  color: #7ac143;
}
.faq-acc.haltonpeel a {
  color: #fb1fab;
}
.faq-acc.calgary a {
  color: #f18c21;
}
.faq-acc.ottawa a {
  color: #a236ac;
}

.accordion-title .material-symbols-outlined {
  font-size: 35px;
  line-height: 24px;
  display: inline-block;
  width: 54px;
  min-width: 54px;
  color: #ccc;
}

.register-form {
  border-radius: 8px;
  font-family: "Roboto", sans-serif;
  font-size: 1.125rem;
  padding: 0.75rem 1.5rem;
  margin: 0 auto;
}

.close-button {
  background: none !important;
  color: #999 !important;
  box-shadow: none;
  padding: 0;
}

.is-active > .accordion-title::before {
  font-family: "FontAwesome";
  content: "\f106";
  color: #13b5ea;
  right: 1.5rem;
  margin-top: -0.55rem;
}

.faq-acc .accordion-content {
  border-radius: 0 0 8px 8px;
  border: none;
  padding: 0.5rem 1.5rem 1.5rem 1.5rem;
}

.city-info {
  padding: 1.5rem 1.75rem 1.75rem 1.75rem;
}

.why-wrapper {
  width: 80%;
  border-radius: 20px;
  height: 120%;
  min-height: 800px;
  position: absolute;
  z-index: -1;
  margin: 0 auto;
}

/*ken burns slideshow*/

.slideshow {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
}

.hero-image {
  position: absolute;
  width: 100%;
  height: 100%;
  background: no-repeat 50% 50%;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.slideshow-image {
  position: absolute;
  width: 100%;
  height: 100%;
  background: no-repeat 50% 50%;
  background-size: cover;
  -webkit-animation-name: kenburns;
  animation-name: kenburns;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 24s;
  animation-duration: 24s;
  opacity: 1;
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}
.slideshow-image:nth-child(1) {
  -webkit-animation-name: kenburns-1;
  animation-name: kenburns-1;
  z-index: 3;
}
.slideshow-image:nth-child(2) {
  -webkit-animation-name: kenburns-2;
  animation-name: kenburns-2;
  z-index: 2;
}
.slideshow-image:nth-child(3) {
  -webkit-animation-name: kenburns-3;
  animation-name: kenburns-3;
  z-index: 1;
}
.slideshow-image:nth-child(4) {
  -webkit-animation-name: kenburns-4;
  animation-name: kenburns-4;
  z-index: 0;
}

@-webkit-keyframes kenburns-1 {
  0% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  1.5625% {
    opacity: 1;
  }
  23.4375% {
    opacity: 1;
  }
  26.5625% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  98.4375% {
    opacity: 0;
    -webkit-transform: scale(1.21176);
    transform: scale(1.21176);
  }
  100% {
    opacity: 1;
  }
}
@keyframes kenburns-1 {
  0% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  1.5625% {
    opacity: 1;
  }
  23.4375% {
    opacity: 1;
  }
  26.5625% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  98.4375% {
    opacity: 0;
    -webkit-transform: scale(1.21176);
    transform: scale(1.21176);
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes kenburns-2 {
  23.4375% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  26.5625% {
    opacity: 1;
  }
  48.4375% {
    opacity: 1;
  }
  51.5625% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}
@keyframes kenburns-2 {
  23.4375% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  26.5625% {
    opacity: 1;
  }
  48.4375% {
    opacity: 1;
  }
  51.5625% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}
@-webkit-keyframes kenburns-3 {
  48.4375% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  51.5625% {
    opacity: 1;
  }
  73.4375% {
    opacity: 1;
  }
  76.5625% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}
@keyframes kenburns-3 {
  48.4375% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  51.5625% {
    opacity: 1;
  }
  73.4375% {
    opacity: 1;
  }
  76.5625% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}
@-webkit-keyframes kenburns-4 {
  73.4375% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  76.5625% {
    opacity: 1;
  }
  98.4375% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes kenburns-4 {
  73.4375% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  76.5625% {
    opacity: 1;
  }
  98.4375% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/*.faq-acc .accordion-content p {font-size: 1rem; line-height:1.75rem;}*/

.expo-header {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2rem auto;
  text-align: center;
  flex-direction: row; /* default layout for large screens */
  gap: 1rem;
}

.city-hero {
  font-family: "Lato", sans-serif;
  font-size: 3.5rem;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.2rem;
  line-height:normal;
  text-align: left;
}

.city-hero-date {display:block; font-size:1rem; line-height:1.125rem;}

@media screen and (max-width: 63.9375em) {
  /* Foundation medium breakpoint: max-width 1023px */
  .expo-header {
    flex-direction: column;
  }
  .city-hero {
    font-size: 2rem;
    line-height: normal;
    margin-top: -1rem;
    text-align: center;

  }

  .city-hero-date {}

  .expo-header img {
    margin-right: 0;
  }
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
  h1 {
    font-size: 2.875rem;
    line-height: 3.75rem;
    margin-top: 10%;
    padding-top: 0;
  }

  .why-wrapper {
    width: 100%;
    height: 120%;
  }
}

/* Small only */
@media screen and (max-width: 39.9375em) {
  h1 {
    font-size: 1.913rem;
    line-height: 2.25rem;
    margin-top: 10%;
    padding-top: 0;
  }

  .button.big {
  font-size: 1.125rem;
}

  table.city-info {
    background: none;
    margin: 0.75rem 0;
  }

  .why-wrapper {
    width: 100%;
    height: 120%;
  }

  .expo-hero-25 {
    height: 50vh;
    background: ;
    color: #fff;
    min-height: 500px;
  }

  .expo-header {
    margin: 1rem auto;
  }

  .city-image {
    background-position: 50% 30%;
    height: 90px;
  }

  .city-info {
    padding: 1rem 1.25rem 1.25rem 1.25rem;
  }

  .city-tile {
    margin-bottom: 1.25rem;
  }

  h2 {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }

  .outline-tile {
    border-radius: 10px;
    background: #fff;
    margin-bottom: 1rem;
    padding: 1.25rem;
  }

  .outline-tile h4 {
    margin-top: 0;
    font-size: 1.5rem;
  }

  .icon-wrapper {
    height: 60px;
    width: 60px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
  }
}

/*from vo*/

.event-module {
  max-width: 100%;
  margin: 2rem auto;
  background: white;
  border-radius: 8px;
  border: solid 2px #ddd;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0);
  overflow: hidden;
}

.map-container {
  height: 300px;
  background: #f0f0f0;
  position: relative;
  overflow: hidden;
}

.map-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #a8e6cf 0%, #dcedc1 50%, #ffd3a5 100%);
  position: relative;
}

.map-marker {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -100%);
  color: #e91e63;
  font-size: 2rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.event-details {
  padding: 2rem;
}

.event-date {
  display: flex;
  align-items: center;
  margin-bottom: 1.5rem;
}

.date-icon {
  background: #e91e63;
  color: white;
  width: 50px;
  height: 50px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
  font-size: 1.5rem;
}

.date-info h3 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
  color: #333;
}

.date-info p {
  margin: 0.25rem 0 0 0;
  color: #666;
  font-size: 1rem;
}

.event-location {
  display: flex;
  align-items: flex-start;
}

.location-icon {
  background: #e91e63;
  color: white;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.location-info h4 {
  margin: 0 0 0.5rem 0;
  font-size: 1.25rem;
  font-weight: 700;
  color: #333;
  font-family: "Lato", sans-serif;
}

.location-info p {
  margin: 0.25rem 0;
  color: #666;
  line-height: 1.4;
  font-family: "Roboto", sans-serif;
}

.parking-info {
  color: #666;
  font-size: 0.95rem;
  margin-top: 0.5rem;
}

/* Responsive adjustments */
@media screen and (max-width: 640px) {
  .event-module {
    margin: 1rem;
  }

  .event-details {
    padding: 1.5rem;
  }

  .map-container {
    height: 250px;
  }
}

/* end vo */

/*Carousel*/

.inset-border {
  position: relative;
  padding: ; /* Enough space to accommodate the border if needed */
}

.inset-border::before {
  content: '';
  position: absolute;
  top: 0;   /* Adjust to control how far in the border is */
  left: 0;
  right: 0;
  bottom: 0;
  border-radius:10px;
  border: 3px solid #fff;
  pointer-events: none; /* Ensures it doesn't block clicks */
  z-index: 1; /* Make sure it sits above content if needed */
}

.link-txt {
  color: #13b5ea !important;
}

.video-wrapper {
  visibility: hidden;
}

.slick-dots li button {
  box-shadow: none;
}
.slick-dots li button:before {
  font-size: 8px;
}
.slick-prev,
.slick-next {
  box-shadow: none;
}
.slick-prev:before,
.slick-next:before {
  color: #999;
  font-size: 24px;
 
}

.inset-border {
  position: relative;
  display:inline-block;
  padding: 0; 
  border-radius:10px;/* Enough space to accommodate the border if needed */
}

.inset-border::before {
  content: '';
  position: absolute;
  top: 0;   /* Adjust to control how far in the border is */
  left: -1px;
  right: -1px;
  bottom: 0;
  border: 3px solid #fff;
  pointer-events: none; /* Ensures it doesn't block clicks */
  z-index: 2; /* Make sure it sits above content if needed */
}

.slick-prev:before { content:"\f053";
  font-family: 'FontAwesome'; font-size:2rem;}

.slick-next:before { content:"\f054";
  font-family: 'FontAwesome'; font-size:2rem;}

.slick-prev {left: ;}
.slick-next {right: ;}
/* Large and up */
@media screen and (min-width: 64em) {
  .video-wrapper {
    background: #FFF;
background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 100%);
    position: absolute;
opacity:.4;
    z-index: 2;
    width: 100%;
    height: 100%;
    visibility: hidden;
    pointer-events: none;
  }

  .slick-dotted.slick-slider {border-left:solid 0px #ccc; border-right:solid 0px #ccc;padding:1.5rem 0;}
}