E-commerce

Ecommerce

Copied
Check our latest items!

Shop now and find your special suits, t-shirts and trousers. Many designers just launched their Autumn/Winter 2021 Collection!
Have you seen us?
Our recent products

The time is now for it to be okay to be great. People in this world shun people for being great.
Wearing

Check our latest collection

Yesterday, this was an essential fabric and its news reader app Paper. It is design-focused wool called out...
Fashion

Wardrobe essentials

Argon is a great free UI package based on Bootstrap 4 that includes the most important components and features.
Fashion

Wardrobe essentials

Trends may come and go, but wardrobe essentials are here to stay. Basic pieces tend to be universal across.
Have you seen us?
Some of Our Pricing Plans

The time is now for it to be okay to be great. People in this world shun people for being great.
new collection
Our recent writings

The time is now for it to be okay to be great. People in this world shun people for being great.
New Challenges

Touch on a trend

New Opportunities

Constantly growing

Sales Leads

Configure Blockchain Technology

AI at the Edge

Research Byte

Spectrum

Data Virtualization

Touch on a trend

New Challenges

What Clients Say

Meet Wingman, a robust suite of styled pages and components, powered by Bootstrap 4. The ideal starting point for product landing pages, stylish web-apps and complete company websites.
Sarah Smith

Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.
Thank you for supporting us!

Let's get in touch on any of these platforms.

    
















<div class="w-full">
    <section class="flex relative items-center p-0 min-h-screen-75 z-0">
       <div class="absolute w-full h-full block bg-black opacity-50 z-1 left-0 top-0"></div>
       <div class="bg-blueGray-800 w-full h-full absolute bg-cover bg-50" style="background-image: url('../../assets/img/pages/fashion-show.jpg');"></div>
       <div class="relative h-full text-center text-white container mx-auto px-4 z-2 mb-24">
          <div class="justify-center flex flex-wrap -mx-4">
             <div class="px-12 px-4 relative w-full md:w-8/12">
                <h1 class="text-5xl font-bold leading-tight mt-0 mb-2">Check our latest items!</h1>
                <p class="text-xl leading-relaxed opacity-75 mt-1 mb-4">Shop now and find your special suits, t-shirts and trousers. Many designers just launched their Autumn/Winter 2021 Collection!</p>
                <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-red-500 border-red-500 active:bg-red-600 active:border-red-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md"><i class="fas fa-shopping-cart mr-1"></i> Start shopping</button>
             </div>
          </div>
       </div>
       <div class="w-full bottom-0 absolute z-2">
          <div class="w-full pointer-events-none overflow-hidden h-70-px" style="transform: translateZ(0px);">
             <svg class="absolute bottom-0 overflow-hidden" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" version="1.1" viewBox="0 0 2560 100" x="0" y="0">
                <polygon class="text-white fill-current" points="2560 0 2560 100 0 100"></polygon>
             </svg>
          </div>
       </div>
    </section>
 </div>


    
















<div class="w-full">
    <section class="relative py-12">
       <div class="container mx-auto px-4">
          <div class="mb-12 flex flex-wrap -mx-4 justify-start">
             <div class="px-4 relative w-full lg:w-8/12 text-left">
                <span class="text-pink-500 bg-pink-200 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">Have you seen us?</span>
                <h3 class="text-3xl font-bold mt-3 mb-1 text-blueGray-700">Our recent products</h3>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-500">The time is now for it to be okay to be great. People in this world shun people for being great.</p>
             </div>
          </div>
          <div class="flex flex-wrap -mx-4">
             <div class="px-4 relative w-full md:w-4/12">
                <div class="shadow-lg rounded-lg overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full mb-6">
                   <div class="p-6"><img alt="..." src="../../assets/img/ecommerce-1.jpg" class="w-full"></div>
                   <div class="px-6 pb-6 flex-auto">
                      <h6 class="text-red-500 font-bold uppercase text-sm mb-2"><i class="fas fa-calendar-check mr-1 opacity-75"></i> Wearing</h6>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2 my-4"><a href="javascript:;" class="">Check our latest collection</a></h4>
                      <p class="text-blueGray-500 leading-relaxed">Yesterday, this was an essential fabric and its news reader app Paper. It is design-focused wool called out...</p>
                   </div>
                </div>
             </div>
             <div class="px-4 relative w-full md:w-4/12">
                <div class="shadow-lg rounded-lg overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full mb-6">
                   <div class="p-6"><img alt="..." src="../../assets/img/p2.png" class="w-full"></div>
                   <div class="px-6 pb-6 flex-auto">
                      <h6 class="text-red-500 font-bold uppercase text-sm mb-2"><i class="fas fa-calendar-check mr-1 opacity-75"></i> Fashion</h6>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2 my-4"><a href="javascript:;" class="">Wardrobe essentials</a></h4>
                      <p class="text-blueGray-500 leading-relaxed">Argon is a great free UI package based on Bootstrap 4 that includes the most important components and features.</p>
                   </div>
                </div>
             </div>
             <div class="px-4 relative w-full md:w-4/12">
                <div class="shadow-lg rounded-lg overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full mb-6">
                   <div class="p-6"><img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/linth3.41699b02.svg" class="w-full"></div>
                   <div class="px-6 pb-6 flex-auto">
                      <h6 class="text-red-500 font-bold uppercase text-sm mb-2"><i class="fas fa-calendar-check mr-1 opacity-75"></i> Fashion</h6>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2 my-4"><a href="javascript:;" class="">Wardrobe essentials</a></h4>
                      <p class="text-blueGray-500 leading-relaxed">Trends may come and go, but wardrobe essentials are here to stay. Basic pieces tend to be universal across.</p>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </section>
 </div>


    <div class="w-full">
    <section class="relative py-12">
       <div class="container mx-auto px-4">
          <div class="mb-12">
             <div class="flex flex-wrap -mx-4 justify-start">
                <div class="px-4 relative w-full text-left">
                   <span class="text-blueGray-500 bg-blueGray-100 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">Have you seen us?</span>
                   <h2 class="text-4xl font-bold mt-3 mb-1 text-blueGray-700">Some of Our Pricing Plans</h2>
                   <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-400">The time is now for it to be okay to be great. People in this world shun people for being great.</p>
                </div>
             </div>
          </div>
          <div class="flex flex-wrap -mx-4">
             <div class="px-4 relative w-full md:w-3/12">
                <div class="relative flex flex-col min-w-0 break-words w-full bg-transparent">
                   <div>
                      <div class="h-8 text-center"><span class="text-teal-500 bg-teal-200 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">new collection</span></div>
                      <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/tshirt5.d8f53d72.jpg" class="w-full p-6">
                   </div>
                   <div class="p-6 flex-auto text-center">
                      <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Burberry</a></h5>
                      <span class="text-blueGray-700 text-lg">$2.300</span>
                   </div>
                </div>
             </div>
             <div class="px-4 relative w-full md:w-3/12">
                <div class="relative flex flex-col min-w-0 break-words w-full bg-transparent">
                   <div>
                      <div class="h-8 text-center"><span class="text-red-500 bg-red-200 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">On Discount</span></div>
                      <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/tshirt2.56983c49.jpg" class="w-full p-6">
                   </div>
                   <div class="p-6 flex-auto text-center">
                      <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Casablanca</a></h5>
                      <span class="text-blueGray-700 text-lg line-through mr-2">$1.179</span><span class="text-red-500 font-semibold text-lg">$999</span>
                   </div>
                </div>
             </div>
             <div class="px-4 relative w-full md:w-3/12">
                <div class="relative flex flex-col min-w-0 break-words w-full bg-transparent">
                   <div>
                      <div class="h-8 text-center"></div>
                      <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/tshirt3.db592a23.jpg" class="w-full p-6">
                   </div>
                   <div class="p-6 flex-auto text-center">
                      <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Palm Angels</a></h5>
                      <span class="text-blueGray-700 text-lg">$450</span>
                   </div>
                </div>
             </div>
             <div class="px-4 relative w-full md:w-3/12">
                <div class="relative flex flex-col min-w-0 break-words w-full bg-transparent">
                   <div>
                      <div class="h-8 text-center"></div>
                      <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/tshirt4.9bd30523.jpg" class="w-full p-6">
                   </div>
                   <div class="p-6 flex-auto text-center">
                      <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Saint Laurent</a></h5>
                      <span class="text-blueGray-700 text-lg">$349</span>
                   </div>
                </div>
             </div>
             <div class="mx-auto mt-12"><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-pink-500 border-pink-500 active:bg-pink-600 active:border-pink-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">Load more...</button></div>
          </div>
       </div>
    </section>
 </div>

    
















<div class="w-full">
    <div class="my-12">
       <div class="mb-12">
          <div class="flex flex-wrap -mx-4 justify-start">
             <div class="px-4 relative w-full text-left">
                <span class="text-blueGray-800 bg-blueGray-400 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">Have you seen us?</span>
                <h2 class="text-4xl font-bold mt-3 mb-1 text-blueGray-700">Our recent writings</h2>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-400">The time is now for it to be okay to be great. People in this world shun people for being great.</p>
             </div>
          </div>
       </div>
       <div class="items-center flex flex-wrap -mx-4 mb-0">
          <div class="px-4 mb-4 relative w-full lg:w-1/4">
             <div class="h-330-px overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full shadow-lg transition-all duration-150 ease-in-out hover:z-1 hover:transform hover:scale-110 group rounded-lg mb-4">
                <div class="absolute w-full h-full bg-50-center bg-cover transition-all duration-1000 ease-in-out group-hover:transform group-hover:scale-110 rounded-lg" style="background-image: url('../../assets/img/sections/josh-appel.jpg'); backface-visibility: hidden;"></div>
                <div class="absolute w-full h-full bg-black opacity-50 rounded-lg"></div>
                <a href="javascript:;">
                   <div class="absolute text-left p-6 bottom-0">
                      <h6 class="text-xl leading-normal mb-0 text-white opacity-75">New Challenges</h6>
                      <h5 class="text-2xl font-bold leading-tight mt-0 mb-2 text-white">Touch on a trend</h5>
                   </div>
                </a>
             </div>
          </div>
          <div class="px-4 mb-4 relative w-full lg:w-1/4">
             <div class="h-330-px overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full shadow-lg transition-all duration-150 ease-in-out hover:z-1 hover:transform hover:scale-110 group rounded-lg mb-4">
                <div class="absolute w-full h-full bg-50-center bg-cover transition-all duration-1000 ease-in-out group-hover:transform group-hover:scale-110 rounded-lg" style="background-image: url('../../assets/img/sections/john-hoang.jpg'); backface-visibility: hidden;"></div>
                <div class="absolute w-full h-full bg-black opacity-50 rounded-lg"></div>
                <a href="javascript:;">
                   <div class="absolute text-left p-6 bottom-0">
                      <h6 class="text-xl leading-normal mb-0 text-white opacity-75">New Opportunities</h6>
                      <h5 class="text-2xl font-bold leading-tight mt-0 mb-2 text-white">Constantly growing</h5>
                   </div>
                </a>
             </div>
          </div>
          <div class="px-4 mb-4 relative w-full lg:w-2/4">
             <div class="h-330-px overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full shadow-lg transition-all duration-150 ease-in-out hover:z-1 hover:transform hover:scale-110 group rounded-lg mb-4">
                <div class="absolute w-full h-full bg-50-center bg-cover transition-all duration-1000 ease-in-out group-hover:transform group-hover:scale-110 rounded-lg" style="background-image: url('../../assets/img/sections/kit-suman.jpg'); backface-visibility: hidden;"></div>
                <div class="absolute w-full h-full bg-black opacity-50 rounded-lg"></div>
                <a href="javascript:;">
                   <div class="absolute text-left p-6 bottom-0">
                      <h6 class="text-xl leading-normal mb-0 text-white opacity-75">Sales Leads</h6>
                      <h5 class="text-2xl font-bold leading-tight mt-0 mb-2 text-white">Configure Blockchain Technology</h5>
                   </div>
                </a>
             </div>
          </div>
          <div class="px-4 mb-4 relative w-full lg:w-2/4">
             <div class="h-330-px overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full shadow-lg transition-all duration-150 ease-in-out hover:z-1 hover:transform hover:scale-110 group rounded-lg mb-4">
                <div class="absolute w-full h-full bg-50-center bg-cover transition-all duration-1000 ease-in-out group-hover:transform group-hover:scale-110 rounded-lg" style="background-image: url('../../assets/img/sections/damian.jpg'); backface-visibility: hidden;"></div>
                <div class="absolute w-full h-full bg-black opacity-50 rounded-lg"></div>
                <a href="javascript:;">
                   <div class="absolute text-left p-6 bottom-0">
                      <h6 class="text-xl leading-normal mb-0 text-white opacity-75">AI at the Edge</h6>
                      <h5 class="text-2xl font-bold leading-tight mt-0 mb-2 text-white">Research Byte</h5>
                   </div>
                </a>
             </div>
          </div>
          <div class="px-4 mb-4 relative w-full lg:w-1/4">
             <div class="h-330-px overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full shadow-lg transition-all duration-150 ease-in-out hover:z-1 hover:transform hover:scale-110 group rounded-lg mb-4">
                <div class="absolute w-full h-full bg-50-center bg-cover transition-all duration-1000 ease-in-out group-hover:transform group-hover:scale-110 rounded-lg" style="background-image: url('../../assets/img/sections/ashim.jpg'); backface-visibility: hidden;"></div>
                <div class="absolute w-full h-full bg-black opacity-50 rounded-lg"></div>
                <a href="javascript:;">
                   <div class="absolute text-left p-6 bottom-0">
                      <h6 class="text-xl leading-normal mb-0 text-white opacity-75">Spectrum</h6>
                      <h5 class="text-2xl font-bold leading-tight mt-0 mb-2 text-white">Data Virtualization</h5>
                   </div>
                </a>
             </div>
          </div>
          <div class="px-4 mb-4 relative w-full lg:w-1/4">
             <div class="h-330-px overflow-hidden relative flex flex-col min-w-0 break-words bg-white w-full shadow-lg transition-all duration-150 ease-in-out hover:z-1 hover:transform hover:scale-110 group rounded-lg mb-4">
                <div class="absolute w-full h-full bg-50-center bg-cover transition-all duration-1000 ease-in-out group-hover:transform group-hover:scale-110 rounded-lg" style="background-image: url('../../assets/img/sections/odin.jpg'); backface-visibility: hidden;"></div>
                <div class="absolute w-full h-full bg-black opacity-50 rounded-lg"></div>
                <a href="javascript:;">
                   <div class="absolute text-left p-6 bottom-0">
                      <h6 class="text-xl leading-normal mb-0 text-white opacity-75">Touch on a trend</h6>
                      <h5 class="text-2xl font-bold leading-tight mt-0 mb-2 text-white">New Challenges</h5>
                   </div>
                </a>
             </div>
          </div>
       </div>
       <div class="text-center"><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-pink-500 border-pink-500 active:bg-pink-600 active:border-pink-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">show more</button></div>
    </div>
 </div>


       <section class="relative py-12">
          <div class="container mx-auto px-4">
             <div class="mb-12"></div>
             <div class="flex flex-wrap -mx-4">
                <div class="px-4 relative w-full md:w-3/12">
                   <div class="relative flex flex-col min-w-0 break-words w-full bg-white shadow-lg rounded">
                      <div>
                         <div class="h-8 text-center"></div>
                         <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/hat.e973baf6.png" class="w-full p-6">
                      </div>
                      <div class="p-6 flex-auto text-center">
                         <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Winter Hat</a></h5>
                         <span class="text-blueGray-700 text-lg">$ 99</span>
                      </div>
                   </div>
                </div>
                <div class="px-4 relative w-full md:w-3/12">
                   <div class="relative flex flex-col min-w-0 break-words w-full bg-white shadow-lg rounded">
                      <div>
                         <div class="h-8 text-center"></div>
                         <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/shorts.2d9699b3.png" class="w-full p-6">
                      </div>
                      <div class="p-6 flex-auto text-center">
                         <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Gucci Shorts</a></h5>
                         <span class="text-blueGray-700 text-lg line-through mr-2">$ 879</span><span class="text-red-500 font-semibold text-lg">$ 499</span>
                      </div>
                   </div>
                </div>
                <div class="px-4 relative w-full md:w-3/12">
                   <div class="relative flex flex-col min-w-0 break-words w-full bg-white shadow-lg rounded">
                      <div>
                         <div class="h-8 text-center"></div>
                         <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/bracelet.7a620de7.png" class="w-full p-6">
                      </div>
                      <div class="p-6 flex-auto text-center">
                         <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Ice Bracelet</a></h5>
                         <span class="text-blueGray-700 text-lg">$ 19,999</span>
                      </div>
                   </div>
                </div>
                <div class="px-4 relative w-full md:w-3/12">
                   <div class="relative flex flex-col min-w-0 break-words w-full bg-white shadow-lg rounded">
                      <div>
                         <div class="h-8 text-center"></div>
                         <img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/bullet.f66bf624.png" class="w-full p-6">
                      </div>
                      <div class="p-6 flex-auto text-center">
                         <h5 class="text-2xl font-bold mt-0"><a href="javascript:;" class="">Necklace</a></h5>
                         <span class="text-blueGray-700 text-lg">$ 229</span>
                      </div>
                   </div>
                </div>
                <div class="mx-auto mt-12"><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-pink-500 border-pink-500 active:bg-pink-600 active:border-pink-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">Load more...</button></div>
             </div>
          </div>
       </section>

    <div class="pb-12 mt-12 bg-blueGray-100 relative">


    <div class="w-full">
    <div class="pb-12 mt-12 bg-blueGray-100 relative">
       <div class="container mx-auto px-4">
          <div class="mb-12 flex flex-wrap -mx-4 justify-start">
             <div class="px-4 relative w-full lg:w-8/12 text-left">
                <span class="text-blueGray-800 bg-blueGray-400 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">See our customers opinion</span>
                <h3 class="text-3xl font-bold mt-3 mb-1 text-blueGray-700">What Clients Say</h3>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-500">Meet Wingman, a robust suite of styled pages and components, powered by Bootstrap 4. The ideal starting point for product landing pages, stylish web-apps and complete company websites.</p>
             </div>
          </div>
          <div class="mt-12 relative">
             <div class="relative w-full overflow-hidden">
                <div>
                   <div class="p-6 transform duration-300 transition-all ease-in-out mx-auto block">
                      <div class="container mx-auto px-4">
                         <div class="flex flex-wrap -mx-4">
                            <div class="px-4 relative w-full md:w-6/12 flex items-center mx-auto">
                               <div class="p-2">
                                  <h2 class="text-4xl font-bold leading-tight mt-0 mb-2">Sarah Smith</h2>
                                  <p class="mt-4 mb-12 text-blueGray-500 text-lg leading-relaxed">Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.</p>
                                  <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-indigo-500 border-indigo-500 active:bg-indigo-600 active:border-indigo-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">read more</button>
                               </div>
                            </div>
                            <div class="px-12 py-12 relative w-full md:w-5/12">
                               <div class="p-6"><img class="w-full rounded-lg shadow-xl" src="https://demos.creative-tim.com/notus-pro-react/static/media/brooke-cagle.940d1a99.jpg" alt="..."></div>
                            </div>
                         </div>
                      </div>
                   </div>
                   <div class="p-6 transform duration-300 transition-all ease-in-out mx-auto hidden">
                      <div class="container mx-auto px-4">
                         <div class="flex flex-wrap -mx-4">
                            <div class="px-4 relative w-full md:w-6/12 flex items-center mx-auto">
                               <div class="p-2">
                                  <h2 class="text-4xl font-bold leading-tight mt-0 mb-2">Isaac Hunter</h2>
                                  <p class="mt-4 mb-12 text-blueGray-500 text-lg leading-relaxed">Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.</p>
                                  <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-teal-500 border-teal-500 active:bg-teal-600 active:border-teal-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">read more</button>
                               </div>
                            </div>
                            <div class="px-12 py-12 relative w-full md:w-5/12">
                               <div class="p-6"><img class="w-full rounded-lg shadow-xl" src="https://demos.creative-tim.com/notus-pro-react/static/media/fezbot.106ba6c3.jpg" alt="..."></div>
                            </div>
                         </div>
                      </div>
                   </div>
                </div>
                <div class="flex justify-center mb-12"><a href="javascript:;" class="text-white text-center opacity-50 hover:opacity-100 transition-opacity duration-150 ease-linear w-12 text-xl"><i class="text-lightBlue-500 fas fa-chevron-left"></i><span class="sr-only">Previous</span></a><a href="javascript:;" class="text-white text-center opacity-50 hover:opacity-100 transition-opacity duration-150 ease-linear w-12 text-xl"><i class="text-lightBlue-500 fas fa-chevron-right"></i><span class="sr-only">Next</span></a></div>
             </div>
          </div>
       </div>
    </div>
 </div>

    <div class="pt-12 pb-4 border-b bg-blueGray-100">
       <div class="container mx-auto px-4">
          <div class="justify-between items-center flex flex-wrap -mx-4">
             <div class="px-4 relative w-full lg:w-6/12">
                <h3 class="text-xl font-bold leading-normal mt-0">Thank you for supporting us!</h3>
                <h4 class="leading-normal mt-1 mb-2 text-blueGray-500">Let's get in touch on any of these platforms.</h4>
             </div>
             <div class="text-right pr-6 px-4 relative w-full lg:w-6/12"><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-blueGray-800 bg-white border-white active:bg-blueGray-100 active:border-blueGray-100 text-xs px-3 py-2 shadow hover:shadow-md rounded-md"><i class="fab fa-twitter"></i></button><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-blueGray-800 bg-white border-white active:bg-blueGray-100 active:border-blueGray-100 text-xs px-3 py-2 shadow hover:shadow-md rounded-md"><i class="fab fa-facebook"></i></button><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-blueGray-800 bg-white border-white active:bg-blueGray-100 active:border-blueGray-100 text-xs px-3 py-2 shadow hover:shadow-md rounded-md"><i class="fab fa-dribbble"></i></button><button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-blueGray-800 bg-white border-white active:bg-blueGray-100 active:border-blueGray-100 text-xs px-3 py-2 shadow hover:shadow-md rounded-md"><i class="fab fa-github"></i></button></div>
          </div>
       </div>
    </div>
    <footer class="bg-blueGray-100">
       <div class="container mx-auto px-4">
          <div class="items-center xl:justify-between flex flex-wrap -mx-4">
             <div class="px-4 relative w-full xl:w-6/12 w-full sm:w-full">
                <div class="text-center xl:text-left py-6 text-sm text-blueGray-500">Copyright © 2021<a href="https://www.creative-tim.com" target="_blank" class="font-semibold ml-1">Creative Tim</a>. All rights reserved.</div>
             </div>
             <div class="px-4 relative w-full xl:w-6/12 w-full sm:w-full">
                <ul class="justify-center xl:justify-end mx-auto flex flex-wrap list-none pl-0 mb-0">
                   <li><a href="https://www.creative-tim.com" target="_blank" class="text-sm block px-4 bg-transparent no-underline text-blueGray-500 hover:text-blueGray-700 py-4 md:py-6 mx-auto">Creative Tim</a></li>
                   <li><a href="https://www.creative-tim.com/presentation" target="_blank" class="text-sm block px-4 bg-transparent no-underline text-blueGray-500 hover:text-blueGray-700 py-4 md:py-6 mx-auto">About us</a></li>
                   <li><a href="https://www.creative-tim.com/blog" target="_blank" class="text-sm block px-4 bg-transparent no-underline text-blueGray-500 hover:text-blueGray-700 py-4 md:py-6 mx-auto">Blog</a></li>
                </ul>
             </div>
          </div>
       </div>
    </footer>
 </div>