<!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/Sections</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>
        /* courses */
        .course9-btn {
            border: 1px solid rgb(0, 0, 107);
            text-decoration: none;
            font-size: 0.8rem;
            padding: 13px 35px;
            color: rgb(0, 0, 107);
            font-weight: 600;
            border-radius: 3px;
            text-align: center;
            text-align: center;
            display: inline-block;
            margin: 1rem;
            transition: 0.3s ease;
        }

        .course9-btn:hover {
            transform: scale(1.1);
            background-color: rgb(0, 0, 107);
            color: rgb(255, 255, 255);
        }

        .hero9 {

            overflow: hidden;
        }

        nav img{
    width: 102px;
  }
        .container9 {
            
            display: flex;
            justify-content: center;
            align-items: center;
            width: 90%;
            margin: 65px auto;
        }

        .hero-content9 {
            flex: 1;
            width: 600px;
            margin: 0px 25px;
            animation: fadeInUp 2s ease;
        }

        .hero-content9 h2 {
            font-weight: bold;
            font-size: 150%;
        }

        .hero-content9 p {
            color: rgb(21, 21, 100);
        }

        .hero-image9 {
            padding-bottom: 6rem;
            flex: 1;
            width: 600px;
            margin: auto;
            animation: fadeInRight 2s ease;
        }

        .sec-p9 {
            text-align: justify;
        }

        .sec-h1 {
            font-size: 220%;
            font-weight: bold;
            padding-top: 8rem;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .sec-img9 {
            width: 80%;
            height: 35vh;
            border-radius: 4px;


        }
        @media(max-width:475px){
          .hero9 {
                padding-top: 3rem;
            }

            .container9 {
                width: 124%;
                flex-direction: column-reverse;
                margin: 0px;
                padding: 10px 10px;
                margin-bottom: 4rem;
                
            }

            .hero-content9 {
              width: 78%;
              text-align: justify;
                margin: 0px 0px;
                margin-top: -2rem;
                margin-left: -6rem;
            }

            .hero-h2 {
                font-size: 30px;
            }

            .hero-content9 p {
                font-size: 18px;
               text-align: justify;

            }

            .hero-image9 {
                width: 100%;
            }
            .sec-img9 {
            width: 80%;
          height: 30vh;
          border-radius: 4px;
        
          
        }
      
        
        }
    </style>
</head>

<body>
  <!--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 href="News.html">News</a></li>
            <li><a class="active" 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>
    <section class="hero9">
        
        <h1 class="sec-h1">Construction</h1>
        <div class="container9">

            <div class="hero-content9">

                <div class="sec-wr9">

                    <h2 class="hero-h2">Plumbing and pipefitting</h2>
                    <p class="sec-p9">is a specialized field that deals with knowledge and hand-on skills need to install, maintain, and repair plumbing systems. Students will learn about pipefitting fixtures, water supply and drainage systems, as well as heating and ventilation systems. The course covers essential skills such as pipe fitting, soldering, welding, system troubleshooting, and understanding plumbing codes and regulations. Emphasis 
                        is placed on safety standards and efficient problem-solving techniques. Graduates of the course are prepared to work in residenial, commercial, and industrial plumbing, with a strong foundation in both repair and installation tasks
                    </p>
                    <a class="course9-btn" href="registraton.html">Apply Now <i class="fa fa-arrow-right"></i></a>
                </div>
            </div>
            <div class="hero-image9">
                <img class="sec-img9" src="images/plumbing and pipefitting.jpg" alt="">
            </div>


        </div>


    </section>
    </div>
    <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>Sections</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>

</html>