/* =========================================================
   BangkokByStation — responsive.css
   Mobile-first breakpoints. Base (< 640px) styles live in
   style.css; this file only contains min-width overrides.
   Breakpoints: sm 480 / md 640 / lg 860 / xl 1024 / xxl 1280
   ========================================================= */


/* ---------- md: 640px+ ---------- */
@media (min-width: 640px) {
  .search-bar input {
    flex: 1 1 auto;
    order: initial;
  }

  .search-bar__filter { order: initial; }
  .search-bar__filter-wrap { order: initial; }
  .search-bar__scope-chip { order: initial; }

  .search-bar .btn--primary {
    flex: 0 0 auto;
    order: initial;
  }

  .blog-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .site-footer__bottom-inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
  }
}


/* ---------- lg: 1024px+ (nav becomes horizontal) ---------- */
@media (min-width: 1024px) {
  .main-nav {
    position: static;
    inset: auto;
    flex-direction: row;
    align-items: center;
    gap: clamp(1rem, 2.4vw, 1.75rem);
    background: none;
    /* box-shadow/max-height are only meant for the mobile dropdown
       panel (style.css's base .main-nav rule) - reset here or they'd
       leak through as a stray shadow/box behind the plain horizontal
       desktop menu. */
    box-shadow: none;
    max-height: none;
    padding: 0;
    transform: none;
    transition: none;
    overflow: visible;
    flex-wrap: nowrap;
	right: 234px;
    position: relative;
  }

  .main-nav__link {
    padding: .25rem 0;
    border-bottom: none;
    font-size: .9rem;
    white-space: nowrap;
  }

  .nav-toggle {
    display: none;
  }

  /* "Explore Bangkok" dropdown - mobile's inline expanding list becomes
     a floating panel under the toggle now that the nav itself is a
     horizontal row instead of a stacked column. */
  .main-nav__link--toggle {
    width: auto;
    border-bottom: none;
  }

  .main-nav__submenu {
    position: absolute;
    top: 100%;
    left: 0;
    /* No margin-top here on purpose: a margin would leave a gap between
       the toggle and this panel that isn't part of either element's
       box, so the mouse loses :hover mid-transit while moving down into
       the menu (the panel would open, then immediately close). The same
       .75rem of visual breathing room is created with padding-top
       instead, which keeps the hoverable area unbroken from the toggle
       straight into the panel. */
    padding: 1.25rem 0 .5rem;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-md);
    min-width: 200px;
    z-index: 110;
  }

  .main-nav__submenu a {
    padding: .6rem 1.2rem;
    border-bottom: none;
    white-space: nowrap;
  }

  /* Desktop-only: also open on hover, in addition to the existing
     click-toggle (js/script.js's initNavDropdowns still runs and its
     .is-open class still works too, e.g. for keyboard focus/Enter) -
     mobile keeps click-only since touch has no hover state. */
  .main-nav__item--dropdown:hover .main-nav__submenu {
    display: block;
  }

  .main-nav__item--dropdown:hover .main-nav__caret {
    transform: rotate(180deg);
  }
}

/* ---------- xl: 1024px+ ---------- */
@media (min-width: 1024px) {
  .hero__title-wrap {
    position: relative;
    display: inline-block;
  }

  .hero__title {
    white-space: nowrap;
  }

  .hero__tag {
	position: absolute;
	right: 100%;
	bottom: -3.5rem;
	margin-right: 0.6rem;
	flex-direction: column;
	align-items: center;
	gap: 0;
	white-space: nowrap;
}

  .hero__tag-arrow {
    margin-bottom: .1rem;
  }

  .why__grid {
    grid-template-columns: 1fr 1fr;
  }

.newsletter {
	min-width: 380px;
	position: relative;
	bottom: 9px;
}

  .blog-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ---------- xxl: 1280px+ ---------- */
@media (min-width: 1280px) {
  .hero__title {
    font-size: clamp(3rem, 6vw, 5rem);
  }
}

/* ---------- INNER PAGES: sm 480px+ ---------- */
@media (min-width: 480px) {
  .poi-grid { grid-template-columns: repeat(2, 1fr); }
  .feature-cards { grid-template-columns: repeat(2, 1fr); }
  .category-tiles { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- INNER PAGES: md 640px+ ---------- */
@media (min-width: 640px) {
  .station-detail { grid-template-columns: 1fr 1.15fr; }
  .info-cards-row { grid-template-columns: repeat(3, 1fr); }
  .field-row--2 { grid-template-columns: 1fr 1fr; }
  .field-row--3 { grid-template-columns: 1fr 1fr 1fr; }
  .steps-row { grid-template-columns: repeat(2, 1fr); }
  .reviews-row { grid-template-columns: repeat(2, 1fr); }
  .blog-nav-row { grid-template-columns: 1fr 1fr; }
  .biz-promo { grid-template-columns: 1.2fr 1fr; align-items: center; padding: 3rem; }
  .biz-promo__badge {
    top: 50%;
    left: 0;
    width: 110px;
    height: 110px;
    transform: translate(-50%, -50%);
  }
  .lyb-hero .page-hero__inner { text-align: left; }
}

/* ---------- INNER PAGES: lg 860px+ ---------- */
@media (min-width: 860px) {
  .legal-layout { grid-template-columns: 260px 1fr; }
  .listing-layout { grid-template-columns: 330px 1fr; }
  .article-layout { grid-template-columns: 1fr 400px; }
  .form-grid-2 { grid-template-columns: 1fr 1fr; }
  .about-grid { grid-template-columns: 443fr 949fr; gap: 3rem; }
  .about-grid--text-only { grid-template-columns: 1fr; }
}

/* ---------- INNER PAGES: xl 1024px+ ---------- */
@media (min-width: 1024px) {
  .poi-grid { grid-template-columns: repeat(3, 1fr); }
  .feature-cards { grid-template-columns: repeat(4, 1fr); }
  .category-tiles { grid-template-columns: repeat(4, 1fr); }
  .steps-row { grid-template-columns: repeat(4, 1fr); }
  .reviews-row { grid-template-columns: repeat(4, 1fr); }
  .page-hero__nav-btn { position: absolute; top: 50%; transform: translateY(-50%); }
  .page-hero__nav-btn--prev { left: -3.5rem; }
  .page-hero__nav-btn--next { right: -3.5rem; }
}

/* ---------- INNER PAGES: xxl 1280px+ ---------- */
@media (min-width: 1280px) {
  .poi-grid--4col { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition-duration: 0.001ms !important; }
}


@media (max-width:1599px) {
#why.why h2.why__heading::before {
	margin-right:-1.25em;
	top:-20px;
}
.hero__tag {
	margin-right:2.6rem;
}
.legal-layout {
	padding-left: 20px;
	padding-right: 20px;
}
.listing-layout {
	margin-bottom: 1.5rem;
}
.page-section.page-hero.lyb-hero .page-hero__title.page-hero__title--transit {
	text-align: center;
}	
	
.blog-card__body {
	border: 0;
}	
.blog-card {
	background: #F4FAFE;
}
	
.back-btn {
	left: -149px;
}

.media-carousel.venue-gallery-carousel .media-carousel__btn.media-carousel__btn--prev {
	width: 40px;
	height: 40px;
	left:9px;
}	
.media-carousel.venue-gallery-carousel .media-carousel__btn.media-carousel__btn--next {
	right: 9px;
	height: 40px;
	width: 40px;
}	
	
.page-section.page-section--other-listings.container {
	margin-bottom: 110px;
}



.media-carousel.other-listings-carousel .media-carousel__btn.media-carousel__btn--prev {
	top: auto;
	width: 40px;
	height: 40px;
	left: 43%;
	bottom: -80px;
}
.media-carousel.other-listings-carousel .media-carousel__btn.media-carousel__btn--next {
	top: auto;
	width: 40px;
	height: 40px;
	right: 43%;
	bottom: -80px;
}			

.page-section.page-section--facilities.container {
	padding-left: 40px;
	padding-right: 40px;
}	
.page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel iframe {
	height: 100%;
}	
.page-section.page-section--exit-map h3 {
	font-size: 25px;
}	
	
.page-section.page-section--facilities.container .icon-rail-card {
	padding-inline: 0;
}	
.page-section.page-section--facilities.container .icon-rail-card h3 {
	padding-left: 30px;
}	
}

@media (max-width:1279px) {
.back-btn {
	left: -70px;
}
}

@media (max-width:1199px) {
#home .hero__tag .hero__tag-arrow {
	height: 55px;
	width: 44px;
}
.hero__tag {
	margin-right: 11px;
	bottom: -9px;
}	
.header-search {
	display: block;
}	
.main-nav {
	right: 210px;
}	
.checklist li {
	text-align: left;
}
#why.why h2.why__heading::before {
	width: 99px;
	height: 76px;
	background-size: 100%;
}	
#why.why h2.why__heading::after {
	width: 48px;
	height: 43px;
	background-size: 100%;
}
.site-footer__bottom-inner {
	font-size:13px;
}
	
.biz-promo--map .biz-promo__media-photo {
	width: 470px;
}
.biz-promo--map .biz-promo__features .icon-circle {
	width: 66px;
	height: 66px;
}
.biz-promo--map .biz-promo__features li {
	font-size: 0.8rem;
}	
.biz-promo--map .biz-promo__features li:first-child {
	padding-left: 0;
}
.biz-promo__features li {
	padding-right: 1rem;
}
.biz-promo__map-icon {
	left: -12%;
	width: 29%;
}
.blog-hero__badge-wrap small {
	top: 19px;
	right: 105px;
}	
.blog-hero__badge-wrap .dir-hero__badge {
	right: 40px;
	top: 11px;
}	
.back-btn {
	left: 0;
}	
.blog-nav-card strong {
	font-size: 24px;
}
.blog-nav-card span {
	font-size: 18px;
}
	
.page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel, .page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel iframe {
	height: auto;
}


.page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel iframe {
	height: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
}

.page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel {
	position: relative;
	padding-bottom: 120%;
}	
	
}

@media(max-width:1023px){
.main-nav {
	right: 0;
}
.header-search {
	right: 73px;
}	
.legal-links {
	gap: .5rem;
}
.site-footer__bottom-inner {
	font-size: 13px;
	flex-wrap: wrap;
	text-align: center;
	gap: 7px;
}
.site-footer__bottom-inner ul, .site-footer__bottom-inner p {
	width: 100%;
	justify-content: center;
}
.page-section .btn.btn--primary {
	bottom: 0;
}	
.page-hero__title.dir-hero__title.things_to_do_hero_title .dir-hero__badge {
	top: 33px;
	right: -17px;
}	
.page-hero__title.dir-hero__title.places_to_visit_hero_title .dir-hero__badge {
	top: 40px;
	right: -10px;
}
.page-hero__title.dir-hero__title.directory_hero_title .dir-hero__badge {
	top: 33px;
}
	
.biz-promo--map .biz-promo__media-photo {
	width: 380px;
	top: -16%;
}
		
.biz-promo--map .biz-promo__text p {
	font-size: 1.3rem;
	margin-top: 0.7rem;
	line-height: 24px;
}
.biz-promo__map-icon {
	left: -8%;
	width: 26%;
}	
.biz-promo--map .biz-promo__text {
	width: 360px;
}	
	
.biz-promo--map .biz-promo__features li {
	font-size: 0.6rem;
	padding: 0 9px !important;
}	
.biz-promo {
	padding: 2rem;
}

.blog-hero__badge-wrap .dir-hero__badge {
	right: 40px;
	top: 4px;
}	
.blog-hero__badge-wrap small {
	top: 8px;
	right: 95px;
}
	
.blog-cats a {
	padding: .55rem 1.55rem;
	font-size: 16px;
}	
.page-section.container.article-layout.containerblogdetails .article-body {
	width: 100%;
	padding-right: 0;
	margin-bottom: 30px;
}
.article-layout {
	grid-template-columns: 1fr;
}
.blog-nav-card strong {
	font-size: 20px;
}	
.back-btn {
	left: 20px;
	top: -44px;
	width: 34px;
	height: 34px;
}	
	
.page-hero__swirl {
	width: 48px;
}	

.page-section.page-hero.stationcategorypagehero .page-hero__nav-btn.page-hero__nav-btn--prev {
	position: absolute;
	top: -31px;
	margin-left: -71px;
	width: 40px !important;
	height: 40px !important;
}

.page-section.page-hero.stationcategorypagehero .page-hero__nav-btn.page-hero__nav-btn--next {
	margin-right: -50px;
	position: absolute;
	top: -31px;
	width: 40px !important;
	height: 40px !important;
}

.page-hero.stationpagehero .page-hero__badge-icons.page-hero__badge-icons--combo {
	width: 67px;
	left: 0;
	bottom: 17px;
}	
.station-overview__desc h2 {
	font-size: 2.8rem;
	line-height: 48px;
}
.page-section.page-section--exit-map .station-detail-row {
	display: flex;
	flex-wrap: wrap;
}
.page-section.page-section--exit-map .station-detail-row .station-panel {
	width: 100%;
	position: relative;
	margin-top:20px;
	margin-bottom:20px;
}
.page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel {
	position: relative;
	padding-bottom: 45%;
}	
}

@media(max-width:859px){
.station-filter__list a {
	padding: 0.3rem 0;
	font-size: 16px;
}
	
.station-filter {
	height: auto;
	overflow-y: hidden;
	/* Small by default - collapsed, this box is just the "Search Near
	   Station" button, so it doesn't need much breathing room before the
	   Directory/Category dropdown row underneath. The bigger 30px gap
	   below is only added once the panel is actually open (see
	   .station-filter.is-open below), matching the padding-bottom rule
	   right after it. */
	margin-bottom: 0;
}
/* Only add the bottom breathing room while there's actual content to
   breathe under (the collapsed, .is-open-less default state is just the
   "Search Near Station" button - this padding would otherwise show as a
   bare empty gap inside the box below it). */
.station-filter.is-open {
	margin-bottom: 30px;
	padding-bottom: 30px;
}
.station-filter__list {
	height: 400px;
}

.station-filter__all.is-current {
	position: sticky;
	top: 0;
}

/* Real collapse below the desktop breakpoint - hidden by default (no
   .is-open class yet), shown once js/site.js's initStationFilterCollapse()
   adds it (the "Search Near Station" bar is tapped). Desktop never adds/
   needs this class, so this rule has no effect there regardless. */
.station-filter:not(.is-open) .station-filter__current,
.station-filter:not(.is-open) .station-filter__search-wrap,
.station-filter:not(.is-open) .station-filter__tabs,
.station-filter:not(.is-open) .station-filter__list {
	display: none;
}
.station-filter__summary {
	cursor: pointer;
}
.station-filter__current,
.station-filter__chevron {
	display: block;
}
.listing-layout {
	margin-bottom: 3.5rem;
	margin-top: 20px;
	gap: 1.25rem;
}

.venue-info__map iframe {
	height: 270px;
}	
	
}

@media(max-width:767px){
.filter-tabs .tab {
	padding: 13px 11px;
	font-size: 0.7rem;
	border-radius: 16px;
}
.site-footer__links a {
	font-size:16px;
}	
.site-footer__links h3, .newsletter h3 {
	font-size: 1.2rem;
}
.blog-card__body h3{
	font-size:1.3rem;
}	
.operator-badge {
	width: 68px;
	height: 68px;
}

.operators-row {
	margin-top: 2.5rem;
	margin-bottom: -50px;
}	
.stats-row__item dt {
	font-size: 1rem;
}	
.logo__img {
	height: 27px;
	width: auto;
}
.header-search {
	right: 53px;
	padding: 0.3rem 0.2rem;
	border-radius: 12px;
}
.header-search i {
	font-size: 0.8rem;
	left: 3px;
	position: relative;
}	
	
.search-bar{flex-wrap:inherit;}	
.page-section .btn.btn--primary {
	/*bottom: 0;
	flex: 1 1 37%;*/
	padding: 10px 16px;
	font-size: 15px;
}
.search-bar input {
	padding: .7rem 0;
	font-size: .85rem;
	order: 1;
}	
.search-bar{gap:0.4rem;}	

.site-header .container.site-header__inner {
	padding-left: 10px;
	padding-right: 10px;
}	
.filter-tabs .tab {
	padding: 13px 9px;
	font-size: 0.8rem;
	border-radius: 16px;
}
	
.filter-tabs {
	gap: .5rem;
}
#home.hero {
	margin-bottom: 40px;
}	

.line-card {
	padding: 1rem 1rem;
	margin-bottom: 1.25rem;
}	
.lines {
	padding: 1.75rem 0 30px;
}	
.promo {margin-bottom: 50px;}
#why.why h2.why__heading::before {
	width: 79px;
	height: 56px;
}
.why {
	padding: 5rem 0 0;
}
	
.site-footer__links ul {
	gap: 1rem 1rem;
}
.site-footer__links a {
	font-size: 14px;
}	
.newsletter__row input::placeholder {
	font-size:14px;
}	
.newsletter__row .btn {
	font-size: 0.9rem;
}
.newsletter__row {
	padding: 0;
}	
.newsletter__row input {
	width: 100%;
	padding-right: 0;
}
	
.section-head p, p, li {
	font-size: 16px;
}	
.why__text p {
	font-size: 16px;
}	
.checklist li {
	font-size: 1rem;
}	
.site-footer__bottom-inner li, .site-footer__bottom-inner p {
	font-size: 13px;
}
.blog-card__body p {
	font-size: 16px;
}	

.legal-layout {
	padding-top: 20px;
	padding-bottom: 70px;
}	
.page-hero{padding:3rem 0 4.5rem;}	
	
.page-hero__title.dir-hero__title.directory_hero_title .dir-hero__badge {
	top: 24px;
	width: 60px;
	height: 60px;
}	
.page-hero__title.dir-hero__title.places_to_visit_hero_title .dir-hero__badge {
	width: 50px;
	height: 50px;
}
.page-hero__title.dir-hero__title.things_to_do_hero_title .dir-hero__badge {
	width: 50px;
	height: 50px;
}	
.listing-results__count {
	font-size: 2rem;
}
.category-dropdown {
	width: 100%;
}
.listing-results__browse,
.listing-results__browse select {
	width: 100%;
}
.listing-layout .pagination .btn.btn--primary {
	max-width: 36px !important;
}	
	
.biz-promo--map .biz-promo__media-photo {
	opacity: 0;
}	
.biz-promo--map .biz-promo__media {
	display: none;
}
	
.biz-promo {
	grid-template-columns: 1fr;
}	
.biz-promo--map .biz-promo__cta {
	padding: 0.7rem 50px;
	font-size: 1.3rem;
	margin-top: 1.4rem;
}
.biz-promo--map .biz-promo__features li {
	font-size: 0.8rem;
	padding: 0 16px !important;
	margin-bottom: 14px;
}	
.biz-promo--map .biz-promo__text {
	width: 100%;
}	
	
#submit-your-business .form-card .btn.btn--primary {
	padding: 17px 54px !important;
}	
.blog-hero__badge-wrap small {
	top: 0;
}
.blog-hero__note img {
	width: 60px;
	left: 110px;
	bottom: 18px;
}	
.page-section .blog-search.search-bar .btn.btn--primary {
	flex: auto;
	max-width: 100px;
	order: 3;
}
	
.blog-hero__note {
	display: none;
}	
.blog-hero__badge-wrap .dir-hero__badge {
	right: 21px;
	top: 14px;
}	
	
.blog-nav-row {
	grid-template-columns: 1fr;
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}	
.blog-nav-card {
	width: 100%;
}	
.article-layout.containerblogdetails h2 {
	font-size: 22px;
}	
.page-section.page-section--poi-restaurant.container {
	margin: 50px auto;
}
.page-section.page-section--poi-hotel.container {
	margin: 50px auto 60px;
}
.tab__name {
	font-size:0.85rem;
}	
.tab__count {
	font-size: 0.75rem;
}
	
.page-section.page-hero.stationcategorypagehero .page-hero__title.dir-hero__title {
	font-size: 19px;
}	
.page-section.page-hero.stationcategorypagehero .page-hero__title.dir-hero__title .dir-hero__badge {
	width: 50px;
	height: 50px;
}
.page-section.page-hero.stationcategorypagehero .page-hero__title .dir-hero__badge svg {
	width: 28px;
}	
.cat-pills__circle {
	width: 54px;
	height: 54px;
}
	
.page-section.page-section--category-pills .cat-pills__circle svg {
	width: 27px;
}
.page-section.page-hero.stationcategorypagehero {
	padding-bottom: 6em;
}	
.page-section.page-section--more-listings.container {
	margin-bottom: 60px;
}
.page-section.lines.stationcategorypagesectionlines {
	padding-top: 0;
}	
.page-section.page-section--featured-listings.container {
	margin-bottom: 60px;
}

.page-section.page-section--about.container.transitsystemspagesectionabout {
	margin-bottom: 50px;
}	

.media-carousel.venue-gallery-carousel .media-carousel__btn.media-carousel__btn--prev {
	width: 28px;
	height: 28px;
}
.media-carousel.venue-gallery-carousel .media-carousel__btn.media-carousel__btn--next {
	width: 28px;
	height: 28px;
}	
	
.other-listings-carousel__item {
	width: calc(50% - .75rem);
}
.venue-gallery-carousel__item {
	width: calc(50.3% - .75rem);
}	
.media-carousel.venue-gallery-carousel .media-carousel__btn.media-carousel__btn--next {
	right: 13px;
}	
	
.venue-additional {
	border-radius: 20px;
	padding: 1.3rem;
}	
.venue-additional h2 {
	font-size: 23px;
}
.additional-info-list a {
	font-size: 15px;
}

.venue-hero__stats {
	top: 1rem;
	left: 1rem;
	gap: .5rem;
}	
.venue-hero__stat {
	font-size: 12px;
	font-weight: 600;
	padding: 6px 9.14px;
}
.venue-hero img {
	border-radius: 23px;
}
	
.venue-hero__badge {
	bottom: -21px;
	left: 1.9rem;
	width: 54px;
	height: 54px;
}	
.venue-hero .venue-hero__badge img {
	height: 33px !important;
	border-radius: 0;
}
.venue-hero .btn.btn--primary.venue-hero__claim {
	font-size: 13px;
	padding: 7px 14px;
	bottom: 12px;
	right: 13px;
}	
	
.page-hero.stationpagehero .dir-hero__badge.station-hero__pin {
	width: 44px;
}	
.station-overview__desc h2 {
	font-size: 2.2rem;
}	
.page-section.page-section--facilities.container .icon-rail-card h3 {
	padding-left: 20px;
	font-size: 22px;
}
.page-section.page-section--facilities.container {
	margin-bottom: 30px;
}
	
.station-overview .media-carousel__btn.media-carousel__btn--prev {
	left: 10px;
	top: 50%;
	width: 36px;
	height: 36px;
}
.station-overview .media-carousel__btn.media-carousel__btn--next {
	right: 10px;
	top: 50%;
	width: 36px;
	height: 36px;
}	
.category-tile__title {
	font-size: 22px;
}
.category-tile__count {
	font-size: 15px;
}	
.category-tile__btn {
	width: 32px;
	height: 32px;
}	
.page-section.page-section--explore-near.container .category-tile-grid .category-tile.category-tile--wide {
	margin-bottom: 20px;
}
.page-section.page-section--explore-near.container .category-tile-grid .category-tile {
	margin-bottom: 18px;
}
.page-section.page-section--exit-map .station-detail-row .station-panel .station-map.station-map--panel {
	padding-bottom: 94%;
}	
#home .search-bar button.btn.btn--primary {
	max-width: 100px;
	order: 3;
}	
}

@media(max-width:639px){
h1.page-hero__title.dir-hero__title.directory_hero_title {
	font-size: 24px;
}
.page-hero__title.dir-hero__title.directory_hero_title .dir-hero__badge {
	top: 14px;
	width: 50px;
	height: 50px;
}


h1.page-hero__title.dir-hero__title.places_to_visit_hero_title {
	font-size: 24px;
}
.page-hero__title.dir-hero__title.places_to_visit_hero_title .dir-hero__badge {
	top: 23px;
	right: -10px;
}


h1.page-hero__title.dir-hero__title.things_to_do_hero_title {
	font-size: 23px;
}

.page-hero__title.dir-hero__title.things_to_do_hero_title .dir-hero__badge {
	top: 18px;
	right: -10px;
}

.station-filter h3 {
	font-size: 1.1rem;
	/* Room for the chevron (.station-filter__chevron), absolutely
	   positioned over this bar's right side - without this the centered
	   title text runs straight under it at this width. */
	padding-right: 46px;
	padding-left: 12px;
}

.station-filter__tabs a, .station-filter__tabs button {
	font-size: 16px;
}

.listing-results__count {
	font-size: 1.8rem;
}
.category-dropdown label {
	font-size: 15px;
}

.category-dropdown {
	--cat-dd-offset: 112px;
}

.category-dropdown--systems {
	width: 100%;
}

.category-dropdown--systems .category-dropdown__trigger {
	white-space: normal;
}

.category-dropdown select,
.category-dropdown__trigger {
	font-size: 16px;
}
.listing-layout {
	margin-top: 16px;
	gap: .6rem;
}
.biz-promo--map .biz-promo__features li {
	font-size: 0.8rem;
	padding: 0 9px !important;
	margin-bottom: 14px;
}	
.blog-cats a {
	padding: .55rem 1rem;
	font-size: 13px;
}
.containerdivblognews {
	margin: 40px 0px;
}	
	
.blog-nav-row .blog-nav-card:nth-child(1) {
	padding-left: 16px;
}	
.blog-nav-card span {
	font-size: 16px;
}
.blog-nav-card strong {
	font-size: 17px;
}	
	
.media-carousel.other-listings-carousel .media-carousel__btn.media-carousel__btn--prev {
	width: 30px;
	height: 30px;
	left: 35%;
	bottom: -70px;
}	

.media-carousel.other-listings-carousel .media-carousel__btn.media-carousel__btn--next {
	width: 30px;
	height: 30px;
	right: 35%;
	bottom: -70px;
}	
	
	
}

@media(max-width:479px){
.biz-promo--map .biz-promo__features li:not(:last-child)::after {
	opacity: 0;
}
.biz-promo--map .biz-promo__features li {
	font-size: 0.9rem;
	padding: 0 9px !important;
	margin-bottom: 14px;
	width: 100%;
}
.tab__name {
	font-size: 0.75rem;
}	
.page-hero__title--transit .page-hero__swirl {
	display: none;
}
/* Safety net for the narrowest phones: the desktop/tablet nowrap fix for
   "Discover Airport Link" (style.css) could overflow horizontally once
   the heading's font-size clamp bottoms out here - letting it wrap again
   below this width is preferable to a clipped/overflowing heading. */
.page-hero--transit-system-airport-link .page-hero__title--transit {
	white-space: normal;
}

#home .search-bar input {
	padding: .7rem 0;
	font-size: 0.75rem;
	order: 1;
}
	
	
}

@media(max-width:419px){
.header-search input{width:104px;}	
.logo__img{height:23px;}
#why.why h2.why__heading::before {
	margin-right: -10px;
	top: -30px;
}
#why.why h2.why__heading::after {
	width: 38px;
	height: 33px;
	right: 10px;
}	
.page-section.page-section--biz-promo.container .biz-promo--map .biz-promo__text h2 {
	font-size: 22px;
}
.biz-promo--map .biz-promo__text p {
	font-size: 1rem;
}	
.contact-info-list span, .contact-info-list p {
	font-size: 14px;
}	
	

#home .search-bar button.btn.btn--primary {
	max-width: 70px;
	order: 3;
	font-size: 12px;
}

#home .search-bar {
	gap: 0.1rem;
}
#home .search-bar input {
	padding: .7rem 0;
	font-size: 0.75rem;
	order: 1;
}	
	
}