Hello SenangStart!
Zero config, instant styling.
```
**Documentation**: [Getting Started Guide](https://bookklik-technologies.github.io/senangstart-css/guide/getting-started.html)
## SenangStart CSS Code
```html
<section id="islbl" layout="container" space="m-x:auto m-y:large p-x:medium-3x tw-lg:m-y:big-3x tw-lg:p-x:big-3x">
<div id="i1g8b4" layout="grid grid-cols:1" space="m-b:large tw-lg:m-x:giant tw-lg:m-b:big-3x" visual="text:center">
<div id="ifhpfw" layout="col-span:1"></div>
<div id="ii2jm">
<h1 id="iyj0h" space="m-b:small tw-lg:m-b:medium" visual="text-size:grand font:tw-bold capitalize tw-lg:text-size:mega">📱 How To Get Started<br /></h1>
</div>
<div id="ia8bfp" layout="flex items:center">
<p id="i7p89" space="w:[100%]" visual="text-size:base font:tw-medium tw-lg:text-size:huge">3 simple steps to start playing STEM-AR now.<br /></p>
</div>
</div>
<div id="i4q09" layout="grid tw-lg:grid-cols:2" space="g:medium tw-lg:g:big-3x">
<div id="istii" layout="flex items:center"><img id="i5f9sn" src="https://placehold.co/320x480" space="m-x:auto w:[100%]" /></div>
<div id="iowf7j">
<div id="ilv2h" layout="grid" space="g:medium">
<div id="izo6k" layout="flex col" space="p:medium" visual="rounded:big border-w:regular border:blue-600 bg:blue-100">
<div id="i0lmy" layout="flex items:center justify:center" space="m-b:medium h:big-3x w:big-3x" visual="rounded:round bg:blue-600 text-size:grand text:white"><i id="ikqdo5" class="fas fa-print"></i></div>
<h4 id="iadh3" space="m-b:small" visual="text-size:large font:tw-semibold">Print the Marker<br /></h4>
<p id="iuds9" visual="text-size:large">Get ready to embark on an immersive learning journey by printing our specially designed markers. These markers serve as gateways to unlock a world of knowledge and discovery.<br /></p>
</div>
<div id="i2gaze" layout="flex col" space="p:medium" visual="rounded:big border-w:regular border:blue-600 bg:blue-100">
<div id="i83zyh" layout="flex items:center justify:center" space="m-b:medium h:big-3x w:big-3x" visual="rounded:round bg:blue-600 text-size:grand text:white"><i id="i04wah" class="fas fa-gamepad"></i></div>
<h4 id="itajj" space="m-b:small" visual="text-size:large font:tw-semibold">Start the App<br /></h4>
<p id="ig8dk" visual="text-size:large">Launch the STEM-AR app on your device and point it towards the printed marker. Watch in awe as the marker transforms into a portal, transporting you to interactive, three-dimensional models and simulations.<br /></p>
<a href="https://stem-ar.bookklik.com/game/" type="button" target="_blank" id="i1y3rk" layout="flex items:center justify:center" space="m-t:medium h:big w:[100%] p-x:medium-3x tw-lg:max-w:[max-content]" visual="rounded:medium border-w:regular border:blue-600 bg:white text-size:large font:tw-semibold text:blue-600 hover:opacity:80">▶️ Start Now!</a>
</div>
<div id="izcj4i" layout="flex col" space="p:medium" visual="rounded:big border-w:regular border:blue-600 bg:blue-100">
<div id="ixb8lc" layout="flex items:center justify:center" space="m-b:medium h:big-3x w:big-3x" visual="rounded:round bg:blue-600 text-size:grand text:white"><i id="i2sowp" class="fas fa-check-circle"></i></div>
<h4 id="i71hl" space="m-b:small" visual="text-size:large font:tw-semibold">Ready<br /></h4>
<p id="i2cwq" visual="text-size:large">Whether you're delving into the mysteries of physics, unraveling the complexities of mathematics, or engineering innovative solutions, STEM-AR is your companion in learning.<br /></p>
</div>
</div>
</div>
</div>
</section>
```
## Tailwind CSS Code
```html
<section id="islbl" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div id="i1g8b4" class="mb-8 grid grid-cols-1 text-center lg:mx-24 lg:mb-16">
<div id="ifhpfw" class="col-span-1"></div>
<div id="ii2jm">
<h1 id="iyj0h" class="mb-2 text-3xl font-bold capitalize lg:mb-4 lg:text-6xl">📱 How To Get Started<br /></h1>
</div>
<div id="ia8bfp" class="flex items-center">
<p id="i7p89" class="w-full text-base font-medium lg:text-2xl">3 simple steps to start playing STEM-AR now.<br /></p>
</div>
</div>
<div id="i4q09" class="grid gap-4 lg:grid-cols-2 lg:gap-16">
<div id="istii" class="flex items-center"><img id="i5f9sn" src="https://placehold.co/320x480" class="mx-auto w-full" /></div>
<div id="iowf7j">
<div id="ilv2h" class="grid gap-4">
<div id="izo6k" class="flex flex-col rounded-2xl border-2 border-blue-600 bg-blue-100 p-4">
<div id="i0lmy" class="mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-blue-600 text-3xl text-white"><i id="ikqdo5" class="fas fa-print"></i></div>
<h4 id="iadh3" class="mb-2 text-lg font-semibold">Print the Marker<br /></h4>
<p id="iuds9" class="text-lg">Get ready to embark on an immersive learning journey by printing our specially designed markers. These markers serve as gateways to unlock a world of knowledge and discovery.<br /></p>
</div>
<div id="i2gaze" class="flex flex-col rounded-2xl border-2 border-blue-600 bg-blue-100 p-4">
<div id="i83zyh" class="mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-blue-600 text-3xl text-white"><i id="i04wah" class="fas fa-gamepad"></i></div>
<h4 id="itajj" class="mb-2 text-lg font-semibold">Start the App<br /></h4>
<p id="ig8dk" class="text-lg">Launch the STEM-AR app on your device and point it towards the printed marker. Watch in awe as the marker transforms into a portal, transporting you to interactive, three-dimensional models and simulations.<br /></p>
<a href="https://stem-ar.bookklik.com/game/" type="button" target="_blank" id="i1y3rk" class="mt-4 flex h-12 w-full items-center justify-center rounded-lg border-2 border-blue-600 bg-white px-6 text-lg font-semibold text-blue-600 hover:opacity-80 lg:max-w-max">▶️ Start Now!</a>
</div>
<div id="izcj4i" class="flex flex-col rounded-2xl border-2 border-blue-600 bg-blue-100 p-4">
<div id="ixb8lc" class="mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-blue-600 text-3xl text-white"><i id="i2sowp" class="fas fa-check-circle"></i></div>
<h4 id="i71hl" class="mb-2 text-lg font-semibold">Ready<br /></h4>
<p id="i2cwq" class="text-lg">Whether you're delving into the mysteries of physics, unraveling the complexities of mathematics, or engineering innovative solutions, STEM-AR is your companion in learning.<br /></p>
</div>
</div>
</div>
</div>
</section>
```