File: /home/durgeshpandey215/public_html/demokalyani.skilladders.com/index_old.html
<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/remixicon/4.2.0/remixicon.css"
referrerpolicy="no-referrer"
/>
<title class="product-name"> Home</title>
<link rel="icon" type="image/png" href="./public/fabicon.png">
<link rel="stylesheet" href="./src/assests/css/output.css">
<!-- <script src="https://cdn.tailwindcss.com"></script> -->
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lobster&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto+Flex:opsz,wght@8..144,100..1000&family=Sawarabi+Mincho&display=swap" rel="stylesheet">
<style>
p{font-family: "Inter", sans-serif;}
/* .inter{ font-family: "Inter", sans-serif;} */
h1,h2,h3,h4,h5,h6{font-family:
"DM Sans";}
/*
.dm_sans{font-family:
"DM Sans";} */
.accordion-content {
transition: max-height 0.3s ease-out;
max-height: 0;
overflow: hidden;
}
.accordion-content.open {
max-height: 500px; /* Adjust as needed based on content height */
}
#preloader {
transition: opacity 0.5s ease, visibility 0.5s ease;
}
</style>
</head>
<body class="max-w-[1920px] m-auto block">
<div id="preloader" class="fixed inset-0 bg-white flex flex-col items-center justify-center z-50">
<div class="w-12 h-12 border-4 border-orange-500 border-t-transparent rounded-full animate-spin mb-4"></div>
<p class="text-gray-700 text-lg font-semibold">Loading...</p>
</div>
<header>
<div class=" bg-black">
<div class="h-[50px] w-full text-white m-auto px-[50px] hidden md:flex items-center justify-between">
<div class="flex space-x-[21.75px] mt-0 text-lg 2xl:text-2xl">
<a href="#"><i class="ri-facebook-circle-fill text-white"></i></a>
<a href="#"><i class="ri-instagram-fill"></i></a>
<a href="#"><i class="ri-linkedin-fill"></i></a>
<a href="#"><i class="ri-twitter-fill"></i></a>
</div>
<div class="space-x-3">
<a href="" class="text-white text-sm font-medium"><i class="ri-mail-line pr-2"></i><span>info@kalyanilimited.com</span></a>
<a href="" class="text-white text-sm font-medium"><i class="ri-whatsapp-line pr-2"></i><span>+9174895262</span></a>
<a href="" class="text-white text-sm font-medium"><i class="ri-phone-line pr-2"></i><span>+917270992000</span></a>
</div>
</div>
</div>
<nav class="bg-white py-3 px-4 md:py-6 md:px-8 w-full 2xl:h-[139.39px] m-auto">
<div class="flex justify-between items-center">
<a class="w-[100px] md:w-[140px] 2xl:w-[187.5px] h-auto inline-block object-contain" href="/index.html">
<img class="h-full w-full" src="../public/logo-nav.png" alt="" />
</a>
<ul class="hidden xl:flex gap-6 py-1 px-5 rounded-full">
<li class="font-medium md:text-sm 2xl:text-base text-zinc-500 nav-link md:pt-[2px] xl:pt-0" data-link="/index.html"><a href="/index.html" class="inline-block">Home</a></li>
<li class="relative group font-medium">
<a href="#" class="inline-flex items-center font-medium md:text-sm 2xl:text-base text-zinc-500">
About Kalyani
<span class="ms-[2px]">
<i class="ri-arrow-down-s-line"></i>
</span>
</a>
<ul class="absolute hidden z-30 group-hover:block capitalize hover:block bg-white text-black mt-0 rounded-lg shadow-lg w-60 ">
<!-- Categories will be dynamically inserted here -->
<li><a href="/view/about/aboutcompany.html" class="block px-4 py-2 hover:bg-orange-50">Company Profile</a></li>
<li><a href="/view/about/certificate.html" class="block px-4 py-2 hover:bg-orange-50">Certificate and Membership</a></li>
<li><a href="/view/about/about.html" class="block px-4 py-2 hover:bg-orange-50">Quality policy</a></li>
<li><a href="/view/about/aboutcooprate.html" class="block px-4 py-2 hover:bg-orange-50">Corporate video</a></li>
</ul>
</li>
<li class="relative group/cat font-medium">
<button class=" font-medium flex text-zinc-500 rounded">
<a href="/view/category-home.html">
Our Products
</a>
<span class="ms-[2px]">
<i class="ri-arrow-down-s-line"></i>
</span>
</button>
<ul class="absolute left-0 w-60 bg-white shadow-lg rounded opacity-0 invisible group-hover/cat:opacity-100 group-hover/cat:visible transition duration-200 z-50 categorylist">
</ul>
</li>
<li class="relative group font-medium">
<a href="#" class="inline-flex items-center font-medium md:text-sm 2xl:text-base text-zinc-500">
Business Area
<span class="ms-[2px]">
<i class="ri-arrow-down-s-line"></i>
</span>
</a>
<ul class="absolute hidden z-30 group-hover:block hover:block bg-white text-black mt-0 rounded-lg shadow-lg w-60">
<li><a href="/view/business/domistic_board.html" class="block px-4 py-2 hover:bg-orange-50">Domestic Brand Business</a></li>
<li><a href="/view/business/institution.html" class="block px-4 py-2 hover:bg-orange-50">Institutional Business</a></li>
<li><a href="/view/business/international.html" class="block px-4 py-2 hover:bg-orange-50"> International Business</a></li>
<li><a href="/view/business/manufacture.html" class="block px-4 py-2 hover:bg-orange-50">Contract Manufacturing</a></li>
<li><a href="/view/business/kalyanigrow.html" class="block px-4 py-2 hover:bg-orange-50">Grow with Kalyani</a></li>
<!-- <li><a href="/view/business/domistic_board.html" class="block px-4 py-2 hover:bg-orange-50">Product 1</a></li> -->
</ul>
</li>
<li class="relative group font-medium">
<a href="#" class="inline-flex items-center font-medium md:text-sm 2xl:text-base text-zinc-500">
Key Strength
<span class="ms-[2px]">
<i class="ri-arrow-down-s-line"></i>
</span>
</a>
<ul class="absolute hidden z-30 group-hover:block hover:block bg-white text-black mt-0 rounded-lg shadow-lg w-60">
<li><a href="/view/key-streangths/manfacture-strength.html" class="block px-4 py-2 hover:bg-orange-50">Manufacturing Strength</a></li>
<li><a href="/view/key-streangths/research-development.html" class="block px-4 py-2 hover:bg-orange-50">Research & Development</a></li>
<li><a href="/view/key-streangths/product-development.html" class="block px-4 py-2 hover:bg-orange-50">Product Development</a></li>
<li><a href="/view/key-streangths/marketing-network.html" class="block px-4 py-2 hover:bg-orange-50">Marketing Network</a></li>
<li><a href="/view/key-streangths/packageing.html" class="block px-4 py-2 hover:bg-orange-50">Packaging</a></li>
</ul>
</li>
<li class="font-medium md:text-sm 2xl:text-base text-zinc-500 nav-link" data-link="/kalyanigrow.html"><a href="#">Blog</a></li>
<li class="font-medium md:text-sm 2xl:text-base text-zinc-500 nav-link" data-link="/contact.html"><a href="/view/contact.html">Contact us</a></li>
</ul>
<div class="hidden xl:flex">
<a href="" class="w-[36px] h-[36px] 2xl:w-[50px] 2xl:h-[50px] bg-[#FEECD4] rounded-full flex items-center justify-center mr-2"><i class="ri-search-2-line text-xl text-[#ED7D0B]"></i></a>
<a
class="rounded-full px-[22px] py-[10px] 2xl:px-[25px] 2xl:py-[13.9px] font-medium md:text-sm 2xl:text-base text-white bg-[rgba(237,125,11,1)]" href="contact.html"
>
Corporate Brochure
</a>
</div>
<div class="block xl:hidden p-4 bg-white shadow-sm text-black">
<button id="openNav" class="text-3xl">
<i class="ri-menu-line"></i>
</button>
</div>
<div id="sideNav" class="fixed top-0 left-0 h-full w-0 bg-white text-black transition-all duration-300 ease-in-out overflow-x-hidden z-50">
<div class="flex justify-between p-4 items-center bg-white">
<img src="../public/logo-nav.png" alt="" srcset="" height="h-20 mx-auto block">
<button id="closeNav" class="text-3xl text-black">
<i class="ri-close-line "></i> <!-- Close icon -->
</button>
</div>
<ul class="mt-8 space-y-2 ">
<li><a href="/index.html" class="block text-lg px-4">Home</a></li>
<div class="w-full max-w-md mx-auto bg-white rounded-lg ">
<!-- Accordion Item 1 -->
<div class="border-b my-1">
<input type="checkbox" id="accordion1" class="peer hidden">
<label for="accordion1" class=" text-lg font-inter cursor-pointer border-b-gray-200 transition-all duration-300 py-2 flex justify-between bg-gray-100 px-5 "><span>Our Products</span> <i class="ri-arrow-down-s-line"></i></label>
<div class="max-h-0 overflow-hidden peer-checked:max-h-64 transition-[max-height] duration-500 ease-in-out bg-gray-50 px-4 ">
<ul class=" list-inside text-sm text-black categorylist list-none">
</ul>
</div>
</div>
<div class="border-b my-1">
<input type="checkbox" id="accordion2" class="peer hidden">
<label for="accordion2" class=" text-lg font-inter cursor-pointer border-b-gray-200 transition-all duration-300 py-2 flex justify-between bg-gray-100 px-5 "><span> About Kalyani</span> <i class="ri-arrow-down-s-line"></i></label>
<div class="max-h-0 overflow-hidden peer-checked:max-h-64 transition-[max-height] duration-500 ease-in-out bg-gray-50 px-4 ">
<ul class=" list-inside text-black text-sm ">
<!-- Categories will be dynamically inserted here -->
<li><a href="/view/about/aboutcompany.html" class="block px-4 py-2 hover:bg-orange-50">Company Profile</a></li>
<li><a href="/view/about/certificate.html" class="block px-4 py-2 hover:bg-orange-50">Certificate and Membership</a></li>
<li><a href="/view/about/about.html" class="block px-4 py-2 hover:bg-orange-50">Quality policy</a></li>
<li><a href="/view/about/aboutcooprate.html" class="block px-4 py-2 hover:bg-orange-50">Corporate video</a></li>
</ul>
</div>
</div>
<!-- 🧩 Parent Accordion -->
<div class="border-b my-1">
<input type="checkbox" id="productacc" class="peer hidden">
<label for="productacc" class="text-lg font-inter cursor-pointer border-b-gray-200 transition-all duration-300 py-2 flex justify-between bg-gray-100 px-5">
<span> Our Products</span> <i class="ri-arrow-down-s-line"></i>
</label>
<!-- 👇 Nested Accordions Wrapper -->
<div class="max-h-0 overflow-hidden peer-checked:max-h-[1000px] transition-[max-height] duration-500 ease-in-out bg-gray-50 px-4 productaccording">
</div>
</div>
<div class="border-b my-1">
<input type="checkbox" id="accordion3" class="peer hidden">
<label for="accordion3" class=" text-lg font-inter cursor-pointer border-b-gray-200 transition-all duration-300 py-2 flex justify-between bg-gray-100 px-5 "><span> Business Area</span> <i class="ri-arrow-down-s-line"></i></label>
<div class="max-h-0 overflow-hidden peer-checked:max-h-64 transition-[max-height] duration-500 ease-in-out bg-gray-50 px-4 ">
<ul class=" list-inside text-black text-sm ">
<li><a href="/view/business/domistic_board.html" class="block px-4 py-2 hover:bg-orange-50">Domestic Brand Business</a></li>
<li><a href="/view/business/institution.html" class="block px-4 py-2 hover:bg-orange-50">Institutional Business</a></li>
<li><a href="/view/business/international.html" class="block px-4 py-2 hover:bg-orange-50"> International Business</a></li>
<li><a href="/view/business/manufacture.html" class="block px-4 py-2 hover:bg-orange-50">Contract Manufacturing</a></li>
<li><a href="/view/business/kalyanigrow.html" class="block px-4 py-2 hover:bg-orange-50">Grow with Kalyani</a></li>
</ul>
</div>
</div>
<div class="border-b my-1">
<input type="checkbox" id="accordion4" class="peer hidden">
<label for="accordion4" class=" text-lg font-inter cursor-pointer border-b-gray-200 transition-all duration-300 py-2 flex justify-between bg-gray-100 px-5 "><span>Key Strength</span> <i class="ri-arrow-down-s-line"></i></label>
<div class="max-h-0 overflow-hidden peer-checked:max-h-64 transition-[max-height] duration-500 ease-in-out bg-gray-50 px-4 ">
<ul class=" list-inside text-black text-sm ">
<!-- Categories will be dynamically inserted here -->
<li><a href="/view/key-streangths/manfacture-strength.html" class="block px-4 py-2 hover:bg-orange-50">Manufacturing Strength</a></li>
<li><a href="/view/key-streangths/research-development.html" class="block px-4 py-2 hover:bg-orange-50">Research & Development</a></li>
<li><a href="/view/key-streangths/product-development.html" class="block px-4 py-2 hover:bg-orange-50">Product Development</a></li>
<li><a href="/view/key-streangths/marketing-network.html" class="block px-4 py-2 hover:bg-orange-50">Marketing Network</a></li>
<li><a href="/view/key-streangths/packageing.html" class="block px-4 py-2 hover:bg-orange-50">Packaging</a></li>
</ul>
</div>
</div>
<!-- Accordion Item 2 -->
</div>
<!-- <li><a href="/view/business/kalyanigrow.html" class="block text-lg px-4">Grow with Kalyani</a></li> -->
<li><a href="/view/contact.html" class="block text-lg px-4">contact us</a></li>
</ul>
</div>
<div id="overlay" class="fixed inset-0 bg-black opacity-0 transition-opacity duration-300 ease-in-out z-40 hidden"></div>
</div>
</nav>
</header>
<section class="w-full m-auto xl:mt-[74px]">
<div class="xl:w-[999px] m-auto h-[126px]">
<h2 class="text-[23px] md:text-[35px] xl:text-[50px] text-center lg:leading-[60px] font-normal font-poppins">Global Leaders in Public Health, Agriculture and Environmental Solutions</h2>
</div>
<div class="relative w-full h-[450px] lg:h-[800px]">
<img src="../public/landing.png" alt="" srcset="" class="w-full absolute z-10 h-full object-cover">
<div class="absolute z-20 w-full">
<div class="m-auto my-3">
<p class="text-lg font-medium text-center m-auto text-[#71717A] ">Pioneering Innovation, Quality, and Sustainability Since 2000.</p>
<div class="m-auto flex justify-center mt-3">
<a href="" class=" w-36 inline-block rounded-full px-5 py-3 text-ellipsis overflow-hidden bg-black text-white text-center text-nowrap text-base">Learn More</a>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="sticky top-10 h-0 w-full flex justify-end z-40">
<ul class="w-14 h-96 flex flex-col p-2 bg-gray-50 rounded-lg gap-2 shadow-md">
<li><a href="#"><img src="/public/icon_img/mail.png" alt="Mail" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/youtube.png" alt="YouTube" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/justdile.png" alt="Justdial" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/facebook.png" alt="Facebook" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/whatapp.png" alt="WhatsApp" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/instagram.png" alt="Instagram" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/linkdin.png" alt="LinkedIn" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
<li><a href="#"><img src="/public/icon_img/twitter.png" alt="Twitter" class="w-10 h-auto object-contain rounded-md hover:scale-110 transition-transform duration-200"></a></li>
</ul>
</div>
<section class="w-full m-auto">
<div class="lg:w-[785px] m-auto my-3">
<h2 class="capitalize text-[20px] md:text-[30px] lg:text-[36px] 2xl:text-[39px] font-medium text-center dm_sans">Our Agriculture and Environmental solution</h2>
<p class="text-sm mt-4 text-center px-10">Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.</p>
</div>
<div class="flex flex-wrap gap-5 p-8 z-20 m-auto md:w-[755px] xl:w-[1250px] categorycard">
</div>
</section>
<!-- Accordion -->
</section>
<section class="container 2xl:max-w-[1250px] mx-auto px-6 lg:px-10">
<div class="grid grid-cols-1 md:grid-cols-3 gap-3">
<!-- Key Strength Section -->
<div class="col-span-3 lg:col-span-1 flex flex-wrap ">
<div >
<div class="md:h-[300px] lg:h-[445px] overflow-hidden relative">
<h3 class="text-md sm:text-2xl lg:text-4xl font-normal flex"><img src="../public/list-icon.png" alt="" srcset="" class="object-contain mr-2 w-7 mt-2"> Our Key Strength</h3>
<p class="text-zinc-500 text-base">
Company has been able to lead the market due to its strength in manufacturing, research, product development, quality, and network. The objective of the organization is to make the best quality products available to the end-user with the latest technology.
</p>
<p class="text-zinc-500 text-base mt-3">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Modi molestias eum ea quo debitis repudiandae fugiat sapiente recusandae dicta! Dicta! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Molestiae quidem quaerat consequuntur perferendis, temporibus assumenda repudiandae! Cumque ipsum culpa veniam.</p>
<p class="text-zinc-500 text-base mt-3 overflow-hidden text-ellipsis ">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Modi molestias eum ea quo debitis repudiandae fugiat sapiente recusandae dicta! Dicta! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Perspiciatis, culpa?</p>
</div>
<a href="/view/key-streangths/manfacture-strength.html" class="font-semibold">Read More...</a>
<div class="w-full aspect-square rounded-lg overflow-hidden my-8 mb-0">
<img class="w-full h-full object-cover" src="../public/article.png" alt="Key Strength Image" />
</div>
</div>
</div>
<!-- Main Content Section -->
<div class=" col-span-3 lg:col-span-2">
<div class="h-[330px] overflow-hidden">
<h3 class="text-3xl md:text-4xl font-normal ">
<p>
<img src="../public/list-icon.png" alt="" srcset="" class="mr-2 w-7 mt-2 inline object-contain">
Established in 2000, Kalyani Industries Limited has emerged as a leader in the global market, setting unparalleled standards.
</p>
</h3>
<div class="text-zinc-500 mb-5 text-base">
<p class="mb-4">
Our company specializes in manufacturing, supplying, exporting, and trading a comprehensive range of highly effective Public Health Pesticides, Plant Growth Regulators, Environmental Care, and Agricultural Care Pesticides.
</p>
<p>
Emphasizing quality and safety, we meticulously adhere to IS and WHO specifications during our manufacturing process. This commitment ensures that equal consideration is given to the safety of animals and humans alike. By prioritizing stringent standards, we not only deliver superior products but also contribute to safeguarding public health and environmental sustainability. Kalyani Industries Limited remains dedicated to excellence, innovation, and customer satisfaction, maintaining its position as an industry leader.
</p>
</div>
</div>
<a href="/view/about/aboutcompany.html" class="font-semibold">Read More...</a>
<!-- Images Section -->
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 mb-8 mt-2">
<div class="overflow-hidden rounded-xl col-span-1 lg:col-span-2">
<img class="h-full w-full object-cover" src="../public/article2.png" alt="Article Image 1" />
</div>
<div class="overflow-hidden rounded-xl">
<img class="h-full w-full object-cover" src="../public/article3.png" alt="Article Image 2" />
</div>
</div>
<!-- International Business Section -->
<h3 class="text-3xl md:text-4xl font-normal mb-4 flex"><img src="../public/list-icon.png" alt="" srcset="" class="mr-2 w-6 h-6 self-center mt-1 object-contain"> International Business</h3>
<p class="text-base text-zinc-500 h-20 overflow-hidden">
At Kalyani Industries Limited, our International Business division is instrumental in catering to farmers and agricultural stakeholders globally. As a leading agrochemical manufacturer and exporter, we pledge to provide top-notch, inventive, and eco-friendly solutions to address the varied agricultural requirements across nations and regions.
</p>
<a href="/view/business/international.html" class="font-semibold">Read More...</a>
</div>
</div>
</section>
<section class="w-full m-auto my-10">
<div class="w-full h-[900px] md:h-[680px] xl:h-[441px] relative">
<img src="../public/image.png" alt="" srcset="" class="absolute z-10 w-full h-full ">
<img src="../public/rectangle.png" alt="" srcset="" class="z-20 absolute w-full h-full opacity-95">
<div class="z-30 absolute w-full h-full ">
<h1 class="uppercase text-center font-bold text-[35px] text-transparent bg-gradient-to-b from-[#BE8303] via-[#F6E692] to-[#C28A0D] bg-clip-text my-6">QUALITY CERTIFICATION</h1>
<div class="grid grid-cols-2 xl:grid-cols-6 md:grid-cols-3 gap-2 ">
<div class="w-[160px] md:w-[200px] 2xl:w-[231px] px-2 m-auto">
<div class="w-[150px] h-[150px] md:w-[170px] md:h-[170px] m-auto">
<img src="../public/accredited_laboratory.png" alt="" srcset="">
</div>
<p class="font-semibold text-[14px] md:text-[17px] text-center px-[13px] text-white mt-2">Competence of testing and calibration laboratory</p>
</div>
<div class="w-[160px] md:w-[200px] 2xl:w-[231px] px-2 m-auto">
<div class="w-[150px] h-[150px] md:w-[170px] md:h-[170px] m-auto">
<img src="../public/Environmental.png" alt="" srcset="">
</div>
<p class="font-semibold text-[14px] md:text-[17px] text-center px-[13px] text-white mt-2">Environmental
management system</p>
</div>
<div class="w-[160px] md:w-[200px] 2xl:w-[231px] px-2 m-auto">
<div class="w-[150px] h-[150px] md:w-[170px] md:h-[170px] m-auto">
<img src="../public/iso9001.png" alt="" srcset="">
</div>
<p class="font-semibold text-[14px] md:text-[17px] text-center px-[13px] text-white mt-2">Quality Management System</p>
</div>
<div class="w-[160px] md:w-[200px] 2xl:w-[231px] px-2 m-auto">
<div class="w-[150px] h-[150px] md:w-[170px] md:h-[170px] m-auto">
<img src="../public/ohsas.png" alt="" srcset="">
</div>
<p class="font-semibold text-[14px] md:text-[17px] text-center px-[13px] text-white mt-2">Occupational Health and Safety Assessment Series</p>
</div>
<div class="w-[160px] md:w-[200px] 2xl:w-[231px] px-2 m-auto">
<div class="w-[150px] h-[150px] md:w-[170px] md:h-[170px] m-auto">
<img src="../public/gmp_certificate.png" alt="" srcset="">
</div>
<p class="font-semibold text-[14px] md:text-[17px] text-center px-[13px] text-white mt-2">Good Manufacturing Practices</p>
</div>
<div class="w-[160px] md:w-[200px] 2xl:w-[231px] px-2 m-auto">
<div class="w-[150px] h-[150px] md:w-[170px] md:h-[170px] m-auto">
<img src="../public/haccp_certified.png" alt="" srcset="">
</div>
<p class="font-semibold text-[14px] md:text-[17px] text-center px-[13px] text-white mt-2">Hazard analysis critical control point</p>
</div>
</div>
</div>
</div>
</section>
<section class="w-full m-auto">
<div class="grid grid-cols-2 gap-3 px-7 lg:px-0">
<div class="divide-y xl:ps-[100px] col-span-2 lg:col-span-1">
<h1 class="text-[39px] font-medium pb-4 dm_sans">Latest News</h1>
<div class="">
<div class="h-[450px] overflow-y-scroll scroll-container newscontent">
<!-- Repeat other items here -->
</div>
</div>
</div>
<div class="relative col-span-2 lg:col-span-1 h-[601px] w-full">
<div class="swiper w-full h-[500px] mySwiper mySwiper2">
<div class="swiper-wrapper">
<div class="swiper-slide bg-slate-400 w-[320px] rounded-lg relative overflow-hidden">
<img src="../public/video/video1.png" class="absolute z-10 rounded-lg w-full">
<div class="absolute z-20 w-full bottom-0 h-full opacity-30 bg-black rounded-lg"></div>
<div class="absolute z-30 w-full bottom-0 h-full rounded-lg flex justify-center items-center">
<a class="w-[61.29px] h-[61.29px] border-2 rounded-full border-white
bg-white/20 backdrop-blur-md shadow-lg flex items-center justify-center"
href=""><i class="ri-play-large-fill text-3xl text-white"></i>
</a>
</div>
<div class="absolute z-40 w-full h-16 bottom-0">
<div class="h-12 overflow-hidden px-4 text-ellipsis ">
<p class="text-white overflow-hidden"> Lorem, ipsum dolor sit amet consectetur adipisicing elit. Consequuntur fuga vero iusto porro beatae tenetur corrupti, quasi, quae debitis, dolor itaque? Eos, nihil quibusdam quisquam accusamus doloribus ex totam magni?</p>
</div>
</div>
</div>
<div class="swiper-slide bg-slate-400 w-[320px] rounded-lg relative overflow-hidden">
<img src="../public/video/video2.png" class="absolute z-10 rounded-lg w-full">
<div class="absolute z-20 w-full bottom-0 h-full opacity-30 bg-black rounded-lg"></div>
<div class="absolute z-30 w-full bottom-0 h-full rounded-lg flex justify-center items-center">
<a class="w-[61.29px] h-[61.29px] border-2 rounded-full border-white
bg-white/20 backdrop-blur-md shadow-lg flex items-center justify-center"
href=""><i class="ri-play-large-fill text-3xl text-white"></i>
</a>
</div>
<div class="absolute z-40 w-full h-16 bottom-0">
<div class="h-12 overflow-hidden px-4 text-ellipsis ">
<p class="text-white overflow-hidden"> Lorem, ipsum dolor sit amet consectetur adipisicing elit. Consequuntur fuga vero iusto porro beatae tenetur corrupti, quasi, quae debitis, dolor itaque? Eos, nihil quibusdam quisquam accusamus doloribus ex totam magni?</p>
</div>
</div>
</div>
<div class="swiper-slide bg-slate-400 w-[320px] rounded-lg relative overflow-hidden">
<img src="../public/video/video1.png" class="absolute z-10 rounded-lg w-full">
<div class="absolute z-20 w-full bottom-0 h-full opacity-30 bg-black rounded-lg"></div>
<div class="absolute z-30 w-full bottom-0 h-full rounded-lg flex justify-center items-center">
<a class="w-[61.29px] h-[61.29px] border-2 rounded-full border-white
bg-white/20 backdrop-blur-md shadow-lg flex items-center justify-center"
href=""><i class="ri-play-large-fill text-3xl text-white"></i>
</a>
</div>
<div class="absolute z-40 w-full h-16 bottom-0">
<div class="h-12 overflow-hidden px-4 text-ellipsis ">
<p class="text-white overflow-hidden"> Lorem, ipsum dolor sit amet consectetur adipisicing elit. Consequuntur fuga vero iusto porro beatae tenetur corrupti, quasi, quae debitis, dolor itaque? Eos, nihil quibusdam quisquam accusamus doloribus ex totam magni?</p>
</div>
</div>
</div>
</div>
<div class="swiper-pagination z-5 -bottom-10"></div>
</div>
</div>
</div>
</section>
<section class="w-full m-auto my-7 px-2 lg:px-4 hidden">
<h5 class="text-xl sm:text-2xl md:text-3xl lg:text-[40px] lg:leading-[52px] font-dmSans max-w-[782px]">Comprehensive Solutions for Every Crop: From Cereals to Fruits and Vegetables</h5>
<div class="w-full my-7 lg:my-10 bg-white">
<div class="relative">
<div class="swiper mySwiper blogcontainer">
<div class="swiper-wrapper h-[500px] blogcontent">
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</section>
<section class="w-full m-auto my-7">
<h5 class="text-base font-semibold text-[#ED7D0B] text-center">3940+ Happy Customer</h5>
<h4 class="text-[40px] font-medium text-center mb-7">Don’t just take our words</h4>
<div class="relative">
<div id="demotestimonial" class="swiper " >
<div class="swiper-wrapper h-[350px] listtestimonial">
</div>
<div class="swiper-pagination "></div>
</div>
</div>
</section>
<section>
<div class="max-w-[768px] mx-auto p-6">
<div class="text-center px-5">
<h6 class="text-3xl md:text-[39px] mb-6">Lorem ipsum dolor</h6>
<p class="text-[#667085] text-xl">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quibusdam,
porro, qui ad sint possimus labore tempora id molestiae aliquam invent.
</p>
</div>
<!-- Responsive Flexbox for Stats -->
<div class="flex flex-col md:flex-row justify-evenly items-center my-8 space-y-8 md:space-y-0 md:space-x-8">
<!-- First Item -->
<div class="text-center">
<h6 class="text-[#ED7D0B] text-5xl md:text-6xl font-bold">40+</h6>
<span class="text-black text-base">Integrations</span>
</div>
<!-- Second Item -->
<div class="text-center">
<h6 class="text-[#ED7D0B] text-5xl md:text-6xl font-bold">50+</h6>
<span class="text-black text-base">Customers</span>
</div>
<!-- Third Item -->
<div class="text-center">
<h6 class="text-[#ED7D0B] text-5xl md:text-6xl font-bold">30+</h6>
<span class="text-black text-base">Projects</span>
</div>
</div>
</div>
</section>
<!-- WhatsApp Icon -->
<div id="myWhatsappButton" class="z-30"></div>
<footer class=" pt-16 px-8 md:px-16 2xl:lg:px-32 text-white" style="background-image:url('../public/footerbanner.webp') ; background-repeat: no-repeat; background-size: cover;">
<!-- Top Section -->
<div class="flex flex-col md:flex-row justify-between gap-10">
<!-- Contact Section -->
</div>
<!-- Divider -->
<!-- Middle Section -->
<div class="grid grid-cols-1 lg:grid-cols-11 gap-4 text-base">
<!-- Company Info and Logo -->
<div class="col-span-1 md:col-span-3">
<div class="w-36 aspect-video mb-4">
<img class="h-full w-full object-contain" src="../public/footerLogo.png" alt="Footer Logo" />
</div>
<p>
Kalyani Industries Ltd., established in 2000, is a leading manufacturer, exporter, and supplier of high-quality products.
</p>
<a class="font-semibold underline cursor-pointer">Read More...</a>
<!-- Social Media Icons -->
<div class="flex gap-4 mt-8 text-2xl">
<a href="#"><i class="ri-facebook-circle-fill"></i></a>
<a href="#"><i class="ri-instagram-fill"></i></a>
<a href="#"><i class="ri-linkedin-fill"></i></a>
<a href="#"><i class="ri-twitter-fill"></i></a>
</div>
</div>
<!-- Products Section -->
<div class="col-span-1 md:col-span-4">
<h6 class="mb-6 text-lg font-semibold">Our Products</h6>
<ul class="grid grid-cols-2 text-orange-200 text-base 2xl:text-lg gap-1 " id="footerlist">
</ul>
</div>
<!-- Column 2 -->
<div>
<h6 class="mb-6 text-lg font-semibold">Company</h6>
<ul class="space-y-2 text-orange-200 text-base 2xl:text-lg">
<li><a href="/view/business/kalyanigrow.html">Grow With Us</a></li>
<li><a href="/view/domistic_board.html">About us</a></li>
<li><a href="/view/contact.html">Contact us</a></li>
<!-- <li>Jobs</li>
<li>In Press</li> -->
</ul>
</div>
<div class="col-span-1 md:col-span-3">
<div class="flex font-dmSans gap-5 text-base max-w-[320px] ">
<i class="ri-mail-line text-lg"></i>
<div class="py-1" >
<h6 class="text-lg">Mail</h6>
<a href="mailto:info@kalyanilimited.com" class="text-sm">info@kalyanilimited.com</a>
</div>
</div>
<div class="flex gap-5 text-base max-w-[320px] py-1">
<span class="text-2xl"><i class="ri-phone-line"></i></span>
<div>
<h6 class="text-lg">tel</h6>
<a href="tel:912282215489" class="text-sm">+91 22-82215489</a><br />
<a href="tel:912261278127" class="text-sm">+91 22-61278127</a><br />
<a href="tel:912261278127" class="text-sm">+91 22-62381265</a><br />
<a href="tel:912267421923" class="text-sm">+91 22-67421923</a>
</div>
</div>
<!-- Mail Section -->
<!-- Address Section -->
<div class="flex gap-5 text-base max-w-[320px]">
<span class="text-2xl"><i class="ri-map-pin-line"></i></span>
<div>
<h6 class="text-lg" class="text-base">Address</h6>
<a href="" class="text-sm">
Corporate Office 1202-1204, B Wing, Kailash Business Park, Ghatkopar Powai Link Road, Vikhroli(W), Mumbai -400079.
</a>
</div>
</div>
</div>
</div>
<!-- Divider -->
<div class="my-4">
<hr class="border-t-2 border-white opacity-50" />
</div>
<!-- Bottom Section -->
<div class="flex flex-col md:flex-row justify-between text-sm pb-3">
<p>© 2007-2024 All Rights Reserved with Kalyani Industries Limited.</p>
<div class="flex gap-4 mt-4 md:mt-0">
<a href="#" class="underline">Privacy Policy</a>
<a href="#" class="underline">Terms of Use</a>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="floating-wpp.min.js"></script>
<script type="text/javascript" src="https://control.msg91.com/app/assets/widget/chat-widget.js"> </script>
<!-- <script type="text/javascript">
var helloConfig = {
widgetToken: "d1c73",
hide_launcher: false,
show_close_button: true,
launch_widget: false,
show_send_button: true,
};
initChatWidget(helloConfig, 500)
</script>
<script type="text/javascript">
$(function () {
$('#myWhatsappButton').floatingWhatsApp({
phone: '918268108343',
popupMessage: 'Thank you for contacting Kalyani Industries Limited. Please let us know how we can help you.🙏🤝',
message: "",
showPopup: true,
showOnIE: false,
headerTitle: 'Kalyani Industries Limited',
headerColor: 'rgba(237, 125, 11, 1)',
backgroundColor: '#25d366',
buttonImage: '<img src="../public/whatapp.jfif" style="width:40px;"/>'
});
});
</script> -->
<!-- Include jQuery -->
<script>
$(document).ready(function () {
let $scrollContainer = $(".scroll-container"); // Target scrolling div
let scrollSpeed = 50; // Adjust scrolling speed (lower = faster)
let scrollInterval;
let isPaused = false;
function startScrolling() {
scrollInterval = setInterval(function () {
if (!isPaused) {
let maxScroll = $scrollContainer[0].scrollHeight - $scrollContainer.height();
if ($scrollContainer.scrollTop() >= maxScroll) {
$scrollContainer.scrollTop(0); // Reset scroll to the top
} else {
$scrollContainer.scrollTop($scrollContainer.scrollTop() + 1);
}
}
}, scrollSpeed);
}
startScrolling(); // Start scrolling when page loads
// Pause scrolling on hover
$scrollContainer.hover(
function () {
isPaused = true;
},
function () {
isPaused = false;
}
);
});
</script>
<script src="../src/assests/js/scripts.js"></script>
<script src="../src/assests/js/api.js"></script>
</body>
</html>