/* buttons */

/*
.btn-brand { background-color:var(--cc-alink); border:1px solid var(--cc-alink); color:white; font-size:14px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem;
  margin:4px 2px 4px 0px; padding: .375rem .75rem; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-brand:hover { background-color:var(--cc-ahover); border-color:var(--cc-ahover); color:white; text-decoration:none; }
*/

.btn-brand { background-color:var(--ctybrandgreen); border:1px solid var(--ctybrandgreen); color:var(--ctybrandblack); font-size:0.85rem; font-weight:700; text-transform:none; letter-spacing:0rem;
  margin:4px 2px 4px 0px; padding: .5rem .9rem; border-radius:40px; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-brand:hover { background-color:var(--ctybrandgreen); border-color:var(--ctybrandgreen); color:var(--ctybrandblack); text-decoration:none; }


.bg-green .btn-brand { background-color:var(--ctybrandpurple); border:1px solid var(--ctybrandpurple); color:white; }
.bg-green .btn-brand:hover { background-color:var(--ctybrandpurple); border:1px solid var(--ctybrandpurple); color:white; }

.bg-thanksgiving .btn-brand { background-color:#971033; border:1px solid #971033;; color:white; }
.bg-thanksgiving .btn-brand:hover { background-color:#971033;; border:1px solid #971033; color:white; }


.btn-outline-brand { background-color:white; border:1px solid var(--cc-alink); color:var(--cc-alink); font-size:14px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem; 
 margin:4px 2px 4px 0px; padding: .375rem .75rem; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-outline-brand:hover { background-color:var(--cc-ahover); border-color:var(--cc-ahover); color:white; text-decoration:none; }

.btn-brand-pill { background-color:var(--cc-alink); border:1px solid var(--cc-alink);  color:white; font-size:12px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem; border-radius:20px; 
  margin:4px 2px 4px 0px; padding: .275rem 1rem; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-brand-pill:hover {  background-color:var(--cc-ahover); border-color:var(--cc-ahover); color:white; text-decoration:none; }

.btn-outline-brand-pill { background-color:white; border:1px solid var(--cc-alink); color:var(--cc-alink); font-size:12px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem; border-radius:20px; 
  margin:4px 2px 4px 0px; padding: .275rem 1rem; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-outline-brand-pill:hover { background-color:var(--cc-ahover); border-color:var(--cc-ahover); color:white; text-decoration:none; }

.btn-naked { color:var(--cc-alink); text-transform:uppercase; letter-spacing:0.050rem; margin:4px 2px 4px 0px; padding: .375rem 0rem; transition: all 0.15s linear 0s; }
.btn-naked:hover { color:var(--cc-ahover); }

.btn-subscribe { background-color:var(--ctybrandred); border:1px solid white; color:white; font-size:0.85rem; font-weight:700; text-transform:none; letter-spacing:0rem; 
  margin:4px 2px 4px 0px; padding: .5rem .9rem; border-radius:40px; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-subscribe:hover { background-color:white; border-color:white; color:var(--ctybrandred); text-decoration:none; }
 

/* squiggles */

.green-squiggle { width:100%; height:32px; background:url('https://ctycms.com/md-silver-spring/green-squiggle-g.svg') center center; background-size: 120px 32px;  }
.blue-squiggle { width:100%; height:32px; background:url('https://ctycms.com/md-silver-spring/blue-squiggle-g.svg') center center; background-size: 120px 32px;  }



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


/* photo card */

.photo-card { display:block; width:100%; text-decoration:none; background-color:#222; }
.photo-card .photo-card-img { background-position: center center; background-size:cover; }

.photo-card-cover { width:100%; height:500px; padding:40px; background-color:rgba(0,0,0,0.2); transition: all .4s; }
.photo-card-cover { display:flex; align-items: center; justify-content: center; }
.photo-card-content { color:white; text-shadow: 1px 1px 1px #444; }

.photo-card a { text-decoration:none; }
.photo-card a:hover .photo-card-cover { background-color:rgba(0,0,0,0.4); }

.photo-card-subhead { border-bottom:1px solid white; text-align:center; font-size:1rem; font-weight:500; padding-bottom:10px; }
.photo-card-subhead-alt { border-top:1px solid white; text-align:center; font-size:1rem; font-weight:500; padding-top:10px; }
.photo-card-headline { font-family:var(--ssdisplayfont); text-align:center; font-size:2rem; line-height:1.25; font-weight:900; margin:10px 0; }
.photo-card-cta { text-align:center; margin-top:1rem; }	
.photo-card-cta span { border:1px solid white; font-size:14px; font-weight:500; text-transform:none;  
margin:4px 2px 4px 0px; padding: .275rem .95rem; border-radius:40px; } 



/* home events slider */

.EventsCarouselSwiper .swiper-slide .carousel-card-image { transition: opacity 0.35s linear 0s;  }
.EventsCarouselSwiper .swiper-slide-active .carousel-card-image { opacity:1; }
.EventsCarouselSwiper .swiper-slide-prev .carousel-card-image { opacity:0.5; }
.EventsCarouselSwiper .swiper-slide-next .carousel-card-image { opacity:0.5; }

a.carousel-card { display:block; width:100%; height:100%; position:relative; background-color:white; text-decoration:none; border-top:8px solid  var(--ctybrandblue)}

.carousel-card-image { position:relative; width:100%; }
.carousel-card-image-image-large { width:100%; padding-bottom:100%; background-position:center center; background-size:cover; }
.carousel-card-image-image-small { width:100%; padding-bottom:50%; background-position:center center; background-size:cover; }
@media all and (min-width: 992px) {
  .carousel-card-image-image-large { width:100%; padding-bottom:50%; background-position:center center; background-size:cover; }
  .carousel-card-image-image-small { width:100%; padding-bottom:80%; background-position:center center; background-size:cover; }
}

.carousel-card-content { padding:24px; text-align:left; }
.carousel-card-content-headline { font-family: var( --ssdisplayfont), sans-serif; font-size:1.6rem; font-weight:700; margin-bottom:2px; }
/*.carousel-card-content-body { }
.carousel-card-content-more {  }*/

.ccpost-date-box { position:absolute; top:0px; left:14px; background-color:var(--ctybluelight); color:var(--ctybrandblack); text-align:center; padding:6px 0; width:50px;}
.ccpost-date-dow { font-size:12px; line-height:16px;  }
.ccpost-date-day { font-size:20px; line-height:26px;  }
.ccpost-date-month { font-size:12px; line-height:16px; text-transform:uppercase; letter-spacing:0.100rem; }


/* image roll */

.image-roll-hold { background-color:var(--ctybrandpale); }

.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: var(--ctybrandpurple);
  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; }



/* banner */

.no-banner { width:100%;  }

.banner-b { width:100%; height:300px; background-position:center center; background-size:cover;}
@media all and (min-width: 992px) {
  .banner-b { height:360px; }
}

.banner-no-images { width:100%; height:160px; background-color:var(--ctybrandblue); }

.banner-text { width:100%; border-top:1px solid #eee;  }
.banner-hold { width:100%; max-width:900px; padding:80px 40px 40px 40px; margin:0 auto; }
.banner-hold h1 { font-weight:700; }



/* detail header */

.full-color { width:100%; background:var(--cc-banner-wrap); }
.detail-header { width:100%; background:var(--cc-banner-wrap); }
.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(--cc-alink); border:2px solid var(--cc-alink); }
a.btn-header-groups:hover { color:var(--cc-ahover); border-color:var(--cc-ahover); }

.detail-header-pattern {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'%3E%3Cdefs%3E%3Cpath id='a' d='M482 107c66-220-54-465-262-562C-110-608-507-350-500 7A522 522 0 00-39 499c245 19 454-169 521-392z' vector-effect='non-scaling-stroke'/%3E%3Cg id='v' %3E%3Cpath id='b' d='M-20 500c-275 0-473-289-480-535s221-458 480-465S474-389 498-67 255 500-20 500z' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23d' transform='scale(.7)'/%3E%3Cuse href='%23e' transform='scale(.45)'/%3E%3Cuse href='%23c' transform='scale(.225)'/%3E%3C/g%3E%3Cg id='w' transform=''%3E%3Cpath id='c' d='M493 94C456 435-11 610-319 415-656 201-502-478 17-496c319-11 514 249 476 590z' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23e' transform='scale(.7)'/%3E%3Cuse href='%23f' transform='scale(.45)'/%3E%3Cuse href='%23d' transform='scale(.225)'/%3E%3C/g%3E%3Cg id='x' transform=''%3E%3Cpath id='d' d='M-49-497c468-39 549 357 549 478S419 533-23 498s-504-332-469-606 295-377 443-389z' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23f' transform='scale(.7)'/%3E%3Cuse href='%23b' transform='scale(.45)'/%3E%3Cuse href='%23e' transform='scale(.225)'/%3E%3C/g%3E%3Cg id='y' transform=''%3E%3Cpath id='e' d='M-163-482c-380 92-425 642-204 866S483 505 499 98c17-407-281-671-662-580z' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23b' transform='scale(.7)'/%3E%3Cuse href='%23c' transform='scale(.45)'/%3E%3Cuse href='%23f' transform='scale(.225)'/%3E%3C/g%3E%3Cg id='z' transform=''%3E%3Cpath id='f' d='M-96-493c134-22 280 6 400 86 309 209 229 680-72 853-343 198-848-182-708-627A462 462 0 01-96-493z' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23c' transform='scale(.7)'/%3E%3Cuse href='%23d' transform='scale(.45)'/%3E%3Cuse href='%23b' transform='scale(.225)'/%3E%3C/g%3E%3Cpattern id='p' width='2000' height='2000' patternUnits='userSpaceOnUse' patternTransform='scale(0.07) translate(6642.86 6642.86)'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-width='40.5' stroke-miterlimit='4000' stroke-linejoin='miter'%3E%3Cuse href='%23z'/%3E%3Cuse href='%23z' x='2000'/%3E%3Cuse href='%23z' x='2000' y='2000'/%3E%3Cuse href='%23z' y='2000'/%3E%3Cuse href='%23y' x='999' y='999'/%3E%3Cuse href='%23x' x='500' y='500'/%3E%3Cuse href='%23x' x='2500' y='500'/%3E%3Cuse href='%23x' x='500' y='2500'/%3E%3Cuse href='%23x' x='2500' y='2500'/%3E%3Cuse href='%23w' x='500' y='1500'/%3E%3Cuse href='%23w' x='500' y='-500'/%3E%3Cuse href='%23w' x='2500' y='-500'/%3E%3Cuse href='%23w' x='2500' y='1500'/%3E%3Cuse href='%23w' x='1500' y='500'/%3E%3Cuse href='%23w' x='-500' y='500'/%3E%3Cuse href='%23w' x='-500' y='2500'/%3E%3Cuse href='%23w' x='1500' y='2500'/%3E%3Cuse href='%23x' x='1500' y='1500'/%3E%3Cuse href='%23x' x='-500' y='1500'/%3E%3Cuse href='%23x' x='1500' y='-500'/%3E%3Cuse href='%23x' x='-500' y='-500'/%3E%3Cuse href='%23y' x='' y='999'/%3E%3Cuse href='%23y' x='2000' y='999'/%3E%3Cuse href='%23v' x='999' y='0'/%3E%3Cuse href='%23v' x='999' y='2000'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23p)' width='100%25' height='100%25'/%3E%3C/svg%3E");
  background-size: cover;
}


/* sidenav drawer */



.d-sidenav { width:100%; }

.d-sidenav-section { display:table; width:100%; background-color:white; padding:4px 0; border-bottom:1px solid var(--ctybrandblack); }
.d-sidenav-section-label { display:table-cell; text-align:left; width:auto; vertical-align:top; font-size:18px; line-height:24px; }
.d-sidenav-section-label a { display:block; font-size:28px; line-height:28px; padding:10px 12px 10px 24px; color:var(--ctybrandblack); font-family:var( --ssdisplayfont); text-decoration:none; margin-right:40px; }
.d-sidenav-section-label a:hover { color:var(--ctybrandblack); text-decoration:none;  }
.d-sidenav-section-toggle { display:table-cell; font-size:20px; line-height:28px; text-align:right; width:60px; vertical-align:top; cursor:pointer; }
.d-sidenav-section-toggle a { display:block; padding:10px 24px 10px 12px; color:var(--ctybrandblack); text-decoration:none; }
.d-sidenav-section-toggle a:hover { color:var(--ctybrandblack); text-decoration:none; }
#d-sidenav-drawer { display:none; }
@media all and (min-width: 992px) {
  .d-sidenav-section { padding:2px 0; }
	.d-sidenav-section-label { display:block; width:100%; }
  .d-sidenav-section-label a { margin-right:0; }
	.d-sidenav-section-toggle { display:none;  }
	#d-sidenav-drawer { display:block!important; }
}

.d-sidenav ul { padding:0; margin:0; }
.d-sidenav > ul { border-bottom:1px solid var(--cc-linework); } 
.d-sidenav li { padding:0; margin:0; list-style:none; }

.d-sidenav li .li-flex { display:flex; }

.d-sidenav > ul > li { border-bottom:1px solid var(--cc-linework); }
.d-sidenav > ul > li:last-child { border-bottom:none; }

.d-sidenav li ul { padding-bottom:16px; }
.d-sidenav li ul li { padding:4px 0px; }

.d-sidenav li a {
  display:table;
  width:100%; 
  text-decoration:none;
  font-weight:400;
}

.d-sidenav li.d-open { background-color:var(--cc-pagewrap-bg); }

.d-sidenav li a div.sn-indicator { display:table-cell; width:36px; text-align:left; padding:14px 0px 14px 20px; font-weight:400; font-size:14px; line-height:24px; vertical-align:top; color:var(--ctybrandblack); }
.d-sidenav li a div.sn-label { display:table-cell; width:auto; text-align:left; padding:14px 20px 14px 0px; font-weight:400; font-size:1rem; line-height:24px; vertical-align:top; color:var(--ctybrandblack); }
.d-sidenav li a div.sn-label-nested { display:table-cell; width:100%; text-align:left; padding:4px 20px 4px 50px; font-weight:400; font-size:0.9rem; line-height:24px; vertical-align:top; color:var(--ctybrandblack); }
.d-sidenav li a:hover div { color:var(--cc-ahover); }

.d-sidenav li.d-open a div.sn-indicator { color:var(--cc-pagewrap-txt); }
.d-sidenav li.d-selected div.sn-indicator { color:var(--cc-pagewrap-txt)!important; }
.d-sidenav li.d-selected div.sn-label { color:var(--cc-pagewrap-txt); }

.d-sidenav li.d-sub-selected div.sn-label-nested { color:var(--cc-pagewrap-txt)!important; }
















/* home page topango carousel */

.topango-wrap { padding:0; margin:0; }
.topango-slide { width:100%; height:auto; }
.topango-relative { position:relative; width:100%; height:auto; }
.topango-image { display:block; z-index:10; position:relative; background-size: cover; background-position: center center; }
.topango-cover { display:block; z-index:11; position:absolute; top:0px; background-color:rgba(0,0,0,0.15); }
.topango-text { display:block; z-index:12; position:absolute; top:0px;}
.topango-x { display:table; }
.topango-y { display:table-cell; vertical-align:middle; text-align:center;}

.topango-image, .topango-cover, .topango-text,.topango-x, .topango-y { width:100%; height:400px; }
@media all and (min-width: 768px) { .topango-image, .topango-cover, .topango-text,.topango-x, .topango-y { height:600px; }}
@media all and (min-width: 992px) { .topango-image, .topango-cover, .topango-text,.topango-x, .topango-y { height:700px; }}

.topango-y { text-align:center; padding:0 60px; }
.topango-headline { color:white; font-weight:700; font-size:28px; line-height:36px; margin:40px 0 10px 0; text-shadow: 1px 1px 1px var(--cc-h1); }
.topango-link { padding-top:20px; }
@media all and (min-width: 768px) {
	.topango-y { text-align:center; padding:0 15%; }
	.topango-headline { color:white; font-weight:700; font-size:58px; line-height:58px; margin:50px 0 20px 0; max-width:600px; }
}
@media all and (min-width: 992px) {
	.topango-y { text-align:left; padding:0 15%; }
	.topango-headline { color:white; font-weight:700; font-size:68px; line-height:68px; margin:50px 0 20px 0; }
}

.cycle-pager { display:none; }
.cycle-next { position: absolute; z-index: 300; right:5%; top: 50%; margin-top:-42px; width: 44px; height: 84px; display: block; cursor: pointer; }
.cycle-prev { position: absolute; z-index: 301; left: 5%; top: 50%; margin-top:-42px; width: 44px; height: 84px; display: block; cursor: pointer; }
@media all and (max-width: 767px) {
	.cycle-next, .cycle-prev { width:22px; height:42px; background-size:cover; margin-top:-21px; }
}

/* home page video */

.home-video { position:relative; overflow:hidden; } 

.home-video-sizer { width:100%; height:340px; }
@media all and (min-width: 768px) { .home-video-sizer { height:675px; } }

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

.hero-video-darken { position:absolute; top:0px; z-index:3; display:flex; align-items:center; justify-content: center; background-color:rgba(0,0,0,0.25); }
.hero-video-content-hold { max-width:900px; text-align:center; }
.hero-video-content { padding:120px 24px 90px 24px; }
.hero-video-content h1 { color:white; text-shadow: 0px 0px 4px #222; }
.hero-video-content p { color:white; text-shadow: 0px 0px 4px  #222; }

/* home page video 

.hero-wrap {
  position: relative;
  width:100%; height:56vh; min-height:400px; max-height:800px;
  top: 0;
  overflow:hidden;
  background:white;
}

#hero-video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 1;
  -ms-transform: translate(-50%, -50%) scale(1.01);
  -moz-transform: translate(-50%, -50%) scale(1.01);
  -webkit-transform: translate(-50%, -50%) scale(1.01);
  transform: translate(-50%, -50%) scale(1.01);	
}
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }


.hero-video-darken { position: absolute; z-index: 101; display:table; width:100%; height:100%; background-color:rgba(0,0,0,0.25); }
.hero-video-content { display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle; padding:90px 24px; }
.hero-video-content-wrap { max-width:560px; margin: auto; }
.hero-video-content-wrap h1 { color:white; font-size:22px; line-height:34px; text-shadow: 1px 1px 0px #005480; }
.hero-video-content-wrap p { color:white; margin:16px 0 0 0; }
@media all and (min-width: 768px) {
	.hero-video-content-wrap h1 { font-size:32px; line-height:46px;   }
}
@media all and (min-width: 992px) {
  .hero-video-content {  padding:210px 24px 90px 24px; }
}

.hero-video-control { position:absolute; z-index:102; top:20px; right:20px; width:50px; height:50px; background-color:rgba(0,0,0,0.7); border-radius:50%; }
.hero-video-control a { display:block; width:50px; font-size:14px; line-height:50px; text-align:center; color:white; }


/* citylight social grid */

.citylight-social-grid { width:100%; border-left:0px solid white; border-bottom:0px solid white; background-color:black; }

.citylight-social-square {
  display:block;
  background-size:cover;
  background-position:center center;	
  float:left;
  position: relative;
  margin:0px;
  overflow:hidden;
  border-right:0px solid white;
  border-top:0px solid white;
}

.citylight-social-square { width: 50%; padding-bottom : 50%; }
@media all and (min-width: 768px) { .citylight-social-square { width: 33.33%; padding-bottom : 33.33%; } }
@media all and (min-width: 992px) { .citylight-social-square { width: 20%; padding-bottom : 20%; } .citylight-social-square-6 { display:none; } }

.citylight-social-square-cover { position:absolute; width:100%; height:100%; background-color:rgba(0,0,0,0.05); transition: all 0.15s linear 0s; }
.citylight-social-square:hover .citylight-social-square-cover { background-color:rgba(0,0,0,0.35); }
.citylight-social-square-icon { position:absolute; bottom:8%; left:8%; color:white; font-size:22px; line-height:22px; }
@media all and (min-width: 768px) { 
   .citylight-social-square-icon { bottom:16%; left:16%; font-size:28px; line-height:28px; }
}


/* feature card */

.feature-card { display:block; }
.feature-card-image { position:relative; }
.feature-card-image-img { position:relative; background-color:white; }
.feature-card-image-tag { position:absolute; bottom:-15px; display:inline-block; font-size:14px; line-height:30px; padding:0 8px; background-color:var(--cc-ahover); color:white; text-transform:uppercase; }
.feature-card-image-div3x2 { width:100%; padding-bottom:66%; background-color:#eee; background-size:cover; background-position:center center; }
.feature-card-content { background-color:white; padding:30px 30px 20px 30px; }
.feature-card-content-headline { color:var(--cc-h1); font-size:1.35rem; line-height:1.4; font-weight:700; margin-bottom:6px; }
.feature-card-content-body { color:var(--cc-h2); font-size:1.1rem; line-height:1.4; margin-bottom:12px; }
.feature-card a .feature-card-content-linklabel { color:var(--cc-alink); text-decoration:none; font-weight:700; }
.feature-card a:hover .feature-card-content-linklabel { color:var(--cc-ahover); text-decoration:none; }


/* basic lightbox */

.lightbox-wrap { margin-top:30px; }
.lightbox-squares { width:100%; padding-bottom:100%; background-color:var(--cc-banner-wrap); background-position:center center; background-size:cover; margin-bottom:30px; }


/* basic landing */

.nav-card-gallery { margin:48px 0 0 0; }
.nav-card-margin { margin-bottom:48px; }
.nav-card { width:100%; height:100%; background-color:#fff; border-radius:6px; overflow:hidden; 
  -webkit-box-shadow: 0px 0px 8px 0px rgba(177,158,144,0.25);
  -moz-box-shadow: 0px 0px 8px 0px rgba(177,158,144,0.25);
  box-shadow: 0px 0px 8px 0px rgba(177,158,144,0.25);
}
.nav-card a { display:block; }
.nav-card a .nav-card-image { position:relative; width:100%; padding-bottom:66.66%; background-color:#eee; margin-bottom:12px; overflow:hidden;  }
.nav-card a .nav-card-image-bg {  position:absolute; top:0; width:100%; height:100%; background-position:center center; background-size:cover; transition: all .5s; }
.nav-card a .nav-card-image-cover { position:absolute; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.0); transition: all .5s;  }
.nav-card a:hover .nav-card-image-bg { transform: scale(1.02); }

.nav-card-content { width:100%; height:100%; background-color:#fff; padding:10px 20px 20px 20px; text-align:center; }
.nav-card-content-headline { color: inherit; font-weight: 700; font-size: 20px; line-height: 25px;}



/* basic snake */

.snake-wrap { width:100%; background-color:var(--cc-banner-wrap); }
.snake-container { width:100%; max-width:1200px; background-color:white; margin:0 auto; }
.snake-row { display:block; }
.snake-image { display: block; width:100%; padding-bottom: 90%; background-size:cover; background-position:center center; }
.snake-content { display: block; background-color:white; padding:30px; }
@media all and (min-width: 576px) {
	.snake-image { padding-bottom: 50%; }
}
@media all and (min-width: 768px) {
	.snake-row { display:flex; }
	.snake-row-alternate { flex-direction: row-reverse; }
	.snake-image { width:50%; padding:0; }
	.snake-content { width:50%; padding:60px; }
}
@media all and (min-width: 992px) {
	.snake-content { padding:90px; }
}

/* basic staff */

.basic-staff { margin:24px 0; }
.staff-card { margin-bottom:24px; }
.staff-picture-hold { max-width:240px; margin:36px auto 22px auto; }
.staff-picture { width:100%; padding-bottom:100%; border-radius:50%; background-position:center center; background-size:cover;  }
.staff-name { text-align:center; font-weight: 700; font-size:20px; line-height:1.3; margin-bottom:4px; }
.staff-title { text-align:center; font-weight: 400; font-size:18px; line-height:1.3; margin-bottom:4px; }
.staff-body { text-align:center; font-weight: 400; }








/* point-section */

#point-section #clmap { width:100%; height:60vh; min-height:200px; max-height:700px; background-color:#E6E4E0; border-top:1px solid #eee; border-bottom:1px solid #eee; }

.section-filters { margin:1.5rem 0; }
.section-filters .section-filters-title { text-align:center; color:#222; font-size:14px; line-height:16px; letter-spacing:0.100rem; font-weight:700; text-transform:uppercase; margin:0 0 14px 0;}
.section-filters ul { list-style:none; margin:0; padding:0 ;}
.section-filters li { display:inline; margin:0; padding:0; }
.section-filters a {
font-weight:600;
text-decoration: none;
font-size: 0.8rem;
line-height:1;
text-align: center;
display:inline-block;
color:var(--cty-default-txt-darker);
background-color:white;
border:2px solid var(--ctybrandblue);
border-radius:24px;
padding:0.5rem 0.75rem;
white-space: nowrap;
margin:4px 3px;
text-transform:none;
}
.section-filters a:hover { background-color:var(--ctybrandpurple); border-color:var(--ctybrandpurple); color:white; text-decoration: none; }
.section-filters a.selected { background-color:var(--ctybrandpurple); border-color:var(--ctybrandpurple); color:white; }

.point-section-results { margin:30px 0px; }

.pst { margin-bottom:24px; }
.pst-topline { border-top:1px solid #eee; padding-top:8px; }
.pst a { display:block; }

.pst a .pst-image { position:relative; width:100%; padding-bottom:66.66%; background-color:#eee; margin-bottom:12px; }
.pst a .pst-image-bg { position:absolute; top:0; width:100%; height:100%; background-position:center center; background-size:cover; }
.pst a .pst-image-cover { position:absolute; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.1); transition: all .5s;}
.pst a:hover .pst-image-cover { background-color:rgba(0,0,0,0.5);  }


/* point section sticky */

.sticky-wrap { width:100%; background-color:var(--ctybrandpale); color:var(--cty-default-txt-darker); }
.sticky-hold { display:block; }
.sticky-content { width:100%; background-color:var(--ctybrandpale); padding:1.5rem; min-height:100px; }
.sticky-map { width:100%; height:90vh; min-height:420px; background-color:#E8E0D8; }
#stickymap { width:100%; height:90vh; background-color:#E8E0D8; }
@media all and (min-width: 992px) {
	.sticky-hold { display:flex; width:100%; max-width:1900px; margin:0 auto; background-color:#000; min-height:100vh; }
	.sticky-content { flex: 1 1 auto; height:auto; padding:2.5rem; }
	.sticky-map { flex: 1 1 auto; height:auto; }
	#stickymap { width:100%; height:100vh; top:0px; position: sticky; position: -webkit-sticky; /* need for safari */ }
}
@media all and (min-width: 1200px) {
  .sticky-content { padding:3.5rem; }
}



/* point-detail */

.point-social-icons { margin:24px 0; text-align:left;}
.point-social-icons a { display:inline-block; width:30px; height:30px; font-size:15px; line-height:30px; border-radius:50%; text-align:center; margin:0 12px 0 0; }
.point-social-icons a { text-decoration:none; color:white; background-color:var(--cc-alink); border:none; transition: all 0.15s linear 0s;}
.point-social-icons a:hover { color:white; background-color:var(--cc-ahover); }

#point-detail { margin-left:-24px; margin-right:-24px; border-top:1px solid #E6E4E0; border-bottom:1px solid #E6E4E0;}
#point-detail #clmap { width:100%; height:50vh; min-height:150px; max-height:500px; background-color:#E6E4E0; border-top:2px solid white; border-bottom:2px solid white; }
@media all and (min-width: 992px) {
	#point-detail #clmap { border:2px solid white; }
	#point-detail { margin-left:0px; margin-right:0px; border: 1px solid #E6E4E0; }
}

.ftn { text-align:center; }
.ftn h4 { text-align:center; }
.ftn ul { margin:20px 0px; padding:0; }
.ftn li { list-style-type: none; padding:10px 0px; margin:0; border-bottom:1px solid #eee6e8;}
.ftn li:last-child { border-bottom:0;}
.ftnname { display:block; font-size:110%;}
.ftnaddress { font-size:80%; color:#000; }
.ftndistance { font-size:80%; color:#666;}








/* bbq-events-calendar */
  
:root {
  /*
  --cc-alink: #1976D2; 
  --cc-ahover: #2196F3;
  --cc-asec-link: #222; 
  --cc-asec-hover: #444; 
  --cc-asec-divider: #aaa; 
  */
  
  --cc-bbq-bg: #ffffff; /* header bg and calendar bg */
  --cc-bbq-lns: #eaeaea; /* linework between dates and calendar rows and tags */
  --cc-bbq-bgtxt: #666; /* color of days of the week + empty dates */
  
  --cc-bbq-month: #fff;
  --cc-bbq-month-bg: #333;
  --cc-bbq-day: #333;
  --cc-bbq-day-bg: #eee;
  --cc-bbq-dow: #333;
  --cc-bbq-dow-bg: inherit;
  
  --cc-bbq-highlight: #1976D2; 
  --cc-bbq-highlight-bg: #eeeeee;  
  --cc-bbq-hover: #ffffff; 
  --cc-bbq-hover-bg: #2196F3; 
}


.bbq-results-header { display:table; width:100%; margin:0; padding:0; background-color:var(--cc-bbq-bg); border:1px solid var(--cc-bbq-lns); border-bottom:0; font-size:16px; line-height:1.5; padding:12px 0px; }
.bbq-results-header-left { display:table-cell; width:40px; vertical-align:middle; text-align:center; }
.bbq-results-header-middle { display:table-cell; width:auto; vertical-align:middle; text-align:center; font-weight:700; }
.bbq-results-header-right { display:table-cell; width:40px; vertical-align:middle; text-align:center; }

.bbq-results-list { width:100%;}

.bbq-row { display:block; width:100%; border-top:1px solid var(--cc-bbq-lns); padding:20px 0px; }
.bbq-row-homepage { border-top:0px; padding:12px 0px; }
.bbq-row-date { display:block; width:100%; text-align:center; }
.bbq-row-list { display:block; width:100%; text-align:center; }
@media all and (min-width: 768px) {
  .bbq-row { display:table; }
  .bbq-row-date { display:table-cell; vertical-align:top; width:70px; text-align:center; padding-right:30px; }
  .bbq-row-list { display:table-cell; vertical-align:top; width:auto; text-align:left; }
}

.bbqdate { width:70px; margin:0 auto 24px auto; padding:0; }
@media all and (min-width: 768px) { .bbqdate { margin:0; }}

.bbqdate-month { text-align:center; color:var(--cc-bbq-month); background-color:var(--cc-bbq-month-bg); font-size:12px; line-height:21px; border-radius:4px 4px 0px 0px; margin-top:5px;}
.bbqdate-day { text-align:center; color:var(--cc-bbq-day); background-color:var(--cc-bbq-day-bg); font-size:30px; line-height:41px; border-radius:0px 0px 4px 4px;}
.bbqdate-tip { text-align:center; color:var(--cc-bbq-dow); background-color:var(--cc-bbq-dow-bg); font-size:12px; line-height:16px; margin-top:5px; }
.bbqdate-ongoing { text-align:center; color:var(--cc-bbq-month); background-color:var(--cc-bbq-month-bg); font-size:12px; line-height:21px; border-radius:4px; margin-top:6px; }

.bbq-row-list ul { margin:0; padding:0; list-style:none; }
.bbq-row-list li { margin:0; padding:0; list-style:none; padding-bottom:16px; }
.bbq-row-list a { text-decoration:none; }
.bbq-row-list a:hover { text-decoration:none; }
  
.bbq-control-wrap { margin-bottom:30px; }

.bbq-cal-header { display:table; width:100%; margin:0; padding:0; background-color:var(--cc-bbq-bg); border:1px solid var(--cc-bbq-lns); border-bottom:0; font-size:16px; line-height:1.5; padding:12px 0px; }
.bbq-cal-header-left { display:table-cell; width:40px; vertical-align:middle; text-align:center; }
.bbq-cal-header-middle { display:table-cell; width:auto; vertical-align:middle; text-align:center; text-transform:uppercase; }
.bbq-cal-header-right { display:table-cell; width:40px; vertical-align:middle; text-align:center; }

#bbq-calendar table { width:100%; margin:0; padding:0; border:1px solid var(--cc-bbq-lns);  }   
#bbq-calendar th { /* days of the week */
  border-top:1px var(--cc-bbq-lns) solid; 
  background-color:var(--cc-bbq-bg);
  color:var(--cc-bbq-bgtxt); 
  font-size:10px;
  line-height:28px;
  text-align:center;
  }
#bbq-calendar td {
  border-top:1px var(--cc-bbq-lns) solid;
  background-color:var(--cc-bbq-bg);
  color:var(--cc-bbq-bg); /* color of hidden/inactive dates */
  font-size:14px;
  line-height:36px;
  text-align:center;
  }
#bbq-calendar a { display:block; text-decoration:none; }
#bbq-calendar a.ontoday { text-decoration:underline!important; }
#bbq-calendar td.highlight a { background-color:var(--cc-bbq-highlight-bg); color:var(--cc-bbq-highlight); }
#bbq-calendar a:hover, #bbq-calendar td.highlight a:hover { background-color:var(--cc-bbq-hover-bg); color:var(--cc-bbq-hover); }

.bbq-p { text-align:center; font-size:12px; line-height:36px;  }

#bbq-categories ul { list-style:none; padding:0; margin:0; width:100%; border:1px solid var(--cc-bbq-lns); }
#bbq-categories ul li { padding:0; margin:0; background-color:var(--cc-bbq-bg); border-bottom:1px solid var(--cc-bbq-lns); }
#bbq-categories ul li:last-child { border-bottom:0px; }
#bbq-categories a { display:block; padding:0 24px; font-size:14px; line-height:36px; text-align:center; }
#bbq-categories a.highlight { background-color:var(--cc-bbq-highlight-bg); color:var(--cc-bbq-highlight); text-decoration:none; }
#bbq-categories a:hover { background-color:var(--cc-bbq-hover-bg); color:var(--cc-bbq-hover); text-decoration:none; }






/* event-detail */

ul.datelist { list-style-type: none; padding-left:0; margin-left:0; }
ul.datelist li { margin-bottom:6px; }
ul.datelist li .dldate { color:inherit; }
ul.datelist li .dltime { color:#666; }





/* Post Detail */

.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(--cc-alink); border:none; transition: all 0.15s linear 0s;}
.sharing-square a:hover { color:white; background-color:var(--cc-ahover); }
.share-cta { font-size:14px; line-height:16px; letter-spacing:0.100rem; font-weight:700; text-transform:uppercase; }
@media all and (min-width: 992px) {
	.sharing-box { display:block; margin-top:0px; }
	.sharing-label { display:block; }
	.sharing-icons { display:block; }
	.sharing-square { display:block; margin:20px 10px; }
}



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