JezK
Edit File: downloads.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Free Study Material & Resources | Skylor Institute</title> <meta name="description" content="Download free study planners, syllabus guides, and previous year papers for CLAT, CUET, IPMAT, and UPSC. Access high-quality resources from Skylor Institute."> <meta name="author" content="Skylor Institute"> <meta property="og:title" content="Free Study Material & Resources | Skylor Institute"> <meta property="og:description" content="Download free study planners, syllabus guides, and previous year papers for CLAT, CUET, IPMAT, and UPSC. Access high-quality resources from Skylor Institute."> <meta property="og:type" content="website"> <meta name="google-site-verification" content="EJw2Mf8YQSUaCSMfraU1c7U6kT5epjb0LX5FRNuuYWQ" /> <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> <style> /* Google Fonts Import */ @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap'); :root { /* Color Palette - Premium & Modern */ --primary-color: #003366; /* Deep Royal Blue */ --primary-dark: #001a33; /* Darker Blue for depth */ --primary-light: #004d99; /* Lighter Blue for accents */ --secondary-color: #FFB300; /* Rich Gold */ --secondary-hover: #FFC107; /* Brighter Gold */ --text-dark: #1F2937; /* Dark Gray for text */ --text-light: #4B5563; /* Medium Gray for subtext */ --text-white: #F9FAFB; --bg-white: #FFFFFF; --bg-light: #F5F6FA; /* Very light gray for backgrounds */ --bg-accent: #E5E7EB; --border-color: #E5E7EB; /* Shadows */ --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05); --shadow-md: 0 4px 15px rgba(0, 0, 0, 0.04); --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.08); --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); --glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15); /* Typography */ --font-heading: 'Montserrat', sans-serif; --font-body: 'Montserrat', sans-serif; /* Modern, clean sans-serif */ /* Spacing */ --container-width: 1280px; /* Slightly wider container */ --header-height: 80px; --section-spacing: 100px; } /* Reset & Base Styles */ * { margin: 0; padding: 0; box-sizing: border-box; } html { scroll-behavior: smooth; font-size: 16px; overflow-x: hidden; } body { font-family: var(--font-body); color: var(--text-dark); line-height: 1.7; background-color: var(--bg-white); -webkit-font-smoothing: antialiased; overflow-x: hidden; width: 100%; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); color: var(--primary-color); margin-bottom: 1rem; font-weight: 700; line-height: 1.2; } p { margin-bottom: 1.5rem; color: var(--text-light); } a { text-decoration: none; color: inherit; transition: all 0.3s ease; } ul { list-style: none; } img { max-width: 100%; display: block; } /* Utility Classes */ .container { max-width: var(--container-width); margin: 0 auto; padding: 0 24px; } .section-padding { padding: var(--section-spacing) 0; } .bg-light { background-color: var(--bg-light); } .text-center { text-align: center; } /* Modern Buttons */ .btn { display: inline-block; padding: 16px 36px; border-radius: 12px; font-family: var(--font-heading); font-weight: 600; text-align: center; cursor: pointer; border: none; font-size: 1rem; text-transform: uppercase; letter-spacing: 1px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); position: relative; overflow: hidden; z-index: 1; } .btn-sm { padding: 10px 24px; font-size: 0.9rem; } .btn-primary { background: linear-gradient(135deg, var(--secondary-color), #FFC72C); color: var(--primary-dark); box-shadow: 0 4px 15px rgba(255, 179, 0, 0.3); } .btn-primary:hover { transform: translateY(-3px); box-shadow: 0 8px 25px rgba(255, 179, 0, 0.4); } .btn-outline { border: 2px solid rgba(255, 255, 255, 0.8); color: var(--text-white); background: transparent; } .btn-outline:hover { background: var(--bg-white); color: var(--primary-color); border-color: var(--bg-white); } .btn-outline-dark { border: 2px solid var(--primary-color); color: var(--primary-color); background: transparent; } .btn-outline-dark:hover { background: var(--primary-color); color: var(--text-white); } .btn-secondary-outline { border: 2px solid var(--primary-color); color: var(--primary-color); background: transparent; } .btn-secondary-outline:hover { background: var(--primary-color); color: var(--text-white); } /* Header & Navigation */ header { background-color: rgba(255, 255, 255, 0.95); /* Slight transparency */ backdrop-filter: blur(10px); box-shadow: var(--shadow-sm); position: sticky; top: 0; z-index: 1000; height: var(--header-height); display: flex; align-items: center; transition: all 0.3s ease; } header .container { display: flex; justify-content: space-between; align-items: center; width: 100%; } .logo img { height: 55px; width: auto; } .nav-menu { display: flex; gap: 40px; align-items: center; } .nav-link { font-family: var(--font-heading); font-weight: 600; color: var(--primary-color); font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.5px; position: relative; } .nav-link::after { content: ''; position: absolute; width: 0; height: 2px; bottom: -4px; left: 0; background-color: var(--secondary-color); transition: width 0.3s ease; } .nav-link:hover::after { width: 100%; } .nav-link:hover { color: var(--primary-light); } .mobile-toggle { display: none; font-size: 1.5rem; color: var(--primary-color); cursor: pointer; } /* Hero Section Styles (Split Layout Slider) */ .hero-slider-section { position: relative; height: 80vh; /* Reduced height for better placement */ min-height: 550px; overflow: hidden; background-color: #FFFFFF; /* White background matching reference */ /* padding-top removed to fix alignment */ } /* Alignment Fix */ .hero-slider-section .container { position: relative; height: 100%; } .hero-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition: opacity 0.8s ease-in-out, visibility 0.8s; display: flex; align-items: center; z-index: 1; } .hero-slide.active { opacity: 1; visibility: visible; z-index: 2; } /* Remove dark overlay since we want light background */ .hero-slide::before { display: none; } .hero-split-layout { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 40px; align-items: center; width: 100%; height: 100%; } /* Left Content Column */ .hero-text-col { padding-right: 20px; z-index: 2; animation: slideRight 1s ease 0.2s backwards; } /* Badge Style */ .hero-badge { display: inline-block; background: rgba(255, 179, 0, 0.15); /* Light Orange/Gold bg */ color: #D97706; /* Darker Orange text */ padding: 8px 16px; border-radius: 30px; font-size: 0.9rem; font-weight: 600; margin-bottom: 24px; display: inline-flex; align-items: center; gap: 8px; } .hero-badge i { color: var(--secondary-color); } /* Typography matching reference */ .hero-text-col h1 { font-size: 3.5rem; /* Large Headline */ line-height: 1.15; color: var(--primary-dark); margin-bottom: 20px; font-weight: 800; } .hero-text-col h1 span { color: var(--secondary-color); /* Highlight color */ } .hero-text-col h1 .highlight-blue { color: var(--primary-color); } .hero-text-col p { font-size: 1.15rem; color: var(--text-light); /* Dark gray */ margin-bottom: 35px; max-width: 90%; line-height: 1.6; } /* Buttons Group */ .hero-btns { display: flex; gap: 15px; } /* Custom Button Styles for Hero */ .btn-hero-primary { background-color: var(--primary-color); color: white; padding: 16px 32px; border-radius: 12px; font-weight: 600; box-shadow: 0 4px 6px rgba(0, 51, 102, 0.3); text-transform: uppercase; } .btn-hero-primary:hover { background-color: var(--primary-dark); transform: translateY(-2px); } .btn-hero-secondary { background: linear-gradient(135deg, #FF9F00, #FFC107); /* Orange/Gold gradient */ color: white; padding: 16px 32px; border-radius: 12px; font-weight: 600; box-shadow: 0 4px 10px rgba(255, 160, 0, 0.3); text-transform: uppercase; } .btn-hero-secondary:hover { transform: translateY(-2px); box-shadow: 0 6px 15px rgba(255, 160, 0, 0.4); } /* Right Image Column */ .hero-img-col { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; animation: fadeIn 1.2s ease 0.2s backwards; } /* Abstract Background Shapes */ .hero-blob-bg { position: absolute; width: 500px; height: 500px; background: linear-gradient(135deg, #FFF8E1, #FFECB3); /* Very light gold */ border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; /* Organic Blob shape */ z-index: -1; animation: morph 8s ease-in-out infinite; right: 50px; } .hero-blob-bg.blue-accent { background: linear-gradient(135deg, #E3F2FD, #BBDEFB); /* Light Blue */ width: 450px; height: 450px; border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; right: 80px; } .hero-student-img { position: relative; z-index: 1; max-height: 85%; width: auto; object-fit: contain; /* filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.15)); */ } @keyframes slideRight { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } } @keyframes morph { 0% { border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; } 50% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; } 100% { border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; } } /* Page Hero Generic */ .page-header { position: relative; height: 40vh; /* Reduced height for inner pages */ min-height: 350px; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--text-white); background-size: cover; background-position: center; margin-top: -80px; /* Pull up behind header */ padding-top: 80px; } .page-header::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(0, 15, 30, 0.7), rgba(0, 30, 60, 0.9)); z-index: 1; } .page-header .container { position: relative; z-index: 2; } .page-header h1 { font-size: 3.5rem; color: var(--text-white); margin-bottom: 20px; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); } .page-header p { font-size: 1.2rem; color: rgba(255, 255, 255, 0.9); max-width: 700px; margin: 0 auto; } /* Section Titles */ .section-title { margin-bottom: 60px; position: relative; display: block; text-align: center; } .section-title h2 { font-size: 2.8rem; color: var(--primary-dark); margin-bottom: 15px; } .section-title p { font-size: 1.1rem; max-width: 600px; margin: 0 auto; } .section-title::after { content: ''; display: block; width: 80px; height: 4px; background: var(--secondary-color); margin: 20px auto 0; border-radius: 4px; } /* Feature Cards (New Core Features) */ .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; } .feature-card { text-align: left; padding: 35px; background: var(--bg-white); border-radius: 16px; box-shadow: var(--shadow-md); transition: all 0.4s ease; border: 1px solid rgba(0, 0, 0, 0.03); position: relative; overflow: hidden; } .feature-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--secondary-color); transform: scaleY(0); transition: transform 0.4s ease; } .feature-card:hover::before { transform: scaleY(1); } .feature-card:hover { transform: translateY(-10px); box-shadow: var(--shadow-lg); } .feature-icon { font-size: 2rem; color: var(--secondary-color); margin-bottom: 20px; display: inline-block; background: rgba(255, 179, 0, 0.1); padding: 15px; border-radius: 12px; } .feature-card h3 { font-size: 1.3rem; margin-bottom: 10px; color: var(--primary-color); } .feature-card p { font-size: 0.95rem; color: var(--text-light); margin-bottom: 0; } /* Course Cards */ .courses-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px; } .course-card { background: var(--bg-white); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-md); transition: all 0.4s ease; display: flex; flex-direction: column; height: 100%; border-bottom: 3px solid transparent; } .course-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-xl); border-bottom-color: var(--secondary-color); } .course-icon-wrapper { background: var(--primary-color); padding: 40px 30px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; } .course-icon-wrapper i { font-size: 4rem; color: rgba(255, 255, 255, 0.1); position: absolute; right: -10px; bottom: -10px; transform: rotate(-15deg); } .course-main-icon { font-size: 3rem; color: var(--secondary-color); z-index: 1; } .course-content { padding: 30px; flex-grow: 1; display: flex; flex-direction: column; } .course-card h3 { font-size: 1.6rem; margin-bottom: 12px; } .course-card p { color: var(--text-light); margin-bottom: 24px; flex-grow: 1; } /* About Us Section Styles */ .about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; } .about-image { position: relative; } .about-image img { border-radius: 20px; box-shadow: var(--shadow-xl); } .about-shape { position: absolute; bottom: -30px; left: -30px; width: 100px; height: 100px; background: var(--secondary-color); border-radius: 50%; z-index: -1; opacity: 0.5; } /* Request Call Back Section */ .call-back-section { background-color: var(--bg-light); position: relative; } .call-back-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; } .call-back-content h2 { font-size: 2.5rem; margin-bottom: 20px; } .call-back-form-wrapper { background: var(--bg-white); padding: 40px; border-radius: 20px; box-shadow: var(--glass-shadow); } .form-group { margin-bottom: 20px; } .form-group label { display: block; margin-bottom: 8px; font-weight: 600; color: var(--primary-dark); } .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 12px 16px; border: 1px solid var(--border-color); border-radius: 8px; font-family: inherit; font-size: 1rem; transition: all 0.3s; background: #FAFAFA; } .form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: var(--primary-color); background: var(--bg-white); box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.1); } /* Download Material Visualization */ .download-section-content { display: flex; justify-content: space-between; align-items: center; background: linear-gradient(135deg, var(--primary-color), #002244); border-radius: 24px; padding: 60px; color: white; box-shadow: var(--shadow-xl); overflow: hidden; position: relative; } .download-text-content { flex: 1; position: relative; z-index: 2; padding-right: 40px; } .download-text-content h2 { color: white; font-size: 2.5rem; margin-bottom: 15px; } .download-text-content p { color: rgba(255, 255, 255, 0.8); font-size: 1.1rem; margin-bottom: 30px; } .download-visual { flex: 0 0 300px; position: relative; width: 300px; height: 250px; display: flex; justify-content: center; align-items: center; } /* CSS Graphic for Books */ .book-graphic { width: 140px; height: 180px; background: white; border-radius: 4px 12px 12px 4px; position: absolute; box-shadow: -10px 10px 20px rgba(0, 0, 0, 0.3); transform: rotate(-10deg) translateY(-10px); z-index: 2; } .book-graphic::before { content: 'CLAT 2027'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(90deg); color: var(--primary-color); font-weight: 800; font-size: 1.2rem; white-space: nowrap; } .book-graphic.book-2 { background: var(--secondary-color); transform: rotate(5deg) translateX(40px); z-index: 1; } .book-graphic.book-2::before { content: 'GUIDE'; color: var(--primary-dark); } /* Downloads Page Grid */ .downloads-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 30px; } .download-card { background: var(--bg-white); border: 1px solid var(--border-color); border-radius: 12px; padding: 24px; display: flex; align-items: flex-start; transition: all 0.3s; } .download-card:hover { box-shadow: var(--shadow-lg); border-color: var(--secondary-color); } .file-icon { font-size: 2.5rem; margin-right: 20px; } .file-icon.pdf { color: #DC2626; } .file-icon.excel { color: #10B981; } .file-info h3 { font-size: 1.1rem; margin-bottom: 5px; color: var(--text-dark); } .file-info p { font-size: 0.9rem; margin-bottom: 15px; } /* FAQs Section */ .faq-container { max-width: 800px; margin: 0 auto; } .faq-item { background: var(--bg-white); border: 1px solid var(--border-color); border-radius: 8px; margin-bottom: 15px; overflow: hidden; } .faq-question { padding: 20px; background: var(--bg-white); cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-weight: 600; color: var(--primary-dark); transition: all 0.3s; } .faq-question:hover { background: #f9f9f9; } .faq-question i { transition: transform 0.3s; } .faq-item.active .faq-question i { transform: rotate(180deg); } .faq-item.active .faq-question { color: var(--secondary-color); /* Highlight active question */ } .faq-answer { padding: 0 20px; max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out, padding 0.3s; background: #ffffff; color: var(--text-light); } .faq-item.active .faq-answer { padding: 20px; max-height: 500px; /* Arbitrary large height */ border-top: 1px solid var(--bg-accent); } /* Footer (Modern) */ footer { background-color: var(--primary-dark); color: var(--text-white); padding: 80px 0 30px; font-size: 0.95rem; } .footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 60px; margin-bottom: 60px; } .footer-col h3 { color: var(--secondary-color); margin-bottom: 30px; font-size: 1.3rem; } .footer-links a { color: #9CA3AF; /* Gray-400 */ display: block; margin-bottom: 12px; transition: 0.2s; } .footer-links a:hover { color: var(--secondary-color); transform: translateX(5px); } .bottom-bar { border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 30px; text-align: center; color: #6B7280; } /* Animation Utilities */ @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } /* Responsive */ @media (max-width: 992px) { .call-back-grid, .about-grid, .hero-split-layout { grid-template-columns: 1fr; } .hero-text-col { padding-right: 0; text-align: center; } .hero-btns { justify-content: center; } .hero-img-col { display: none; /* Hide image on smaller screens or adjust */ } .download-section-content { flex-direction: column; text-align: center; padding: 40px; } .download-text-content { padding-right: 0; margin-bottom: 40px; } .hero-text-col h1 { font-size: 3rem; } } @media (max-width: 768px) { .nav-menu { position: fixed; top: var(--header-height); left: -100%; width: 100%; height: calc(100vh - var(--header-height)); background-color: var(--bg-white); flex-direction: column; align-items: center; justify-content: flex-start; padding-top: 60px; transition: 0.3s; box-shadow: var(--shadow-xl); } .nav-menu.active { left: 0; } .mobile-toggle { display: block; margin-left: auto; } .hero-slider-section { height: auto; min-height: 600px; padding-bottom: 40px; } .hero-text-col h1 { font-size: 2.5rem; } .hero-btns { gap: 10px; } .btn-hero-primary, .btn-hero-secondary { padding: 12px 20px; font-size: 0.9rem; } } /* Contact Page Specific Styles */ .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; } .contact-details { padding-right: 20px; } .info-item { display: flex; align-items: flex-start; gap: 20px; margin-bottom: 40px; } .info-item .icon { width: 60px; height: 60px; background: rgba(255, 179, 0, 0.1); color: var(--secondary-color); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; flex-shrink: 0; } .info-item h4 { font-size: 1.2rem; margin-bottom: 5px; color: var(--primary-color); } .contact-form-wrapper { background: var(--bg-white); padding: 40px; border-radius: 20px; box-shadow: var(--shadow-xl); border: 1px solid var(--border-color); } @media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; gap: 40px; } .contact-details { padding-right: 0; margin-bottom: 20px; } } </style> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> <link rel="icon" href="assets/images/site-icon.jpeg"> <script async src="https://www.googletagmanager.com/gtag/js?id=G-62RTB2WHZ9"></script> <script> window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag('js', new Date()); gtag('config', 'G-62RTB2WHZ9'); </script> </head> <body class="bg-light"> <header style="background: white; border-bottom: 1px solid #E5E7EB; box-shadow: 0 4px 15px rgba(0,0,0,0.02);"> <div class="container" style="height: 80px;"> <a href="index.html" class="logo"> <img src="assets/images/logo.png" alt="Skylor Institute Logo" style="height:55px;"> </a> <div class="mobile-toggle" onclick="toggleMenu()"><i class="fas fa-bars"></i></div> <nav> <ul class="nav-menu" id="navMenu"> <li><a href="index.html" class="nav-link">Home</a></li> <li><a href="about.html" class="nav-link">About Us</a></li> <li><a href="index.html#courses" class="nav-link">Courses</a></li> <li><a href="downloads.html" class="nav-link">Downloads</a></li> <li><a href="contact.html" class="nav-link">Contact Us</a></li> <li><a href="contact.html" class="btn btn-primary" style="padding: 10px 24px;">Enroll Now</a></li> </ul> </nav> </div> </header> <main> <!-- Page Header --> <section class="page-header" style="background-image: url('assets/images/poster1.png');"> <div class="container" data-aos="fade-up"> <h1>Study Material & Planners</h1> <p>Curated resources to power your preparation.</p> </div> </section> <!-- Downloads Section --> <section class="section-padding"> <div class="container"> <div class="text-center section-title" data-aos="fade-up"> <h2>Free Resources</h2> <p>Download syllabus, previous year papers, and monthly planners.</p> </div> <div class="downloads-grid" data-aos="fade-up"> <div class="download-card"> <div class="file-icon pdf"> <i class="fas fa-file-pdf"></i> </div> <div class="file-info"> <h3>CLAT Study Planner</h3> <p>Comprehensive monthly planner to streamline your CLAT preparation.</p> <a href="assets/materials/CLAT Study Planner.pdf" class="btn btn-sm btn-outline-dark" download>Download <i class="fas fa-download"></i></a> </div> </div> </div> </div> </section> <!-- Call to Action --> <section class="section-padding bg-light text-center"> <div class="container"> <h2 style="margin-bottom: 20px;">Need Customized Guidance?</h2> <a href="contact.html" class="btn btn-primary">Contact Mentors</a> </div> </section> </main> <footer> <div class="container"> <div class="footer-grid"> <div class="footer-col"> <a href="index.html" style="display: block; margin-bottom: 20px;"> <img src="assets/images/footer-logo.png" alt="Skylor Institute" style="height: 45px; filter: brightness(0) invert(1);"> </a> <p style="color: #9CA3AF;">Excel, Lead, Conquer. Pioneering competitive coaching in the Malwa Region.</p> </div> <div class="footer-col"> <h3>Quick Links</h3> <ul class="footer-links" style="list-style:none;"> <li><a href="index.html">Home</a></li> <li><a href="index.html#courses">Courses</a></li> <li><a href="about.html">About Us</a></li> <li><a href="contact.html">Contact Us</a></li> </ul> </div> <div class="footer-col"> <h3>Contact Us</h3> <ul class="contact-info" style="list-style: none;"> <li style="display: flex; gap: 10px; margin-bottom: 15px; color: #9CA3AF;"><i class="fas fa-map-marker-alt" style="color: var(--secondary-color); margin-top: 5px;"></i> Bathinda, Punjab - 151001 </li> <li style="display: flex; gap: 10px; margin-bottom: 15px; color: #9CA3AF;"><i class="fas fa-phone" style="color: var(--secondary-color); margin-top: 5px;"></i> +91 97794-00128</li> <li style="display: flex; gap: 10px; margin-bottom: 15px; color: #9CA3AF;"><i class="fas fa-envelope" style="color: var(--secondary-color); margin-top: 5px;"></i> info@skylor.co.in</li> </ul> </div> </div> <div class="bottom-bar"> <p>© 2026 Skylor Institute. All Rights Reserved.</p> </div> </div> </footer> <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> <script> AOS.init({ duration: 800, once: true, offset: 100, easing: 'ease-out-cubic' }); function toggleMenu() { document.getElementById('navMenu').classList.toggle('active'); } </script> </body> </html>