<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Government Technical College Ado Soba/News</title>
  <link rel="stylesheet" href="main.css">
  <link rel="icon" type="image/x-icon" href="images/schoollogo.png">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" />
  <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" />
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
  <!--Import Bootstrap 5-->
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
    integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
    crossorigin="anonymous"></script>
  <script src="https://code.jquery.com/jquery-3.7.1.min.js"
    integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
  <style>
    #blog-container5 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 22rem;
      padding: 20vw;
      padding-top: 7rem;
    }


    #blog-container5 a {
      text-decoration: none;
    }

    .news-h1 {
      text-align: center;
      font-size: 220%;
      font-weight: bold;
      padding-top: 6rem;
    }

    #blog-container5 p {
      width: 100%;
      text-align: justify;
    }

    #blog-container5 img {
      width: 30rem;
      height: 40vh;
    }


    .news-year {
      color: rgb(0, 0, 107);

    }

    #blog-container.blogs .post {
      color: #29303b;
      padding: 15px 0 10px 0;
    }

    .read5 {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
    }

    .nn-top5 {
      font-weight: bold;
      margin-bottom: 1rem;
    }
    @media (max-width: 769px){
      #blog-container5 {
      padding-top: 10rem;
    }
    }
    @media (max-width: 475px){
    
    #blog-container5 img {
  width: 20rem;
  height: 40vh;
}
#blog-container5 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 22rem;
  padding: 6vw;
  padding-top: 9rem;
}
nav img{
    width: 102px;
  }
 }
 @media (max-width: 1466px){
      #blog-container5 {
      display: grid;
      grid-template-columns: 1fr 1fr;
 
      padding: 30vw;
      padding-top: 7rem;
    }
    }
    @media (max-width: 1200px){
      #blog-container5 {
      display: grid;
      grid-template-columns: 1fr 1fr;
 
      padding: 22vw;
      padding-top: 7rem;
    }
    }
  </style>
</head>
  <!--Navigation -->
  <nav>
    <img src="images/schoollogo.png" alt="schoollogo">
    <h6 class="gtc">Government Technical College Ado-Soba</h6>
    <div class="navigation">
        <ul>
            <i id="menu-close" class="fas fa-times"></i>
            <li><a href="index.html">Home</a>
            </li>
            <li><a href="About.html">About</a></li>
            <li><a class="active" href="News.html">News</a></li>
            <li><a href="Sections.html">Sections</a></li>
            <li><a href="Admission.html">Admission</a></li>
            <li><a href="Contacts.html">Contacts</a></li>

        </ul>
        <img id="menu-btn" src="images/menu button.png" alt="">
    </div>
</nav>
</div>
</nav>

<body>
  <section id="blog-container5">
    <div class="blogs5">
      <div class="post5">
        <div class="bo-img5">


          <div class="ne2">
            <h4 class="news-year5">

            </h4>

            <div id="carouselExampleFade" class="carousel slide carousel-fade" data-bs-ride="carousel">
              <div class="carousel-inner">
                <div class="carousel-item active">
                  <img class="bo-img" src="images/prefect 2024-2025 1.jpg" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                  <img class="bo-img" src="images/prefect 2024-2025 2.jpg" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                  <img class="bo-img" src="images/prefect 2024-2025 3.jpg" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                  <img class="bo-img" src="images/prefect 2024-2025 4.jpg" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                  <img class="bo-img" src="images/prefect 2024-2025 5.jpg" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                  <img class="bo-img" src="images/prefect 2024-2025 6.jpg" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                  <img class="bo-img" src="images/prefect 2024-2025 7.jpg" class="d-block w-100" alt="...">
                </div>
              </div>
              <div class="nn-date">
                <i class="fa fa-calendar-alt">September 0, 24</i>

              </div>
              <p class="nn-top5">
                INTRODUCING THE NEW STUDENT LEDADERS <br>
              </p>
              <hr class="top-hr5">
              <p class="nn-wr5">
                We are excited to announced the decoration
                the Student Representative Council for the
                2024/2025 Academic Session of <a href="">Government Technical College Ado Soba.</a>
                This council will serve as a platform for student leadership and coordination,
                representing all the prefects, governors and assistant governors within the college.

              </p>
              <p>
                Congratulations to Happiness Ejewi (<a href="">Motor Vehicle Mechanics Works</a>), Our
                new HEAD BOY, and Amu Gift(<a href="">Catering</a>), our HEAD GIRL. These outstanding leaders
                will guide and inspire their peers towards excellence. We'are proud to see this new generation of
                leaders
                rise and take charge!
              </p>
              <p>
                Let's celebrate their commitment to leadership, growth, and teamwork!
              </p>
              <p class="read5">
                <a href="">Previous<i></i></a>
                <a href=""> Next<i></i></a>
              </p>
            </div>

          </div>
  </section>
  <footer>
    <div class="footer-col">
      <h4>INFORMATION</h4>
      <li>Contact</li>
      <li>About Us</li>
      <li>News</li>
      <li>Sections</li>
    </div>
    <div class="footer-col">
      <h4>USEFUL LINKS</h4>
      <li>Our College Team</li>
      <li>Admission</li>
      <li>Features</li>
      <li>Events</li>
    </div>

    <div class="footer-col">
      <h4>NEWSLETTER</h4>
      <p>Get latest updates offers </p>
      <div class="subscribe">
        <input type="text" placeholder="Your Email address">
        <br><a href="" class="yellow">SUBSCRIBE</a>

      </div>
    </div>

    <div class="footer-col">
      <h4>CONTACT</h4>
      <p>Address: <br> Government Technical College,<br> Ado-Soba,<br>Festac Extension, <br> Abule Ado Bus Stop
        <br>Lagos
        Badagary Expressway, lagos</p>
      <p>Phone: <br> +234 000 000 000 0000 <br> +234 000 000 000 0000</p>
      <p>Email: <br>governmentechnicalcollege <br> adosoba@gmail.com</p>
    </div>
    <div class="copyright">
      <p> Copyright ©2024 All Right Reserve Designed by <br></p>
      <di class="pro-linkss">
        <h4 class="copy-h4">FOLLOW US</h4>
        <a href=""><i class="fab fa-facebook-f"></i></a>
        <a href=""><i class="fab fa-twitter"></i></a>
        <a href=""><i class="fab fa-instagram"></i></a>
        <a href=""><i class="fab fa-youtube"></i></a>
        <a href=""><i class="fab fa-linkedin-in"></i></a>
    </div>
    </div>
  </footer>
  <script>
    $("#menu-btn").click(function () {
      $("nav .navigation ul").addClass("active")
    });

    $("#menu-close").click(function () {
      $("nav .navigation ul").removeClass("active")
    });
    
    document.addEventListener('contextmenu',(e) => {
            e.preventDefault()
            
            return false

        })
        document.addEventListener("keydown", function (event) { if (event.ctrlKey){ 
          event.preventDefault();
      }
      if(event.keyCode == 123) {
          event.preventDefault();
          }
          })
        document.addEventListener('Keydown',(e) => {
             if(e.ctrlKey || e.keyCode == 123){
                 e.stopPropagation()
                 e.preventDefault()
             }
            
            })
  </script>
</body>
</body>

</html>