File: /home/durgeshpandey215/public_html/ipsol.skilladders.com/placement.php
<?php
require_once 'controller/security_headers.php';
require_once 'controller/DB_Config.php';
$con = OpenCon();
function show_option_course($con){
$courses = "";
$sql = "SELECT * FROM `courses` WHERE `parent_course_id` IS NULL AND delete_status = 'N' ORDER BY `sort_order` ASC";
$result = mysqli_query($con, $sql);
while($row = mysqli_fetch_assoc($result)){
$courses .= "<option value='".$row['id']."'>" .$row['name']."</option>";
}
return $courses;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Placement Cell - IP Solutions</title>
<!-- Tailwind CSS -->
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
brand: {
blue: '#2957A4',
dark: '#0B0F19',
light: '#F5F5F5',
}
},
fontFamily: {
sans: ['Inter', 'sans-serif'],
heading: ['Outfit', 'sans-serif'],
},
animation: {
'blob': 'blob 7s infinite',
'scroll': 'scroll 40s linear infinite',
},
keyframes: {
blob: {
'0%': { transform: 'translate(0px, 0px) scale(1)' },
'33%': { transform: 'translate(30px, -50px) scale(1.1)' },
'66%': { transform: 'translate(-20px, 20px) scale(0.9)' },
'100%': { transform: 'translate(0px, 0px) scale(1)' },
},
scroll: {
'0%': { transform: 'translateX(0)' },
'100%': { transform: 'translateX(-50%)' },
}
}
}
}
}
</script>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body { font-family: 'Inter', sans-serif; }
h1, h2, h3, h4 { font-family: 'Outfit', sans-serif; }
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.glass-card {
background: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(12px);
border: 1px solid rgba(255, 255, 255, 0.5);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
</style>
</head>
<body class="bg-white text-slate-800 antialiased font-sans">
<?php include 'header_v2.php'; ?>
<!-- 1. Technical Hero Section (Matches Index) -->
<div class="relative bg-[#0B0F19] overflow-hidden pt-28 pb-16 md:pt-32 md:pb-40">
<!-- Background: Photo & Spotlights -->
<div class="absolute inset-0 pointer-events-none">
<img src="img/hero/IMG_20260201_123354.jpg.jpeg" class="absolute inset-0 w-full h-full object-cover opacity-40">
<div class="absolute inset-0 bg-[#0B0F19]/60 mix-blend-multiply"></div>
<div class="absolute inset-0 bg-gradient-to-t from-[#0B0F19] via-[#0B0F19]/80 to-transparent"></div>
</div>
<div class="max-w-[1200px] mx-auto px-4 relative z-10 text-center">
<div class="inline-flex items-center justify-center p-1 rounded-full bg-white/5 border border-white/10 backdrop-blur-sm mb-8 animate-fade-in-up">
<span class="px-4 py-1.5 rounded-full bg-brand-blue text-white text-xs font-bold uppercase tracking-wider shadow-lg shadow-blue-500/20">New Batch</span>
<span class="px-4 py-1.5 text-blue-100 text-xs font-medium">100% Placement Assistance Guarantee</span>
</div>
<h1 class="text-4xl md:text-5xl lg:text-7xl font-bold text-white mb-8 tracking-tight leading-[1.1]">
Your Future.<br>
<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-400 via-white to-blue-400">Our Commitment.</span>
</h1>
<p class="text-xl text-slate-400 max-w-2xl mx-auto leading-relaxed mb-12 font-light">
Join 5000+ students who transformed their careers with IP Solutions. We don't just train you; we bridge the gap between talent and opportunity.
</p>
<div class="flex flex-col sm:flex-row items-center justify-center gap-4">
<a href="#enquire" class="min-w-[180px] px-8 py-4 bg-brand-blue text-white font-bold rounded-xl shadow-lg hover:shadow-blue-500/30 hover:bg-blue-600 transition transform hover:-translate-y-1">
Start Now
</a>
<a href="#process" class="min-w-[180px] px-8 py-4 bg-transparent border border-gray-700 text-white font-bold rounded-xl hover:bg-white/5 transition backdrop-blur-sm">
How It Works
</a>
</div>
</div>
</div>
<!-- 2. Floating Stats (Matches Index Style) -->
<div class="max-w-[1100px] mx-auto px-4 -mt-12 md:-mt-24 relative z-20 mb-12 md:mb-24">
<div class="relative bg-gradient-to-r from-[#2957A4] to-blue-800 rounded-3xl p-6 md:p-10 shadow-2xl overflow-hidden isolate border border-white/10">
<!-- Decorative -->
<div class="absolute top-0 right-0 -mr-20 -mt-20 w-80 h-80 bg-blue-400 rounded-full mix-blend-overlay filter blur-[100px] opacity-30"></div>
<div class="grid grid-cols-2 md:grid-cols-4 gap-6 md:gap-8 divide-x divide-white/10">
<div class="text-center group">
<div class="text-white/80 mb-2 text-3xl group-hover:scale-110 transition-transform"><i class="fa fa-users"></i></div>
<div class="text-3xl font-bold text-white">5000+</div>
<div class="text-[11px] text-blue-200 font-bold uppercase tracking-widest mt-1">Students Placed</div>
</div>
<div class="text-center group">
<div class="text-white/80 mb-2 text-3xl group-hover:scale-110 transition-transform"><i class="fa fa-handshake-o"></i></div>
<div class="text-3xl font-bold text-white">500+</div>
<div class="text-[11px] text-blue-200 font-bold uppercase tracking-widest mt-1">Recruiters</div>
</div>
<div class="text-center group">
<div class="text-white/80 mb-2 text-3xl group-hover:scale-110 transition-transform"><i class="fa fa-globe"></i></div>
<div class="text-3xl font-bold text-white">PAN India</div>
<div class="text-[11px] text-blue-200 font-bold uppercase tracking-widest mt-1">Placement</div>
</div>
<div class="text-center group">
<div class="text-white/80 mb-2 text-3xl group-hover:scale-110 transition-transform"><i class="fa fa-star"></i></div>
<div class="text-3xl font-bold text-white">100%</div>
<div class="text-[11px] text-blue-200 font-bold uppercase tracking-widest mt-1">Assistance</div>
</div>
</div>
</div>
</div>
<!-- 3. Why Choose Us -->
<div class="py-10 md:py-20 bg-white">
<div class="max-w-[1200px] mx-auto px-4">
<div class="text-center mb-8 md:mb-16">
<span class="text-brand-blue font-bold tracking-widest uppercase text-xs mb-2 block">The IP Solutions Advantage</span>
<h2 class="text-3xl md:text-5xl font-bold text-slate-900 tracking-tight">More Than Just a Job Portal</h2>
<div class="w-20 h-1 bg-gradient-to-r from-brand-blue to-cyan-400 mx-auto mt-6 rounded-full"></div>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<!-- Feature 1 -->
<div class="bg-gray-50 rounded-3xl p-8 border border-gray-100 hover:border-brand-blue/30 hover:bg-white hover:shadow-xl hover:shadow-blue-900/5 transition-all group duration-300">
<div class="w-16 h-16 bg-white rounded-2xl shadow-sm flex items-center justify-center text-brand-blue text-2xl mb-8 group-hover:scale-110 transition-transform border border-slate-100 group-hover:bg-blue-600 group-hover:text-white">
<i class="fa fa-file-text-o"></i>
</div>
<h3 class="font-bold text-2xl text-slate-900 mb-4">Resume Building</h3>
<p class="text-slate-500 leading-relaxed">We craft professional, industry-standard resumes that highlight your certifications and lab skills to pass HR screening systems.</p>
</div>
<!-- Feature 2 -->
<div class="bg-gray-50 rounded-3xl p-8 border border-gray-100 hover:border-brand-blue/30 hover:bg-white hover:shadow-xl hover:shadow-blue-900/5 transition-all group duration-300">
<div class="w-16 h-16 bg-white rounded-2xl shadow-sm flex items-center justify-center text-brand-blue text-2xl mb-8 group-hover:scale-110 transition-transform border border-slate-100 group-hover:bg-blue-600 group-hover:text-white">
<i class="fa fa-microphone"></i>
</div>
<h3 class="font-bold text-2xl text-slate-900 mb-4">Mock Interviews</h3>
<p class="text-slate-500 leading-relaxed">Practice with technical experts. We simulate real interview scenarios to boost your confidence and refine your answers.</p>
</div>
<!-- Feature 3 -->
<div class="bg-gray-50 rounded-3xl p-8 border border-gray-100 hover:border-brand-blue/30 hover:bg-white hover:shadow-xl hover:shadow-blue-900/5 transition-all group duration-300">
<div class="w-16 h-16 bg-white rounded-2xl shadow-sm flex items-center justify-center text-brand-blue text-2xl mb-8 group-hover:scale-110 transition-transform border border-slate-100 group-hover:bg-blue-600 group-hover:text-white">
<i class="fa fa-link"></i>
</div>
<h3 class="font-bold text-2xl text-slate-900 mb-4">Direct Referrals</h3>
<p class="text-slate-500 leading-relaxed">Skip the queue. We send your profile directly to Hiring Managers in our partner network, ensuring faster feedback.</p>
</div>
</div>
</div>
</div>
<!-- 4. Process Roadmap (Dark Theme like Index Hero/Footer) -->
<div id="process" class="py-12 md:py-24 bg-[#0B0F19] relative overflow-hidden">
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-5"></div>
<div class="absolute top-0 left-0 w-full h-px bg-gradient-to-r from-transparent via-blue-500/50 to-transparent"></div>
<div class="max-w-[1200px] mx-auto px-4 relative z-10">
<div class="flex flex-col md:flex-row justify-between items-start md:items-end mb-12 md:mb-20 gap-6">
<div>
<span class="text-blue-500 font-bold tracking-widest uppercase text-xs mb-2 block">Step-by-Step</span>
<h2 class="text-3xl md:text-5xl font-bold text-white mt-2">Your Roadmap to Hired</h2>
</div>
<!-- Button -->
<a href="#enquire" class="inline-flex items-center justify-center px-8 py-3 rounded-full border border-blue-500/30 text-blue-300 text-sm font-bold hover:bg-blue-600 hover:text-white hover:border-blue-600 transition w-full md:w-auto">Start Application</a>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-8 md:gap-12 relative px-2 md:px-0">
<!-- Connector Line (Desktop Horizontal) -->
<div class="hidden md:block absolute top-[28px] left-0 w-full h-0.5 bg-gray-800 z-0"></div>
<!-- Connector Line (Mobile Vertical) -->
<div class="md:hidden absolute top-0 bottom-8 left-[35px] w-0.5 bg-gray-800 z-0 transform -translate-x-1/2"></div>
<!-- Step 1 -->
<div class="relative group z-10 flex md:block gap-6 md:gap-0">
<div class="shrink-0 w-14 h-14 bg-gray-900 border-2 border-gray-700 text-gray-500 rounded-full flex items-center justify-center font-bold text-xl mb-0 md:mb-6 group-hover:border-blue-500 group-hover:text-blue-500 transition-colors bg-[#0B0F19]">01</div>
<div class="pt-1 md:pt-0">
<h3 class="text-xl font-bold mb-2 md:mb-3 text-white">Train & Certify</h3>
<p class="text-slate-400 text-sm leading-relaxed">Complete your course modules and lab exams with >75% score.</p>
</div>
</div>
<!-- Step 2 -->
<div class="relative group z-10 flex md:block gap-6 md:gap-0">
<div class="shrink-0 w-14 h-14 bg-gray-900 border-2 border-gray-700 text-gray-500 rounded-full flex items-center justify-center font-bold text-xl mb-0 md:mb-6 group-hover:border-blue-500 group-hover:text-blue-500 transition-colors bg-[#0B0F19]">02</div>
<div class="pt-1 md:pt-0">
<h3 class="text-xl font-bold mb-2 md:mb-3 text-white">Apply</h3>
<p class="text-slate-400 text-sm leading-relaxed">Submit your CV to our placement cell for initial screening.</p>
</div>
</div>
<!-- Step 3 -->
<div class="relative group z-10 flex md:block gap-6 md:gap-0">
<div class="shrink-0 w-14 h-14 bg-gray-900 border-2 border-gray-700 text-gray-500 rounded-full flex items-center justify-center font-bold text-xl mb-0 md:mb-6 group-hover:border-blue-500 group-hover:text-blue-500 transition-colors bg-[#0B0F19]">03</div>
<div class="pt-1 md:pt-0">
<h3 class="text-xl font-bold mb-2 md:mb-3 text-white">Assess</h3>
<p class="text-slate-400 text-sm leading-relaxed">Clear the technical aptitude test and mock interview rounds.</p>
</div>
</div>
<!-- Step 4 -->
<div class="relative group z-10 flex md:block gap-6 md:gap-0">
<div class="shrink-0 w-14 h-14 bg-gray-900 border-2 border-emerald-500/50 text-emerald-500 rounded-full flex items-center justify-center font-bold text-xl mb-0 md:mb-6 shadow-[0_0_20px_rgba(16,185,129,0.3)] bg-[#0B0F19]">04</div>
<div class="pt-1 md:pt-0">
<h3 class="text-xl font-bold mb-2 md:mb-3 text-emerald-400">Get Placed</h3>
<p class="text-slate-400 text-sm leading-relaxed">Interview with top companies until you secure your offer letter.</p>
</div>
</div>
</div>
</div>
</div>
<!-- 5. Success Stories with Recruiting Partners -->
<div id="success-stories" class="py-12 md:py-24 bg-slate-50 border-t border-slate-200">
<div class="max-w-[1400px] mx-auto px-4">
<div class="text-center mb-8 md:mb-16">
<h2 class="text-3xl md:text-5xl font-bold text-slate-900 mb-4">Hall of Fame</h2>
<p class="text-slate-500 text-lg">Joining top companies across the globe. Will you be next?</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 lg:grid-cols-5 gap-6 mb-10 md:mb-20">
<?php
$sql1 = "SELECT * FROM `img_stud_placement` LIMIT 10";
$result1 = mysqli_query($con, $sql1);
if ($result1):
while($row1 = mysqli_fetch_assoc($result1)):
?>
<div class="bg-white rounded-2xl p-6 text-center shadow-sm hover:shadow-xl transition-all duration-300 hover:-translate-y-2 border border-slate-100 group">
<div class="w-24 h-24 mx-auto rounded-full border-4 border-slate-50 overflow-hidden mb-4 group-hover:border-brand-blue transition-colors shadow-inner">
<img src="img/stud_placement/<?= $row1['img_name']?>" class="w-full h-full object-cover">
</div>
<h4 class="font-bold text-slate-900 text-base truncate mb-1"><?= $row1['stud_name']?></h4>
<p class="text-xs font-bold text-brand-blue truncate bg-blue-50 py-1 px-3 rounded-full inline-block"><?= $row1['company_name']?></p>
</div>
<?php endwhile; endif; ?>
</div>
<!-- Partners Slider (Reusing logic from Index, streamlined) -->
<div class="bg-white rounded-3xl p-10 border border-slate-200 shadow-xl overflow-hidden relative">
<div class="text-center mb-8">
<span class="text-xs font-bold text-slate-400 uppercase tracking-widest">Our Trusted Hiring Partners</span>
</div>
<!-- Use CSS Animation for smoother infinite scroll without JS complexity -->
<div class="logo-scroller overflow-hidden relative w-full">
<div class="flex animate-scroll w-max gap-16 items-center">
<?php
$sql2 = "SELECT * FROM `img_placement`";
$result2 = mysqli_query($con,$sql2);
$logos = [];
if($result2) {
while($r = mysqli_fetch_assoc($result2)) { $logos[] = $r; }
}
// Triple duplication for longer scroll
foreach(array_merge($logos, $logos, $logos) as $row2):
?>
<div class="w-48 opacity-90 hover:opacity-100 transition-all duration-300 hover:scale-110 flex items-center justify-center px-4">
<img src="img/placement/<?= $row2['img_name']?>" class="max-h-16 w-auto object-contain">
</div>
<?php endforeach; ?>
</div>
</div>
<!-- Gradients to hide edges -->
<div class="absolute top-0 left-0 w-32 h-full bg-gradient-to-r from-white to-transparent pointer-events-none"></div>
<div class="absolute top-0 right-0 w-32 h-full bg-gradient-to-l from-white to-transparent pointer-events-none"></div>
</div>
</div>
</div>
<!-- 6. Form & FAQ -->
<div id="enquire" class="py-12 md:py-24 bg-white relative">
<div class="max-w-[1200px] mx-auto px-4">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-start">
<!-- FAQ Accordion -->
<div class="order-2 lg:order-1">
<h3 class="text-3xl font-bold text-slate-900 mb-8">Frequently Asked Questions</h3>
<div class="space-y-4">
<details class="group bg-slate-50 rounded-2xl p-6 cursor-pointer border border-transparent hover:border-slate-200 hover:bg-white hover:shadow-md transition-all">
<summary class="font-bold text-slate-800 flex justify-between items-center text-lg list-none">
<span>Guaranteed Placement?</span>
<span class="bg-slate-200 rounded-full w-8 h-8 flex items-center justify-center text-slate-500 group-open:rotate-180 transition-transform"><i class="fa fa-chevron-down text-xs"></i></span>
</summary>
<div class="text-slate-500 mt-4 leading-relaxed pl-1 border-l-2 border-brand-blue ml-1">
We provide 100% assistance. Final selection depends on your technical clearance and interview performance.
</div>
</details>
<details class="group bg-slate-50 rounded-2xl p-6 cursor-pointer border border-transparent hover:border-slate-200 hover:bg-white hover:shadow-md transition-all">
<summary class="font-bold text-slate-800 flex justify-between items-center text-lg list-none">
<span>PAN India Support?</span>
<span class="bg-slate-200 rounded-full w-8 h-8 flex items-center justify-center text-slate-500 group-open:rotate-180 transition-transform"><i class="fa fa-chevron-down text-xs"></i></span>
</summary>
<div class="text-slate-500 mt-4 leading-relaxed pl-1 border-l-2 border-brand-blue ml-1">
Yes, we have partners in Mumbai, Pune, Bangalore, Delhi and major IT hubs.
</div>
</details>
<details class="group bg-slate-50 rounded-2xl p-6 cursor-pointer border border-transparent hover:border-slate-200 hover:bg-white hover:shadow-md transition-all">
<summary class="font-bold text-slate-800 flex justify-between items-center text-lg list-none">
<span>Eligibility?</span>
<span class="bg-slate-200 rounded-full w-8 h-8 flex items-center justify-center text-slate-500 group-open:rotate-180 transition-transform"><i class="fa fa-chevron-down text-xs"></i></span>
</summary>
<div class="text-slate-500 mt-4 leading-relaxed pl-1 border-l-2 border-brand-blue ml-1">
Course completion + Internal Assessment clearance is mandatory.
</div>
</details>
</div>
</div>
<!-- Main Form -->
<div class="order-1 lg:order-2">
<div class="bg-white p-8 md:p-10 rounded-[2.5rem] shadow-2xl shadow-blue-900/10 border border-slate-100 relative overflow-hidden">
<div class="absolute top-0 right-0 w-32 h-32 bg-brand-blue/5 rounded-bl-full -mr-8 -mt-8"></div>
<div class="relative z-10">
<div class="mb-8">
<h3 class="text-3xl font-bold text-slate-900">Start Your Journey</h3>
<p class="text-slate-500 mt-2">Fill the form below to register for placement.</p>
</div>
<form action="controller/contact_form.php" method="post" name="form1" onsubmit="return phonenumber(document.form1.number)" class="space-y-5">
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
<div>
<label class="block text-xs font-bold uppercase text-slate-400 mb-2">Name</label>
<input type="text" name="name" class="w-full bg-slate-50 border border-slate-200 rounded-xl px-4 py-3.5 text-sm focus:bg-white focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition" placeholder="John Doe" required>
</div>
<div>
<label class="block text-xs font-bold uppercase text-slate-400 mb-2">Phone</label>
<input type="text" name="number" class="w-full bg-slate-50 border border-slate-200 rounded-xl px-4 py-3.5 text-sm focus:bg-white focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition" placeholder="9820..." required>
</div>
</div>
<div>
<label class="block text-xs font-bold uppercase text-slate-400 mb-2">Email</label>
<input type="email" name="email" class="w-full bg-slate-50 border border-slate-200 rounded-xl px-4 py-3.5 text-sm focus:bg-white focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition" placeholder="john@example.com" required>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
<div>
<label class="block text-xs font-bold uppercase text-slate-400 mb-2">State</label>
<select name="state" class="w-full bg-slate-50 border border-slate-200 rounded-xl px-4 py-3.5 text-sm focus:bg-white focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition" required>
<option value="">Select State</option>
<option value="Andhra Pradesh">Andhra Pradesh</option>
<option value="Arunachal Pradesh">Arunachal Pradesh</option>
<option value="Assam">Assam</option>
<option value="Bihar">Bihar</option>
<option value="Chhattisgarh">Chhattisgarh</option>
<option value="Goa">Goa</option>
<option value="Gujarat">Gujarat</option>
<option value="Haryana">Haryana</option>
<option value="Himachal Pradesh">Himachal Pradesh</option>
<option value="Jharkhand">Jharkhand</option>
<option value="Karnataka">Karnataka</option>
<option value="Kerala">Kerala</option>
<option value="Madhya Pradesh">Madhya Pradesh</option>
<option value="Maharashtra">Maharashtra</option>
<option value="Manipur">Manipur</option>
<option value="Meghalaya">Meghalaya</option>
<option value="Mizoram">Mizoram</option>
<option value="Nagaland">Nagaland</option>
<option value="Odisha">Odisha</option>
<option value="Punjab">Punjab</option>
<option value="Rajasthan">Rajasthan</option>
<option value="Sikkim">Sikkim</option>
<option value="Tamil Nadu">Tamil Nadu</option>
<option value="Telangana">Telangana</option>
<option value="Tripura">Tripura</option>
<option value="Uttar Pradesh">Uttar Pradesh</option>
<option value="Uttarakhand">Uttarakhand</option>
<option value="West Bengal">West Bengal</option>
<option value="Andaman and Nicobar Islands">Andaman and Nicobar Islands</option>
<option value="Chandigarh">Chandigarh</option>
<option value="Dadra and Nagar Haveli">Dadra and Nagar Haveli</option>
<option value="Daman and Diu">Daman and Diu</option>
<option value="Delhi">Delhi</option>
<option value="Lakshadweep">Lakshadweep</option>
<option value="Puducherry">Puducherry</option>
<option value="Other">Other</option>
</select>
</div>
<div>
<label class="block text-xs font-bold uppercase text-slate-400 mb-2">Course</label>
<select name="course_id" class="w-full bg-slate-50 border border-slate-200 rounded-xl px-4 py-3.5 text-sm focus:bg-white focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition" required>
<option value="">Select</option>
<?= show_option_course($con)?>
</select>
</div>
</div>
<div>
<label class="block text-xs font-bold uppercase text-slate-400 mb-2">Message</label>
<textarea name="message" class="w-full bg-slate-50 border border-slate-200 rounded-xl px-4 py-3.5 text-sm focus:bg-white focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition resize-none" rows="3"></textarea>
</div>
<button type="submit" name="submit" class="w-full py-4 bg-brand-blue text-white font-bold rounded-xl hover:bg-blue-700 transition shadow-xl shadow-blue-500/20 transform hover:-translate-y-1">Submit Application</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<?php include 'footer_v2.php'; ?>
<script>
function phonenumber(inputtxt) {
var phoneno = /^([0|\+[0-9]{9,12})$/;
if(inputtxt.value.match(phoneno)) {
alert("Thank Your Form has been submitted !!!");
return true;
} else {
alert("Please enter a valid phone number");
return false;
}
}
</script>
</body>
</html>