-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
236 lines (226 loc) · 18.9 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
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gridx Personal Portfolio Light Version</title>
<!-- CSS -->
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<!-- Nav -->
<section class="hidden">
<div class="cro-navbar">
<div class="cro-navbar-wrapper container">
<div class="cro-navbar-img">
<a href="#" class="cro-navbar-img-logo">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/logo-dark.svg" alt="" class="cro-navbar-img-logoImg">
</a>
</div>
<!-- <div class="cro-navNav"></div> -->
<div class="cro-navbar-nav">
<ul class="cro-navbar-nav-ul">
<li class="cro-navbar-nav-li liOne"><a href="./index.html">Home</a></li>
<li class="cro-navbar-nav-li liTwo"><a href="./about.html">About</a></li>
<li class="cro-navbar-nav-li liThree"><a href="./work.html">Works</a></li>
<li class="cro-navbar-nav-li liFour"><a href="./contact.html">Contact</a></li>
</ul>
</div>
<div class="cro-navbar-logIn">
<a href="./contact.html" class="theme-btn">Let's talk</a>
</div>
</div>
<div class="cro-hamburg">
<span class="cro-bar"></span>
<span class="cro-bar"></span>
<span class="cro-bar"></span>
</div>
</div>
</section>
<!-- About -->
<section class="hidden">
<div class="cro-about-area">
<div class="cro-about-area-wrapper container">
<div class="cro-about-area-sectionOne">
<div class="cro-about-area-sectionOne-img about-me-box">
<a href="./about.html" class="cro-about-area-sectionOne-img-link">
<div class="cro-about-area-sectionOne-img-box">
<img src=" https://wpriverthemes.com/gridxlight/wp-content/uploads/2023/04/me.png" alt="" class="cro-about-area-sectionOne-img-boxImg">
</div>
<div class="cro-about-area-sectionOne-des">
<h4 class="cro-about-area-sectionOne-des-h4">A WEB DESIGNER</h4>
<h1 class="cro-about-area-sectionOne-des-h1">David Henderson.</h1>
<p class="cro-about-area-sectionOne-des-p">I am a Web Designer based in san fransisco.</p>
<a href="#" class="cro-about-area-sectionOne-des-btn">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</a>
</div>
</a>
</div>
<div class="cro-about-area-sectionOne-details">
<div class="cro-about-area-sectionOne-details-tab">
<div class="cro-text-wrapper">
<h4 class="cro-about-area-sectionOne-details-tab-h4">Lorem ipsum dolor sit amet consectetur adipisicing.</h4>
</div>
</div>
<div class="cro-about-area-sectionOne-details-tab-img">
<div class="cro-about-area-sectionOne-details-tab-imgOne">
<a href="#" class="cro-about-area-sectionOne-details-tab-imgOne-link"></a>
<img src="https://wpriverthemes.com/gridxlight/wp-content/uploads/2023/04/sign.png" alt="" class="cro-about-area-sectionOne-details-tab-imgOne-linkImg">
<div class="cro-about-area-sectionOne-details-tab-imgOne-details">
<div class="cro-about-area-sectionOne-details-tab-imgOne-det">
<h4 class="cro-about-area-sectionOne-details-tab-imgOne-det-h4">MORE ABOUT ME</h4>
<h1 class="cro-about-area-sectionOne-details-tab-imgOne-det-h1">Credentials</h1>
</div>
<div class="cro-about-area-sectionOne-des-btn-btnImg">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</div>
</div>
</div>
<div class="cro-about-area-sectionOne-details-tab-imgTwo">
<a href="#" class="cro-about-area-sectionOne-details-tab-imgOne-link"></a>
<img src=" https://wpriverthemes.com/gridxlight/wp-content/uploads/2023/04/my-works.png" alt="" class="cro-about-area-sectionOne-details-tab-imgOne-linkImg">
<div class="cro-about-area-sectionOne-details-tab-imgOne-details">
<div class="cro-about-area-sectionOne-details-tab-imgOne-det">
<h4 class="cro-about-area-sectionOne-details-tab-imgOne-det-h4">SHOWCASE</h4>
<h1 class="cro-about-area-sectionOne-details-tab-imgOne-det-h1">Projects</h1>
</div>
<div class="cro-about-area-sectionOne-des-btn-btnImg">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="cro-about-area-sectionTwo">
<div class="cro-about-area-sectionTwo-one">
<div class="cro-about-area-sectionTwo-img">
<a href="#" class="cro-about-area-sectionTwo-img-link"></a>
<img src="https://wpriverthemes.com/gridxlight/wp-content/uploads/2023/04/gfonts.png" alt="" class="cro-about-area-sectionTwo-imgImg">
</div>
<div class="cro-about-area-sectionTwo-descrip">
<div class="cro-about-area-sectionTwo-descrip-info">
<h4 class="cro-about-area-sectionTwo-descrip-info-h4">BLOG</h4>
<h1 class="cro-about-area-sectionTwo-descrip-info-h2">GFonts</h1>
</div>
<div class="cro-about-area-sectionOne-des-btn-btnImg">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</div>
</div>
</div>
<div class="cro-about-area-sectionTwo-two">
<a href="#" class="cro-about-area-sectionTwo-two-link"></a>
<div class="cro-about-area-sectionTwo-two-firstDiv">
<div class="cro-about-area-sectionTwo-two-firstDiv-one">
<!-- <img src="" alt="" class="cro-about-area-sectionTwo-two-firstDiv-img"> -->
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" viewBox="0 0 24 24" fill="none"><path d="M2 19V9C2 7.89543 2.89543 7 4 7H4.5C5.12951 7 5.72229 6.70361 6.1 6.2L8.32 3.24C8.43331 3.08892 8.61115 3 8.8 3H15.2C15.3889 3 15.5667 3.08892 15.68 3.24L17.9 6.2C18.2777 6.70361 18.8705 7 19.5 7H20C21.1046 7 22 7.89543 22 9V19C22 20.1046 21.1046 21 20 21H4C2.89543 21 2 20.1046 2 19Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 17C14.2091 17 16 15.2091 16 13C16 10.7909 14.2091 9 12 9C9.79086 9 8 10.7909 8 13C8 15.2091 9.79086 17 12 17Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="cro-about-area-sectionTwo-two-firstDiv-one">
<!-- <img src="" alt="" class="cro-about-area-sectionTwo-two-firstDiv-img"> -->
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" viewBox="0 0 24 24" fill="none"><path d="M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 21.1679V14L12 7L16 14V21.1679" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 14C8 14 9.12676 15 10 15C10.8732 15 12 14 12 14C12 14 13.1268 15 14 15C14.8732 15 16 14 16 14" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="cro-about-area-sectionTwo-two-firstDiv-one">
<!-- <img src="" alt="" class="cro-about-area-sectionTwo-two-firstDiv-img"> -->
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" viewBox="0 0 24 24" fill="none"><path d="M12 14.5C15.3137 14.5 18 11.8137 18 8.5C18 5.18629 15.3137 2.5 12 2.5C8.68629 2.5 6 5.18629 6 8.5C6 11.8137 8.68629 14.5 12 14.5Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M16 21.5C19.3137 21.5 22 18.8137 22 15.5C22 12.1863 19.3137 9.5 16 9.5C12.6863 9.5 10 12.1863 10 15.5C10 18.8137 12.6863 21.5 16 21.5Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 21.5C11.3137 21.5 14 18.8137 14 15.5C14 12.1863 11.3137 9.5 8 9.5C4.68629 9.5 2 12.1863 2 15.5C2 18.8137 4.68629 21.5 8 21.5Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="cro-about-area-sectionTwo-two-firstDiv-one">
<!-- <img src="" alt="" class="cro-about-area-sectionTwo-two-firstDiv-img"> -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="1.5" fill="none"><path d="M12 19.01L12.01 18.9989" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M18 18V21.4C18 21.7314 17.7314 22 17.4 22H6.6C6.26863 22 6 21.7314 6 21.4V18" stroke="currentColor" stroke-linecap="round"/><path d="M18 6V2.6C18 2.26863 17.7314 2 17.4 2H6.6C6.26863 2 6 2.26863 6 2.6V6" stroke="currentColor" stroke-linecap="round"/><path d="M15.5 8.5L19 12L15.5 15.5" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.5 8.5L5 12L8.5 15.5" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
</div>
<div class="cro-about-area-sectionTwo-two-secondDiv">
<div class="cro-about-area-sectionTwo-two-secondDiv-info">
<h4 class="cro-about-area-sectionTwo-two-secondDiv-info-h4">SPECIALIZATION</h4>
<h1 class="cro-about-area-sectionTwo-two-secondDiv-info-h2">Services Offering</h1>
</div>
<div class="cro-about-area-sectionOne-des-btn-btnImg">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</div>
</div>
</div>
<div class="cro-about-area-sectionTwo-three">
<div class="cro-about-area-sectionTwo-three-img">
<div class="cro-about-area-sectionTwo-three-imgOne">
<a href="" class="cro-about-area-sectionTwo-three-imgOne-link">
<!-- <img src="" alt="" class="cro-about-area-sectionTwo-three-imgOne-img"> -->
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" viewBox="0 0 24 24" fill="none"><path d="M23 3.01006C23 3.01006 20.9821 4.20217 19.86 4.54006C19.2577 3.84757 18.4573 3.35675 17.567 3.13398C16.6767 2.91122 15.7395 2.96725 14.8821 3.29451C14.0247 3.62177 13.2884 4.20446 12.773 4.96377C12.2575 5.72309 11.9877 6.62239 12 7.54006V8.54006C10.2426 8.58562 8.50127 8.19587 6.93101 7.4055C5.36074 6.61513 4.01032 5.44869 3 4.01006C3 4.01006 -1 13.0101 8 17.0101C5.94053 18.408 3.48716 19.109 1 19.0101C10 24.0101 21 19.0101 21 7.51006C20.9991 7.23151 20.9723 6.95365 20.92 6.68006C21.9406 5.67355 23 3.01006 23 3.01006Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>
</a>
</div>
<div class="cro-about-area-sectionTwo-three-imgTwo">
<a href="" class="cro-about-area-sectionTwo-three-imgOne-link">
<!-- <img src="" alt="" class="cro-about-area-sectionTwo-three-imgOne-img"> -->
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" viewBox="0 0 24 24" fill="none"><path d="M2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.6726 20.8435C15.5 14 12.5 8.00003 8.5 2.62964" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.06653 10.8406C6.00004 11 15.2829 10.5 19.1415 5" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.9677 12.81C15.3438 10.8407 7.50002 14.0001 5.23145 19.3613" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>
</a>
</div>
</div>
<div class="cro-about-area-sectionTwo-three-descrip">
<div class="cro-about-area-sectionTwo-descrip">
<div class="cro-about-area-sectionTwo-descrip-info">
<h4 class="cro-about-area-sectionTwo-descrip-info-h4">STAY WITH ME</h4>
<h1 class="cro-about-area-sectionTwo-descrip-info-h2">Profiles</h1>
</div>
<div class="cro-about-area-sectionOne-des-btn-btnImg">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</div>
</div>
</div>
</div>
</div>
<div class="cro-about-area-sectionThree">
<div class="cro-about-area-sectionThree-client">
<div class="cro-about-area-sectionThree-client-item">
<h1 class="cro-about-area-sectionThree-client-item-h1">07</h1>
<p class="cro-about-area-sectionThree-client-item-p">Years <br>Experience</p>
</div>
<div class="cro-about-area-sectionThree-client-item">
<h1 class="cro-about-area-sectionThree-client-item-h1">+125</h1>
<p class="cro-about-area-sectionThree-client-item-p">CLIENTS <br>WORLDWIDE</p>
</div>
<div class="cro-about-area-sectionThree-client-item">
<h1 class="cro-about-area-sectionThree-client-item-h1">+210</h1>
<p class="cro-about-area-sectionThree-client-item-p">TOTAL <br>PROJECTS</p>
</div>
</div>
<div class="cro-about-area-sectionThree-client-work">
<div class="cro-about-area-sectionThree-client-work-img">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon2-2.png" alt="" class="cro-about-area-sectionThree-client-work-imgImg">
</div>
<div class="cro-about-area-sectionTwo-descrip">
<div class="cro-about-area-sectionTwo-descrip-info">
<h4 class="cro-about-area-sectionTwo-descrip-info-h4">Let's </h4>
<h1 class="cro-about-area-sectionTwo-descrip-info-h2">work <span>together.</span></h1>
</div>
<div class="cro-about-area-sectionOne-des-btn-btnImg">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/icon-2.svg" alt="" class="cro-about-area-sectionOne-des-btnImg">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<section class="hidden">
<div class="cro-footer">
<div class="cro-footer-wrapper container">
<div class="footer-content text-center">
<a href="https://wpriverthemes.com/gridxlight/" class="logo">
<img src="https://wpriverthemes.com/gridx/wp-content/themes/gridx/assets/images/logo-dark.svg" alt="Logo">
</a>
<ul data-in="#" data-out="#" class="footer-menu" id="menu-footer-menu">
<li id="menu-item-1856" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-13 current_page_item menu-item-1856 active"><a title="Home" href="./index.html">Home</a></li>
<li id="menu-item-1857" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1857"><a title="About" href="./about.html">About</a></li>
<li id="menu-item-1859" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1859"><a title="Works" href="./work.html">Works</a></li>
<li id="menu-item-1858" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1858"><a title="Contact" href="./contact.html">Contact</a></li>
</ul>
<p class="copyright">
© All rights reserved by <span>WordPressRiver</span>
</p>
</div>
</div>
</div>
</section>
<script src="./js/index.js"></script>
</body>
</html>