-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
159 lines (121 loc) · 8.1 KB
/
index.html
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
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="stylesheet" href="style.css">
<title>Charmain</title>
</head>
<body>
<span>
<nav>
<div class="logo">
<p>About Charmain</p>
</div>
<ul>
<li><a href=""class="active">home</a></li>
<li><a href="https://www.linkedin.com/in/charmain-bonareri-71a209126/" target="_blank">about me</a></li>
<li><a href="https://web.facebook.com/charmainart" target="_blank">my hobbies</a></li>
<li><a href="https://www.linkedin.com/in/charmain-bonareri-71a209126/details/experience/" target="_blank">experience</a></li>
<li><a href="https://www.linkedin.com/in/charmain-bonareri-71a209126/overlay/contact-info/" target="_blank">my contact</a></li>
</ul>
</nav>
</span>
<div style="display:flex;justify-content:center;align-items:center;background-color: #05080f">
<img src="./charmain-images/blackfront.jpg" alt="This is charmain" height="800px; width:1000px"></div>
<p class="one" style="text-align: center;">Hey, I am</p>
<h2 class="two">Charmain Bonareri</h2>
<div id="button">
<a href="https://www.linkedin.com/in/charmain-bonareri-71a209126/" target="_blank"><button id="linkedin">View my full profile</button> </a>
<ion-icon name="logo-linkedin"></ion-icon>
</div>
<div id="container">
<img src="./charmain-images/official1.png" alt="This is an image about me" height="550px; width:450px">
<div id="text">
<h1>This is me</h1>
<p>
Now I know what you are thinking, I am thinking the same too shem. I pride myself in being a creative artist that is, I draw with graphite
and charcoal and create a piece of art that can put you into a good mood. I am inlove with colors and design.<br>
<i style="color: hotpink;font-weight:700;">I am a sanguine hence my love for vibrant colors.</i></p>
<p>You know the way life changes so quickly nowadays? I had to be flexible and swiftly moved into <em>digital marketing.</em>
I now have extensive skill in building, maintaining and running digital marketing strategies. I am still learning to adapt to the many changes. </p>
<p>Very proud of being a Kenyatta University alumni! after doing social sciences. I graduated in 2019 with high hopes of a very accepting market but sometimes
the grass is greener where you are, and for me that is the diaspora of Rongai massive. </p>
</div>
</div>
<div class="split left">
<div class="centered">
<img src="./charmain-images/grad1.png" width="400px height:400px">
<h2 style="color: #05080f;">Educational background</h2>
<p>Like most of you, what I did in Uni is very different from what I practise now. I did politics proudly
in Kenyatta University, <i style="color: #05080f; font-weight: bold;"> probably the reason I love interacting with people.</i>
</p>
<p>Everyday I keep finding ways of upskilling myself, hence my presence in Moringa School.
<strong> What they don't teach us in the 844 system is being a student is easy. Learning requires actual work!</strong> </p>
</div>
</div>
<div class="split middle">
<div class="centered">
<img src="./charmain-images/myhobbiesupdated.png" width="400px height:400px">
<h2 style="color: #37b323;"> My hobbies</h2>
<p>If I am not talking or laughing, <i style="color: #05080f; font-weight: bold;" >"He who laughs most learns best", </i>most definitely, <i>I am drawing.</i> I realized in early 2020 that I actually did not have a hobby, so I
set out to look for one and enrolled in drawing classes.</p>
<p><strong>I also read books often. I keep learning, live as if you were to die tomorrow. Learn as if you were to live
forever.</strong> </p>
</div>
</div>
<div class="split middle1">
<div class="centered">
<img src="./charmain-images/exp3.png" width="400px height:400px">
<h2 style="color: #4f4d66;"> Experience</h2>
<p>Highly motivated digital marketing enthusiast with extensive skill in building, maintaining and running <i style="font-weight: bold;">digital marketing strategies.</i>
I have broad marketing knowledge coupled with focused advertising.</p>
<p>I am adept at creating and implementing client centered,
successful campaigns aimed at improving brand awareness and presence.</p>
</div>
</div>
<div class="split right">
<div class="centered">
<img src="./charmain-images/projects4.png" width="400px height:400px">
<h2 style="color: #8f2636;"> Projects</h2>
<p><strong>Programing is 10% writing code and 90% understanding why it's not working. <i style="font-weight: bold;">
Projects are meant to be fun!</i></strong> "Don't worry if it doesn't work right, try restarting your machine," they say.</p>
<p> Here are some of my projects:
<ul style="color: rgb(16, 95, 221); list-style: circle; align-content: center; font-weight: bold;">
<li><a href="https://charmain-bonareri.github.io/Hello-world/" target="_blank">Hello World</a></li>
<li><a href="https://charmain-bonareri.github.io/myfirst-webpage/">My First Webpage</a></li>
<li><a href="https://charmain-bonareri.github.io/intro-to-css/">Intro to HTML and CSS</a></li>
</ul>
</p>
</div>
</div>
<div class="text-box">Shout out to my TM, Mercy Nzau.</div>
<p class="paragraph">You can find me on Github. My username is <i>Charmain Bonareri.</i> You could follow me to see my incomplete and complete repositories. I promise to follow back and check out
your repositories as well. In the famous words of Benjamin Franklin
<i style="color: hotpink; font-size: large; font-weight: bold;" >“Tell me and I forget, teach me and I may remember, involve me and I learn.”</i>
Keep your head up, this coding stuff, we will try until we hack it!
</p>
<ol>
<li><a href="https://web.facebook.com/Charmain.Bonareri1" target="_blank"><i class="fa fa-facebook"></i></a></li>
<li><a href="https://twitter.com/CharmainNaomi"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://www.instagram.com/charmain_bonareri/"><i class="fa fa-youtube"></i></a></li>
<li><a href="https://www.linkedin.com/in/charmain-bonareri-71a209126/"><i class="fa fa-linkedin"></i></a></li>
<li><a href="https://www.instagram.com/charmain_bonareri/"><i class="fa fa-instagram"></i></a></li>
</ol>
<p class="close">This website uses cookies to ensure you get the best experience on my website. Read my Cookie Policy to learn more.
© 2022 Charmain Bonareri. All Rights Reserved.</p>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"></script>
</body>
</html>