@megafon/ui-shared 6.5.0 → 6.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (186) hide show
  1. package/CHANGELOG.md +22 -3
  2. package/dist/es/components/AccordionBox/AccordionBox.css +2 -2
  3. package/dist/es/components/AccordionBox/AccordionBox.js +1 -1
  4. package/dist/es/components/AudioPlayer/AudioPlayer.js +1 -1
  5. package/dist/es/components/AudioPlayer/AudioProgress.js +1 -1
  6. package/dist/es/components/AudioPlayer/AudioRange.js +1 -1
  7. package/dist/es/components/AudioPlayer/AudioVolume.js +1 -1
  8. package/dist/es/components/AudioPlayer/style/AudioPlayer.css +10 -10
  9. package/dist/es/components/AudioPlayer/style/AudioProgress.css +5 -5
  10. package/dist/es/components/AudioPlayer/style/AudioRange.css +8 -8
  11. package/dist/es/components/AudioPlayer/style/AudioVolume.css +7 -7
  12. package/dist/es/components/BannerBox/BannerBox.js +1 -1
  13. package/dist/es/components/BenefitsIcons/BenefitsIcons.js +1 -1
  14. package/dist/es/components/BenefitsIcons/BenefitsIconsTile.js +1 -1
  15. package/dist/es/components/BenefitsIcons/style/BenefitsIcons.css +9 -9
  16. package/dist/es/components/BenefitsIcons/style/BenefitsIconsTile.css +24 -24
  17. package/dist/es/components/BenefitsPictures/BenefitsPictures.js +1 -1
  18. package/dist/es/components/BenefitsPictures/BenfitsPictures.css +9 -9
  19. package/dist/es/components/BlogBox/BlogBox.css +17 -17
  20. package/dist/es/components/BlogBox/BlogBox.js +1 -1
  21. package/dist/es/components/BlogBox/components/BlogBoxTile.css +34 -34
  22. package/dist/es/components/BlogBox/components/BlogBoxTile.js +1 -1
  23. package/dist/es/components/Breadcrumbs/Breadcrumbs.css +9 -9
  24. package/dist/es/components/Breadcrumbs/Breadcrumbs.js +1 -1
  25. package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.css +3 -3
  26. package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.js +1 -1
  27. package/dist/es/components/ButtonBanner/ButtonBanner.css +21 -21
  28. package/dist/es/components/ButtonBanner/ButtonBanner.js +1 -1
  29. package/dist/es/components/ButtonLinkBox/ButtonLinkBox.css +3 -3
  30. package/dist/es/components/ButtonLinkBox/ButtonLinkBox.js +1 -1
  31. package/dist/es/components/Card/Card.css +60 -60
  32. package/dist/es/components/Card/Card.js +1 -1
  33. package/dist/es/components/CardsBox/CardsBox.js +1 -1
  34. package/dist/es/components/CarouselBox/CarouselBox.js +1 -1
  35. package/dist/es/components/Container/Container.css +1324 -1324
  36. package/dist/es/components/Container/Container.js +1 -1
  37. package/dist/es/components/DarkGradientCards/DarkGradientCards.css +2 -2
  38. package/dist/es/components/DarkGradientCards/DarkGradientCards.js +1 -1
  39. package/dist/es/components/DarkGradientCards/components/DarkGradientCard.css +27 -27
  40. package/dist/es/components/DarkGradientCards/components/DarkGradientCard.js +1 -1
  41. package/dist/es/components/DownloadLinks/DownloadLink.css +5 -5
  42. package/dist/es/components/DownloadLinks/DownloadLink.js +1 -1
  43. package/dist/es/components/DownloadLinks/DownloadLinks.css +7 -7
  44. package/dist/es/components/DownloadLinks/DownloadLinks.js +1 -1
  45. package/dist/es/components/ImageBanner/ImageBanner.css +41 -41
  46. package/dist/es/components/ImageBanner/ImageBanner.js +1 -1
  47. package/dist/es/components/InfoCards/InfoCards.css +14 -14
  48. package/dist/es/components/InfoCards/InfoCards.js +1 -1
  49. package/dist/es/components/InfoCards/components/InfoCard/InfoCard.css +43 -43
  50. package/dist/es/components/InfoCards/components/InfoCard/InfoCard.js +1 -1
  51. package/dist/es/components/Instructions/Instructions.css +140 -140
  52. package/dist/es/components/Instructions/Instructions.js +1 -1
  53. package/dist/es/components/NotificationBox/NotificationBox.js +1 -1
  54. package/dist/es/components/NotificationBox/style/NotificationBox.css +5 -5
  55. package/dist/es/components/PageTitle/PageTitle.css +15 -15
  56. package/dist/es/components/PageTitle/PageTitle.js +1 -1
  57. package/dist/es/components/Partners/Partners.css +8 -8
  58. package/dist/es/components/Partners/Partners.js +1 -1
  59. package/dist/es/components/PictureWithDescription/PictureWithDescription.css +12 -12
  60. package/dist/es/components/PictureWithDescription/PictureWithDescription.js +1 -1
  61. package/dist/es/components/Property/Property.css +28 -28
  62. package/dist/es/components/Property/Property.js +1 -1
  63. package/dist/es/components/Property/PropertyDescription.css +2 -2
  64. package/dist/es/components/Property/PropertyDescription.js +1 -1
  65. package/dist/es/components/SidePictureCards/SidePictureCards.js +1 -1
  66. package/dist/es/components/SidePictureCards/components/SidePictureCard.css +25 -25
  67. package/dist/es/components/SidePictureCards/components/SidePictureCard.js +1 -1
  68. package/dist/es/components/Steps/Steps.css +8 -8
  69. package/dist/es/components/Steps/Steps.js +1 -1
  70. package/dist/es/components/Steps/StepsItem.css +4 -4
  71. package/dist/es/components/Steps/StepsItem.js +1 -1
  72. package/dist/es/components/StoreBanner/StoreBanner.css +67 -67
  73. package/dist/es/components/StoreBanner/StoreBanner.js +1 -1
  74. package/dist/es/components/StoreButton/StoreButton.css +121 -121
  75. package/dist/es/components/StoreButton/StoreButton.js +1 -1
  76. package/dist/es/components/Table/Table.css +27 -27
  77. package/dist/es/components/Table/Table.js +1 -1
  78. package/dist/es/components/TabsBox/TabsBox.js +1 -1
  79. package/dist/es/components/TextBox/TextBox.css +6 -6
  80. package/dist/es/components/TextBox/TextBox.js +1 -1
  81. package/dist/es/components/TextBox/TextBoxPicture.css +6 -6
  82. package/dist/es/components/TextBox/TextBoxPicture.js +1 -1
  83. package/dist/es/components/TextWithIcon/TextWithIcon.css +1 -1
  84. package/dist/es/components/TextWithIcon/TextWithIcon.js +1 -1
  85. package/dist/es/components/TextWithIcon/TextWithIconItem.css +5 -5
  86. package/dist/es/components/TextWithIcon/TextWithIconItem.js +1 -1
  87. package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.css +7 -7
  88. package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.js +1 -1
  89. package/dist/es/components/VideoBanner/VideoBanner.css +44 -44
  90. package/dist/es/components/VideoBanner/VideoBanner.js +1 -1
  91. package/dist/es/components/VideoBlock/VideoBlock.css +18 -18
  92. package/dist/es/components/VideoBlock/VideoBlock.js +1 -1
  93. package/dist/es/helpers/getColumnConfig.d.ts +1 -1
  94. package/dist/lib/components/AccordionBox/AccordionBox.css +2 -2
  95. package/dist/lib/components/AccordionBox/AccordionBox.js +1 -1
  96. package/dist/lib/components/AudioPlayer/AudioPlayer.js +1 -1
  97. package/dist/lib/components/AudioPlayer/AudioProgress.js +1 -1
  98. package/dist/lib/components/AudioPlayer/AudioRange.js +1 -1
  99. package/dist/lib/components/AudioPlayer/AudioVolume.js +1 -1
  100. package/dist/lib/components/AudioPlayer/style/AudioPlayer.css +10 -10
  101. package/dist/lib/components/AudioPlayer/style/AudioProgress.css +5 -5
  102. package/dist/lib/components/AudioPlayer/style/AudioRange.css +8 -8
  103. package/dist/lib/components/AudioPlayer/style/AudioVolume.css +7 -7
  104. package/dist/lib/components/BannerBox/BannerBox.js +1 -1
  105. package/dist/lib/components/BenefitsIcons/BenefitsIcons.js +1 -1
  106. package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.js +1 -1
  107. package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +9 -9
  108. package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +24 -24
  109. package/dist/lib/components/BenefitsPictures/BenefitsPictures.js +1 -1
  110. package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +9 -9
  111. package/dist/lib/components/BlogBox/BlogBox.css +17 -17
  112. package/dist/lib/components/BlogBox/BlogBox.js +1 -1
  113. package/dist/lib/components/BlogBox/components/BlogBoxTile.css +34 -34
  114. package/dist/lib/components/BlogBox/components/BlogBoxTile.js +1 -1
  115. package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +9 -9
  116. package/dist/lib/components/Breadcrumbs/Breadcrumbs.js +1 -1
  117. package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.css +3 -3
  118. package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.js +1 -1
  119. package/dist/lib/components/ButtonBanner/ButtonBanner.css +21 -21
  120. package/dist/lib/components/ButtonBanner/ButtonBanner.js +1 -1
  121. package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.css +3 -3
  122. package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.js +1 -1
  123. package/dist/lib/components/Card/Card.css +60 -60
  124. package/dist/lib/components/Card/Card.js +1 -1
  125. package/dist/lib/components/CardsBox/CardsBox.js +1 -1
  126. package/dist/lib/components/CarouselBox/CarouselBox.js +1 -1
  127. package/dist/lib/components/Container/Container.css +1324 -1324
  128. package/dist/lib/components/Container/Container.js +1 -1
  129. package/dist/lib/components/DarkGradientCards/DarkGradientCards.css +2 -2
  130. package/dist/lib/components/DarkGradientCards/DarkGradientCards.js +1 -1
  131. package/dist/lib/components/DarkGradientCards/components/DarkGradientCard.css +27 -27
  132. package/dist/lib/components/DarkGradientCards/components/DarkGradientCard.js +1 -1
  133. package/dist/lib/components/DownloadLinks/DownloadLink.css +5 -5
  134. package/dist/lib/components/DownloadLinks/DownloadLink.js +1 -1
  135. package/dist/lib/components/DownloadLinks/DownloadLinks.css +7 -7
  136. package/dist/lib/components/DownloadLinks/DownloadLinks.js +1 -1
  137. package/dist/lib/components/ImageBanner/ImageBanner.css +41 -41
  138. package/dist/lib/components/ImageBanner/ImageBanner.js +1 -1
  139. package/dist/lib/components/InfoCards/InfoCards.css +14 -14
  140. package/dist/lib/components/InfoCards/InfoCards.js +1 -1
  141. package/dist/lib/components/InfoCards/components/InfoCard/InfoCard.css +43 -43
  142. package/dist/lib/components/InfoCards/components/InfoCard/InfoCard.js +1 -1
  143. package/dist/lib/components/Instructions/Instructions.css +140 -140
  144. package/dist/lib/components/Instructions/Instructions.js +1 -1
  145. package/dist/lib/components/NotificationBox/NotificationBox.js +1 -1
  146. package/dist/lib/components/NotificationBox/style/NotificationBox.css +5 -5
  147. package/dist/lib/components/PageTitle/PageTitle.css +15 -15
  148. package/dist/lib/components/PageTitle/PageTitle.js +1 -1
  149. package/dist/lib/components/Partners/Partners.css +8 -8
  150. package/dist/lib/components/Partners/Partners.js +1 -1
  151. package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +12 -12
  152. package/dist/lib/components/PictureWithDescription/PictureWithDescription.js +1 -1
  153. package/dist/lib/components/Property/Property.css +28 -28
  154. package/dist/lib/components/Property/Property.js +1 -1
  155. package/dist/lib/components/Property/PropertyDescription.css +2 -2
  156. package/dist/lib/components/Property/PropertyDescription.js +1 -1
  157. package/dist/lib/components/SidePictureCards/SidePictureCards.js +1 -1
  158. package/dist/lib/components/SidePictureCards/components/SidePictureCard.css +25 -25
  159. package/dist/lib/components/SidePictureCards/components/SidePictureCard.js +1 -1
  160. package/dist/lib/components/Steps/Steps.css +8 -8
  161. package/dist/lib/components/Steps/Steps.js +1 -1
  162. package/dist/lib/components/Steps/StepsItem.css +4 -4
  163. package/dist/lib/components/Steps/StepsItem.js +1 -1
  164. package/dist/lib/components/StoreBanner/StoreBanner.css +67 -67
  165. package/dist/lib/components/StoreBanner/StoreBanner.js +1 -1
  166. package/dist/lib/components/StoreButton/StoreButton.css +121 -121
  167. package/dist/lib/components/StoreButton/StoreButton.js +1 -1
  168. package/dist/lib/components/Table/Table.css +27 -27
  169. package/dist/lib/components/Table/Table.js +1 -1
  170. package/dist/lib/components/TabsBox/TabsBox.js +1 -1
  171. package/dist/lib/components/TextBox/TextBox.css +6 -6
  172. package/dist/lib/components/TextBox/TextBox.js +1 -1
  173. package/dist/lib/components/TextBox/TextBoxPicture.css +6 -6
  174. package/dist/lib/components/TextBox/TextBoxPicture.js +1 -1
  175. package/dist/lib/components/TextWithIcon/TextWithIcon.css +1 -1
  176. package/dist/lib/components/TextWithIcon/TextWithIcon.js +1 -1
  177. package/dist/lib/components/TextWithIcon/TextWithIconItem.css +5 -5
  178. package/dist/lib/components/TextWithIcon/TextWithIconItem.js +1 -1
  179. package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.css +7 -7
  180. package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.js +1 -1
  181. package/dist/lib/components/VideoBanner/VideoBanner.css +44 -44
  182. package/dist/lib/components/VideoBanner/VideoBanner.js +1 -1
  183. package/dist/lib/components/VideoBlock/VideoBlock.css +18 -18
  184. package/dist/lib/components/VideoBlock/VideoBlock.js +1 -1
  185. package/dist/lib/helpers/getColumnConfig.d.ts +1 -1
  186. package/package.json +4 -4
@@ -5,35 +5,35 @@ h4,
5
5
  h5 {
6
6
  margin: 0;
7
7
  }
8
- .mfui-instructions__title_resolution_mobile {
8
+ .mfui-v6-instructions__title_resolution_mobile {
9
9
  margin-bottom: 32px;
10
10
  text-align: center;
11
11
  }
12
12
  @media screen and (min-width: 768px) and (max-width: 1023px) {
13
- .mfui-instructions__title_resolution_mobile {
13
+ .mfui-v6-instructions__title_resolution_mobile {
14
14
  margin-bottom: 40px;
15
15
  }
16
16
  }
17
17
  @media screen and (min-width: 1024px) {
18
- .mfui-instructions__title_resolution_mobile {
18
+ .mfui-v6-instructions__title_resolution_mobile {
19
19
  display: none;
20
20
  }
21
21
  }
22
- .mfui-instructions__title_resolution_desktop {
22
+ .mfui-v6-instructions__title_resolution_desktop {
23
23
  margin-bottom: 40px;
24
24
  }
25
25
  @media screen and (max-width: 1023px) {
26
- .mfui-instructions__title_resolution_desktop {
26
+ .mfui-v6-instructions__title_resolution_desktop {
27
27
  display: none;
28
28
  }
29
29
  }
30
- .mfui-instructions .swiper-wrapper {
30
+ .mfui-v6-instructions .swiper-wrapper {
31
31
  display: -webkit-box;
32
32
  display: -ms-flexbox;
33
33
  display: flex;
34
34
  }
35
35
  @media screen and (min-width: 1024px) {
36
- .mfui-instructions__wrapper {
36
+ .mfui-v6-instructions__wrapper {
37
37
  display: -webkit-box;
38
38
  display: -ms-flexbox;
39
39
  display: flex;
@@ -46,40 +46,40 @@ h5 {
46
46
  }
47
47
  }
48
48
  @media screen and (min-width: 1024px) {
49
- .mfui-instructions__wrapper_vertical-align_top {
49
+ .mfui-v6-instructions__wrapper_vertical-align_top {
50
50
  -webkit-box-align: start;
51
51
  -ms-flex-align: start;
52
52
  align-items: flex-start;
53
53
  }
54
54
  }
55
55
  @media screen and (min-width: 1024px) {
56
- .mfui-instructions__wrapper_vertical-align_unset {
56
+ .mfui-v6-instructions__wrapper_vertical-align_unset {
57
57
  -webkit-box-align: unset;
58
58
  -ms-flex-align: unset;
59
59
  align-items: unset;
60
60
  }
61
61
  }
62
- .mfui-instructions__text {
62
+ .mfui-v6-instructions__text {
63
63
  margin-top: 48px;
64
64
  }
65
65
  @media screen and (max-width: 1023px) {
66
- .mfui-instructions__text {
66
+ .mfui-v6-instructions__text {
67
67
  text-align: center;
68
68
  }
69
69
  }
70
- .mfui-instructions__picture {
70
+ .mfui-v6-instructions__picture {
71
71
  position: relative;
72
72
  max-width: 530px;
73
73
  max-height: 490px;
74
74
  overflow: hidden;
75
75
  }
76
76
  @media screen and (max-width: 1023px) {
77
- .mfui-instructions__picture {
77
+ .mfui-v6-instructions__picture {
78
78
  margin: 0 auto;
79
79
  }
80
80
  }
81
81
  @media screen and (min-width: 1024px) {
82
- .mfui-instructions__picture {
82
+ .mfui-v6-instructions__picture {
83
83
  -webkit-box-ordinal-group: 3;
84
84
  -ms-flex-order: 2;
85
85
  order: 2;
@@ -87,28 +87,28 @@ h5 {
87
87
  }
88
88
  }
89
89
  @media screen and (min-width: 1024px) {
90
- .mfui-instructions__picture_align_left {
90
+ .mfui-v6-instructions__picture_align_left {
91
91
  -webkit-box-ordinal-group: 1;
92
92
  -ms-flex-order: 0;
93
93
  order: 0;
94
94
  margin-right: 40px;
95
95
  }
96
96
  }
97
- .mfui-instructions_mask_none .mfui-instructions__slide {
97
+ .mfui-v6-instructions_mask_none .mfui-v6-instructions__slide {
98
98
  display: -webkit-box;
99
99
  display: -ms-flexbox;
100
100
  display: flex;
101
101
  }
102
- .mfui-instructions__swiper-img {
102
+ .mfui-v6-instructions__swiper-img {
103
103
  width: 100%;
104
104
  height: 100%;
105
105
  }
106
- .mfui-instructions__swiper-img_video {
106
+ .mfui-v6-instructions__swiper-img_video {
107
107
  /* hack for fix not white video background */
108
108
  -webkit-filter: brightness(108.5%);
109
109
  filter: brightness(108.5%);
110
110
  }
111
- .mfui-instructions__img-wrapper {
111
+ .mfui-v6-instructions__img-wrapper {
112
112
  position: relative;
113
113
  display: -webkit-box;
114
114
  display: -ms-flexbox;
@@ -116,7 +116,7 @@ h5 {
116
116
  height: 490px;
117
117
  }
118
118
  @media screen and (max-width: 1023px) {
119
- .mfui-instructions__img-wrapper:before {
119
+ .mfui-v6-instructions__img-wrapper:before {
120
120
  content: '';
121
121
  position: absolute;
122
122
  right: 0;
@@ -130,27 +130,27 @@ h5 {
130
130
  background: var(--spbSky2);
131
131
  }
132
132
  }
133
- .mfui-instructions__device-screen {
133
+ .mfui-v6-instructions__device-screen {
134
134
  overflow: hidden;
135
135
  pointer-events: none;
136
136
  }
137
137
  @media screen and (max-width: 1023px) {
138
- .mfui-instructions_mask_black-iphone .mfui-instructions__img-wrapper,
139
- .mfui-instructions_mask_white-iphone .mfui-instructions__img-wrapper,
140
- .mfui-instructions_mask_android .mfui-instructions__img-wrapper {
138
+ .mfui-v6-instructions_mask_black-iphone .mfui-v6-instructions__img-wrapper,
139
+ .mfui-v6-instructions_mask_white-iphone .mfui-v6-instructions__img-wrapper,
140
+ .mfui-v6-instructions_mask_android .mfui-v6-instructions__img-wrapper {
141
141
  height: 421px;
142
142
  }
143
143
  }
144
- .mfui-instructions_mask_black-iphone .mfui-instructions__device-screen,
145
- .mfui-instructions_mask_white-iphone .mfui-instructions__device-screen,
146
- .mfui-instructions_mask_android .mfui-instructions__device-screen {
144
+ .mfui-v6-instructions_mask_black-iphone .mfui-v6-instructions__device-screen,
145
+ .mfui-v6-instructions_mask_white-iphone .mfui-v6-instructions__device-screen,
146
+ .mfui-v6-instructions_mask_android .mfui-v6-instructions__device-screen {
147
147
  width: 100%;
148
148
  height: 490px;
149
149
  margin: auto;
150
150
  }
151
- .mfui-instructions_mask_black-iphone .mfui-instructions__swiper,
152
- .mfui-instructions_mask_white-iphone .mfui-instructions__swiper,
153
- .mfui-instructions_mask_android .mfui-instructions__swiper {
151
+ .mfui-v6-instructions_mask_black-iphone .mfui-v6-instructions__swiper,
152
+ .mfui-v6-instructions_mask_white-iphone .mfui-v6-instructions__swiper,
153
+ .mfui-v6-instructions_mask_android .mfui-v6-instructions__swiper {
154
154
  position: absolute;
155
155
  top: 59px;
156
156
  right: 0;
@@ -160,33 +160,33 @@ h5 {
160
160
  margin: auto;
161
161
  overflow: hidden;
162
162
  }
163
- .mfui-instructions_mask_black-iphone .mfui-instructions__device-screen {
163
+ .mfui-v6-instructions_mask_black-iphone .mfui-v6-instructions__device-screen {
164
164
  background: url('./img/blackIphone.png') 50% no-repeat;
165
165
  background-size: contain;
166
166
  }
167
- .mfui-instructions_mask_white-iphone .mfui-instructions__device-screen {
167
+ .mfui-v6-instructions_mask_white-iphone .mfui-v6-instructions__device-screen {
168
168
  background: url('./img/whiteIphone.png') 50% no-repeat;
169
169
  background-size: contain;
170
170
  }
171
171
  @media screen and (max-width: 1023px) {
172
- .mfui-instructions_mask_android .mfui-instructions__img-wrapper {
172
+ .mfui-v6-instructions_mask_android .mfui-v6-instructions__img-wrapper {
173
173
  height: 424px;
174
174
  }
175
175
  }
176
- .mfui-instructions_mask_android .mfui-instructions__device-screen {
176
+ .mfui-v6-instructions_mask_android .mfui-v6-instructions__device-screen {
177
177
  background: url('./img/android.png') 50% no-repeat;
178
178
  background-size: contain;
179
179
  }
180
- .mfui-instructions_mask_android .mfui-instructions__swiper {
180
+ .mfui-v6-instructions_mask_android .mfui-v6-instructions__swiper {
181
181
  width: 206px;
182
182
  height: 370px;
183
183
  }
184
184
  @media screen and (max-width: 1023px) {
185
- .mfui-instructions_mask_new-iphone .mfui-instructions__img-wrapper {
185
+ .mfui-v6-instructions_mask_new-iphone .mfui-v6-instructions__img-wrapper {
186
186
  height: 460px;
187
187
  }
188
188
  }
189
- .mfui-instructions_mask_new-iphone .mfui-instructions__device-screen {
189
+ .mfui-v6-instructions_mask_new-iphone .mfui-v6-instructions__device-screen {
190
190
  position: relative;
191
191
  z-index: 2;
192
192
  width: 100%;
@@ -195,7 +195,7 @@ h5 {
195
195
  background: url('./img/newIphone.png') 50% no-repeat;
196
196
  background-size: contain;
197
197
  }
198
- .mfui-instructions_mask_new-iphone .mfui-instructions__swiper {
198
+ .mfui-v6-instructions_mask_new-iphone .mfui-v6-instructions__swiper {
199
199
  position: absolute;
200
200
  top: 14px;
201
201
  right: 0;
@@ -208,11 +208,11 @@ h5 {
208
208
  overflow: hidden;
209
209
  }
210
210
  @media screen and (max-width: 1023px) {
211
- .mfui-instructions_mask_iphone-12 .mfui-instructions__img-wrapper:before {
211
+ .mfui-v6-instructions_mask_iphone-12 .mfui-v6-instructions__img-wrapper:before {
212
212
  display: none;
213
213
  }
214
214
  }
215
- .mfui-instructions_mask_iphone-12 .mfui-instructions__device-screen {
215
+ .mfui-v6-instructions_mask_iphone-12 .mfui-v6-instructions__device-screen {
216
216
  position: relative;
217
217
  z-index: 2;
218
218
  width: 100%;
@@ -221,7 +221,7 @@ h5 {
221
221
  background: url('./img/iphone12.png') 50% no-repeat;
222
222
  background-size: contain;
223
223
  }
224
- .mfui-instructions_mask_iphone-12 .mfui-instructions__swiper {
224
+ .mfui-v6-instructions_mask_iphone-12 .mfui-v6-instructions__swiper {
225
225
  position: absolute;
226
226
  top: 14px;
227
227
  right: 0;
@@ -233,15 +233,15 @@ h5 {
233
233
  border-radius: 20px;
234
234
  overflow: hidden;
235
235
  }
236
- .mfui-instructions_mask_iphone-15 .mfui-instructions__img-wrapper {
236
+ .mfui-v6-instructions_mask_iphone-15 .mfui-v6-instructions__img-wrapper {
237
237
  height: 487px;
238
238
  }
239
239
  @media screen and (max-width: 1023px) {
240
- .mfui-instructions_mask_iphone-15 .mfui-instructions__img-wrapper:before {
240
+ .mfui-v6-instructions_mask_iphone-15 .mfui-v6-instructions__img-wrapper:before {
241
241
  display: none;
242
242
  }
243
243
  }
244
- .mfui-instructions_mask_iphone-15 .mfui-instructions__device-screen {
244
+ .mfui-v6-instructions_mask_iphone-15 .mfui-v6-instructions__device-screen {
245
245
  position: relative;
246
246
  z-index: 2;
247
247
  width: 100%;
@@ -250,7 +250,7 @@ h5 {
250
250
  background: url('./img/iphone15.png') 50% no-repeat;
251
251
  background-size: contain;
252
252
  }
253
- .mfui-instructions_mask_iphone-15 .mfui-instructions__swiper {
253
+ .mfui-v6-instructions_mask_iphone-15 .mfui-v6-instructions__swiper {
254
254
  position: absolute;
255
255
  top: 10px;
256
256
  right: 0;
@@ -262,17 +262,17 @@ h5 {
262
262
  border-radius: 20px;
263
263
  overflow: hidden;
264
264
  }
265
- .mfui-instructions_mask_android-cropped .mfui-instructions__img-wrapper {
265
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__img-wrapper {
266
266
  height: 420px;
267
267
  min-height: 420px;
268
268
  }
269
269
  @media screen and (min-width: 1024px) {
270
- .mfui-instructions_mask_android-cropped .mfui-instructions__img-wrapper {
270
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__img-wrapper {
271
271
  height: 440px;
272
272
  min-height: 440px;
273
273
  }
274
274
  }
275
- .mfui-instructions_mask_android-cropped .mfui-instructions__img-wrapper:before {
275
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__img-wrapper:before {
276
276
  content: '';
277
277
  position: absolute;
278
278
  right: 0;
@@ -285,7 +285,7 @@ h5 {
285
285
  margin: 0 auto;
286
286
  background: var(--spbSky2);
287
287
  }
288
- .mfui-instructions_mask_android-cropped .mfui-instructions__device-screen {
288
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__device-screen {
289
289
  position: relative;
290
290
  z-index: 1;
291
291
  width: 100%;
@@ -295,11 +295,11 @@ h5 {
295
295
  background-size: contain;
296
296
  }
297
297
  @media screen and (min-width: 1024px) {
298
- .mfui-instructions_mask_android-cropped .mfui-instructions__device-screen {
298
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__device-screen {
299
299
  height: 574px;
300
300
  }
301
301
  }
302
- .mfui-instructions_mask_android-cropped .mfui-instructions__swiper {
302
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__swiper {
303
303
  position: absolute;
304
304
  top: 54px;
305
305
  right: 0;
@@ -309,16 +309,16 @@ h5 {
309
309
  overflow: hidden;
310
310
  }
311
311
  @media screen and (min-width: 1024px) {
312
- .mfui-instructions_mask_android-cropped .mfui-instructions__swiper {
312
+ .mfui-v6-instructions_mask_android-cropped .mfui-v6-instructions__swiper {
313
313
  top: 58px;
314
314
  width: 250px;
315
315
  }
316
316
  }
317
- .mfui-instructions_mask_iphone-cropped .mfui-instructions__img-wrapper {
317
+ .mfui-v6-instructions_mask_iphone-cropped .mfui-v6-instructions__img-wrapper {
318
318
  height: 420px;
319
319
  min-height: 420px;
320
320
  }
321
- .mfui-instructions_mask_iphone-cropped .mfui-instructions__img-wrapper:before {
321
+ .mfui-v6-instructions_mask_iphone-cropped .mfui-v6-instructions__img-wrapper:before {
322
322
  content: '';
323
323
  position: absolute;
324
324
  right: 0;
@@ -331,7 +331,7 @@ h5 {
331
331
  margin: 0 auto;
332
332
  background: var(--spbSky2);
333
333
  }
334
- .mfui-instructions_mask_iphone-cropped .mfui-instructions__device-screen {
334
+ .mfui-v6-instructions_mask_iphone-cropped .mfui-v6-instructions__device-screen {
335
335
  position: relative;
336
336
  z-index: 1;
337
337
  width: 100%;
@@ -340,7 +340,7 @@ h5 {
340
340
  background: url('./img/iphone-new.png') 50% no-repeat;
341
341
  background-size: contain;
342
342
  }
343
- .mfui-instructions_mask_iphone-cropped .mfui-instructions__swiper {
343
+ .mfui-v6-instructions_mask_iphone-cropped .mfui-v6-instructions__swiper {
344
344
  position: absolute;
345
345
  top: 38px;
346
346
  right: 0;
@@ -350,7 +350,7 @@ h5 {
350
350
  overflow: hidden;
351
351
  }
352
352
  @media screen and (min-width: 768px) and (max-width: 1023px) {
353
- .mfui-instructions_mask_laptop .mfui-instructions__img-wrapper {
353
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__img-wrapper {
354
354
  height: 0;
355
355
  padding-bottom: 53.4%;
356
356
  background: url('./img/laptop.png') 50% 0% no-repeat;
@@ -358,31 +358,31 @@ h5 {
358
358
  }
359
359
  }
360
360
  @media screen and (min-width: 480px) and (max-width: 767px) {
361
- .mfui-instructions_mask_laptop .mfui-instructions__img-wrapper {
361
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__img-wrapper {
362
362
  height: 208px;
363
363
  }
364
364
  }
365
365
  @media screen and (max-width: 479px) {
366
- .mfui-instructions_mask_laptop .mfui-instructions__img-wrapper {
366
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__img-wrapper {
367
367
  height: 115px;
368
368
  }
369
369
  }
370
370
  @media screen and (max-width: 479px) {
371
- .mfui-instructions_mask_laptop .mfui-instructions__img-wrapper:before {
371
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__img-wrapper:before {
372
372
  width: 310px;
373
373
  }
374
374
  }
375
375
  @media screen and (min-width: 480px) and (max-width: 767px) {
376
- .mfui-instructions_mask_laptop .mfui-instructions__img-wrapper:before {
376
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__img-wrapper:before {
377
377
  width: 460px;
378
378
  }
379
379
  }
380
380
  @media screen and (min-width: 768px) and (max-width: 1023px) {
381
- .mfui-instructions_mask_laptop .mfui-instructions__img-wrapper:before {
381
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__img-wrapper:before {
382
382
  width: 590px;
383
383
  }
384
384
  }
385
- .mfui-instructions_mask_laptop .mfui-instructions__device-screen {
385
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__device-screen {
386
386
  position: relative;
387
387
  width: 100%;
388
388
  height: 100%;
@@ -391,27 +391,27 @@ h5 {
391
391
  background-size: 100%;
392
392
  }
393
393
  @media screen and (min-width: 768px) and (max-width: 1023px) {
394
- .mfui-instructions_mask_laptop .mfui-instructions__device-screen {
394
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__device-screen {
395
395
  width: 530px;
396
396
  }
397
397
  }
398
398
  @media screen and (min-width: 480px) and (max-width: 767px) {
399
- .mfui-instructions_mask_laptop .mfui-instructions__device-screen {
399
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__device-screen {
400
400
  width: 450px;
401
401
  }
402
402
  }
403
403
  @media screen and (max-width: 479px) {
404
- .mfui-instructions_mask_laptop .mfui-instructions__device-screen {
404
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__device-screen {
405
405
  width: 270px;
406
406
  }
407
407
  }
408
408
  @media screen and (min-width: 1024px) {
409
- .mfui-instructions_mask_laptop .mfui-instructions__device-screen {
409
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__device-screen {
410
410
  background: url('./img/laptop.png') 50% no-repeat;
411
411
  background-size: contain;
412
412
  }
413
413
  }
414
- .mfui-instructions_mask_laptop .mfui-instructions__swiper {
414
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__swiper {
415
415
  position: absolute;
416
416
  top: 50%;
417
417
  right: 0;
@@ -423,35 +423,35 @@ h5 {
423
423
  transform: translate(-50%, -50%);
424
424
  }
425
425
  @media screen and (min-width: 480px) and (max-width: 767px) {
426
- .mfui-instructions_mask_laptop .mfui-instructions__swiper {
426
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__swiper {
427
427
  max-width: 345px;
428
428
  height: 190px;
429
429
  }
430
430
  }
431
431
  @media screen and (max-width: 479px) {
432
- .mfui-instructions_mask_laptop .mfui-instructions__swiper {
432
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__swiper {
433
433
  max-width: 210px;
434
434
  height: 105px;
435
435
  }
436
436
  }
437
437
  @media screen and (min-width: 1024px) {
438
- .mfui-instructions_mask_laptop .mfui-instructions__swiper {
438
+ .mfui-v6-instructions_mask_laptop .mfui-v6-instructions__swiper {
439
439
  -webkit-transform: translate(-50%, -53%);
440
440
  transform: translate(-50%, -53%);
441
441
  }
442
442
  }
443
443
  @media screen and (max-width: 1023px) {
444
- .mfui-instructions_mask_laptop-new .mfui-instructions__img-wrapper {
444
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__img-wrapper {
445
445
  height: 0;
446
446
  padding-bottom: 58.9%;
447
447
  background: url('./img/laptop-new.png') 50% 0% no-repeat;
448
448
  background-size: 100%;
449
449
  }
450
450
  }
451
- .mfui-instructions_mask_laptop-new .mfui-instructions__img-wrapper:before {
451
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__img-wrapper:before {
452
452
  display: none;
453
453
  }
454
- .mfui-instructions_mask_laptop-new .mfui-instructions__device-screen {
454
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__device-screen {
455
455
  position: relative;
456
456
  width: 100%;
457
457
  height: 100%;
@@ -460,27 +460,27 @@ h5 {
460
460
  background-size: 100%;
461
461
  }
462
462
  @media screen and (min-width: 768px) and (max-width: 1023px) {
463
- .mfui-instructions_mask_laptop-new .mfui-instructions__device-screen {
463
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__device-screen {
464
464
  width: 530px;
465
465
  }
466
466
  }
467
467
  @media screen and (min-width: 480px) and (max-width: 767px) {
468
- .mfui-instructions_mask_laptop-new .mfui-instructions__device-screen {
468
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__device-screen {
469
469
  width: 450px;
470
470
  }
471
471
  }
472
472
  @media screen and (max-width: 479px) {
473
- .mfui-instructions_mask_laptop-new .mfui-instructions__device-screen {
473
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__device-screen {
474
474
  width: 270px;
475
475
  }
476
476
  }
477
477
  @media screen and (min-width: 1024px) {
478
- .mfui-instructions_mask_laptop-new .mfui-instructions__device-screen {
478
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__device-screen {
479
479
  background: url('./img/laptop-new.png') 50% no-repeat;
480
480
  background-size: contain;
481
481
  }
482
482
  }
483
- .mfui-instructions_mask_laptop-new .mfui-instructions__swiper {
483
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__swiper {
484
484
  position: absolute;
485
485
  top: 4px;
486
486
  right: 0;
@@ -492,45 +492,45 @@ h5 {
492
492
  transform: translate(-49.5%, 0);
493
493
  }
494
494
  @media screen and (min-width: 480px) and (max-width: 767px) {
495
- .mfui-instructions_mask_laptop-new .mfui-instructions__swiper {
495
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__swiper {
496
496
  top: 7px;
497
497
  max-width: 415px;
498
498
  }
499
499
  }
500
500
  @media screen and (max-width: 479px) {
501
- .mfui-instructions_mask_laptop-new .mfui-instructions__swiper {
501
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__swiper {
502
502
  max-width: 302px;
503
503
  }
504
504
  }
505
505
  @media screen and (min-width: 768px) and (max-width: 1023px) {
506
- .mfui-instructions_mask_laptop-new .mfui-instructions__swiper {
506
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__swiper {
507
507
  top: 12px;
508
508
  }
509
509
  }
510
510
  @media screen and (min-width: 1024px) {
511
- .mfui-instructions_mask_laptop-new .mfui-instructions__swiper {
511
+ .mfui-v6-instructions_mask_laptop-new .mfui-v6-instructions__swiper {
512
512
  top: 50%;
513
513
  -webkit-transform: translate(-49.5%, -55%);
514
514
  transform: translate(-49.5%, -55%);
515
515
  }
516
516
  }
517
- .mfui-instructions__slide {
517
+ .mfui-v6-instructions__slide {
518
518
  -ms-flex-negative: 0;
519
519
  flex-shrink: 0;
520
520
  height: 100%;
521
521
  }
522
522
  @media screen and (max-width: 767px) {
523
- .mfui-instructions__articles {
523
+ .mfui-v6-instructions__articles {
524
524
  margin-top: 24px;
525
525
  }
526
526
  }
527
527
  @media screen and (min-width: 768px) and (max-width: 1023px) {
528
- .mfui-instructions__articles {
528
+ .mfui-v6-instructions__articles {
529
529
  margin-top: 32px;
530
530
  }
531
531
  }
532
532
  @media screen and (min-width: 1024px) {
533
- .mfui-instructions__articles {
533
+ .mfui-v6-instructions__articles {
534
534
  -webkit-box-ordinal-group: 2;
535
535
  -ms-flex-order: 1;
536
536
  order: 1;
@@ -538,44 +538,44 @@ h5 {
538
538
  }
539
539
  }
540
540
  @media screen and (min-width: 1024px) {
541
- .mfui-instructions__articles_align_right {
541
+ .mfui-v6-instructions__articles_align_right {
542
542
  margin-right: 40px;
543
543
  }
544
544
  }
545
- .mfui-instructions__articles-list {
545
+ .mfui-v6-instructions__articles-list {
546
546
  margin: 0;
547
547
  padding: 0;
548
548
  list-style-type: none;
549
549
  }
550
550
  @media screen and (min-width: 1024px) {
551
- .mfui-instructions__articles-list_mobile {
551
+ .mfui-v6-instructions__articles-list_mobile {
552
552
  display: none;
553
553
  }
554
554
  }
555
555
  @media screen and (max-width: 1023px) {
556
- .mfui-instructions__articles-list_desktop {
556
+ .mfui-v6-instructions__articles-list_desktop {
557
557
  display: none;
558
558
  }
559
559
  }
560
- .mfui-instructions__articles-item {
560
+ .mfui-v6-instructions__articles-item {
561
561
  position: relative;
562
562
  opacity: 0.5;
563
563
  }
564
564
  @media screen and (min-width: 1024px) {
565
- .mfui-instructions__articles-item {
565
+ .mfui-v6-instructions__articles-item {
566
566
  margin-bottom: 48px;
567
567
  }
568
568
  }
569
- .mfui-instructions__articles-item:hover,
570
- .mfui-instructions__articles-item_active {
569
+ .mfui-v6-instructions__articles-item:hover,
570
+ .mfui-v6-instructions__articles-item_active {
571
571
  opacity: 1;
572
572
  }
573
- .mfui-instructions__articles-item:hover .mfui-instructions__articles-item-dot,
574
- .mfui-instructions__articles-item_active .mfui-instructions__articles-item-dot {
573
+ .mfui-v6-instructions__articles-item:hover .mfui-v6-instructions__articles-item-dot,
574
+ .mfui-v6-instructions__articles-item_active .mfui-v6-instructions__articles-item-dot {
575
575
  color: var(--stcWhite);
576
576
  }
577
- .mfui-instructions__articles-item:hover .mfui-instructions__articles-item-dot:before,
578
- .mfui-instructions__articles-item_active .mfui-instructions__articles-item-dot:before {
577
+ .mfui-v6-instructions__articles-item:hover .mfui-v6-instructions__articles-item-dot:before,
578
+ .mfui-v6-instructions__articles-item_active .mfui-v6-instructions__articles-item-dot:before {
579
579
  top: 0;
580
580
  right: 0;
581
581
  bottom: 0;
@@ -583,11 +583,11 @@ h5 {
583
583
  background: var(--brandGreen);
584
584
  }
585
585
  @media screen and (min-width: 1024px) {
586
- .mfui-instructions__articles-item:last-child {
586
+ .mfui-v6-instructions__articles-item:last-child {
587
587
  margin-bottom: 0;
588
588
  }
589
589
  }
590
- .mfui-instructions__articles-item-dot {
590
+ .mfui-v6-instructions__articles-item-dot {
591
591
  position: absolute;
592
592
  display: inline-block;
593
593
  width: 40px;
@@ -602,11 +602,11 @@ h5 {
602
602
  cursor: pointer;
603
603
  }
604
604
  @media screen and (max-width: 479px) {
605
- .mfui-instructions__articles-item-dot {
605
+ .mfui-v6-instructions__articles-item-dot {
606
606
  min-width: 40px;
607
607
  }
608
608
  }
609
- .mfui-instructions__articles-item-dot:before {
609
+ .mfui-v6-instructions__articles-item-dot:before {
610
610
  content: '';
611
611
  position: absolute;
612
612
  top: 50%;
@@ -617,10 +617,10 @@ h5 {
617
617
  -webkit-transition: all 0.3s ease;
618
618
  transition: all 0.3s ease;
619
619
  }
620
- .mfui-instructions__articles-item-dot-number {
620
+ .mfui-v6-instructions__articles-item-dot-number {
621
621
  position: relative;
622
622
  }
623
- .mfui-instructions__articles-item-title {
623
+ .mfui-v6-instructions__articles-item-title {
624
624
  font-size: 15px;
625
625
  line-height: 24px;
626
626
  font-weight: 400;
@@ -628,11 +628,11 @@ h5 {
628
628
  cursor: pointer;
629
629
  }
630
630
  @media screen and (min-width: 1024px) {
631
- .mfui-instructions__articles-item-title {
631
+ .mfui-v6-instructions__articles-item-title {
632
632
  padding: 4px 0 0 56px;
633
633
  }
634
634
  }
635
- .mfui-instructions__articles-dots {
635
+ .mfui-v6-instructions__articles-dots {
636
636
  position: relative;
637
637
  display: -webkit-box;
638
638
  display: -ms-flexbox;
@@ -645,24 +645,24 @@ h5 {
645
645
  list-style-type: none;
646
646
  }
647
647
  @media screen and (max-width: 767px) {
648
- .mfui-instructions__articles-dots {
648
+ .mfui-v6-instructions__articles-dots {
649
649
  margin-top: 16px;
650
650
  }
651
651
  }
652
652
  @media screen and (min-width: 768px) and (max-width: 1023px) {
653
- .mfui-instructions__articles-dots {
653
+ .mfui-v6-instructions__articles-dots {
654
654
  margin-top: 24px;
655
655
  }
656
656
  }
657
657
  @media screen and (min-width: 1024px) {
658
- .mfui-instructions__articles-dots {
658
+ .mfui-v6-instructions__articles-dots {
659
659
  display: none;
660
660
  }
661
661
  }
662
- .mfui-instructions__articles-dots_text-after {
662
+ .mfui-v6-instructions__articles-dots_text-after {
663
663
  margin-bottom: 48px;
664
664
  }
665
- .mfui-instructions__articles-dot {
665
+ .mfui-v6-instructions__articles-dot {
666
666
  position: relative;
667
667
  display: inline-block;
668
668
  width: 8px;
@@ -672,40 +672,40 @@ h5 {
672
672
  background: var(--spbSky2);
673
673
  cursor: pointer;
674
674
  }
675
- .mfui-instructions__articles-dot:hover,
676
- .mfui-instructions__articles-dot_active {
675
+ .mfui-v6-instructions__articles-dot:hover,
676
+ .mfui-v6-instructions__articles-dot_active {
677
677
  background: var(--brandGreen);
678
678
  }
679
- .mfui-instructions__articles-dot_active {
679
+ .mfui-v6-instructions__articles-dot_active {
680
680
  width: 20px;
681
681
  }
682
- .mfui-instructions__articles-dot:last-child {
682
+ .mfui-v6-instructions__articles-dot:last-child {
683
683
  margin-right: 0;
684
684
  }
685
- .mfui-instructions__articles-title-block {
685
+ .mfui-v6-instructions__articles-title-block {
686
686
  margin: 0 auto;
687
687
  text-align: center;
688
688
  }
689
689
  @media screen and (max-width: 767px) {
690
- .mfui-instructions__articles-title-block {
690
+ .mfui-v6-instructions__articles-title-block {
691
691
  width: 55%;
692
692
  }
693
693
  }
694
694
  @media screen and (max-width: 479px) {
695
- .mfui-instructions__articles-title-block {
695
+ .mfui-v6-instructions__articles-title-block {
696
696
  width: 100%;
697
697
  }
698
698
  }
699
699
  @media screen and (min-width: 768px) and (max-width: 1023px) {
700
- .mfui-instructions__articles-title-block {
700
+ .mfui-v6-instructions__articles-title-block {
701
701
  width: 100%;
702
702
  max-width: 530px;
703
703
  }
704
704
  }
705
- .mfui-instructions__articles-title-block_with-numeration {
705
+ .mfui-v6-instructions__articles-title-block_with-numeration {
706
706
  text-align: left;
707
707
  }
708
- .mfui-instructions__articles-title {
708
+ .mfui-v6-instructions__articles-title {
709
709
  font-size: 15px;
710
710
  line-height: 24px;
711
711
  font-weight: 400;
@@ -716,7 +716,7 @@ h5 {
716
716
  -ms-flex-align: start;
717
717
  align-items: flex-start;
718
718
  }
719
- .mfui-instructions__articles-num {
719
+ .mfui-v6-instructions__articles-num {
720
720
  font-size: 15px;
721
721
  line-height: 24px;
722
722
  font-weight: 500;
@@ -739,18 +739,18 @@ h5 {
739
739
  background-color: var(--brandGreen);
740
740
  }
741
741
  @media screen and (min-width: 1024px) {
742
- .mfui-instructions__articles-num {
742
+ .mfui-v6-instructions__articles-num {
743
743
  display: none;
744
744
  }
745
745
  }
746
- .mfui-instructions__picture_background_spbSky0 {
746
+ .mfui-v6-instructions__picture_background_spbSky0 {
747
747
  border-radius: 12px;
748
748
  background-color: var(--spbSky0);
749
749
  }
750
- .mfui-instructions__picture_background_spbSky0 .mfui-instructions__img-wrapper:before {
750
+ .mfui-v6-instructions__picture_background_spbSky0 .mfui-v6-instructions__img-wrapper:before {
751
751
  display: none;
752
752
  }
753
- .mfui-instructions__arrow {
753
+ .mfui-v6-instructions__arrow {
754
754
  position: absolute;
755
755
  top: 50%;
756
756
  z-index: 2;
@@ -758,17 +758,17 @@ h5 {
758
758
  transform: translateY(-50%);
759
759
  }
760
760
  @media screen and (max-width: 767px) {
761
- .mfui-instructions__arrow {
761
+ .mfui-v6-instructions__arrow {
762
762
  display: none;
763
763
  }
764
764
  }
765
- .mfui-instructions__arrow_prev {
765
+ .mfui-v6-instructions__arrow_prev {
766
766
  left: 24px;
767
767
  }
768
- .mfui-instructions__arrow_next {
768
+ .mfui-v6-instructions__arrow_next {
769
769
  right: 24px;
770
770
  }
771
- .mfui-instructions__qr-code {
771
+ .mfui-v6-instructions__qr-code {
772
772
  position: absolute;
773
773
  top: 12px;
774
774
  right: 64px;
@@ -780,48 +780,48 @@ h5 {
780
780
  padding: 12px;
781
781
  }
782
782
  @media screen and (min-width: 768px) {
783
- .mfui-instructions__qr-code {
783
+ .mfui-v6-instructions__qr-code {
784
784
  display: block;
785
785
  }
786
786
  }
787
787
  @media screen and (min-width: 1024px) and (max-width: 1279px) {
788
- .mfui-instructions__qr-code {
788
+ .mfui-v6-instructions__qr-code {
789
789
  right: 44px;
790
790
  }
791
791
  }
792
- .mfui-instructions__qr-code-image {
792
+ .mfui-v6-instructions__qr-code-image {
793
793
  display: block;
794
794
  width: 100%;
795
795
  height: auto;
796
796
  }
797
- .mfui-instructions__qr-code-text {
797
+ .mfui-v6-instructions__qr-code-text {
798
798
  margin-bottom: 12px;
799
799
  font-weight: 500;
800
800
  font-size: 12px;
801
801
  line-height: 12px;
802
802
  text-align: center;
803
803
  }
804
- .mfui-instructions_reversed .mfui-instructions__title_resolution_mobile {
804
+ .mfui-v6-instructions_reversed .mfui-v6-instructions__title_resolution_mobile {
805
805
  margin-bottom: 16px;
806
806
  }
807
807
  @media screen and (max-width: 1023px) {
808
- .mfui-instructions_reversed .mfui-instructions__picture {
808
+ .mfui-v6-instructions_reversed .mfui-v6-instructions__picture {
809
809
  max-height: 100%;
810
810
  margin-bottom: 0;
811
811
  }
812
812
  }
813
813
  @media screen and (max-width: 1023px) {
814
- .mfui-instructions_reversed .mfui-instructions__articles {
814
+ .mfui-v6-instructions_reversed .mfui-v6-instructions__articles {
815
815
  display: none;
816
816
  }
817
817
  }
818
818
  @media screen and (max-width: 767px) {
819
- .mfui-instructions_reversed .mfui-instructions__articles-title-block {
819
+ .mfui-v6-instructions_reversed .mfui-v6-instructions__articles-title-block {
820
820
  margin-bottom: 32px;
821
821
  }
822
822
  }
823
823
  @media screen and (min-width: 768px) and (max-width: 1023px) {
824
- .mfui-instructions_reversed .mfui-instructions__articles-title-block {
824
+ .mfui-v6-instructions_reversed .mfui-v6-instructions__articles-title-block {
825
825
  margin-bottom: 40px;
826
826
  }
827
827
  }