KAI/index.html at main · arthmohan/KAI · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Kai</title>
    <link rel="stylesheet" href="styles.css">
    <script src="https://kit.fontawesome.com/276e5d92cb.js" crossorigin="anonymous"></script>
</head>
<body>
    <div class="navbar">
        <div class="logo"><a class="logo1" href="index.html">KAI</a></div>
        <div class="sjl"></div>
        <div class="menus">
            <div class="menuHome" id="menu"><a href="index.html">Home</a></div>
            <div class="menuTest" id="menu"><a href="test.html">Test</a></div>
            <div class="menuAbout" id="menu"><a href="about.html">About</a></div>
            <div class="menuContact" id="menu"><a href="contact.html">Contact Us</a></div>
            <div class="dropdown" id="menu">
                <i class="fa-solid fa-chevron-down"></i>
                <div class="dropdown-content">
                    <a href="index.html" id="dropHome">Home</a>
                    <a href="test.html" id="dropTest">Test</a>
                    <a href="about.html" id="dropAbout">About</a>
                    <a href="contact.html" id="dropContact">Contact Us</a>
                </div>
            </div>
        </div>
    </div>


    <div class="hero"><img id="hero" src="images/Skincare Collective.png" alt=""></div>

    <br><br>

    <div class="image-container">
        <a target="_blank" href="https://www.cerave.com/skin-smarts/skincare-tips-advice/what-skin-type-do-i-have#:~:text=If%20your%20skin%20appears%20shiny,you%20likely%20have%20normal%20skin.">
          <div class="image-box">
            <img src="images/ .jpg" alt="Image 4">
            <p class="image-title">Identify your skin type</p>
          </div>
        </a>
        <a target="_blank" href="https://poosh.com/gut-health-and-acne/">
          <div class="image-box">
            <img src="images/Simple Ways to treat dehydrated skin.jpg" alt="Image 1">
            <p class="image-title">Ways to treat dehydrated skin</p>
          </div>
        </a>
        <a target="_blank" href="https://poosh.com/best-foods-to-eat-for-longevity/">
          <div class="image-box">
            <img src="images/ -2.jpg" alt="Image 2">
            <p class="image-title">Best foods to eat for longevity</p>
          </div>
        </a>
        <a target="_blank" href="https://www.nordstrom.com/browse/content/blog/types-of-cleansers">
          <div class="image-box">
            <img src="images/Alleyoop gang's all here!.jpg" alt="Image 3">
            <p class="image-title">Types of cleansers</p>
          </div>
        </a>
      </div>

      <br><br>

    <a href="test.html"><label for="sB"><div class="submitBut"><button id="sB">Take the test</button></div></label></a>
    <br><br><br>

    <script src="script.js"></script>

</html>