/* alert box */

.alert-wrap { background-color:var(--cty-alert-bg); }
.alert-wrap, a.alert-link, a.alert-link:hover { color:var(--cty-alert-txt); }
.alert-hold { display: table; width: 100%; }
.alert-prefix { display:table-cell; vertical-align: top; width:32px; padding-top:20px; padding-right:20px; }
.alert-content { display:table-cell; vertical-align: top; width:auto; padding-top:20px; }
.alert-dismiss { display:table-cell; vertical-align: top; width:32px; padding-top:20px; text-align:right; }

.alert-prefix { 
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
  letter-spacing: 0.100rem;
  padding-bottom:20px;
}

.alert-content { 
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.100rem;
}

.alert-message { padding-bottom:20px; }
a.alert-link { text-decoration:underline; }
a.alert-link:hover { text-decoration:underline; }

.alert-dismiss { 
  font-size:20px;
  line-height:20px; 
  padding-bottom:20px;
}

#dismiss-alert { color:var(--cty-alert-txt); text-decoration:none; }


.video-responsive-heights {
  .op-hero-block { height:500px; }
  @media all and (min-width: 992px) {
    .op-hero-block { height:700px; }
  }
}


/* banner */

.no-banner { width:100%; height:80px; }
.banner-b { position:relative; width:100%; height:360px; background-color:var(--cty-banner-wrap); background-position:center center; background-size:cover; overflow:hidden; }
.banner-wavy-2024 { position:absolute; top:40px; width:100%; height:120px; }
.banner-lower-angle { position:absolute; bottom:0px; width:100%; height:60px; background-color:var(--cty-pagewrap-bg); clip-path: polygon(0 100%, 100% 0, 100% 100%, 0 100%); }

.banner-darken { position:absolute; top:0px; width:100%; height:900px; background-color:rgba(0,0,0,0.40); }
.banner-lets-glow { height:460px; }
.banner-lets-glow-logo { position:absolute; top:140px; width:100%; }

@media all and (min-width: 1200px) {
  .no-banner { height:140px; }
  .banner-b { height:640px;  }
  .banner-wavy-2024 { top:0px; width:100%; height:300px; }
  .banner-lower-angle { height:100px; }
  .banner-lets-glow { height:700px; }
  .banner-lets-glow-logo { position:absolute; top:300px; width:100%; }
}


/* home page video */

.home-dark-blue { background-color:#18162E; }

.home-video { position:relative; overflow:hidden; } 
.home-video-sizer { width:100%; height:550px; }

.home-video-video { position:absolute; z-index:2; top:0px; display: flex; align-items: center; justify-content: center; }
.home-video-video video { width: 100%; height:100%; object-fit: cover; object-position: center; }

.home-video-wavy-cover { 
  position:absolute; 
  z-index:3;
  bottom:0px; 
  width:100%; 
  height:112px;
  border:0px solid pink;
}

.home-welcome { 
  position:relative; 
  z-index:4;
  width:100%;
  padding:0 24px;
}
.home-welcome-hold { 
  outline:0px solid paleturquoise;
  width:100%;
  color: #bcbbfa;
  font-size: 50px;
  line-height: 58px;
  font-weight: 800;
  text-wrap:balance;
  text-align:center;
}

.home-welcome-sub { padding:10px 24px 40px 24px; text-align:center; }
.home-welcome-sub-text { display:block; color:white; font-weight: 600; font-size:1.4rem; text-wrap:balance; padding:12px; }
.home-welcome-sub-cta { display:block; padding:12px 0px; }


@media all and (min-width: 1200px) { 
  .home-video-sizer { height:750px; } 
  .home-video-wavy-cover { height:250px; } 
  .home-welcome { 
    padding: 0 15%;
    max-width: 1800px;
    margin: 0 auto;
    margin-top:-100px; 
  }
  .home-welcome-hold { 
    text-align:right; 
     font-size: 60px;
    line-height: 68px;
  }
  .home-welcome-sub { padding:10px 0px 40px 0px; text-align:right; }
  .home-welcome-sub-text { display:inline; }
  .home-welcome-sub-cta { display:inline; }
}



.home-dahlia-100 { background-color:#dbdaff; }







/* detail header */

.detail-header { width:100%; background:inherit; }
.detail-header h1 { font-size: 3.0rem; margin:0; }
p.header-groups { margin:1rem 0; } 
a.btn-header-groups { background-color:#F0FEF5; color:#3C3869; margin:4px 2px 4px 0px; padding: .375rem .75rem; border-radius:40px; transition: all 0.15s linear 0s;  }
a.btn-header-groups { font-size:14px; font-weight:600; text-transform:none; letter-spacing:0; text-decoration:none; }
a.btn-header-groups:hover { color:#3C3869; background-color:#8CD4AB; text-decoration:none; }

.awesome-box-icon { color:#625d9c; }



/* css for modal backdrop */

.modal-backdrop { background-color: rgb(16, 31, 171); }
.modal-backdrop.show { opacity:0.75; }

#myModal .modal-body h1 { margin-top:1rem; }
#citylightModal .modal-body h1 { margin-top:1rem; }



/* basic lightbox */

.lightbox-wrap { margin-top:1.5rem; }
.lightbox-squares { width:100%; padding-bottom:100%; background-color:var( --cty-bg-card); background-position:center center; background-size:cover; }



/* solr search */

.site-search-nav { display:table; margin:24px 0px; }
.site-search-nav-control { display:table-cell; vertical-align:middle; padding-right:16px; border:0px solid #eee; }
.site-search-nav-counter { display:table-cell; font-style:italic; padding-right:16px; border:0px solid #eee; }

ul.site-search { margin:10px 0px; padding:0; list-style-type:none; }
ul.site-search li { margin-bottom:16px; }
ul.site-search li span.solr_type { display:block; text-transform:uppercase; font-size:12px; line-height:18px; font-weight:700; letter-spacing:0.100rem; }
ul.site-search li a { font-size:20px; line-height:30px; }
ul.site-search li span.solr_highlight { display:block; font-size:15px; line-height:22px; }
ul.site-search li span.solr_highlight em { font-style:normal; font-weight:700; }


/* cafe-weather */

.cafe-weather { width:100%; max-width:300px; border:1px solid#666; border-radius:1rem; padding:1rem 2rem; margin:1.5rem 0; }
.cafe-weather-today { text-align:center; color:inherit; font-weight: 500; font-size:1rem; line-height:1.1; letter-spacing:0.050rem; text-transform:uppercase; }
.cafe-weather-divider { width:100%; height:2px; opacity:0.25; background-color:#aaa; margin:0.5rem 0; }
.cafe-weather-current { text-align:center; color:inherit; font-weight: 400; font-size:1rem; line-height:1.1; }
.cafe-weather-future { text-align:center; color:inherit; font-weight: 400; font-size:1.5rem; line-height:1.1; }



/* image roll */

.image-roll-hold { background-color:transparent; }

.imagerollSwiper .swiper-wrapper { width:100%; height:500px; position:relative; }

.imagerollSwiper .swiper-slide {
  text-align: center;
  font-size: 18px;
  background-color: black;
  display: flex;
  justify-content: center;
  align-items: center;
}

.imagerollSwiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.imagerollSwiper .swiper-navigation {
  position: absolute;
  z-index: 999;
  bottom: 30px;
  right: 30px;
  background-color: var(--cty-pink);
  border-radius: 30px;
  width: 96px;
  height: 48px;
}

.swiper-roll-prev, .swiper-roll-next { display:block; width:48px; height:48px; font-size:24px; line-height:48px; text-align:center; float:left; color:white; opacity:0.85; }

.swiper-roll-prev:hover { opacity:1; }
.swiper-roll-next:hover { opacity:1; }



/* sharing-box */

.sharing-box { display:table; margin:10px auto; }
.sharing-label { display:table-cell; text-align:center; padding:10px; }
.sharing-icons { display:table-cell; text-align:center; }
.sharing-square { display:inline-block; text-align:center; margin:10px; }
.sharing-square a { display:inline-block; width:40px; height:40px; font-size:18px; line-height:38px; text-align:center;  }
.sharing-square a { text-decoration:none; color:white; background-color:var(--cty-alink); border:none; transition: all 0.15s linear 0s;}
.sharing-square a:hover { color:white; background-color:var(--cty-ahover); }
.share-cta { font-size:14px; line-height:16px; letter-spacing:0.100rem; font-weight:700; text-transform:uppercase; }
@media all and (min-width: 9999999px) {
	.sharing-box { display:block; margin-top:0px; }
	.sharing-label { display:block; }
	.sharing-icons { display:block; }
	.sharing-square { display:block; margin:20px 10px; }
}



/* sf hero header */

.sf-hero-header {
  position:relative;
  width:100%;
  height:600px;
}
.sf-hero-header-image {
  position:absolute;
  top:0; 
  left:0;
  width:100%;
  height:100%;
  background-position: center center;
  background-size:cover;
}

.sf-hero-header-overlay {
  position:absolute;
  top:0; 
  left:0;
  width:100%;
  height:100%;
  background: linear-gradient(180deg, rgba(24, 22, 46, 0) 53%, rgba(24, 22, 46, 0.38) 100%);
}

.sf-hero-header-text {
  position:absolute;
  bottom:0; 
  left:0;
  width:100%;
  height:auto;
}
.sf-hero-header-text h1 {
  font-size: 3rem; 
  font-weight:800; 
  text-transform:uppercase;
  word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
}
@media screen and (min-width: 992px) {
  .sf-hero-header { height:800px; }
  .sf-hero-header-text h1 { font-size:3.6rem; }
}





/* Main Container */

.op-image-before-after figure { margin:0 0 2rem 0; }

.slim-comparison-container {
  position: relative;
  width: 100%;
  height: 400px; height:auto; /* jwb */
  box-sizing: border-box;
  overflow: hidden;
  -moz-user-select: none;
  -ms-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -webkit-transition: height 0.2s ease-in-out;
  -moz-transition: height 0.2s ease-in-out;
  -o-transition: height 0.2s ease-in-out;
  transition: height 0.2s ease-in-out;
  max-height: 500px; /* Add your desired max-height here */ /* jwb */
  max-height: none; /*jwb*/
}

.slim-comparison-container * {
  box-sizing: border-box;
}

.slim-comparison-container .slim-before-wrapper img,
.slim-comparison-container .slim-after-wrapper img {
  max-width: initial !important;
}

/* Wrapper Elements */
.slim-comparison-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

/* CHANGES HERE FOR MAX HEIGHT */
.slim-before-wrapper, 
.slim-after-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.slim-before-wrapper {
  z-index: 2;
  width: 50%;
}

.slim-after-wrapper {
  z-index: 1;
}

.slim-after-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Captions */
.slim-before-caption,
.slim-after-caption {
  position: absolute;
  margin-top: -12px;
  background-color: var(--cty-dahlia-dark);
  color: white;
  font-weight: 700;
  text-transform:uppercase;
  font-size:12px;
  line-height:24px;
  /* text-shadow: 0px 0px 2px black; */
  padding: 0 10px;
  left: 24px;
  text-decoration: none;
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}

.slim-caption-hover .slim-before-caption,
.slim-caption-hover .slim-after-caption {
  opacity: 1;
}

.slim-after-caption {
  left: auto;
  right: 24px;
}

/* Caption Positioning */
.slim-caption-position-top .slim-before-caption,
.slim-caption-position-top .slim-after-caption {
  top: 10px;
  margin-top: 0;
}

.slim-caption-position-bottom .slim-before-caption,
.slim-caption-position-bottom .slim-after-caption {
  top: auto;
  margin-top: 0;
  bottom: 10px;
}

/* Hover Effects */
.slim-comparison-container:hover .slim-before-caption,
.slim-comparison-container:hover .slim-after-caption {
  opacity: 1;
}

/* Separator/Handle */
.slim-separator {
  z-index: 10;
  position: absolute;
  width: 44px;
  height: 44px;
  border: solid 3px #FFFFFF;
  border-color:#FFFFFF!important;
  border-radius: 50%;
  background-color:var(--cty-dahlia-dark);
  top: 50%;
  margin-top: -22px;
  left: 50%;
  margin-left: -22px;
  cursor: e-resize;
  -webkit-box-shadow: 0 0 20px rgba(55, 55, 55, 0.8);
  box-shadow: 0 0 20px rgba(55, 55, 55, 0.8);
}

/* Separator Lines */
.slim-before-line {
  bottom: 100%;
  background-color:#FFFFFF!important;
}

.slim-after-line {
  top: 100%;
  background-color:#FFFFFF!important;
}

.slim-before-line,
.slim-after-line {
  content: '';
  width: 3px;
  position: absolute;
  height: 10000px;
  background-color: #FFFFFF;
  left: 50%;
  margin-left: -1.5px;
  -webkit-box-shadow: 0 0 12px rgba(55, 55, 55, 0.5);
  box-shadow: 0 0 12px rgba(55, 55, 55, 0.5);
}

/* Separator Arrows */
.slim-before-arrow {
  left: 0;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-right-color: white;
  border-width: 8px;
  margin-top: -8px;
}

.slim-after-arrow {
  right: 0;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-left-color: white;
  border-width: 8px;
  margin-top: -8px;
}



/* Utility Classes */
.slim-hide-separator .slim-separator {
  opacity: 1;
}

/* Loading Animation */
.slim-comparison-loader {
  position: absolute;
  z-index: 15;
  background-color: rgba(255, 255, 255, 1);
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}

.slim-lds-ellipsis {
  display: inline-block;
  position: absolute;
  width: 64px;
  height: 64px;
  left: 50%;
  margin-left: -32px;
  top: 50%;
  margin-top: -32px;
}

.slim-lds-ellipsis div {
  position: absolute;
  top: 27px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #58b368;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.slim-lds-ellipsis div:nth-child(1) {
  left: 6px;
  animation: slim-lds-ellipsis1 0.6s infinite;
}

.slim-lds-ellipsis div:nth-child(2) {
  left: 6px;
  animation: slim-lds-ellipsis2 0.6s infinite;
}

.slim-lds-ellipsis div:nth-child(3) {
  left: 26px;
  animation: slim-lds-ellipsis2 0.6s infinite;
}

.slim-lds-ellipsis div:nth-child(4) {
  left: 45px;
  animation: slim-lds-ellipsis3 0.6s infinite;
}

/* Keyframe Animations */
@keyframes slim-lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes slim-lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}

@keyframes slim-lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(19px, 0);
  }
}