/* Lilli Putt site styles. Goebel Media, 2026-10-30. */

/* Keyboard: skip link and visible focus */
.gmg-skip{position:absolute;left:8px;top:-60px;z-index:100000;background:#fff;color:#3d2470;padding:10px 16px;border-radius:4px;font-size:16px;text-decoration:underline}
.gmg-skip:focus{top:8px}
.gmg-style a:focus-visible,.gmg-style button:focus-visible,.gmg-style input:focus-visible,.gmg-style select:focus-visible,.gmg-style textarea:focus-visible{outline:3px solid #1a73e8;outline-offset:2px}
#header a:focus-visible,#nav a:focus-visible,#home-sections a:focus-visible{outline-color:#fff}

/* Home section headings were purple on near-black */
.gmg-style #home-sections .widget-title,.gmg-style #home-sections .widget-title a{color:#d6c6f7}
.gmg-style #home-sections a.more-link{color:#9fdc7e;text-decoration:underline}

/* Header phone number becomes a tap-to-call link */
.gmg-tel,.gmg-tel:hover,.gmg-tel:visited{color:inherit;text-decoration:none}

/* Slider: larger dots, pause button */
/* The dots are a sprite: grow the tap area with padding, leave its size and position alone */
.gmg-style .soliloquy-container .soliloquy-pager{height:24px;bottom:4px}
.gmg-style .soliloquy-container .soliloquy-pager-item,.gmg-style .soliloquy-container .soliloquy-pager-item:first-child{margin-left:0}
.gmg-style .soliloquy-container .soliloquy-pager-link{box-sizing:content-box;padding:5px;background-origin:content-box!important;background-clip:content-box!important}
/* .soliloquy-container * resets everything inside the slider, and loads after this file */
.soliloquy-container .gmg-pause{position:absolute;right:8px;bottom:8px;z-index:1321;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:4px;background:rgba(0,0,0,.72);color:#fff;cursor:pointer}
.soliloquy-container .gmg-pause svg{width:12px;height:14px;fill:currentColor}

/* Calendar: heading, and what to do when nothing is scheduled */
.gmg-lp-events-title{font-size:34px;margin:0 0 12px}
.gmg-lp-noevents{margin:0 0 24px;padding:16px;background:#f3eefb;border-radius:6px;color:#333}
.gmg-lp-noevents p{margin:0 0 12px;font-size:17px}
.gmg-lp-noevents ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.gmg-lp-noevents li{margin:0;padding:0;list-style:none}
.gmg-lp-noevents a{display:block;padding:10px 14px;border-radius:4px;background:#5b3696;color:#fff;font-size:15px;text-decoration:none}
.gmg-lp-noevents a:hover{background:#3d2470;color:#fff}
/* Only while the empty-calendar panel is showing. If real events are added, the calendar's own navigation comes back */
.gmg-style .tribe-events:has(.gmg-lp-noevents) .tribe-events-header,.gmg-style .tribe-events:has(.gmg-lp-noevents) .tribe-events-calendar-latest-past{display:none!important}

/* Phones and tablets */
@media only screen and (max-width:1023px){
	.gmg-style #header{padding:8px 0 12px}
	/* Same logo size as today: 88px just trims the empty padding inside the PNG */
	.gmg-style #title-area{height:88px;background-size:300px 150px;background-position:center}
	.gmg-style #title,.gmg-style #title a{height:88px}
	.gmg-style #header .widget-area .widget{margin:0}
	.gmg-style #text-2 p{margin:0;line-height:1.3}
	.gmg-style #simple-social-icons-2{margin-top:6px}
	.gmg-style #nav li a,.gmg-style .menu-primary a{padding:6px 8px}
	.gmg-style #nav{line-height:1.8}

	/* The client's pages use 42px headings for hours and notices */
	.gmg-style .entry-content h2{font-size:27px}
	.gmg-style .entry-title{font-size:34px}
	.gmg-style .entry-content .has-background{padding:12px 14px}
	.gmg-style .entry-content .has-large-font-size{font-size:22px!important}
	.gmg-style .entry-content .has-huge-font-size{font-size:30px!important}
}

/* Wide phones and small tablets: logo beside the contact details */
@media only screen and (min-width:568px) and (max-width:1023px){
	.gmg-style #title-area{float:left;width:48%}
	.gmg-style #header .widget-area{float:right;width:50%}
	.gmg-style #header .wrap::after{content:"";display:block;clear:both}
}

/* White menu text was 2.9:1 on the green gradient. Same green family, deep enough for 4.5:1 */
.gmg-style #nav{background:linear-gradient(#458200,#2f6a00)}
.gmg-style #nav .menu-primary > li > a{color:#fff}
.gmg-style #nav .menu-primary > li > a:hover,.gmg-style #nav .menu-primary > li:hover > a,.gmg-style #nav .menu-primary > li.current_page_item > a,.gmg-style #nav .menu-primary > li.current-menu-item > a{background:rgba(0,0,0,.28);color:#fff}

/* Footer text was 3.1:1 */
.gmg-style #footer,.gmg-style #footer .ft-lt,.gmg-style #footer td{color:#c4c4c4}

/* Dots were white on the white edge of the banner */
.gmg-style .soliloquy-container .soliloquy-pager-link{filter:drop-shadow(0 0 1px rgba(0,0,0,.85))}

@media only screen and (max-width:1023px){
	.gmg-style #header .simple-social-icons ul,.gmg-style #header .simple-social-icons ul li{margin-bottom:0}
}

/* Calendar panel: TEC's reset removed the padding */
.gmg-style .tribe-events .gmg-lp-noevents{padding:16px}
.gmg-style .tribe-events .tribe-events-l-container{padding-top:16px;padding-bottom:24px;min-height:0}
.gmg-style .gmg-lp-noevents a{text-transform:uppercase}

/* Notices on the client's pages: purple and green on mint were too faint, and the waiver link matters */
.gmg-style .entry-content .has-light-green-cyan-background-color,.gmg-style .entry-content h2.has-light-green-cyan-background-color{color:#2e1a56}
.gmg-style .entry-content .has-light-green-cyan-background-color a{color:#173f06;text-decoration:underline}

/* Slider arrows were 13x18. They are a sprite, so grow the tap area with padding and keep the image in the content box */
.gmg-style .soliloquy-container.soliloquy-theme-classic .soliloquy-prev,.gmg-style .soliloquy-container.soliloquy-theme-classic .soliloquy-next{box-sizing:content-box;padding:7px 10px;margin-top:-16px;background-origin:content-box!important;background-clip:content-box!important}

/* Dark text on the bright blue party box was 3.8:1 */
.gmg-style .entry-content .has-vivid-cyan-blue-background-color{color:#000}