-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
196 lines (179 loc) · 10.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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mohamed's Personal Site</title>
<!-- Bootstrap Javascript -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<!-- Fontawesome -->
<script src="https://kit.fontawesome.com/3c39ec91b5.js" crossorigin="anonymous"></script>
<!-- Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<!-- CSS Style Sheet -->
<link rel="stylesheet" href="css/styles.css">
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;500;900&family=Ubuntu:wght@300;400;700&display=swap" rel="stylesheet">
<!-- Favicon -->
<link rel="icon" href="favicon.ico">
</head>
<body>
<!-- Header -->
<nav class="navbar navbar-expand-lg navbar-light">
<a href="index.html" class="navbar-brand">
<img src="Mohamed.png" alt="Mohamed Marei Picture" class="headerimage" >
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo02" >
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav ms-auto ">
<li class="nav-item">
<a class="nav-link active" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Gallery.html">Gallery</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="">Updates</a>
</li>
</ul>
</div>
</nav>
<!-- Top Section -->
<div id="picmid" class="TopSec">
<h1 class="wierd" >Al-Salam Alaikum!</h1>
<h2 class="wierder">Welcome To My Website</h2>
</div>
<!-- Mid Section -->
<div class="gallerybox">
<div class="containerio">
<img src="profile picture.jpg" alt="Mohamed Marei Picture" id="pfp" >
<br>
<h1>Mohamed Marei</h1>
<h2><em>Fresh Graduate <strong>AURAK</strong>.</em></h2>
<p class="littletext" id="bio"> "I am an ambitious and creative Computer Engineering student, always looking forward
to learning more through useful experiences. I have demonstrated my creative and
artistic skills in my work. I am dedicated, resilient but also flexible when needed. Using
my social and technical skills, I always find an efficient way to complete the tasks at
hand."
</p>
<br>
<hr>
<br>
<h3>Education</h3>
<table style="margin:auto" cellspacing="10" cellpadding="5">
<tr>
<td>
<strong>Bachelor of Science in Computer Engineering</strong>
<br><em>American University of Ras Al Khaimah</em>
</td>
<td>
<strong>Highschool Diploma</strong>
<br><em>British International School of Tabuk</em>
</td>
</tr>
<tr>
<td style="text-align: left;">
<ul>
<li>Received full governmental scholarship</li>
<li>Current GPA 3.35 (0-4 GPA system)</li>
<li>IELTS score of 8</li>
</ul>
</td>
<td style="text-align: left; vertical-align: text-top;">
<ul>
<li>Dissertation: IGCSE and AL</li>
</ul>
</td>
</tr>
</table>
<hr>
<br>
<h3>Work Experience</h3>
<div style="padding:20px"></div>
<span class="workspan"><strong><em>2016</em></strong><br>Freelance Charater Artist</span>
<hr class="workrule">
<span class="workspan"><strong><em>2020</em></strong><br>Intern at Iconic Plus LLC</span>
<hr class="workrule">
<span class="workspan"><strong><em>2022</em></strong><br>Now looking for work</span>
<div style="padding:30px"></div>
</div>
</div>
<div class="galleryboxdark">
<br>
<h1>Top Skills</h1>
<h2>The best of what I can do</h2>
<hr>
<div class="skillrow">
<img src="Software.png" alt="" class="skillpicL">
<h3>Software Testing</h3>
<p>I've always had an eye for troubleshooting and a
leniancy towards quality. This skill grew with me as I explored the world of Computer Engineering, delving
within the realm of Software Testing. Surely, someone who prioritises efficiency in the field must value
automation, which I have learned through understanding how to utilise Cypress Automation tools.
</p>
</div>
<div class="skillrow">
<img src="Webdes.png" alt="" class="skillpicR">
<h3>Web Development</h3>
<p>Web design was my gate into web development. At first, I had utilized
my creative talent to create websites using tools such as Elementor and the website builders. However,
as I accustomed to the development and software field, my desire grew towards being able to run the whole
process, and so I worked on that.
</p>
</div>
<div class="skillrow">
<img src="Concept.png" alt=""class="skillpicL">
<h3>Character Concept Design</h3>
<p>My passion for concept design, making my own characters and
involving them in stories and backgrounds, helped me get a grasp on story based design. That paired
with a love for art, a field where I'm constantly improving despite initial talent, helps me grow towards
my goal of breaking into the higher ranks of the industry.
</p>
</div>
<div class="skillrow">
<img src="Hosting.png" alt=""class="skillpicR">
<h3>Speaking</h3>
<p>Utilizing my bilingual fluency and professional attitude, I've invested much of my time in
college in speaking related activities. Such activities range from hosting my own podcast,
to semi-formal parties and activities, to high calibre events such as commencement ceremonies.
</p>
</div>
</div>
<div>
<div class="gallerybox contact">
<br>
<h1>Get In Touch</h1>
<h2>Got your attention?</h2>
<hr>
<p class="contactP">Email me for awesome art, websites and much more! Just hit that button below and lets get started!</p>
<form action="mailto:[email protected]" method="post" enctype="text/plain">
<input class="Emailbox" type="email" name="Emailed from" placeholder="Your Email Here..." value="" >
<br>
<input class="btn btn-outline-dark btn-lg BlueButton" type="submit" value="CONTACT ME">
</form>
</div>
<!-- Footer -->
<div class="box" id="footer">
<div class="row" >
<div class="col-lg-3 footspan">
<a href="https://www.linkedin.com/in/mohamed-emam-marei/"><i class="fab fa-linkedin-in"></i> Linkedin</a></div>
<div class="col-lg-3 footspan">
<a href="https://www.instagram.com/emam.kensei/"><i class="fab fa-instagram"></i> Instagram</a>
</div>
<div class="col-lg-3 footspan">
<a href="https://twitter.com/Kensei_Emam"><i class="fab fa-twitter"></i> Twitter</a>
</div>
<div class="col-lg-3 footspan">
<a href="https://www.artstation.com/emamkensei"><i class="fab fa-artstation"></i> ArtStation</a>
</div>
</div>
<p>Property of Mohamed Marei 2022©</p>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</body>
</html>