-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathcatalog.html
993 lines (943 loc) · 70.9 KB
/
catalog.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
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
<!DOCTYPE html>
<html lang="ru">
<head>
<!-- favicons -->
<link rel="apple-touch-icon" sizes="180x180" href="images/img/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="images/img/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="images/img/favicon/favicon-16x16.png">
<link rel="manifest" href="images/img/favicon/site.webmanifest">
<link rel="mask-icon" href="images/img/favicon/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#7f5dd6">
<meta name="theme-color" content="#ffffff">
<!-- / favicons -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>iPhone – iSmart</title>
<meta name="description" content="Специализированный магазин «Apple» в Казани. В рассрочку и кредит. Гарантия до 2 лет. ТЦ «Олимп», 3 этаж." />
<meta name="og:title" content="iPhone – iSmart">
<meta property="og:image" content="images/img/logo.svg">
<meta name="og:description" content="Специализированный магазин «Apple» в Казани. В рассрочку и кредит. Гарантия до 2 лет. ТЦ «Олимп», 3 этаж.">
<meta name="og:url" content="iSmart.ru">
<meta name="og:site_name" content="iSmart – Официальный сайт">
<meta name="og:locale" content="ru_RU">
<meta name="og:type" content="website">
<!-- fonts Inter -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800&display=swap;" rel="stylesheet">
<!-- bootstrap 5 min CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha2/css/bootstrap.min.css" integrity="sha384-DhY6onE6f3zzKbjUPRc2hOzGAdEf4/Dz+WJwBvEYL/lkkIsI3ihufq9hk9K4lVoK" crossorigin="anonymous">
<!-- price range style sheet -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" integrity="sha512-aOG0c6nPNzGk+5zjwyJaoRUgCdOrfSDhmMID2u4+OIslr0GjpLKo7Xm0Ao3xmpM4T8AmIouRkqwj1nrdVsLKEQ==" crossorigin="anonymous">
<!-- main styles -->
<link rel="stylesheet" href="css/style.min.css">
</head>
<body class="bg-3 c-1">
<!-- HEADER on MOBILE -->
<header class="d-block d-md-none pr">
<!-- MOBILE SEARCH -->
<div class="mobile-search-wr hidden">
<!-- search body -->
<form class="mobile-search-body bg-3">
<input required type="text" class="mobile-search-input fs-14" placeholder="Искать на сайте">
<button class="mobile-search-close btn-trans">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z" fill="#8C8C8C"/>
</svg>
</button>
</form>
<!-- search dark bg -->
<div class="mobile-search-bg"></div>
</div>
<!-- header top -->
<div class="bg-10" style="min-height: 44px;">
<div class="container" style="padding: 10px 15px;">
<div class="df fnw jsb aic">
<!-- logo -->
<a href="index.html" class="logo">
<svg width="57" height="18" viewBox="0 0 57 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.58119 16H3.49241V6.18182H1.58119V16ZM2.54639 4.6669C3.20477 4.6669 3.75448 4.15554 3.75448 3.52912C3.75448 2.9027 3.20477 2.38494 2.54639 2.38494C1.88161 2.38494 1.33829 2.9027 1.33829 3.52912C1.33829 4.15554 1.88161 4.6669 2.54639 4.6669ZM13.3569 6.34801H15.2618C15.2042 4.25142 13.3505 2.73011 10.6915 2.73011C8.06432 2.73011 6.05083 4.23224 6.05083 6.48864C6.05083 8.31037 7.3548 9.37784 9.45779 9.94673L11.0047 10.3686C12.4045 10.7393 13.4848 11.1996 13.4848 12.3629C13.4848 13.6413 12.2639 14.4851 10.5828 14.4851C9.06148 14.4851 7.79585 13.8075 7.6808 12.3821H5.69926C5.8271 14.7536 7.66162 16.2173 10.5956 16.2173C13.6701 16.2173 15.4407 14.6001 15.4407 12.3821C15.4407 10.0234 13.3378 9.10938 11.6758 8.70028L10.3974 8.3679C9.37469 8.10582 8.01318 7.62642 8.01958 6.37358C8.01958 5.26136 9.03591 4.43679 10.6467 4.43679C12.1488 4.43679 13.2163 5.13991 13.3569 6.34801ZM17.6476 16H19.5588V9.94673C19.5588 8.62358 20.4857 7.70312 21.5723 7.70312C22.6334 7.70312 23.3685 8.40625 23.3685 9.47372V16H25.2733V9.74219C25.2733 8.55966 25.9956 7.70312 27.2421 7.70312C28.252 7.70312 29.083 8.26562 29.083 9.59517V16H30.9942V9.41619C30.9942 7.17259 29.7413 6.05398 27.9644 6.05398C26.5517 6.05398 25.4906 6.73153 25.0176 7.77983H24.9154C24.4871 6.70597 23.5858 6.05398 22.2754 6.05398C20.9779 6.05398 20.0127 6.69957 19.6036 7.77983H19.4821V6.18182H17.6476V16ZM36.413 16.2173C38.0366 16.2173 38.9507 15.3928 39.315 14.6577H39.3917V16H41.2582V9.48011C41.2582 6.62287 39.0082 6.05398 37.4486 6.05398C35.6716 6.05398 34.0352 6.76989 33.396 8.55966L35.1922 8.96875C35.4734 8.27202 36.1893 7.60085 37.4741 7.60085C38.7078 7.60085 39.3406 8.24645 39.3406 9.35866V9.40341C39.3406 10.1001 38.6247 10.0874 36.8605 10.2919C35.0004 10.5092 33.0956 10.995 33.0956 13.2259C33.0956 15.1562 34.5466 16.2173 36.413 16.2173ZM36.8285 14.6832C35.7483 14.6832 34.9684 14.1974 34.9684 13.2514C34.9684 12.2287 35.8761 11.8643 36.9819 11.7173C37.602 11.6342 39.0721 11.468 39.347 11.1932V12.4588C39.347 13.6222 38.4201 14.6832 36.8285 14.6832ZM43.8038 16H45.7151V10.0043C45.7151 8.71946 46.7058 7.79261 48.0609 7.79261C48.4573 7.79261 48.9047 7.86293 49.0581 7.90767V6.07955C48.8663 6.05398 48.4892 6.0348 48.2463 6.0348C47.0957 6.0348 46.1114 6.68679 45.7534 7.74148H45.6511V6.18182H43.8038V16ZM55.8752 6.18182H53.8617V3.82955H51.9505V6.18182H50.5123V7.71591H51.9505V13.5135C51.9441 15.2969 53.3056 16.1598 54.8141 16.1278C55.4214 16.1214 55.8305 16.0064 56.0542 15.9233L55.709 14.3445C55.5812 14.37 55.3447 14.4276 55.0379 14.4276C54.4178 14.4276 53.8617 14.223 53.8617 13.1172V7.71591H55.8752V6.18182Z" fill="white"/>
<circle cx="2.50049" cy="3.5" r="1.5" fill="#6839CF"/>
</svg>
</a>
<!-- menu show button -->
<button class="gamburger btn-trans" aria-label="Раскрыть навигацию">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4 18H20C20.55 18 21 17.55 21 17C21 16.45 20.55 16 20 16H4C3.45 16 3 16.45 3 17C3 17.55 3.45 18 4 18ZM4 13H20C20.55 13 21 12.55 21 12C21 11.45 20.55 11 20 11H4C3.45 11 3 11.45 3 12C3 12.55 3.45 13 4 13ZM3 7C3 7.55 3.45 8 4 8H20C20.55 8 21 7.55 21 7C21 6.45 20.55 6 20 6H4C3.45 6 3 6.45 3 7Z" fill="white"/>
</svg>
</button>
<!-- menu hide button -->
<button class="gamburger-close btn-trans hidden">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.0005 6.41L17.5905 5L12.0005 10.59L6.41049 5L5.00049 6.41L10.5905 12L5.00049 17.59L6.41049 19L12.0005 13.41L17.5905 19L19.0005 17.59L13.4105 12L19.0005 6.41Z" fill="white"/>
</svg>
</button>
</div>
</div>
<div class="fs-14 fw-5 c-13 bg-3 mobile-menu-common mobile-menu hidden">
<div class="mb-20">
<button class="d-flex jsb aic catalog-btn">
<span>Каталог товаров</span>
<!-- button icon -->
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.75404 6.31133L9.66404 9.22133L6.75404 12.1313C6.46154 12.4238 6.46154 12.8963 6.75404 13.1888C7.04654 13.4813 7.51904 13.4813 7.81154 13.1888L11.254 9.74633C11.5465 9.45383 11.5465 8.98133 11.254 8.68883L7.81154 5.24633C7.51904 4.95383 7.04654 4.95383 6.75404 5.24633C6.46904 5.53883 6.46154 6.01883 6.75404 6.31133Z" fill="black"/>
</svg>
</button>
<!-- buyers info page -->
<a href="buyer.html">Покупателю</a>
<!-- wholesalers page link -->
<a href="wholesalers.html">Оптовикам</a>
<!-- discounts page link -->
<a href="catalog.html">Скидки</a>
<!-- LOGIN LINK -->
<a class="d-flex aic login" href="login.html" aria-label="Войти в аккаунт" title="Войти в аккаунт">
<!-- login icon -->
<svg class="mr-10" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM5.07 16.28C5.5 15.38 8.12 14.5 10 14.5C11.88 14.5 14.51 15.38 14.93 16.28C13.57 17.36 11.86 18 10 18C8.14 18 6.43 17.36 5.07 16.28ZM16.36 14.83C14.93 13.09 11.46 12.5 10 12.5C8.54 12.5 5.07 13.09 3.64 14.83C2.62 13.49 2 11.82 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 11.82 17.38 13.49 16.36 14.83ZM10 4C8.06 4 6.5 5.56 6.5 7.5C6.5 9.44 8.06 11 10 11C11.94 11 13.5 9.44 13.5 7.5C13.5 5.56 11.94 4 10 4ZM10 9C9.17 9 8.5 8.33 8.5 7.5C8.5 6.67 9.17 6 10 6C10.83 6 11.5 6.67 11.5 7.5C11.5 8.33 10.83 9 10 9Z" fill="black"/>
</svg>
<span>Войти</span>
</a>
<a href="tel:+7(952)034-36-34" title="Позвонить нам" class="tnw">+7 (952) 034-36-34</a>
</div>
<div class="px-4 pb-3">
<p class="mb-10">Контактная информация:</p>
<p class="fs-12 c-8">Адрес: Казань, ул. Рихарда Зорге 66,<br> ТЦ Олимп 3 этаж<br> Режим работы: Пн-Вс: 9:00 - 22:00<br> E-mail: [email protected]</p>
</div>
</div>
<div class="fs-14 fw-5 c-13 bg-3 mobile-menu-common mobile-menu-catalog hidden">
<div class="mb-20">
<button class="d-flex aic btn-trans btn-catalog-back">
<!-- button icon -->
<svg class="mr-1" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.254 6.31133L8.34401 9.22133L11.254 12.1313C11.5465 12.4238 11.5465 12.8963 11.254 13.1888C10.9615 13.4813 10.489 13.4813 10.1965 13.1888L6.75401 9.74633C6.46151 9.45383 6.46151 8.98133 6.75401 8.68883L10.1965 5.24633C10.489 4.95383 10.9615 4.95383 11.254 5.24633C11.539 5.53883 11.5465 6.01883 11.254 6.31133Z" fill="black"/>
</svg>
<span>Назад</span>
</button>
<div class="c-3 fw-6">
Каталог товаров
</div>
<a href="catalog.html">iPhone</a>
<a href="catalog.html">iPad</a>
<a href="catalog.html">Macbook</a>
<a href="catalog.html">AirPods</a>
<a href="catalog.html">Apple Watch</a>
<a href="catalog.html">Аксессуары</a>
</div>
</div>
</div>
<!-- header bottom -->
<div class="bg-3">
<div class="container p-3">
<div class="df fnw jsb aic">
<!-- LOGIN LINK -->
<a class="fw-5 df aic login" href="login.html" aria-label="Войти в аккаунт" title="Войти в аккаунт">
<!-- login icon -->
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.9999 2.8335C6.93992 2.8335 2.83325 6.94016 2.83325 12.0002C2.83325 17.0602 6.93992 21.1668 11.9999 21.1668C17.0599 21.1668 21.1666 17.0602 21.1666 12.0002C21.1666 6.94016 17.0599 2.8335 11.9999 2.8335ZM7.48075 17.7568C7.87492 16.9318 10.2766 16.1252 11.9999 16.1252C13.7233 16.1252 16.1341 16.9318 16.5191 17.7568C15.2724 18.7468 13.7049 19.3335 11.9999 19.3335C10.2949 19.3335 8.72742 18.7468 7.48075 17.7568ZM17.8299 16.4277C16.5191 14.8327 13.3383 14.2918 11.9999 14.2918C10.6616 14.2918 7.48075 14.8327 6.16992 16.4277C5.23492 15.1993 4.66659 13.6685 4.66659 12.0002C4.66659 7.95766 7.95742 4.66683 11.9999 4.66683C16.0424 4.66683 19.3333 7.95766 19.3333 12.0002C19.3333 13.6685 18.7649 15.1993 17.8299 16.4277ZM11.9999 6.50016C10.2216 6.50016 8.79159 7.93016 8.79159 9.7085C8.79159 11.4868 10.2216 12.9168 11.9999 12.9168C13.7783 12.9168 15.2083 11.4868 15.2083 9.7085C15.2083 7.93016 13.7783 6.50016 11.9999 6.50016ZM11.9999 11.0835C11.2391 11.0835 10.6249 10.4693 10.6249 9.7085C10.6249 8.94766 11.2391 8.3335 11.9999 8.3335C12.7608 8.3335 13.3749 8.94766 13.3749 9.7085C13.3749 10.4693 12.7608 11.0835 11.9999 11.0835Z" fill="black"/>
</svg>
</a>
<!-- phone -->
<a href="tel:+7(952)034-36-34" title="Позвонить нам" class="tnw c-3 f-14 fw-5">
+7 (952) 034-36-34
</a>
<!-- Search -->
<button class="btn-trans show-mobile-search" aria-label="Поиск по сайту">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.3393 15.2163C17.3265 13.9436 17.7917 12.3426 17.6404 10.739C17.4891 9.13541 16.7325 7.64972 15.5246 6.58416C14.3168 5.5186 12.7483 4.95322 11.1384 5.00303C9.52845 5.05285 7.99797 5.71413 6.85829 6.85233C5.71762 7.99132 5.05418 9.5224 5.00317 11.1336C4.95217 12.7447 5.51743 14.3147 6.58376 15.5236C7.6501 16.7324 9.13726 17.4892 10.7422 17.6397C12.3471 17.7901 13.949 17.3229 15.2215 16.3333L15.2555 16.369L18.6137 19.728C18.6873 19.8016 18.7746 19.8599 18.8707 19.8997C18.9668 19.9395 19.0698 19.96 19.1739 19.96C19.2779 19.96 19.3809 19.9395 19.477 19.8997C19.5731 19.8599 19.6604 19.8016 19.734 19.728C19.8075 19.6544 19.8659 19.5671 19.9057 19.471C19.9455 19.3749 19.966 19.2719 19.966 19.1679C19.966 19.0639 19.9455 18.9609 19.9057 18.8648C19.8659 18.7687 19.8075 18.6813 19.734 18.6078L16.3749 15.2495C16.3633 15.2381 16.3515 15.227 16.3393 15.2163ZM14.6958 7.97254C15.1428 8.41229 15.4983 8.93619 15.7417 9.51402C15.9852 10.0918 16.1119 10.7122 16.1145 11.3392C16.117 11.9662 15.9954 12.5876 15.7566 13.1673C15.5178 13.7471 15.1666 14.2739 14.7233 14.7173C14.2799 15.1607 13.7531 15.5119 13.1733 15.7507C12.5935 15.9894 11.9722 16.1111 11.3452 16.1085C10.7181 16.1059 10.0978 15.9793 9.51998 15.7358C8.94215 15.4923 8.41825 15.1368 7.9785 14.6898C7.09968 13.7966 6.60943 12.5923 6.61454 11.3392C6.61964 10.0861 7.11968 8.88584 8.00574 7.99978C8.8918 7.11372 10.0921 6.61368 11.3452 6.60858C12.5982 6.60347 13.8025 7.09372 14.6958 7.97254Z" fill="black"/>
</svg>
</button>
</div>
</div>
</div>
</header>
<!-- HEADER on DESKTOP -->
<header class="d-none d-md-block">
<!-- header top -->
<div class="header-top bg-10 c-5 fs-12 fw-6">
<div class="container container-big">
<div class="df fw jsb aic">
<!-- work time -->
<div>
<span class="mr-1">Казань, ул. Рихарда Зорге 66, ТЦ Олимп 3 этаж: </span><span class="c-16 tnw" title="Ежедневно с 9:00 до 22:00">9:00 - 22:00</span>
</div>
<div class="df aic">
<!-- phone -->
<span class="mr-10">
<a href="tel:+7(952)034-36-34" title="Позвонить нам" class="tnw">
+7 (952) 034-36-34
</a>
</span>
<!-- social links -->
<div class="df aic">
<!-- facebook -->
<a target="_blank" rel="noopener noreferrer" href="https://ru-ru.facebook.com/" title="iSmart в Facebook" class="mr-10">
<svg class="vam" width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.6366 0.276611H0.916611C0.562611 0.276611 0.276611 0.562611 0.276611 0.916611V15.6366C0.276611 15.9906 0.562611 16.2766 0.916611 16.2766H15.6366C15.9906 16.2766 16.2766 15.9906 16.2766 15.6366V0.916611C16.2766 0.562611 15.9906 0.276611 15.6366 0.276611ZM13.7886 4.94661H12.5106C11.5086 4.94661 11.3146 5.42261 11.3146 6.12261V7.66461H13.7066L13.3946 10.0786H11.3146V16.2766H8.82061V10.0806H6.73461V7.66461H8.82061V5.88461C8.82061 3.81861 10.0826 2.69261 11.9266 2.69261C12.8106 2.69261 13.5686 2.75861 13.7906 2.78861V4.94661H13.7886Z" fill="white"/>
</svg>
</a>
<!-- insta -->
<a target="_blank" rel="noopener noreferrer" href="https://www.instagram.com/ismart116" title="iSmart в Instagram">
<svg class="vam" width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.19255 5.52497C6.72359 5.52497 5.5248 6.72375 5.5248 8.19272C5.5248 9.66168 6.72359 10.8605 8.19255 10.8605C9.66152 10.8605 10.8603 9.66168 10.8603 8.19272C10.8603 6.72375 9.66152 5.52497 8.19255 5.52497ZM16.1938 8.19272C16.1938 7.08799 16.2038 5.99327 16.1418 4.89055C16.0797 3.60971 15.7875 2.47296 14.8509 1.53635C13.9123 0.597732 12.7776 0.307541 11.4967 0.245501C10.392 0.18346 9.29728 0.193466 8.19455 0.193466C7.08983 0.193466 5.99511 0.18346 4.89238 0.245501C3.61154 0.307541 2.4748 0.599733 1.53818 1.53635C0.599563 2.47496 0.309372 3.60971 0.247332 4.89055C0.185291 5.99528 0.195297 7.09 0.195297 8.19272C0.195297 9.29544 0.185291 10.3922 0.247332 11.4949C0.309372 12.7757 0.601564 13.9125 1.53818 14.8491C2.4768 15.7877 3.61154 16.0779 4.89238 16.1399C5.99711 16.202 7.09183 16.192 8.19455 16.192C9.29928 16.192 10.394 16.202 11.4967 16.1399C12.7776 16.0779 13.9143 15.7857 14.8509 14.8491C15.7895 13.9105 16.0797 12.7757 16.1418 11.4949C16.2058 10.3922 16.1938 9.29744 16.1938 8.19272V8.19272ZM8.19255 12.2974C5.92106 12.2974 4.08785 10.4642 4.08785 8.19272C4.08785 5.92123 5.92106 4.08802 8.19255 4.08802C10.464 4.08802 12.2972 5.92123 12.2972 8.19272C12.2972 10.4642 10.464 12.2974 8.19255 12.2974ZM12.4654 4.87854C11.935 4.87854 11.5067 4.45026 11.5067 3.91991C11.5067 3.38957 11.935 2.96128 12.4654 2.96128C12.9957 2.96128 13.424 3.38957 13.424 3.91991C13.4241 4.04585 13.3995 4.17057 13.3513 4.28695C13.3032 4.40333 13.2326 4.50907 13.1436 4.59812C13.0545 4.68717 12.9488 4.75777 12.8324 4.80589C12.716 4.85401 12.5913 4.8787 12.4654 4.87854V4.87854Z" fill="white"/>
</svg>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- header bottom -->
<div class="header-bottom c-13 fs-16 pr">
<div class="container position-relative container-big align-items-stretch py-0 h-100 fnw df jsb aic">
<!-- logo -->
<a href="index.html" class="navbar-brand p-0 mr-10 mr-lg-4 mr-xl-5">
<img src="images/img/logo.svg" alt="iSmart" width="88" height="28">
</a>
<!-- navigation -->
<div class="col-auto col-xxl-4 fw-6 desktop-menu">
<a href="categories.html" class="hover-menu btn-trans d-flex fs-16 mx-xl-3 mx-xxl-4 position-relative">
<svg class="mr-1" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4 18H20C20.55 18 21 17.55 21 17C21 16.45 20.55 16 20 16H4C3.45 16 3 16.45 3 17C3 17.55 3.45 18 4 18ZM4 13H20C20.55 13 21 12.55 21 12C21 11.45 20.55 11 20 11H4C3.45 11 3 11.45 3 12C3 12.55 3.45 13 4 13ZM3 7C3 7.55 3.45 8 4 8H20C20.55 8 21 7.55 21 7C21 6.45 20.55 6 20 6H4C3.45 6 3 6.45 3 7Z" fill="#303030"/>
</svg>
<span>Каталог товаров</span>
<div class="triangle hidden"></div>
</a>
<div class="hover-menu hiddennav hidden">
<nav class="hiddennav-menu">
<div class="row">
<div class="col-8 col-xl-4 mb-4 mb-xl-0">
<div class="title"><a href="catalog.html">iPhone</a></div>
<ul class="wide-ul">
<li>
<a href="catalog.html">Iphone 12 pro</a>
</li>
<li>
<a href="catalog.html">Iphone 12 pro max</a>
</li>
<li>
<a href="catalog.html">Iphone 11 pro</a>
</li>
<li>
<a href="catalog.html">Iphone 11 pro max</a>
</li>
<li>
<a href="catalog.html">Iphone 11</a>
</li>
<li>
<a href="catalog.html">Iphone 10</a>
</li>
<li>
<a href="catalog.html">Iphone 10 R</a>
</li>
<li>
<a href="catalog.html">Iphone 10 S</a>
</li>
</ul>
</div>
<div class="col-4 col-xl-2 mb-4 mb-xl-0">
<div class="title"><a href="catalog.html">iPad</a></div>
<ul>
<li><a href="catalog.html">iPad Pro</a></li>
<li><a href="catalog.html">iPad</a></li>
<li><a href="catalog.html">iPad mini</a></li>
<li><a href="catalog.html">iPad Air</a></li>
</ul>
</div>
<div class="col-4 col-xl-2">
<div class="title"><a href="catalog.html">Macbook</a></div>
<ul>
<li><a href="catalog.html">Macbook Air</a></li>
<li><a href="catalog.html">Macbook Pro 13</a></li>
<li><a href="catalog.html">Macbook Pro 16</a></li>
<li><a href="catalog.html">iMac</a></li>
</ul>
</div>
<div class="col-4 col-xl-2">
<div class="title"><a href="catalog.html">AirPods</a></div>
<ul>
<li><a href="catalog.html">AirPods</a></li>
<li><a href="catalog.html">AirPods Pro</a></li>
<li><a href="catalog.html">AirPods Max</a></li>
<li><a href="catalog.html">iPod touch</a></li>
</ul>
</div>
<div class="col-4 col-xl-2">
<div class="title"><a href="catalog.html">Аксессуары</a></div>
<ul>
<li><a href="catalog.html">Зарядные устройства</a></li>
<li><a href="catalog.html">Аккумуляторы</a></li>
<li><a href="catalog.html">Чехлы</a></li>
</ul>
</div>
</div>
</nav>
</div>
<!-- buyers info page -->
<a class="mx-xl-3 mx-xxl-4" href="buyer.html">Покупателю</a>
<!-- wholesalers page link -->
<a class="mx-xl-3 mx-xxl-4" href="wholesalers.html">Оптовикам</a>
<!-- discounts page link -->
<a class="mx-xl-3 mx-xxl-4" href="catalog.html">Скидки</a>
</div>
<!-- show search form button -->
<button title="Поиск по сайту" class="jse show-search ml-auto btn-trans mr-xxl-1">
<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.95084 2.99153C3.79216 4.1485 3.11825 5.70376 3.06643 7.34035C3.01462 8.97695 3.5888 10.5717 4.67198 11.7997C5.75515 13.0276 7.26579 13.7963 8.89606 13.9492C10.4966 14.0992 12.0942 13.6446 13.375 12.6767L16.7062 16.0087L16.7062 16.0087C16.7891 16.0915 16.8874 16.1572 16.9957 16.2021C17.1039 16.2469 17.2199 16.27 17.3371 16.27C17.4542 16.27 17.5702 16.2469 17.6785 16.2021C17.7867 16.1572 17.885 16.0915 17.9679 16.0087C18.0507 15.9258 18.1164 15.8275 18.1613 15.7192C18.2061 15.611 18.2292 15.495 18.2292 15.3779C18.2292 15.2607 18.2061 15.1447 18.1613 15.0365C18.1164 14.9282 18.0507 14.8299 17.9679 14.747L17.9679 14.747L14.6361 11.4161C15.6014 10.1351 16.0541 8.53858 15.9032 6.93955C15.7494 5.31066 14.9809 3.80151 13.754 2.71913C12.5271 1.63674 10.9338 1.06244 9.2985 1.11304C7.66315 1.16365 6.10851 1.83536 4.95084 2.99153ZM4.95084 2.99153L5.0215 3.06229L4.95084 2.99153ZM12.7889 4.25378C13.2264 4.68428 13.5744 5.19715 13.8128 5.76281C14.0512 6.32848 14.1752 6.93574 14.1777 7.54956C14.1802 8.16339 14.0611 8.77164 13.8274 9.33923C13.5936 9.90681 13.2498 10.4225 12.8158 10.8565C12.3817 11.2906 11.866 11.6344 11.2984 11.8682C10.7308 12.1019 10.1226 12.221 9.50877 12.2185C8.89494 12.216 8.28768 12.092 7.72202 11.8536C7.15636 11.6152 6.64349 11.2672 6.21299 10.8297C5.35268 9.95522 4.87275 8.77625 4.87774 7.54956C4.88274 6.32288 5.37225 5.14786 6.23966 4.28045C7.10706 3.41304 8.28208 2.92353 9.50877 2.91854C10.7355 2.91354 11.9144 3.39347 12.7889 4.25378Z" fill="black" stroke="black" stroke-width="0.2"/>
</svg>
</button>
<!-- search form -->
<form class="ml-2 col-9 search hidden header-search aic">
<div class="header-search-bg">
<!-- search input -->
<input required maxlength="35" type="search" class="header-search-input" placeholder="Искать на сайте" />
<!-- search button -->
<button class="go-search btn-trans">
<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.95084 2.99153C3.79216 4.1485 3.11825 5.70376 3.06643 7.34035C3.01462 8.97695 3.5888 10.5717 4.67198 11.7997C5.75515 13.0276 7.26579 13.7963 8.89606 13.9492C10.4966 14.0992 12.0942 13.6446 13.375 12.6767L16.7062 16.0087L16.7062 16.0087C16.7891 16.0915 16.8874 16.1572 16.9957 16.2021C17.1039 16.2469 17.2199 16.27 17.3371 16.27C17.4542 16.27 17.5702 16.2469 17.6785 16.2021C17.7867 16.1572 17.885 16.0915 17.9679 16.0087C18.0507 15.9258 18.1164 15.8275 18.1613 15.7192C18.2061 15.611 18.2292 15.495 18.2292 15.3779C18.2292 15.2607 18.2061 15.1447 18.1613 15.0365C18.1164 14.9282 18.0507 14.8299 17.9679 14.747L17.9679 14.747L14.6361 11.4161C15.6014 10.1351 16.0541 8.53858 15.9032 6.93955C15.7494 5.31066 14.9809 3.80151 13.754 2.71913C12.5271 1.63674 10.9338 1.06244 9.2985 1.11304C7.66315 1.16365 6.10851 1.83536 4.95084 2.99153ZM4.95084 2.99153L5.0215 3.06229L4.95084 2.99153ZM12.7889 4.25378C13.2264 4.68428 13.5744 5.19715 13.8128 5.76281C14.0512 6.32848 14.1752 6.93574 14.1777 7.54956C14.1802 8.16339 14.0611 8.77164 13.8274 9.33923C13.5936 9.90681 13.2498 10.4225 12.8158 10.8565C12.3817 11.2906 11.866 11.6344 11.2984 11.8682C10.7308 12.1019 10.1226 12.221 9.50877 12.2185C8.89494 12.216 8.28768 12.092 7.72202 11.8536C7.15636 11.6152 6.64349 11.2672 6.21299 10.8297C5.35268 9.95522 4.87275 8.77625 4.87774 7.54956C4.88274 6.32288 5.37225 5.14786 6.23966 4.28045C7.10706 3.41304 8.28208 2.92353 9.50877 2.91854C10.7355 2.91354 11.9144 3.39347 12.7889 4.25378Z" fill="#0156FF" stroke="#0156FF" stroke-width="0.2"/>
</svg>
</button>
</div>
<!-- hide search button -->
<button class=" hide-search btn-trans">
<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.84607 3.84619L15.1538 15.154" stroke="black" stroke-width="2.4" stroke-linecap="round"/>
<path d="M15.1539 3.84619L3.84617 15.154" stroke="black" stroke-width="2.4" stroke-linecap="round"/>
</svg>
</button>
</form>
<!-- LOGIN LINK -->
<a class="ml-3 ml-xxl-4 jse fw-5 df aic login" href="login.html" aria-label="Войти в аккаунт" title="Войти в аккаунт">
<!-- login icon -->
<svg class="mr-10" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM7.07 18.28C7.5 17.38 10.12 16.5 12 16.5C13.88 16.5 16.51 17.38 16.93 18.28C15.57 19.36 13.86 20 12 20C10.14 20 8.43 19.36 7.07 18.28ZM18.36 16.83C16.93 15.09 13.46 14.5 12 14.5C10.54 14.5 7.07 15.09 5.64 16.83C4.62 15.49 4 13.82 4 12C4 7.59 7.59 4 12 4C16.41 4 20 7.59 20 12C20 13.82 19.38 15.49 18.36 16.83ZM12 6C10.06 6 8.5 7.56 8.5 9.5C8.5 11.44 10.06 13 12 13C13.94 13 15.5 11.44 15.5 9.5C15.5 7.56 13.94 6 12 6ZM12 11C11.17 11 10.5 10.33 10.5 9.5C10.5 8.67 11.17 8 12 8C12.83 8 13.5 8.67 13.5 9.5C13.5 10.33 12.83 11 12 11Z" fill="black"/>
</svg>
<span>Войти</span>
</a>
</div>
</div>
</header>
<!-- MAIN content -->
<main>
<!-- WIDGET links -->
<div class="widgets bg-7">
<a href="cart.html" class="basket" title="Перейти в корзину">
<span class="badge">20</span>
<span class="visually-hidden">товаров в корзине</span>
</a>
<a href="wish.html" class="fav" title="Перейти в избранное">
<span class="badge">12</span>
<span class="visually-hidden">товаров в избранном</span>
</a>
<a href="compare.html" class="compare-page" title="Перейти в сравнение">
<span class="badge">18</span>
<span class="visually-hidden">товаров в сравнении</span>
</a>
</div>
<!-- menu -->
<nav class="secondnav-block c-6 mb-30 fs-14">
<div class="container container-big">
<h3 class="visuallyhidden">Популярные товары</h3>
<ul class="secondnav-list df">
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link a-iphone">Iphone 12 pro</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link a-iphone">Iphone 12 pro max</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 11 pro</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 11 pro max</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 11</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 10</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 10R</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 10S</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link">Iphone 10</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link a-watch">Watch</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link a-pods">Air pods</a>
</li>
<li class="secondnav-item">
<a href="catalog.html" class="secondnav-link a-macbook">Macbook</a>
</li>
</ul>
</div>
</nav>
<!-- menu -->
<!-- breadcrumbs -->
<section class="mb-40 c-6 fs-14">
<h3 class="visuallyhidden">Хлебные крошки</h3>
<div class="container container-big">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Главная</a></li>
<li class="breadcrumb-item"><a href="index.html">Каталог</a></li>
<li class="breadcrumb-item active" aria-current="page">iPhone</li>
</ol>
</nav>
</div>
</section>
<!-- category catalog -->
<section class="mb-100">
<div class="container">
<h1 class="mb-30">Смартфоны iPhone</h1>
<div class="row">
<form class="filters-block col-lg-3 fw-5 fs-18 mb-30">
<fieldset class="df jsb mb-25 p-0 border-0 pt-1">
<legend class="p-0">Фильтры:</legend>
<button class="btn-trans c-3 fs-14" type="reset">Сбросить</button>
</fieldset>
<!-- model -->
<fieldset class="filtr-group">
<a data-toggle="collapse" href="#filtr-group-1" role="button" aria-expanded="false" aria-controls="filtr-group-1">
<span>Модель</span>
</a>
<div class="variants collapse" id="filtr-group-1">
<div>
<input type="checkbox" name="h" id="Iphone_10">
<label for="Iphone_10">Iphone 10</label>
</div>
<div>
<input type="checkbox" name="f" id="Iphone_11">
<label for="Iphone_11">Iphone 11</label>
</div>
</div>
</fieldset>
<!-- price -->
<fieldset class="filtr-group price">
<a data-toggle="collapse" href="#filtr-group-2" role="button" aria-expanded="false" aria-controls="filtr-group-2">
<span>Цена</span>
</a>
<div class="collapse" id="filtr-group-2">
<div class="price-block mb-4">
<div class="d-flex justify-content-between">
<div class="slider-range-inputs">
<input value="999" type="number" id="min-price" oninput="$('#slider-range').slider('values', 0, this.value);">
<span class="ml-2">₽</span>
</div>
<div class="slider-range-inputs">
<input value="8000" type="number" id="max-price" oninput="$('#slider-range').slider('values', 1, this.value);">
<span class="ml-2">₽</span>
</div>
</div>
<div id="slider-range"></div>
</div>
</div>
</fieldset>
<!-- size -->
<fieldset class="filtr-group">
<a data-toggle="collapse" href="#filtr-group-3" role="button" aria-expanded="false" aria-controls="filtr-group-3">
<span>Размеры</span>
</a>
<div class="variants collapse" id="filtr-group-3">
<div>
<input type="checkbox" name="w" id="Размер_1">
<label for="Размер_1">Размер 1</label>
</div>
<div>
<input type="checkbox" name="n" id="Размер_2">
<label for="Размер_2">Размер 2</label>
</div>
</div>
</fieldset>
<!-- camera -->
<fieldset class="filtr-group">
<a data-toggle="collapse" href="#filtr-group-4" role="button" aria-expanded="false" aria-controls="filtr-group-4">
<span>Камера</span>
</a>
<div class="variants collapse" id="filtr-group-4">
<div>
<input type="checkbox" name="x" id="Камера_1">
<label for="Камера_1">Камера 1</label>
</div>
<div>
<input type="checkbox" name="a" id="Камера_2">
<label for="Камера_2">Камера 2</label>
</div>
</div>
</fieldset>
<!-- colors -->
<fieldset class="filtr-group">
<a data-toggle="collapse" href="#filtr-group-5" role="button" aria-expanded="false" aria-controls="filtr-group-5">
<span>Цвет</span>
</a>
<div class="collapse" id="filtr-group-5">
<!-- COLORS -->
<div class="char">
<div class="colors-wr mini">
<div class="color-wr" style="color: #ADE0CD">
<input class="color-input" type="radio" name="ha" id="white" checked>
<div class="color"></div>
</div>
<div class="color-wr" style="color: #BA0C2F;">
<input class="color-input" type="radio" name="ha" id="red">
<div class="color"></div>
</div>
<div class="color-wr" style="color: #1F2120;">
<input class="color-input" type="radio" name="ha" id="black">
<div class="color"></div>
</div>
</div>
</div>
</div>
</fieldset>
<!-- memory -->
<fieldset class="filtr-group">
<a data-toggle="collapse" href="#filtr-group-6" role="button" aria-expanded="false" aria-controls="filtr-group-6">
<span> Объем встроенной памяти, ГБ</span>
</a>
<div class="variants collapse" id="filtr-group-6">
<div>
<input type="checkbox" name="memory" id="516">
<label for="516">516</label>
</div>
<div>
<input type="checkbox" name="memory" id="256">
<label for="256">256</label>
</div>
<div>
<input type="checkbox" name="memory" id="128">
<label for="128">128</label>
</div>
<div>
<input type="checkbox" name="memory" id="64">
<label for="64">64</label>
</div>
<div>
<input type="checkbox" name="memory" id="32">
<label for="32">32</label>
</div>
<div>
<input type="checkbox" name="memory" id="16">
<label for="16">16</label>
</div>
</div>
</fieldset>
</form>
<!-- right content -->
<div class="col-lg-9">
<!-- top filters -->
<div class="top-filters df aic jsb mb-10 fw">
<div class="input-group filter-sort br-4 df align-items-stretch flex-row mb-20" style="width: 288px; background-color: #EFEFEF; height: 36px;">
<label class="input-group-text" for="inputGroupSelect01">Сортировка:</label>
<select class="form-select" id="inputGroupSelect01">
<option selected>По умолчанию</option>
<option value="1">По возрастанию цены</option>
<option value="2">Со скидками</option>
</select>
</div>
<!-- FILTERS on right side -->
<div class="filters df pr mb-20">
<!-- filter 1 -->
<label class="filter active" for="in-stock">
<input type="radio" name="state" id="in-stock" checked>
<span>В наличии</span>
</label>
<!-- filter 2 -->
<label class="filter" for="under-order">
<input type="radio" name="state" id="under-order">
<span>Под заказ</span>
</label>
</div>
</div>
<!-- smartphones -->
<div class="product-group smartphones row row-cols-auto row-cols-sm-2 row-cols-lg-3 justify-content-start">
<!-- card 1 -->
<div>
<div class="product-preview">
<!-- image -->
<img class="img" src="images/img/product.png" alt="Apple iPhone 11 64GB">
<!-- badge -->
<div class="sale">- 100 % </div>
<!-- add to wish list -->
<button class="wish" data-bs-toggle="button"></button>
<!-- add to compare -->
<button class="compare" data-bs-toggle="button"></button>
<!-- product name -->
<div class="name">Apple iPhone 11 64GB</div>
<!-- product description -->
<div class="desc">iOS 13, поддержка двух SIM-карт (nano SIM+eSIM), двойная камера: 12 МП, 12 МП</div>
<div class="bottom">
<!-- product price -->
<div class="price">
<!-- old price -->
<del>100 990 ₽</del>
<!-- new price -->
<ins>88 990 ₽</ins>
</div>
<!-- add to cart -->
<button class="buy" data-bs-toggle="button">В корзину</button>
</div>
<!-- link on product page -->
<a href="card.html" class="stretched-link"></a>
</div>
</div>
<!-- card 2 -->
<div>
<div class="product-preview">
<!-- image -->
<img class="img" src="images/img/product-2.png" alt="Apple iPhone 11 64GB">
<!-- add to wish list -->
<button class="wish" data-bs-toggle="button"></button>
<!-- add to compare -->
<button class="compare" data-bs-toggle="button"></button>
<!-- product name -->
<div class="name">Apple iPhone 11 Pro 64GB</div>
<!-- product description -->
<div class="desc">iOS 13, поддержка двух SIM-карт (nano SIM+eSIM)</div>
<div class="bottom">
<!-- product price -->
<div class="price">
<!-- new price -->
<ins>88 990 ₽</ins>
</div>
<!-- add to cart -->
<button class="buy" data-bs-toggle="button">В корзину</button>
</div>
<!-- link on product page -->
<a href="card.html" class="stretched-link"></a>
</div>
</div>
<!-- card 3 -->
<div>
<div class="product-preview">
<!-- image -->
<img class="img" src="images/img/product.png" alt="Apple iPhone 11 64GB">
<!-- add to wish list -->
<button class="wish" data-bs-toggle="button"></button>
<!-- add to compare -->
<button class="compare" data-bs-toggle="button"></button>
<!-- product name -->
<div class="name">Apple iPhone 12 mini, 128 ГБ, синий</div>
<!-- product description -->
<div class="desc">iOS 13, поддержка двух SIM-карт (nano SIM+eSIM)</div>
<div class="bottom">
<!-- product price -->
<div class="price">
<!-- new price -->
<ins>88 990 ₽</ins>
</div>
<!-- add to cart -->
<button class="buy" data-bs-toggle="button">В корзину</button>
</div>
<!-- link on product page -->
<a href="card.html" class="stretched-link"></a>
</div>
</div>
<!-- card 4 -->
<div>
<div class="product-preview">
<!-- image -->
<img class="img" src="images/img/product-2.png" alt="Apple iPhone 11 64GB">
<!-- add to wish list -->
<button class="wish" data-bs-toggle="button"></button>
<!-- add to compare -->
<button class="compare" data-bs-toggle="button"></button>
<!-- product name -->
<div class="name">Apple iPhone 12 mini, 128 ГБ, синий</div>
<!-- product description -->
<div class="desc">iOS 13, поддержка двух SIM-карт (nano SIM+eSIM), двойная камера: 12 МП, 12 МП</div>
<div class="bottom">
<!-- product price -->
<div class="price">
<!-- old price -->
<del>100 990 ₽</del>
<!-- new price -->
<ins>88 990 ₽</ins>
</div>
<!-- add to cart -->
<button class="buy" data-bs-toggle="button">В корзину</button>
</div>
<!-- link on product page -->
<a href="card.html" class="stretched-link"></a>
</div>
</div>
</div>
<!-- smartphones -->
<nav aria-label="Навигация по страницам" class="w-100 br-4" style="border: 1px solid #F6F6FF;">
<ul class="fs-18 fw-4 c-9 pagination justify-content-center">
<li class="page-item active bg-4" aria-current="page">
<span class="page-link">1</span>
</li>
<li class="page-item"><a class="page-link" href="#2">2</a></li>
<li class="page-item"><a class="page-link" href="#3">3</a></li>
<li class="page-item"><a class="page-link" href="#4">4</a></li>
<li class="page-item"><a class="page-link" href="#5">5</a></li>
</ul>
</nav>
</div>
</div>
</div>
</section>
<!-- some text with product features -->
<section class="why-buy mb-100 container">
<div class="col-lg-10">
<h3 class="mb-40">Почему стоит купить Apple iPhone, а не другой смартфон:
</h3>
<ul class="ul-bullets">
<li>Многофункциональность. Этот гаджет в компактном корпусе из анодированного алюминия может заменить сразу несколько устройств: планшет, iPod плеер и коммуникатор.</li>
<li>Работа под управлением операционной системой OS X. Эта операционная система на сегодняшний день является наиболее стабильной благодаря ограничению функционала. Полностью исключается попадание в смартфон вредоносных программ.</li>
<li>Качество сборки. Компания Apple подвергает свою продукцию тщательной проверке, благодаря этому риск купить бракованный товар сведён практически к нулю.</li>
<li>Защита от кражи. Каждый смартфон имеет свой индивидуальный номер и маячок. В случае кражи или потери его можно найти, так как через определённые промежутки времени аппарат автоматически передаёт сигнал на спутник о своём местонахождении.</li>
<li>Наличие большого количества дополнительных возможностей. В смартфон Apple iPhone разработчиками заложен ряд дополнительных приложений, которые могут пригодиться владельцу в различных ситуациях. Например, автоматическая подстройка яркости
дисплея.
</li>
<li>Компактность.</li>
</ul>
</div>
</section>
<!-- advantages list -->
<section class="mb-100">
<div class="container">
<h3 class="mb-40">Преимущества нашего магазина:</h3>
<ul class="ul-bullets" style="max-width: 700px;">
<li>Широкий ассортимент айфонов различных моделей.</li>
<li>Гарантия на оригинальную продукцию составляет 1 год.</li>
<li>Строгое соблюдение прав потребителя, в случае обнаружения брака будет произведён обмен или возврат денежных средств.</li>
<li>Компетентность наших консультантов.</li>
<li>Оперативная работа технической поддержки.</li>
<li>Доставка по РТ.</li>
</ul>
</div>
</section>
<!-- contacts map -->
<section class="contacts">
<h3 class="visuallyhidden">Контакты</h3>
<!-- contacts map -->
<div class="contacts-map bg-4">
<script async src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Ae4ac374754e68dd1e029f03ef1697d84ca98b38fa4cfe5bd1ddce64e759a04e6&width=100%25&height=100%25&lang=ru_RU&scroll=false"></script>
<!-- map height 580 -->
</div>
</section>
<!-- contacts map -->
</main>
<!-- footer -->
<footer class="bg-1 c-5">
<div class="container container-big pr">
<div class="row">
<!-- newsletter form -->
<form class="footer-form df fw mb-40" action="#" method="POST">
<div class="col-12 col-lg-6 col-xl-5 col-xxl-4 text-center text-md-left">
<h2 class="c-5 mb-14">Подпишитесь на рассылку</h2>
<p class="mb-16">Узнавайте первыми о наших новинках и акциях</p>
</div>
<div class="col-12 col-lg-6 df fw flex-sm-nowrap">
<input required type="email" name="newsletter-input" id="newsletter-input" placeholder="Ваш email" class="col-12 col-sm-7 col-xxl-6 br-4 fw-3 mb-16 mr-10">
<button class="btn btn-purple col-12 col-sm-5 col-lg-4 col-xxl-3 mb-16" type="button" data-bs-toggle="modal" data-bs-target="#newsletterModal" id="newsletter-btn">Подписаться</button>
</div>
</form>
<!-- footer nav -->
<nav class="footernav df jsb row align-items-start mb-25">
<!-- info list -->
<ul class="footernav-list col-sm-5 col-lg-2 mb-30">
<li class="footernav-heading mb-25">Информация</li>
<li class="footernav-item">
<a href="buyer.html" class="footernav-link">Как заказать</a>
</li>
<li class="footernav-item">
<a href="buyer.html" class="footernav-link">Условия доставки</a>
</li>
<li class="footernav-item">
<a href="buyer.html" class="footernav-link">Условия оплаты</a>
</li>
<li class="footernav-item">
<a href="buyer.html" class="footernav-link">Гарантия на товар</a>
</li>
<li class="footernav-item">
<a href="buyer.html" class="footernav-link">Отзывы</a>
</li>
<li class="footernav-item">
<a href="news.html" class="footernav-link">Новости</a>
</li>
</ul>
<!-- products links list -->
<ul class="footernav-list col-sm-7 col-lg-4 df aie jsb mb-30">
<li class="col-lg-6">
<ul>
<li class="footernav-heading mb-25"><a href="categories.html">Продукция</a></li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 12 pro</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 12 pro max</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 11 pro</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 11 pro max</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 11</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 10</a>
</li>
</ul>
</li>
<li class="col-lg-6">
<ul>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 10R</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 10S</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Iphone 8</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Watch</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Air pods</a>
</li>
<li class="footernav-item">
<a href="catalog.html" class="footernav-link">Macbook</a>
</li>
</ul>
</li>
</ul>
<!-- contacts list -->
<ul class="footernav-list col-lg-3 mb-30">
<li class="footernav-heading mb-25"><a href="contacts.html">Контакты</a></li>
<li class="footernav-item">
<dl>
<dt>Адрес:</dt>
<dd>Казань, ул. Рихарда Зорге 66, ТЦ Олимп 3 этаж
</dd>
</dl>
</li>
<li class="footernav-item">
<dl>
<dt>Телефон:</dt>
<dd>
<a href="tel:+7(952)034-36-34" title="Позвонить нам">
+7 (952) 034-36-34
</a>
</dd>
</dl>
</li>
<li class="footernav-item">
<dl>
<dt>Режим работы:</dt>
<dd>Пн–Вс: 9:00–22:00
</dd>
</dl>
</li>
<li class="footernav-item">
<dl>
<dt>Email:</dt>
<dd title="Написать нам">
<a href="mailto:[email protected]">[email protected]
</a>
</dd>
</dl>
</li>
</ul>
<!-- payment types and social links -->
<div class="df fw col-lg-3 col-xxl-2">
<!-- payment types -->
<ul class="col-sm-6 col-md-12 footernav-list mb-30">
<li class="footernav-heading mb-10">Мы принимаем<br> к оплате</li>
<li>
<ul class="payment-icons df">
<li class="payment-icon" title="PayPal">
<img src="images/img/paypal.svg" alt="PayPal">
</li>
<li class="payment-icon" title="Visa">
<img src="images/img/visa.svg" alt="Visa">
</li>
<li class="payment-icon" title="Maestro">
<img src="images/img/maestro.svg" alt="Maestro">
</li>
<li class="payment-icon" title="Мир">
<img src="images/img/mir.svg" alt="Мир">
</li>
</ul>
</li>
</ul>
<!-- social links -->
<ul class="col-sm-6 col-md-12 footernav-list">
<li class="footernav-heading mb-10">Наши социальные<br> сети</li>
<li>
<ul class="payment-icons df">
<li class="payment-icon" title="iSmart в Facebook">
<a target="_blank" rel="noopener noreferrer" href="https://ru-ru.facebook.com/">
<img src="images/icons/facebook.svg" alt="facebook">
</a>
</li>
<li class="payment-icon" title="iSmart в Instagram">
<a target="_blank" rel="noopener noreferrer" href="https://www.instagram.com/ismart116">
<img src="images/icons/insta.svg" alt="instagram">
</a>
</li>
</ul>
</li>
</ul>
</div>
</nav>
<!-- copyright -->
<div class="footer-bottom df fw aic jsb">
<p class="copyright mb-16">Все права защищены <time datetime="2020">2020</time> @ismart</p>
<address class="df aic mb-16">
<span>Создание и продвижение сайтов</span>
<a target="_blank" rel="noopener noreferrer" href="https://asmpromo.ru/" title="Создание сайтов от AsmPromo">
<img src="images/img/asm-promo.png" width="69" height="47" alt="Веб-студия AsmPromo">
</a>
</address>
</div>
</div>
</div>
</footer>
<!-- footer -->
<!-- anchor to top of page -->
<a id="to-top" class="hidden" title="В начало страницы"></a>
<!-- Subscription Newsletter Modal -->
<div class="modal fade" id="newsletterModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="newsletterModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm modal-dialog-centered">
<div class="modal-content mx-auto text-center">
<div class="modal-header">
<h3 class="modal-title mx-auto" id="newsletterModalLabel">Спасибо!</h3>
<button type="button" class="btn-close pa" data-bs-dismiss="modal" aria-label="Close">
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17.75 2.0125L15.9875 0.25L9 7.2375L2.0125 0.25L0.25 2.0125L7.2375 9L0.25 15.9875L2.0125 17.75L9 10.7625L15.9875 17.75L17.75 15.9875L10.7625 9L17.75 2.0125Z" fill="#C4C4C4"/>
</svg>
</button>
</div>
<div class="modal-body">
<p>Вам отправлено письмо для подтверждения подписки.</p>
</div>
<div class="modal-footer row-cols-1 row-cols-sm-auto jsc">
<button type="button" class="purple bttn" data-bs-dismiss="modal">Хорошо</button>
</div>
</div>
</div>
</div>
<!-- bootstrap 5 js -->
<!-- JavaScript min Bundle with Popper.js -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha2/js/bootstrap.bundle.min.js" integrity="sha384-BOsAfwzjNJHrJ8cZidOg56tcQWfp6y72vEJ8xQ9w6Quywb24iOsW913URv1IS4GD" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-q2kxQ16AaE6UbzuKqyBE9/u/KzioAlnx2maXQHiDX9d4/zp8Ok3f+M7DPm+Ib6IU" crossorigin="anonymous"></script>
<!-- JavaScript min Bootstrap 5 -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-pQQkAEnwaBkjpqZ8RU1fF1AKtTcHJwFl3pblpTlHXybJjHpMYo79HY3hIi4NKxyj" crossorigin="anonymous"></script>
<!-- JQUERY min js -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<!-- price range min js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" integrity="sha512-uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy+D176RYoop1Da+f9mvkYrmj5MCLZWEtQuA==" crossorigin="anonymous"></script>
<!-- main min js -->
<script src="js/script.min.js"></script>
</body>
</html>