.elementor-kit-7{--e-global-color-primary:#FA7550;--e-global-color-secondary:#FBC86F;--e-global-color-text:#000000;--e-global-color-accent:#F4BFA0;--e-global-color-1c05ddc:#F4EDE5;--e-global-color-68ce329:#C42A00;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"EXO";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;color:#000000;font-family:"EXO", Sans-serif;font-size:1rem;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7 h1{color:#C42A00;font-family:"CA Spy Royal Regular", Sans-serif;font-weight:400;text-transform:uppercase;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}} /* Start custom CSS *//* ===== PER-SITE BLOCK ===== */ :root{ --gh-lift:3px; /* GH .btn:hover transform:translateY(-3px) */ --gh-lift-neg:-3px; --gh-shadow:#ea5e38; /* GH .btn:hover box-shadow colour */ --gh-palm:url(/wp-content/uploads/2026/08/30653palm-pink.png); --gh-ig:url(/wp-content/uploads/2026/08/instagram-brands-solid-1.png); --gh-yelp:url(/wp-content/uploads/2026/08/yelp-brands-solid-1.png); --gh-tiktok:url(/wp-content/uploads/2026/08/tiktok-brands-solid-1.png); } /* ===== Button lift - traced to GH .btn / .btn:hover ===== */ .e-button-base{position:relative;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out,background-color .2s ease-in-out,border-color .2s ease-in-out} .e-button-base::after{content:'';position:absolute;left:0;right:0;top:0;bottom:var(--gh-lift-neg);transition:transform .2s ease-in-out} .e-button-base:hover,.e-button-base:focus-visible{transform:translateY(var(--gh-lift-neg));box-shadow:3px 6px 0 0 var(--gh-shadow)} .e-button-base:hover::after,.e-button-base:focus-visible::after{transform:translateY(var(--gh-lift))} .gh-lift:not(.e-button-base){padding-top:var(--gh-lift);margin-top:var(--gh-lift-neg)} .gh-lift:not(.e-button-base) .elementor-button{transition:transform .2s ease-in-out,box-shadow .2s ease-in-out,background-color .2s ease-in-out,border-color .2s ease-in-out} .gh-lift:not(.e-button-base):hover .elementor-button,.gh-lift:not(.e-button-base):focus-within .elementor-button{transform:translateY(var(--gh-lift-neg));box-shadow:3px 6px 0 0 var(--gh-shadow)} /* ===== HEADER ===== */ /* Typeface. Elementor writes font-family onto each widget from Global Typography, so a scope-level font-family rule loses. Override the vars instead. */ .elementor-location-header{ --e-global-typography-primary-font-family:'Exo'; --e-global-typography-secondary-font-family:'Exo'; --e-global-typography-text-font-family:'Exo'; --e-global-typography-accent-font-family:'Exo'; } /* Colours set explicitly, not by overriding --e-global-color-primary. */ .elementor-location-header > .e-con:first-child > .e-con:first-child{background-color:#ff754f !important} .elementor-location-header .elementor-button, .elementor-location-header .elementor-button:hover, .elementor-location-header .elementor-button:focus{background-color:#ff754f !important;border:3px double #f4bf9f !important} /* Bar padding - GH computed: utility 4.5px, nav row 9px */ .elementor-location-header > .e-con:first-child > .e-con:first-child{padding-top:4.5px;padding-bottom:4.5px} .elementor-location-header > .e-con:first-child > .e-con:nth-child(2){padding-top:9px;padding-bottom:9px} .elementor-location-header > .e-con:nth-child(2){padding-top:9px;padding-bottom:9px} /* Utility text - GH computed: Exo 600, 1px tracking, 14.4px, uppercase. */ .elementor-location-header .gh-util__text{max-width:1140px;margin:0 auto;font-weight:600;letter-spacing:1px} .elementor-location-header .gh-util__addr{margin-right:1em} /* Utility links - the widget colour setting styles the p, not the anchors. */ .elementor-location-header .gh-util__text a, .elementor-location-header .gh-util__text a:visited{color:var(--e-global-color-text);text-decoration:none} .elementor-location-header .gh-util__text a:hover, .elementor-location-header .gh-util__text a:focus, .elementor-location-header .gh-util__text a:active{color:#363636} /* Palm - GH .site-nav-menu__btn:before. Plain background-image. */ .elementor-location-header .elementor-nav-menu--main .elementor-item{position:relative;z-index:0} .elementor-location-header .elementor-nav-menu--main .elementor-item::before{ content:'' !important;display:block !important; background-image:var(--gh-palm) !important; background-size:contain !important;background-position:center !important;background-repeat:no-repeat !important; -webkit-mask-image:none !important;mask-image:none !important;background-color:transparent !important; width:40px !important;height:40px !important;margin:auto !important; position:absolute !important;top:0 !important;left:0 !important;right:0 !important;bottom:0 !important; transition:opacity .35s ease-in-out !important;opacity:0 !important;z-index:-1 !important;pointer-events:none !important} .elementor-location-header .elementor-nav-menu--main .elementor-item:hover::before, .elementor-location-header .elementor-nav-menu--main .elementor-item:focus-visible::before, .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active::before{opacity:1 !important} /* Hamburger - GH .nav-toggle-btn: 3 bars, 25x3, 5px gaps, 18px pad, -18px margin */ .elementor-location-header .elementor-menu-toggle{background:none;border:0;border-radius:0;padding:18px;margin-right:-18px;width:25px;height:19px;box-sizing:content-box;position:relative} .elementor-location-header .elementor-menu-toggle svg{display:none} .elementor-location-header .elementor-menu-toggle::before{content:'';position:absolute;left:18px;top:18px;width:25px;height:3px;background-color:var(--e-global-color-text);box-shadow:0 8px 0 var(--e-global-color-text),0 16px 0 var(--e-global-color-text)} /* Site Identity has no logo, so the site-logo widget emits Elementor Pro's placeholder PNG. Hide only that file - a real logo appears automatically the moment one is set under Appearance > Customize > Site Identity. */ .elementor-location-header .gh-logo img[src*='logo-placeholder']{display:none} /* ===== STICKY BAR - class toggled by JS in the ghjs001 HTML widget ===== Replaces animation-timeline:scroll(), which needs Chrome 115+/Safari 26+ and was never verified firing. A scroll listener works everywhere. NOTE: the display:none rules below need !important - Elementor's own widget display rule has equal specificity and was winning, which put the 15-item mobile menu inside the desktop sticky bar. */ @media (min-width:1160px){ .elementor-location-header .elementor-menu-toggle{display:none !important} .elementor-location-header .gh-mm{display:none !important} .elementor-location-header > .e-con:nth-child(2){position:fixed;top:0;left:0;right:0;z-index:999;transform:translateY(-100%)} .elementor-location-header > .e-con:nth-child(2).gh-stuck{transform:translateY(0);transition:transform .3s ease-in-out} } @keyframes gh-sticky-in{from{transform:translateY(-100%)}to{transform:translateY(0)}} /* ===== MOBILE - GH switches at 1160px, not Elementor's 767 ===== */ @media (max-width:1159.98px){ .elementor-location-header .elementor-nav-menu--main{display:none} .elementor-location-header .elementor-menu-toggle{display:block} /* Bar order: nav/logo row first, utility bar second (matches GH). */ .elementor-location-header{display:flex;flex-direction:column} .elementor-location-header > .e-con:nth-child(2){order:1} .elementor-location-header > .e-con:first-child{order:2} .elementor-location-header > .e-con:first-child > .e-con:first-child{order:2} /* The desktop nav row's only mobile content is a second hamburger - drop it. The sticky bar is the mobile header. */ .elementor-location-header > .e-con:first-child > .e-con:nth-child(2){display:none !important} /* Sticky bar visible on mobile (was display:none), fixed once scrolled. */ .elementor-location-header > .e-con:nth-child(2){display:flex;position:relative;transform:none} .elementor-location-header > .e-con:nth-child(2) .elementor-element-ghnav03{display:none !important} .elementor-location-header > .e-con:nth-child(2) .gh-cta{display:none !important} .elementor-location-header > .e-con:nth-child(2).gh-stuck{position:fixed;top:0;left:0;right:0;z-index:999;animation:gh-sticky-in .3s ease-in-out both} /* Footer hidden on mobile. */ .elementor-location-footer{display:none !important} /* DELIBERATE DEVIATION - GH sets .site-location__address{margin-right:0} below 1160px. Copying that garbles the bar: address and phone are adjacent anchors with no whitespace, so they render as ...CA 90015213-789-7856. Keeping 1em. */ } /* GH container padding drops to 13px only below 544px. */ @media (max-width:543.98px){ .elementor-location-header > .e-con:first-child > .e-con:first-child{padding-left:13px;padding-right:13px} .elementor-location-header > .e-con:nth-child(2){padding-left:13px;padding-right:13px} } /* ===== OPENED MOBILE MENU (ghnav04 / .gh-mm) ===== */ html.gh-menu-open,html.gh-menu-open body{overflow:hidden !important} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown{ position:fixed;top:0;left:0;right:0;bottom:0; width:100%;height:100vh !important;height:100dvh !important;max-height:none !important; margin:0 !important;padding:0 !important;border:0 !important; background-color:#f4bfa0 !important; overflow-y:auto !important;z-index:10000} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown ul.elementor-nav-menu{ display:flex;flex-wrap:wrap;justify-content:center;align-content:center; min-height:100%;box-sizing:border-box;list-style:none; margin:0;padding:72px 26px 27px} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item{ flex:0 0 100%;max-width:100%;order:1;text-align:center;border:0} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item > a.elementor-item{ display:block;text-align:center; font-family:'Exo',sans-serif;font-size:27px;line-height:1.4;font-weight:600;letter-spacing:1px; color:#000 !important;background-color:transparent !important; padding:2px 0 !important;border:0 !important} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item > a.elementor-item:hover{color:#701800 !important} /* Rule between the list and the social row. */ .elementor-location-header .gh-mm .elementor-nav-menu--dropdown ul.elementor-nav-menu::before{ content:'';order:2;flex:0 0 100%;height:0; border-top:2px solid #000;margin:22px 0 18px} /* Instagram / Yelp / TikTok - text links become icons in one centred row. text-indent keeps the label in the DOM as the accessible name. Plain background-image: the PNGs are already black on transparent - do not mask-and-tint (that is what turned the palm yellow). */ .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-285, .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-286, .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-287{ flex:0 0 auto;max-width:none;order:3;margin:0 14px} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-285 > a.elementor-item, .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-286 > a.elementor-item, .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-287 > a.elementor-item{ display:block;width:30px;height:30px;padding:0 !important; text-indent:-9999px;overflow:hidden;white-space:nowrap; background-repeat:no-repeat;background-position:center;background-size:contain} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-285 > a.elementor-item{background-image:var(--gh-ig)} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-286 > a.elementor-item{background-image:var(--gh-yelp)} .elementor-location-header .gh-mm .elementor-nav-menu--dropdown li.menu-item-287 > a.elementor-item{background-image:var(--gh-tiktok)} /* Address. Elementor ships a clearfix on .elementor-nav-menu::after with visibility:hidden;overflow:hidden;line-height:0;height:0 - setting content alone leaves the text invisible, so all four are overridden here. */ .elementor-location-header .gh-mm .elementor-nav-menu--dropdown ul.elementor-nav-menu::after{ content:'1254 S FIGUEROA ST, 8TH FLOOR, LOS ANGELES, CA 90015'; order:4;flex:0 0 100%;text-align:center; visibility:visible !important;overflow:visible !important;clear:none !important; height:auto !important;width:auto !important;line-height:1.4 !important; font-family:'Exo',sans-serif;font-size:14.4px;font-weight:600;letter-spacing:1px; text-transform:uppercase;color:#000;margin-top:26px} /* Close control - the hamburger becomes an X, pinned top right above the panel. */ .elementor-location-header .gh-mm .elementor-menu-toggle.elementor-active{ position:fixed;top:0;right:0;margin-right:0;z-index:10001} .elementor-location-header .gh-mm .elementor-menu-toggle.elementor-active::before{ box-shadow:none;top:26px;transform:rotate(45deg)} .elementor-location-header .gh-mm .elementor-menu-toggle.elementor-active::after{ content:'';position:absolute;left:18px;top:26px;width:25px;height:3px; background-color:#000;transform:rotate(-45deg)}/* End custom CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'EXO'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://darkslateblue-wallaby-795902.hostingersite.com/wp-content/uploads/2026/08/4UaZrEtFpBI4f1ZSIK9d4LjJ4o0wOwRmO3ws9Iq2uA.woff2') format('woff2'); } /* End Custom Fonts CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'CA Spy Royal Regular'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://darkslateblue-wallaby-795902.hostingersite.com/wp-content/uploads/2026/08/NaFTJlKjShGQJqwAiIw9_Cape_Arcona_CASpyRoyal_Regular.woff') format('woff'); } /* End Custom Fonts CSS */