getting-smarter/index.html at master · kwennB/getting-smarter · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>my website</title>

    <link href="font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">

    <link rel="stylesheet"  href="css/style.css">
</head>
<body>

    <!--Header Section-->
    <div class="header">
       <a href="#default" class="logo"><img src="images/b with crown.jpeg"></a>
        <div class="header-right">
            <ul>
                <li><a class= "active" href= "/home/" >HOME</a></li>
                <li><a href= "/about me/" >ABOUT ME</a></li>
                <li><a href= "/contact me/" >CONTACT ME</a></li>
                <li><a href= "/gallery/" >GALLERY</a></li>
            </ul>
        </div>
    </div>

    <!--Hero Section-->
   <section id="hero">
       <div class="hero-image">
           <div class="hero-text">
               <h4>I'm Bibi <br> I'm a Web-Developer</h4>
                <a href="#" class="button">Hire Me</a>
           </div>
       </div>
   </section>

   <section id="about-me">
        <h2>About Me</h2>
        <div class="row">
            <div class="column1">
                <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi rerum impedit sint rem ut eos nobis optio expedita necessitatibus odit cupiditate aperiam illum nulla commodi qui, vel deleniti quod? Veritatis?
                    Lorem ipsum dolor sit amet consectetur adipisicing elit. Autem iste similique placeat recusandae sint quod, nostrum laudantium quis tempore obcaecati beatae, expedita esse suscipit excepturi minus soluta? Est, non natus? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae optio at alias deleniti qui, excepturi cum rem obcaecati delectus nesciunt porro ducimus quas quisquam sunt nam ullam cupiditate doloribus eius. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Aspernatur earum sequi eligendi pariatur voluptatibus molestiae incidunt neque aliquid voluptas cumque aut quidem, hic labore veniam. Eligendi quos autem qui earum?
                </p>
            </div>
            <div class="column2">
                <img src= "images/bb-in-jeanjacket.jpg">
                <p>You can be whoever you choose to be</p>
            </div>
        </div>
    </section>

    <section id="gallery">
        <h2>GALLERY</h2>
        <div class="row">
            <div class="column">
                <div class="card">
                    <img src="images/bb-in-jeanjacket.jpg" class="img1">
                    <p>A picture of bibi in jean jacket</p>
                </div>
            </div>

            <div class="column">
                <div class="card">
                    <img src="images/bb-orangeTop.jpg">
                    <p>Get-together at millenium park</p>
                </div>
            </div>

            <div class="column">
                <div class="card">
                    <img src="images/bb-whiteSng.jpg">
                    <p>At ART and Culture Center </p>
                </div>
            </div>

            <div class="column">
                <div class="card">
                    <img src="images/blue-water.jpg" class="img4">
                    <p>A picture of the blue sea and some lives in it</p>
                </div>
            </div>
        </div>
    </section>

    <div class="awesome">
        <i class="fa fa-3x fa-meetup"></i><a href=""> Meetup</a>
        <i class="fa fa-3x fa-whatsapp"></i><a href=""> Whatsapp</a>
        <i class="fa fa-3x fa-facebook"></i><a href=""> Facebook</a>
        <i class="fa fa-3x fa-telegram"></i><a href=""> Telegram</a>
        <i class="fa fa-3x fa-twitter"></i><a href="">  Twitter</a>
    </div>


    <script src="js/app.js"></script>
</body>
</html>