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="i5mjqy" layout="container" space="p-x:medium-3x tw-lg:p-x:big-3x m-y:large tw-lg:m-y:big-3x m-x:auto">
<div
layout="overflow:hidden relative grid grid-cols:1 tw-lg:grid-cols:3" space="p:medium tw-lg:p-x:big-3x tw-lg:p-y:big g:medium" visual="rounded:medium bg:neutral-200">
<div id="idkx7p" layout="col-span:1 tw-lg:col-span:2 flex col justify:center">
<h1 id="isvtkz" space="m-b:small" visual="text-size:grand tw-lg:text-size:mega capitalize font:tw-semibold tw-lg:font:tw-bold">Ready to Take Your
Business to the Next Level?</h1>
<p id="i2aebj" space="w:[100%] m-b:medium tw-lg:m-b:large" visual="text-size:big tw-lg:text-size:huge opacity:70">Contact us today for a free
consultation and let our team of experts
discuss how we can create a custom software solution tailored to
your business needs and goals.</p>
<div id="i9v9v9" layout="flex" space="m-b:medium tw-lg:m-b:large">
<div layout="relative overflow:hidden" space="w:big-3x m-r:medium h:big-3x" visual="rounded:round bg:blue-100"><img
src="https://placehold.co/64x64"
layout="absolute top:none right:none" space="w:big-3x" class="grayscale"></div>
<div layout="flex justify:center col" visual="font:tw-semibold">
<p visual="text-size:large">A.Hakim Noor</p>
<p id="iwxz4f" visual="text-size:small">Technology Officer</p>
</div>
</div><a id="iks4tf" href="https://bookklik.com/contact-us" title="Contact Me"
layout="flex items:center justify:center" space="p-x:medium-3x w:[100%] tw-lg:max-w:[max-content] h:big" visual="bg:blue-600 text:white rounded:medium text-size:large font:tw-semibold hover:opacity:80">Contact
Me Now</a>
</div>
<div layout="hidden tw-lg:flex relative" class="justify-right"><img
src="https://placehold.co/400x400"
layout="absolute top:none left:none object:contain" space="w:[100%] h:[100%]"></div>
</div>
</section>
```
## Tailwind CSS Code
```html
<section id="i5mjqy" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div
class="rounded-lg bg-neutral-200 p-4 lg:px-16 lg:py-12 overflow-hidden relative grid grid-cols-1 lg:grid-cols-3 gap-4">
<div id="idkx7p" class="col-span-1 lg:col-span-2 flex flex-col justify-center">
<h1 id="isvtkz" class="text-3xl lg:text-6xl capitalize font-semibold lg:font-bold mb-2">Ready to Take Your
Business to the Next Level?</h1>
<p id="i2aebj" class="text-xl lg:text-2xl w-full opacity-70 mb-4 lg:mb-8">Contact us today for a free
consultation and let our team of experts
discuss how we can create a custom software solution tailored to
your business needs and goals.</p>
<div id="i9v9v9" class="flex mb-4 lg:mb-8">
<div class="w-16 rounded-full bg-blue-100 relative overflow-hidden mr-4 h-16"><img
src="https://placehold.co/64x64"
class="w-16 absolute top-0 right-0 grayscale"></div>
<div class="flex justify-center flex-col font-semibold">
<p class="text-lg">A.Hakim Noor</p>
<p id="iwxz4f" class="text-sm">Technology Officer</p>
</div>
</div><a id="iks4tf" href="https://bookklik.com/contact-us" title="Contact Me"
class="bg-blue-600 text-white rounded-lg text-lg font-semibold px-6 w-full lg:max-w-max h-12 flex items-center justify-center hover:opacity-80">Contact
Me Now</a>
</div>
<div class="hidden lg:flex justify-right relative"><img
src="https://placehold.co/400x400"
class="w-full h-full absolute top-0 left-0 object-contain"></div>
</div>
</section>
```