📁 File Manager
🏠 /
/
home
/
u857492117
/
domains
/
mangaldaicollege.org
/
public_html
/
itep
Dosya Düzenle: relDoc.php
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>ITEP - Mangaldai College</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> <style> body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #f4f6f9; } /* Transparent Navbar */ .navbar-dark { background-color: rgba(4, 9, 30, 0.9) !important; transition: background-color 0.5s ease; } .navbar-dark .nav-link { color: #f1f1f1 !important; transition: color 0.3s ease; } .navbar-dark .nav-link:hover { color: #00bcd4 !important; /* Light blue hover */ } .navbar-brand img { filter: drop-shadow(0px 0px 4px rgba(255,255,255,0.7)); } .hero-carousel { margin-top: 20px; } .btn-section { background: #ffffff; padding: 20px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); } .btn-section .btn { margin-bottom: 10px; text-align: left; width: 100%; } .notice-board { background: #ffffff; padding: 20px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); } .footer { background: #212529; color: #fff; padding: 40px 0; } .footer a { color: #ccc; text-decoration: none; } .footer a:hover { color: #fff; } iframe { width: 100%; height: 250px; border: none; } .card-section { background: #fff; padding: 30px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); margin-bottom: 40px; display: flex; flex-direction: column; height: 100%; transition: transform 0.3s ease, box-shadow 0.3s ease; } .card-section:hover { transform: translateY(-5px); box-shadow: 0 6px 15px rgba(0,0,0,0.2); } .notice-item { padding: 10px 0; border-bottom: 1px solid #ddd; } .notice-item:last-child { border-bottom: none; } .principal-photo { width: 120px; height: 120px; object-fit: cover; border-radius: 50%; margin-bottom: 15px; box-shadow: 0 4px 6px rgba(0,0,0,0.2); } .read-more-btn { margin-top: auto; } /* Button Section Styles */ .btn-section { display: flex; flex-direction: column; gap: 2px; /* spacing between buttons */ } /* Custom Button Style */ .custom-btn { background: linear-gradient(45deg, #131414, #4caf50); /* gradient */ color: #fff; font-weight: 600; border: none; border-radius: 8px; padding: 10px 15px; text-align: left; transition: all 0.3s ease; box-shadow: 0 4px 8px rgba(0,0,0,0.1); } .custom-btn:hover { background: linear-gradient(45deg, #4caf50, #00bcd4); transform: translateY(-3px); box-shadow: 0 6px 15px rgba(0,0,0,0.2); } .custom-btn:active { transform: translateY(0px); box-shadow: 0 3px 6px rgba(0,0,0,0.15); } /* Professional Secondary Navbar */ .navbar-dark.bg-dark { background-color: #1f2937 !important; /* Dark slate color */ border-bottom: 2px solid #00bcd4; /* Subtle accent line */ } .navbar-dark .nav-link { color: #cbd5e1 !important; /* Light grey text */ font-weight: 500; font-size: 1rem; position: relative; transition: color 0.3s ease; } .navbar-dark .nav-link:hover { color: #00bcd4 !important; /* Accent color on hover */ } .navbar-dark .nav-link::after { content: ''; display: block; width: 0; height: 2px; background: #00bcd4; transition: width 0.3s; position: absolute; bottom: 0; left: 0; } .navbar-dark .nav-link:hover::after { width: 100%; } .notification-bar { display: flex; border-radius: 5px; overflow: hidden; box-shadow: 0 4px 8px rgba(0,0,0,0.1); } .notification-label { background-color: #dc3545; /* red */ color: #fff; font-weight: bold; text-align: center; white-space: nowrap; } .notification-messages { background-color: #fff; flex-grow: 1; overflow: hidden; position: relative; } .notification-messages .scrolling-text { display: inline-block; white-space: nowrap; animation: scroll-left 15s linear infinite; } @keyframes scroll-left { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } } .notification-messages:hover .scrolling-text { animation-play-state: paused; } /* princy msg */ .img-fluid { width: 100%; height: auto; } .rounded { border-radius: 10px; } .shadow-sm { box-shadow: 0 4px 8px rgba(0,0,0,0.1); } h2 { font-size: 1.8rem; margin-bottom: 15px; } p { font-size: 1rem; line-height: 1.6; } /* Photo styling with black border and shadow */ .photo-border-shadow { width: 100%; height: auto; border: 4px solid #000; /* black border */ border-radius: 10px; /* rounded corners */ box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3); /* shadow */ } /* Shadow box for the entire section */ .shadow-box { background-color: #fff; border-radius: 15px; box-shadow: 0 10px 25px rgba(0,0,0,0.15); transition: transform 0.3s ease, box-shadow 0.3s ease; } .shadow-box:hover { transform: translateY(-5px); box-shadow: 0 12px 30px rgba(0,0,0,0.2); } /* Vertical marquee container */ .vertical-marquee { height: 120px; /* adjust the height as needed */ overflow: hidden; position: relative; } /* Scrolling animation */ .vertical-marquee ul { list-style: none; margin: 0; padding: 0; position: absolute; animation: scroll-up 8s linear infinite; } .vertical-marquee ul li { padding: 8px 0; border-bottom: 1px solid #ddd; color: #555; } /* Keyframes for scrolling bottom to top */ @keyframes scroll-up { 0% { top: 100%; } 100% { top: -100%; } } /* Pause on hover */ .vertical-marquee:hover ul { animation-play-state: paused; } /* Card Section Styling */ .card-section { background-color: #fff; border-radius: 10px; box-shadow: 0 6px 15px rgba(0,0,0,0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; } .card-section:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.15); } /* Notifications Card Background */ .notification-card { background-color: #f0f4f8; /* subtle light bg */ } /* Vertical marquee container */ .vertical-marquee { height: 250px; /* increased height */ overflow: hidden; position: relative; padding: 10px; border-radius: 5px; background-color: #ffffff; } /* Animation wrapper */ .vertical-marquee ul { list-style: none; margin: 0; padding: 0; position: absolute; width: 100%; animation: scroll-up 15s linear infinite; } .vertical-marquee ul li { padding: 12px 0; border-bottom: 1px solid #ddd; color: #212529; font-size: 0.95rem; } .vertical-marquee ul li:last-child { border-bottom: none; } /* Keyframes for smooth scroll */ @keyframes scroll-up { 0% { top: 100%; } 100% { top: -100%; } } /* Pause on hover */ .vertical-marquee:hover ul { animation-play-state: paused; } /* Gradient Button */ .btn-gradient { background: linear-gradient(45deg, #6a11cb, #2575fc); border: none; color: #fff; transition: background 0.3s ease; } .btn-gradient:hover { backgroun /* logo brand wrapper */ .brand-marquee { overflow-x: auto; cursor: grab; background-color: #f8f9fa; padding: 20px 0; border-radius: 10px; user-select: none; scroll-behavior: smooth; white-space: nowrap; /* ensures logos are in a single line */ } .brand-marquee:active { cursor: grabbing; } .brand-track { display: inline-flex; /* horizontal layout */ gap: 30px; } .brand-logo { height: 80px; flex-shrink: 0; transition: transform 0.3s ease; } .brand-logo:hover { transform: scale(1.1); } .brand-track { display: inline-flex; gap: 30px; } .brand-logo { width: 120px; /* Set uniform width */ height: 80px; /* Set uniform height */ object-fit: contain; /* maintain aspect ratio, fit within box */ flex-shrink: 0; /* prevent shrinking */ transition: transform 0.3s ease; } .brand-logo:hover { transform: scale(1.1); } /* Sticky secondary navbar */ .navbar-sticky { position: fixed; /* always fixed */ top: 0; /* stick at top */ width: 100%; /* full width */ z-index: 1050; /* above all content */ background-color: #1f2937; /* keep background same as before */ box-shadow: 0 2px 8px rgba(0,0,0,0.1); } </style> </head> <body> <?php include("topmenu.php");?> <!-- Hero Section with Carousel & Buttons --> <div class="container-fluid hero-carousel fade-in-up"> <div class="row"> <!-- Left Buttons --> <?php //include("heromenu.php");?> <!-- Carousel --> <!-- <div class="col-lg-10 col-md-9"> <!-- <div id="collegeCarousel" class="carousel slide" data-bs-ride="carousel" style="box-shadow:0 4px 8px rgba(0,0,0,0.1)"> <!-- <div class="carousel-inner"> <!-- <div class="carousel-item active"> <!-- <img src="img/h2.png" height="450px" class="d-block w-100" alt="Slide 1"> <!-- </div> <!-- <div class="carousel-item"> <!-- <img src="img/main_banner.jpg" height="450px" class="d-block w-100" alt="Slide 2"> <!-- </div> <!-- <button class="carousel-control-prev" type="button" data-bs-target="#collegeCarousel" data-bs-slide="prev"> <!-- <span class="carousel-control-prev-icon"></span> <!-- </button> <!-- <button class="carousel-control-next" type="button" data-bs-target="#collegeCarousel" data-bs-slide="next"> <!-- <span class="carousel-control-next-icon"></span> <!-- </button> <!-- </div> <!-- </div> <!--</div> <!-- </div> --> <?php include("stickmenu.php");?> <!-- /* princy msg */ --> <!-- From Principal Desk Section --> <section class="container py-5 fade-in-up"> <div class="shadow-box p-4 rounded"> <div class="row align-items-center"> <!-- Left Photo (25%) --> <!-- Right Text (75%) --> <div class="col-lg-12 col-md-8"> <p align="justify"> <!-- Page Content --> <div class="container my-5"> <h2 class="mb-4 text-center">Relevant Documents</h2> <div class="row g-4"> <!-- Land Document --> <div class="col-md-4"> <div class="card shadow-sm h-100"> <div class="card-body"> <h5 class="card-title">Land Document</h5> <p class="card-text">Official papers related to property ownership and land records.</p> <a href="landDoc.php" class="btn btn-primary btn-sm">View Document</a> </div> </div> </div> <!-- Identity Proof --> <div class="col-md-4"> <div class="card shadow-sm h-100"> <div class="card-body"> <h5 class="card-title">Identity Proof</h5> <p class="card-text">Documents like Aadhaar, Passport, Voter ID, or Driving License.</p> <a href="#" class="btn btn-primary btn-sm">View Document</a> </div> </div> </div> <!-- Certificates --> <div class="col-md-4"> <div class="card shadow-sm h-100"> <div class="card-body"> <h5 class="card-title">Certificates</h5> <p class="card-text">Educational certificates, birth certificates, and other records.</p> <a href="#" class="btn btn-primary btn-sm">View Document</a> </div> </div> </div> <!-- Add More Documents --> <div class="col-md-4"> <div class="card shadow-sm h-100"> <div class="card-body"> <h5 class="card-title">Other Documents</h5> <p class="card-text">Any additional relevant documents can be listed here.</p> <a href="#" class="btn btn-primary btn-sm">View Document</a> </div> </div> </div> </div> </div> </p> </div> </div> </div> </section> <!-- Important Links Section --> <section class="py-5 text-center"> <div class="container"> <h2 class="fw-bold mb-4">Important Links</h2> <hr class="mx-auto mb-5" style="width: 120px; height: 3px; background-color: #f4511e; border: none;"> <!-- Carousel --> <div id="eservicesCarousel" class="carousel slide" data-bs-ride="carousel"> <div class="carousel-inner"> <!-- Item 1 --> <div class="carousel-item active"> <div class="row justify-content-center"> <div class="col-6 col-md-2"> <div class="circle-img mx-auto" style="background: #264653;"> <img src="img/3d png.png" alt="OTPRMS Teacher-Pupil Registration"> </div> <p class="mt-2">Mangaldai College</p> </div> <div class="col-6 col-md-2"> <div class="circle-img mx-auto" style="background: #2a9d8f;"> <img src="img/naac.png" alt="NAAC " style="object-fit: contain;"> </div> <p class="mt-2">NAAC</p> </div> <div class="col-6 col-md-2"> <div class="circle-img mx-auto" style="background: #e9c46a;"> <img src="img/ugc.png" width="10px" alt="UGC" style="object-fit: contain;"> </div> <p class="mt-2">UGC</p> </div> <div class="col-6 col-md-2"> <div class="circle-img mx-auto" style="background: #f4a261;"> <img src="img/sw.png" alt="swayam" style="object-fit: contain;"> </div> <p class="mt-2">Swayam</p> </div> <div class="col-6 col-md-2"> <div class="circle-img mx-auto" style="background: #e76f51;"> <img src="img/gau.jpeg" alt="GU" > </div> <p class="mt-2">Gauhati University</p> </div> </div> </div> <!-- Add more carousel-item blocks if you have more groups --> </div> <!-- Controls --> <button class="carousel-control-prev" type="button" data-bs-target="#eservicesCarousel" data-bs-slide="prev"> <span class="carousel-control-prev-icon"></span> </button> <button class="carousel-control-next" type="button" data-bs-target="#eservicesCarousel" data-bs-slide="next"> <span class="carousel-control-next-icon"></span> </button> <!-- Indicators --> <div class="carousel-indicators mt-3"> <button type="button" data-bs-target="#eservicesCarousel" data-bs-slide-to="0" class="active"></button> <button type="button" data-bs-target="#eservicesCarousel" data-bs-slide-to="1"></button> </div> </div> </div> </section> <!-- Circle Styling --> <style> .circle-img { width: 150px; height: 150px; border-radius: 50%; overflow: hidden; background: #f4511e; /* orange circle bg */ display: flex; align-items: center; justify-content: center; } .circle-img img { width: 100%; height: 100%; object-fit: cover; } </style> <!-- Footer --> <footer class="footer fade-in"> <div class="container"> <div class="row"> <div class="col-md-3"> <h5>Address</h5> <p>Mangaldai College<br> Darrang, Assam<br> PIN - 784125</p> </div> <div class="col-md-3"> <h5>Quick Links</h5> <ul class="list-unstyled"> <li><a href="#">Admission</a></li> <li><a href="#">Syllabus</a></li> <li><a href="#">Faculty</a></li> <li><a href="#">Contact</a></li> </ul> </div> <div class="col-md-3"> <h5>Important Links</h5> <ul class="list-unstyled"> <li><a href="#">NCTE</a></li> <li><a href="#">UGC</a></li> <li><a href="#">AICTE</a></li> <li><a href="#">Ministry of Education</a></li> </ul> </div> <div class="col-md-3"> <h5>Location</h5> <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d57165.21103255591!2d91.97322871165092!3d26.429101133343423!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x375b1d1331befdef%3A0xf3de40cd929a587c!2sMangaldai%20College!5e0!3m2!1sen!2sin!4v1758181118556!5m2!1sen!2sin" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe> </div> </div> <div class="text-center mt-4"> <p class="mb-0">© 2025-26 Mangaldai College - All Rights Reserved.</p> </div> </div> </footer> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> </body> </html>
💾 Kaydet
İptal