Download Code
Copy code below, and paste it (CTRL+V) in content of page
<!-- wp:greenshift-blocks/container {"id":"gsbp-6c405679-79ea","width":[null,null,null,null]} --> <div id="gspb_container-id-gsbp-6c405679-79ea" class="gspb_container gspb_container-gsbp-6c405679-79ea wp-block-greenshift-blocks-container"><!-- wp:greenshift-blocks/svgshape {"id":"gsbp-ce7117d1-15d3","customshapeOn":true,"customshape":"\u003csvg viewBox=\u00220 0 520 443\u0022\u003e\n \u003cdefs\u003e\n \u003cfilter x=\u0022-29.9%\u0022 y=\u0022-500.0%\u0022 width=\u0022159.7%\u0022 height=\u00221100.0%\u0022 filterUnits=\u0022objectBoundingBox\u0022 id=\u0022filter-1\u0022\u003e\n \u003cfeGaussianBlur stdDeviation=\u002220 0\u0022 in=\u0022SourceGraphic\u0022\u003e\u003c/feGaussianBlur\u003e\n \u003c/filter\u003e\n \u003cradialGradient cx=\u002250%\u0022 cy=\u002225.2858292%\u0022 fx=\u002250%\u0022 fy=\u002225.2858292%\u0022 r=\u0022778.056242%\u0022 gradientTransform=\u0022translate(0.500000,0.252858),scale(0.044444,1.000000),rotate(88.646548),translate(-0.500000,-0.252858)\u0022 id=\u0022radialGradient-2\u0022\u003e\n \u003cstop stop-color=\u0022#E9EBED\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#9D9FA2\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/radialGradient\u003e\n \u003clinearGradient x1=\u002250%\u0022 y1=\u002225.2858292%\u0022 x2=\u002250%\u0022 y2=\u0022100%\u0022 id=\u0022linearGradient-3\u0022\u003e\n \u003cstop stop-color=\u0022#848589\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#F5F5F5\u0022 offset=\u002256.5841003%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#D5D5D5\u0022 offset=\u002280.702943%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#BCBCBC\u0022 offset=\u002290.8405902%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#8D8E92\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/linearGradient\u003e\n \u003clinearGradient x1=\u0022100%\u0022 y1=\u002250%\u0022 x2=\u00220%\u0022 y2=\u002250%\u0022 id=\u0022linearGradient-4\u0022\u003e\n \u003cstop stop-color=\u0022#D2D3D5\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#95979B\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/linearGradient\u003e\n \u003cradialGradient cx=\u002292.9403782%\u0022 cy=\u0022-1.1418124%\u0022 fx=\u002292.9403782%\u0022 fy=\u0022-1.1418124%\u0022 r=\u002296.0040657%\u0022 gradientTransform=\u0022translate(0.929404,-0.011418),scale(0.600000,1.000000),rotate(90.000000),translate(-0.929404,0.011418)\u0022 id=\u0022radialGradient-5\u0022\u003e\n \u003cstop stop-color=\u0022#282828\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#141414\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/radialGradient\u003e\n \u003clinearGradient x1=\u00223.061617e-15%\u0022 y1=\u002250%\u0022 x2=\u0022100%\u0022 y2=\u002250%\u0022 id=\u0022linearGradient-6\u0022\u003e\n \u003cstop stop-color=\u0022#B3B5BA\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#F6F8FA\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/linearGradient\u003e\n \u003clinearGradient x1=\u002250%\u0022 y1=\u00220%\u0022 x2=\u002250%\u0022 y2=\u0022100%\u0022 id=\u0022linearGradient-7\u0022\u003e\n \u003cstop stop-color=\u0022#FFFFFF\u0022 stop-opacity=\u00220.4\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#FFFFFF\u0022 stop-opacity=\u00220\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/linearGradient\u003e\n \u003cradialGradient cx=\u002250%\u0022 cy=\u002226.2029892%\u0022 fx=\u002250%\u0022 fy=\u002226.2029892%\u0022 r=\u002240.7383851%\u0022 id=\u0022radialGradient-8\u0022\u003e\n \u003cstop stop-color=\u0022#0E0036\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#26006E\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/radialGradient\u003e\n \u003clinearGradient x1=\u002250%\u0022 y1=\u0022100%\u0022 x2=\u002250%\u0022 y2=\u00220%\u0022 id=\u0022linearGradient-9\u0022\u003e\n \u003cstop stop-color=\u0022#404040\u0022 offset=\u00220%\u0022\u003e\u003c/stop\u003e\n \u003cstop stop-color=\u0022#222222\u0022 offset=\u0022100%\u0022\u003e\u003c/stop\u003e\n \u003c/linearGradient\u003e\n \u003c/defs\u003e\n \u003cg id=\u0022Page-1\u0022 stroke=\u0022none\u0022 stroke-width=\u00221\u0022 fill=\u0022none\u0022 fill-rule=\u0022evenodd\u0022\u003e\n \u003cg id=\u0022Apple-devices\u0022 transform=\u0022translate(-110.000000, -485.000000)\u0022\u003e\n \u003cg id=\u0022iMac-27\u0026quot;\u0022 transform=\u0022translate(110.000000, 485.000000)\u0022\u003e\n \u003cg id=\u0022Foot\u0022 transform=\u0022translate(160.000000, 352.000000)\u0022\u003e\n \u003cellipse id=\u0022shadow\u0022 fill-opacity=\u00220.249999985\u0022 fill=\u0022#000000\u0022 filter=\u0022url(#filter-1)\u0022 cx=\u0022100.5\u0022 cy=\u002285\u0022 rx=\u0022100.5\u0022 ry=\u00226\u0022\u003e\u003c/ellipse\u003e\n \u003cpath d=\u0022M101.032505,78 C4.08888929,78 12.0380282,82.5 13.0213926,84.75 C13.9125512,86.7890273 57.2727923,86.9997379 101.032504,86.9997359 C144.792215,86.9997339 188.152456,86.7890273 189.043615,84.75 C190.026979,82.5 197.97612,78 101.032505,78 Z\u0022 id=\u0022rubber\u0022 fill=\u0022#000000\u0022\u003e\u003c/path\u003e\n \u003cpath d=\u0022M101.03287,77 C3.00000041,77 11.0384555,81 12.0328689,83 C12.9340405,84.8124687 56.7814754,84.999767 101.032869,84.9997652 C145.284263,84.9997635 189.131697,84.8124687 190.032869,83 C191.027282,81 199.065739,77 101.03287,77 Z\u0022 id=\u0022front\u0022 fill=\u0022url(#radialGradient-2)\u0022\u003e\u003c/path\u003e\n \u003cpath d=\u0022M42.8596846,0 C42.8596846,0 38.8820309,71 35.8987907,75 C32.9155505,79 11.0384555,79 12.0328689,81 C12.9340405,82.8124687 56.7814754,82.999767 101.032869,82.9997652 C145.284263,82.9997635 189.131697,82.8124687 190.032869,81 C191.027282,79 169.150187,79 166.166947,75 C163.183707,71 159.206053,0 159.206053,0 L101.032869,0 L42.8596846,0 Z\u0022 fill=\u0022url(#linearGradient-3)\u0022\u003e\u003c/path\u003e\n \u003c/g\u003e\n \u003cg id=\u0022Screen\u0022\u003e\n \u003cpath d=\u0022M15.0017929,0 C6.71653147,0 0,6.72098482 0,14.9913586 L0,329 L520,329 L520,14.9913586 C520,6.71185988 513.282882,0 504.998207,0 L15.0017929,0 Z\u0022 id=\u0022blackglass\u0022 fill=\u0022#010000\u0022\u003e\u003c/path\u003e\n \u003cpath d=\u0022M0,329 L0,360.00153 C0,368.284956 6.71711823,375 15.0017929,375 L504.998207,375 C513.283469,375 520,368.28659 520,360.00153 L520,329 L0,329 Z\u0022 id=\u0022alu\u0022 fill=\u0022url(#linearGradient-4)\u0022\u003e\u003c/path\u003e\n \u003crect id=\u0022pixels\u0022 stroke=\u0022url(#radialGradient-5)\u0022 stroke-width=\u00224\u0022 fill=\u0022#FFFFFF\u0022 stroke-linejoin=\u0022round\u0022 x=\u002221\u0022 y=\u002219\u0022 width=\u0022479\u0022 height=\u0022289\u0022\u003e\u003c/rect\u003e\n \u003crect id=\u0022edge\u0022 fill=\u0022url(#linearGradient-6)\u0022 x=\u00220\u0022 y=\u0022329\u0022 width=\u0022520\u0022 height=\u00221\u0022\u003e\u003c/rect\u003e\n \u003ccircle id=\u0022camera\u0022 stroke=\u0022url(#linearGradient-9)\u0022 fill=\u0022url(#radialGradient-8)\u0022 cx=\u0022260.5\u0022 cy=\u00229.5\u0022 r=\u00222.5\u0022\u003e\u003c/circle\u003e\n \u003c/g\u003e\n \u003c/g\u003e\n \u003c/g\u003e\n \u003c/g\u003e\n\u003c/svg\u003e","shapeJustify":"","width":[470,null,null,340],"height":[380,null,null,240]} --> <div id="gspb_svgBox-id-gsbp-ce7117d1-15d3" class="gspb_svgBox gspb_svgBox-id-gsbp-ce7117d1-15d3 wp-block-greenshift-blocks-svgshape"><svg viewBox="0 0 520 443" style="width:5rem;height:5rem;margin:10px"> <defs> <filter x="-29.9%" y="-500.0%" width="159.7%" height="1100.0%" filterUnits="objectBoundingBox" id="filter-1"> <feGaussianBlur stdDeviation="20 0" in="SourceGraphic"></feGaussianBlur> </filter> <radialGradient cx="50%" cy="25.2858292%" fx="50%" fy="25.2858292%" r="778.056242%" gradientTransform="translate(0.500000,0.252858),scale(0.044444,1.000000),rotate(88.646548),translate(-0.500000,-0.252858)" id="radialGradient-2"> <stop stop-color="#E9EBED" offset="0%"></stop> <stop stop-color="#9D9FA2" offset="100%"></stop> </radialGradient> <linearGradient x1="50%" y1="25.2858292%" x2="50%" y2="100%" id="linearGradient-3"> <stop stop-color="#848589" offset="0%"></stop> <stop stop-color="#F5F5F5" offset="56.5841003%"></stop> <stop stop-color="#D5D5D5" offset="80.702943%"></stop> <stop stop-color="#BCBCBC" offset="90.8405902%"></stop> <stop stop-color="#8D8E92" offset="100%"></stop> </linearGradient> <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="linearGradient-4"> <stop stop-color="#D2D3D5" offset="0%"></stop> <stop stop-color="#95979B" offset="100%"></stop> </linearGradient> <radialGradient cx="92.9403782%" cy="-1.1418124%" fx="92.9403782%" fy="-1.1418124%" r="96.0040657%" gradientTransform="translate(0.929404,-0.011418),scale(0.600000,1.000000),rotate(90.000000),translate(-0.929404,0.011418)" id="radialGradient-5"> <stop stop-color="#282828" offset="0%"></stop> <stop stop-color="#141414" offset="100%"></stop> </radialGradient> <linearGradient x1="3.061617e-15%" y1="50%" x2="100%" y2="50%" id="linearGradient-6"> <stop stop-color="#B3B5BA" offset="0%"></stop> <stop stop-color="#F6F8FA" offset="100%"></stop> </linearGradient> <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-7"> <stop stop-color="#FFFFFF" stop-opacity="0.4" offset="0%"></stop> <stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop> </linearGradient> <radialGradient cx="50%" cy="26.2029892%" fx="50%" fy="26.2029892%" r="40.7383851%" id="radialGradient-8"> <stop stop-color="#0E0036" offset="0%"></stop> <stop stop-color="#26006E" offset="100%"></stop> </radialGradient> <linearGradient x1="50%" y1="100%" x2="50%" y2="0%" id="linearGradient-9"> <stop stop-color="#404040" offset="0%"></stop> <stop stop-color="#222222" offset="100%"></stop> </linearGradient> </defs> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Apple-devices" transform="translate(-110.000000, -485.000000)"> <g id="iMac-27"" transform="translate(110.000000, 485.000000)"> <g id="Foot" transform="translate(160.000000, 352.000000)"> <ellipse id="shadow" fill-opacity="0.249999985" fill="#000000" filter="url(#filter-1)" cx="100.5" cy="85" rx="100.5" ry="6"></ellipse> <path d="M101.032505,78 C4.08888929,78 12.0380282,82.5 13.0213926,84.75 C13.9125512,86.7890273 57.2727923,86.9997379 101.032504,86.9997359 C144.792215,86.9997339 188.152456,86.7890273 189.043615,84.75 C190.026979,82.5 197.97612,78 101.032505,78 Z" id="rubber" fill="#000000"></path> <path d="M101.03287,77 C3.00000041,77 11.0384555,81 12.0328689,83 C12.9340405,84.8124687 56.7814754,84.999767 101.032869,84.9997652 C145.284263,84.9997635 189.131697,84.8124687 190.032869,83 C191.027282,81 199.065739,77 101.03287,77 Z" id="front" fill="url(#radialGradient-2)"></path> <path d="M42.8596846,0 C42.8596846,0 38.8820309,71 35.8987907,75 C32.9155505,79 11.0384555,79 12.0328689,81 C12.9340405,82.8124687 56.7814754,82.999767 101.032869,82.9997652 C145.284263,82.9997635 189.131697,82.8124687 190.032869,81 C191.027282,79 169.150187,79 166.166947,75 C163.183707,71 159.206053,0 159.206053,0 L101.032869,0 L42.8596846,0 Z" fill="url(#linearGradient-3)"></path> </g> <g id="Screen"> <path d="M15.0017929,0 C6.71653147,0 0,6.72098482 0,14.9913586 L0,329 L520,329 L520,14.9913586 C520,6.71185988 513.282882,0 504.998207,0 L15.0017929,0 Z" id="blackglass" fill="#010000"></path> <path d="M0,329 L0,360.00153 C0,368.284956 6.71711823,375 15.0017929,375 L504.998207,375 C513.283469,375 520,368.28659 520,360.00153 L520,329 L0,329 Z" id="alu" fill="url(#linearGradient-4)"></path> <rect id="pixels" stroke="url(#radialGradient-5)" stroke-width="4" fill="#FFFFFF" stroke-linejoin="round" x="21" y="19" width="479" height="289"></rect> <rect id="edge" fill="url(#linearGradient-6)" x="0" y="329" width="520" height="1"></rect> <circle id="camera" stroke="url(#linearGradient-9)" fill="url(#radialGradient-8)" cx="260.5" cy="9.5" r="2.5"></circle> </g> </g> </g> </g> </svg></div> <!-- /wp:greenshift-blocks/svgshape --> <!-- wp:greenshift-blocks/container {"id":"gsbp-34bd5b07-9972","width":[420,null,null,255],"widthUnit":["px","%","%","px"],"minHeight":[255,null,null,154],"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false},"overflow":["hidden"]},"position":{"positionType":["absolute","","",""],"positions":{"values":{"top":["24px",null,null,"22px"],"left":["35px",null,null,"24px"]}}}} --> <div id="gspb_container-id-gsbp-34bd5b07-9972" class="gspb_container gspb_container-gsbp-34bd5b07-9972 wp-block-greenshift-blocks-container"><!-- wp:greenshift-blocks/animation-container {"id":"gsbp-683e0d21-30da","y":255,"triggertype":"hover","set_from":false,"position":{"positionType":["absolute","","",""],"positions":{"values":{"top":["2px"],"left":[0],"bottom":[null],"right":[null]}}},"varheight":"minusheight"} --> <div id="gspb_gsap-gsbp-683e0d21-30da"><div id="gsbp-683e0d21-30da" class="gs-gsap-wrap" data-y="255" data-duration="1" data-triggertype="hover" data-varheight="minusheight"><!-- wp:greenshift-blocks/image {"id":"gsbp-81c42f58-8b0d","width":["auto",null,null,null],"originalWidth":500,"originalHeight":1042,"mediaurl":"https://greenshift.wpsoul.net/wp-content/uploads/2022/09/landing.png","mediaid":2294,"alt":""} --> <div id="gspb_image-id-gsbp-81c42f58-8b0d" class="gspb_image gspb_image-id-gsbp-81c42f58-8b0d wp-block-greenshift-blocks-image"><img src="https://greenshift.wpsoul.net/wp-content/uploads/2022/09/landing.png" data-src="" alt="" width="500" height="1042"/></div> <!-- /wp:greenshift-blocks/image --></div></div> <!-- /wp:greenshift-blocks/animation-container --></div> <!-- /wp:greenshift-blocks/container --></div> <!-- /wp:greenshift-blocks/container -->
On Hover Scroll
