<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ config('app.name', 'Laravel') }}</title>

    <link rel="apple-touch-icon" href="{{ asset('assets_website/img/apple-icon.png') }}">
    <link rel="shortcut icon" type="image/x-icon" href="{{ asset('assets_website/img/PEC-New-LOGO-300x300.png') }}">
    <!-- Load Require CSS -->
    <link href="{{ asset('assets_website/css/bootstrap.min.css') }}" rel="stylesheet">
      <link href="{{ asset('assets_website/css/bootstrap.css') }}" rel="stylesheet">
    <!-- Font CSS -->
    <link href="{{ asset('assets_website/css/boxicon.min.css') }}" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap" rel="stylesheet">
    <!-- Load Tempalte CSS -->
    <link rel="stylesheet" href="{{ asset('assets_website/css/templatemo.css') }}">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="{{ asset('assets_website/css/customm123.css') }}">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
</head>

<body>
    <!-- Top Bar -->
    <div class="container-fluid bg-top">
        <div class="container">
            <div class="row">
                <div class="col col-lg-6">
                    <div class="faq btn">
                        <a href="faq.php">How it works</a>
                    </div>
                </div>
                <div class="col col-lg-6 p-6">
                    <div class="social-icons">
                        <ul>
                            <li><a href="https://www.facebook.com/PECOfficial/"><i
                                        class="fa-brands fa-facebook"></i></a>
                            </li>
                            <li><a href="https://twitter.com/pecofficial?lang=en"><i
                                        class="fa-brands fa-twitter"></i></a>
                            </li>
                            <li><a
                                    href="https://www.linkedin.com/company/pakistan-engineering-council?originalSubdomain=pk"><i
                                        class="fa-brands fa-linkedin"></i></a></li>
                            <!--<li> <a href="#"><i class="fa-brands fa-instagram-square"></i></a></li>-->
                        </ul>
                    </div>
                </div>
            </div>
        </div>

    </div>

    <!-- Header -->
    <nav id="main_nav" class="navbar navbar-expand-lg navbar-light bg-white shadow menu-bar">
        <div class="container d-flex justify-content-between align-items-center">
            <a class="navbar-brand" href="/">
                <img class="img-fluid" src="{{ asset('assets_website/img/pec_logo.png') }}" alt="">
            </a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent">
                <ul class="navbar-nav ml-auto">
                    <li class="nav-item">
                        <a class="nav-link btn-outline-primary rounded-pill px-3 sub-menu-1" href="{{ route('about') }}">About
                            Us</a>
                        <div class="sub-menu">
                            <ul>
                                <li class="sb-menu1"><a href="{{ route('members') }}">Members</a></li>
                                <li class="sb-menu2"><a
                                        href="https://verification.pec.org.pk/l/cl/index.aspx">Consultant
                                        Directory</a>
                                </li>
                                <li class="sb-menu3"><a href="{{ route('faq') }}">FAQs</a></li>
                            </ul>
                        </div>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link btn-outline-primary rounded-pill px-3" href="{{ route('regulations') }}">Regulations</a>
                    </li>
                    <li class="nav-item">
                        {{-- <a class="nav-link btn-outline-primary rounded-pill px-3" href="{{ route('projects') }}">Projects</a> --}}
                    </li>
                    <li class="nav-item">
                        <a class="nav-link btn-outline-primary rounded-pill px-3" href="{{ route('partners') }}">Our
                            Partners</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link btn-outline-primary rounded-pill px-3" href="{{ route('contact') }}">Contact Us</a>
                    </li>
                    <!-- login dropdown -->
                    <!-- Authentication Links -->
                    @guest
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle text-light navbarDropdown" href="#" id="navbarDropdown"
                            role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            Signup
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <li><a class="dropdown-item text-primary"
                                    href="{{ route('login') }}/client">Client</a></li>
                            <li><a class="dropdown-item text-primary"
                                    href="{{ route('login') }}/consultant">Consultant</a></li>
                    </li>
                </ul>
                </li>
                @else
                <li class="nav-item">
                    <a class="nav-link btn-secondary rounded-pill px-3" href="#"
                        onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
                    <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                        @csrf
                    </form>
                </li>
                @endguest
                </ul>
            </div>
            <div class="navbar ">
            </div>
        </div>
        </div>
    </nav>
    <!-- Close Header -->

@yield('content')

    <!-- Start Footer -->
    <footer class="bg-secondary mt-5 footer-section">
        <div class="container">
            <div class="row py-4">

                <div class="col-lg-12 col-12 align-center ">
                    <a class="navbar-brand text-center" href="index.html">
                    </a>
                    </p>
                    <div class="quicklinl text-center">
                        <ul class="list-unstyled text-light light-300 d-flex justify-content-center">
                            <li class="pb-2 text-center">
                                <i class='bx-fw bx bxs-chevron-right bx-xs'></i><a
                                    class="text-decoration-none text-light"
                                    href="https://pec.org.pk/pec%20privacy%20policy%20ver%201.0.docx.html">Privacy
                                    Policy</a>
                            </li>
                            <li class="pb-2 text-center">
                                <i class='bx-fw bx bxs-chevron-right bx-xs'></i><a
                                    class="text-decoration-none text-light py-1"
                                    href="https://pec.org.pk/PEC%20Disclaimer.docx.html">Disclaimer</a>
                            </li>
                        </ul>
                    </div>
                    <div class="contact text-center">
                        <ul class="list-unstyled text-light light-300">
                            <li class="pb-2">
                                <i class='bx-fw bx bx-phone bx-xs'></i><a class="text-decoration-none text-light py-1"
                                    href="tel:(+92-51) 111-111-732">(+92-51) 111-111-732</a>
                            </li>
                            <li class="pb-2">
                                <i class='bx-fw bx bx-mail-send bx-xs'></i><a
                                    class="text-decoration-none text-light py-1"
                                    href="mailto:www.pec.org.pk">www.pec.org.pk</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <div class="w-100 bg-primary Copyright py-1">
            <div class="container">
                <div class="row pt-1">
                    <div class="col-lg-12 col-sm-12">
                        <p class=" text-center text-light light-300">
                            © Copyright 2022 Pakistan Engineering Council. All Rights Reserved.
                        </p>
                    </div>
                </div>
            </div>
        </div>

    </footer>
    <!-- End Footer -->


    <!-- Bootstrap -->
    <script src="{{ asset('assets_website/js/bootstrap.bundle.min.js') }}"></script>
    <!-- Load jQuery require for isotope -->
    <script src="{{ asset('assets_website/js/jquery.min.js') }}"></script>
    <!-- Isotope -->
    <script src="{{ asset('assets_website/js/isotope.pkgd.js') }}"></script>
    <!-- Page Script -->
    <script>
        $(document).ready(function() {

        $('.counter').each(function () {
        $(this).prop('Counter',0).animate({
        Counter: $(this).text()
        }, {
        duration: 4000,
        easing: 'swing',
        step: function (now) {
        $(this).text(Math.ceil(now));
        }
        });
        });

        });
    </script>
    <script>
        $(window).load(function () {
            // init Isotope
            var $projects = $('.projects').isotope({
                itemSelector: '.project',
                layoutMode: 'fitRows'
            });
            $(".filter-btn").click(function () {
                var data_filter = $(this).attr("data-filter");
                $projects.isotope({
                    filter: data_filter
                });
                $(".filter-btn").removeClass("active");
                $(".filter-btn").removeClass("shadow");
                $(this).addClass("active");
                $(this).addClass("shadow");
                return false;
            });
        });

    </script>

    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
        integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous">
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"
        integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous">
    </script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js"
        integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous">
    </script>
    <!-- Templatemo -->
    <script src="{{ asset('assets_website/js/templatemo.js') }}"></script>
    <script src="{{ asset('assets_website/js/custom.js') }}"></script>

</body>

</html>
