/* Moonlight Rollerway style, layout, mobile and ADA fixes. Published 2026-10-31. */

/* Top bar: the address and phone were cyan on a gradient that ends in cyan. */
.elementor-element-c40a682:not(.elementor-sticky__spacer){background:#5f4ddf!important}
.elementor-element-7922c24 .elementor-icon-list-text,.elementor-element-7922c24 a{color:#fff!important}

/* Keyboard focus */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #160f3e;outline-offset:2px;box-shadow:0 0 0 2px #fff}

/* Home facts block */
.gmg-facts.gmg-home-facts{max-width:none;margin:0;border:0;padding:clamp(28px,4vw,48px) max(24px,calc((100% - 1240px)/2))}
.gmg-home-facts .gmg-table th,.gmg-home-facts .gmg-table td{padding:7px 10px 7px 0}
.gmg-home-facts .gmg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.gmg-home-facts h3:first-child{margin-top:0}

/* Controls large enough to tap */
.elementor-cta__button.elementor-button,.sbi_load_btn,.sbi_follow_btn a,.gform_wrapper .gform_button.button,.gform_wrapper input[type=submit]{min-height:44px!important;display:inline-flex!important;align-items:center;justify-content:center}
.tribe-events .tribe-events-c-events-bar__search-button,.tribe-events .tribe-events-c-view-selector__button{min-width:44px;min-height:44px}
.tribe-events .tribe-events-c-subscribe-dropdown__button-text{min-height:44px}

/* Form fields fit a 320px phone */
.gform_wrapper,.gform_wrapper form,.gform_wrapper .gform_fields,.gform_wrapper .ginput_complex{max-width:100%;min-width:0}
.gform_wrapper input:not([type=radio]):not([type=checkbox]),.gform_wrapper textarea,.gform_wrapper select{max-width:100%;box-sizing:border-box}

@media (max-width:1024px){
	/* Name, tagline and Buy Tickets come before the flyers. */
	.elementor-14 .elementor-element.elementor-element-7bc9f8f{--flex-direction:column}
	.gmg-home-facts .gmg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:767px){
	/* Top of the page: less logo, so the name and tickets show on the first screen. */
	.elementor-location-header .elementor-element-ba42dc2 img{width:auto;max-height:120px}
	.gmg-home-facts .gmg-grid{grid-template-columns:minmax(0,1fr)}

	/* Seven full-width circles become two across. */
	.elementor-element-4f7d436{display:grid!important;grid-template-columns:1fr 1fr;gap:14px;--gap:14px}
	.elementor-element-4f7d436>.elementor-widget{width:auto;max-width:none;min-width:0}
	.elementor-14 .elementor-element.elementor-element-b48700d{grid-column:1/-1;justify-self:center;width:calc(50% - 7px)!important;max-width:calc(50% - 7px)!important}
	.elementor-element-4f7d436 .elementor-cta{aspect-ratio:1/1;height:auto;min-height:0}
	.elementor-element-4f7d436 .elementor-cta .elementor-cta__content{min-height:0!important;height:100%;padding:6px;justify-content:center;align-content:center}
	.elementor-element-4f7d436 .elementor-cta .elementor-cta__title{font-size:21px!important;line-height:1.15;margin-bottom:4px}
	.elementor-element-4f7d436 .elementor-cta .elementor-cta__button.elementor-button{font-size:14px;padding:4px 14px;white-space:nowrap;line-height:1.1}

	/* Instagram: two across, six posts, Follow button stays. */
	#sb_instagram #sbi_images{grid-template-columns:repeat(2,minmax(0,1fr))!important}
	#sb_instagram #sbi_images>.sbi_item:nth-child(n+7){display:none!important}
	#sb_instagram .sbi_load_btn{display:none!important}
}

/* Accessibility */
/* The Pause buttons are added by a delayed script, so their space is held from first paint. Nothing moves when they arrive. */
.elementor-element-4a61f98,.elementor-element-4c23e4f{position:relative;margin-bottom:52px!important}
.gmg-pause{position:absolute;left:50%;bottom:-50px;z-index:11;transform:translateX(-50%);min-width:64px;min-height:44px;margin:0;padding:6px 16px;border:2px solid #fff;border-radius:999px;background:#160f3e;color:#fff;font:600 15px/1.2 Manrope,Roboto,sans-serif;cursor:pointer}
.gmg-pause:hover,.gmg-pause:focus{background:#5f4ddf;color:#fff}
#sb_instagram .sbi_follow_btn a{background:#5f4ddf!important;color:#fff!important}
.elementor-widget-text-editor a[href^="tel:"]{text-decoration:underline}
.elementor-element-69607e4 .elementor-social-icon{min-width:24px;min-height:24px;box-sizing:border-box}

/* Circle titles: white text needs a darker tint over the photos. */
.elementor-14 .elementor-element .elementor-cta .elementor-cta__bg-overlay,.elementor-14 .elementor-element .elementor-cta:hover .elementor-cta__bg-overlay{background-color:rgba(10,6,39,.62)!important;mix-blend-mode:normal!important}
.tribe-events .tribe-common-c-btn__clear.tribe-common-h3{min-height:44px}

/* The Turnstile box is a fixed 300px, wider than the form on the smallest phones. */
@media (max-width:359px){
	.gf-turnstile-container .cf-turnstile{transform:scale(.8);transform-origin:0 0;height:54px;width:240px;overflow:visible}
}

/* Footer line: white on the gradient was as low as 2.2:1. */
.elementor-element-8388dce{background:#160f3e!important}

/* Interior page titles sit on the bright part of the gradient: purple measured 2.77:1, navy is the same family and far stronger. */
.elementor-element-287b327 .elementor-heading-title{color:#160f3e!important}

/* iPad portrait: the TikTok icon dropped to a second row of the top bar. */
@media (min-width:768px) and (max-width:1024px){
	.elementor-element-69607e4 .elementor-social-icons-wrapper{display:flex!important;flex-wrap:nowrap;justify-content:center;gap:14px}
	.elementor-element-69607e4{flex:0 0 auto;width:auto;min-width:0}
}

/* Laptops: a shorter header, so the page starts sooner and the menu stays on one line. */
@media (min-width:1280px){
	.elementor-location-header .elementor-element-ca3c558 .elementor-nav-menu--main .elementor-item{padding-left:8px;padding-right:8px}
}
@media (min-width:1025px) and (max-height:900px){
	.elementor-location-header .elementor-element-ba42dc2 img{width:auto;max-height:140px}
}
