body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none} h1, h2, h3 { font-weight: normal; } amp-story-page { background-color: #131516; } amp-story-grid-layer { overflow: visible; } @media (max-aspect-ratio: 9 / 16) { @media (min-aspect-ratio: 320 / 678) { amp-story-grid-layer.grid-layer { margin-top: calc((100% / 0.5625 - 100% / 0.6666666666666666) / 2); } } } @media not all and (min-resolution:.001dpcm) { @media { p.text-wrapper > span { font-size: calc(100% - 0.5px); } } } .page-fullbleed-area, .page-background-overlay-area { position: absolute; overflow: hidden; width: 100%; left: 0; height: calc(1.1851851851851851 * 100%); top: calc((1 - 1.1851851851851851) * 100% / 2); } .element-overlay-area { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .page-safe-area { overflow: visible; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: calc(0.84375 * 100%); margin: auto 0; } .mask { position: absolute; overflow: hidden; } .fill { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 0; } @media (prefers-reduced-motion: no-preference) { .animation-wrapper { opacity: var(--initial-opacity); transform: var(--initial-transform); } } amp-story-grid-layer.align-bottom { align-content: end; padding: 0; /* AMP CTA Layer will exactly occupy 74px regardless of any device. To space out captions 74px from the BOTTOM (AMP CTA Layer), 74px from the TOP should also be spaced out and thus: 2 * 74px will be the desired max-height. */ max-height: calc(100vh - (2 * 74px)); } .captions-area { padding: 0 32px 0; } amp-story-captions { margin-bottom: 16px; text-align: center; } amp-story-audio-sticker { height: 100%; } .audio-sticker { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; } Sample Web Story

Sustainability Tips for Living Green Daily

Written by John Doe

July 22, 2020

[{"selector":"#anim-90081f2f-36bc-4aee-aebe-18b1b58d1224","keyframes":{"opacity":[0,1]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-f07bef26-a678-4426-aef4-6b34ba051be3","keyframes":{"transform":["translate3d(-100%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-5de63f1b-88de-4a9c-896e-fb2c3a931d06","keyframes":{"opacity":[0,1]},"delay":0,"duration":750,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}]

Travel slow if you can

Tip 1

[{"selector":"#anim-307975fa-5aac-4562-8a04-c036be122244 [data-leaf-element=\"true\"]","keyframes":{"transform":["translate3d(0, -6.756756494358436%, 0)","translate3d(0, 0%, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}]
Cloud Banner

If you have the luxury of time, try traveling by train or by boat to offset carbon emissions

[{"selector":"#anim-0ebd02bd-4fb7-4be2-bcbf-74d7a0736ec6","keyframes":{"opacity":[0,1]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-e571755c-1e43-4e0e-9cbe-28890bb727e3","keyframes":{"transform":["translate3d(-114.68531%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-8c42cb28-03c7-4138-886c-72aa69bbb55b","keyframes":{"opacity":[0,1]},"delay":0,"duration":750,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}]

Choose your airlines wisely

Tip 2

[{"selector":"#anim-15c95e52-3055-46e8-afd8-58ea308e55c1 [data-leaf-element=\"true\"]","keyframes":{"transform":["translate3d(0, -4.826254563856488%, 0)","translate3d(0, 0%, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}]
Cloud Banner

Pick an airline that lets you offset your travel emissions when you purchase your ticket.

[{"selector":"#anim-46f8fcb1-da29-479c-9ec2-73723bb07091","keyframes":{"opacity":[0,1]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-11e17713-6e00-4a31-8a0c-8879bf3a57a2","keyframes":{"transform":["translate3d(-96.29214%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-e3b049ea-69b8-4bf6-a98c-9e9892dc5e13","keyframes":{"opacity":[0,1]},"delay":0,"duration":750,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}]

Reduce your waste

Tip 3

[{"selector":"#anim-8b0f44d1-394e-403e-8070-537250ad01d5 [data-leaf-element=\"true\"]","keyframes":{"transform":["translate3d(0, 13.51351377591183%, 0)","translate3d(0, 0%, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}]
Cloud Banner

The amount of trash we generate personally on a daily and annual basis is staggering. Whenever possible, bring your own utensils and bags.

[{"selector":"#anim-492e11fd-9497-461b-87fb-be96ce7f9ad9","keyframes":{"opacity":[0,1]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-1e641606-b325-4852-95c2-5afc06791098","keyframes":{"transform":["translate3d(-108.60533%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":7000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}][{"selector":"#anim-2c75b522-ac14-4a80-9633-d03c41510098","keyframes":{"opacity":[0,1]},"delay":0,"duration":750,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}]

Buy in bulk

Tip 4

[{"selector":"#anim-afb5196a-2a25-4d25-8e05-0c7e07238f49 [data-leaf-element=\"true\"]","keyframes":{"transform":["translate3d(0, 13.51351377591183%, 0)","translate3d(0, 0%, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}]
Cloud Banner

Not only is it cheaper to buy in bulk, you reduce the amount of product packaging going into landfills.

[{"selector":"#anim-3571e6e5-f180-4dc2-90e0-2e4a5aa624f5","keyframes":{"opacity":[0,1]},"delay":0,"duration":750,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}]

Reduce food waste

Tip 5

[{"selector":"#anim-49b56e6d-c2bf-47ea-8e6c-fd2fa9894516 [data-leaf-element=\"true\"]","keyframes":{"transform":["translate3d(0, 13.51351377591183%, 0)","translate3d(0, 0%, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}]
Cloud Banner

Reducing food waste and composting are great ways to offset your footprint. Find a community compost station near you.

[{"selector":"#anim-5800f84f-bf99-4050-9a82-1c2f030e9f9f","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}]

Energy saving tips that will save the world

From Jane Dow

Up Next