/* alert box */

.alert-wrap { background-color:var(--cms-camel); }
.alert-wrap, a.alert-link, a.alert-link:hover { color:white; }
.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:white; text-decoration:none; }



/* banner */

.no-banner { width:100%; }
.banner-b { width:100%; height:240px; background-color:#fafafa; background-position:center center; background-size:cover;}
@media all and (min-width: 992px) {
  .banner-b { height:390px; }
}


/* district banner drops */

.banner-drop { width:100%; height:80px; border-top:7px solid #444;}
.banner-drop-bg { width:100%; height:80px; text-align:center; }
.banner-drop-bg img { margin:0 auto; }

.drop-arts-district { border-color:#eb5654;}
.drop-arts-district .banner-drop-bg { background:url('https://ctycms.com/ca-liberty-station/repeating-bg_arts-sub.png') center center; }
.drop-the-quarter { border-color:#f8a03e;}
.drop-the-quarter .banner-drop-bg { background:url('https://ctycms.com/ca-liberty-station/repeating-bg_quarter-sub.png') center center; }
.drop-ntc-park { border-color:#758f5e;}
.drop-ntc-park .banner-drop-bg { background:url('https://ctycms.com/ca-liberty-station/repeating-bg_ntc-park-sub.png') center center; }
.drop-the-neighborhood { border-color:#50949d;}
.drop-the-neighborhood .banner-drop-bg { background:url('https://ctycms.com/ca-liberty-station/repeating-bg_neighborhood-sub.png') center center; }
.drop-south-point { border-color:#133b4a;}
.drop-south-point .banner-drop-bg { background:url('https://ctycms.com/ca-liberty-station/repeating-bg_south-point-sub.png') center center; }




/* liberty home header */

.liberty-hero-block {
  position: relative;
  display: flex;
  min-height: inherit;
  align-items: center; /* center vertically */
  justify-content: center; /* center horizontally */
  overflow: hidden;
  height:450px;
  min-height:450px;
}

.liberty-hero-block-video {
  position: absolute;
  width: 100%; 
  height:100%; 
  object-fit: cover; 
  object-position: center;
}

.liberty-hero-block-cover {
  position: absolute;
  width: 100%; 
  height:100%; 
  background-color:rgba(35, 31, 32,0.2);
}

.liberty-hero-block-content {
  position: relative;
  text-align: center;
  padding: 3rem;
  width:100%;
  max-width: 768px;
}

.liberty-hero-block-content div { width:173px; margin:0 auto; }

@media all and (min-width: 768px) {
  .liberty-hero-block { height:768px } 
  .liberty-hero-block-content div { width:618px; margin:0 auto; }
}





/* home bento */

.home-bento { width:100%; }
.home-bento-left { width:100%; }
.home-bento-right { width:100%; }
a.home-bento-link { display:block; width:100%; text-decoration:none; }
.home-bento-img { display:table; width:100%; background-size:cover; background-position:center center; }
.home-bento-img > div { display:table-cell; width:100%; text-align:center; vertical-align:middle; padding:30px; 
  background-color: rgba(0,0,0,0.25);
  box-shadow: inset 0 0 90px rgba(0,0,0,0.85);
  transition: all 600ms ease;}
.home-bento-img > div > span { color:white; text-shadow:0 0 2px black; font-size: 1.35rem; line-height: 1.4; font-weight: 700; text-transform: uppercase; text-wrap:balance; letter-spacing:0.050rem; }

.home-bento-img1 { height:400px; }
.home-bento-img2 { height:340px; }
.home-bento-img3 { height:360px; }
.home-bento-img4 { height:360px; }


.home-bento-twins { display:table; width:100%; }
.home-bento-twin { display:table-cell; width:50%; }

.home-bento-trip-row { display:block; width:100%; }
.home-bento-trip-cella { display:block; width:100%; height:360px; }
.home-bento-trip-cellb { display:block; width:100%; height:360px; }
  
@media all and (min-width: 992px) {
  .home-bento { display:table; width:100%; }
  .home-bento-left { display:table-cell; width:35%; vertical-align:top; }
  .home-bento-right { display:table-cell; width:65%; vertical-align:top;  }
  
  .home-bento-img1 { height:700px; }
  .home-bento-img2 { height:340px; }
  .home-bento-img3 { height:360px; }
  .home-bento-img4 { height:360px; }
  
  .home-bento-trip-row { display:table; width:100%; }
  .home-bento-trip-cella { display:table-cell; width:35%; vertical-align:top; height:360px; }
  .home-bento-trip-cellb { display:table-cell; width:32.5%; vertical-align:top; height:360px; }
}


/* feature card home  */

.nav-card-gallery { margin-top:50px; }

.feature-card { height:100%; }
.feature-card a { display:block; height:100%; background-color:white; text-decoration:none; color:var(--cms-black); }
.feature-card-image { width:100%; padding-bottom:80%; background-color:white; background-size:cover; background-position:center center; }

.feature-card-content { 
  background-color:white; 
  padding:1.5rem; 
}
.feature-card-content-subhead { 
  /*font-weight:400; 
  text-transform:uppercase; 
  font-family: 'Steelfish';
  letter-spacing: 0.5px; margin-bottom:8px; font-size:20px; */
  font-size:0.7rem; line-height:1.4; font-weight:500; margin-bottom:10px; text-transform:uppercase; letter-spacing:0.050rem; 
}

.feature-card-content-headline { font-size:1.25rem; line-height:1.3; font-weight:700; margin-bottom:10px; text-transform:uppercase; letter-spacing:0.050rem; }
.feature-card-content-body { font-size:0.9rem; line-height:1.4; margin-bottom:16px; }
.feature-card a .feature-card-content-linklabel { font-size:0.9rem; color:var(--cms-camel); font-weight:500; }
.feature-card a:hover .feature-card-content-linklabel { color:var(--cms-camel); }



/* detail header */

.detail-header { width:100%; background:#fafafa; border-bottom: 1px solid #eee; }
.detail-header h1 { font-size: 3.0rem; margin:0; }

p.header-groups { margin:1rem 0; } 
a.btn-header-groups { background-color:inherit; padding:4px 8px; margin:3px 1px; border-radius:4px; transition: all 0.15s linear 0s;  }
a.btn-header-groups { font-size:13px; line-height:15px; letter-spacing:0.050rem; font-weight:700; text-transform:uppercase; 
  color:var(--cty-alink); border:2px solid var(--cty-alink); text-decoration:none; }
a.btn-header-groups:hover { color:var(--cty-ahover); border-color:var(--cty-ahover); text-decoration:none; }





/* 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; }



/* image roll */

.image-roll-hold { background-color:#eee; }

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

.imagerollSwiper .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  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: black;
  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(--cms-camel); border:none; transition: all 0.15s linear 0s;}
.sharing-square a:hover { color:white; background-color:var(--cms-camel); }
.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; }
}

/* post detail banner */

.banner-post {
  display:block;
  clear:both;
  width:100%;
  min-height:160px;
  background-color:#eee;
  background-position: center center; background-size: cover;
  position:relative;
}
.banner-dim { position:absolute; width:100%; height:100%; background-color:rgb(0,0,0,0.25); }
.banner-table { position:relative; display:table; width:100%; height:160px; }
.banner-tr { display:table-row; width:100%; height:100%; }
.banner-td { display:table-cell; width:100%; height:100%; padding:24px; text-align:center; vertical-align:middle; }
.banner-td { color: #fff;
font-weight:700;
text-align: center;
text-transform: uppercase;
font-size: 24px;
line-height:30px;}
.banner-td span { display:block; font-weight:400; font-style:italic; text-transform:none; font-size:16px; line-height:22px; margin-top:16px;}
.banner-hero-content { width:100%; max-width:475px; padding:40px; margin:0 auto; }
	
@media all and (min-width: 768px) { 
  .banner-post { min-height:390px; }
  .banner-table { height:360px; }
  .banner-td { font-size:52px; line-height:60px; } 
  .banner-td span { font-size:24px; line-height:32px; margin-top:30px;} 
  .banner-hero-content { max-width:760px; margin:0 auto; }
}



/* Covid Dining */

.pcovid { background-color:white; padding:16px 20px; height:100%; }

.pcovid a { text-decoration:none; }

.pcovid h2 { margin:0 0 12px 0; font-size:42px; line-height:1.5; text-transform:uppercase; font-family: 'Steelfish'; letter-spacing: 0.5px; font-weight:400; }
.pcovid p { margin:0 0 6px 0; }

.pcovgroups { font-style:italic; font-size:14px; line-height:1.3; margin:-3px 0 8px 0px; }

.pcovid-options { margin:12px 0px; }

.pcovid-options > div { margin:12px 0px; font-weight:700;}

.pcovid-option-icons { display:inline-block; width:30px; height:30px; font-size:16px; line-height:30px; border-radius:50%; text-align:center; }
.pcovid-option-icons { text-decoration:none; color:#fff; background-color:var(--cms-camel); border:none; margin-right:4px; }

.pcovid p.covid-narrative { font-size:16px; line-height:1.5; margin:0; }



/* basic contact google map */

.contact-table { display:block; width:100%; background-color:#fff; border:2px solid #fff; margin-top:30px; margin-bottom:50px;}
.contact-tr { display:block; width:100%;}
.contact-td { display:block; }
.contact-td-map { width:100%;}
.contact-td-text { width:100%; text-align:center; padding:30px; }
.contact-td-map #gmap { width:100%; height:300px; background-color:#E6E4E0; }
@media all and (min-width: 768px) { 
	.contact-table { display:table; width:100%; border:16px solid #fff;}
	.contact-tr { display:table-row; width:100%;}
	.contact-td { display:table-cell; vertical-align:middle;}
	.contact-td-map { width:60%;}
	.contact-td-text { width:40%; padding-left:40px; text-align:left;}
	.contact-td-map #gmap { width:100%; height:560px; background-color:#E6E4E0; }
}




/* basic timline */

.our-story-est {
  text-align:center;
  color: #eb534f;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
  margin-top:30px;
  margin-bottom: 45px;
}

.our-story-lead {
  text-align:center;
  font-weight:700; 
  font-size: 24px;
  line-height: 35px;
}

.our-history-dot { margin:0 auto; padding-bottom:24px; }
.our-history-close { margin:0 auto; }
.timeline { margin-top:65px; margin-bottom:20px; }
@media all and (min-width: 768px) {
	.timeline { background-image: url('https://ctycms.com/ca-liberty-station/history-bg-stripe.svg'); background-repeat: repeat-y; background-position: center; }
}

.time { margin-bottom: 50px; }
.time-later { margin-top:90px; }
.time-last { margin-bottom: 50px; margin-top:0px; }

.timeline h2 {
  display: inline-block;
  padding: 5px 10px;
  margin: 0 0 65px;
  font-size: 48px;
  line-height:52px;
  border: 3px solid #eb534f;
  background-image: url('https://ctycms.com/ca-liberty-station/bg-body.png');
  text-transform:uppercase;
  color: #231f20;
  font-family: 'Steelfish';
  letter-spacing: 0.5px;
  font-weight: 400;
}


.ost-domino { display:block; width:100%; padding:40px 0px; }
.ost-tr { display:block; width:100%;}
.ost-td-image { display:block; width:100%;}
.ost-td-text { display:block; width:100%;}
p.osd-right { text-align:center; padding:20px 0px 0px 0px;}
p.osd-left { text-align:center; padding:20px 0px 0px 0px;}
.ost-visible-xs { display:block; }
.ost-hidden-xs { display:none; }
@media all and (min-width: 768px) {
	.ost-domino { display:table; }
	.ost-tr { display:table-row;}
	.ost-td-image { display:table-cell; vertical-align:middle; width:60%; }
	.ost-td-text { display:table-cell; vertical-align:middle; width:40%; }
	p.osd-right { text-align:left; padding:0px 0px 0px 50px;}
	p.osd-left { text-align:right; padding:0px 50px 0px 0px;}
	.ost-visible-xs { display:none; }
	.ost-hidden-xs { display:block; }
}


a.history-videos { color:#222; text-decoration:none; padding:20px 0px; }
a.history-videos:hover { color:#222; text-decoration:underline;}




/* event banner */

#banner-event, #banner-event-tall {
  display:block;
  clear:both;
  width:100%;
  height:160px;
  background-color:#eee;
  background-position: center center; background-size: cover;
  position:relative;
}
#banner-event-tall { height:380px;}

.banner-label { width:100%; height:auto; background-color:rgba(0,0,0,0.50); position:absolute; bottom:0px; color:#fff; padding:24px 24px; text-align:center; }
.banner-label span { 
font-family:'Steelfish'; letter-spacing:0.5px; font-weight:400; font-size:50px; line-height:50px; text-transform:uppercase;
color: #fff;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);}
@media all and (min-width: 768px) { 
	#banner-event, #banner-event-tall{ height:390px; }
	#banner-event-tall { height:580px; }
	.banner-label span { font-size:70px; line-height:70px; } 
}


/* arts-district */

.arts-hero { position:relative; width:100%; height:350px; background-size: cover; }

.cycle-slideshow { width:100%; height:100%;}
.arts-cycle { position:absolute; display:block; width:100%; height:100%; z-index:1;}
.arts-cycle-image { width:100%; height:100%; background-size: cover; background-position: center center; }
.arts-cycle-cover { position:absolute; width:100%; height:100%; background-color:#003957; opacity:0.6; z-index:2;}
.arts-hero-hold { position:absolute; display:table; width:100%; height:100%; z-index:3;}
.arts-hero-tr { display:table-row; }
.arts-hero-td { display:table-cell; text-align:center; vertical-align:middle; padding:24px; }
.arts-hero-content { width:100%; max-width:560px; margin:0 auto; }
@media all and (min-width: 768px) { 
	.arts-hero { height:400px; }
}