File: /home/durgeshpandey215/public_html/ipsol.skilladders.com/admission.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>Admission - 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',
yellow: '#FDCC0D'
}
},
fontFamily: {
sans: ['Inter', 'sans-serif'],
heading: ['Outfit', 'sans-serif'],
}
}
}
}
</script>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700;800&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; background-color: #ffffff;}
h1, h2, h3, h4 { font-family: 'Outfit', sans-serif; }
/* Modern Floating Input Stylings (Optional enhancement) */
.input-wrapper { position: relative; }
.input-icon {
position: absolute; left: 1.25rem; top: 50%; transform: translateY(-50%); color: #94a3b8; transition: color 0.3s; pointer-events: none;
}
.form-input {
padding-left: 3rem !important;
}
.form-input:focus + .input-icon, .form-input:focus-within + .input-icon { color: #2957A4; }
</style>
</head>
<body class="bg-white text-slate-800 antialiased font-sans">
<?php include 'header_v2.php'; ?>
<!-- Clean White Premium Container -->
<div class="relative min-h-screen bg-white overflow-hidden pt-10 pb-20">
<!-- Subtle Grid & Soft Glow Background (Matching New Hero Style) -->
<div class="absolute inset-0 bg-[url('img/grid.svg')] bg-center opacity-[0.4]" style="background-image: radial-gradient(#cbd5e1 1px, transparent 1px); background-size: 40px 40px; z-index: 0;"></div>
<div class="absolute top-0 right-0 w-[800px] h-[800px] bg-gradient-to-bl from-blue-50/80 to-transparent blur-[120px] rounded-full pointer-events-none -mr-40 -mt-20 z-0"></div>
<div class="absolute bottom-0 left-0 w-[600px] h-[600px] bg-gradient-to-tr from-indigo-50/80 to-transparent blur-[120px] rounded-full pointer-events-none -ml-40 -mb-20 z-0"></div>
<div class="max-w-[1240px] mx-auto px-4 sm:px-6 lg:px-8 relative z-10 w-full pt-8 lg:pt-16">
<div class="text-center max-w-3xl mx-auto mb-16">
<span class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-blue-50 border border-blue-100 text-brand-blue text-[12px] font-bold uppercase tracking-wider shadow-sm mb-6">
<span class="flex h-2 w-2 relative">
<span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-75"></span>
<span class="relative inline-flex rounded-full h-2 w-2 bg-blue-600"></span>
</span>
Admissions Open 2026
</span>
<h1 class="text-4xl md:text-5xl lg:text-6xl font-black text-slate-900 leading-[1.1] tracking-tight mb-6">
Begin Your <span class="text-transparent bg-clip-text bg-gradient-to-r from-brand-blue to-blue-500">Success Story</span>
</h1>
<p class="text-lg text-slate-600 leading-relaxed font-medium">
Secure your spot in India's premier IT networking institute. Fill out the application form below and our advisors will guide you through the next steps.
</p>
<!-- Simple Breadcrumb -->
<div class="flex items-center justify-center gap-2 text-sm font-medium text-slate-400 pt-6">
<a href="index.php" class="hover:text-brand-blue transition">Home</a>
<i class="fa fa-chevron-right text-[10px] text-slate-300"></i>
<span class="text-brand-blue">Application Details</span>
</div>
</div>
<!-- Form & Contact Flex Container -->
<div class="flex flex-col lg:flex-row gap-8 lg:gap-12 max-w-6xl mx-auto">
<!-- Main Form Column -->
<div class="w-full lg:w-2/3">
<div class="bg-white rounded-[2rem] p-8 md:p-12 shadow-[0_8px_30px_rgb(0,0,0,0.04)] border border-slate-100 relative">
<div class="flex items-center gap-4 mb-8 pb-8 border-b border-slate-100">
<div class="w-12 h-12 rounded-full bg-blue-50 flex items-center justify-center text-brand-blue text-xl">
<i class="fa fa-file-text-o"></i>
</div>
<div>
<h3 class="text-2xl font-bold text-slate-900">Application Form</h3>
<p class="text-slate-500 text-sm mt-1">Please provide accurate information for quick processing.</p>
</div>
</div>
<form action="controller/admission_form.php" method="post" name="form1" onSubmit="return phonenumber(document.form1.number)">
<div class="grid md:grid-cols-2 gap-6 lg:gap-8 mb-6">
<!-- Full Name -->
<div>
<label class="block text-xs font-bold uppercase tracking-wider text-slate-400 mb-2 ml-1">Full Name *</label>
<div class="input-wrapper">
<input type="text" name="name" class="form-input w-full bg-white border-2 border-slate-100 rounded-xl py-3.5 pr-4 text-[15px] focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition-all font-medium text-slate-700 placeholder-slate-400 shadow-sm" placeholder="John Doe" required>
<i class="fa fa-user input-icon"></i>
</div>
</div>
<!-- Email Address -->
<div>
<label class="block text-xs font-bold uppercase tracking-wider text-slate-400 mb-2 ml-1">Email Address *</label>
<div class="input-wrapper">
<input type="email" name="email" class="form-input w-full bg-white border-2 border-slate-100 rounded-xl py-3.5 pr-4 text-[15px] focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition-all font-medium text-slate-700 placeholder-slate-400 shadow-sm" placeholder="john@example.com" required>
<i class="fa fa-envelope input-icon"></i>
</div>
</div>
</div>
<div class="grid md:grid-cols-2 gap-6 lg:gap-8 mb-6">
<!-- Phone Number -->
<div>
<label class="block text-xs font-bold uppercase tracking-wider text-slate-400 mb-2 ml-1">Phone Number *</label>
<div class="relative flex items-center">
<div class="absolute left-0 top-0 bottom-0 w-14 bg-slate-50 border-r-2 border-slate-100 flex items-center justify-center text-slate-500 font-bold text-sm rounded-l-xl z-10">
+91
</div>
<input type="text" name="number" class="w-full bg-white border-2 border-slate-100 rounded-xl py-3.5 pl-16 pr-4 text-[15px] focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition-all font-medium text-slate-700 placeholder-slate-400 shadow-sm relative z-0" placeholder="98XXXXXXXX" required>
</div>
</div>
<!-- State -->
<div>
<label class="block text-xs font-bold uppercase tracking-wider text-slate-400 mb-2 ml-1">State / Region *</label>
<div class="input-wrapper">
<select name="state" class="form-input w-full bg-white border-2 border-slate-100 rounded-xl py-3.5 pr-10 text-[15px] focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition-all appearance-none cursor-pointer text-slate-700 font-medium shadow-sm" 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="Jammu and Kashmir">Jammu and Kashmir</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>
</select>
<i class="fa fa-map-marker input-icon"></i>
<i class="fa fa-chevron-down absolute right-4 top-1/2 -translate-y-1/2 text-xs text-slate-400 pointer-events-none"></i>
</div>
</div>
</div>
<div class="mb-6">
<!-- Course Selection -->
<div>
<label class="block text-xs font-bold uppercase tracking-wider text-slate-400 mb-2 ml-1">Program of Interest *</label>
<div class="input-wrapper">
<select name="course_id" class="form-input w-full bg-white border-2 border-slate-100 rounded-xl py-3.5 pr-10 text-[15px] focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition-all appearance-none cursor-pointer text-slate-700 font-medium shadow-sm" required>
<option value="">Select a Certification or Course</option>
<?= show_option_course($con)?>
</select>
<i class="fa fa-graduation-cap input-icon"></i>
<i class="fa fa-chevron-down absolute right-4 top-1/2 -translate-y-1/2 text-xs text-slate-400 pointer-events-none"></i>
</div>
</div>
</div>
<div class="mb-8">
<label class="block text-xs font-bold uppercase tracking-wider text-slate-400 mb-2 ml-1">Additional Message (Optional)</label>
<textarea name="message" class="w-full bg-white border-2 border-slate-100 rounded-xl p-4 text-[15px] focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 outline-none transition-all resize-none font-medium text-slate-700 placeholder-slate-400 shadow-sm" rows="3" placeholder="Any specific queries about schedule, fees, or prerequisites?"></textarea>
</div>
<!-- Hidden Honeypot/Spam check -->
<input type="text" name="special_note" class="hidden">
<!-- ReCaptcha Integration
<div class="g-recaptcha mb-6 scale-95 origin-left" data-sitekey="YOUR_SITE_KEY"></div>
-->
<button type="submit" name="submit" class="w-full flex items-center justify-center gap-3 py-4 bg-[#2957A4] hover:bg-blue-800 text-white font-bold rounded-xl shadow-lg shadow-blue-900/10 hover:-translate-y-1 hover:shadow-blue-900/20 transition-all duration-300 text-lg">
Submit Formal Application
<i class="fa fa-paper-plane text-sm"></i>
</button>
</form>
</div>
</div>
<!-- Right Sidebar Details -->
<div class="w-full lg:w-1/3 flex flex-col gap-6">
<!-- Quick Info Card -->
<div class="bg-slate-50 rounded-3xl p-8 border border-slate-100 text-center relative overflow-hidden group">
<!-- BG elements -->
<div class="absolute top-0 right-0 w-32 h-32 bg-blue-100 rounded-full blur-2xl -mr-10 -mt-10 transition-transform group-hover:scale-110"></div>
<div class="w-16 h-16 rounded-full bg-white border border-blue-100 flex items-center justify-center text-brand-blue text-2xl mx-auto shadow-sm mb-6 relative z-10 transition-transform group-hover:scale-110 duration-300">
<i class="fa fa-headphones"></i>
</div>
<h4 class="text-xl font-bold text-slate-900 mb-3 relative z-10">Need Immediate Help?</h4>
<p class="text-slate-600 font-medium mb-6 relative z-10">Speak directly to an admission counselor right now.</p>
<a href="tel:+919820193115" class="inline-flex flex-col items-center justify-center relative z-10 w-full py-4 bg-white border border-slate-200 rounded-xl hover:border-brand-blue hover:text-brand-blue transition-colors group/btn shadow-sm hover:shadow">
<span class="text-xs uppercase tracking-widest font-bold text-slate-400 group-hover/btn:text-brand-blue mb-1">Call Us Free</span>
<span class="text-lg font-black text-slate-800">+91 98201 93115</span>
</a>
</div>
<!-- Steps Card -->
<div class="bg-white rounded-3xl p-8 border border-slate-100 shadow-[0_4px_20px_rgb(0,0,0,0.02)]">
<h4 class="text-lg font-bold text-slate-900 mb-6 pb-4 border-b border-slate-50">Admission Process</h4>
<div class="space-y-6">
<div class="flex gap-4">
<div class="flex-shrink-0 w-8 h-8 rounded-full bg-blue-50 text-brand-blue flex items-center justify-center font-bold text-sm">1</div>
<div>
<h5 class="font-bold text-slate-800 text-[15px]">Submit Form</h5>
<p class="text-xs text-slate-500 mt-1 leading-relaxed">Fill out the official application securely.</p>
</div>
</div>
<div class="flex gap-4 relative">
<div class="absolute left-4 top-[-20px] bottom-[-10px] w-px bg-slate-100 -z-10"></div>
<div class="flex-shrink-0 w-8 h-8 rounded-full bg-slate-50 text-slate-500 border border-slate-200 flex items-center justify-center font-bold text-sm bg-white">2</div>
<div>
<h5 class="font-bold text-slate-800 text-[15px]">Counseling Call</h5>
<p class="text-xs text-slate-500 mt-1 leading-relaxed">Our experts will verify your goals & eligibility.</p>
</div>
</div>
<div class="flex gap-4 relative">
<div class="absolute left-4 top-[-20px] bottom-[-10px] w-px bg-slate-100 -z-10"></div>
<div class="flex-shrink-0 w-8 h-8 rounded-full bg-slate-50 text-slate-500 border border-slate-200 flex items-center justify-center font-bold text-sm bg-white">3</div>
<div>
<h5 class="font-bold text-slate-800 text-[15px]">Enrollment</h5>
<p class="text-xs text-slate-500 mt-1 leading-relaxed">Secure your seat & access your portal.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php include 'footer_v2.php'; ?>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script>
function phonenumber(inputtxt) {
var phoneno = /^(?:(?:\+|0{0,2})91(\s*[\-]\s*)?|[0]?)?[789]\d{9}$/;
if(inputtxt.value.match(phoneno)) {
return true;
} else {
alert("Please enter a valid Phone Number");
return false;
}
}
</script>
</body>
</html>