/* ============================================================ SCROLL ANIMATION — WORK INDEX FADE UP Paste into: Semplice > Settings > Custom CSS ============================================================ */ /* 1. Initial hidden state */ .fp-section .wm-animate { opacity: 0; transform: translateY(20px); transition: opacity 0.55s ease, transform 0.55s ease; will-change: opacity, transform; } /* 2. Triggered state — JS adds this class when section goes active */ .fp-section.active .wm-animate.is-visible { opacity: 1; transform: translateY(0); } /* 3. Instant reset when leaving a section (re-animates on return) */ .fp-section:not(.active) .wm-animate { opacity: 0; transform: translateY(20px); transition: none; } @media screen and (min-width: 544px) and (max-width: 767.98px){/* SVG Fill Color on Cover */ .semplice-navbar:not(.cover-transparent) .logo a svg path { fill: black !important; } /* Menu Item Color on Cover */ .semplice-navbar:not(.cover-transparent) .menu-item a span { color: black !important; } /* Hamburger and X Color on Cover */ .semplice-navbar:not(.cover-transparent) .navbar-inner .hamburger a.menu-icon span { background-color: black !important; }}@media screen and (max-width: 543.98px){ /* SVG Fill Color on Cover */ .semplice-navbar:not(.cover-transparent) .logo a svg path { fill: black !important; } /* Menu Item Color on Cover */ .semplice-navbar:not(.cover-transparent) .menu-item a span { color: black !important; } /* Hamburger and X Color on Cover */ .semplice-navbar:not(.cover-transparent) .navbar-inner .hamburger a.menu-icon span { background-color: black !important; } .is-frontend .semplice-navbar {position: fixed !important;} .custom-grid .column { width: 20% !important; max-width: 20% !important; flex-basis: 20% !important; } }#nprogress .bar { background: #ffd300; }#nprogress .bar { height: 1.1111111111111112rem; }.back-to-top { display: none !important; }.back-to-top a svg { fill: transparent; } .semplice-cursor #semplice-cursor .semplice-cursor-inner { background-color: #ffffff; }.semplice-cursor #semplice-cursor { mix-blend-mode: difference; }.semplice-cursor #semplice-cursor .semplice-cursor-inner .cursor-text { font-family: "IngramMono-Regular", sans-serif;font-weight: 400;font-variation-settings: normal;font-style: normal; } #content-holder .thumb .thumb-inner .thumb-hover {background-color: rgba(0, 0, 0, 0.5);background-size: auto;background-position: 0% 0%;background-repeat: no-repeat;}#content-holder .thumb .thumb-hover-meta { padding: 2.22rem; }#content-holder .thumb .thumb-hover-meta .title { color: #ffffff; font-size: 1.33rem; text-transform: none; }#content-holder .thumb .thumb-hover-meta .category { color: #999999; font-size: 1rem; text-transform: none; }#content-holder .thumb video { opacity: 1; }

Big Power. Zero Drama.

[02—10]

Demonstrating the relaxed and ridiculous power of clean energy

Our Energy

Big Power.
Zero Drama.

Client: Our Energy
Agency: Brunswick
Production Partner: Stink
Role: Creative Director

Clean energy is incredibly powerful. Unfortunately, the way we talk about it isn’t always quite as exciting. Big Power. Zero Drama. flips the script, using John Cena to demonstrate the ridiculous abundance and power of clean energy through a series of equally ridiculous feats of strength. Bears are out-tugged, boulders are demolished and hang gliders are powered, all without Cena breaking a sweat. Because when you have this much power, you don’t need to make a big deal about it.

Boulders :30

Bears :30

Hang Glider :30