<section class="text-gray-700 body-font">
            <div class="container px-8 py-48 mx-auto lg:px-4">
                <div class="flex flex-wrap text-center">
                    <div class="px-8 py-6 lg:px-24 lg:w-2/4 md:w-full">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer Information 1</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:px-24 lg:w-2/4 md:w-full">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer Information 2</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </section>
                                    

        <section class="text-gray-700 body-font">
            <div class="container px-8 py-48 mx-auto lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#" class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"
                                fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </section>
                                                                        

        <section class="text-gray-700 body-font">
            <div class="container px-8 pt-48 mx-auto lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 md:w-full">
                        <div class="flex items-center mb-3">
                            <div
                                class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 mr-3 text-blue-800 bg-gray-200 rounded-full">
                                <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                    height="18" fill="currentColor">
                                    <path fill="none" d="M0 0h24v24H0z" />
                                    <path
                                        d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                                </svg>
                            </div>
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer
                                Information 1
                            </h2>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <div class="flex items-center mb-3">
                            <div
                                class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 mr-3 text-blue-800 bg-gray-200 rounded-full">
                                <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                    height="18" fill="currentColor">
                                    <path fill="none" d="M0 0h24v24H0z" />
                                    <path
                                        d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                                </svg>
                            </div>
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer
                                Information 2
                            </h2>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <div class="flex items-center mb-3">
                            <div
                                class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 mr-3 text-blue-800 bg-gray-200 rounded-full">
                                <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                    height="18" fill="currentColor">
                                    <path fill="none" d="M0 0h24v24H0z" />
                                    <path
                                        d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                                </svg>
                            </div>
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">Longer
                                Information 3
                            </h2>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </section>
                                                                        

         <section class="text-gray-700 body-font">
            <div class="container px-8 pt-48 mx-auto lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">
                            Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div class="flex items-center mb-3">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">
                                Information 2
                            </h2>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div class="flex items-center mb-3">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">
                                Information 3
                            </h2>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div class="flex items-center mb-3">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font">
                                Information 4
                            </h2>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                </div>
            </div>
        </section>
                                                                        

         <section class="text-gray-700 body-font">
            <div class="container px-8 pt-48 pb-24 mx-auto lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                height="18" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 1</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                height="18" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M14 10h-4v4h4v-4zm2 0v4h3v-4h-3zm-2 9v-3h-4v3h4zm2 0h3v-3h-3v3zM14 5h-4v3h4V5zm2 0v3h3V5h-3zm-8 5H5v4h3v-4zm0 9v-3H5v3h3zM8 5H5v3h3V5zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 2</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18"
                                fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 3</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#" class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"
                                fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18"
                                fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M14 10h-4v4h4v-4zm2 0v4h3v-4h-3zm-2 9v-3h-4v3h4zm2 0h3v-3h-3v3zM14 5h-4v3h4V5zm2 0v3h3V5h-3zm-8 5H5v4h3v-4zm0 9v-3H5v3h3zM8 5H5v3h3V5zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 4</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#" class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Learn More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"
                                fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </section>
                                                                        

         <section class="text-gray-700 body-font">
            <div class="container px-8 pt-48 pb-24 mx-auto lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                height="18" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 1</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                height="18" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M14 10h-4v4h4v-4zm2 0v4h3v-4h-3zm-2 9v-3h-4v3h4zm2 0h3v-3h-3v3zM14 5h-4v3h4V5zm2 0v3h3V5h-3zm-8 5H5v4h3v-4zm0 9v-3H5v3h3zM8 5H5v3h3V5zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 2</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                height="18" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zM11 13H4v6h7v-6zm9 0h-7v6h7v-6zm-9-8H4v6h7V5zm9 0h-7v6h7V5z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 3</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <div
                            class="inline-flex items-center justify-center flex-shrink-0 w-12 h-12 mb-5 text-blue-800 bg-gray-200 rounded-full">
                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18"
                                height="18" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M14 10h-4v4h4v-4zm2 0v4h3v-4h-3zm-2 9v-3h-4v3h4zm2 0h3v-3h-3v3zM14 5h-4v3h4V5zm2 0v3h3V5h-3zm-8 5H5v4h3v-4zm0 9v-3H5v3h3zM8 5H5v3h3V5zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" />
                            </svg>
                        </div>
                        <h2 class="mb-3 text-lg font-medium text-gray-700 title-font">Information 4</h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                </div>
            </div>
        </section>
                                                                        

        <section class="text-gray-700 body-font">
            <div class="container px-8 mx-auto py-36 lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                                  <img class="object-cover object-center w-full h-40 mb-6 rounded" src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                                  <img class="object-cover object-center w-full h-40 mb-6 rounded" src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                                  <img class="object-cover object-center w-full h-40 mb-6 rounded" src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </section>
                                                                        

        <section class="text-gray-700 body-font">
            <div class="container px-8 mx-auto py-36 lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <div class="flex items-center justify-between ">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                            </h2>
                            <span class="mb-1 text-xs font-medium tracking-widest text-blue-500 title-font">Your
                                tagline</span>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <div class="flex items-center justify-between ">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                            </h2>
                            <span class="mb-1 text-xs font-medium tracking-widest text-blue-500 title-font">Your
                                tagline</span>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <div class="flex items-center justify-between ">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 3
                            </h2>
                            <span class="mb-1 text-xs font-medium tracking-widest text-blue-500 title-font">Your
                                tagline</span>
                        </div>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                </div>
            </div>
        </section>
                                                                        

        <section class="text-gray-700 body-font">
            <div class="container px-8 mx-auto py-36 lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">

                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">

                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">

                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 3
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded" src="https://dummyimage.com/720x400/F3F4F7/8693ac"
                            alt="content">

                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 4
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#" class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"
                                fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </section>

                                    

        <section class="text-gray-700 body-font">
            <div class="container px-8 mx-auto py-36 lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 3
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 4
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                    </div>
                </div>
            </div>
        </section>
                                    

        <section class="text-gray-700 body-font">
            <div class="container px-8 mx-auto py-36 lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                            <p class="mt-1 font-bold">$21.15</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                            <p class="mt-1 font-bold">$21.15</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 3
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                            <p class="mt-1 font-bold">$21.15</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 4
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                            <p class="mt-1 font-bold">$21.15</p>
                    </div>
                </div>
            </div>
        </section>
                                                                        

         <section class="text-gray-700 body-font">
            <div class="container px-8 mx-auto py-36 lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <p class="mt-1 mt-12 text-sm ">Small text.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <p class="mt-1 mt-12 text-sm ">Small text.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 3
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <p class="mt-1 mt-12 text-sm ">Small text.</p>
                    </div>
                    <div class="px-8 py-6 lg:w-1/4 md:w-full">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/F3F4F7/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 4
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <p class="mt-1 mt-12 text-sm ">Small text.</p>
                    </div>
                </div>
            </div>
        </section>
                                            

        <section class="text-gray-700 body-font">
            <div class="container px-8 pt-24 mx-auto lg:px-4">
                <div class="flex flex-wrap text-left">
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <div class="p-6 rounded-md bg-blueGray-200">
                        <img class="object-cover object-center w-full h-40 mb-6 rounded"
                            src="https://dummyimage.com/720x400/ffffff/8693ac" alt="content">
                        <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 1
                        </h2>
                        <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                            Distillery
                            hexagon disrupt edison bulbche.</p>
                        <a href="#"
                            class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                            Read More
                            <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20"
                                height="20" fill="currentColor">
                                <path fill="none" d="M0 0h24v24H0z" />
                                <path
                                    d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                            </svg>
                        </a>
                        </div>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <div class="p-6 rounded-md bg-blueGray-200">
                            <img class="object-cover object-center w-full h-40 mb-6 rounded"
                                src="https://dummyimage.com/720x400/ffffff/8693ac" alt="content">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 2
                            </h2>
                            <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                                Distillery
                                hexagon disrupt edison bulbche.</p>
                            <a href="#" class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                                Read More
                                <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"
                                    fill="currentColor">
                                    <path fill="none" d="M0 0h24v24H0z" />
                                    <path d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="px-8 py-6 lg:w-1/3 md:w-full">
                        <div class="p-6 rounded-md bg-blueGray-200">
                            <img class="object-cover object-center w-full h-40 mb-6 rounded"
                                src="https://dummyimage.com/720x400/ffffff/8693ac" alt="content">
                            <h2 class="mb-3 text-lg font-semibold text-gray-700 lg:text-2xl title-font"> Information 3
                            </h2>
                            <p class="mb-4 text-base leading-relaxed">Fingerstache flexitarian street art 8-bit waistcoat.
                                Distillery
                                hexagon disrupt edison bulbche.</p>
                            <a href="#" class="inline-flex items-center font-semibold text-blue-700 md:mb-2 lg:mb-0 hover:text-blue-400 ">
                                Read More
                                <svg class="w-4 h-4 ml-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"
                                    fill="currentColor">
                                    <path fill="none" d="M0 0h24v24H0z" />
                                    <path d="M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" />
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </section>