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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Contact</title>
    <link rel="stylesheet" href="./assets/css/style.css">
    <link rel="stylesheet" href="./assets/css/all.min.css">
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/fontawesome.min.css">
    <link rel="shortcut icon" href="./assets/images/nav-logo.png" type="image/x-icon">
</head>

<body>
    <!-- navbar here -->
    <nav class="navbar navbar-expand-lg navbar-light">
        <div class="container-fluid res-nav">
            <a class="navbar-brand nav-logo" href="./index.php">
                <img src="./assets/images/nav-logo.png" alt="Logo">
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
                aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse nav-gap" id="navbarNav">
                <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                    <li class="nav-item">
                        <a class="nav-link" href="./index.php">Home</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="./about.php">About</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="./menu.php">Menu</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="./contact.php">Contact</a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="./feedback.php">Feedback</a>
                    </li>
                </ul>
                <button class="nav-btn" type="button"><i class="fa-solid fa-cart-shopping"></i> | <i
                        class="fa-solid fa-user"></i></button>
            </div>
        </div>
    </nav>
    <!-- navbar here -->

    <!-- header here  -->
    <div class="header">
        <div class="header-content">
            <h1>Contact<span class="bg-white">Us</span></h1>
            <p>Indulge in a culinary delight with every bite! Fresh, delicious, and healthy dishes to make every meal
                special. Order now and satisfy your hunger with happiness!</p>
            <div class="header-btn d-flex">
                <button class="header-btn-1">Delivery</button>
                <button class="header-btn-2">Online , Call-in , Walk- in <img
                        src="./assets/images/left-arrow.png"></button>
            </div>
        </div>
    </div>
    <!-- header here  -->

    <!-- contact us map section here  -->
    <div class="contact-column d-flex gap-5 ">
        <div class="contact-content">
            <h1>Discover Our Culinary Delights</h1>
            <p>Nestled in the heart of the city, our restaurant offers a unique culinary experience that combines
                tradition with innovation. Our chefs use only the freshest, locally sourced ingredients to create dishes
                that tantalize your taste buds and leave you craving for more. From mouth-watering appetizers to
                exquisite main courses and decadent desserts, each item on our menu is crafted with passion and
                precision. Whether you're in the mood for a hearty meal or a light snack, we have something to satisfy
                every palate. Come and join us for a memorable dining experience that will transport you to a world of
                flavors and aromas. Our friendly staff is here to ensure that your visit is enjoyable and that you leave
                with a smile. Visit us today and let us take you on a culinary journey like no other!</p>
            <ul class="contact-list">
                <li class="contact-item"><a href="tel: 847-677-0211"><span class="contact-icon"><i
                                class="fa-solid fa-phone"></i></span> 847-677-0211</a></li>
                <li class="contact-item"><a href="mailto:info@canadawebcoders.com"><span class="contact-icon"><i
                                class="fa-solid fa-envelope"></i></span> info@stargyros.com</a></li>
                <li class="contact-item"><a href="#"><span class="contact-icon"><i
                                class="fa-solid fa-location-dot"></i></span> 4710 Dempster Street Skokie, IL 60076</a>
                </li>
            </ul>
        </div>

        <div class="contact-map">
            <iframe
                src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2963.0978079043184!2d-87.74774972475599!3d42.041082955195364!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x880fcf7226ef10a1%3A0x544e33d44d325b71!2s4710%20Dempster%20St%2C%20Skokie%2C%20IL%2060076%2C%20USA!5e0!3m2!1sen!2s!4v1721418935417!5m2!1sen!2s"
                width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"
                referrerpolicy="no-referrer-when-downgrade" class="map-res2"></iframe>
        </div>
    </div>
    <!-- contact us map section here  -->

    <!-- Contact Form Starts Here -->
    <div class="contact_form">
        <div class="contact_info">
            <h1>Contact Information</h1>
            <p>If you have any questions, comments, or feedback about our food, please don't hesitate to get in touch
                with us. Our dedicated team is always ready to assist you and ensure you have the best experience with
                our services. You can reach us via email at [your email address], or give us a call at [your phone
                number]. We are available from [your working hours] to respond to your queries and address any concerns
                you might have.</p>

            <p>In addition to email and phone, you can also visit us at our physical location at [your address]. We love
                meeting our customers in person and hearing your thoughts directly. Your satisfaction is our top
                priority, and we are committed to providing prompt and helpful responses to all your inquiries. Thank
                you for choosing us, and we look forward to hearing from you soon!</p>
        </div>
        <div class="form-container">
            <form>
                <div class="column-inp">
                    <input type="First Name" placeholder="First Name" class="f-name" required>
                    <input type="Last Name" placeholder="Last Name" class="l-name" required>
                </div>
                <input type="email" placeholder="Enter Your Email" class="inp-email">
                <input type="password" placeholder="Enter Your Password" class="inp-pass">
                <textarea rows="4" placeholder="Message"></textarea>
                <button class="button-tr">Submit <img src="./assets/images/arrow-2.png"></button>
            </form>
        </div>
    </div>
    <!-- Contact Form End Here -->

    <!-- footer here  -->
    <footer>
        <div class="footer-logo">
            <img src="./assets/images/Footer.png">
        </div>

        <form class="footer-content footer-form">
            <h3>Sign up for Pita Inn promos, news and more delivered straight to your inbox.</h3>
            <input type="email" placeholder="Email Address" required>
            <button>Subscribe</button>
        </form>

        <div class="footer-content">
            <ul>
                <li><a href="#">ORDER NOW</a></li>
                <li><a href="#">BUY A GIFT CARD</a></li>
                <li><a href="#">FIND OUR HUMMUS</a></li>
            </ul>
        </div>

        <div class="footer-content">
            <p><a href="#"><i class="fa-brands fa-instagram"></i></a> <a href="#"><i
                        class="fa-brands fa-facebook"></i></a></p>
            <h3>Star Gyros 2024 
                Site by BatesMeron</h3>
        </div>
    </footer>
    <!-- footer here  -->

    <script src="./assets/js/bootstrap.bundle.min.js"></script>

</body>

</html>