-
Notifications
You must be signed in to change notification settings - Fork 2
/
blog-detail.html
621 lines (610 loc) · 31.2 KB
/
blog-detail.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
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
<!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>How To Choose Best Bike For In Australlia? - S'HOES</title>
<link rel="stylesheet" href="./assets/plugins/bootstrap/bootstrap.min.css" />
<link rel="stylesheet" href="./assets/css/main.css" />
</head>
<body class="blog-detail-page">
<!-- NAV -->
<nav class="nav">
<div class="container-fluid">
<div class="navbar">
<!-- NAVBAR ICON & MENU -->
<div class="navbar-left">
<!-- NAVBAR ICON -->
<a href="index.html">
<img src="./assets/img/logo.png" alt="Shoes Logo" />
</a>
<!-- NAVABR MENU -->
<ul class="navbar-left-menu">
<li class="navbar-item">
<a class="navbar-link" href="index.html">Anasayfa</a>
</li>
<!-- DROPDOWN START -->
<li class="navbar-item dropdown">
<a class="navbar-link dropdown-toggle" href="products.html"> Ürünler <ion-icon class="ms-2" name="chevron-down-outline"></ion-icon> </a>
<div class="dropdown-menu megamenu" role="menu">
<div class="dropdown-content">
<div class="container-fluid">
<div class="row">
<div class="col">
<div class="dropdown-menu-item">
<h4 class="list-title">Kategoriler</h4>
<ul class="sub-menu">
<li>
<a href="404.html"><ion-icon name="chevron-forward-outline"></ion-icon>404</a>
</li>
<li>
<a href="blog.html"><ion-icon name="chevron-forward-outline"></ion-icon>Blog</a>
</li>
<li>
<a href="blog-detail.html"><ion-icon name="chevron-forward-outline"></ion-icon>Blog Detay</a>
</li>
<li>
<a href="product-detail.html"><ion-icon name="chevron-forward-outline"></ion-icon>Ürün Detay</a>
</li>
<li>
<a href="contact.html"><ion-icon name="chevron-forward-outline"></ion-icon>İletişim</a>
</li>
</ul>
</div>
</div>
<div class="col">
<div class="dropdown-menu-item">
<h4 class="list-title">Erkek</h4>
<ul class="sub-menu">
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model XM1</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model MD21</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model XYZ23</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model UIP21</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model XSMAX</a>
</li>
</ul>
</div>
</div>
<div class="col">
<div class="dropdown-menu-item">
<h4 class="list-title">Kadın</h4>
<ul class="sub-menu">
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model WX-123</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model WXZ11</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model WXZY23</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model WXK4123</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model WXDAW12</a>
</li>
</ul>
</div>
</div>
<div class="col">
<div class="dropdown-menu-item">
<h4 class="list-title">Outlet</h4>
<ul class="sub-menu">
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-123</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Wi444</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Air123 </a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Maxx32 </a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Pro546</a>
</li>
</ul>
</div>
</div>
<div class="col">
<div class="dropdown-menu-item">
<h4 class="list-title">Fırsat Ürünleri</h4>
<ul class="sub-menu">
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-123</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Wi444</a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Air123 </a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Maxx32 </a>
</li>
<li>
<a href="products.html"><ion-icon name="chevron-forward-outline"></ion-icon>Model Otl-Pro546</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!-- DROPDOWN END -->
<li class="nav-bar-item">
<a class="navbar-link" href="cargo-tracking.html">Kargo Takip</a>
</li>
<li class="nav-bar-item">
<a class="navbar-link active" href="blog.html">Blog</a>
</li>
<li class="nav-bar-item">
<a class="navbar-link" href="contact.html">İletişim</a>
</li>
</ul>
</div>
<div class="navbar-right">
<a href="javascript:;" class="btn-nav-link" id="btn-toggle-search-box">
<ion-icon name="search-outline"></ion-icon>
</a>
<a href="javascript:;" class="btn-nav-link">
<ion-icon name="heart-outline"></ion-icon>
</a>
<a href="javascript:;" class="btn-nav-link">
<ion-icon name="cart-outline"></ion-icon>
<span class="counter rounded-pill translate-middle">4</span>
</a>
<a href="javascript:;" class="btn-nav-link btn-mobile" id="btn-toggle-mobile-menu">
<ion-icon name="menu-outline"></ion-icon>
</a>
<div class="navbar-right-login">
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#login">Giriş Yap</a>
<span class="mx-1">/</span>
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#register">Üye Ol</a>
</div>
<div class="search-box" id="search-box">
<ion-icon name="search"></ion-icon>
<input type="text" class="form-control" id="search-box-input" />
</div>
</div>
</div>
</div>
</nav>
<!-- MOBILE MENU -->
<div class="mobile-menu-overlay" id="mobile-menu-overlay"></div>
<div class="mobile-menu-box" id="mobile-menu-box">
<a class="btn-close-menu" id="btn-close-menu">
<ion-icon name="close"></ion-icon>
</a>
<div class="mobile-menu-list">
<a href="index.html" class="navbar-link">Anasayfa</a>
<a href="products.html" class="navbar-link">Ürünler</a>
<a href="product-detail.html" class="navbar-link">Ürün Detay</a>
<a href="cargo-tracking.html" class="navbar-link">Kargo Takip</a>
<a href="blog.html" class="navbar-link">Blog</a>
<a href="blog-detail.html" class="navbar-link active">Blog Detay</a>
<a href="404.html" class="navbar-link">404</a>
<a href="contact.html" class="navbar-link">İletişim</a>
<div class="user-box">
<hr />
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#login" class="navbar-link">Giriş Yap</a>
<a href="javascript:;" data-bs-toggle="modal" data-bs-target="#register" class="navbar-link">Üye Ol</a>
</div>
</div>
</div>
<!-- MAIN CONTENT -->
<main class="container">
<!-- BREADCRUMB -->
<div class="breadcrumb-container my-3">
<ul class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Anasayfa</a></li>
<li class="breadcrumb-item"><a href="blog.html">Blog</a></li>
<li class="breadcrumb-item active" aria-current="page">How To Choose Best Bike For In Australlia?</li>
</ul>
</div>
<div class="row">
<section class="col-12 col-lg-8">
<div class="blog-detail">
<div class="blog-detail-img">
<a href="./assets/img/blog/blog-detail-1.png" target="_blank">
<img class="img-fluid" src="./assets/img/blog/blog-detail-1.png" alt="How To Choose Best Bike For In Australlia?" />
</a>
</div>
<div class="blog-detail-content">
<div class="d-flex mt-3 mb-2">
<p class="cs-badge badge-red">Still</p>
<p class="cs-badge badge-blue mx-3">Style</p>
<p class="cs-badge badge-green">Fixin</p>
</div>
<h1 class="title">How To Choose Best Bike For In Australlia?</h1>
<div class="icon-boxes">
<div class="icon-text">
<ion-icon name="calendar-number-outline"></ion-icon>
<span>01.12.2021</span>
</div>
<div class="icon-text">
<ion-icon name="eye-outline"></ion-icon>
<span>1.22K</span>
</div>
</div>
<div class="description mt-3">
<p>
Sed id lacus, sapien, facilisis in. Duis quis ut commodo cras ornare aliquet enim. Enim aliquet viverra aliquet eget diam velit.
Erat enim elementum neque in suspendisse sit orci, faucibus. Diam lacus laoreet ullamcorper a semper fermentum molestie purus mi. ut
libero, scelerisque integer purus morbi velit velit. Ultrices pretium quam egestas risus. A maecenas tortor eget amet vivamus congue
facilisi vel. Rhoncus cras adipiscing aliquam nunc pretium, enim. Eget proin pharetra diam consequat.
</p>
<p>
Nulla pretium sed penatibus massa. Aliquet urna non molestie faucibus consectetur in etiam. Facilisis sem a justo viverra augue
tristique amet, ut. Pellentesque mauris, enim, convallis justo, sed metus. Consequat proin et auctor erat aliquam lacus massa
faucibus semper. Gravida metus condimentum morbi lectus ultricies dictum feugiat. Ipsum, accumsan justo nisl quis vitae. Quisque
egestas auctor vestibulum eu. Facilisis varius amet rhoncus tempor proin sit montes, in non. Nec diam eleifend sed sapien. Fames
aliquam magna eu lectus viverra viverra. Sit ullamcorper consequat placerat pretium.
</p>
<p>
Habitasse egestas nullam facilisi montes, cursus. Vel mauris iaculis elementum lacinia. Sollicitudin dis aliquam sagittis porta sed
molestie massa.Venenatis vel, augue nunc cursus justo dignissim praesent neque. Pharetra, nulla nulla pulvinar arcu, morbi. Urna nam
viverra massa accumsan enim varius amet lectus. A adipiscing ipsum amet tellus massa venenatis, vitae. Nibh ac erat vestibulum
faucibus et odio. Quam eget aliquet et at et ultrices integer. In integer ligula sit risus. Enim parturient enim urna magnis
ultricies ipsum sagittis, tellus vitae. Quam ultricies suspendisse euismod lacus.
</p>
<p>
Ultrices integer eu faucibus metus lorem convallis ipsum nulla. Tellus interdum pellentesque lacus cursus. Mus a, nisi in massa
pellentesque cras ut augue. Rhoncus eleifend arcu integer vel risus, commodo ultricies fusce. Lacinia arcu nibh quis natoque arcu
enim suscipit urna, blandit. Odio nisi, nullam quam dignissim duis.Varius nunc consequat ut velit, tristique volutpat phasellus.
Nunc lorem condimentum lectus porttitor. Semper ut est, aenean sollicitudin. Lobortis malesuada facilisi est lectus. Condimentum
nisl, mauris, egestas aliquet mattis eu, diam amet, faucibus. Sed leo ultrices in eros, curabitur suspendisse felis.
</p>
</div>
</div>
</div>
<hr />
<!-- SHARE SOCIAL -->
<div class="col-12">
<div class="share-social">
<p class="mb-0 text-muted me-1">Bu gönderiyi paylaş:</p>
<a href="https://www.facebook.com/sharer.php?u=https://serdargoleli.github.io/" target="_blank" ref="nofollow noopener">
<ion-icon name="logo-facebook"></ion-icon>
</a>
<a
href="https://twitter.com/intent/tweet?url=https://serdargoleli.github.io/&hashtags=serdargoleli"
target="_blank"
ref="nofollow noopener"
><ion-icon name="logo-twitter"></ion-icon>
</a>
<a href="https://www.pinterest.com/pin/create/%20button/?url=https://serdargoleli.github.io" target="_blank" ref="nofollow noopener">
<ion-icon name="logo-pinterest"></ion-icon>
</a>
<a
href="https://www.linkedin.com/shareArticle?mini=true&url=https://serdargoleli.github.io"
target="_blank"
ref="nofollow noopener"
>
<ion-icon name="logo-linkedin"></ion-icon>
</a>
</div>
</div>
</section>
<aside class="col-12 col-lg-4">
<div class="main-content position-sticky top-100 mt-3 mt-lg-0">
<h2 class="subtitle"><strong>İlgini</strong> Çekebilir</h2>
<a href="./blog-detail.html" class="blog-post-link">
<div class="blog-post">
<div class="blog-post-img">
<img src="./assets/img/blog/4.png" alt="blog post1" />
</div>
<div class="blog-post-text">
<h6>Summer Homework</h6>
<p>
Maecenas consectetur elit velit, sit amet elementum lacus tempor quis. Phasellus massa nibh, posuere ac dui et, suscipit tempor
quam. Nullam ac est arcu. Aenean convallis fermentum est ut tincidunt. Donec commodo, sapien in venenatis elementum, dolor turpis
pretium mauris, non condimentum arcu nunc ut nunc.
</p>
</div>
</div>
</a>
<a href="./blog-detail.html" class="blog-post-link">
<div class="blog-post">
<div class="blog-post-img">
<img src="./assets/img/blog/5.png" alt="blog post1" />
</div>
<div class="blog-post-text">
<h6>Luctus felis quis</h6>
<p>
Morbi non suscipit nisi, eu imperdiet ligula. In pellentesque, justo ut imperdiet mollis, neque dui varius mi, sit amet volutpat
ex nibh id lacus. Duis at tincidunt nunc. Ut eget posuere lectus, vitae tincidunt est. Curabitur nec magna id nisi rhoncus
vehicula ac et ex. Donec ullamcorper in tortor et imperdiet.
</p>
</div>
</div>
</a>
<a href="./blog-detail.html" class="blog-post-link">
<div class="blog-post">
<div class="blog-post-img">
<img src="./assets/img/blog/7.png" alt="blog post1" />
</div>
<div class="blog-post-text">
<h6>Nullam libero vel</h6>
<p>
Mauris venenatis tellus ut nisi luctus, vel malesuada odio vestibulum. Nam in venenatis libero. Sed tincidunt dolor lacus, non
consequat erat pretium vitae.Maecenas efficitur semper neque, ut porta dui. Donec venenatis congue urna, in commodo dui posuere
vitae.
</p>
</div>
</div>
</a>
<a href="./blog-detail.html" class="blog-post-link">
<div class="blog-post">
<div class="blog-post-img">
<img src="./assets/img/blog/8.png" alt="blog post1" />
</div>
<div class="blog-post-text">
<h6>Volutpat in elit</h6>
<p>
Aliquam sed justo est. Nullam euismod nunc sed lorem fringilla, eu placerat magna dictum. Aenean egestas mauris id tellus
tristique pulvinar. Suspendisse ut metus fringilla, aliquet augue eget, feugiat enim. Fusce consectetur facilisis accumsan.
Integer sit amet quam elementum, lacinia dui vel, vulputate est. Suspendisse potenti.
</p>
</div>
</div>
</a>
<a href="./blog-detail.html" class="blog-post-link">
<div class="blog-post">
<div class="blog-post-img">
<img src="./assets/img/blog/9.png" alt="blog post1" />
</div>
<div class="blog-post-text">
<h6>Nulla odio quis</h6>
<p>
Nam vel ex non nunc maximus pretium vitae sed tortor. Fusce eget nisi id mi rhoncus vehicula commodo et massa. Fusce aliquam
tincidunt sapien hendrerit commodo. Quisque sit amet magna orci. Quisque pellentesque congue justo nec aliquam. Quisque nec dui eu
felis fermentum tempor. Suspendisse elit nisl, viverra non neque in, ultrices sagittis turpis. Pellentesque molestie nulla vel
commodo congue. Maecenas vitae posuere dolor, congue viverra tellus. Nunc nec elit sed massa fermentum porta a non est. Nam in
nunc in ipsum posuere auctor vitae tristique erat. Phasellus faucibus tortor tellus, sed ornare turpis mollis et.
</p>
</div>
</div>
</a>
</div>
</aside>
</div>
<div class="row mt-4">
<div class="col-12">
<h3 class="theme-title">Diğer <span>Gönderiler</span></h3>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="blog-card">
<div class="blog-card-img">
<a href="blog-detail.html">
<img class="img-fluid" src="./assets/img/blog/1.png" alt="How To Choose Best Bike For In Australlia?" />
</a>
</div>
<p class="cs-badge badge-red">Still</p>
<h2 class="blog-title">
<a href="blog-detail.html"> How To Choose Best Bike For In Australlia?</a>
</h2>
<p class="blog-description">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquid reiciendis, beatae nobis itaque animi mollitia repellat vitae
voluptates sed delectus quisquam quas pariatur numquam sequi similique ex debitis expedita nulla.
</p>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="blog-card">
<div class="blog-card-img">
<a href="blog-detail.html">
<img class="img-fluid" src="./assets/img/blog/2.png" alt="How To Choose Best Bike For In Australlia?" />
</a>
</div>
<p class="cs-badge badge-orange">Street</p>
<h2 class="blog-title"><a href="blog-detail.html"> How To Choose Best Bike For In Australlia?</a></h2>
<p class="blog-description">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquid reiciendis, beatae nobis itaque animi mollitia repellat vitae
voluptates sed delectus quisquam quas pariatur numquam sequi similique ex debitis expedita nulla.
</p>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="blog-card">
<div class="blog-card-img">
<a href="blog-detail.html">
<img class="img-fluid" src="./assets/img/blog/3.png" alt="How To Choose Best Bike For In Australlia?" />
</a>
</div>
<p class="cs-badge badge-blue">Style</p>
<h2 class="blog-title"><a href="blog-detail.html"> How To Choose Best Bike For In Australlia?</a></h2>
<p class="blog-description">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquid reiciendis, beatae nobis itaque animi mollitia repellat vitae
voluptates sed delectus quisquam quas pariatur numquam sequi similique ex debitis expedita nulla.
</p>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="blog-card">
<div class="blog-card-img">
<a href="blog-detail.html">
<img class="img-fluid" src="./assets/img/blog/4.png" alt="How To Choose Best Bike For In Australlia?" />
</a>
</div>
<p class="cs-badge badge-green">Fixing</p>
<h2 class="blog-title"><a href="blog-detail.html"> How To Choose Best Bike For In Australlia?</a></h2>
<p class="blog-description">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquid reiciendis, beatae nobis itaque animi mollitia repellat vitae
voluptates sed delectus quisquam quas pariatur numquam sequi similique ex debitis expedita nulla.
</p>
</div>
</div>
</div>
</main>
<!-- FOOTER -->
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-12">
<a href="index.html" class="footer-logo">
<img src="./assets/img/logo-white.png" alt="Footer Logo" />
<h5>S'HOES</h5>
</a>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="footer-box">
<h6>MÜŞTERİ HİZMELERİ</h6>
<div class="text-box customer-service">
<a href="javascript:;">Mağaza Bul</a>
<a href="javascript:;">Kampanyalar</a>
<a href="javascript:;">Kişisel Verilerin Korunması</a>
<a href="javascript:;">Ödeme</a>
<a href="javascript:;">Gizlilik Politikası</a>
<a href="javascript:;">İşlem Rehberi</a>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="footer-box">
<h6>S'HOES HAKKINDA</h6>
<div class="text-box about-us">
<a href="javascript:;">Haberler</a>
<a href="javascript:;">Kariyer</a>
<a href="javascript:;">Sürdürülebilirlik</a>
<a href="javascript:;">Yatırımcılar</a>
<a href="javascript:;">Teslimat</a>
<a href="javascript:;">İade</a>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="footer-box">
<h6>YARDIM AL</h6>
<div class="text-box get-help">
<a href="javascript:;">Sipariş Durumu</a>
<a href="javascript:;">Kargo ve Teslimat</a>
<a href="javascript:;">İadeler</a>
<a href="javascript:;">Ödeme Seçenekleri</a>
<a href="javascript:;">Bize Ulaşın</a>
<a href="javascript:;">Site Haritası</a>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="footer-box">
<h6>BÜLTENE ABONE OL</h6>
<p class="footer-text">İndirim ve kampanyalardan anında haberdar ol</p>
<div class="cs-input-box">
<input type="email" placeholder="E-posta" />
<button><ion-icon name="chevron-forward-outline"></ion-icon></button>
</div>
</div>
</div>
</div>
<hr class="my-4" />
<div class="footer-bottom">
<div class="row">
<div class="col-12 col-lg-3">
<div class="footer-bottom-box navigate">
<ion-icon name="navigate"></ion-icon>
Türkiye
</div>
</div>
<div class="col-12 col-lg-6">
<p class="footer-bottom text-center my-3 my-lg-0">© 2021 S’hoes, Tüm Hakları Saklıdır.</p>
</div>
<div class="col-12 col-lg-3">
<div class="footer-bottom social-media">
<a href=""><ion-icon name="logo-instagram"></ion-icon></a>
<a href=""><ion-icon name="logo-facebook"></ion-icon></a>
<a href=""><ion-icon name="logo-pinterest"></ion-icon></a>
<a href=""><ion-icon name="logo-youtube"></ion-icon></a>
<a href=""><ion-icon name="logo-twitter"></ion-icon></a>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- Login -->
<div class="login-modal modal fade" id="login" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header text-center d-block">
<h5 class="modal-title">Giriş Yap</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="floating-form mb-3">
<input type="text" class="form-control" id="username" autocomplete="off" required />
<label for="username">Kullanıcı Adı</label>
</div>
<div class="floating-form">
<input type="password" class="form-control" id="name" autocomplete="off" required />
<label for="name">Şifre</label>
</div>
<div class="text-end">
<a href="#" class="text-end"><small>Şifremi Unuttum.</small></a>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-orange w-100">Giriş Yap</button>
<button type="button" class="btn btn-sm btn-orange outline w-100" data-bs-dismiss="modal">Vazgeç</button>
<div class="mt-3">
Hesabın yok mu?
<a href="javascript:;" data-bs-dismiss="modal" data-bs-toggle="modal" data-bs-target="#register"><b>Hesap oluştur</b></a>
</div>
</div>
</div>
</div>
</div>
<!-- Register -->
<div class="login-modal modal fade" id="register" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header text-center d-block">
<h5 class="modal-title">Üye Ol</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="floating-form mb-3">
<input type="text" class="form-control" id="fullname" autocomplete="off" required />
<label for="fullname">Ad Soyad</label>
</div>
<div class="floating-form mb-3">
<input type="email" class="form-control" id="email" autocomplete="off" required />
<label for="email">E-posta</label>
</div>
<div class="floating-form">
<input type="password" class="form-control" id="r-password" autocomplete="off" required />
<label for="r-password">Şifre</label>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-sm btn-orange w-100">Üye Ol</button>
<button type="button" class="btn btn-sm btn-orange outline w-100" data-bs-dismiss="modal">Vazgeç</button>
<div class="mt-3">
Zaten bir Hesabım var.
<a href="javascript:;" data-bs-dismiss="modal" data-bs-toggle="modal" data-bs-target="#login"><b>Giriş Yap</b></a>
</div>
</div>
</div>
</div>
</div>
<!-- SCRIPTS -->
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
<script src="./assets/plugins/bootstrap/bootstrap.bundle.min.js"></script>
<script src="./assets/js/main.js"></script>
</body>
</html>