HTML-CSS-Website/about.html at main · KalmanWebDesign/HTML-CSS-Website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial=1.0">
    <meta name="description" content="Alvin's Pizzeria">
    <meta name="keywords" content="pizza restuarant, pizza near me">
    <meta name="author" content="Kalman Web Design">
    <title>Alvin's Pizzeria About</title>
    <!-- google fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Baskervville:ital@0;1&display=swap" rel="stylesheet">
    <!-- stylesheet -->
    <link href="styles/styles.css" rel="stylesheet">
    <!-- font awesome cdn -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
        integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
    <script src="scripts/scripts.js" defer></script>
</head>

<body>
    <!-- overlay for mobile -->
    <div id="overlay">
        <div>
            <i class="fa fa-times" title="button to close mobile navigation" onclick="off()"></i>
        </div>
        <div class="overlay-text">
            <a href="index.html">Home</a>
            <a href="menu.html">Menu</a>
            <a href="about.html">About</a>
            <a href="order.html" class="order-nav">Order</a>
        </div>

    </div>
    <header>
        <nav class="nav full-nav">
            <div>
                <img src="images/alvins_pizza_resturant_logo.png" alt="alvins logo" style="width: 1.5rem;"
                    loading="lazy">
            </div>
            <div>
                <a href="index.html">Home</a>
                <a href="menu.html">Menu</a>
                <a href="about.html">About</a>
                <a href="order.html" class="order-nav">Order</a>
            </div>
        </nav>

        <!-- mobile -->
        <nav class="nav mobile-nav">
            <div>
                <img src="images/alvins_pizza_resturant_logo.png" alt="alvins logo" style="width: 1.5rem;" load="lazy">
            </div>
            <div>
                <i class="fa-solid fa-bars" title="button to open navigation" onclick="on()"></i>
            </div>
        </nav>
    </header>

    <main>
        <div class="red-spacer"></div>

        <!-- about -->
        <div>
            <h1>About Alvin's</h1>
            <div class="about">
                <img src="images/alvins_pizza_restuarant_owner.png " alt="alvins owner" loading="lazy"
                    style="width: 85%;">
                <div class="about-child2">
                    <div>
                        <h2>Our Mission</h2>
                        <p>
                            At Alvin's, we pride ourselves on staying true
                            to the culinary heritage of Italy. Our pizzas
                            are crafted using traditional techniques and
                            recipes passed down through generations,
                            ensuring an unparalleled dining experience
                            that captures the essence of Italy in every bite.
                        </p>
                        <a href="order.html">Order</a>
                    </div>

                </div>

            </div>
        </div>


    </main>

    <!-- footer -->
    <footer>
        <div>
            <img src="images/alvins_pizza_resturant_logo.png" alt="alvins logo" style="width: 10%;" loading="lazy">
        </div>
        <div>
            <div>
                <a href="index.html">Home</a>
                <a href="menu.html">Menu</a>
                <a href="about.html">About</a>
                <a href="order.html">Order</a>
            </div>
            <div>
                <h4>Copyright 2023 Alvin's Pizzeria</h4>
            </div>
        </div>
        <div>
            <img src="images/alvins_instagram.png" alt="alvins instagram logo" style="width: 10%;" loading="lazy">
            <img src="images/Alvins_facebook.png" alt="alvins facebook logo" style="width: 10%;" loading="lazy">
        </div>
    </footer>
</body>

</html>