2026-05-28 09:02:57: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

    body {
        padding: 5px !important;
        background: #fff;
    }

    #filePage {
        width: 100%;
        border: 3px solid #000 !important;
        padding: 5px !important;
        box-sizing: border-box;
    }

    main {
        margin-top: 0 !important;
    }
}
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:03:37: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

    body {
        padding: 5px !important;
        background: #fff;
    }

    #filePage {
        width: 100%;
        border: 3px solid #000 !important;
        padding: 5px !important;
        box-sizing: border-box;
    }

    main {
        margin-top: 0 !important;
    }
}
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:03:49: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

    body {
        padding: 5px !important;
        background: #fff;
    }

    #filePage {
        width: 100%;
        border: 3px solid #000 !important;
        padding: 5px !important;
        box-sizing: border-box;
    }

    main {
        margin-top: 0 !important;
    }
}
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:03:49: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

    body {
        padding: 5px !important;
        background: #fff;
    }

    #filePage {
        width: 100%;
        border: 3px solid #000 !important;
        padding: 5px !important;
        box-sizing: border-box;
    }

    main {
        margin-top: 0 !important;
    }
}
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:04:31: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

    body {
        padding: 5px !important;
        background: #fff;
    }

    #filePage {
        width: 100%;
        border: 3px solid #000 !important;
        padding: 5px !important;
        box-sizing: border-box;
    }

    main {
        margin-top: 0 !important;
    }
}
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:05:03: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

    body {
        padding: 5px !important;
        background: #fff;
    }

    #filePage {
        width: 100%;
        border: 3px solid #000 !important;
        padding: 5px !important;
        box-sizing: border-box;
    }

    main {
        margin-top: 0 !important;
    }
}
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:05:48: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

        body {
            padding: 5px !important;
            background: #fff;
        }

        #filePage {
            width: 100%;
            border: 3px solid #000 !important;
            padding: 5px !important;
            box-sizing: border-box;
        }

        main {
            margin-top: 0 !important;
        }
    }
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;">
                                </li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Print Admission Form</b>                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"
                                style="font-variant-caps: all-petite-caps;font-weight: bolder;"><b>Add & View Print Admission Form</b>                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:06:20: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

        body {
            padding: 5px !important;
            background: #fff;
        }

        #filePage {
            width: 100%;
            border: 3px solid #000 !important;
            padding: 5px !important;
            box-sizing: border-box;
        }

        main {
            margin-top: 0 !important;
        }
    }
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
               
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:07:27: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

        body {
            padding: 5px !important;
            background: #fff;
        }

        #filePage {
            width: 100%;
            border: 3px solid #000 !important;
            padding: 5px !important;
            box-sizing: border-box;
        }

        main {
            margin-top: 0 !important;
        }
    }
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
               
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        2026-05-28 09:10:35: <style>
    #txt {
        border: none;
        background: white;
    }

    @media print {
        #top {

            /* margin: 0 !important; */
            /* margin: auto 0px !important; */
            /* margin-top: 60px !important; */
            /* margin-left: 0px !important; */
            /* border: 2px solid black; */
        }

        #hide {
            display: none;
        }

        #hide2 {
            display: none;
        }

        #header {
            display: none;

        }

        .app-header {
            display: none;
        }

        .header {
            display: none !important;
        }


        #welcome {
            display: none;
        }

        #imghide {
            display: none;
        }

        #printbutton {
            display: none;
        }

        #txt {
            border: none !important;
            background: white;
        }

        .table {
            border: 2px solid black;
            margin: none !important;
        }

        #body {
            font-size: 75%;
        }

        .btn {
            display: none;
        }
    }
</style>
<!-- Admin Default style end -->

<!-- Custom style by designer start -->
<style>
    @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Open+Sans:wght@400;500;600&family=Poiret+One&family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500&display=swap");


    * {
        font-family: "Montserrat", sans-serif;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    @media screen {
        .copy-display {
            display: none;
        }

        main {
            width: 800px;
            height: 100%;
            margin: 0 auto;
            border: 1px solid #999;
            padding: 1rem;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 10px 18px;
            color: #fff;
            background: #015198;
            border-radius: 5px;
            border: none;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .content h3 {
            font-weight: bold;
            color: #015198 !important;
            font-size: 15px;
            margin: 1rem 0 0.5rem !important;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 15px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }

        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.8rem;
        }
    }

    @media print {
        main {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            /* margin-top: -100px; */

            border: 3px solid #000 !important;
            padding: 15px !important;
            box-sizing: border-box;
        }

        .student-fee,
        .office-fee {
            background-color: #fff;
            padding: 0.3rem;
        }

        /* Start 30-11-2024 */
        .header-section {
            display: flex;
            justify-content: space-between;
            align-items: start;
            gap: 10px;
        }

        .header-section h1 {
            font-family: 'Poppins', sans-serif;
            font-size: 21px;
            font-weight: bold !important;
        }

        .header-section h2 {
            font-size: 19px;
            font-weight: bold;
        }

        .header-section h3 {
            font-size: 16px;
            font-weight: bold;
        }

        /* Top form section */
        .top-form-section td {
            text-align: left !important;
        }

        .top-form-section td:nth-child(1) {
            width: 200px;
        }

        .top-form-section td:nth-child(2) {
            width: auto;
        }

        .top-form-section td:nth-child(3) {
            width: 150px;
        }

        .top-form-section td:nth-child(4) {
            width: 200px;
        }



        /* End 30-11-2024 */

        .top-form button {
            padding: 5px 13px;
            color: #111;
            background: #f4f4f4;
            border-radius: 5px;
            border: 1px solid #999;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .content h3 {
            font-weight: bold;
            color: #000 !important;
            font-size: 15px;
        }

        select option {
            font-size: 1rem;
            font-weight: bold;
            color: #111;
        }

        .form-control {
            width: 150px;
            height: 30px;
            padding: 0px;
            margin: 0px;
            font-weight: bold;
            color: #111;
        }

        .grid-section {
            padding: 1rem 0;
            display: grid;
            gap: 0.1rem;
            grid-template-columns: 1fr 1fr;
            justify-content: space-between;
            align-items: center;
        }

        .grid-section-3 {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(3, 1fr);
            justify-content: space-between;
            align-items: center;
        }


        .medical-information {
            padding: 1rem 0;
            display: grid;
            gap: 5px;
            grid-template-columns: repeat(4, 1fr);
            justify-content: space-between;
            align-items: center;
        }

        .medical-information div {
            margin-bottom: 1rem;
        }

        .grid-section-3 div {
            display: flex;
            justify-content: start;
            align-items: center;
            gap: 3px;
        }

        .program-space {
            padding-top: 20px !important;
        }

        .program-section label,
        .additional-details ul li {
            font-family: 'Poppins', sans-serif;
            color: #000 !important;
            font-weight: 500;
        }

        .additional-details ul li {
            margin-bottom: 20px;
        }

        .personal-information label,
        .address-section label,
        .top-form label,
        .bottom-card-content label {
            font-weight: 600;
            font-size: 14px !important;
        }

        .spacing-second-page {
            padding-bottom: 116px;
        }

        table {
            font-family: arial, sans-serif;
            border-collapse: collapse !important;
            width: 100%;
            border-radius: 5px;
        }

        td,
        th {
            border: 1px solid #202020 !important;
            text-align: center !important;
            padding: 5px;
            height: 20px;
            font-size: 14px;
            font-weight: bold;

        }

        .list-terms li {
            font-size: 13px !important;
            font-weight: bold;
        }

        .ncc-section label,
        .medical-information label {
            font-weight: bold;
        }

        label {
            font-weight: bold;
            font-size: 15px !important;
        }


        input {
            outline: none;
            border: none;
            border-bottom: 1px dotted #333;
            font-size: 1rem;
            font-weight: bold;
        }

        .signature {
            display: flex;
            justify-content: space-between;
            margin-top: 2.3rem;
        }

        @page {
            size: A4;
            margin: 10mm;
        }
    }

    @media print {

        body {
            padding: 5px !important;
            background: #fff;
        }

        #filePage {
            width: 100%;
            border: 3px solid #000 !important;
            padding: 5px !important;
            box-sizing: border-box;
        }

        main {
            margin-top: 0 !important;
        }
    }
</style>




<style>
	.font {
		font-weight: bolder;
	}

	.hide {
		display: none !Important;
	}
</style>
<!DOCTYPE html>
<html lang="en">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<title>J.P. COLLEGE, NARAYANPUR</title>
	<!--favicon-->
	<link rel="icon" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/75215_vvr-favicon.png"
		type="image/png" />
	<!-- Vector CSS -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/vectormap/jquery-jvectormap-2.0.2.css" rel="stylesheet" />
	<!--plugins-->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/notifications/css/lobibox.min.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/simplebar/css/simplebar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2.min.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/select2/css/select2-bootstrap4.css?v=2" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/smart-wizard/css/smart_wizard_all.min.css" rel="stylesheet"
		type="text/css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet" />
	<!-- loader-->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/pace.min.css" rel="stylesheet" />
	<script src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/js/pace.min.js"></script>
	<!--Data Tables -->
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/datatable/css/dataTables.bootstrap4.min.css" rel="stylesheet"
		type="text/css">
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/bootstrap.min.css" />
	<link rel="stylesheet"
		href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&amp;family=Roboto&amp;display=swap" />
	<!-- Icons CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/icons.css" />
	<!-- App CSS -->
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/app.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-sidebar.css" />
	<link rel="stylesheet" href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/css/dark-theme.css" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link href="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/plugins/fullcalendar/css/main.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css"
		integrity="sha512-q3eWabyZPc1XTCmF+8/LuE1ozpg5xxn7iO89yfSOd5/oKvyqLngoNGsx8jq92Y8eXJ/IRxQbEC+FGSYxtk2oiw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/brands.min.css"
		integrity="sha512-sKhd1NGM4i4pJj+3P+NVHisu2z5rKAwNG1IpWMdKsFWYlUHFSrsAO3geQ5QNKttkMPZNTo76tfg8jVx2ICP7qw=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css"
		integrity="sha512-TPigxKHbPcJHJ7ZGgdi2mjdW9XHsQsnptwE+nOUWkoviYBn0rAAt0A5y3B1WGqIHrKFItdhZRteONANT07IipA=="
		crossorigin="anonymous" referrerpolicy="no-referrer" />
	<!-- Font Awesome cdn -->
	<script src="https://kit.fontawesome.com/daff0530f0.js" crossorigin="anonymous"></script>
	<style>
		.hide {
			display: none !important;
		}
	</style>
	<style>
		.submenu {
			display: none;
			/* hide by default */
			list-style: none;
			padding-left: 20px;
		}

		.menu-toggle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			cursor: pointer;
			text-decoration: none;
			color: #000;
		}

		.menu-toggle:hover {
			background: #f0f0f0;
		}

		.arrow i {
			transition: transform 0.3s;
		}

		.arrow.open i {
			transform: rotate(180deg);
		}
	</style>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const toggles = document.querySelectorAll('.menu-toggle');
			toggles.forEach(toggle => {
				toggle.addEventListener('click', function(e) {
					e.preventDefault();
					const submenu = this.nextElementSibling;
					if (!submenu) return;

					// Toggle submenu visibility
					if (submenu.style.display === "block") {
						submenu.style.display = "none";
						this.querySelector('.arrow').classList.remove('open');
					} else {
						submenu.style.display = "block";
						this.querySelector('.arrow').classList.add('open');
					}
				});
			});
		});
	</script>
</head>

<body onload="startTime()">
	<!-- wrapper -->
	<div class="wrapper " style="height: 0px;">
		<!--sidebar-wrapper-->
		<div class="sidebar-wrapper " data-simplebar="true">
			<div class="sidebar-header">
				<div class="">
					<img src="https://www.umis.live/JayPrakashCollege/jpumisportal/assets/images/login/47397_vvr-favicon.png"
						class="logo-icon-2" style="height:50px;width:50px;border-radius: 50%;">
				</div>
				<div>
					<h4 class="logo-text"
						style="font-variant-caps: all-petite-caps;font-size: 20px;font-weight: bolder;">
						JP College					</h4>
				</div>
				<a href="javascript:;" class="toggle-btn ms-auto"> <i class="bx bx-menu"></i>
				</a>
			</div>
			<!--navigation-->
			<ul class="metismenu sidebar-menu" id="menu">
				<li>
											<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student">
							<div class="parent-icon icon-color-1"><i class="bx bx-home-alt"></i>
							</div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Dashboard
							</div>
						</a>
									</li>

									
					<!-- Student Menu -->
					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-2"><i class='bx bxs-graduation'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Student
								Details</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/basic_info">
									<i class='bx bx-user-plus' style="color: darkblue;"></i>
									<span class="font">Personal Info</span>
								</a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/address_details">
									<i class='bx bx-map' style="color: darkblue;"></i>
									<span class="font">Address Info</span>
								</a>
							</li>
							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/guardian_details">
									<i class='bx bx-user' style="color: darkblue;"></i>
									<span class="font">Parents Info</span>
								</a>
							</li>
							<!-- <li>
								<a href="student_portal/Student_Admission_Student/choose_programme">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li> -->

							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/choose_programme_list">
									<i class='bx bx-book' style="color: darkblue;"></i>
									<span class="font">Course Info</span>
								</a>
							</li>


							<li>

								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/education_details"><i
										class='bx bxs-graduation' style="color: darkblue;"></i><span
										class="font text-success">Education</span></a>

							</li>







							<li>
								<a
									href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/upload_certificates">
									<i class='bx bx-file' style="color: darkblue;"></i>
									<span class="font">Upload Certificate</span>
								</a>
							</li>
						</ul>
					</li>

					<li>
						<a href="javascript:;" class="has-arrow">
							<div class="parent-icon icon-color-10"><i class='bx bx-money'></i></div>
							<div class="menu-title"
								style="font-variant-caps: all-petite-caps;font-weight: bolder;font-size: 17px;">Payment
								portal</div>
						</a>
						<ul>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/student_portal/Student_Admission_Student/paymentlist"><i
										class='bx bx-list-ul' style="color: darkblue;"></i><span
										class="font text-success">Online Payment</span></a>
							</li>
							<li>
								<a href="https://www.umis.live/JayPrakashCollege/jpumisportal/online_payment/Online_Payment"><i class='bx bx-list-ul'
										style="color: darkblue;"></i>Online Payment List</a>
							</li>
						</ul>
					</li>

							</ul>
			<!--end navigation-->
		</div>
		<!-- </div> -->
		<!--end sidebar-wrapper-->
		<!--header-->
		<header class="top-header">
			<nav class="navbar navbar-expand">
				<div class="left-topbar d-flex align-items-center">
					<a href="javascript:;" class="toggle-btn"> <i class="bx bx-menu"></i>
					</a>
				</div>
				<div class="flex-grow-1 search-bar">
				</div>
				<div class="right-topbar ms-auto">
					<ul class="navbar-nav">
						<li class="nav-item dropdown dropdown-user-profile">
							<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;"
								data-bs-toggle="dropdown">
								<div class="d-flex user-box align-items-center">
									<div class="user-info">
										<p class="designattion mb-0 text-primary" style="font-weight: bolder;">Welcome
										</p>
										<p class="user-name mb-0">
											<span style="font-variant-caps: all-petite-caps;font-weight: bolder;">AKRITI KUMARI</span>										</p>
									</div>
								</div>
							</a>
							<div class="dropdown-menu dropdown-menu-end">
								<a class="dropdown-item text-primary" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Profile"
									style="font-weight: bolder;">
									<i class="bx bx-user"></i><span>Profile</span></a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item" href="https://www.umis.live/JayPrakashCollege/jpumisportal/login/Login/logout"
									style="font-weight: bolder;color: darkred;">
									<i class="bx bx-power-off"></i>
									<span>Logout</span>
								</a>
								<div class="dropdown-divider mb-0"></div>
								<a class="dropdown-item text-primary">
									<span class="badge bg-success rounded-pill">Today :
										28-May-26</span>
									<span class="badge bg-primary rounded-pill">Time : <span id="text"></span></span>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<script>
			function startTime() {
				const today = new Date();
				let h = today.getHours();
				let m = today.getMinutes();
				let s = today.getSeconds();
				m = checkTime(m);
				s = checkTime(s);
				document.getElementById('text').innerHTML = h + ":" + m + ":" + s;
				setTimeout(startTime, 1000);
			}

			function checkTime(i) {
				if (i < 10) {
					i = "0" + i
				}; // add zero in front of numbers < 10
				return i;
			}
		</script><div class="page-wrapper">
    <!--page-content-wrapper-->
    <div class="page-content-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3"><a href="https://www.umis.live/JayPrakashCollege/jpumisportal/dashboard/Home"><i
                            class="bx bx-home-alt"></i></a></div>
               
            </div>
            <!--end breadcrumb-->
            <div class="row">
                <div class="col-xl-12 mx-auto">
                    <div class="card border-top border-0 border-4 border-primary">
                        <div class="card-body p-5">
                            <button class="btn btn-dark btn-sm" onclick="printPageArea('filePage')"
                                style="font-weight: bolder;"><i class="bx bx-printer"></i> Print Form</button>
                            <br><br>
                            <div id="data">
                                <main id="filePage">
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <!-- Students Exam Form Start :: 1 -->
                                    <!-- ++++++++++++++++++++++++++ -->
                                    <div class="student-form">
                                        