Pen Settings

HTML

About HTML Preprocessors

HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.

Learn more · Versions

Adding Classes

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html> tag. If you want to add classes there that can affect the whole document, this is the place to do it.

About the <head>

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. If you need things in the <head> of the document, put that code here.

!
Insecure Resource

The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.

CSS

About CSS Preprocessors

CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.

Learn more · Versions

CSS Base

About CSS Base

It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.

Vendor Prefixing

About Vendor Prefixing

To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit- or -moz-.

We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

Powered by Algolia
About External Resources

You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.

You can also link to another Pen here (use the .css URL Extension) and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, use the appropriate URL Extension and we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ add another resource

JavaScript

About JavaScript Preprocessors

JavaScript preprocessors can help make authoring JavaScript easier and more convenient.

Learn more · Versions

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

Powered by Algolia
About External Resources

You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.

If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.

You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Powered by Algolia
About Packages

Using packages here is powered by Skypack, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ES6 import usage.

All packages are different, so refer to their docs for how they work.

If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML 

              
                <div id="gspb_gsap-gsbp-08520a27-b848" class="wp-block-greenshift-blocks-animation-container alignwide"><div id="gsbp-08520a27-b848" class="gs-gsap-wrap" data-duration="1" data-triggertype="load" data-stdelay="0.07" data-from="yes">
<div id="gspb_container-id-gsbp-b8cb1482-5e82" class="gspb_container gspb_container-gsbp-b8cb1482-5e82 wp-block-greenshift-blocks-container alignwide" data-gsapinit="1" data-from="yes" data-duration="0.7" data-y="40" data-s="1" data-origin="bottom center" data-stchild="yes" data-triggertype="load">
<div id="gspb_container-id-gsbp-68413be4-1dd0" class="gspb_container gspb_container-gsbp-68413be4-1dd0 wp-block-greenshift-blocks-container staggercont">
<div id="gspb_svgBox-id-gsbp-7042de48-be6f" class="gspb_svgBox gspb_svgBox-id-gsbp-7042de48-be6f wp-block-greenshift-blocks-svgshape"><svg width="78" style="width:5rem;height:5rem;margin:10px" height="78" viewBox="0 0 78 78" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M53.625 29.25H24.375V31.6875H53.625V29.25Z" fill="#333333"></path>
<path d="M64.0928 76.7813H53.625V74.3438C53.625 70.9106 51.9846 67.6297 49.2363 65.5688L50.7 63.6188C54.0577 66.1379 56.0625 70.1476 56.0625 74.3438H62.6572L66.2793 67.8247C67.5675 65.5054 68.25 62.8753 68.25 60.2209C68.25 54.973 65.6431 50.1028 61.2763 47.1912L54.1673 42.4515L55.5189 40.4235L62.6279 45.1632C67.6748 48.527 70.6875 54.1564 70.6875 60.2209C70.6875 63.2897 69.9002 66.3281 68.4097 69.0093L64.0928 76.7813ZM24.375 76.7813H13.9072L9.59034 69.0081C8.09981 66.3281 7.3125 63.2885 7.3125 60.2209C7.3125 54.1564 10.3253 48.527 15.3709 45.1632L22.4798 40.4235L23.8314 42.4515L16.7225 47.1912C12.3569 50.1016 9.75 54.973 9.75 60.2209C9.75 62.8766 10.4325 65.5054 11.7207 67.8247L15.3428 74.3438H21.9375C21.9375 70.1476 23.9423 66.1379 27.2988 63.6188L28.7625 65.5688C26.0154 67.6297 24.375 70.9106 24.375 74.3438V76.7813Z" fill="#333333"></path>
<path d="M35.3425 67.0312H32.9062C26.8576 67.0312 21.9375 62.1112 21.9375 56.0625V35.3438C21.9375 21.0953 28.4286 1.21875 39 1.21875C49.5714 1.21875 56.0625 21.0953 56.0625 35.3438V56.0625C56.0625 62.1112 51.1424 67.0312 45.0938 67.0312H42.6562H35.3425Z" fill="#F9BA48"></path>
<path d="M40.2188 10.9688H37.7812V35.3438H40.2188V10.9688Z" fill="#333333"></path>
<path d="M40.2188 48.75H37.7812V59.7188H40.2188V48.75Z" fill="#333333"></path>
<path d="M28.0312 30.4688H25.5938V63.375H28.0312V30.4688Z" fill="#333333"></path>
<path d="M52.4062 30.4688H49.9688V63.375H52.4062V30.4688Z" fill="#333333"></path>
<path d="M39 46.3125C35.6399 46.3125 32.9062 43.5788 32.9062 40.2188C32.9062 36.8587 35.6399 34.125 39 34.125C42.3601 34.125 45.0938 36.8587 45.0938 40.2188C45.0938 43.5788 42.3601 46.3125 39 46.3125ZM39 36.5625C36.9842 36.5625 35.3438 38.2029 35.3438 40.2188C35.3438 42.2346 36.9842 43.875 39 43.875C41.0158 43.875 42.6562 42.2346 42.6562 40.2188C42.6562 38.2029 41.0158 36.5625 39 36.5625ZM43.875 76.7812H34.125V63.375C34.125 60.6864 36.3114 58.5 39 58.5C41.6886 58.5 43.875 60.6864 43.875 63.375V76.7812ZM36.5625 74.3438H41.4375V63.375C41.4375 62.0307 40.3443 60.9375 39 60.9375C37.6557 60.9375 36.5625 62.0307 36.5625 63.375V74.3438Z" fill="#333333"></path>
<path d="M76.7812 2.4375H74.3438V35.3438H76.7812V2.4375Z" fill="#333333"></path>
<path d="M76.7812 37.7812H74.3438V40.2188H76.7812V37.7812Z" fill="#333333"></path>
<path d="M3.65625 7.3125H1.21875V41.4375H3.65625V7.3125Z" fill="#333333"></path>
<path d="M3.65625 43.875H1.21875V46.3125H3.65625V43.875Z" fill="#333333"></path>
<path d="M12.1875 2.4375H9.75V30.4688H12.1875V2.4375Z" fill="#333333"></path>
<path d="M12.1875 32.9062H9.75V35.3438H12.1875V32.9062Z" fill="#333333"></path>
<path d="M65.8125 4.875H63.375V26.8125H65.8125V4.875Z" fill="#333333"></path>
<path d="M65.8125 29.25H63.375V31.6875H65.8125V29.25Z" fill="#333333"></path>
</svg></div>



<h4 id="gspb_heading-id-gsbp-5f7f927a-00e9" class="gspb_heading gspb_heading-id-gsbp-5f7f927a-00e9 ">Extremely Fast</h4>



<div id="gspb_heading-id-gsbp-e63e6a60-7d44" class="gspb_heading gspb_heading-id-gsbp-e63e6a60-7d44 ">Theme uses unique conditional asset loading, only 2 kb required styles. Nothing is loaded until you use it on page</div>
</div>



<div id="gspb_container-id-gsbp-63624394-f85d" class="gspb_container gspb_container-gsbp-63624394-f85d wp-block-greenshift-blocks-container staggercont">
<div id="gspb_svgBox-id-gsbp-236427db-4fab" class="gspb_svgBox gspb_svgBox-id-gsbp-236427db-4fab wp-block-greenshift-blocks-svgshape"><svg width="81" style="width:5rem;height:5rem;margin:10px" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.9193 75.1073C22.3485 76.7513 23.5699 78.4688 25.3101 78.4688H70.8726C72.6141 78.4688 73.8354 76.7513 73.2634 75.1073L60.0072 48.0938H36.173L22.9193 75.1073Z" fill="#FFA64D"></path>
<path d="M74.4604 74.6921L55.6836 36.4095L55.6861 21.5156C57.7794 21.5156 59.483 19.8121 59.483 17.7188C59.483 15.6254 57.7794 13.9219 55.6861 13.9219H40.4986C38.4053 13.9219 36.7017 15.6254 36.7017 17.7188C36.7017 19.8121 38.4053 21.5156 40.4986 21.5156L40.4961 36.4095L21.7825 74.5491L21.7231 74.6909C21.3206 75.8502 21.5054 77.1386 22.2167 78.1384C22.9267 79.1383 24.0834 79.7344 25.3111 79.7344H70.8736C72.1 79.7344 73.2568 79.1383 73.9668 78.1384C74.6768 77.1386 74.8616 75.8514 74.4604 74.6921ZM71.9038 76.6716C71.6634 77.0095 71.2875 77.2031 70.8736 77.2031H25.3111C24.896 77.2031 24.5201 77.0095 24.2796 76.6716C24.0518 76.3514 23.986 75.9578 24.0948 75.5844L43.0261 36.998L43.0299 18.9844H40.4986C39.8012 18.9844 39.233 18.4161 39.233 17.7188C39.233 17.0214 39.8012 16.4531 40.4986 16.4531H55.6861C56.3835 16.4531 56.9517 17.0214 56.9517 17.7188C56.9517 18.4161 56.3835 18.9844 55.6861 18.9844H53.1549V21.5156H48.0898V24.0469H53.1536V26.5781H48.0898V29.1094H53.1536V31.6406H48.0898V34.1719H53.1523V36.9968L72.0873 75.5831C72.1974 75.9578 72.1316 76.3514 71.9038 76.6716Z" fill="#333333"></path>
<path d="M53.1523 50.625C49.663 50.625 46.8242 53.4638 46.8242 56.9531C46.8242 60.4425 49.663 63.2812 53.1523 63.2812C56.6417 63.2812 59.4805 60.4425 59.4805 56.9531C59.4805 53.4638 56.6404 50.625 53.1523 50.625ZM53.1523 60.75C51.059 60.75 49.3555 59.0465 49.3555 56.9531C49.3555 54.8598 51.059 53.1562 53.1523 53.1562C55.2457 53.1562 56.9492 54.8598 56.9492 56.9531C56.9492 59.0465 55.2457 60.75 53.1523 60.75ZM37.9648 64.5469C35.8715 64.5469 34.168 66.2504 34.168 68.3438C34.168 70.4371 35.8715 72.1406 37.9648 72.1406C40.0582 72.1406 41.7617 70.4371 41.7617 68.3438C41.7617 66.2504 40.0582 64.5469 37.9648 64.5469ZM37.9648 69.6094C37.2675 69.6094 36.6992 69.0411 36.6992 68.3438C36.6992 67.6464 37.2675 67.0781 37.9648 67.0781C38.6622 67.0781 39.2305 67.6464 39.2305 68.3438C39.2305 69.0411 38.6622 69.6094 37.9648 69.6094ZM16.448 59.9058L12.4017 65.3075C11.75 66.177 11.3905 67.2553 11.3905 68.3438C11.3905 71.1357 13.661 73.4062 16.453 73.4062C19.245 73.4062 21.5155 71.1357 21.5155 68.345C21.5155 67.2566 21.1548 66.177 20.5017 65.305L16.448 59.9058ZM16.453 70.875C15.057 70.875 13.9218 69.7397 13.9218 68.3425C13.9218 67.7983 14.1015 67.2604 14.4267 66.825L16.4492 64.1254L18.4767 66.825C18.8045 67.2616 18.9843 67.8008 18.9843 68.345C18.9843 69.7397 17.849 70.875 16.453 70.875ZM15.1836 53.584L15.1874 56.9544L17.7186 56.9519L17.7148 53.5828L22.7773 46.9382V24.0469C24.8707 24.0469 26.5742 22.3433 26.5742 20.25C26.5742 18.1579 24.8732 16.4557 22.7811 16.4531V7.59755C22.7811 4.10695 19.9398 1.26562 16.4492 1.26562C12.9586 1.26562 10.1173 4.10695 10.1173 7.59755V16.4531C8.02522 16.4557 6.32422 18.1567 6.32422 20.25C6.32422 22.3433 8.02775 24.0469 10.1211 24.0469V46.9382L15.1836 53.584ZM16.4492 3.79688C18.5451 3.79688 20.2499 5.50167 20.2499 7.59755V16.4531H12.6485V7.59755C12.6485 5.50167 14.3533 3.79688 16.4492 3.79688ZM8.85547 20.25C8.85547 19.5526 9.42373 18.9844 10.1211 18.9844H22.7773C23.4747 18.9844 24.043 19.5526 24.043 20.25C24.043 20.9474 23.4747 21.5156 22.7773 21.5156H10.1211C9.42247 21.5156 8.85547 20.9474 8.85547 20.25ZM20.2461 24.0469V46.0852L16.4492 51.0692L12.6523 46.0852V44.2969H16.4492V41.7656H12.6523V39.2344H16.4492V36.7031H12.6523V34.1719H16.4492V31.6406H12.6523V29.1094H16.4492V26.5781H12.6523V24.0469H20.2461Z" fill="#333333"></path>
<path d="M67.0781 72.1406H64.5469V74.6719H67.0781V72.1406Z" fill="#333333"></path>
<path d="M58.2188 67.0781H55.6875V69.6094H58.2188V67.0781Z" fill="#333333"></path>
<path d="M39.2344 58.2188H36.7031V60.75H39.2344V58.2188Z" fill="#333333"></path>
<path d="M45.5625 72.1406H43.0312V74.6719H45.5625V72.1406Z" fill="#333333"></path>
</svg></div>



<h4 id="gspb_heading-id-gsbp-26c1985e-c0ec" class="gspb_heading gspb_heading-id-gsbp-26c1985e-c0ec ">Customize Everything</h4>



<div id="gspb_heading-id-gsbp-e09123be-bffc" class="gspb_heading gspb_heading-id-gsbp-e09123be-bffc ">Full support of Full Site Editing, customize everything directly on page without any code knowledge</div>
</div>



<div id="gspb_container-id-gsbp-875016d1-2e0a" class="gspb_container gspb_container-gsbp-875016d1-2e0a wp-block-greenshift-blocks-container staggercont">
<div id="gspb_svgBox-id-gsbp-f138b57f-b20e" class="gspb_svgBox gspb_svgBox-id-gsbp-f138b57f-b20e wp-block-greenshift-blocks-svgshape"><svg width="81" style="width:5rem;height:5rem;margin:10px" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M63.7432 12.4246C56.9974 6.89637 48.7418 3.85254 40.4987 3.85254C32.4835 3.85254 24.8683 6.39012 18.4781 11.1906L16.9581 9.16563C23.79 4.03352 31.9317 1.32129 40.5 1.32129C49.3277 1.32129 58.1517 4.56888 65.3493 10.468L63.7432 12.4246ZM16.9556 71.8887C6.98499 64.3962 1.26562 52.9563 1.26562 40.5C1.26562 31.9304 3.97913 23.7899 9.10997 16.9581L11.135 18.4781C6.33445 24.8682 3.79688 32.4835 3.79688 40.5C3.79688 52.1526 9.14794 62.8547 18.4769 69.8637L16.9556 71.8887ZM40.5 79.7344C34.5427 79.7344 28.8221 78.4333 23.4963 75.8679L24.5936 73.5859C29.5751 75.9868 34.9275 77.2031 40.5 77.2031C60.7373 77.2031 77.2031 60.7373 77.2031 40.5C77.2031 34.044 75.5047 27.6994 72.2925 22.1484L74.482 20.8803C77.9182 26.816 79.7344 33.5998 79.7344 40.5C79.7344 62.1346 62.1346 79.7344 40.5 79.7344Z" fill="#333333"></path>
<path d="M40.499 70.9307C23.751 70.9307 10.124 57.3037 10.124 40.5557C10.124 23.8076 23.751 10.1807 40.499 10.1807C57.247 10.1807 70.874 23.8076 70.874 40.5557C70.874 49.3075 67.2202 57.0797 60.3086 63.0306L58.6569 61.1119C64.9927 55.6558 68.3415 48.5481 68.3415 40.5557C68.3415 25.2024 55.8511 12.7119 40.4978 12.7119C25.1445 12.7119 12.654 25.2024 12.654 40.5557C12.654 55.909 25.1445 68.3994 40.4978 68.3994C44.9021 68.3994 49.3824 67.173 53.8134 64.7569L55.0246 66.9794C50.2203 69.6005 45.3312 70.9307 40.499 70.9307Z" fill="#333333"></path>
<path d="M40.499 62.0713C37.583 62.0713 34.5822 61.2221 31.0575 59.3996L32.2218 57.1506C35.372 58.7819 38.0032 59.5413 40.499 59.5413C50.967 59.5413 59.4834 51.0249 59.4834 40.5569C59.4834 30.089 50.967 21.5726 40.499 21.5726C30.031 21.5726 21.5146 30.089 21.5146 40.5569C21.5146 44.145 22.3095 47.3382 23.875 50.0479L21.6855 51.316C19.8921 48.2165 18.9834 44.5956 18.9834 40.5569C18.9834 28.693 28.6351 19.0413 40.499 19.0413C52.363 19.0413 62.0146 28.693 62.0146 40.5569C62.0146 52.4209 52.363 62.0713 40.499 62.0713Z" fill="#333333"></path>
<path d="M40.499 49.415C45.3919 49.415 49.3584 45.4486 49.3584 40.5557C49.3584 35.6628 45.3919 31.6963 40.499 31.6963C35.6061 31.6963 31.6396 35.6628 31.6396 40.5557C31.6396 45.4486 35.6061 49.415 40.499 49.415Z" fill="#F9BA48"></path>
<path d="M56.9521 69.665C54.1602 69.665 51.8896 67.3945 51.8896 64.6025C51.8896 61.8106 54.1602 59.54 56.9521 59.54C59.7441 59.54 62.0146 61.8106 62.0146 64.6025C62.0146 67.3945 59.7441 69.665 56.9521 69.665ZM56.9521 62.0713C55.5562 62.0713 54.4209 63.2066 54.4209 64.6025C54.4209 65.9985 55.5562 67.1338 56.9521 67.1338C58.3481 67.1338 59.4834 65.9985 59.4834 64.6025C59.4834 63.2066 58.3481 62.0713 56.9521 62.0713ZM26.5771 62.0713C22.3892 62.0713 18.9834 58.6655 18.9834 54.4775C18.9834 50.2896 22.3892 46.8838 26.5771 46.8838C30.7651 46.8838 34.1709 50.2896 34.1709 54.4775C34.1709 58.6655 30.7651 62.0713 26.5771 62.0713ZM26.5771 49.415C23.7852 49.415 21.5146 51.6856 21.5146 54.4775C21.5146 57.2695 23.7852 59.54 26.5771 59.54C29.3691 59.54 31.6396 57.2695 31.6396 54.4775C31.6396 51.6856 29.3691 49.415 26.5771 49.415ZM69.6084 22.8369C65.4204 22.8369 62.0146 19.4311 62.0146 15.2432C62.0146 11.0552 65.4204 7.64941 69.6084 7.64941C73.7964 7.64941 77.2021 11.0552 77.2021 15.2432C77.2021 19.4311 73.7964 22.8369 69.6084 22.8369ZM69.6084 10.1807C66.8164 10.1807 64.5459 12.4512 64.5459 15.2432C64.5459 18.0351 66.8164 20.3057 69.6084 20.3057C72.4004 20.3057 74.6709 18.0351 74.6709 15.2432C74.6709 12.4512 72.4004 10.1807 69.6084 10.1807ZM13.9209 20.3057C10.4316 20.3057 7.59277 17.4669 7.59277 13.9775C7.59277 10.4882 10.4316 7.64941 13.9209 7.64941C17.4102 7.64941 20.249 10.4882 20.249 13.9775C20.249 17.4669 17.4102 20.3057 13.9209 20.3057ZM13.9209 10.1807C11.8276 10.1807 10.124 11.8842 10.124 13.9775C10.124 16.0709 11.8276 17.7744 13.9209 17.7744C16.0142 17.7744 17.7178 16.0709 17.7178 13.9775C17.7178 11.8842 16.0142 10.1807 13.9209 10.1807ZM20.249 77.2588C17.4571 77.2588 15.1865 74.9883 15.1865 72.1963C15.1865 69.4043 17.4571 67.1338 20.249 67.1338C23.041 67.1338 25.3115 69.4043 25.3115 72.1963C25.3115 74.9883 23.041 77.2588 20.249 77.2588ZM20.249 69.665C18.853 69.665 17.7178 70.8003 17.7178 72.1963C17.7178 73.5923 18.853 74.7275 20.249 74.7275C21.645 74.7275 22.7803 73.5923 22.7803 72.1963C22.7803 70.8003 21.645 69.665 20.249 69.665Z" fill="#333333"></path>
</svg></div>



<h4 id="gspb_heading-id-gsbp-c9faba73-2663" class="gspb_heading gspb_heading-id-gsbp-c9faba73-2663 ">Animation Framework</h4>



<div id="gspb_heading-id-gsbp-a7f39ab0-e965" class="gspb_heading gspb_heading-id-gsbp-a7f39ab0-e965 ">Nice looking animations is difference between good site and perfect site. Theme has build in Animation framework, only 2 kb size</div>
</div>
</div>
</div></div>


<!--JUST GSAP-->
<div id="gspb_container-id-gsbp-68413be4-1dd0" class="gspb_container gspb_container-gsbp-68413be4-1dd0 wp-block-greenshift-blocks-container gsapblock" style="translate: none; rotate: none; scale: none; transform: translate(0px, 0px);">
<div id="gspb_svgBox-id-gsbp-7042de48-be6f" class="gspb_svgBox gspb_svgBox-id-gsbp-7042de48-be6f wp-block-greenshift-blocks-svgshape"><svg width="78" style="width:5rem;height:5rem;margin:10px" height="78" viewBox="0 0 78 78" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M53.625 29.25H24.375V31.6875H53.625V29.25Z" fill="#333333"></path>
<path d="M64.0928 76.7813H53.625V74.3438C53.625 70.9106 51.9846 67.6297 49.2363 65.5688L50.7 63.6188C54.0577 66.1379 56.0625 70.1476 56.0625 74.3438H62.6572L66.2793 67.8247C67.5675 65.5054 68.25 62.8753 68.25 60.2209C68.25 54.973 65.6431 50.1028 61.2763 47.1912L54.1673 42.4515L55.5189 40.4235L62.6279 45.1632C67.6748 48.527 70.6875 54.1564 70.6875 60.2209C70.6875 63.2897 69.9002 66.3281 68.4097 69.0093L64.0928 76.7813ZM24.375 76.7813H13.9072L9.59034 69.0081C8.09981 66.3281 7.3125 63.2885 7.3125 60.2209C7.3125 54.1564 10.3253 48.527 15.3709 45.1632L22.4798 40.4235L23.8314 42.4515L16.7225 47.1912C12.3569 50.1016 9.75 54.973 9.75 60.2209C9.75 62.8766 10.4325 65.5054 11.7207 67.8247L15.3428 74.3438H21.9375C21.9375 70.1476 23.9423 66.1379 27.2988 63.6188L28.7625 65.5688C26.0154 67.6297 24.375 70.9106 24.375 74.3438V76.7813Z" fill="#333333"></path>
<path d="M35.3425 67.0312H32.9062C26.8576 67.0312 21.9375 62.1112 21.9375 56.0625V35.3438C21.9375 21.0953 28.4286 1.21875 39 1.21875C49.5714 1.21875 56.0625 21.0953 56.0625 35.3438V56.0625C56.0625 62.1112 51.1424 67.0312 45.0938 67.0312H42.6562H35.3425Z" fill="#F9BA48"></path>
<path d="M40.2188 10.9688H37.7812V35.3438H40.2188V10.9688Z" fill="#333333"></path>
<path d="M40.2188 48.75H37.7812V59.7188H40.2188V48.75Z" fill="#333333"></path>
<path d="M28.0312 30.4688H25.5938V63.375H28.0312V30.4688Z" fill="#333333"></path>
<path d="M52.4062 30.4688H49.9688V63.375H52.4062V30.4688Z" fill="#333333"></path>
<path d="M39 46.3125C35.6399 46.3125 32.9062 43.5788 32.9062 40.2188C32.9062 36.8587 35.6399 34.125 39 34.125C42.3601 34.125 45.0938 36.8587 45.0938 40.2188C45.0938 43.5788 42.3601 46.3125 39 46.3125ZM39 36.5625C36.9842 36.5625 35.3438 38.2029 35.3438 40.2188C35.3438 42.2346 36.9842 43.875 39 43.875C41.0158 43.875 42.6562 42.2346 42.6562 40.2188C42.6562 38.2029 41.0158 36.5625 39 36.5625ZM43.875 76.7812H34.125V63.375C34.125 60.6864 36.3114 58.5 39 58.5C41.6886 58.5 43.875 60.6864 43.875 63.375V76.7812ZM36.5625 74.3438H41.4375V63.375C41.4375 62.0307 40.3443 60.9375 39 60.9375C37.6557 60.9375 36.5625 62.0307 36.5625 63.375V74.3438Z" fill="#333333"></path>
<path d="M76.7812 2.4375H74.3438V35.3438H76.7812V2.4375Z" fill="#333333"></path>
<path d="M76.7812 37.7812H74.3438V40.2188H76.7812V37.7812Z" fill="#333333"></path>
<path d="M3.65625 7.3125H1.21875V41.4375H3.65625V7.3125Z" fill="#333333"></path>
<path d="M3.65625 43.875H1.21875V46.3125H3.65625V43.875Z" fill="#333333"></path>
<path d="M12.1875 2.4375H9.75V30.4688H12.1875V2.4375Z" fill="#333333"></path>
<path d="M12.1875 32.9062H9.75V35.3438H12.1875V32.9062Z" fill="#333333"></path>
<path d="M65.8125 4.875H63.375V26.8125H65.8125V4.875Z" fill="#333333"></path>
<path d="M65.8125 29.25H63.375V31.6875H65.8125V29.25Z" fill="#333333"></path>
</svg></div>



<h4 id="gspb_heading-id-gsbp-5f7f927a-00e9" class="gspb_heading gspb_heading-id-gsbp-5f7f927a-00e9 ">Extremely Fast</h4>



<div id="gspb_heading-id-gsbp-e63e6a60-7d44" class="gspb_heading gspb_heading-id-gsbp-e63e6a60-7d44 ">Theme uses unique conditional asset loading, only 2 kb required styles. Nothing is loaded until you use it on page</div>
</div>



<div id="gspb_container-id-gsbp-68413be4-1dd0" class="gspb_container gspb_container-gsbp-68413be4-1dd0 wp-block-greenshift-blocks-container gsapblock" style="translate: none; rotate: none; scale: none; transform: translate(0px, 0px);">
<div id="gspb_svgBox-id-gsbp-7042de48-be6f" class="gspb_svgBox gspb_svgBox-id-gsbp-7042de48-be6f wp-block-greenshift-blocks-svgshape"><svg width="78" style="width:5rem;height:5rem;margin:10px" height="78" viewBox="0 0 78 78" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M53.625 29.25H24.375V31.6875H53.625V29.25Z" fill="#333333"></path>
<path d="M64.0928 76.7813H53.625V74.3438C53.625 70.9106 51.9846 67.6297 49.2363 65.5688L50.7 63.6188C54.0577 66.1379 56.0625 70.1476 56.0625 74.3438H62.6572L66.2793 67.8247C67.5675 65.5054 68.25 62.8753 68.25 60.2209C68.25 54.973 65.6431 50.1028 61.2763 47.1912L54.1673 42.4515L55.5189 40.4235L62.6279 45.1632C67.6748 48.527 70.6875 54.1564 70.6875 60.2209C70.6875 63.2897 69.9002 66.3281 68.4097 69.0093L64.0928 76.7813ZM24.375 76.7813H13.9072L9.59034 69.0081C8.09981 66.3281 7.3125 63.2885 7.3125 60.2209C7.3125 54.1564 10.3253 48.527 15.3709 45.1632L22.4798 40.4235L23.8314 42.4515L16.7225 47.1912C12.3569 50.1016 9.75 54.973 9.75 60.2209C9.75 62.8766 10.4325 65.5054 11.7207 67.8247L15.3428 74.3438H21.9375C21.9375 70.1476 23.9423 66.1379 27.2988 63.6188L28.7625 65.5688C26.0154 67.6297 24.375 70.9106 24.375 74.3438V76.7813Z" fill="#333333"></path>
<path d="M35.3425 67.0312H32.9062C26.8576 67.0312 21.9375 62.1112 21.9375 56.0625V35.3438C21.9375 21.0953 28.4286 1.21875 39 1.21875C49.5714 1.21875 56.0625 21.0953 56.0625 35.3438V56.0625C56.0625 62.1112 51.1424 67.0312 45.0938 67.0312H42.6562H35.3425Z" fill="#F9BA48"></path>
<path d="M40.2188 10.9688H37.7812V35.3438H40.2188V10.9688Z" fill="#333333"></path>
<path d="M40.2188 48.75H37.7812V59.7188H40.2188V48.75Z" fill="#333333"></path>
<path d="M28.0312 30.4688H25.5938V63.375H28.0312V30.4688Z" fill="#333333"></path>
<path d="M52.4062 30.4688H49.9688V63.375H52.4062V30.4688Z" fill="#333333"></path>
<path d="M39 46.3125C35.6399 46.3125 32.9062 43.5788 32.9062 40.2188C32.9062 36.8587 35.6399 34.125 39 34.125C42.3601 34.125 45.0938 36.8587 45.0938 40.2188C45.0938 43.5788 42.3601 46.3125 39 46.3125ZM39 36.5625C36.9842 36.5625 35.3438 38.2029 35.3438 40.2188C35.3438 42.2346 36.9842 43.875 39 43.875C41.0158 43.875 42.6562 42.2346 42.6562 40.2188C42.6562 38.2029 41.0158 36.5625 39 36.5625ZM43.875 76.7812H34.125V63.375C34.125 60.6864 36.3114 58.5 39 58.5C41.6886 58.5 43.875 60.6864 43.875 63.375V76.7812ZM36.5625 74.3438H41.4375V63.375C41.4375 62.0307 40.3443 60.9375 39 60.9375C37.6557 60.9375 36.5625 62.0307 36.5625 63.375V74.3438Z" fill="#333333"></path>
<path d="M76.7812 2.4375H74.3438V35.3438H76.7812V2.4375Z" fill="#333333"></path>
<path d="M76.7812 37.7812H74.3438V40.2188H76.7812V37.7812Z" fill="#333333"></path>
<path d="M3.65625 7.3125H1.21875V41.4375H3.65625V7.3125Z" fill="#333333"></path>
<path d="M3.65625 43.875H1.21875V46.3125H3.65625V43.875Z" fill="#333333"></path>
<path d="M12.1875 2.4375H9.75V30.4688H12.1875V2.4375Z" fill="#333333"></path>
<path d="M12.1875 32.9062H9.75V35.3438H12.1875V32.9062Z" fill="#333333"></path>
<path d="M65.8125 4.875H63.375V26.8125H65.8125V4.875Z" fill="#333333"></path>
<path d="M65.8125 29.25H63.375V31.6875H65.8125V29.25Z" fill="#333333"></path>
</svg></div>



<h4 id="gspb_heading-id-gsbp-5f7f927a-00e9" class="gspb_heading gspb_heading-id-gsbp-5f7f927a-00e9 ">Extremely Fast</h4>



<div id="gspb_heading-id-gsbp-e63e6a60-7d44" class="gspb_heading gspb_heading-id-gsbp-e63e6a60-7d44 ">Theme uses unique conditional asset loading, only 2 kb required styles. Nothing is loaded until you use it on page</div>
</div>
!

CSS 

              
                
.staggercont, .gsapblock{transition: all 0.4s}
.gsapblock{margin-top:100px}

.gspb_row__content,body .gspb_row{justify-content:space-between;margin:0 auto;display:flex;flex-wrap:wrap}body .gspb_row .gspb_row__content{width:100%}body .gspb_row div[class^=gspb_row__col]{flex-direction:column}.gspb_row__content{width:100%}body .gspb_row,div[class^=gspb_row__col]{position:relative}.gspb_row__col--1,.gspb_row__col--10,.gspb_row__col--11,.gspb_row__col--12,.gspb_row__col--2,.gspb_row__col--24,.gspb_row__col--3,.gspb_row__col--4,.gspb_row__col--5,.gspb_row__col--6,.gspb_row__col--7,.gspb_row__col--8,.gspb_row__col--9{padding:15px min(3vw,20px);box-sizing:border-box}body #gspb_row-id-gsbp-f2a67c3b-5d14.gspb_row .gspb_row__content{max-width:1200px}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437{display:flex;position:sticky;z-index:99;top:80px}#gspb-pagenav-tabs-gsbp-ebcfd90d-3437{max-width:fit-content;display:flex}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437{overflow:auto;flex-wrap:nowrap;scrollbar-width:thin;scrollbar-color:transparent transparent;justify-content:center}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437::-webkit-scrollbar{width:0;height:0}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437::-webkit-scrollbar-track{background-color:transparent;border-radius:20px}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437::-webkit-scrollbar-thumb{background-color:transparent;border-radius:20px;border:1px solid transparent}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437:hover::-webkit-scrollbar-thumb{background-color:#ddd}#gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437:hover{scrollbar-color:#ddd #fff}#gspb-pagenav-tabs-gsbp-ebcfd90d-3437 .gspb_dotnav_tab_accent{position:absolute;top:-1px;right:-1px;left:-1px;height:6px;background:#00cc81;transform:scaleX(0);transform-origin:left}#gspb-pagenav-tabs-gsbp-ebcfd90d-3437 .gspb_dotnav_tab_item.active .gspb_dotnav_tab_accent{transform:scaleX(1)}#gspb-pagenav-tabs-gsbp-ebcfd90d-3437 .gspb_dotnav_tab_item{position:relative;transition:all .4s;white-space:nowrap;cursor:pointer}body #gspb-pagenav-tabs-gsbp-ebcfd90d-3437 .gspb_dotnav_tab_item{margin:0 0 -1px -2px!important;padding:15px 40px 13px!important;background-color:#fff;border-style:solid;border-width:1px;border-color:#0000000f}body #gspb-pagenav-tabs-gsbp-ebcfd90d-3437 .gspb_dotnav_tab_item.active,body #gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437{background-color:#fff;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#00000000}body #gspb-pagenav-tabs-wrap-gsbp-ebcfd90d-3437{border-bottom-color:#0000000f}body .gspb_heading-id-gsbp-8eea4b78-9ae9{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-8eea4b78-9ae9[data-gs-aos],body .gspb_heading-id-gsbp-8eea4b78-9ae9.aos-animate{transition-delay:.5s}.gspb_heading-id-gsbp-8eea4b78-9ae9{backface-visibility:hidden;transition-property:opacity,transform;opacity:0;transform:perspective(2500px) rotateX(-60deg) translate3d(0,30px,0)}.gspb_heading-id-gsbp-8eea4b78-9ae9.aos-animate,.gspb_heading-id-gsbp-8eea4b78-9ae9[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-8eea4b78-9ae9 .wp-block,body .gspb_heading-id-gsbp-8eea4b78-9ae9{font-size:20px;font-weight:400!important}body .gspb_heading-id-gsbp-45d7cd68-9325{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-45d7cd68-9325[data-gs-aos],body .gspb_heading-id-gsbp-45d7cd68-9325.aos-animate{transition-delay:.6s}.gspb_heading-id-gsbp-45d7cd68-9325.aos-animate,.gspb_heading-id-gsbp-45d7cd68-9325[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-45d7cd68-9325 .wp-block,body .gspb_heading-id-gsbp-45d7cd68-9325{font-size:13px;line-height:20px;font-weight:400!important;color:#7b7b7b}body .gspb_heading-id-gsbp-df1d2e56-f3f9{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-df1d2e56-f3f9[data-gs-aos],body .gspb_heading-id-gsbp-df1d2e56-f3f9.aos-animate{transition-delay:.7s}.gspb_heading-id-gsbp-45d7cd68-9325,.gspb_heading-id-gsbp-df1d2e56-f3f9{backface-visibility:hidden;transition-property:opacity,transform;opacity:0;transform:perspective(2500px) rotateX(-60deg) translate3d(0,30px,0)}.gspb_heading-id-gsbp-df1d2e56-f3f9.aos-animate,.gspb_heading-id-gsbp-df1d2e56-f3f9[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-df1d2e56-f3f9 .wp-block,body .gspb_heading-id-gsbp-df1d2e56-f3f9{font-size:20px;font-weight:400!important;color:red}#gspb_container-id-gsbp-50d28767-cf62.gspb_container,#gspb_container-id-gsbp-63624394-f85d.gspb_container,#gspb_container-id-gsbp-68413be4-1dd0.gspb_container,#gspb_container-id-gsbp-83625b7a-7622.gspb_container,#gspb_container-id-gsbp-875016d1-2e0a.gspb_container,#gspb_container-id-gsbp-a7086db4-e8cd.gspb_container,#gspb_container-id-gsbp-b8cb1482-5e82.gspb_container,#gspb_container-id-gsbp-e76816f5-66ff.gspb_container{position:relative;flex-direction:column;box-sizing:border-box}#gspb_container-id-gsbp-50d28767-cf62.gspb_container .gspb_container__content,#gspb_container-id-gsbp-83625b7a-7622.gspb_container .gspb_container__content{margin:auto}#gspb_container-id-gsbp-50d28767-cf62.gspb_container>p:last-of-type,#gspb_container-id-gsbp-63624394-f85d.gspb_container>p:last-of-type,#gspb_container-id-gsbp-68413be4-1dd0.gspb_container>p:last-of-type,#gspb_container-id-gsbp-83625b7a-7622.gspb_container>p:last-of-type,#gspb_container-id-gsbp-875016d1-2e0a.gspb_container>p:last-of-type,#gspb_container-id-gsbp-a7086db4-e8cd.gspb_container>p:last-of-type,#gspb_container-id-gsbp-b8cb1482-5e82.gspb_container>p:last-of-type,#gspb_container-id-gsbp-e76816f5-66ff.gspb_container>p:last-of-type{margin-bottom:0}body #gspb_container-id-gsbp-50d28767-cf62.gspb_container{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));row-gap:20px;column-gap:20px}body #gspb_container-id-gsbp-83625b7a-7622.gspb_container{height:200px;padding:40px 150px 40px 40px!important;background-color:#ffe271;z-index:0}body #gspb_container-id-gsbp-83625b7a-7622.gspb_container{display:flex;flex-direction:column;justify-content:space-between}#gspb_container-id-gsbp-83625b7a-7622.gspb_container>.gspb_backgroundOverlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}body #gspb_container-id-gsbp-83625b7a-7622.gspb_container>.gspb_backgroundOverlay{background-color:#ffe271;background-image:url(http://localhost:8888/wordpress/wp-content/uploads/2022/09/p1.webp);background-size:contain;background-repeat:no-repeat;background-position:100% 50%}#gspb_container-id-gsbp-83625b7a-7622.gspb_container .gspb-containerlink{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}#gspb_container-id-gsbp-e76816f5-66ff.gspb_container .gspb_container__content{margin:auto}body #gspb_container-id-gsbp-a7086db4-e8cd.gspb_container,body #gspb_container-id-gsbp-e76816f5-66ff.gspb_container{height:200px;padding:40px 150px 40px 40px!important;background-color:#dde3e7;z-index:0}body #gspb_container-id-gsbp-e76816f5-66ff.gspb_container{display:flex;flex-direction:column;justify-content:space-between}#gspb_container-id-gsbp-e76816f5-66ff.gspb_container>.gspb_backgroundOverlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}body #gspb_container-id-gsbp-e76816f5-66ff.gspb_container>.gspb_backgroundOverlay{background-color:#dde3e7;background-image:url(http://localhost:8888/wordpress/wp-content/uploads/2022/09/p2.webp);background-size:contain;background-repeat:no-repeat;background-position:100% 50%}#gspb_container-id-gsbp-e76816f5-66ff.gspb_container .gspb-containerlink{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}#gspb_container-id-gsbp-a7086db4-e8cd.gspb_container .gspb_container__content{margin:auto}body #gspb_container-id-gsbp-a7086db4-e8cd.gspb_container{background-color:#88f7ff}body #gspb_container-id-gsbp-a7086db4-e8cd.gspb_container{display:flex;flex-direction:column;justify-content:space-between}#gspb_container-id-gsbp-a7086db4-e8cd.gspb_container>.gspb_backgroundOverlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}body #gspb_container-id-gsbp-a7086db4-e8cd.gspb_container>.gspb_backgroundOverlay{background-color:#88f7ff;background-image:url(http://localhost:8888/wordpress/wp-content/uploads/2022/09/p3.webp);background-size:contain;background-repeat:no-repeat;background-position:100% 50%}#gspb_container-id-gsbp-a7086db4-e8cd.gspb_container .gspb-containerlink{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}body .gspb_heading-id-gsbp-d1cebce0-1859{transition-duration:.7s;transition-timing-function:ease}.gspb_heading-id-gsbp-d1cebce0-1859{opacity:0;transition-property:opacity,transform;transform:scale(1.2)}.gspb_heading-id-gsbp-d1cebce0-1859.aos-animate,.gspb_heading-id-gsbp-d1cebce0-1859[data-gs-aos]{opacity:1;transform:translateZ(0) scale(1)}.gspb_heading-id-gsbp-d1cebce0-1859 .wp-block,body .gspb_heading-id-gsbp-d1cebce0-1859{font-size:20px;font-weight:400!important}body .gspb_heading-id-gsbp-19ef99dc-3427{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-19ef99dc-3427[data-gs-aos],body .gspb_heading-id-gsbp-19ef99dc-3427.aos-animate{transition-delay:.1s}.gspb_heading-id-gsbp-19ef99dc-3427.aos-animate,.gspb_heading-id-gsbp-19ef99dc-3427[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-19ef99dc-3427 .wp-block,body .gspb_heading-id-gsbp-19ef99dc-3427{font-size:13px;line-height:20px;font-weight:400!important;color:#7b7b7b}body #gspb_col-id-gsbp-0e9c9a12-63af.gspb_row__col--12{width:100%}#gspb_container-id-gsbp-63624394-f85d.gspb_container .gspb_container__content,#gspb_container-id-gsbp-68413be4-1dd0.gspb_container .gspb_container__content,#gspb_container-id-gsbp-875016d1-2e0a.gspb_container .gspb_container__content,#gspb_container-id-gsbp-b8cb1482-5e82.gspb_container .gspb_container__content{margin:auto}body #gspb_container-id-gsbp-68413be4-1dd0.gspb_container{padding:34px!important;background-color:#f1fbf5}body #gspb_container-id-gsbp-68413be4-1dd0.gspb_container:hover{box-shadow:0 32px 48px 0 #0000001a}body #gspb_container-id-gsbp-68413be4-1dd0.gspb_container,body #gspb_container-id-gsbp-68413be4-1dd0.gspb_container>.gspb_backgroundOverlay{border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px}body #gspb_container-id-gsbp-63624394-f85d.gspb_container{transition:all .3s cubic-bezier(.165,.84,.44,1);padding:34px!important;background-color:#fbf4ff}body #gspb_container-id-gsbp-63624394-f85d.gspb_container:hover{box-shadow:0 32px 48px 0 #0000001a}body #gspb_container-id-gsbp-63624394-f85d.gspb_container,body #gspb_container-id-gsbp-63624394-f85d.gspb_container>.gspb_backgroundOverlay{border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px}body #gspb_container-id-gsbp-875016d1-2e0a.gspb_container{transition:all .3s cubic-bezier(.165,.84,.44,1);padding:34px!important;background-color:#fff6c0}body #gspb_container-id-gsbp-875016d1-2e0a.gspb_container:hover{box-shadow:0 32px 48px 0 #0000001a}body #gspb_container-id-gsbp-875016d1-2e0a.gspb_container,body #gspb_container-id-gsbp-875016d1-2e0a.gspb_container>.gspb_backgroundOverlay{border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px}body .gs-prehidden{visibility:hidden}#gspb_gsap-gsbp-08520a27-b848{perspective:500px}body #gspb_svgBox-id-gsbp-236427db-4fab,body #gspb_svgBox-id-gsbp-7042de48-be6f,body #gspb_svgBox-id-gsbp-f138b57f-b20e{display:flex;margin-bottom:50px!important;transition:all .3s cubic-bezier(.165,.84,.44,1);animation-timing-function:linear}body #gspb_svgBox-id-gsbp-f138b57f-b20e{perspective:1000px;animation:csstransform-1385720 .8s infinite 0s alternate}body #gspb_svgBox-id-gsbp-236427db-4fab svg,body #gspb_svgBox-id-gsbp-7042de48-be6f svg,body #gspb_svgBox-id-gsbp-f138b57f-b20e svg{margin:0!important}body .staggercolumn:hover #gspb_svgBox-id-gsbp-236427db-4fab,body .staggercolumn:hover #gspb_svgBox-id-gsbp-f138b57f-b20e{transform:translateY(-10px)}#gspb_svgBox-id-gsbp-f138b57f-b20e svg{width:70px!important;overflow:visible;height:70px!important;max-width:100%}.gspb_heading-id-gsbp-c9faba73-2663 .wp-block,body .gspb_heading-id-gsbp-c9faba73-2663{font-size:25px}body .gspb_heading-id-gsbp-c9faba73-2663{margin-bottom:25px!important}.gspb_heading-id-gsbp-a7f39ab0-e965 .wp-block,body .gspb_heading-id-gsbp-a7f39ab0-e965{font-size:18px}body .gspb_heading-id-gsbp-a7f39ab0-e965{margin-bottom:20px!important}body #gspb_svgBox-id-gsbp-236427db-4fab,body #gspb_svgBox-id-gsbp-7042de48-be6f{animation:csstransform-2364274 1s infinite 0s alternate}.gspb_heading-id-gsbp-26c1985e-c0ec .wp-block,body .gspb_heading-id-gsbp-26c1985e-c0ec{font-size:25px}body .gspb_heading-id-gsbp-26c1985e-c0ec{margin-bottom:25px!important}.gspb_heading-id-gsbp-e09123be-bffc .wp-block,body .gspb_heading-id-gsbp-e09123be-bffc{font-size:18px}body .gspb_heading-id-gsbp-e09123be-bffc{margin-bottom:20px!important}body .gspb_heading-id-gsbp-50c07906-7047{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-50c07906-7047[data-gs-aos],body .gspb_heading-id-gsbp-50c07906-7047.aos-animate{transition-delay:.2s}.gspb_heading-id-gsbp-19ef99dc-3427,.gspb_heading-id-gsbp-50c07906-7047{backface-visibility:hidden;transition-property:opacity,transform;opacity:0;transform:perspective(2500px) rotateX(-60deg) translate3d(0,30px,0)}.gspb_heading-id-gsbp-50c07906-7047.aos-animate,.gspb_heading-id-gsbp-50c07906-7047[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-50c07906-7047 .wp-block,body .gspb_heading-id-gsbp-50c07906-7047{font-size:20px;font-weight:400!important;color:red}body .gspb_heading-id-gsbp-61554eeb-b5f7{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-61554eeb-b5f7[data-gs-aos],body .gspb_heading-id-gsbp-61554eeb-b5f7.aos-animate{transition-delay:.3s}.gspb_heading-id-gsbp-61554eeb-b5f7.aos-animate,.gspb_heading-id-gsbp-61554eeb-b5f7[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-61554eeb-b5f7 .wp-block,body .gspb_heading-id-gsbp-61554eeb-b5f7{font-size:20px;font-weight:400!important}body .gspb_heading-id-gsbp-a64ea6ed-3d45{transition-duration:.7s;transition-timing-function:ease;transition-delay:0s}.gspb_heading-id-gsbp-a64ea6ed-3d45[data-gs-aos],body .gspb_heading-id-gsbp-a64ea6ed-3d45.aos-animate{transition-delay:.4s}.gspb_heading-id-gsbp-61554eeb-b5f7,.gspb_heading-id-gsbp-a64ea6ed-3d45{backface-visibility:hidden;transition-property:opacity,transform;opacity:0;transform:perspective(2500px) rotateX(-60deg) translate3d(0,30px,0)}.gspb_heading-id-gsbp-a64ea6ed-3d45.aos-animate,.gspb_heading-id-gsbp-a64ea6ed-3d45[data-gs-aos]{transform:perspective(2500px) rotateX(0) translateZ(0);opacity:1}.gspb_heading-id-gsbp-a64ea6ed-3d45 .wp-block,body .gspb_heading-id-gsbp-a64ea6ed-3d45{font-size:13px;line-height:20px;font-weight:400!important;color:#7b7b7b}body #gspb_container-id-gsbp-b8cb1482-5e82.gspb_container{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));row-gap:20px;column-gap:20px}[data-prehidden]{visibility:hidden}body #gspb_svgBox-id-gsbp-7042de48-be6f{animation:csstransform-7042486 .9s infinite 0s alternate}body .staggercolumn:hover #gspb_svgBox-id-gsbp-7042de48-be6f{transform:translateY(-10px)}#gspb_svgBox-id-gsbp-236427db-4fab svg,#gspb_svgBox-id-gsbp-7042de48-be6f svg{width:70px!important;overflow:visible;height:70px!important;max-width:100%}.gspb_heading-id-gsbp-5f7f927a-00e9 .wp-block,body .gspb_heading-id-gsbp-5f7f927a-00e9{font-size:25px}body .gspb_heading-id-gsbp-5f7f927a-00e9{margin-bottom:25px!important}.gspb_heading-id-gsbp-e63e6a60-7d44 .wp-block,body .gspb_heading-id-gsbp-e63e6a60-7d44{font-size:18px}body .gspb_heading-id-gsbp-e63e6a60-7d44{margin-bottom:20px!important}body #gspb_col-id-gsbp-659d91ae-5f72.gspb_row__col--12{width:100%}body #gspb_row-id-gsbp-6319b80d-ee79.gspb_row{min-height:100vh;background-color:#c40000}body #gspb_row-id-gsbp-6319b80d-ee79.gspb_row .gspb_row__content,body #gspb_row-id-gsbp-a11ef361-f714.gspb_row .gspb_row__content,body #gspb_row-id-gsbp-a2c525ed-2908.gspb_row .gspb_row__content{max-width:1200px}body #gspb_col-id-gsbp-2e3f6a1b-fbb2.gspb_row__col--12{width:100%}body #gspb_row-id-gsbp-a11ef361-f714.gspb_row{min-height:100vh;background-color:red}body #gspb_col-id-gsbp-63473bca-7984.gspb_row__col--12{width:100%}body #gspb_row-id-gsbp-a2c525ed-2908.gspb_row{min-height:100vh;background-color:#000001}@media (min-width:768px) and (max-width: 1023.98px){body #gspb_container-id-gsbp-50d28767-cf62.gspb_container{grid-template-columns:repeat(2,minmax(0,1fr))}body #gspb_container-id-gsbp-a7086db4-e8cd.gspb_container{grid-column:span 2}body #gspb_container-id-gsbp-b8cb1482-5e82.gspb_container{grid-template-columns:repeat(1,minmax(0,1fr));row-gap:20px}body #gspb_container-id-gsbp-b8cb1482-5e82.gspb_container{padding:0!important}}@media (min-width:576px) and (max-width:767.98px){body #gspb_container-id-gsbp-50d28767-cf62.gspb_container,body #gspb_container-id-gsbp-b8cb1482-5e82.gspb_container{grid-template-columns:repeat(1,minmax(0,1fr))}}@media (max-width:575.98px){body #gspb_container-id-gsbp-50d28767-cf62.gspb_container,body #gspb_container-id-gsbp-b8cb1482-5e82.gspb_container{grid-template-columns:repeat(1,minmax(0,1fr))}body #gspb_col-id-gsbp-0e9c9a12-63af.gspb_row__col--12,body #gspb_col-id-gsbp-2e3f6a1b-fbb2.gspb_row__col--12,body #gspb_col-id-gsbp-63473bca-7984.gspb_row__col--12,body #gspb_col-id-gsbp-659d91ae-5f72.gspb_row__col--12{width:100%}}
!

JS 

              
                gsap.from(".staggercont", {
  y: 40, 
  duration: 1, 
  scale:0.9, 
stagger: {
    each: 0.1
  }
}
);

gsap.from(".gsapblock", {
  y: 140, 
  duration: 0.4, 
  scale:0.9
}
);
!
999px

Console