Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 4.18.0-553.40.1.lve.el8.x86_64

PHP Version:

8.2.30

User:

u530111037

Directory:

/home/u530111037/domains/goodcharacteropc.com/public_html/working.old

Free Space:

3.34 TB

🔧 Quick Actions

✏️ Editing: website.php

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Good Character Opc - Smart Quiz Solutions</title>

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&family=Playfair+Display:wght@700&display=swap" rel="stylesheet">

<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">

.floating-img {
  animation: float 5s ease-in-out infinite;
}
@keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-15px); }
  100% { transform: translateY(0px); }
}

/* Background shapes */
.hero-shape {
  position: absolute;
  border-radius: 50%;
  opacity: 0.2;
  z-index: 0;
}
.shape1 {
  width: 200px; height: 200px;
  background: #f7a600;
  top: -50px; left: -50px;
  animation: move1 12s linear infinite;
}
.shape2 {
  width: 300px; height: 300px;
  background: #033631;
  bottom: -100px; right: -100px;
  animation: move2 15s linear infinite;
}
.shape3 {
  width: 150px; height: 150px;
  background: #bf9b42;
  top: 40%; left: 80%;
  animation: move3 18s linear infinite;
}
@keyframes move1 { 0%{transform:translate(0,0);} 50%{transform:translate(20px,30px);} 100%{transform:translate(0,0);} }
@keyframes move2 { 0%{transform:translate(0,0);} 50%{transform:translate(-30px,20px);} 100%{transform:translate(0,0);} }
@keyframes move3 { 0%{transform:translate(0,0);} 50%{transform:translate(25px,-25px);} 100%{transform:translate(0,0);} }

.hero-shape {
  position: absolute;
  border-radius: 50%;
  opacity: 0.15;
  z-index: 0;
}
.shape1 {
  width: 200px; height: 200px;
  background: #f7a600;
  top: -50px; left: -50px;
}
.shape2 {
  width: 300px; height: 300px;
  background: #033631;
  bottom: -100px; right: -100px;
}
.shape3 {
  width: 150px; height: 150px;
  background: #bf9b42;
  top: 40%; left: 80%;
}
.online-courses {
  background: #f9f9f9;
}

.online-courses {
  background: #fdfdfd;
}

.course-box {
  border-radius: 18px;
  background: white;
  transition: all 0.4s ease;
  cursor: pointer;
  min-height: 200px;
}

.course-box i {
  color: #666;
  transition: all 0.4s ease;
}

/* Hover Effects */
.course-box:hover {
  transform: translateY(-10px) scale(1.05);
  background: linear-gradient(135deg, hsl(40.3, 100%, 48.4%), hsla(40.3, 100%, 48.4%, 0.68));
  color: white;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.course-box:hover i {
  color: white;
  transform: scale(1.2) rotate(10deg);
}

.course-box h5 {
  font-size: 1.1rem;
  margin-top: 10px;
}

.course-box p {
  font-size: 0.9rem;
  opacity: 0.85;
}

/* Icon wrapper with floating effect */
.icon-wrap {
  display: inline-block;
  transition: transform 0.3s ease;
}

.course-box:hover .icon-wrap {
  transform: translateY(-6px);
}
  </style>
</head>
<body>

<nav class="navbar navbar-expand-lg fixed-top">
  <div class="container-fluid">
    <a class="navbar-brand fw-bold text-primary" href="#">Good Character Opc</a>
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse justify-content-end" id="navbarNav">
      <ul class="navbar-nav">
        <li class="nav-item"><a class="nav-link" href="#home">Home</a></li>
        <li class="nav-item"><a class="nav-link" href="#about">About</a></li>
        <li class="nav-item"><a class="nav-link" href="#features">Features</a></li>
        <li class="nav-item"><a class="nav-link" href="#stats">Stats</a></li>
        <li class="nav-item"><a class="nav-link" href="#testimonials">Testimonials</a></li>
        <li class="nav-item"><a class="nav-link" href="#faq">FAQ</a></li>
        <li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
      </ul>
    </div>
  </div>
</nav>

<section id="hero" class="d-flex align-items-center position-relative" style="min-height:100vh; background: linear-gradient(135deg, #f9fafc 0%, #ffffff 100%); overflow:hidden;">
  <div class="container-fluid px-5">
    <div class="row align-items-center">

<div class="col-lg-6" data-aos="fade-right">
        <h1 class="display-3 fw-bold mb-4" style="font-family: 'Playfair Display', serif; line-height:1.2;">
          Discover Your True <span style="color:#f7a600;">Character</span> 🎯
        </h1>
        <p class="lead text-secondary mb-4" style="font-family: 'Poppins', sans-serif;">
          Take our 50-question quiz, explore real-life scenarios, and find out if you're a true leader, empathetic friend, or someone ready to grow!
        </p>
        <a href="#about" class="btn btn-warning btn-lg px-5 rounded-pill me-3">Get Started</a>
        <a href="#quizzes" class="btn btn-outline-dark btn-lg px-5 rounded-pill">Explore Quizzes</a>
      </div>

<div class="col-lg-6 text-center position-relative" data-aos="fade-left">
        <img src="https://img.freepik.com/premium-vector/confusing-businessman-manager-looking-multiple-road-sign-thinking-which-way-go_44695-1029.jpg"
             class="img-fluid rounded-4"
             alt="Quiz Hero"
             style="max-height:500px; background: transparent;">
      </div>

</div>
  </div>

<div class="hero-shape shape1"></div>
  <div class="hero-shape shape2"></div>
  <div class="hero-shape shape3"></div>
</section>

<section id="about" class="py-5" style="background: #fff;">
  <div class="container px-5">
    <div class="row align-items-center">

<div class="col-lg-6 mb-4 mb-lg-0" data-aos="fade-right">
        <div class="position-relative">
          
          <div class="position-absolute" style="top: -40px; left: -40px; z-index:1;">
            <div class="bg-warning text-white p-3 rounded-3 shadow">
              <h4 class="mb-0 fw-bold">12+</h4>
              <small>Years of Experience</small>
            </div>
          </div>
          
          <img src="https://images.unsplash.com/photo-1607746882042-944635dfe10e"
               class="img-fluid rounded-4 shadow-lg"
               alt="Team Image">
          
          <img src="https://images.unsplash.com/photo-1544005313-94ddf0286df2"
               class="img-fluid rounded-4 shadow position-absolute"
               style="bottom: -30px; left: -30px; width: 40%; border: 5px solid #fff;"
               alt="Student">
        </div>
      </div>

<div class="col-lg-6" data-aos="fade-left">
        <p class="text-uppercase text-muted fw-semibold">Get To Know About Us</p>
        <h2 class="fw-bold mb-4" style="font-family: 'Playfair Display', serif;">
          What Is This <span style="color:#f7a600;">Quiz</span> About?
        </h2>
        <p class="mb-4 lead text-secondary" style="font-family: 'Poppins', sans-serif;">
          Our quiz is a fun and interactive way to assess your personality
          and character traits. With 50 carefully designed questions,
          you'll explore how you handle various real-life scenarios and
          receive a personalized report about your character.
        </p>

<div class="row mb-4">
          <div class="col-6 mb-3">
            <h5><i class="bi bi-people text-primary me-2"></i>1000+ Users</h5>
          </div>
          <div class="col-6 mb-3">
            <h5><i class="bi bi-award text-success me-2"></i>500 Certificates</h5>
          </div>
          <div class="col-6 mb-3">
            <h5><i class="bi bi-check2-circle text-danger me-2"></i>100 Quizzes Daily</h5>
          </div>
          <div class="col-6 mb-3">
            <h5><i class="bi bi-journal-text text-warning me-2"></i>10000 Questions</h5>
          </div>
        </div>

</div>

</div>
  </div>
</section>

<section id="features" class="container-fluid">
  <div class="container">
    <h2 class="fw-bold text-center mb-5" data-aos="fade-up">Our Features</h2>
    <div class="row g-4">
      <div class="col-md-4" data-aos="fade-right">
        <div class="card feature-card p-4 text-center">
          <h4 class="fw-bold text-primary">🎯 Interactive Quizzes</h4>
          <p>Create timed quizzes with multiple formats (MCQs, true/false, etc.).</p>
        </div>
      </div>
      <div class="col-md-4" data-aos="zoom-in">
        <div class="card feature-card p-4 text-center">
          <h4 class="fw-bold text-primary">📊 Analytics</h4>
          <p>Track student performance with detailed reports and insights.</p>
        </div>
      </div>
      <div class="col-md-4" data-aos="fade-left">
        <div class="card feature-card p-4 text-center">
          <h4 class="fw-bold text-primary">🌐 Multi-language</h4>
          <p>Support for English, Urdu, and more to connect with diverse learners.</p>
        </div>
      </div>
    </div>
  </div>
</section>

<section id="stats" class="bg-light">
  <div class="container text-center">
    <h2 class="fw-bold mb-5" data-aos="fade-up">Our Impact</h2>
    <div class="row g-4">
      <div class="col-md-3 mb-4">
        <i class="fa-solid fa-users fa-3x text-primary mb-3"></i>
        <h3 class="counter" data-target="15000">0</h3>
        <p class="fw-semibold">Registered Users</p>
      </div>
      <div class="col-md-3 mb-4">
        <i class="fa-solid fa-certificate fa-3x text-primary mb-3"></i>
        <h3 class="counter" data-target="25000">0</h3>
        <p class="fw-semibold">Certificate Issued</p>
      </div>
      <div class="col-md-3 mb-4">
        <i class="fa-solid fa-check fa-3x text-primary mb-3"></i>
        <h3 class="counter" data-target="34000">0</h3>
        <p class="fw-semibold">Completed Test</p>
      </div>
      <div class="col-md-3 mb-4">
        <i class="fa-solid fa-calendar-check fa-3x text-primary mb-3"></i>
        <h3 class="counter" data-target="300">0</h3>
        <p class="fw-semibold">Daily Participants</p>
      </div>
    </div>
  </div>
</section>

<section class="online-courses py-5">
  <div class="container-fluid">
    <h2 class="text-center fw-bold mb-5">Courses We Offer</h2>
    <div class="row g-4 justify-content-center">

<div class="col-6 col-md-4 col-lg-2">
        <div class="course-box text-center p-4 shadow-sm">
          <div class="icon-wrap mb-3">
            <i class="fa-regular fa-user fa-3x"></i>
          </div>
          <h5 class="fw-bold">Self-Discovery & Personality</h5>
          <p class="small">06 Courses</p>
        </div>
      </div>

<div class="col-6 col-md-4 col-lg-2">
        <div class="course-box text-center p-4 shadow-sm">
          <div class="icon-wrap mb-3">
            <i class="fa-solid fa-chart-line fa-3x"></i>
          </div>
          <h5 class="fw-bold">Leadership & Decision Making</h5>
          <p class="small">09 Courses</p>
        </div>
      </div>

<div class="col-6 col-md-4 col-lg-2">
        <div class="course-box text-center p-4 shadow-sm">
          <div class="icon-wrap mb-3">
            <i class="fa-regular fa-lightbulb fa-3x"></i>
          </div>
          <h5 class="fw-bold">Behaviour & Habits</h5>
          <p class="small">08 Courses</p>
        </div>
      </div>

<div class="col-6 col-md-4 col-lg-2">
        <div class="course-box text-center p-4 shadow-sm">
          <div class="icon-wrap mb-3">
            <i class="fa-regular fa-comments fa-3x"></i>
          </div>
          <h5 class="fw-bold">Professional Development</h5>
          <p class="small">13 Courses</p>
        </div>
      </div>

<div class="col-6 col-md-4 col-lg-2">
        <div class="course-box text-center p-4 shadow-sm">
          <div class="icon-wrap mb-3">
            <i class="fa-regular fa-handshake fa-3x"></i>
          </div>
          <h5 class="fw-bold">Relationship & Social Skills</h5>
          <p class="small">05 Courses</p>
        </div>
      </div>

</div>
  </div>
</section>

<section id="testimonials" class="container-fluid bg-white">
  <div class="container text-center" data-aos="fade-up">
    <h2 class="fw-bold mb-5">What Our Clients Say</h2>
    <div class="row g-4">
      <div class="col-md-4">
        <div class="p-4 border rounded shadow-sm">
          <p>"Good Character Opc transformed the way we conduct assessments. Students love it!"</p>
          <h6>- Principal, Green Valley School</h6>
        </div>
      </div>
      <div class="col-md-4">
        <div class="p-4 border rounded shadow-sm">
          <p>"The analytics feature helps us track student performance easily."</p>
          <h6>- Teacher, City College</h6>
        </div>
      </div>
      <div class="col-md-4">
        <div class="p-4 border rounded shadow-sm">
          <p>"Best quiz platform for corporate training. Highly recommended!"</p>
          <h6>- HR Manager, TechCorp</h6>
        </div>
      </div>
    </div>
  </div>
</section>

<section id="faq" class="container-fluid bg-light">
  <div class="container" data-aos="fade-up">
    <h2 class="fw-bold text-center mb-5">Frequently Asked Questions</h2>
    <div class="faq-item">
      <h6>Is Good Character Opc free to use?</h6>
      <p>We offer both free and premium plans depending on your needs.</p>
    </div>
    <div class="faq-item">
      <h6>Can I use it on mobile devices?</h6>
      <p>Yes, our platform is fully responsive and mobile-friendly.</p>
    </div>
    <div class="faq-item">
      <h6>Do you support multiple languages?</h6>
      <p>Yes, we support English, Urdu, Hindi, and more.</p>
    </div>
  </div>
</section>

<section id="contact" class="container-fluid bg-white">
  <div class="container" data-aos="fade-up">
    <h2 class="fw-bold text-center mb-4">Contact Us</h2>
    <form class="row g-3">
      <div class="col-md-6">
        <input type="text" class="form-control" placeholder="Your Name" required>
      </div>
      <div class="col-md-6">
        <input type="email" class="form-control" placeholder="Your Email" required>
      </div>
      <div class="col-12">
        <textarea class="form-control" rows="5" placeholder="Your Message"></textarea>
      </div>
      <div class="col-12 text-center">
        <button type="submit" class="btn btn-custom">Send Message</button>
      </div>
    </form>
  </div>
</section>

<footer>
  <span>© 2025 Good Character Opc | Designed & Managed By <a style="color: hsl(40.3, 100%, 48.4%);" href='https://ignitech.in/'>Ignitech.</a></span>
</footer>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
  AOS.init({ duration: 1000, once: true });

// Animated Counters
  const counters = document.querySelectorAll('.counter');
  counters.forEach(counter => {
    counter.innerText = '0';
    const updateCounter = () => {
      const target = +counter.getAttribute('data-target');
      const count = +counter.innerText;
      const increment = target / 100;
      if(count < target){
        counter.innerText = `${Math.ceil(count + increment)}`;
        setTimeout(updateCounter, 30);
      } else {
        counter.innerText = target+"+";
      }
    };
    updateCounter();
  });
</script>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: website.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation