/* eb-flipbox-gn3r2 Starts */.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-gn3r2{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper.back-is-selected{transform:none}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-gn3r2{display:block}.root-eb-flipbox-gn3r2{position:relative}.root-eb-flipbox-gn3r2.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-gn3r2.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-gn3r2.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-gn3r2.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-gn3r2{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-gn3r2 .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-gn3r2{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-gn3r2 (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-gn3r2{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-gn3r2 .eb-flipbox-icon, .eb-flipbox-gn3r2 .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-gn3r2 .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-gn3r2 .eb-flipbox-icon figure, .eb-flipbox-gn3r2 .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-gn3r2 .eb-flipbox-container, .eb-flipbox-gn3r2 .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-gn3r2 .eb-flipbox-container:hover, .eb-flipbox-gn3r2 .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-gn3r2 .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-gn3r2 .eb-flipbox-button-container a, .eb-flipbox-gn3r2 .eb-flipbox-button-container a:hover, .eb-flipbox-gn3r2 .eb-flipbox-button-container a:focus, .eb-flipbox-gn3r2 .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-gn3r2 .eb-flipbox-button-container a::before, .eb-flipbox-gn3r2 .eb-flipbox-button-container a::after, .eb-flipbox-gn3r2 .eb-flipbox-button-container a:hover::before, .eb-flipbox-gn3r2 .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-gn3r2 .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-gn3r2= Ends *//* eb-flipbox-56icu Starts */.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-56icu{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper.back-is-selected{transform:rotateY(-180deg)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-56icu .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-56icu{display:block}.root-eb-flipbox-56icu{position:relative}.root-eb-flipbox-56icu.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-56icu.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-56icu.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-56icu.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-56icu{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-56icu .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-56icu{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-56icu (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-56icu{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-56icu .eb-flipbox-icon, .eb-flipbox-56icu .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-56icu .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-56icu .eb-flipbox-icon figure, .eb-flipbox-56icu .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-56icu .eb-flipbox-container, .eb-flipbox-56icu .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-56icu .eb-flipbox-container:hover, .eb-flipbox-56icu .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-56icu .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-56icu .eb-flipbox-button-container a, .eb-flipbox-56icu .eb-flipbox-button-container a:hover, .eb-flipbox-56icu .eb-flipbox-button-container a:focus, .eb-flipbox-56icu .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-56icu .eb-flipbox-button-container a::before, .eb-flipbox-56icu .eb-flipbox-button-container a::after, .eb-flipbox-56icu .eb-flipbox-button-container a:hover::before, .eb-flipbox-56icu .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-56icu .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-56icu= Ends *//* eb-flipbox-9z1vu Starts */.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-9z1vu{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper.back-is-selected{transform:none}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-9z1vu{display:block}.root-eb-flipbox-9z1vu{position:relative}.root-eb-flipbox-9z1vu.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-9z1vu.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-9z1vu.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-9z1vu.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-9z1vu{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-9z1vu .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-9z1vu{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-9z1vu (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-9z1vu{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-9z1vu .eb-flipbox-icon, .eb-flipbox-9z1vu .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-9z1vu .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-9z1vu .eb-flipbox-icon figure, .eb-flipbox-9z1vu .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-9z1vu .eb-flipbox-container, .eb-flipbox-9z1vu .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-9z1vu .eb-flipbox-container:hover, .eb-flipbox-9z1vu .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-9z1vu .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-9z1vu .eb-flipbox-button-container a, .eb-flipbox-9z1vu .eb-flipbox-button-container a:hover, .eb-flipbox-9z1vu .eb-flipbox-button-container a:focus, .eb-flipbox-9z1vu .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-9z1vu .eb-flipbox-button-container a::before, .eb-flipbox-9z1vu .eb-flipbox-button-container a::after, .eb-flipbox-9z1vu .eb-flipbox-button-container a:hover::before, .eb-flipbox-9z1vu .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-9z1vu .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-9z1vu= Ends *//* eb-flipbox-o1b6m Starts */.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-o1b6m{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper.back-is-selected{transform:none}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-o1b6m{display:block}.root-eb-flipbox-o1b6m{position:relative}.root-eb-flipbox-o1b6m.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-o1b6m.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-o1b6m.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-o1b6m.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-o1b6m{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-o1b6m .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-o1b6m{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-o1b6m (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-o1b6m{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-o1b6m .eb-flipbox-icon, .eb-flipbox-o1b6m .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-o1b6m .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-o1b6m .eb-flipbox-icon figure, .eb-flipbox-o1b6m .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-o1b6m .eb-flipbox-container, .eb-flipbox-o1b6m .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-o1b6m .eb-flipbox-container:hover, .eb-flipbox-o1b6m .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-o1b6m .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-o1b6m .eb-flipbox-button-container a, .eb-flipbox-o1b6m .eb-flipbox-button-container a:hover, .eb-flipbox-o1b6m .eb-flipbox-button-container a:focus, .eb-flipbox-o1b6m .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-o1b6m .eb-flipbox-button-container a::before, .eb-flipbox-o1b6m .eb-flipbox-button-container a::after, .eb-flipbox-o1b6m .eb-flipbox-button-container a:hover::before, .eb-flipbox-o1b6m .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-o1b6m .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-o1b6m= Ends *//* eb-flipbox-srb69 Starts */.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-srb69{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper.back-is-selected{transform:rotateY(-180deg)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-srb69 .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-srb69{display:block}.root-eb-flipbox-srb69{position:relative}.root-eb-flipbox-srb69.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-srb69.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-srb69.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-srb69.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-srb69{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-srb69 .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-srb69{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-srb69 (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-srb69{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-srb69 .eb-flipbox-icon, .eb-flipbox-srb69 .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-srb69 .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-srb69 .eb-flipbox-icon figure, .eb-flipbox-srb69 .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-srb69 .eb-flipbox-container, .eb-flipbox-srb69 .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-srb69 .eb-flipbox-container:hover, .eb-flipbox-srb69 .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-srb69 .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-srb69 .eb-flipbox-button-container a, .eb-flipbox-srb69 .eb-flipbox-button-container a:hover, .eb-flipbox-srb69 .eb-flipbox-button-container a:focus, .eb-flipbox-srb69 .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-srb69 .eb-flipbox-button-container a::before, .eb-flipbox-srb69 .eb-flipbox-button-container a::after, .eb-flipbox-srb69 .eb-flipbox-button-container a:hover::before, .eb-flipbox-srb69 .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-srb69 .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-srb69= Ends *//* eb-flipbox-qvdle Starts */.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-qvdle{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper.back-is-selected{transform:rotateY(-180deg)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-qvdle .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-qvdle{display:block}.root-eb-flipbox-qvdle{position:relative}.root-eb-flipbox-qvdle.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-qvdle.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-qvdle.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-qvdle.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-qvdle{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-qvdle .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-qvdle{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-qvdle (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-qvdle{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-qvdle .eb-flipbox-icon, .eb-flipbox-qvdle .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-qvdle .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-qvdle .eb-flipbox-icon figure, .eb-flipbox-qvdle .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-qvdle .eb-flipbox-container, .eb-flipbox-qvdle .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-qvdle .eb-flipbox-container:hover, .eb-flipbox-qvdle .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-qvdle .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-qvdle .eb-flipbox-button-container a, .eb-flipbox-qvdle .eb-flipbox-button-container a:hover, .eb-flipbox-qvdle .eb-flipbox-button-container a:focus, .eb-flipbox-qvdle .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-qvdle .eb-flipbox-button-container a::before, .eb-flipbox-qvdle .eb-flipbox-button-container a::after, .eb-flipbox-qvdle .eb-flipbox-button-container a:hover::before, .eb-flipbox-qvdle .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-qvdle .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-qvdle= Ends *//* eb-flipbox-z3a8l Starts */.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-z3a8l{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper.back-is-selected{transform:rotateY(-180deg)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-z3a8l{display:block}.root-eb-flipbox-z3a8l{position:relative}.root-eb-flipbox-z3a8l.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-z3a8l.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-z3a8l.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-z3a8l.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-z3a8l{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-z3a8l .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-z3a8l{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-z3a8l (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-z3a8l{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-z3a8l .eb-flipbox-icon, .eb-flipbox-z3a8l .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-z3a8l .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-z3a8l .eb-flipbox-icon figure, .eb-flipbox-z3a8l .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-z3a8l .eb-flipbox-container, .eb-flipbox-z3a8l .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-z3a8l .eb-flipbox-container:hover, .eb-flipbox-z3a8l .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-z3a8l .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-z3a8l .eb-flipbox-button-container a, .eb-flipbox-z3a8l .eb-flipbox-button-container a:hover, .eb-flipbox-z3a8l .eb-flipbox-button-container a:focus, .eb-flipbox-z3a8l .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-z3a8l .eb-flipbox-button-container a::before, .eb-flipbox-z3a8l .eb-flipbox-button-container a::after, .eb-flipbox-z3a8l .eb-flipbox-button-container a:hover::before, .eb-flipbox-z3a8l .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-z3a8l .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-z3a8l= Ends *//* eb-flipbox-urfds Starts */.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-urfds{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper.back-is-selected{transform:none}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-urfds .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-urfds{display:block}.root-eb-flipbox-urfds{position:relative}.root-eb-flipbox-urfds.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-urfds.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-urfds.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-urfds.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-urfds{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-urfds .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-urfds{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-urfds (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-urfds{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-urfds .eb-flipbox-icon, .eb-flipbox-urfds .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-urfds .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-urfds .eb-flipbox-icon figure, .eb-flipbox-urfds .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-urfds .eb-flipbox-container, .eb-flipbox-urfds .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-urfds .eb-flipbox-container:hover, .eb-flipbox-urfds .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-urfds .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-urfds .eb-flipbox-button-container a, .eb-flipbox-urfds .eb-flipbox-button-container a:hover, .eb-flipbox-urfds .eb-flipbox-button-container a:focus, .eb-flipbox-urfds .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-urfds .eb-flipbox-button-container a::before, .eb-flipbox-urfds .eb-flipbox-button-container a::after, .eb-flipbox-urfds .eb-flipbox-button-container a:hover::before, .eb-flipbox-urfds .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-urfds .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-urfds= Ends *//* eb-flipbox-pi51s Starts */.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-items-container{align-items:center}.eb-flipbox-align-center .eb-flipper{margin-right:auto !important;margin-left:auto !important}.eb-flipbox-align-right .eb-flipper{margin-left:auto !important}.eb-flipbox-container.eb-flipbox-pi51s{margin-top:0px;margin-bottom:0px;width:100%;overflow:hidden}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-front-title,.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-back-title{font-family:"Montserrat",sans-serif;font-weight:500;width:100%;text-align:center}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-front-title{color:var(--eb-global-heading-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-back-title{color:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-front-content,.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-back-content{font-family:"Lato",sans-serif;width:100%;text-align:center;margin:10px 0}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-front-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-back-content{color:var(--eb-global-text-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper{transition:0.6s;min-height:390px;max-width:600px}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper.back-is-selected{transform:rotateY(-180deg)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper .eb-flipbox-front{background-color:var(--eb-global-background-color);min-height:390px;max-width:600px;display:flex;justify-content:center;align-items:center;height:auto;width:100%;z-index:1;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper .eb-flipbox-front:before{transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-front .eb-flipbox-front-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-icon-front{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-icon-front .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-icon-front svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-icon-back{font-size:50px;color:var(--eb-global-primary-color);background:transparent;width:100%;text-align:center;display:none;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-icon-back .dashicons{font-size:50px}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-icon-back svg{width:50px;height:50px;fill:var(--eb-global-primary-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper .eb-flipbox-back{z-index:2;position:relative;background-color:var(--ast-global-color-0);min-height:390px;max-width:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;transform:false;transition:background 0.5s,border 0.5s,border-radius 0.5s,box-shadow 0.5s;cursor:default}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper .eb-flipbox-back:before{content:"";position:absolute;top:0;bottom:0;right:0;left:0;z-index:-1;opacity:1;filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate(0deg );transition:background 0.5s,opacity 0.5s,filter 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper .eb-flipbox-front,.eb-flipbox-container.eb-flipbox-pi51s .eb-flipper .eb-flipbox-back{position:absolute}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-back .eb-flipbox-back-image-container{display:flex;justify-content:center}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link{width:100px;background:var(--eb-global-button-background-color);color:var(--eb-global-button-text-color);transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content{display:flex;flex-direction:row-reverse;justify-content:space-around;align-items:center}.eb-flipbox-container.eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content .eb-flipbox-button-icon{display:block}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image{width:240px;height:240px;transition:border 0.5s,border-radius 0.5s,box-shadow 0.5s}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-back-image img{object-fit:contain;object-position:center center;filter:blur(0px)brightness(1)contrast(1)grayscale(0)hue-rotate(0deg)invert(0)opacity(1)saturate(1)sepia(0)}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper figcaption{color:var(--eb-global-primary-color);text-align:center;font-size:13px}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-img-caption-style-1 figcaption{background:var(--eb-global-background-color)}.eb-parent-eb-flipbox-pi51s{display:block}.root-eb-flipbox-pi51s{position:relative}.root-eb-flipbox-pi51s.eb_liquid_glass-effect1{background-color:#753B3B1F;backdrop-filter:blur(20px)}.root-eb-flipbox-pi51s.eb_liquid_glass-effect2{background-color:#753B3B1F;backdrop-filter:blur(20px) brightness(1)}.root-eb-flipbox-pi51s.eb_liquid_glass_shadow-effect1{border-width:1px;border-color:#FFFFFF1F;border-style:solid;border-radius:24px}.root-eb-flipbox-pi51s.eb_liquid_glass-effect2 > .eb-parent-wrapper > div{background:transparent} @media(max-width: 1024px){.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper .eb-image-wrapper-inner.eb-flipbox-front-image{width:250px;height:250px}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-pi51s{display:block}} @media(max-width: 767px){.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper figcaption{text-align:center}.eb-flipbox-container.eb-flipbox-pi51s .eb-image-wrapper figcaption{text-align:center}.eb-parent-eb-flipbox-pi51s{display:block}}/* ========================================================= MDM — Essential Blocks Flip Box (SAFE 3D LIFT ONLY) Scope: .eb-flipbox-pi51s (THIS block only) Goals: ✅ Restore front face layout (no shrink / no overlays) ✅ Add production-like 3D lift to the whole card ✅ Keep your button EXACTLY as-is ✅ Remove leftover CSS/text arrow if it still appears ========================================================= */ .eb-flipbox-pi51s{ /* Safe 3D stage (wrapper lift only) */ perspective: 1200px; } /* ========================================================= 1) FIX FRONT FACE "TINY IMAGE" / LAYOUT BREAK (prevents image from shrinking due to wrapper sizing) ========================================================= */ /* Ensure the icon/image wrapper can actually be wide */ .eb-flipbox-pi51s .eb-flipbox-icon, .eb-flipbox-pi51s .eb-flipbox-icon-container{ width: 100% !important; max-width: 100% !important; } /* Force the front image to render at natural responsive size */ .eb-flipbox-pi51s .eb-flipbox-icon img{ display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; } /* If EB uses a figure wrapper */ .eb-flipbox-pi51s .eb-flipbox-icon figure, .eb-flipbox-pi51s .eb-flipbox-icon-container figure{ margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* ========================================================= 2) PRODUCTION-LIKE 3D LIFT (OUTER CARD ONLY) (no translateZ on inner content, no sheen overlay) ========================================================= */ .eb-flipbox-pi51s .eb-flipbox-container, .eb-flipbox-pi51s .eb-flipbox-wrapper{ transform: translateY(0) !important; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important; box-shadow: 0 10px 28px rgba(0,0,0,.10) !important; } .eb-flipbox-pi51s .eb-flipbox-container:hover, .eb-flipbox-pi51s .eb-flipbox-wrapper:hover{ transform: translateY(-6px) !important; box-shadow: 0 20px 52px rgba(0,0,0,.16) !important; filter: brightness(1.01) !important; } /* ========================================================= 3) BUTTON — YOUR DESIGN (UNCHANGED) ========================================================= */ /* Center the button container */ .eb-flipbox-pi51s .eb-flipbox-button-container{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:20px !important; } /* Force NO underline anywhere */ .eb-flipbox-pi51s .eb-flipbox-button-container a, .eb-flipbox-pi51s .eb-flipbox-button-container a:hover, .eb-flipbox-pi51s .eb-flipbox-button-container a:focus, .eb-flipbox-pi51s .eb-flipbox-button-container a:active{ text-decoration:none !important; border-bottom:none !important; box-shadow:none !important; } /* Kill underline-like pseudo-elements some themes add */ .eb-flipbox-pi51s .eb-flipbox-button-container a::before, .eb-flipbox-pi51s .eb-flipbox-button-container a::after, .eb-flipbox-pi51s .eb-flipbox-button-container a:hover::before, .eb-flipbox-pi51s .eb-flipbox-button-container a:hover::after{ content:none !important; display:none !important; } /* TRUE CIRCLE + FORCE COLOR */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; background:#2cc895 !important; background-color:#2cc895 !important; border:2px solid #ffffff !important; border-radius:50% !important; padding:0 !important; box-sizing:border-box !important; animation: mdmPulseGlow 1.8s ease-in-out infinite !important; transition: transform .25s ease-in-out, box-shadow .25s ease-in-out, filter .25s ease-in-out !important; } /* Ensure inner wrapper doesn't mess with sizing */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; background:transparent !important; } /* ========================================================= 4) REMOVE ANY LEFTOVER "CSS/TEXT ARROW" (without killing Font Awesome icon) ========================================================= */ /* If a text arrow is inside span, make the text invisible but keep children */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content span{ font-size:0 !important; line-height:0 !important; } /* Kill pseudo-element arrows if they exist */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content span::before, .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content span::after, .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link::before, .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link::after{ content:none !important; display:none !important; } /* Font Awesome icon stays visible + white */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-content i{ color:#ffffff !important; font-size:22px !important; line-height:1 !important; } /* Hover: slightly lift + stronger glow */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link:hover{ transform: translateY(-2px) !important; box-shadow: 0 14px 28px rgba(44, 200, 149, 0.35) !important; filter: brightness(1.02) !important; animation-play-state: paused !important; } /* Keyboard focus */ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link:focus, .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link:focus-visible{ outline:none !important; box-shadow: 0 0 0 4px rgba(44, 200, 149, 0.25), 0 14px 28px rgba(44, 200, 149, 0.30) !important; } /* Pulse / glow keyframes */ @keyframes mdmPulseGlow{ 0%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.45); } 55%{ box-shadow: 0 0 0 10px rgba(44, 200, 149, 0.00); } 100%{ box-shadow: 0 0 0 0 rgba(44, 200, 149, 0.00); } } /* Respect reduced motion (accessibility) */ @media (prefers-reduced-motion: reduce){ .eb-flipbox-pi51s .eb-flipbox-button-container .eb-flipbox-button-link{ animation:none !important; } } /* =eb-flipbox-pi51s= Ends */