Commit 97338adf3d4b0521f09122f675e64c7187cf5e00

Authored by Digvijay Singh
1 parent d974d32288
Exists in master and in 1 other branch admin

changes

No preview for this file type
src/assets/css/custom.css
1 html,
2 body {
3 height: 100%;
4 }
5
6 body {
7 display: -ms-flexbox;
8 display: flex;
9 -ms-flex-align: center;
10 align-items: center;
11 padding-top: 0px;
12 padding-bottom: 0px;
13 background-color:#DFE7EF;
14 }
15 #app, .landing-page{ width: 100%; display: block; float: left; height: 100%; margin-top: 0px; padding: 0px;}
16 /* heading */
17 h1{font-family: 'Bebas Neue', cursive;font-style: normal; font-weight: 600; font-size: 48px; line-height: 58px; color: #000000;}
18
19 /* spaces */
20 .wc-spc-lf-tp{ padding-top: 262px; padding-left: 40px; }
21
22
23 .h-100{height: 100%;}
24 .main-wrp{ height: 100%;padding-left: 56px; padding-right: 233px; background-image:url('../images/bg.svg'); background-repeat: no-repeat; background-attachment: fixed; background-position: bottom -10px left -130px;
25 background-size: 45%;}
26 /* navbar */
27 .spotLight-nav{ padding-top: 20px; z-index: 5;}
28 .spotLight-nav li a{font-family: 'Montserrat', sans-serif;
29 font-size: 16px;
30 font-style: normal;
31 font-weight: 400;
32 line-height: 22px;
33 letter-spacing: -0.7470597624778748px;
34 text-align: left; color:#000; opacity: 0.6;
35 }
36 .spotLight-nav li {margin-right: 14px;}
37 .spotLight-nav li.active a{font-weight: 600; opacity: 1;}
38 .spotLight-nav li.spotLight-img a{opacity: 1;}
39 .navbar-brand{ margin-right: 57px;}
40
41 /* ul list style */
42 .sign-in-up-list{ width: 325px; list-style-type: none; margin: 0px; padding:0px;font-family: 'Montserrat', sans-serif;
43 font-size: 20px;
44 font-style: normal;
45 font-weight: 500;
46 line-height: 24px; float: left; margin-top: 24px; }
47 .sign-in-up-list li{ margin-bottom: 26px;display: flex; color:#000;}
48 .sign-in-up-list li img{ margin-right: 10px; float: left; width: 24px; height: 24px;}
49 .sign-in-up-list li span{ float: left;}
50 /* form */
51 .form-layout{ width: 100%; display: block; float: left;}
52 .form-layout form{ display:block; float: left; width: 100%;}
53 .form-layout h5{font-family: 'Montserrat', sans-serif;font-size: 15px; font-style: normal;font-weight: 500;line-height: 19px; color: #000000;opacity: 0.5; text-align:center;}
54 .form-layout .social-login{ display: block; width: 339px;
55 margin: 0 auto; margin-top: 37px; margin-bottom: 37px; }
56 .form-layout .social-login ul{ list-style-type: none; margin:0px; padding:0px; display: flex;}
57 .form-layout .social-login ul li a img{ width:75px; height: 75px; float: left;}
58 .form-layout .social-login ul li:nth-child(2){margin:0 37px;}
59 .form-layout .fill-form{ width: 100%; display: block; float: left; margin-top:24px ;}
60
61 form input{background:#D2DCE7 !important; border: 1px solid rgba(0, 0, 0, 0.3) !important; box-sizing: border-box; border-radius: 5px !important; height: 50px !important; line-height: 50px !important; color: #000000;
62
63 font-family: 'Montserrat', sans-serif;
64 font-size: 13px;
65 font-style: normal;
66 font-weight: 600 !important; margin-bottom:16px;padding:0 18px !important;}
67 form input:focus{ box-shadow:0px !important; outline: 0px !important;}
68
69 /* placeholder */
70 form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
71 line-height: 18px;
72 color: #000000;
73 opacity: 0.5;
74 font-family: 'Montserrat', sans-serif;
75 font-size: 13px;
76 font-style: normal;
77 font-weight: 600;
78 }
79
80 form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
81 line-height: 18px;
82 color: #000000;
83 opacity: 0.5;
84 font-family: 'Montserrat', sans-serif;
85 font-size: 13px;
86 font-style: normal;
87 font-weight: 600;
88 }
89
90 form input::-ms-input-placeholder { /* Microsoft Edge */
91 line-height: 18px;
92 color: #000000;
93 opacity: 0.5;
94 font-family: 'Montserrat', sans-serif;
95 font-size: 13px;
96 font-style: normal;
97 font-weight: 600;
98 }
99 /* placeholder */
100 .sb-button{ background: #514DA7;
101 height: 50px;
102 line-height: 35px;
103 color: #fff;
104 font-family: 'Montserrat', sans-serif;
105 font-size: 13px;
106 font-style: normal;
107 font-weight: 600;
108 width: 100%;}
109 .sb-button img{ margin-right: 10px; width: 20px;}
110 .sb-button:hover{ color:#fff;}
111 .form-layout p{margin-top:17px ;}
112 .form-layout p{font-family: 'Montserrat', sans-serif;font-size: 15px; font-style: normal;font-weight: 500;line-height: 19px; color: #000000;opacity: 0.5; text-align:center;}
113 .form-layout p a{ font-family: 'Montserrat', sans-serif;font-size: 15px; font-style: normal;font-weight: 500;line-height: 19px; color: #000000;text-decoration: underline;}
114 .form-layout .forget-pass{font-family: 'Montserrat', sans-serif;font-size: 15px; font-style: normal;font-weight: 700;line-height: 19px; color: #000000;opacity:1 !important; text-align:center;}
115 .form-layout .forget-pass a{font-weight: 700;color: #514DA7 !important; text-decoration: none !important;
116 }
117 .form-layout p a:hover{ color:#000;}
118 .form-layout h3{font-family: 'Montserrat', sans-serif;font-size: 18px; font-style: normal;font-weight: 700;line-height: 21px; color: #000000; text-align: center;margin-top: 24px;}
119 .form-layout h3 a{font-family: 'Montserrat', sans-serif;font-size: 18px; font-style: normal;font-weight: 700;line-height: 21px; color: #514DA7; opacity: 1;}
120 .form-layout.signup-frm-spc{width: 300px; display: block; float: left; margin-top: 214px;}
121 .welcome-hd-back{
122 font-family: 'Bebas Neue', cursive;
123 font-style: normal;
124 font-weight: 600;
125 font-size: 106px;
126 line-height: 106px;
127 color: #000000;
128 }
129 .form-layout .go-back span{ font-weight: 500 !important;}
130 .reset-pass-spc{ margin-top: 110px;}
131
132 /* profile */
133 .inner-wrp {
134 height: 100%;
135 padding-left: 88px;
136 padding-right: 37px;
137 background:#fff;;
138 font-family: 'Montserrat', sans-serif;
139
140 }
141 .user-profile-photo{ width: 40px; position: relative;
142 height: 40px;
143 border-radius: 100px;
144 padding: 1px;}
145 .user-profile-photo a, img{ width: 100%;}
146 .inner-profile-ps{ width: 148px; height: 148px; float: left; display: block;}
147 .inner-wrp h1{ font-weight: 400; font-size:32px; line-height: 40px; color:#000; font-family: 'Montserrat', sans-serif;}
148 .tags{background: #BDDBFF; font-weight: 600; font-size:10px; color: #fff; padding: 2px 8px; border-radius:3px;}
149 .user-profile{ display: block;
150 float: left;
151 margin-left:30px;
152 position: relative;
153 width: 760px;}
154 .user-profile p{ font-weight: 500; font-size: 14px; line-height: 21px; color: #000; opacity: 0.5; width: 100%; display: block; float: left; margin:20px 0 0 0;}
155 .talk-to-me{ width: 100%; display: block; float: left; margin-top:20px;}
156 .talk-to-me span{font-weight: 500; font-size: 14px; line-height: 21px; color: #000; opacity: 0.5; float: left; margin-right:10px;}
157 .talk-to-me ul{ list-style-type: none; margin:0px; padding: 0px; float: left;margin-top:-1px;}
158 .talk-to-me ul li{ display: block; float: left;margin-right:3px;}
159 .talk-to-me ul li a{color:#000; text-decoration: none; font-weight: 500;}
160 .joined-info{ display: block; list-style-type: none; margin: 0px; padding: 0px; font-size: 13px; color:#000; }
161 .joined-info li a{ color:#000; opacity: 0.5;}
162 .joined-info li span{ width: 5px; height: 5px; background-color: #000; float: right; margin: 8px 10px 0 10px; border-radius:100%; opacity: 0.5;}
163 .joined-info li img{ width: 15px; float: right; margin-right: 5px; position: relative; margin-top:2px;}
164 .joined-info li{ float: left;}
165
166 /* list style */
167 .list-style-group{ width: 100%; display: block; float: left;}
168 .list-style-group p{color:#000; opacity: 0.5; letter-spacing: 2px;margin-bottom: 7px; font-size: 14px; text-transform: uppercase; font-weight: 600;}
169 .list-style{list-style-type: none; margin:0px; padding: 0px;}
170 .list-style li{ float: left;}
171 .list-style li a{ display: block; float: left;}
172 .list-style li a img{ width: 48px; display: block; float: left; }
173 .list-spc-top{ margin-top:15px ;}
174
175 /* social connects */
176 .social-connects{ display: block; list-style-type: none; margin: 0px; padding: 0px;}
177 .social-connects li{ float: left; margin-right:0px ;}
178 .social-connects li a{ display: block; float: left; padding: 11px;}
179 .social-connects li a img.twitter{ margin-top:3px;}
180 .social-connects li a.active{background: #f9fafc; width: 40px; height: 40px; border-radius: 5px;}
181 .social-connects li a img{ width: 19px; display: block; float: left;}
182 .social-connects li span{color:#000; opacity: 0.5; letter-spacing: 2px;margin-bottom: 7px;font-size: 14px; text-transform: uppercase; font-weight: 600; margin: 11px 30px 0 0;
183 float: left;}
184 .connect-social-channel{ margin-left: 10px !important; margin-top:8px !important; font-weight: 500 !important; font-style: normal !important; font-size: 14px !important; line-height: 22px !important; text-transform: unset !important; letter-spacing: 0px !important;}
185
186 /* profile tab */
187 .profile-tab-spc-top{margin-top:45px ; padding-top: 15px;}
188 .top-brd{border-top: 1px solid #DFE7EF;}
189 .profile-tab{ list-style-type: none; display: block; float: left; margin:0px ; padding: 0px;}
190 .profile-tab li{ float: left; padding-bottom: 10px; margin-right:76px ;}
191 .profile-tab li.active{ border-bottom: 4px solid #ef484f;}
192 .profile-tab li a{font-size: 20px;color:#000; text-decoration: none; font-weight: 400; line-height: 33px; }
193
194 /* profile data wrp */
195 .profile-data-wrp{ background:#dfe7ef; position: absolute; width: 100%; left: 0px;}
196 .data-wrp{padding-left: 88px; padding-right: 37px; padding-bottom: 88px; padding-top: 88px;}
197 .card-warpper{ width: 283px; background: #fff; border-radius: 4px; padding:23px; background-image: url('../images/card-bg.png'); background-repeat: repeat-y; background-position: top 0 right 20px; float: left; margin-right: 68px;}
198 .company-detail{ width: 100%;
199 display: block;
200 float: left;
201 position: relative;
202 margin-top: -63px;
203 margin-bottom: 21px;}
204 .company-detail .c-logo{ width: 82px; display: block; float: left;}
205 .company-detail .c-logo img{ width: 100%;}
206 .company-detail .c-tag img{ width: 100%;}
207 .company-detail .c-tag { width: 89px; display: block; float: right;}
208 .card-warpper h1{width: 198px; padding-bottom: 7px; border-bottom:1px solid #a5a5a5; font-family: 'Bebas Neue', cursive;font-style: normal; font-weight: 400; font-size: 35px; line-height: 42px; letter-spacing: 0.36px; color: #000000;}
209 .card-warpper .u-detail{ padding: 7px 0 7px 0; border-bottom:1px solid #a5a5a5; width: 198px; display: block; float: left;}
210 .card-warpper .u-detail img{ display: block; float: left; width: 24px; margin-right:17px;}
211 .card-warpper .u-detail h2{font-family: 'Montserrat', sans-serif; font-style: normal; font-weight: 700; font-size: 14px; line-height: 17px; letter-spacing: 0.15px; color: #000000;}
212 .card-warpper p{ float: left; padding: 12px 0 12px 0; width: 198px; border-bottom:1px solid #a5a5a5; font-family: 'Montserrat', sans-serif; font-style: normal; font-weight: 400; font-size: 14px;line-height: 18px; letter-spacing: 0.15px; color: #000000; }
213 .card-warpper .tags-list{ width: 198px; float: left; display: block; list-style-type: none; margin:0px; padding:0px;}
214 .card-warpper .tags-list li{ float: left; margin-right:9px ; margin-bottom: 9px;}
215 .card-warpper .tags-list li a{text-transform: uppercase; padding:5px 13px; border-radius: 10px; color: #fff;font-family: 'Montserrat', sans-serif; font-style: normal; font-weight: 600; font-size: 12px;line-height: 16px; letter-spacing: 0.15px;}
216 /* colors */
217 .cape-honey{ background: #fde2a3;}
218 .rose-bud{ background: #fba29a;}
219 .pattens-blue{ background: #ceeced;}
220
221 /* add new card */
222 .add-card-warpper{ width: 283px; background: transparent; border-radius: 4px; padding:23px; height: 356px; float: left; margin-right: 0px; border:2px dashed #fff;}
223 .add-card-warpper a{ display: block;
224 width: 86px;
225 margin: 0 auto;
226 margin-top: 92px;}
227
228 /* New Profile Buttons */
229 .profile-buttons{ width: 261px; display: block; margin:0 auto;}
230 /* button sm */
231 .profile-sm-bt{ width: 180px;
232 height: 54px;
233 border-radius: 5px;
234 border: 1px solid #514DA7;
235 color: #514DA7;
236 font-size: 16px;
237 font-weight: 500;
238 display: block;
239 line-height: 55px;
240 text-align: center;}
241 .profile-sm-bt:hover{ background-color:#514DA7; color:#fff; text-decoration: none;}
242 /* button md */
243 .profile-md-bt{ width:233px;
244 height: 54px;
245 border-radius: 5px;
246 border: 1px solid #514DA7;
247 color: #514DA7;
248 font-size: 16px;
249 font-weight: 500;
250 display: block;
251 line-height: 55px;
252 text-align: center;}
253 .profile-md-bt:hover{ background-color:#514DA7; color:#fff; text-decoration: none;}
254 /* button lg */
255 .profile-lg-bt{ width:261px;
256 height: 54px;
257 border-radius: 5px;
258 border: 1px solid #514DA7;
259 color: #514DA7;
260 font-size: 16px;
261 font-weight: 500;
262 display: block;
263 line-height: 55px;
264 text-align: center;}
265 .profile-lg-bt:hover{ background-color:#514DA7; color:#fff; text-decoration: none;}
266 .center-and-spc{ margin:0 auto; margin-bottom:15px;}
267 .bt-active{ background-color:#514DA7; color:#fff; text-decoration: none;}
268 /* Replies */
269 .replies{ display: block; float: left;}
270 .replies-wrp{ width: 1024px;display: block; float: left; border-bottom: 2px solid #fff;margin-left: 58px;margin-bottom: 30px;}
271 .replies-wrp h1{font-family: 'Bebas Neue', cursive; text-transform: uppercase; font-size: 28px;line-height:33px; font-style: normal; font-weight: 400; color: #000;}
272 .replies-wrp h1 span{font-family: 'Montserrat', sans-serif;
273 font-size: 12px;
274 font-style: normal;
275 font-weight: 400;
276 line-height: 14px; color:#000; opacity: 0.5;}
277 .comment-spc{ margin-left:9px ;}
278 .replies-wrp p{ width: 100%; display: block; float: left; font-weight: 500; font-size: 16px; line-height: 22px; color: #000; margin-top: 14px; margin-bottom: 28px;}
279 .replies-wrp:last-child{ border-bottom:0px; margin-bottom: 0px;}
280
281 /* team */
282 .verified-team{ width: 129px;
283 display: inline-table;
284 margin-top: 7px;
285 position: absolute;
286 margin-left: 10px;}
287 .verified-team img{ width: 100%; display: block; float: left;}
288 .active-company{ border-bottom: 4px solid #ef484f;}
289 .active-company a{ font-weight: 700 !important;}
290 .active-company a img{ width: 27px;margin-top: -6px; margin-right: 10px;}
291 .active-company a img.c-icon{margin-right: 0px; margin-left:10px;}
292 .c-social li a img{ width: auto !important;}
293 .company-footer{ width: 100%; display: block; float: left;}
294 .company-footer ul{ display: block; float: left; list-style-type: none; margin:6px; padding:0px;}
295 .company-footer ul li{float: left; margin-right: 10px;}
296 .company-footer ul li a{ font-size: 10px; font-style: normal; font-weight: 500;color: #979797;}
297 .company-footer ul li a img{ width: 15px; margin-right: 2px; margin-top: -2px;}
298 .company-footer .next{float: right; margin-top: -25px;
299 margin-right: 20px; width: 61px; height: 61px; background-color: #fff; border-radius: 10px; border:2px solid #514da7; display: block;}
300 .company-footer .next img{ width: 25px;
301 margin-top: 17px;
302 margin-left: 16px;}
303 .card-c-space-0{ padding: 0px !important; background-color: transparent !important;}
304 .c-detail-wrapper{ width: 100%; display: block; float: left; background: #fff;
305 border-radius: 4px;
306 padding: 23px; }
307 /* members */
308 .members-wrp{ width: 960px; display: block; float: left; margin:0px; padding: 0px; list-style-type: none;}
309 .members-wrp .member-list{ display: block; float: left; width: 411px; background-color: #fff; padding: 10px; border-radius: 50px; margin-right: 67px; margin-bottom: 24px;}
310 .members-wrp .member-list a{ display: block; float: left; width: 100%;}
311 .members-wrp .member-list a img{ width: 20%;display:block; float: left;}
312 .members-wrp .member-list a span{ display: block; float: left; width: 75%; margin-left:5%;}
313 .members-wrp .member-list a span h1{font-size: 24px; line-height: 29px; font-weight: 400; font-style: normal; color: #000; margin-top: 13px;}
314 .member-describe-list{ display: block; float: left; list-style-type: none;margin:0px; padding: 0px;}
315 .member-describe-list li{ float: left; font-size: 14px; line-height: 17px; font-style: normal; font-weight: 400;color: #000; opacity: 0.5;}
316 .member-describe-list li span{ width: 5px !important; height: 5px !important; background-color: #000; display: block; float: left; float: left; margin-left:unset !important; float: right !important; margin-right: 8px !important;
317 margin-left: 8px !important;
318 margin-top: 6px;
319 border-radius: 5px;}
320
321 /* popup */
322 .body-blur{ filter: blur(8px); -webkit-filter: blur(8px);}
323 .popup-wrp{ width: 100%; display: block; float: left; height: 100%; position: fixed; left: 0px; right: 0px; top: 0px; z-index: 1;}
324 .popup-wrp .overlay{ width: 100%; height: 100%; position: fixed; left: 0px; right: 0px; top: 0px; background-color: #dfe7efab; /* Add the blur effect */
325 filter: blur(8px);
326 -webkit-filter: blur(8px);}
327 .popup-set{ width: 530px;
328 background-color: #fff;
329 border-radius: 0 40px 40px 40px;
330 padding: 30px;
331 position: relative;
332 margin: 0 auto;
333 margin-top: 80px;}
334 .popup-header{ width: 100%; display: block; float: left; margin-top: -60px;}
335 .popup-header img{ width: 109px; display: block; float: left;}
336 .popup-header ul{ display: block;
337 list-style-type: none;
338 margin: 0px;
339 padding: 0px;
340 margin-top: 75px;
341 margin-left: 20px;
342 float: left;}
343 .popup-header ul li{ float: left; margin-right: 31px;}
344 .popup-header ul li a img{ width: 22px !important; float: left; display: block;}
345 .popup-header ul li a{color:#514DA7;}
346 .popup-header ul li a span{ display: block;
347 float: left;
348 margin-left: 10px;
349 width: 50px;
350 font-size: 14px;
351 line-height: 17px;
352 margin-top: -10px;}
353 .popup-body{ width: 100%;
354 display: block;
355 float: left;
356 max-height: 450px;
357 overflow-y: auto;
358 padding-right: 16px;}
359 .popup-forms{ width: 100%; display: block; float: left; margin-top: 50px;}
360
361
362 .popup-forms .floating-label label{font-size: 11px;
363 line-height: 19px;
364 font-size: 16px;
365 font-weight: 400;
366 color: #000;
367 position: absolute;
368 margin: 0px 10px 0 10px;
369 background: #fff;
370 padding: 0 3px;
371 position: absolute;
372 pointer-events: none;
373 top: 15px; opacity: 0.5;
374 transition: 0.2s ease all;
375 -moz-transition: 0.2s ease all;
376 -webkit-transition: 0.2s ease all;
377 }
378
379 .popup-forms .floating-label input{ outline: none; background-color: #fff !important; width: 100% !important;border: 1px solid #DFE7EF !important; font-size: 16px; font-weight: 500; line-height: 19px; color: #000;}
380 .popup-forms .floating-label select{ outline: none; height: 50px; margin-bottom: 0px; border-radius:5px; padding: 0 10px; background-color: #fff !important; width: 100% !important;border: 1px solid #DFE7EF !important; font-size: 16px; font-weight: 400; line-height: 19px; color: #808080;}
381
382 .popup-forms .floating-input input:focus{ outline: none;}
383 .popup-forms .floating-label input:focus~label{
384 top: -11px;
385 color: #514DA7;
386 font-size: 14px;background:#fff;
387 opacity:1;
388 }
389 .popup-forms .floating-label input:not(:placeholder-shown)~label {
390 position: absolute;
391 top: -11px;
392 background:#fff;
393
394 font-size: 14px;
395 color: #514DA7;opacity:1;
396 }
397 /* textarea */
398 .popup-forms .floating-label textarea{ height: 100px; outline: none; background-color: #fff !important; width: 100% !important;border: 1px solid #DFE7EF !important; font-size: 16px; font-weight: 500; line-height: 19px; color: #000;}
399 .popup-forms .floating-input textarea:focus{ outline: none;}
400 .popup-forms .floating-label textarea:focus~label{
401 top: -11px;
402 color: #514DA7;
403 font-size: 14px;background:#fff;
404 opacity:1;
405 }
406 .popup-forms .floating-label textarea:not(:placeholder-shown)~label {
407 position: absolute;
408 top: -11px;
409 background:#fff;
410
411 font-size: 14px;
412 color: #514DA7;opacity:1;
413 }
414 .popup-forms .form-group{ margin-bottom: 20px;}
415 .empty-lbl{ font-size: 16px; font-style: normal; line-height: 29px; color:#000; opacity: 0.5;}
416 .things{ font-size: 16px; line-height: 21px; color: #000; opacity: 0.5;}
417 .interests{ display: block; list-style-type: none;margin:0px; padding: 0px; }
418 .interests li{ float: left; margin-right: 20px; position: relative;}
419 .interests li span{ height: 40px; padding: 0 16px; line-height: 40px;background: #DFE7EF; display: block; float: left;
420 border-radius: 5px;}
421 .interests li input{ height: 40px !important; padding: 0 10px !important; line-height: 40px !important;border:2px solid #DFE7EF; display: block; float: left;
422 border-radius: 5px; background-color: #fff !important; width: 125px;}
423 .interests li a{ width: 20px;
424 display: block;
425 float: right;
426 margin: 6px 0px 0 114px;
427 position: absolute;}
428 /* color codes */
429 .silver{background-color: #C4C4C4;}
430 .milk-punch{background-color: #FFF6D7;}
431 .french-pass{background-color: #BDDBFF;}
432 .cyan-french-pass{background-color: #C0FAFE;}
433 .cosmos{background-color: #FFDBDC;}
434 .cape-Honey{background-color: #FEE6AC;}
435 .snuff{background-color: #E5DFF0;}
436 .catskillWhite{background-color: #DFE7EF;}
437 .white{background-color: #fff;}
438 /* color codes */
439 .colors{ width: 100%; display: block; float: left; list-style-type: none; margin:0px; padding: 0px;}
440 .colors li{ display: block; float: left; margin-right: 14px;}
441 .colors li a{ width: 22px; height: 22px; display: block; float: left; border:1px solid #ccc; border-radius: 10px;}
442 .colors li a.active{border: 2px solid #514DA7;}
443 .popup-forms .next-bt{ width: 99px;
444 height: 54px;
445 background: #514DA7;
446 display: block;
447 text-align: center;
448 border-radius: 5px;
449 color: #fff;
450 font-size: 16px;
451 line-height: 54px;
452 font-weight: 600;
453 position: absolute;
454 right: 50px;
455 bottom: -80px;}
456 .notifications{ font-size: 16px; line-height: 19px; color: #000; opacity: 0.5; width: 313px; float: left;}
457 .add-socail-ch{font-size: 16px; line-height: 19px; color: #000; opacity: 0.5; margin-top:20px ; margin-bottom: 30px;}
458 .add-socail-ch span{ border-bottom: 2px solid #DFE7EF;
459 display: block;
460 width: 270px;
461 float: right;
462 margin-top: 10px;}
463 .select-arrow{ display: block;
464 float: right;
465 position: absolute;
466 top: 13px;
467 right: 17px;
468 background: #fff;
469 width: 31px;
470 height: 17px;}
471 .select-arrow img{width: 15px;}
472 .popup-forms .save-bt{ width: 150px;
473 height: 54px;
474 background: #514DA7;
475 display: block;
476 text-align: center;
477 border-radius: 5px;
478 color: #fff;
479 font-size: 16px;
480 line-height: 54px;
481 font-weight: 600;
482 position: absolute;
483 right: 50px;
484 bottom: -80px;}
485 /* insights */
486 .insights-wrp{ background-image: url(../images/insights-bg.svg);
487 background-color: #DFE7EF;
488 height: 100%;
489 background-repeat: no-repeat;
490 background-position: top center;
491 background-size: contain; padding: 0 50px 0 100px;}
492 .insights-profile{width: 32px;
493 height: 32px;
494 float: right;
495 display: block;
496 position: absolute;
497 right: 0;}
498 .insights-searh a{ width: 21px;
499 height: 25px;
500 display: block;
501 position: absolute;
502 right: 24px;
503 top: 23px;}
504 .insights-searh a img{ width: 100%;}
505 .insights-searh input{background: #FFFFFF !important; border-radius: 10px !important; Height:72px !important; border:0px !important;}
506 .insights-searh input::-webkit-input-placeholder { /* Edge */
507 font-size: 22px; line-height: 28px; font-weight: 400; opacity: 0.5; color:#000;
508 }
509
510 .insights-searh input:-ms-input-placeholder { /* Internet Explorer 10-11 */
511 font-size: 22px; line-height: 28px; font-weight: 400; opacity: 0.5; color:#000;
512 }
513
514 .insights-searh input::placeholder {
515 font-size: 22px; line-height: 28px; font-weight: 400; opacity: 0.5; color:#000;
516 }
517 .insights-border span{ font-size: 15px; line-height: 19px; font-weight: 600; text-transform: uppercase;}
518 /* insights 2 */
519 .back-to-lib{ font-size: 12px;
520 line-height: 14px;
521 color: #000000;
522 font-weight: 500;
523 display: block;
524 float: left;}
525 .back-to-lib img{ width: 12px; float: left; margin-right: 10px; margin-top:2px;}
526 .insights-list{ list-style-type: none; margin:0px ; padding: 0px; width: 100%; display: block; float: left;;margin-top:20px;}
527 .insights-list li{ display: block; float: left;}
528 .insights-list li a{ display: block;
529 float: left;
530 margin: 0px;
531 padding: 5px 14px;
532 background: #70A853;
533 font-size: 15px;text-transform:uppercase;
534 font-weight: 700;
535 font-style: normal;
536 color: #fff;
537 border-radius: 50px;}
538 .insights-details{ width: 850px;display:block; float: left;}
539 .insights-details h2{ font-size: 20px; line-height: 24px; font-weight: 700 !important;font-weight: normal; margin-bottom:30px ; color:#000; margin-top:22px ;}
540 .features-group h3{ margin-top: 30px; margin-bottom: 15px;font-size: 15px;letter-spacing:1.92px; line-height: 22px;color: #70A853;}
541 .features-group-list{ list-style-type: none; margin: 0px; padding: 0px; width: 100%; display: block; float: left;}
542 .features-group-list li{ margin-bottom: 25px; width: 100%; display: block; float: left;}
543 .features-group-list li a{font-size: 16px; font-weight: 500; line-height: 22px; color:#000; text-decoration: underline;}
544 .features-group-list li a:hover{ text-decoration: none;}
545 .features-group-list li span{font-size: 10px; line-height: 12px; font-weight: 500; color: #000; opacity: 0.5; width: 100%; display: block; float: left;}
546 .features-group-list li a img{ width: 9px; }
547 .insights-rply img{ width: 14px;}
548 .insights-rply{font-weight: 400; font-size: 13px; line-height: 27px; color: #70A853; margin-top: 5px; float: left;}
549 .insights-rply:hover{color: #70A853;}
550 .active-green{border-bottom: 4px solid #70A853;}
551 .insights-spc{padding: 0 100px;}
552
553 /* insight page 1 */
554 .insights-border{height: 1px;
555 text-align: center;
556 display: block;
557 background: #FFFFFF;
558 clear: both;
559 width: 100%;
560 margin-top: 30px;}
561 .insights-border span{ text-align: center;
562 position: relative;
563 top: -13px;
564 background: #DFE7EF;
565 margin: 0 11px;
566 padding: 0px 10px;}
567 .insights-list-filter{display:table;float:left;width:100%;}
568 .insights-list-filter ul{ list-style-type: none; text-align: center;
569 margin-top:40px;
570 padding: 0px;
571 display: block;
572 float: left;
573 width: 100%;}
574 .insights-list-filter li{ display: inline-table; float: unset; margin: 0 23px 23px 23px;}
575 .insights-list-filter li a{padding: 5px 20px;color: #fff;
576 float: left;
577 text-transform: uppercase;
578 line-height: 26px;
579 text-align: center;
580 font-weight: 600;
581 font-size: 20px;
582 border-radius:30px;
583 }
584 .insights-list-filter li a:hover{text-decoration:none;}
585 .insights-products{display:block;float:left;width:100%; background-color: #fff;}
586 .insights-products h3{font-size:15px; line-height: 22px; letter-spacing: 1.92px; text-transform: uppercase;margin-bottom:20px;}
587 .insights-products h2{font-size:20px;color:#000000;font-weight:700;line-height:24px;margin-bottom:20px;}
588 .insights-products p{font-size:15px; margin-bottom: 0px;}
589 .insights-products span{float:right;}
590 .insight-mb-spc{margin-bottom:34px;}
591 .insights-searh{ width: 700px; margin: 0 auto; position: relative; margin-top: 110px;}
592 .insights-products a{ width: 18px; display: block; float: right;}
593
594 /* colors */
595 .lavender-blue-bg{background:#C1C0FE;}
596 .golden-tainoi-bg{background:#FBC647;}
597 .red-orange-bg{background:#F74536;}
598 .morning-glory-bg{background:#9DDADB;}
599 .dark-green-copper-bg{background:#477970;}
600 .radical-red-border{border:1px solid #EF484F;border-radius:10px;padding:30px 28px;}
601 .selective-yellow-border{border:1px solid #FABB05;border-radius:10px;padding:30px 28px;}
602 .lavender-blue-border{border:1px solid #C1C0FE;border-radius:10px;padding:30px 28px;}
603 .dark-green-copper-border{border:1px solid #477970;border-radius:10px;padding:30px 28px;}
604 .purple-heart-border{border:1px solid #673AB7;border-radius:10px;padding:30px 28px;}
605 .silver-border{border:1px solid #C4C4C4;border-radius:10px;padding:30px 28px;}
606 .radical-red-col{color:#EF484F;}
607 .selective-yellow-col{color:#FABB05;}
608 .lavender-blue-col{color:#C1C0FE;}
609 .dark-green-copper-col{color:#477970;}
610 .purple-heart-col{color:#673AB7;}
611 .silver-col{color:#C4C4C4;}
612 .radical-red-col:hover{color:#EF484F;text-decoration:none;}
613 .selective-yellow-col:hover{color:#FABB05;text-decoration:none;}
614 .lavender-blue-col:hover{color:#C1C0FE;text-decoration:none;}
615 .dark-green-copper-col:hover{color:#477970;text-decoration:none;}
616 .purple-heart-col:hover{color:#673AB7;text-decoration:none;}
617 .silver-col:hover{color:#C4C4C4;text-decoration:none;}
618 /* button */
619 .switch-btn {
620 position: relative;
621 display: inline-block;
622 width: 60px;
623 height: 24px;
624 }
625 .switch-btn input {
626 opacity: 0;
627 width: 0;
628 height: 0;
629 }
630 .rounded-toggle {
631 position: absolute;
632 cursor: pointer;
633 top: 0;
634 left: 0;
635 right: 0;
636 bottom: 0;
637 background: #DFE7EF;
638 -webkit-transition: .4s;
639 transition: .4s;
640 border-radius: 34px;
641 }
642 .rounded-toggle:before {
643 position: absolute;
644 content: "";
645 height: 14px;
646 width: 13px;
647 left: 10px;
648 bottom: 5px;
649 background-color: #514DA7;
650 -webkit-transition: .4s;
651 transition: .4s;
652 border-radius: 50%;
653 }
654 .toggle-btn:checked + .rounded-toggle {
655 background: #DFE7EF;
656 }
657
658 .toggle-btn:checked + .rounded-toggle:before{ background-color:#EF484F;;}
659 .toggle-btn:focus + .rounded-toggle{
660 box-shadow: 0 0 1px #2196F3;
661 }
662 .toggle-btn:checked + .rounded-toggle:before {
663 -webkit-transform: translateX(26px);
664 -ms-transform: translateX(26px);
665 transform: translateX(26px);
666 }
667 .switch-bt-wrp{margin-top: 15px; width: 111px;
668 float: right;
669 text-align: right; }
670 .switch-btn{float: left ;}
671 .onoff{ margin-top: -3px; float: right;}
672
673 /* intro Episode */
674 .episode-intro{ padding: 0 50px 0 30px; height: 100%;}
675 .bottom-startup{width: 1293px; display: block; float: left; margin:0 auto; height: 144px; border: 0.8px solid #514DA7; position: absolute;
676 bottom: 50px; z-index: 2;
677 right: 0;
678 left: 0;}
679 .bottom-startup .logo-wrp{ width: 140px; display: block; float: left;border-right: 0.8px solid #514DA7; height: 100%;}
680 .bottom-startup .logo-wrp a{ width: 100px; margin:0 auto;
681 display: block; margin-top: 28px;
682 }
683 .bottom-startup .logo-wrp a img{ width: 70px; display: block; margin:0 auto;}
684 .bottom-startup .logo-wrp a span{ font-weight: 400; font-size:13px; line-height: 25px; letter-spacing: -0.54px; width: 100%; display: block; float: left; text-align: center; color: #514DA7;}
685 .bottom-startup .title{ font-size: 48px;
686 font-family: 'Zuume';
687 font-weight: 400;
688 line-height: 144px;
689 color: #514DA7;
690 width: 440px;
691 height: 100%; float: left;
692 border-right: 0.8px solid #514DA7;
693 text-align: center;}
694 .bottom-startup .author-sec{ width: 200px; height: 100%; display: block; float: left; border-right: 0.8px solid #514DA7; color: #514DA7;
695 }
696 .bottom-startup .author-sec .top{ width: 100%;
697 display: block;
698 float: left;
699 padding: 20px 10px 10px 10px;
700 height: 72px;}
701 .bottom-startup .author-sec .top span{ font-size: 12px; line-height: 13px; font-weight: 500; width: 100%; display: block; display: block;}
702 .bottom-startup .author-sec .top .name{ font-size: 25px; line-height: 28px;
703 font-family: 'Zuume';
704 font-weight: 400;}
705 .bottom-startup .author-sec .bottom{ width: 100%; height: 100%;
706 border-top: 0.8px solid #514DA7;
707 display: block;
708 float: left;
709 padding: 0px 10px 0px 10px;
710 height: 72px;}
711 .bottom-startup .author-sec .bottom .left{ width: 40%; display: block; float: left; height: 100%; border-right: 0.8px solid #514DA7; padding-top: 20px;}
712 .bottom-startup .author-sec .bottom .right{ width: 60%; display: block; float: left; padding-top: 20px; padding-left: 10px;}
713 .bottom-startup .author-sec .bottom span{ font-size: 12px; line-height: 13px; font-weight: 500; width: 100%; display: block; display: block;}
714 .bottom-startup .author-sec .bottom .dt{ font-size: 25px; line-height: 28px;
715 font-family: 'Zuume';
716 font-weight: 400;}
717 .bottom-startup .author-sec.info{ width: 90px;}
718 .bottom-startup .author-sec.info .bt-brd{ border-top: 0.8px solid #514DA7; }
719 .bottom-startup .u-img-info{ display: block; float: left; width: 135px; height: 100%; border-right: 0.8px solid #514DA7;}
720 .bottom-startup .u-img-info img{ width: 103px; display: block; margin: 0 auto; margin-top: 22px;}
721 .bottom-startup .start{ width: 86px; display: block; float: left; background-color: #fff; height: 100%; padding-top: 48px;}
722 .bottom-startup .start a span{ font-size: 12px; line-height: 14px;letter-spacing:2px; font-weight: 600; text-align: center; width: 100%; display: block; float: left; text-transform: uppercase; color: #514DA7;}
723 .bottom-startup .start a img{ width: 24px;
724 display: block;
725 margin: 0 auto;
726 margin-bottom: 10px;}
727
728 /* compare */
729 .compare-c{ width: 475px;
730 display: block;
731 margin: 0 auto;
732 bottom: 50%;
733 position: absolute;
734 left: 0;
735 right: 0;
736 z-index: 2;}
737 .compare-c .logo-1{ width: 200px; display: block; float: left;}
738 .compare-c .vs{ width: 75px; display: block; float: left; font-size: 12px; line-height: 15px; font-weight: 700; color: #EF484F; text-align: center;
739 margin-top: 25px;}
740 .compare-c .logo-2{ width: 200px; display: block; float: left;}
741 .startup-wrp{ width: 100%;display: block; float: left; position: absolute; top: 0; left: 0; bottom: 0; overflow: hidden;}
742 .epi-bg{ position: absolute;
743 bottom: -152px;
744 left: 18%; width: 1920px;
745 z-index: 1;}
746 /* intro startup */
747 .intro-startup{ width: 100%;display: block; float: left; position: absolute; top: 0; left: 0; bottom: 0; height: 100%; }
748 .intro-startup .footer-nav{ width: 100%; display: block; float: left; position: absolute; bottom: 0; height: 80px; }
749 .intro-startup .footer-bottom{ width: 100%; display: block; float: left; height: 5px;}
750 .intro-startup .footer-bottom ul{ display: block; list-style-type: none; margin: 0px; padding:0px; }
751 .intro-startup .footer-bottom ul li{ height: 5px;
752 display: block;
753 float: left;
754 width: 49%;
755 background: #fff;}
756 .intro-startup .footer-top{ width: 100%; display: block; float: left; padding: 0 50px; height: 75px;}
757 .intro-startup .footer-top .top-intro-bt{display: block; list-style-type: none; margin: 0px; padding:0px; float: left;margin-top: 25px; position: absolute; }
758 .intro-startup .footer-top .top-intro-bt li{display: block; float: left;}
759 .intro-startup .footer-top .top-intro-bt li:first-child{ margin-right: 15px;}
760 .intro-startup .footer-top .top-intro-bt li a{ height: 30px; border: 1px solid #514DA7;box-sizing: border-box; border-radius: 5px; color: #514DA7; font-weight: 400; font-size: 13px; font-style: normal; line-height: 15px; padding: 6px 10px; display: block; float: left;}
761 .intro-startup .footer-top .top-intro-bt li a img{ width: 10px; display: block;float: left;margin-top: 3px; margin-right: 4px;}
762 .intro-startup .footer-top .top-intro-bt li a:hover{ background-color: #fff; text-decoration: none; border: 1px solid #fff;}
763 .smasung-g-10wrp{ width: 404px; display: block; height: 838px; position: absolute; background-image:url('../images/Samsung-Galaxy-S10.svg'); background-repeat: no-repeat; left: 0;
764 right: 0;
765 margin: 0 auto;
766 bottom: 0;
767 top: unset;
768 background-position: bottom;}
769 .samsung-compare-c{ width: 211px;
770 display: block;
771 margin: 0 auto;
772 position: absolute;
773 bottom: 25%;
774 left: 0;
775 right: 0;}
776 .samsung-compare-c img{ width: 100%;}
777 .samsung-compare-c .vs{ width: 100%; display: block; float: left; text-align:center; color: #EF484F; font-size: 12px; line-height: 15px; font-weight: 700; margin: 27px 0 14px 0;}
778
779 /* comment wrapper */
780 .smasung-g-10wrp .comment-box{ width: 428px;
781 display: block;
782 float: left; right: -394px;
783 position: absolute;
784 bottom: 50px;}
785 .comment-box-s-1{ width: 100%; display: block; background: #FFFFFF; float: left;
786 border: 1px solid #201E6A;
787 box-sizing: border-box;
788 box-shadow: 0px 4px 8px 5px rgba(0, 0, 0, 0.0975743);
789 border-radius: 25px 25px 0px 25px; margin-bottom: 15px;}
790 .comment-box-s-1 p{font-size: 21px; opacity: 0.9; line-height: 28px; font-weight: 500; color: #332B3C; width: 100%; float: left; display: block; margin: 0px; padding: 15px;}
791 .comment-box-s-1 .footer{background: #F7F9FB;
792 border-top: 1px solid #000000; display: block; float: left; width: 100%; padding: 15px;
793 box-sizing: border-box;
794 border-radius: 0px 0px 0px 25px;}
795 .comment-box-s-1 .footer a{color: #514DA7; font-weight: 700; margin-top:3px; font-size: 15px; line-height: 18px; text-transform: uppercase; float: left;}
796 .comment-box-s-1 .footer img{ width: 25px; display: block; float: left; margin-right: 12px;}
797 .key-arrow{ width: 50px; float: left; margin-top:5px;}
798 .comment-w-397{ width: 397px; float: right;}
799 .comment-box .user-photo{ width: 200px; display: block; float: right;}
800 .spot-light-top{ width: 927px;
801 height: 100%; position: absolute;
802 top: 0px;
803 overflow: hidden;
804 left: -350px;
805 right: 0;
806 margin: 0 auto; }
807 .app-discovery{ width: 628px; height: 455px;background: rgba(255, 255, 255, 0.5);
808 border: 1px solid #000000;
809 box-sizing: border-box; position: absolute; right: 0px; top: 198px;}
810 .app-discovery .top-user{ width: 135px; height: 135px;background: #FFFFFF; border: 1px solid #000000; box-sizing: border-box; border-radius: 100px; margin: 0 auto;
811 margin-top: -63px;}
812 .app-discovery .top-user img{ width:57px; display: block; margin:0 auto; margin-top: 45px;}
813 .app-discovery h1{font-size: 60px;
814 font-family: 'Zuume'; margin-top: 136px;
815 font-weight: 400;
816 line-height: 66px; width: 100%; display: block; text-align: center;
817 color: #000;}
818 .app-discovery h2{font-size: 60px;
819 font-family: 'Zuume';
820 font-weight: 300;
821 line-height: 66px; width: 100%; display: block; text-align: center;
822 color: #000;}
823 .discovery-app-img{ width: 200px; display: block; position: absolute; right: 0; bottom: 0;}
824 .popcorn-set{ position: absolute; width: 120px; display: block; right: 440px; bottom: 0;}
825 .app-discovery-bg{background-image:url('../images/Union.svg'); background-position: bottom; background-repeat: no-repeat; }
826 .intro-startup .footer-bottom ul li.active{ background: #514DA7;}
827 .ft-comments-group{display: block;
828 float: left;
829 padding-top: 23px; width: 100%;
830 height: 100%; padding-right: 15px;
831 }
832 .ft-comments-group .count-comments{ font-size: 12px; line-height: 14px; font-weight: 700;color: #000000; float: left; margin-right: 15px; margin-top:8px ;}
833 .ft-comments-group .comments-photos{ display: block; float: left; list-style-type: none; margin:0px; padding: 0px;}
834 .ft-comments-group .comments-photos li{ display: block; float: left; margin-left: -8px;}
835 .ft-comments-group .comments-detail{display: block; float: left; width: 100%; padding-right: 30px; }
836 .ft-comments-group .comments-detail span{font-size: 10px; line-height: 12px; font-weight: 400;color: #A8C2DC; width: 100%; display: block; float: left;}
837 .ft-comments-group .comments-detail p{ margin-top: 2px;
838 font-size: 12px;
839 line-height: 14px;
840 font-weight: 400;
841 color: #000000;
842 margin-bottom: 0px;
843 width: 100%;
844 display: block;
845 float: left;}
846 .ft-comments-group .comments-detail span a{font-size: 10px; line-height: 12px; font-weight: 400;color: #A8C2DC; display: block; float: right;}
847 .white-bg{ background-color: #fff;}
848 .comment-frm{ display: block; float: right; width: 100%; margin-top: 25px;}
849 .comment-frm .frm-wdth{ width: 100%; display: block; float: left; }
850 .comment-frm .frm-wdth input{border-bottom: 1px solid #514DA7 !important; border:0px; border-radius: 0px; padding: 10px 0px; }
851 .comment-frm .frm-wdth input::-webkit-input-placeholder { /* Edge */
852 color: #514DA7; font-size: 12px; line-height: 14px;
853 }
854
855 .comment-frm .frm-wdth input:-ms-input-placeholder { /* Internet Explorer 10-11 */
856 color: #514DA7; font-size: 12px; line-height: 14px;
857 }
858
859 .comment-frm .frm-wdth input::placeholder {
860 color: #514DA7; font-size: 12px; line-height: 14px;
861 }
862 .comment-frm .add-comment{background: #514DA7;
863 border-radius: 5px;
864 font-size: 13px;
865 line-height: 29px;
866 color: #fff;
867 padding: 5px 10px;
868 display: block;
869 width:111px;
870 float: right; text-align: center;
871 height: 39px;
872 }
873 .comment-frm .add-comment img{ width: 14px;
874
875 }
876 .single-author-comments{ width: 1000px; display: block; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; height: 100%;}
877 .s-user-comments { display: block; position: absolute; bottom: 37px; width: 400px;}
878 .single-author-li-comments{ width: 100%; display: block; float: left;}
879 .a-intro-comments{background: #FFFFFF; width: 100%; padding: 15px; float: left; margin-bottom: 15px; position: relative;
880 border: 1px solid #201E6A;
881 box-shadow: 0px 4px 8px 5px rgba(0, 0, 0, 0.0975743);
882 border-radius: 25px 25px 25px 0px; }
883 .a-intro-comments p{ width: 100%; display: block; float: left; margin: 0px; font-size: 18px; line-height: 25px; font-weight: 400; color: #000000;}
884 .rly-comment-set{ display: block; list-style-type: none; margin: 5px 0 0 0;padding:0px; float: left;}
885 .rly-comment-set li{ float: left; margin-right: 15px;}
886 .rly-comment-set li a{ font-size: 12px; line-height: 28px; font-weight: 500; color: #514DA7;float: left;}
887 .rly-comment-set li img{ width: 13px;
888 float: left;
889 display: block;
890 margin-top: 8px;
891 margin-right: 6px;}
892 .comments-a-wrp{ width: 629px;
893 display: block;
894 float: right;
895 position: absolute;
896 bottom: 160px;
897 right: 0;}
898 /* thnaks Wrapper */
899 .thanks-wrapper{ width: 1180px; display: block; position: absolute; margin: 0 auto; bottom: 0; left: 0; right: 0;}
900 .thanks-l-wrp{ display: block; float: left; width: 504px; margin-bottom: 90px; position: relative; }
901 .thanks-img{ width: 306px; display: block; margin: 0 auto; position: absolute; left: 0; right: 0; top: -271px;}
902 .thanks-pay-wrp{ width: 100%; display: block; height: 334px; float: left;border: 2px solid #06034C;
903 box-sizing: border-box;
904 border-radius: 15px; position: relative;
905 z-index: 2;}
906 .thanks-pay-wrp .blacktext-wrp{background: #000000; border-radius: 5px; padding:10px 15px; width: 370px;
907 margin: 0 auto; font-family: 'Bebas Neue', cursive;font-style: normal; font-weight: 400; font-size: 26px; line-height: 31px; color: #fff; text-align: center;}
908 .thanks-pay-wrp .blacktext-wrp img{ width: 24px; margin-top: -10px;}
909 .thanks-pay-wrp ul{ display: block;
910 margin-top: 50px;
911 margin: 32px 0 0 67px;
912 padding: 0px;
913 list-style-type: none;
914 width: 370px;
915 float: left;}
916 .thanks-pay-wrp ul li{ float: left; width: 72px;}
917 .thanks-pay-wrp ul li a{ width: 100%; display:block; float: left;}
918 .thanks-pay-wrp ul li a img{ display: block; float: left; width: 100%;}
919 .thanks-pay-wrp ul li a span img{ width: 8px;
920 display: block;
921 float: left;
922 margin-left: 3px;
923 margin-top: 4px;
924 margin-right: 5px;}
925 .thanks-pay-wrp ul li a span{ font-size: 10px;
926 line-height: 13px;
927 color: #06034C;
928 width: 100%;
929 display: block;
930 float: left;
931 margin-top: 4px;}
932 .payments-spc-57{ margin:0 76px;}
933 .payment-spot-light-bt{ position: absolute; left: 0; width: 708px; bottom: -85px;}
934 .thanks-r-section{ width: 444px;
935 display: block;
936 float: right;
937 position: absolute;
938 right: 0;
939 bottom: 70px;}
940 .logo-common-wrp {
941 width: 101px;
942 display: block;
943 margin: 0 auto;
944 }
945 .logo-common-wrp a{ width: 100%; display: block;}
946 .logo-common-wrp a span{ width: 100%; display: block; float: left; text-align: center; color: #514DA7; font-size: 13px; line-height: 25px; letter-spacing: -0.54px; font-weight: 400;}
947 .thanks-r-section p{ font-size: 18px; line-height: 25px; font-weight: 400; color: #000000; margin:15px 0 20px 0; width: 100%; display: block; float: left; text-align: center;}
948 .back-bt{ width: 200px; height: 54px; margin: 0 auto; position: relative; display: block; text-align: center; font-size: 18px; line-height: 54px; color: #000; background-color: #fff;}
949 .back-bt .s1{ width: 20px; height: 20px; border-radius: 100px; background: #DFE7EF; position: absolute;
950 left: -10px;
951 top: -10px;}
952 .back-bt img{ width: 20px; margin-right: 5px;}
953 .back-bt:hover{ text-decoration: none; color:#514DA7;}
954 .back-bt .s2{ width: 20px; height: 20px; border-radius: 100px; background: #DFE7EF; position: absolute;
955 left: -10px;
956 bottom: -10px;}
957 .back-bt .s3{ width: 20px; height: 20px; border-radius: 100px; background: #DFE7EF; position: absolute;
958 right: -10px;
959 bottom: -10px;}
960 .back-bt .s4{ width: 20px; height: 20px; border-radius: 100px; background: #DFE7EF; position: absolute;
961 right: -10px;
962 top: -10px;}
963 .rating-section{ width: 100%; display: block; float: left; list-style-type: none; margin: 0; padding: 0px; border: 1px solid #000000;
964 box-sizing: border-box; margin-top: 25px;}
965 .rating-section li{ width: 100%; display: block; float: left; padding: 15px;}
966 .rating-section li p{ font-size: 14px; margin-top:0px ; line-height: 25px; color: #000000; width: 281px; float: left; text-align: left; display: block; margin-bottom: 0px;}
967 .rating-section li .publish{width: 82px; height: 33px; background: #514DA7;
968 border-radius: 5px; display: block; float: right; color:#fff; font-size: 14px; line-height: 33px; text-align: center; font-weight: 500;}
969 .rating-section li p.wdth{ width: 154px;}
970 .rating-list{ display: block; float: right;}
971 .rating-list a{ width: 26px; display: block; float: left; margin-right: 10px;}
972 .rating-section li:first-child{ border-bottom: 1px solid #000000;}
973 .follow-us-py{width: 100%; display: block; float: left; padding:15px;}
974 .follow-us-py span{ font-size: 14px; line-height: 22px; font-weight: 500; font-style: normal;}
975 .p-follows{ display: block; list-style-type: none; margin:0px; padding: 0px; float: right;}
976 .p-follows li{ width: 26px; display: block; float: left; margin-left:10px;}
977 .p-follows li a{ width: 100%; display: block; float: left;}
978 .p-users{ width: 108%; display: block; float: left; margin-top: 40px;}
979 .p-users span{ font-size: 14px; line-height: 22px; font-weight: 500; color:#fff; float: left; margin-top: 15px; }
980 .p-users h1{ font-size: 39px; line-height: 43px; font-weight: 400; color:#fff;float: left;padding:0 10px; margin-bottom: -6px;}
981 /* single mobile */
982 .single-mobileInsight{ width: 441px; display: block; height: 910px;position: absolute; background-image:url('../images/s-mobile.svg'); background-repeat: no-repeat; left: 0;
983 right: 0;
984 margin: 0 auto;
985 bottom: 0;
986 top: unset;
987 background-position: bottom;}
988 .slide-img{ width: 402px;
989 position: absolute;
990 bottom: 1px;
991 left: 0;
992 right: 0;
993 margin: 0 auto;}
994
995 .single-m-Insight-comments{ width: 423px; display: block; position: absolute;
996 top: 294px;
997 right: -357px;}
998 .single-left-Insight-comments{position: absolute;
999 width: 423px;
1000 display: block;
1001 top: 183px;
1002 left: -332px;}
1003 .author-thoughts{ width: 236px; display: block; float: left; margin-left: 70px;
1004 margin-bottom: -20px;}
1005 .custom-c-style{border-radius:0px 25px 25px 25px;}
1006 .mobile-screen-one{ width: 379px; display: block;height:726px;position: absolute; border: 1px solid #000000;
1007 border-radius: 25px 25px 0 0;
1008 bottom: 0;
1009 top: unset;
1010 background-position: bottom;}
1011 .m-screen{ width: 348px; display: block; position: absolute; left: 0px; right: 0px; margin: 0 auto; margin-top: 15px;}
1012 .m-screen-comments{ width: 370px;
1013 display: block;
1014 position: absolute;
1015 left: 0;
1016 z-index: 1;
1017 margin-left: -230px;
1018 margin-top: 50px;}
1019 .user-photo-bottom{ width: 127px;display: block; position: absolute; bottom: 76px; left: -110px;}
1020 .p-left{ left: 0;}
1021 .p-right{ right: 0;}
1022 .allMWrp{ position: absolute; right: 0px; left: 0px; position: absolute; margin: 0 auto; width: 792px; height: 100%; bottom: 2px;}
1023 .m-screen-right {
1024 width: 370px;
1025 display: block;
1026 position: absolute;
1027 right: 0;
1028 z-index: 1;
1029 margin-right: -207px;
1030 margin-top: 50px;
1031 }
1032 .user-photo-bottom-r{ width: 127px;display: block; position: absolute; right: -128px;
1033 bottom: 125px;}
1034 /* no comments */
1035 .no-comment-count{ width: 100%;}
1036
1037
1038
1039 .no-comments-img{ width: 40px; display: block; float: left;}
1040 .no-c-yet{ font-size: 12px !important; color: #000 !important; font-weight: 700 !important;}
1041 .h-100p{ height: 100%;}
1042 .bord-r{ border-right: 1px solid #A8C2DC;}
1043 .ft-comments-group .comments-detail{ position: absolute;
1044 padding-left: 50px;}
1045 .c-with-photos{ display: block; float: left; margin-left: -120px;}
1046 .addfrm-spc{ padding-right: 50px;}
1047 .c-product-insight-wrp{ width: 350px;
1048 display: block;
1049 float: right;
1050 position: absolute;
1051 top: unset;
1052 bottom: 74px;
1053 right: -310px;}
1054 .custom-selected-style{ border-radius:0px 25px 25px 25px;border: 1.09903px solid #EF484F;}
1055 .custom-selected-style .top-wrp{ width: 100%; display: block; float: left; color: #EF484F; font-weight: 700; font-size: 15px; line-height: 22px; letter-spacing: 1.92px; text-transform: uppercase;}
1056 .custom-selected-style .top-wrp a{ width: 20px; display: block; float: right;}
1057 .custom-selected-style .top-head{ font-size: 20px; line-height: 24px; font-weight: 700; margin:15px 0 15px 0; width: 100%; display: block; float: left;}
1058 .custom-selected-style .footer{ width: 100%; display: block; float: left; border-top: 1px solid #DFE7EF; margin-top: 20px; padding-top:15px ;}
1059 .cit-16{ color: #EF484F; font-size: 12px; line-height: 14px; font-weight: 400;}
1060 .cit-16:hover{color: #EF484F;}
1061 .ft-share{color: #EF484F; font-size: 13px; line-height: 27px; font-weight: 400; display: block; float: right;}
1062 .ft-share img{ width: 14px;
1063 display: block;
1064 float: left;
1065 margin: 8px 7px 0 0px;}
1066 .ft-share:hover{color: #EF484F;}
1067 .custom-selected-style .rect{ width: 25px; display: block; position: absolute;top: 0;
1068 left: 0;}
1069 /* single web screen */
1070 .s-web-screen-wrp{background-image:url('../images/webscreen.svg'); background-repeat: no-repeat; width: 873px; height: 567px;position: absolute;
1071 left: 0;
1072 right: 0; bottom: 210px;
1073 margin: 0 auto;}
1074 .web-comment-spc{top: 63px;left: -206px;}
1075 .web-ps-insight-spc{ top: 130px;
1076 right: -260px;}
1077
1078 /* screen grab */
1079 .screengrab-wrp{ width: 557px; height: 478px; display: block; position: absolute; left: 0px; right: 0px; margin: 0 auto; bottom: 210px;}
1080 .screengrab-lspc{top: 113px;}
1081 .screengrab-rspc{top: 92px;right: -362px;}
1082 .view-ticket-wrp-ps{ width: 302px;
1083 position: absolute;
1084 z-index: 1;
1085 right: -224px;
1086 top: 82px;}
1087 .bc-transparent{ background-image: none !important; border: 0px;}
1088 .comments-left-without-bc{ margin-left: -286px; margin-top: 72px;}
1089 .comments-right-without-bc{ right: -255px;}
1090 .screenGrb-comments-wrp{width: 752px;}
1091 .spc-grbscreen1{ margin-top: 40px;}
1092 /* two webscreen */
1093 .two-webscreen-insight{ width: 482px; display: block; height: 725px;position: absolute; background-image:url('../images/two-web-screen.svg'); background-repeat: no-repeat; left: 0;
1094 right: 0;
1095 margin: 0 auto;
1096 bottom: 0;
1097 top: unset;
1098 background-position: top;}
1099 .two-webs-l-spc{ margin-left: -342px;
1100 margin-top: 37px;}
1101 .two-screen-user-photo-bottom {
1102 width: 127px;
1103 display: block;
1104 position: absolute;
1105 bottom: 76px;
1106 left: -254px;
1107 }
1108 .two-webscreen-r-insight {
1109 width: 423px;
1110 display: block;
1111 position: absolute;
1112 top: 51px;
1113 right: 3px;
1114 }
1115 .custom-selected-author-style {
1116 border-radius: 0px 25px 25px 25px;
1117 border: 2px solid #F9CF35; position: relative;
1118 }
1119 .custom-selected-author-style .top-wrp{ width: 100%; display: block; float: left; color: #F9CF35; font-weight: 700; font-size: 15px; line-height: 22px; letter-spacing: 1.92px; text-transform: uppercase;}
1120 .custom-selected-author-style .top-wrp a{ width: 20px; display: block; float: right;}
1121 .custom-selected-author-style .top-head{ font-size: 20px; line-height: 24px; font-weight: 700; margin:15px 0 15px 0; width: 100%; display: block; float: left;}
1122 .custom-selected-author-style .rect {
1123 width: 25px;
1124 display: block;
1125 position: absolute;
1126 top: 0;
1127 left: 0;
1128 }
1129 .author-two{position: absolute; top: 240px; left: -363px; width: 428px;}
1130 .author-two .author-two-photo{ width: 200px; display: block;}
1131 .two-author-desktop{ width: 913px;
1132 display: block;
1133 height: 525px;
1134 position: absolute;
1135 background-image:url('../images/two-author-desktop.svg');
1136 background-repeat: no-repeat;
1137 left: 0;
1138 right: 0;
1139 margin: 0 auto;
1140 bottom: 0;
1141 top: unset;
1142 background-position: bottom;}
1143 .author-two-desktop{ position: absolute;
1144 top: -130px;
1145 left: -134px;
1146 width: 428px;}
1147 .author-two-desktop .author-two-photo{ width: 200px; display: block;}
1148 .author-one-desktop{ position: absolute;
1149 top: -163px;
1150 right: -201px;
1151 width: 428px;}
1152 .custom-2-author{ border-radius: 25px 25px 25px 0px;}
1153 .custom-2-author .footer { border-radius: 0px 0px 25px 0px;}
1154 .desktop-two-logo-spc{ bottom: 40%;}
1155 .author-app-img{ bottom: 0px; left: 0px; width: 252px; position: absolute;}
1156 .author-two-head-spc{ margin-top: 56px !important;}
1157 .sign-wrp{ width: 100%; display: block; float: left;}
1158 .user-t-1{width: 50px; position: absolute;left: -70px; margin-top: -16px; }
1159 .author2-thoughts{ width: 249px; display: block; margin: 0 auto; height: 213px;}
1160 .cust-user2-style{ border-radius:25px 0 25px 25px}
1161 .user-t-2{width: 50px; position: absolute;right: -70px; margin-top: -16px;}
1162 .single-chat-c-left{left: -405px;}
1163 .single-chat-c-right{top: 244px;right: -404px;}
1164 .user-b-1{width: 50px; position: absolute;left: -70px; bottom: 0px;}
1165 .help-view-ticket-right{display: block;
1166 float: right;
1167 right: -84px;
1168 position: absolute;
1169 z-index: 1;
1170 top: 51px;
1171 width: 423px;}
1172 .two-author-comments{ width: 400px; display: block; position: absolute; left: 0px; right: 0px; bottom: 182px; margin: 0 auto;}
1173 .two-author-all-comments{width: 100%; display: block; float:left;}
1174 .all-c-user-b-r{width: 50px; position: absolute;right: -70px; bottom: 0px;}
1175 .all-c-style{ border-radius:25px 25px 0px 25px; margin-left: 50px;}
1176 .a2-set{ width: 282px;
1177 height: 258px;
1178 position: absolute;
1179 left: -370px;
1180 bottom: -50px;}
1181 .a2true-set{ width: 268px;
1182 height: 319px;
1183 position: absolute;
1184 right: -440px;
1185 bottom: -103px;}
1186 .add_comments-spc_r{ bottom: unset !important; top: 280px !important;}
1187 .add-comments-bt img{ width: 15px; display: block; float: left; margin-right: 5px; margin-top: -3px; }
1188 .add-comments-bt{ font-size: 10px; margin-right: 15px; margin-top: 20px; line-height: 8px; font-weight: 400; color:#000; display: block;
1189 float: right;}
1190 .bounce-board-wrp{ width: 460px; display: block; position: fixed; height: 100%; background-color: #fff; right: 0; top: 0px; z-index: 50;}
1191 .bounce-board-wrp .inner-wrp-bc{ width: 411px; display: block; margin:0 auto; height: 100%;}
1192 .bounce-board-wrp .inner-wrp-bc .bc-top-head{border-bottom: 1px solid #DFE7EF; width: 100%; padding:15px 0; display: block; float: left; font-size: 19px; font-weight: 700; line-height: 22px;}
1193 .bounce-board-wrp .inner-wrp-bc .bc-top-head .bc-head img{ width: 27px; display: block; float: left; margin-right: 10px; margin-top: 9px;}
1194 .bounce-board-wrp .inner-wrp-bc .bc-top-head .bc-head{ display: block; float: left;}
1195 .bounce-board-wrp .inner-wrp-bc .bc-top-head .action-sort{ display: block; float: right;}
1196 .bc-sort-list{ font-weight: 700; font-size: 14px; line-height: 12px; color: #000; background: transparent; border: 0px;}
1197 .sort-by{ font-size: 14px; line-height: 18px; color: #000; opacity: 0.5; }
1198 .bounce-board-body{ width: 100%; display: block; float: left; height: 100%;}
1199 .bounce-board-body .bc-empty{ color: #000; font-size: 26px; line-height: 49px; font-weight: 700; opacity: 0.5; margin-top: 100%; text-align: center;}
1200 .common_color{ background:transparent; border-radius: 100px;}
1201 .user-photo{width: 109px;
1202 display: block;
1203 float: left;}
1204 .cat-minus{ right: -11px !important;
1205 margin-left: unset !important;}
1206 .mt-50{ margin-top: 50px;}
1207 .sub-menu-user{ width: 150px;
1208 display: block;
1209 position: absolute;
1210 background: #fff;
1211 right: 0px;
1212 border: 1px solid #eaeaea;
1213 border-radius: 5px;
1214 padding: 5px;
1215 -webkit-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.22);
1216 -moz-box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.22);
1217 box-shadow: 0px 1px 2px 0px rgba(50, 50, 50, 0.22);
1218 }
1219 .sub-menu-user ul{ list-style-type: none; margin:0px; padding:0px; }
1220 .sub-menu-user ul li{ margin-right: 0px; font-size: 13px; text-align: right; padding:5px 10px; border-bottom:1px solid #eaeaea;}
1221 .sub-menu-user ul li:last-child{ border-bottom: 0px;}
1222 .sub-menu-user ul li a:hover{color:#514DA7;}
1 html,
2 body {
3 height: 100%;
4 }
5
6 body {
7 display: -ms-flexbox;
8 display: flex;
9 -ms-flex-align: center;
10 align-items: center;
11 padding-top: 0px;
12 padding-bottom: 0px;
13 background-color:#DFE7EF;
14 }
15 #app, .landing-page{ width: 100%; display: block; float: left; height: 100%; margin-top: 0px; padding: 0px;}
16 /* heading */
17 h1{font-family: 'Bebas Neue', cursive;font-style: normal; font-weight: 600; font-size: 48px; line-height: 58px; color: #000000;}
18
19 /* spaces */
20 .wc-spc-lf-tp{ padding-top: 262px; padding-left: 40px; }
21
22
23 .h-100{height: 100%;}
24 .main-wrp{ height: 100%;padding-left: 56px; padding-right: 233px; background-image:url('../images/bg.svg'); background-repeat: no-repeat; background-attachment: fixed; background-position: bottom -10px left -130px;
25 background-size: 45%;}
26 /* navbar */
27 .spotLight-nav{ padding-top: 20px; z-index: 5;}
28 .spotLight-nav li a{font-family: 'Montserrat', sans-serif;
29 font-size: 16px;
30 font-style: normal;
31 font-weight: 400;
32 line-height: 22px;
33 letter-spacing: -0.7470597624778748px;
34 text-align: left; color:#000; opacity: 0.6;
35 }
36 .spotLight-nav li {margin-right: 14px;}
37 .spotLight-nav li.active a{font-weight: 600; opacity: 1;}
38 .spotLight-nav li.spotLight-img a{opacity: 1;}
39 .navbar-brand{ margin-right: 57px;}
40
41 /* ul list style */
42 .sign-in-up-list{ width: 325px; list-style-type: none; margin: 0px; padding:0px;font-family: 'Montserrat', sans-serif;
43 font-size: 20px;
44 font-style: normal;
45 font-weight: 500;
46 line-height: 24px; float: left; margin-top: 24px; }
47 .sign-in-up-list li{ margin-bottom: 26px;display: flex; color:#000;}
48 .sign-in-up-list li img{ margin-right: 10px; float: left; width: 24px; height: 24px;}
49 .sign-in-up-list li span{ float: left;}
50 /* form */
51 .form-layout{ width: 100%; display: block; float: left;}
52 .form-layout form{ display:block; float: left; width: 100%;}
53 .form-layout h5{font-family: 'Montserrat', sans-serif;font-size: 15px; font-style: normal;font-weight: 500;line-height: 19px; color: #000000;opacity: 0.5; text-align:center;}
54 .form-layout .social-login{ display: block; width: 339px;
55 margin: 0 auto; margin-top: 37px; margin-bottom: 37px; }
56 .form-layout .social-login ul{ list-style-type: none; margin:0px; padding:0px; display: flex;}
57 .form-layout .social-login ul li a img{ width:75px; height: 75px; float: left;}
58 .form-layout .social-login ul li:nth-child(2){margin:0 37px;}
59 .form-layout .fill-form{ width: 100%; display: block; float: left; margin-top:24px ;}
60
61 form input{background:#D2DCE7 !important; border: 1px solid rgba(0, 0, 0, 0.3) !important; box-sizing: border-box; border-radius: 5px !important; height: 50px !important; line-height: 50px !important; color: #000000;
62
63 font-family: 'Montserrat', sans-serif;
64 font-size: 13px;
65 font-style: normal;
66 font-weight: 600 !important; margin-bottom:16px;padding:0 18px !important;}
67 form input:focus{ box-shadow:0px !important; outline: 0px !important;}
68
69 /* placeholder */
70 form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
71 line-height: 18px;
src/assets/images/b-user1.png

1.97 KB

src/assets/images/p-rss.svg
1 <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26"> 1 <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26">
2 <g id="rss" transform="translate(-734 -888)"> 2 <g id="rss" transform="translate(-734 -888)">
3 <rect id="Rectangle_2" data-name="Rectangle 2" width="26" height="26" rx="2" transform="translate(734 888)"/> 3 <rect id="Rectangle_2" data-name="Rectangle 2" width="26" height="26" rx="2" transform="translate(734 888)"/>
4 <g id="rss-2" data-name="rss" transform="translate(739.528 893.205)"> 4 <g id="rss-2" data-name="rss" transform="translate(739.528 893.205)">
5 <path id="Path_6" data-name="Path 6" d="M1.472,7.076a6.789,6.789,0,0,1,6.789,6.789" fill="none" stroke="#dfe7ef" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/> 5 <path id="Path_6" data-name="Path 6" d="M1.472,7.076a6.789,6.789,0,0,1,6.789,6.789" fill="none" stroke="#dfe7ef" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
6 <path id="Path_7" data-name="Path 7" d="M1.472,1.8A12.07,12.07,0,0,1,13.541,13.865" fill="none" stroke="#dfe7ef" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/> 6 <path id="Path_7" data-name="Path 7" d="M1.472,1.8A12.07,12.07,0,0,1,13.541,13.865" fill="none" stroke="#dfe7ef" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
7 <path id="Path_8" data-name="Path 8" d="M2.226,13.865a.754.754,0,1,0-.754-.754A.754.754,0,0,0,2.226,13.865Z" fill="#dfe7ef" stroke="#dfe7ef" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/> 7 <path id="Path_8" data-name="Path 8" d="M2.226,13.865a.754.754,0,1,0-.754-.754A.754.754,0,0,0,2.226,13.865Z" fill="#dfe7ef" stroke="#dfe7ef" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
8 </g> 8 </g>
9 </g> 9 </g>
10 </svg> 10 </svg>
11 11
src/assets/images/popcorn-set.svg
1 <svg xmlns="http://www.w3.org/2000/svg" width="100.002" height="166.634" viewBox="0 0 100.002 166.634"> 1 <svg xmlns="http://www.w3.org/2000/svg" width="100.002" height="166.634" viewBox="0 0 100.002 166.634">
2 <g id="popcorn-set" transform="translate(-988 -462)"> 2 <g id="popcorn-set" transform="translate(-988 -462)">
3 <g id="popcorn_1" data-name="popcorn 1" transform="translate(963.25 518.889)"> 3 <g id="popcorn_1" data-name="popcorn 1" transform="translate(963.25 518.889)">
4 <path id="Path_1" data-name="Path 1" d="M83.622,33.716H33.771l3.686,31H49.08a13.4,13.4,0,0,1,19.369,0H79.936Z"/> 4 <path id="Path_1" data-name="Path 1" d="M83.622,33.716H33.771l3.686,31H49.08a13.4,13.4,0,0,1,19.369,0H79.936Z"/>
5 <g id="Group_1" data-name="Group 1"> 5 <g id="Group_1" data-name="Group 1">
6 <path id="Path_2" data-name="Path 2" d="M58.26,63.33a.165.165,0,0,0-.165.158v4.776c.113.03.218.06.323.09V63.5A.156.156,0,0,0,58.26,63.33Zm.863.2-.518,4.889c.1.038.21.075.315.12l.525-4.979a.166.166,0,0,0-.143-.181h-.015A.17.17,0,0,0,59.123,63.533Zm-1.9-.143a.162.162,0,0,0-.143.181l.48,4.6c.113.015.225.038.33.06l-.5-4.694a.156.156,0,0,0-.158-.143Zm2.9.286-1.05,4.942c.1.045.2.1.3.15l1.073-5.024a.157.157,0,0,0-.128-.188h-.037A.147.147,0,0,0,60.128,63.676ZM56.2,63.548a.161.161,0,0,0-.127.188l.93,4.37a2.552,2.552,0,0,1,.338.023l-.953-4.453a.161.161,0,0,0-.158-.128Zm4.914.376-1.6,4.927a2.964,2.964,0,0,1,.285.18l1.628-5.009a.164.164,0,0,0-.1-.2.111.111,0,0,0-.053-.007A.169.169,0,0,0,61.119,63.924Zm-5.92-.105a.164.164,0,0,0-.105.2l1.335,4.107c.113-.007.225-.015.338-.015L55.4,63.924a.16.16,0,0,0-.15-.113A.128.128,0,0,0,55.2,63.819Zm6.88.451-2.153,4.844c.09.068.18.135.263.2l2.191-4.912a.155.155,0,0,0-.083-.211.219.219,0,0,0-.068-.015A.147.147,0,0,0,62.079,64.27Zm-7.848-.083a.159.159,0,0,0-.083.211l1.7,3.806c.112-.022.218-.038.33-.053L54.449,64.27a.164.164,0,0,0-.15-.1A.219.219,0,0,0,54.231,64.187Zm8.763.534-2.708,4.686c.083.075.165.15.24.226l2.753-4.754a.161.161,0,0,0-.06-.218.151.151,0,0,0-.083-.023A.161.161,0,0,0,62.994,64.721Zm-9.686-.06a.161.161,0,0,0-.06.218l2,3.475c.068-.022.143-.045.21-.06.037-.007.075-.023.112-.03l-2.048-3.543a.161.161,0,0,0-.143-.083A.144.144,0,0,0,53.308,64.661Zm10.549.6-3.234,4.453c.075.075.15.158.225.241l3.279-4.513a.159.159,0,0,0-.037-.226.151.151,0,0,0-.1-.03A.206.206,0,0,0,63.857,65.263Zm-11.419-.038a.159.159,0,0,0-.037.226l2.266,3.114c.1-.045.21-.083.315-.12l-2.318-3.182a.157.157,0,0,0-.128-.068A.15.15,0,0,0,52.438,65.225Zm12.229.662-3.744,4.159c.068.083.135.173.2.263l3.781-4.2a.157.157,0,0,0-.015-.226.154.154,0,0,0-.225.008ZM51.635,65.88a.157.157,0,0,0-.015.226l2.461,2.73c.1-.053.195-.105.3-.15l-2.521-2.8a.154.154,0,0,0-.225-.008Zm13.76.715-4.217,3.8c.06.09.12.18.18.278l4.262-3.828a.157.157,0,0,0,.015-.226.149.149,0,0,0-.12-.053A.161.161,0,0,0,65.4,66.594Zm-14.5.015a.157.157,0,0,0,.015.226l2.6,2.339c.09-.06.188-.12.285-.181l-2.679-2.4a.148.148,0,0,0-.1-.045A.185.185,0,0,0,50.9,66.609Zm15.155.767L61.4,70.754c.052.1.1.188.15.286l4.682-3.4a.159.159,0,0,0,.038-.226.157.157,0,0,0-.128-.068A.184.184,0,0,0,66.055,67.376Zm-15.808.038a.159.159,0,0,0,.038.226l2.686,1.948c.083-.068.173-.143.263-.211l-2.761-2a.151.151,0,0,0-.1-.03A.157.157,0,0,0,50.247,67.414Zm-.563.872a.161.161,0,0,0,.06.218l2.716,1.564c.075-.083.158-.158.24-.233l-2.8-1.61a.151.151,0,0,0-.083-.023A.158.158,0,0,0,49.685,68.287Zm-.473.918a.155.155,0,0,0,.083.211l2.693,1.2c.068-.09.135-.173.21-.263l-2.776-1.226a.08.08,0,0,0-.06-.015A.158.158,0,0,0,49.212,69.2Zm-.375.97a.164.164,0,0,0,.1.2l2.626.85c.06-.1.12-.188.18-.278l-2.7-.88a.11.11,0,0,0-.053-.008A.169.169,0,0,0,48.837,70.174Zm-.263,1a.158.158,0,0,0,.127.188l2.513.534c.045-.1.1-.2.143-.3l-2.6-.549h-.037A.159.159,0,0,0,48.574,71.175ZM48.409,72.2a.166.166,0,0,0,.143.181l2.378.248a2.673,2.673,0,0,1,.113-.316l-2.453-.256h-.015A.158.158,0,0,0,48.409,72.2Zm.105.872a.165.165,0,0,0-.165.158.16.16,0,0,0,.165.158h2.221c.022-.105.045-.218.068-.323H48.514Zm.038,1.023a.162.162,0,0,0,.015.323h.015L50.63,74.2c.007-.113.015-.218.03-.331Zm19.552.218a.068.068,0,0,0,.007-.038v-.007A.1.1,0,0,1,68.1,74.311Zm-19.41.79a.159.159,0,0,0,.03.316h.037l1.868-.4c-.008-.113-.008-.218-.015-.331Zm.248.993a.164.164,0,0,0-.1.2.16.16,0,0,0,.15.113.145.145,0,0,0,.053-.008l1.7-.549c-.022-.105-.038-.218-.053-.324Zm18.494.293.045.015a.11.11,0,0,0,.052.008.153.153,0,0,0,.15-.113.164.164,0,0,0-.105-.2l-.015-.008C67.526,76.184,67.481,76.282,67.436,76.387Zm-18.141.662a.159.159,0,0,0-.083.211.164.164,0,0,0,.15.1.216.216,0,0,0,.068-.015l1.531-.677-.09-.316Zm17.684.241.12.053a.218.218,0,0,0,.068.015.172.172,0,0,0,.15-.1.155.155,0,0,0-.083-.211l-.1-.045C67.083,77.1,67.031,77.192,66.978,77.29Zm-17.234.677a.161.161,0,0,0,.083.3.17.17,0,0,0,.082-.023l1.351-.782c-.045-.1-.083-.2-.128-.3Zm16.694.173.188.105a.15.15,0,0,0,.082.023.17.17,0,0,0,.143-.083.161.161,0,0,0-.06-.218l-.165-.1C66.558,77.959,66.5,78.05,66.438,78.14Zm-16.153.692a.159.159,0,0,0-.038.226.157.157,0,0,0,.128.068.165.165,0,0,0,.1-.03l1.17-.85c-.052-.09-.1-.188-.158-.286Zm15.538.09.233.165a.15.15,0,0,0,.1.03.147.147,0,0,0,.128-.068.159.159,0,0,0-.038-.226l-.21-.158C65.958,78.757,65.89,78.839,65.823,78.922Zm-14.908.715a.157.157,0,0,0-.015.226.154.154,0,0,0,.225.007l.99-.9c-.068-.09-.128-.173-.188-.271Zm14.218,0,.263.233a.154.154,0,0,0,.225-.007.157.157,0,0,0-.015-.226l-.248-.218C65.29,79.486,65.215,79.561,65.133,79.637Zm-13.512.73a.157.157,0,0,0,.015.226.154.154,0,0,0,.225-.008l.825-.91c-.075-.083-.143-.158-.218-.248Zm12.77-.09.278.308a.154.154,0,0,0,.225.008.157.157,0,0,0,.015-.226l-.263-.293C64.562,80.141,64.472,80.208,64.39,80.276ZM52.4,81.021a.159.159,0,0,0,.037.226.15.15,0,0,0,.1.03.147.147,0,0,0,.128-.068l.66-.91c-.083-.068-.165-.143-.24-.218Zm11.187-.18.27.376a.157.157,0,0,0,.127.068.165.165,0,0,0,.1-.03.159.159,0,0,0,.037-.226l-.263-.361C63.767,80.72,63.677,80.78,63.587,80.84Zm-10.339.752a.161.161,0,0,0,.06.218.151.151,0,0,0,.083.022.17.17,0,0,0,.143-.083l.518-.888c-.09-.06-.18-.128-.263-.188Zm9.491-.278.255.436a.161.161,0,0,0,.143.083.172.172,0,0,0,.083-.022.161.161,0,0,0,.06-.218l-.248-.429C62.934,81.216,62.837,81.269,62.739,81.314Zm-8.591.752a.155.155,0,0,0,.083.211.219.219,0,0,0,.068.015.172.172,0,0,0,.15-.1l.383-.857c-.06-.03-.128-.068-.187-.105-.03-.015-.068-.038-.1-.053Zm7.713-.361.217.5a.164.164,0,0,0,.15.1.219.219,0,0,0,.068-.015.159.159,0,0,0,.083-.211l-.218-.481C62.056,81.622,61.959,81.667,61.861,81.705Zm-6.767.745a.158.158,0,0,0,.105.2.111.111,0,0,0,.052.007.153.153,0,0,0,.15-.113l.263-.812c-.1-.038-.2-.083-.3-.128Zm5.852-.444.173.542a.16.16,0,0,0,.15.113.146.146,0,0,0,.053-.007.164.164,0,0,0,.1-.2l-.173-.534C61.156,81.946,61.051,81.983,60.946,82.006Zm-4.869.722a.157.157,0,0,0,.127.188h.038a.161.161,0,0,0,.158-.128l.158-.76c-.105-.03-.21-.06-.308-.09Zm3.931-.511.12.579a.161.161,0,0,0,.158.128h.037a.161.161,0,0,0,.128-.188l-.12-.572C60.218,82.186,60.113,82.2,60.008,82.216Zm-2.926.692a.166.166,0,0,0,.143.18h.015a.156.156,0,0,0,.158-.143l.075-.7c-.1-.015-.21-.038-.323-.053Zm1.973-.587.068.617a.161.161,0,0,0,.157.143H59.3a.162.162,0,0,0,.143-.18l-.067-.609C59.273,82.307,59.16,82.314,59.056,82.322Zm-.953.654a.16.16,0,0,0,.165.158.165.165,0,0,0,.165-.158v-.654c-.1,0-.218-.007-.323-.015v.669Z" fill-rule="evenodd"/> 6 <path id="Path_2" data-name="Path 2" d="M58.26,63.33a.165.165,0,0,0-.165.158v4.776c.113.03.218.06.323.09V63.5A.156.156,0,0,0,58.26,63.33Zm.863.2-.518,4.889c.1.038.21.075.315.12l.525-4.979a.166.166,0,0,0-.143-.181h-.015A.17.17,0,0,0,59.123,63.533Zm-1.9-.143a.162.162,0,0,0-.143.181l.48,4.6c.113.015.225.038.33.06l-.5-4.694a.156.156,0,0,0-.158-.143Zm2.9.286-1.05,4.942c.1.045.2.1.3.15l1.073-5.024a.157.157,0,0,0-.128-.188h-.037A.147.147,0,0,0,60.128,63.676ZM56.2,63.548a.161.161,0,0,0-.127.188l.93,4.37a2.552,2.552,0,0,1,.338.023l-.953-4.453a.161.161,0,0,0-.158-.128Zm4.914.376-1.6,4.927a2.964,2.964,0,0,1,.285.18l1.628-5.009a.164.164,0,0,0-.1-.2.111.111,0,0,0-.053-.007A.169.169,0,0,0,61.119,63.924Zm-5.92-.105a.164.164,0,0,0-.105.2l1.335,4.107c.113-.007.225-.015.338-.015L55.4,63.924a.16.16,0,0,0-.15-.113A.128.128,0,0,0,55.2,63.819Zm6.88.451-2.153,4.844c.09.068.18.135.263.2l2.191-4.912a.155.155,0,0,0-.083-.211.219.219,0,0,0-.068-.015A.147.147,0,0,0,62.079,64.27Zm-7.848-.083a.159.159,0,0,0-.083.211l1.7,3.806c.112-.022.218-.038.33-.053L54.449,64.27a.164.164,0,0,0-.15-.1A.219.219,0,0,0,54.231,64.187Zm8.763.534-2.708,4.686c.083.075.165.15.24.226l2.753-4.754a.161.161,0,0,0-.06-.218.151.151,0,0,0-.083-.023A.161.161,0,0,0,62.994,64.721Zm-9.686-.06a.161.161,0,0,0-.06.218l2,3.475c.068-.022.143-.045.21-.06.037-.007.075-.023.112-.03l-2.048-3.543a.161.161,0,0,0-.143-.083A.144.144,0,0,0,53.308,64.661Zm10.549.6-3.234,4.453c.075.075.15.158.225.241l3.279-4.513a.159.159,0,0,0-.037-.226.151.151,0,0,0-.1-.03A.206.206,0,0,0,63.857,65.263Zm-11.419-.038a.159.159,0,0,0-.037.226l2.266,3.114c.1-.045.21-.083.315-.12l-2.318-3.182a.157.157,0,0,0-.128-.068A.15.15,0,0,0,52.438,65.225Zm12.229.662-3.744,4.159c.068.083.135.173.2.263l3.781-4.2a.157.157,0,0,0-.015-.226.154.154,0,0,0-.225.008ZM51.635,65.88a.157.157,0,0,0-.015.226l2.461,2.73c.1-.053.195-.105.3-.15l-2.521-2.8a.154.154,0,0,0-.225-.008Zm13.76.715-4.217,3.8c.06.09.12.18.18.278l4.262-3.828a.157.157,0,0,0,.015-.226.149.149,0,0,0-.12-.053A.161.161,0,0,0,65.4,66.594Zm-14.5.015a.157.157,0,0,0,.015.226l2.6,2.339c.09-.06.188-.12.285-.181l-2.679-2.4a.148.148,0,0,0-.1-.045A.185.185,0,0,0,50.9,66.609Zm15.155.767L61.4,70.754c.052.1.1.188.15.286l4.682-3.4a.159.159,0,0,0,.038-.226.157.157,0,0,0-.128-.068A.184.184,0,0,0,66.055,67.376Zm-15.808.038a.159.159,0,0,0,.038.226l2.686,1.948c.083-.068.173-.143.263-.211l-2.761-2a.151.151,0,0,0-.1-.03A.157.157,0,0,0,50.247,67.414Zm-.563.872a.161.161,0,0,0,.06.218l2.716,1.564c.075-.083.158-.158.24-.233l-2.8-1.61a.151.151,0,0,0-.083-.023A.158.158,0,0,0,49.685,68.287Zm-.473.918a.155.155,0,0,0,.083.211l2.693,1.2c.068-.09.135-.173.21-.263l-2.776-1.226a.08.08,0,0,0-.06-.015A.158.158,0,0,0,49.212,69.2Zm-.375.97a.164.164,0,0,0,.1.2l2.626.85c.06-.1.12-.188.18-.278l-2.7-.88a.11.11,0,0,0-.053-.008A.169.169,0,0,0,48.837,70.174Zm-.263,1a.158.158,0,0,0,.127.188l2.513.534c.045-.1.1-.2.143-.3l-2.6-.549h-.037A.159.159,0,0,0,48.574,71.175ZM48.409,72.2a.166.166,0,0,0,.143.181l2.378.248a2.673,2.673,0,0,1,.113-.316l-2.453-.256h-.015A.158.158,0,0,0,48.409,72.2Zm.105.872a.165.165,0,0,0-.165.158.16.16,0,0,0,.165.158h2.221c.022-.105.045-.218.068-.323H48.514Zm.038,1.023a.162.162,0,0,0,.015.323h.015L50.63,74.2c.007-.113.015-.218.03-.331Zm19.552.218a.068.068,0,0,0,.007-.038v-.007A.1.1,0,0,1,68.1,74.311Zm-19.41.79a.159.159,0,0,0,.03.316h.037l1.868-.4c-.008-.113-.008-.218-.015-.331Zm.248.993a.164.164,0,0,0-.1.2.16.16,0,0,0,.15.113.145.145,0,0,0,.053-.008l1.7-.549c-.022-.105-.038-.218-.053-.324Zm18.494.293.045.015a.11.11,0,0,0,.052.008.153.153,0,0,0,.15-.113.164.164,0,0,0-.105-.2l-.015-.008C67.526,76.184,67.481,76.282,67.436,76.387Zm-18.141.662a.159.159,0,0,0-.083.211.164.164,0,0,0,.15.1.216.216,0,0,0,.068-.015l1.531-.677-.09-.316Zm17.684.241.12.053a.218.218,0,0,0,.068.015.172.172,0,0,0,.15-.1.155.155,0,0,0-.083-.211l-.1-.045C67.083,77.1,67.031,77.192,66.978,77.29Zm-17.234.677a.161.161,0,0,0,.083.3.17.17,0,0,0,.082-.023l1.351-.782c-.045-.1-.083-.2-.128-.3Zm16.694.173.188.105a.15.15,0,0,0,.082.023.17.17,0,0,0,.143-.083.161.161,0,0,0-.06-.218l-.165-.1C66.558,77.959,66.5,78.05,66.438,78.14Zm-16.153.692a.159.159,0,0,0-.038.226.157.157,0,0,0,.128.068.165.165,0,0,0,.1-.03l1.17-.85c-.052-.09-.1-.188-.158-.286Zm15.538.09.233.165a.15.15,0,0,0,.1.03.147.147,0,0,0,.128-.068.159.159,0,0,0-.038-.226l-.21-.158C65.958,78.757,65.89,78.839,65.823,78.922Zm-14.908.715a.157.157,0,0,0-.015.226.154.154,0,0,0,.225.007l.99-.9c-.068-.09-.128-.173-.188-.271Zm14.218,0,.263.233a.154.154,0,0,0,.225-.007.157.157,0,0,0-.015-.226l-.248-.218C65.29,79.486,65.215,79.561,65.133,79.637Zm-13.512.73a.157.157,0,0,0,.015.226.154.154,0,0,0,.225-.008l.825-.91c-.075-.083-.143-.158-.218-.248Zm12.77-.09.278.308a.154.154,0,0,0,.225.008.157.157,0,0,0,.015-.226l-.263-.293C64.562,80.141,64.472,80.208,64.39,80.276ZM52.4,81.021a.159.159,0,0,0,.037.226.15.15,0,0,0,.1.03.147.147,0,0,0,.128-.068l.66-.91c-.083-.068-.165-.143-.24-.218Zm11.187-.18.27.376a.157.157,0,0,0,.127.068.165.165,0,0,0,.1-.03.159.159,0,0,0,.037-.226l-.263-.361C63.767,80.72,63.677,80.78,63.587,80.84Zm-10.339.752a.161.161,0,0,0,.06.218.151.151,0,0,0,.083.022.17.17,0,0,0,.143-.083l.518-.888c-.09-.06-.18-.128-.263-.188Zm9.491-.278.255.436a.161.161,0,0,0,.143.083.172.172,0,0,0,.083-.022.161.161,0,0,0,.06-.218l-.248-.429C62.934,81.216,62.837,81.269,62.739,81.314Zm-8.591.752a.155.155,0,0,0,.083.211.219.219,0,0,0,.068.015.172.172,0,0,0,.15-.1l.383-.857c-.06-.03-.128-.068-.187-.105-.03-.015-.068-.038-.1-.053Zm7.713-.361.217.5a.164.164,0,0,0,.15.1.219.219,0,0,0,.068-.015.159.159,0,0,0,.083-.211l-.218-.481C62.056,81.622,61.959,81.667,61.861,81.705Zm-6.767.745a.158.158,0,0,0,.105.2.111.111,0,0,0,.052.007.153.153,0,0,0,.15-.113l.263-.812c-.1-.038-.2-.083-.3-.128Zm5.852-.444.173.542a.16.16,0,0,0,.15.113.146.146,0,0,0,.053-.007.164.164,0,0,0,.1-.2l-.173-.534C61.156,81.946,61.051,81.983,60.946,82.006Zm-4.869.722a.157.157,0,0,0,.127.188h.038a.161.161,0,0,0,.158-.128l.158-.76c-.105-.03-.21-.06-.308-.09Zm3.931-.511.12.579a.161.161,0,0,0,.158.128h.037a.161.161,0,0,0,.128-.188l-.12-.572C60.218,82.186,60.113,82.2,60.008,82.216Zm-2.926.692a.166.166,0,0,0,.143.18h.015a.156.156,0,0,0,.158-.143l.075-.7c-.1-.015-.21-.038-.323-.053Zm1.973-.587.068.617a.161.161,0,0,0,.157.143H59.3a.162.162,0,0,0,.143-.18l-.067-.609C59.273,82.307,59.16,82.314,59.056,82.322Zm-.953.654a.16.16,0,0,0,.165.158.165.165,0,0,0,.165-.158v-.654c-.1,0-.218-.007-.323-.015v.669Z" fill-rule="evenodd"/>
7 </g> 7 </g>
8 <g id="Group_2" data-name="Group 2"> 8 <g id="Group_2" data-name="Group 2">
9 <path id="Path_3" data-name="Path 3" d="M56.415,68.324l.4,1.2a.162.162,0,0,0,.158.113.146.146,0,0,0,.053-.008.164.164,0,0,0,.105-.2l-.375-1.113H56.7C56.61,68.317,56.512,68.317,56.415,68.324Zm.773,1.083a.161.161,0,0,0,.157.128h.038a.161.161,0,0,0,.128-.188l-.21-.993c-.112-.015-.225-.023-.338-.03Zm-1.328-1.015.585,1.294a.172.172,0,0,0,.15.1.219.219,0,0,0,.068-.015.157.157,0,0,0,.082-.211L56.2,68.347A2.6,2.6,0,0,0,55.859,68.392Zm1.726.94a.163.163,0,0,0,.165.143h.015a.157.157,0,0,0,.143-.18l-.09-.85-.338-.068Zm-2.168-.85c-.037.007-.083.023-.12.03l.8,1.361a.161.161,0,0,0,.143.083.171.171,0,0,0,.083-.023.161.161,0,0,0,.06-.218l-.75-1.279C55.559,68.452,55.492,68.467,55.417,68.482Zm2.566.812a.16.16,0,0,0,.165.158.165.165,0,0,0,.165-.158V68.58c-.105-.038-.218-.068-.323-.1v.812Zm-3.241-.587,1.028,1.4a.16.16,0,0,0,.135.068.165.165,0,0,0,.1-.03.159.159,0,0,0,.037-.226l-.975-1.324C54.951,68.633,54.846,68.67,54.741,68.708Zm3.639.587a.166.166,0,0,0,.143.18h.015a.169.169,0,0,0,.165-.143l.06-.564c-.1-.045-.21-.09-.315-.128Zm-4.2-.339,1.283,1.414a.149.149,0,0,0,.12.053.18.18,0,0,0,.112-.045.157.157,0,0,0,.015-.226l-1.223-1.339C54.381,68.858,54.284,68.911,54.179,68.956Zm4.6.384a.153.153,0,0,0,.128.188h.038A.161.161,0,0,0,59.1,69.4l.09-.429c-.1-.053-.2-.113-.3-.158Zm.39.09a.164.164,0,0,0,.1.2.111.111,0,0,0,.053.008.169.169,0,0,0,.158-.113l.1-.3c-.09-.068-.187-.128-.285-.188Zm-5.529-.158L55.2,70.663a.152.152,0,0,0,.112.045.149.149,0,0,0,.12-.053.157.157,0,0,0-.015-.226L53.924,69.1C53.826,69.151,53.729,69.212,53.639,69.272Zm5.912.278a.157.157,0,0,0,.083.211.219.219,0,0,0,.067.015.172.172,0,0,0,.15-.1l.083-.181c-.083-.075-.173-.143-.263-.211Zm-6.437.105,1.846,1.331a.15.15,0,0,0,.1.03.17.17,0,0,0,.135-.068.159.159,0,0,0-.038-.226l-1.771-1.279A2.585,2.585,0,0,0,53.113,69.656Zm6.8.06a.161.161,0,0,0,.06.218.151.151,0,0,0,.083.023.17.17,0,0,0,.143-.083l.053-.09a2.245,2.245,0,0,0-.24-.226Zm.345.2a.159.159,0,0,0,.037.226.15.15,0,0,0,.1.03.17.17,0,0,0,.135-.068l.007-.007c-.068-.083-.143-.165-.218-.248Zm-7.645.181,2.138,1.226a.151.151,0,0,0,.083.022.161.161,0,0,0,.083-.3l-2.056-1.181C52.776,69.941,52.693,70.017,52.611,70.1Zm7.983.286a.152.152,0,0,0,.113.045.22.22,0,0,0,.068-.015c-.06-.083-.128-.173-.188-.248A.143.143,0,0,0,60.593,70.385Zm-8.44.226,2.431,1.068a.22.22,0,0,0,.068.015.172.172,0,0,0,.15-.1.157.157,0,0,0-.083-.211l-2.348-1.03C52.3,70.438,52.228,70.521,52.153,70.611Zm8.711.038a.157.157,0,0,0,.1.053c-.045-.068-.083-.135-.128-.2A.138.138,0,0,0,60.864,70.648Zm-9.116.534,2.716.872a.111.111,0,0,0,.053.007.169.169,0,0,0,.158-.113.164.164,0,0,0-.105-.2L51.943,70.9A3.143,3.143,0,0,0,51.748,71.182Zm-.345.632,2.971.624h.038a.161.161,0,0,0,.158-.128.152.152,0,0,0-.128-.188l-2.889-.6C51.5,71.619,51.448,71.716,51.4,71.814Zm-.278.692,3.2.331h.015a.169.169,0,0,0,.165-.143.166.166,0,0,0-.143-.18l-3.129-.323A2.656,2.656,0,0,0,51.125,72.506Zm8.516.406a.165.165,0,0,0-.165.158.16.16,0,0,0,.165.158h8.208c.015-.105.022-.218.03-.323H59.641Zm-8.643,0c-.03.105-.053.211-.075.324h3.4a.165.165,0,0,0,.165-.158.16.16,0,0,0-.165-.158H51Zm10.781.534a.166.166,0,0,0,.143.18l5.755.6.068-.316-5.785-.6h-.015A.151.151,0,0,0,61.779,73.446Zm-7.45-.143-3.474.361c-.015.105-.022.218-.03.331l3.541-.368a.157.157,0,0,0,.143-.18.163.163,0,0,0-.165-.143Zm7.39.519a.153.153,0,0,0,.128.188l5.567,1.173c.038-.105.068-.2.1-.308l-5.6-1.173h-.038A.152.152,0,0,0,61.719,73.822Zm-7.345-.12-3.571.752c0,.105,0,.218.007.331l3.631-.76a.159.159,0,0,0-.03-.316C54.4,73.695,54.389,73.695,54.374,73.7Zm7.248.489a.164.164,0,0,0,.1.2L67.046,76.1c.045-.1.09-.2.128-.3l-5.35-1.722a.111.111,0,0,0-.052-.007A.188.188,0,0,0,61.621,74.191Zm-7.158-.105-3.6,1.158c.015.105.03.218.053.323l3.654-1.173a.164.164,0,0,0,.105-.2.169.169,0,0,0-.158-.113A.111.111,0,0,0,54.464,74.086Zm7.023.459a.157.157,0,0,0,.083.211L66.6,76.974c.052-.09.1-.188.157-.286L61.7,74.462a.219.219,0,0,0-.068-.015A.154.154,0,0,0,61.486,74.545Zm-6.9-.083-3.579,1.572v.007c.03.105.06.2.09.3l3.616-1.587a.157.157,0,0,0,.083-.211.172.172,0,0,0-.15-.1A.142.142,0,0,0,54.591,74.462Zm6.722.421a.161.161,0,0,0,.06.218l4.7,2.685c.06-.09.127-.173.188-.263l-4.719-2.7a.151.151,0,0,0-.083-.022A.161.161,0,0,0,61.314,74.883Zm-6.557-.06-3.489,1.986c.037.105.083.2.127.3l3.526-2.016a.161.161,0,0,0-.083-.3A.271.271,0,0,0,54.756,74.823ZM61.1,75.2a.159.159,0,0,0,.038.226l4.329,3.114c.075-.083.143-.165.21-.248l-4.351-3.129a.151.151,0,0,0-.1-.03A.157.157,0,0,0,61.1,75.2Zm-6.145-.038-3.346,2.407c.052.1.1.2.158.286l3.384-2.429a.162.162,0,0,0-.1-.293A.15.15,0,0,0,54.959,75.161Zm5.9.331a.157.157,0,0,0,.015.226l3.931,3.5c.083-.075.158-.15.233-.226L61.1,75.477a.152.152,0,0,0-.113-.045A.185.185,0,0,0,60.864,75.492ZM55.2,75.477,52.04,78.29c.06.09.12.181.188.271l3.189-2.843a.157.157,0,0,0,.015-.226.149.149,0,0,0-.12-.053A.184.184,0,0,0,55.2,75.477Zm5.394.286a.157.157,0,0,0-.015.226l3.5,3.843c.083-.068.173-.135.255-.2l-3.511-3.859a.154.154,0,0,0-.225-.007Zm-5.124.007-2.919,3.212c.068.083.143.165.218.248L55.717,76a.175.175,0,0,0-.128-.278A.149.149,0,0,0,55.469,75.771ZM60.293,76a.159.159,0,0,0-.037.226L63.3,80.366c.09-.06.188-.113.278-.173l-3.061-4.159a.16.16,0,0,0-.135-.068A.144.144,0,0,0,60.293,76Zm-4.524.038-2.626,3.58c.075.075.158.15.24.218l2.648-3.61A.159.159,0,0,0,55.994,76a.151.151,0,0,0-.1-.03A.157.157,0,0,0,55.769,76.034Zm.323.226-2.281,3.911c.09.068.173.128.263.188l2.3-3.941a.161.161,0,0,0-.06-.218.151.151,0,0,0-.083-.023A.215.215,0,0,0,56.092,76.259Zm3.8.083a.172.172,0,0,0,.023.083l2.566,4.4c.1-.045.195-.1.293-.15l-2.573-4.4a.168.168,0,0,0-.143-.09A.16.16,0,0,0,59.888,76.342Zm-.255.038a.157.157,0,0,0-.083.211l2.071,4.6c.1-.038.2-.075.3-.12l-2.078-4.618a.172.172,0,0,0-.15-.1A.3.3,0,0,0,59.633,76.38Zm-3.189.075-1.9,4.212c.045.023.083.053.128.075a1.568,1.568,0,0,0,.158.083l1.913-4.242a.157.157,0,0,0-.082-.211.216.216,0,0,0-.068-.015A.168.168,0,0,0,56.444,76.455Zm2.828.06a.164.164,0,0,0-.1.2l1.568,4.769.315-.09L59.483,76.62a.169.169,0,0,0-.158-.113A.128.128,0,0,0,59.273,76.515Zm-2.461.1-1.471,4.475c.1.045.2.09.3.128l1.478-4.5a.164.164,0,0,0-.105-.2.111.111,0,0,0-.053-.007A.153.153,0,0,0,56.812,76.613Zm2.093,0a.161.161,0,0,0-.128.188l1.05,4.882c.105-.015.218-.038.323-.06l-1.05-4.9a.161.161,0,0,0-.158-.128C58.928,76.605,58.913,76.605,58.905,76.613Zm-1.718.12-1.005,4.678c.105.03.21.068.315.09l1.013-4.708a.153.153,0,0,0-.128-.188h-.038A.174.174,0,0,0,57.187,76.733Zm1.343-.068a.157.157,0,0,0-.143.18l.525,4.934c.1-.007.218-.007.323-.023l-.525-4.949a.163.163,0,0,0-.165-.143Zm-.945.15-.51,4.829c.105.023.218.038.323.053l.518-4.851a.166.166,0,0,0-.143-.18h-.015A.166.166,0,0,0,57.585,76.816Zm.4.03v4.912c.1.007.217.015.323.015V76.839a.16.16,0,0,0-.165-.158A.177.177,0,0,0,57.983,76.846Z" fill-rule="evenodd"/> 9 <path id="Path_3" data-name="Path 3" d="M56.415,68.324l.4,1.2a.162.162,0,0,0,.158.113.146.146,0,0,0,.053-.008.164.164,0,0,0,.105-.2l-.375-1.113H56.7C56.61,68.317,56.512,68.317,56.415,68.324Zm.773,1.083a.161.161,0,0,0,.157.128h.038a.161.161,0,0,0,.128-.188l-.21-.993c-.112-.015-.225-.023-.338-.03Zm-1.328-1.015.585,1.294a.172.172,0,0,0,.15.1.219.219,0,0,0,.068-.015.157.157,0,0,0,.082-.211L56.2,68.347A2.6,2.6,0,0,0,55.859,68.392Zm1.726.94a.163.163,0,0,0,.165.143h.015a.157.157,0,0,0,.143-.18l-.09-.85-.338-.068Zm-2.168-.85c-.037.007-.083.023-.12.03l.8,1.361a.161.161,0,0,0,.143.083.171.171,0,0,0,.083-.023.161.161,0,0,0,.06-.218l-.75-1.279C55.559,68.452,55.492,68.467,55.417,68.482Zm2.566.812a.16.16,0,0,0,.165.158.165.165,0,0,0,.165-.158V68.58c-.105-.038-.218-.068-.323-.1v.812Zm-3.241-.587,1.028,1.4a.16.16,0,0,0,.135.068.165.165,0,0,0,.1-.03.159.159,0,0,0,.037-.226l-.975-1.324C54.951,68.633,54.846,68.67,54.741,68.708Zm3.639.587a.166.166,0,0,0,.143.18h.015a.169.169,0,0,0,.165-.143l.06-.564c-.1-.045-.21-.09-.315-.128Zm-4.2-.339,1.283,1.414a.149.149,0,0,0,.12.053.18.18,0,0,0,.112-.045.157.157,0,0,0,.015-.226l-1.223-1.339C54.381,68.858,54.284,68.911,54.179,68.956Zm4.6.384a.153.153,0,0,0,.128.188h.038A.161.161,0,0,0,59.1,69.4l.09-.429c-.1-.053-.2-.113-.3-.158Zm.39.09a.164.164,0,0,0,.1.2.111.111,0,0,0,.053.008.169.169,0,0,0,.158-.113l.1-.3c-.09-.068-.187-.128-.285-.188Zm-5.529-.158L55.2,70.663a.152.152,0,0,0,.112.045.149.149,0,0,0,.12-.053.157.157,0,0,0-.015-.226L53.924,69.1C53.826,69.151,53.729,69.212,53.639,69.272Zm5.912.278a.157.157,0,0,0,.083.211.219.219,0,0,0,.067.015.172.172,0,0,0,.15-.1l.083-.181c-.083-.075-.173-.143-.263-.211Zm-6.437.105,1.846,1.331a.15.15,0,0,0,.1.03.17.17,0,0,0,.135-.068.159.159,0,0,0-.038-.226l-1.771-1.279A2.585,2.585,0,0,0,53.113,69.656Zm6.8.06a.161.161,0,0,0,.06.218.151.151,0,0,0,.083.023.17.17,0,0,0,.143-.083l.053-.09a2.245,2.245,0,0,0-.24-.226Zm.345.2a.159.159,0,0,0,.037.226.15.15,0,0,0,.1.03.17.17,0,0,0,.135-.068l.007-.007c-.068-.083-.143-.165-.218-.248Zm-7.645.181,2.138,1.226a.151.151,0,0,0,.083.022.161.161,0,0,0,.083-.3l-2.056-1.181C52.776,69.941,52.693,70.017,52.611,70.1Zm7.983.286a.152.152,0,0,0,.113.045.22.22,0,0,0,.068-.015c-.06-.083-.128-.173-.188-.248A.143.143,0,0,0,60.593,70.385Zm-8.44.226,2.431,1.068a.22.22,0,0,0,.068.015.172.172,0,0,0,.15-.1.157.157,0,0,0-.083-.211l-2.348-1.03C52.3,70.438,52.228,70.521,52.153,70.611Zm8.711.038a.157.157,0,0,0,.1.053c-.045-.068-.083-.135-.128-.2A.138.138,0,0,0,60.864,70.648Zm-9.116.534,2.716.872a.111.111,0,0,0,.053.007.169.169,0,0,0,.158-.113.164.164,0,0,0-.105-.2L51.943,70.9A3.143,3.143,0,0,0,51.748,71.182Zm-.345.632,2.971.624h.038a.161.161,0,0,0,.158-.128.152.152,0,0,0-.128-.188l-2.889-.6C51.5,71.619,51.448,71.716,51.4,71.814Zm-.278.692,3.2.331h.015a.169.169,0,0,0,.165-.143.166.166,0,0,0-.143-.18l-3.129-.323A2.656,2.656,0,0,0,51.125,72.506Zm8.516.406a.165.165,0,0,0-.165.158.16.16,0,0,0,.165.158h8.208c.015-.105.022-.218.03-.323H59.641Zm-8.643,0c-.03.105-.053.211-.075.324h3.4a.165.165,0,0,0,.165-.158.16.16,0,0,0-.165-.158H51Zm10.781.534a.166.166,0,0,0,.143.18l5.755.6.068-.316-5.785-.6h-.015A.151.151,0,0,0,61.779,73.446Zm-7.45-.143-3.474.361c-.015.105-.022.218-.03.331l3.541-.368a.157.157,0,0,0,.143-.18.163.163,0,0,0-.165-.143Zm7.39.519a.153.153,0,0,0,.128.188l5.567,1.173c.038-.105.068-.2.1-.308l-5.6-1.173h-.038A.152.152,0,0,0,61.719,73.822Zm-7.345-.12-3.571.752c0,.105,0,.218.007.331l3.631-.76a.159.159,0,0,0-.03-.316C54.4,73.695,54.389,73.695,54.374,73.7Zm7.248.489a.164.164,0,0,0,.1.2L67.046,76.1c.045-.1.09-.2.128-.3l-5.35-1.722a.111.111,0,0,0-.052-.007A.188.188,0,0,0,61.621,74.191Zm-7.158-.105-3.6,1.158c.015.105.03.218.053.323l3.654-1.173a.164.164,0,0,0,.105-.2.169.169,0,0,0-.158-.113A.111.111,0,0,0,54.464,74.086Zm7.023.459a.157.157,0,0,0,.083.211L66.6,76.974c.052-.09.1-.188.157-.286L61.7,74.462a.219.219,0,0,0-.068-.015A.154.154,0,0,0,61.486,74.545Zm-6.9-.083-3.579,1.572v.007c.03.105.06.2.09.3l3.616-1.587a.157.157,0,0,0,.083-.211.172.172,0,0,0-.15-.1A.142.142,0,0,0,54.591,74.462Zm6.722.421a.161.161,0,0,0,.06.218l4.7,2.685c.06-.09.127-.173.188-.263l-4.719-2.7a.151.151,0,0,0-.083-.022A.161.161,0,0,0,61.314,74.883Zm-6.557-.06-3.489,1.986c.037.105.083.2.127.3l3.526-2.016a.161.161,0,0,0-.083-.3A.271.271,0,0,0,54.756,74.823ZM61.1,75.2a.159.159,0,0,0,.038.226l4.329,3.114c.075-.083.143-.165.21-.248l-4.351-3.129a.151.151,0,0,0-.1-.03A.157.157,0,0,0,61.1,75.2Zm-6.145-.038-3.346,2.407c.052.1.1.2.158.286l3.384-2.429a.162.162,0,0,0-.1-.293A.15.15,0,0,0,54.959,75.161Zm5.9.331a.157.157,0,0,0,.015.226l3.931,3.5c.083-.075.158-.15.233-.226L61.1,75.477a.152.152,0,0,0-.113-.045A.185.185,0,0,0,60.864,75.492ZM55.2,75.477,52.04,78.29c.06.09.12.181.188.271l3.189-2.843a.157.157,0,0,0,.015-.226.149.149,0,0,0-.12-.053A.184.184,0,0,0,55.2,75.477Zm5.394.286a.157.157,0,0,0-.015.226l3.5,3.843c.083-.068.173-.135.255-.2l-3.511-3.859a.154.154,0,0,0-.225-.007Zm-5.124.007-2.919,3.212c.068.083.143.165.218.248L55.717,76a.175.175,0,0,0-.128-.278A.149.149,0,0,0,55.469,75.771ZM60.293,76a.159.159,0,0,0-.037.226L63.3,80.366c.09-.06.188-.113.278-.173l-3.061-4.159a.16.16,0,0,0-.135-.068A.144.144,0,0,0,60.293,76Zm-4.524.038-2.626,3.58c.075.075.158.15.24.218l2.648-3.61A.159.159,0,0,0,55.994,76a.151.151,0,0,0-.1-.03A.157.157,0,0,0,55.769,76.034Zm.323.226-2.281,3.911c.09.068.173.128.263.188l2.3-3.941a.161.161,0,0,0-.06-.218.151.151,0,0,0-.083-.023A.215.215,0,0,0,56.092,76.259Zm3.8.083a.172.172,0,0,0,.023.083l2.566,4.4c.1-.045.195-.1.293-.15l-2.573-4.4a.168.168,0,0,0-.143-.09A.16.16,0,0,0,59.888,76.342Zm-.255.038a.157.157,0,0,0-.083.211l2.071,4.6c.1-.038.2-.075.3-.12l-2.078-4.618a.172.172,0,0,0-.15-.1A.3.3,0,0,0,59.633,76.38Zm-3.189.075-1.9,4.212c.045.023.083.053.128.075a1.568,1.568,0,0,0,.158.083l1.913-4.242a.157.157,0,0,0-.082-.211.216.216,0,0,0-.068-.015A.168.168,0,0,0,56.444,76.455Zm2.828.06a.164.164,0,0,0-.1.2l1.568,4.769.315-.09L59.483,76.62a.169.169,0,0,0-.158-.113A.128.128,0,0,0,59.273,76.515Zm-2.461.1-1.471,4.475c.1.045.2.09.3.128l1.478-4.5a.164.164,0,0,0-.105-.2.111.111,0,0,0-.053-.007A.153.153,0,0,0,56.812,76.613Zm2.093,0a.161.161,0,0,0-.128.188l1.05,4.882c.105-.015.218-.038.323-.06l-1.05-4.9a.161.161,0,0,0-.158-.128C58.928,76.605,58.913,76.605,58.905,76.613Zm-1.718.12-1.005,4.678c.105.03.21.068.315.09l1.013-4.708a.153.153,0,0,0-.128-.188h-.038A.174.174,0,0,0,57.187,76.733Zm1.343-.068a.157.157,0,0,0-.143.18l.525,4.934c.1-.007.218-.007.323-.023l-.525-4.949a.163.163,0,0,0-.165-.143Zm-.945.15-.51,4.829c.105.023.218.038.323.053l.518-4.851a.166.166,0,0,0-.143-.18h-.015A.166.166,0,0,0,57.585,76.816Zm.4.03v4.912c.1.007.217.015.323.015V76.839a.16.16,0,0,0-.165-.158A.177.177,0,0,0,57.983,76.846Z" fill-rule="evenodd"/>
10 </g> 10 </g>
11 <path id="Path_4" data-name="Path 4" d="M70.48,20.624a1.131,1.131,0,0,1-.692-1.1,3.258,3.258,0,1,0-6.449.5,1.132,1.132,0,0,1-.484,1.172,2.723,2.723,0,1,0,3.717,3.86,1.131,1.131,0,0,1,1.577-.262,2.4,2.4,0,1,0,2.332-4.168Z"/> 11 <path id="Path_4" data-name="Path 4" d="M70.48,20.624a1.131,1.131,0,0,1-.692-1.1,3.258,3.258,0,1,0-6.449.5,1.132,1.132,0,0,1-.484,1.172,2.723,2.723,0,1,0,3.717,3.86,1.131,1.131,0,0,1,1.577-.262,2.4,2.4,0,1,0,2.332-4.168Z"/>
12 <path id="Path_5" data-name="Path 5" d="M85.6,31.7l2.442,1.951a7.25,7.25,0,0,0-6.221-3.527,6.786,6.786,0,0,0-.856.052,1.131,1.131,0,0,1-1.14-1.659,7.221,7.221,0,0,0,.659-1.729,7.816,7.816,0,0,1-2.014.264,1.131,1.131,0,1,1,0-2.263A5.571,5.571,0,1,0,75.357,14.6a1.132,1.132,0,1,1-1.267-1.875A7.8,7.8,0,0,1,75.451,12a4.459,4.459,0,0,0-5.725-2.84A1.131,1.131,0,0,1,68.468,8.8a7.238,7.238,0,0,0-11.186-.093,6.72,6.72,0,0,1,3.439,5.861,1.131,1.131,0,1,1-2.263,0,4.454,4.454,0,1,0-8.908,0,1.131,1.131,0,1,1-2.263,0,6.7,6.7,0,0,1,.166-1.476,4.269,4.269,0,0,0-4.791,5.456,6.827,6.827,0,0,1,1.681,2.259,5.7,5.7,0,0,1,4.82,5.664,5.633,5.633,0,0,1-2.906,4.983H84.9A1.135,1.135,0,0,1,85.6,31.7ZM73.9,24.532a4.667,4.667,0,0,1-6.042,2.653l-.119-.048a4.988,4.988,0,1,1-6.711-7.38,5.523,5.523,0,0,1,11.011-.868,4.634,4.634,0,0,1,1.86,5.643Z"/> 12 <path id="Path_5" data-name="Path 5" d="M85.6,31.7l2.442,1.951a7.25,7.25,0,0,0-6.221-3.527,6.786,6.786,0,0,0-.856.052,1.131,1.131,0,0,1-1.14-1.659,7.221,7.221,0,0,0,.659-1.729,7.816,7.816,0,0,1-2.014.264,1.131,1.131,0,1,1,0-2.263A5.571,5.571,0,1,0,75.357,14.6a1.132,1.132,0,1,1-1.267-1.875A7.8,7.8,0,0,1,75.451,12a4.459,4.459,0,0,0-5.725-2.84A1.131,1.131,0,0,1,68.468,8.8a7.238,7.238,0,0,0-11.186-.093,6.72,6.72,0,0,1,3.439,5.861,1.131,1.131,0,1,1-2.263,0,4.454,4.454,0,1,0-8.908,0,1.131,1.131,0,1,1-2.263,0,6.7,6.7,0,0,1,.166-1.476,4.269,4.269,0,0,0-4.791,5.456,6.827,6.827,0,0,1,1.681,2.259,5.7,5.7,0,0,1,4.82,5.664,5.633,5.633,0,0,1-2.906,4.983H84.9A1.135,1.135,0,0,1,85.6,31.7ZM73.9,24.532a4.667,4.667,0,0,1-6.042,2.653l-.119-.048a4.988,4.988,0,1,1-6.711-7.38,5.523,5.523,0,0,1,11.011-.868,4.634,4.634,0,0,1,1.86,5.643Z"/>
13 <path id="Path_6" data-name="Path 6" d="M68.449,80.782a13.4,13.4,0,0,1-19.369,0H39.353l3.436,28.964H74.6L78.04,80.782Z"/> 13 <path id="Path_6" data-name="Path 6" d="M68.449,80.782a13.4,13.4,0,0,1-19.369,0H39.353l3.436,28.964H74.6L78.04,80.782Z"/>
14 <path id="Path_7" data-name="Path 7" d="M76.882,109.745h4.44l11.32-69.532-6.864-5.467Z"/> 14 <path id="Path_7" data-name="Path 7" d="M76.882,109.745h4.44l11.32-69.532-6.864-5.467Z"/>
15 <path id="Path_8" data-name="Path 8" d="M33.522,29.682a3.578,3.578,0,0,0,.43,1.771h6.929a3.265,3.265,0,0,0,.309-.8.128.128,0,0,1,0-.014,1.159,1.159,0,0,1,1.046-.8l.294,0A3.476,3.476,0,1,0,43.526,23a1.139,1.139,0,0,1-1.054-.774,4.593,4.593,0,1,0-8.213,3.951,1.142,1.142,0,0,1-.033,1.276A3.854,3.854,0,0,0,33.522,29.682Z"/> 15 <path id="Path_8" data-name="Path 8" d="M33.522,29.682a3.578,3.578,0,0,0,.43,1.771h6.929a3.265,3.265,0,0,0,.309-.8.128.128,0,0,1,0-.014,1.159,1.159,0,0,1,1.046-.8l.294,0A3.476,3.476,0,1,0,43.526,23a1.139,1.139,0,0,1-1.054-.774,4.593,4.593,0,1,0-8.213,3.951,1.142,1.142,0,0,1-.033,1.276A3.854,3.854,0,0,0,33.522,29.682Z"/>
16 <path id="Path_9" data-name="Path 9" d="M24.75,40.213l11.32,69.532h4.441l-8.9-75Z"/> 16 <path id="Path_9" data-name="Path 9" d="M24.75,40.213l11.32,69.532h4.441l-8.9-75Z"/>
17 <path id="Path_10" data-name="Path 10" d="M31.645,31.828a6.139,6.139,0,0,1-.386-2.14c0-.111,0-.221.01-.332a7.4,7.4,0,0,0-3.541,5.592Z"/> 17 <path id="Path_10" data-name="Path 10" d="M31.645,31.828a6.139,6.139,0,0,1-.386-2.14c0-.111,0-.221.01-.332a7.4,7.4,0,0,0-3.541,5.592Z"/>
18 </g> 18 </g>
19 <path id="Vector" d="M3.111,16.249H2.4a14.028,14.028,0,0,1,2.828-3.518c.306-.3.621-.606.936-.9s.671-.606.994-.877A11.363,11.363,0,0,1,8.817,9.727c.265.251.53.489.791.723a8.435,8.435,0,0,1,2.484,3.025c.286.7.141,1.049,0,1.253-.658.978-2.965,1.349-5.176,1.479l-.853.042-.828.021c-.832,0-1.586-.013-2.12-.021ZM26.506,88.386c.07-1.253.132-2.4.19-3.522.124-2.515.244-4.8.431-7.3,2.439,1.044,5.143,2.089,8.136,3.108,6.182,2.126,15.548,4.558,21.146,6.012,2.517.652,4.5,1.17,5.018,1.349a6.5,6.5,0,0,0,2.07.418,2.067,2.067,0,0,0,1.694-.706c1.516-1.867-.969-6.3-5.143-13.394a78.388,78.388,0,0,1-4.211-7.712c-1.747-4.107-4.969-9.358-8.745-15.458-7.014-11.355-15.734-25.484-16.84-36.572-.6-6-3.822-10.862-8.625-13.035a11.253,11.253,0,0,0-11.457.957,12.354,12.354,0,0,0-4.555,7.52C3.2,12.138.457,15.146.648,16.7a1.453,1.453,0,0,0,1.615,1.216H5.413a131.948,131.948,0,0,1,.153,22.522C4.792,54.149,4.254,63.8,17.16,72.306c.348,5.431,1.052,13.243,1.3,15.875l1.7.008s-.853-9.346-1.246-14.722a65.491,65.491,0,0,0,6.542,3.371c-.215,2.753-.344,5.205-.484,7.938-.062,1.116-.12,2.273-.191,3.509Z" transform="translate(1022.362 461.549)"/> 19 <path id="Vector" d="M3.111,16.249H2.4a14.028,14.028,0,0,1,2.828-3.518c.306-.3.621-.606.936-.9s.671-.606.994-.877A11.363,11.363,0,0,1,8.817,9.727c.265.251.53.489.791.723a8.435,8.435,0,0,1,2.484,3.025c.286.7.141,1.049,0,1.253-.658.978-2.965,1.349-5.176,1.479l-.853.042-.828.021c-.832,0-1.586-.013-2.12-.021ZM26.506,88.386c.07-1.253.132-2.4.19-3.522.124-2.515.244-4.8.431-7.3,2.439,1.044,5.143,2.089,8.136,3.108,6.182,2.126,15.548,4.558,21.146,6.012,2.517.652,4.5,1.17,5.018,1.349a6.5,6.5,0,0,0,2.07.418,2.067,2.067,0,0,0,1.694-.706c1.516-1.867-.969-6.3-5.143-13.394a78.388,78.388,0,0,1-4.211-7.712c-1.747-4.107-4.969-9.358-8.745-15.458-7.014-11.355-15.734-25.484-16.84-36.572-.6-6-3.822-10.862-8.625-13.035a11.253,11.253,0,0,0-11.457.957,12.354,12.354,0,0,0-4.555,7.52C3.2,12.138.457,15.146.648,16.7a1.453,1.453,0,0,0,1.615,1.216H5.413a131.948,131.948,0,0,1,.153,22.522C4.792,54.149,4.254,63.8,17.16,72.306c.348,5.431,1.052,13.243,1.3,15.875l1.7.008s-.853-9.346-1.246-14.722a65.491,65.491,0,0,0,6.542,3.371c-.215,2.753-.344,5.205-.484,7.938-.062,1.116-.12,2.273-.191,3.509Z" transform="translate(1022.362 461.549)"/>
20 </g> 20 </g>
21 </svg> 21 </svg>
22 22
src/assets/images/purple-comment.png

237 Bytes

src/assets/images/purple-heart.png

294 Bytes

src/assets/images/spot-light-bt.svg
1 <svg xmlns="http://www.w3.org/2000/svg" width="708.022" height="418.896" viewBox="0 0 708.022 418.896"> 1 <svg xmlns="http://www.w3.org/2000/svg" width="708.022" height="418.896" viewBox="0 0 708.022 418.896">
2 <g id="spot-light-bt" transform="translate(-757 -323)"> 2 <g id="spot-light-bt" transform="translate(-757 -323)">
3 <path id="Vector_5" data-name="Vector 5" d="M499.988.242,655.8,367.167l-27.047,14.044L.122,331.726V.242Z" transform="translate(756.878 322.758)" fill="#fff" opacity="0.26"/> 3 <path id="Vector_5" data-name="Vector 5" d="M499.988.242,655.8,367.167l-27.047,14.044L.122,331.726V.242Z" transform="translate(756.878 322.758)" fill="#fff" opacity="0.26"/>
4 <g id="Group_410" data-name="Group 410" transform="translate(1369.493 646.332)"> 4 <g id="Group_410" data-name="Group 410" transform="translate(1369.493 646.332)">
5 <path id="Path_1" data-name="Path 1" d="M46.869,56.29a5.611,5.611,0,1,1,5.61,5.61A5.61,5.61,0,0,1,46.869,56.29Z"/> 5 <path id="Path_1" data-name="Path 1" d="M46.869,56.29a5.611,5.611,0,1,1,5.61,5.61A5.61,5.61,0,0,1,46.869,56.29Z"/>
6 <path id="Path_2" data-name="Path 2" d="M91.4,44.817,39.511,18.646,34.931,4.668,29.6,6.415l4.581,13.979-16.7,32.964L3.507,57.936l1.746,5.333L19.23,58.69l19.8,9.974,3.159-15.041a11.221,11.221,0,1,1,21.963,4.613L60.364,76.27l-.607,2.89,11.357,5.7,4.974-9.82,9.3,4.711,10.14-20.022-9.3-4.71Z"/> 6 <path id="Path_2" data-name="Path 2" d="M91.4,44.817,39.511,18.646,34.931,4.668,29.6,6.415l4.581,13.979-16.7,32.964L3.507,57.936l1.746,5.333L19.23,58.69l19.8,9.974,3.159-15.041a11.221,11.221,0,1,1,21.963,4.613L60.364,76.27l-.607,2.89,11.357,5.7,4.974-9.82,9.3,4.711,10.14-20.022-9.3-4.71Z"/>
7 <path id="Path_3" data-name="Path 3" d="M34.112,66.235,60.1,79.164,70.191,42.356,41.339,40.72Z"/> 7 <path id="Path_3" data-name="Path 3" d="M34.112,66.235,60.1,79.164,70.191,42.356,41.339,40.72Z"/>
8 <path id="Path_4" data-name="Path 4" d="M58.09,65.95a10.866,10.866,0,0,1-11.221,0v24H32.841v5.611H72.116V89.953H58.09Z"/> 8 <path id="Path_4" data-name="Path 4" d="M58.09,65.95a10.866,10.866,0,0,1-11.221,0v24H32.841v5.611H72.116V89.953H58.09Z"/>
9 <rect id="Rectangle_1" data-name="Rectangle 1" width="9.254" height="31.544" rx="4.627" transform="translate(57.123 83.223) rotate(180)" fill="none" stroke="#dfe7ef" stroke-width="2"/> 9 <rect id="Rectangle_1" data-name="Rectangle 1" width="9.254" height="31.544" rx="4.627" transform="translate(57.123 83.223) rotate(180)" fill="none" stroke="#dfe7ef" stroke-width="2"/>
10 <path id="Path_5" data-name="Path 5" d="M46.867,72.576l11.239,5.476v7.042L46.867,83.721Z"/> 10 <path id="Path_5" data-name="Path 5" d="M46.867,72.576l11.239,5.476v7.042L46.867,83.721Z"/>
11 <circle id="Ellipse_1" data-name="Ellipse 1" cx="1.576" cy="1.576" r="1.576" transform="translate(54.056 46.229) rotate(180)" fill="#dfe7ef"/> 11 <circle id="Ellipse_1" data-name="Ellipse 1" cx="1.576" cy="1.576" r="1.576" transform="translate(54.056 46.229) rotate(180)" fill="#dfe7ef"/>
12 </g> 12 </g>
13 </g> 13 </g>
14 </svg> 14 </svg>
15 15
src/assets/images/spot-light.svg
1 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1883.558" height="1200.706" viewBox="0 0 1883.558 1200.706"> 1 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1883.558" height="1200.706" viewBox="0 0 1883.558 1200.706">
2 <defs> 2 <defs>
3 <linearGradient id="linear-gradient" x1="0.654" y1="0.405" x2="-0.005" y2="0.647" gradientUnits="objectBoundingBox"> 3 <linearGradient id="linear-gradient" x1="0.654" y1="0.405" x2="-0.005" y2="0.647" gradientUnits="objectBoundingBox">
4 <stop offset="0" stop-color="#fff" stop-opacity="0.02"/> 4 <stop offset="0" stop-color="#fff" stop-opacity="0.02"/>
5 <stop offset="1" stop-color="#fff"/> 5 <stop offset="1" stop-color="#fff"/>
6 </linearGradient> 6 </linearGradient>
7 </defs> 7 </defs>
8 <g id="spot-light" transform="translate(-213 53.881)"> 8 <g id="spot-light" transform="translate(-213 53.881)">
9 <g id="Group_377" data-name="Group 377" transform="translate(212.229 721.325)"> 9 <g id="Group_377" data-name="Group 377" transform="translate(212.229 721.325)">
10 <path id="Path_1" data-name="Path 1" d="M48.617,47.093a5.611,5.611,0,1,0-5.61,5.61A5.611,5.611,0,0,0,48.617,47.093Z"/> 10 <path id="Path_1" data-name="Path 1" d="M48.617,47.093a5.611,5.611,0,1,0-5.61,5.61A5.611,5.611,0,0,0,48.617,47.093Z"/>
11 <path id="Path_2" data-name="Path 2" d="M7.881,28.362,64.036,13.414,71.392.675l4.86,2.805L68.9,16.219l9.565,35.692L91.2,59.264l-2.805,4.86L75.655,56.771,54.227,62.462V47.093a11.221,11.221,0,1,0-22.443,0V68.475L19.5,71.716,16.65,61.083l-10.07,2.7L.771,42.1,10.84,39.4Z"/> 11 <path id="Path_2" data-name="Path 2" d="M7.881,28.362,64.036,13.414,71.392.675l4.86,2.805L68.9,16.219l9.565,35.692L91.2,59.264l-2.805,4.86L75.655,56.771,54.227,62.462V47.093a11.221,11.221,0,1,0-22.443,0V68.475L19.5,71.716,16.65,61.083l-10.07,2.7L.771,42.1,10.84,39.4Z"/>
12 <path id="Path_3" data-name="Path 3" d="M59.539,61.1,31.447,68.408l-2.309-38.1L57.711,34.64Z"/> 12 <path id="Path_3" data-name="Path 3" d="M59.539,61.1,31.447,68.408l-2.309-38.1L57.711,34.64Z"/>
13 <path id="Path_4" data-name="Path 4" d="M37.4,56.753a10.865,10.865,0,0,0,11.221,0v24H62.644v5.611H23.369V80.756H37.4Z"/> 13 <path id="Path_4" data-name="Path 4" d="M37.4,56.753a10.865,10.865,0,0,0,11.221,0v24H62.644v5.611H23.369V80.756H37.4Z"/>
14 <rect id="Rectangle_1" data-name="Rectangle 1" width="9.254" height="29.15" rx="4.627" transform="translate(38.362 42.482)" fill="none" stroke="#dfe7ef" stroke-width="2"/> 14 <rect id="Rectangle_1" data-name="Rectangle 1" width="9.254" height="29.15" rx="4.627" transform="translate(38.362 42.482)" fill="none" stroke="#dfe7ef" stroke-width="2"/>
15 <path id="Path_5" data-name="Path 5" d="M48.618,63.9l-11.239,2.9v9.1l11.239-1.373Z"/> 15 <path id="Path_5" data-name="Path 5" d="M48.618,63.9l-11.239,2.9v9.1l11.239-1.373Z"/>
16 <circle id="Ellipse_1" data-name="Ellipse 1" cx="1.576" cy="1.576" r="1.576" transform="translate(41.43 33.879)" fill="#dfe7ef"/> 16 <circle id="Ellipse_1" data-name="Ellipse 1" cx="1.576" cy="1.576" r="1.576" transform="translate(41.43 33.879)" fill="#dfe7ef"/>
17 </g> 17 </g>
18 <path id="Vector_4" data-name="Vector 4" d="M378.721,15.581,1.132,750.99l8.1,36.087,584.828,359.017,1222.5,14.34V-40.272Z" transform="translate(279.999 -13.608)" opacity="0.95" fill="url(#linear-gradient)"/> 18 <path id="Vector_4" data-name="Vector 4" d="M378.721,15.581,1.132,750.99l8.1,36.087,584.828,359.017,1222.5,14.34V-40.272Z" transform="translate(279.999 -13.608)" opacity="0.95" fill="url(#linear-gradient)"/>
19 </g> 19 </g>
20 </svg> 20 </svg>
21 21
src/assets/images/two-web-screen.svg
1 <svg xmlns="http://www.w3.org/2000/svg" width="482" height="643.547" viewBox="0 0 482 643.547"> 1 <svg xmlns="http://www.w3.org/2000/svg" width="482" height="643.547" viewBox="0 0 482 643.547">
2 <g id="two-web-screen" transform="translate(-526.812 -208.812)"> 2 <g id="two-web-screen" transform="translate(-526.812 -208.812)">
3 <g id="_1442" data-name="1442" transform="translate(526.812 208.812)"> 3 <g id="_1442" data-name="1442" transform="translate(526.812 208.812)">
4 <path id="Path_1" data-name="Path 1" d="M.188,11.485H481.812V312.359H.188Z" fill="#fff" stroke="#000" stroke-width="0.377"/> 4 <path id="Path_1" data-name="Path 1" d="M.188,11.485H481.812V312.359H.188Z" fill="#fff" stroke="#000" stroke-width="0.377"/>
5 <path id="Path_2" data-name="Path 2" d="M.188,3.013A2.824,2.824,0,0,1,3.013.188H478.988a2.825,2.825,0,0,1,2.824,2.824v8.849H.188Z" fill="none" stroke="#000" stroke-width="0.377"/> 5 <path id="Path_2" data-name="Path 2" d="M.188,3.013A2.824,2.824,0,0,1,3.013.188H478.988a2.825,2.825,0,0,1,2.824,2.824v8.849H.188Z" fill="none" stroke="#000" stroke-width="0.377"/>
6 <path id="Path_3" data-name="Path 3" d="M19.581,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,19.581,8.284Z" fill-rule="evenodd"/> 6 <path id="Path_3" data-name="Path 3" d="M19.581,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,19.581,8.284Z" fill-rule="evenodd"/>
7 <path id="Path_4" data-name="Path 4" d="M12.8,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,12.8,8.284Z" fill-rule="evenodd"/> 7 <path id="Path_4" data-name="Path 4" d="M12.8,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,12.8,8.284Z" fill-rule="evenodd"/>
8 <path id="Path_5" data-name="Path 5" d="M6.025,8.284A2.259,2.259,0,1,0,3.766,6.025,2.259,2.259,0,0,0,6.025,8.284Z" fill-rule="evenodd"/> 8 <path id="Path_5" data-name="Path 5" d="M6.025,8.284A2.259,2.259,0,1,0,3.766,6.025,2.259,2.259,0,0,0,6.025,8.284Z" fill-rule="evenodd"/>
9 </g> 9 </g>
10 <g id="_1442-2" data-name="1442" transform="translate(526.812 539.812)"> 10 <g id="_1442-2" data-name="1442" transform="translate(526.812 539.812)">
11 <path id="Path_1-2" data-name="Path 1" d="M.188,11.485H481.812V312.359H.188Z" fill="#fff" stroke="#000" stroke-width="0.377"/> 11 <path id="Path_1-2" data-name="Path 1" d="M.188,11.485H481.812V312.359H.188Z" fill="#fff" stroke="#000" stroke-width="0.377"/>
12 <path id="Path_2-2" data-name="Path 2" d="M.188,3.013A2.824,2.824,0,0,1,3.013.188H478.988a2.825,2.825,0,0,1,2.824,2.824v8.849H.188Z" fill="none" stroke="#000" stroke-width="0.377"/> 12 <path id="Path_2-2" data-name="Path 2" d="M.188,3.013A2.824,2.824,0,0,1,3.013.188H478.988a2.825,2.825,0,0,1,2.824,2.824v8.849H.188Z" fill="none" stroke="#000" stroke-width="0.377"/>
13 <path id="Path_3-2" data-name="Path 3" d="M19.581,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,19.581,8.284Z" fill-rule="evenodd"/> 13 <path id="Path_3-2" data-name="Path 3" d="M19.581,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,19.581,8.284Z" fill-rule="evenodd"/>
14 <path id="Path_4-2" data-name="Path 4" d="M12.8,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,12.8,8.284Z" fill-rule="evenodd"/> 14 <path id="Path_4-2" data-name="Path 4" d="M12.8,8.284a2.259,2.259,0,1,0-2.259-2.259A2.259,2.259,0,0,0,12.8,8.284Z" fill-rule="evenodd"/>
15 <path id="Path_5-2" data-name="Path 5" d="M6.025,8.284A2.259,2.259,0,1,0,3.766,6.025,2.259,2.259,0,0,0,6.025,8.284Z" fill-rule="evenodd"/> 15 <path id="Path_5-2" data-name="Path 5" d="M6.025,8.284A2.259,2.259,0,1,0,3.766,6.025,2.259,2.259,0,0,0,6.025,8.284Z" fill-rule="evenodd"/>
16 </g> 16 </g>
17 </g> 17 </g>
18 </svg> 18 </svg>
19 19
src/components/LandingPage.vue
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 <div class="container-fluid main-wrp"> 3 <div class="container-fluid main-wrp">
4 <nav class="navbar navbar-expand-sm spotLight-nav"> 4 <nav class="navbar navbar-expand-sm spotLight-nav">
5 <a class="navbar-brand" href="#" 5 <a class="navbar-brand" href="#"
6 ><img src="../assets/images/logo.png" 6 ><img src="../assets/images/logo.png"
7 /></a> 7 /></a>
8 <button 8 <button
9 class="navbar-toggler" 9 class="navbar-toggler"
10 type="button" 10 type="button"
11 data-toggle="collapse" 11 data-toggle="collapse"
12 data-target="#navbarsExample03" 12 data-target="#navbarsExample03"
13 aria-controls="navbarsExample03" 13 aria-controls="navbarsExample03"
14 aria-expanded="false" 14 aria-expanded="false"
15 aria-label="Toggle navigation" 15 aria-label="Toggle navigation"
16 > 16 >
17 <span class="navbar-toggler-icon"></span> 17 <span class="navbar-toggler-icon"></span>
18 <span class="navbar-toggler-icon"></span> 18 <span class="navbar-toggler-icon"></span>
19 <span class="navbar-toggler-icon"></span> 19 <span class="navbar-toggler-icon"></span>
20 </button> 20 </button>
21 21
22 <div class="collapse navbar-collapse" id="navbarsExample03"> 22 <div class="collapse navbar-collapse" id="navbarsExample03">
23 <ul class="navbar-nav mr-auto"> 23 <ul class="navbar-nav mr-auto">
24 <li class="nav-item active"> 24 <li class="nav-item active">
25 <a class="nav-link" href="#">About</a> 25 <a class="nav-link" href="#">About</a>
26 </li> 26 </li>
27 <li class="nav-item"> 27 <li class="nav-item">
28 <a class="nav-link" href="#">Masterclass</a> 28 <a class="nav-link" href="#">Masterclass</a>
29 </li> 29 </li>
30 <li class="nav-item"> 30 <li class="nav-item">
31 <a class="nav-link" href="#">Stories</a> 31 <a class="nav-link" href="#">Stories</a>
32 </li> 32 </li>
33 <li class="nav-item spotLight-img"> 33 <li class="nav-item spotLight-img">
34 <a class="nav-link" href="#" 34 <a class="nav-link" href="#"
35 ><img src="../assets/images/SPOTLight.svg" 35 ><img src="../assets/images/SPOTLight.svg"
36 /></a> 36 /></a>
37 </li> 37 </li>
38 <li class="nav-item"> 38 <li class="nav-item">
39 <a class="nav-link" href="#">Library</a> 39 <a class="nav-link" href="#">Library</a>
40 </li> 40 </li>
41 </ul> 41 </ul>
42 </div> 42 </div>
43 </nav> 43 </nav>
44 <!-- menu wrapper --> 44 <!-- menu wrapper -->
45 <div class="sign-wrp"> 45 <div class="sign-wrp">
46 <div class="row col-reverse"> 46 <div class="row col-reverse">
47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div> 47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div>
48 <!-- users land image --> 48 <!-- users land image -->
49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp"> 49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp">
50 <h1 class="welcome-hd-back"> 50 <h1 class="welcome-hd-back">
51 Welcome <br /> 51 Welcome <br />
52 back 52 back
53 </h1> 53 </h1>
54 </div> 54 </div>
55 <!-- users land image --> 55 <!-- users land image -->
56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
57 <div class="form-layout signup-frm-spc"> 57 <div class="form-layout signup-frm-spc">
58 <form> 58 <form>
59 <h5>LogIn using</h5> 59 <h5>LogIn using</h5>
60 <div class="social-login"> 60 <div class="social-login">
61 <ul> 61 <ul>
62 <li> 62 <li>
63 <a @click="login"><img src="../assets/images/google.svg" /></a> 63 <a @click="login"><img src="../assets/images/google.svg" /></a>
64 </li> 64 </li>
65 <li> 65 <li>
66 <a @click="login"><img src="../assets/images/linkdin.svg" /></a> 66 <a @click="login"><img src="../assets/images/linkdin.svg" /></a>
67 </li> 67 </li>
68 <li> 68 <li>
69 <a @click="login"><img src="../assets/images/twitter.svg" /></a> 69 <a @click="login"><img src="../assets/images/twitter.svg" /></a>
70 </li> 70 </li>
71 </ul> 71 </ul>
72 </div> 72 </div>
73 <h5>or LogIn with email</h5> 73 <h5>or LogIn with email</h5>
74 <div class="fill-form"> 74 <div class="fill-form">
75 <label for="inputEmail" class="sr-only">Email address</label> 75 <label for="inputEmail" class="sr-only">Email address</label>
76 <input 76 <input
77 type="email" 77 type="email"
78 id="inputEmail" 78 id="inputEmail"
79 class="form-control" 79 class="form-control"
80 placeholder="Your Email ID" 80 placeholder="Your Email ID"
81 v-model="userData.email" 81 v-model="userData.email"
82 /> 82 />
83 <label for="inputPassword" class="sr-only">Password</label> 83 <label for="inputPassword" class="sr-only">Password</label>
84 <input 84 <input
85 type="password" 85 type="password"
86 id="inputPassword" 86 id="inputPassword"
87 class="form-control" 87 class="form-control"
88 placeholder="Password" 88 placeholder="Password"
89 v-model="userData.password" 89 v-model="userData.password"
90 /> 90 />
91 91
92 <a href="javascript:void(0);" class="btn btn-lg sb-button" type="submit" @click="loginWIthEmail"> 92 <a href="javascript:void(0);" class="btn btn-lg sb-button" type="submit" @click="loginWIthEmail">
93 <img src="../assets/images/key.svg" /> Log In to your account 93 <img src="../assets/images/key.svg" /> Log In to your account
94 </a> 94 </a>
95 <p class="forget-pass light-font-weight"> 95 <p class="forget-pass light-font-weight">
96 Forgot Password? <a @click="goToReset">Reset</a> 96 Forgot Password? <a @click="goToReset">Reset</a>
97 </p> 97 </p>
98 <h3>Donโ€™t have an account? <a @click="goToSignUp">SignUp</a></h3> 98 <h3 class="ft-normal">Donโ€™t have an account? <a @click="goToSignUp">SignUp</a></h3>
99 </div> 99 </div>
100 </form> 100 </form>
101 </div> 101 </div>
102 </div> 102 </div>
103 <!-- sign up --> 103 <!-- sign up -->
104 </div> </div> 104 </div> </div>
105 <!-- body wrapper --> 105 <!-- body wrapper -->
106 </div> 106 </div>
107 </main> 107 </main>
108 </template> 108 </template>
109 109
110 <script> 110 <script>
111 111
112 import Vue from "vue"; 112 import Vue from "vue";
113 import router from "../router"; 113 import router from "../router";
114 import $ from "jquery"; 114 import $ from "jquery";
115 import axios from "axios"; 115 import axios from "axios";
116 116
117 export default { 117 export default {
118 name: "LandingPage", 118 name: "LandingPage",
119 119
120 data() { 120 data() {
121 return { 121 return {
122 loggedinFlag: false, 122 loggedinFlag: false,
123 userData:{}, 123 userData:{},
124 }; 124 };
125 }, 125 },
126 mounted() { 126 mounted() {
127 this.$auth.logout(); 127 this.$auth.logout();
128 localStorage.removeItem("spotlight_usertoken"); 128 localStorage.removeItem("spotlight_usertoken");
129 localStorage.removeItem("spotlight_email"); 129 localStorage.removeItem("spotlight_email");
130 }, 130 },
131 methods: { 131 methods: {
132 login() { 132 login() {
133 this.$auth.loginWithRedirect(); 133 this.$auth.loginWithRedirect();
134 }, 134 },
135 goToSignUp(){ 135 goToSignUp(){
136 this.$router.push("/signup"); 136 this.$router.push("/signup");
137 }, 137 },
138 goToReset() { 138 goToReset() {
139 this.$router.push("/reset"); 139 this.$router.push("/reset");
140 }, 140 },
141 loginWIthEmail(){ 141 loginWIthEmail(){
142 axios 142 axios
143 .post("/login", this.userData) 143 .post("/login", this.userData)
144 .then((response) => { 144 .then((response) => {
145 console.log("login- response",response) 145 console.log("login- response",response)
146 this.$toaster.success(response.data.message) 146 this.$toaster.success(response.data.message)
147 if(response.data.status == 'success'){ 147 if(response.data.status == 'success'){
148 localStorage.setItem('spotlight_usertoken', JSON.stringify(response.data.data)) 148 localStorage.setItem('spotlight_usertoken', JSON.stringify(response.data.data))
149 this.$router.push("/profile"); 149 this.$router.push("/profile");
150 } 150 }
151 }) 151 })
152 .catch( (error) =>{ 152 .catch( (error) =>{
153 if (error.response) { 153 if (error.response) {
154 this.$toaster.error(error.response.data.message) 154 this.$toaster.error(error.response.data.message)
155 if(error.response.data.message == 'Email Not Verified'){ 155 if(error.response.data.message == 'Email Not Verified'){
156 localStorage.setItem('spotlight_email', this.userData.email); 156 localStorage.setItem('spotlight_email', this.userData.email);
157 this.$router.push({ name: 'Otp', params: { flag: true }}); 157 this.$router.push({ name: 'Otp', params: { flag: true }});
158 } 158 }
159 } 159 }
160 }); 160 });
161 } 161 }
162 }, 162 },
163 }; 163 };
164 </script> 164 </script>
165 <style> 165 <style>
166 .light-font-weight { 166 .light-font-weight {
167 font-weight: 400 !important; 167 font-weight: 400 !important;
168 } 168 }
169 169
170 170
171 </style> 171 </style>
172 172
src/components/ReadingFlowBounceBoard.vue
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 3
4 <div class="container-fluid episode-intro"> 4 <div class="container-fluid episode-intro">
5 <nav class="navbar navbar-expand-sm spotLight-nav"> 5 <nav class="navbar navbar-expand-sm spotLight-nav">
6 <a class="navbar-brand" href="#"><img src="../assets/images/logo.png"></a> 6 <a class="navbar-brand" href="#"><img src="../assets/images/logo.png"></a>
7 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample03" aria-controls="navbarsExample03" aria-expanded="false" aria-label="Toggle navigation"> 7 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample03" aria-controls="navbarsExample03" aria-expanded="false" aria-label="Toggle navigation">
8 <span class="navbar-toggler-icon"></span> 8 <span class="navbar-toggler-icon"></span>
9 <span class="navbar-toggler-icon"></span> 9 <span class="navbar-toggler-icon"></span>
10 <span class="navbar-toggler-icon"></span> 10 <span class="navbar-toggler-icon"></span>
11 </button> 11 </button>
12 <div class="user-profile-photo insights-profile"> 12 <div class="user-profile-photo insights-profile">
13 <a href="#"><img src="../assets/images/user.png"></a> 13 <a href="#"><img src="../assets/images/user.png"></a>
14 </div> 14 </div>
15 </nav> 15 </nav>
16 <!-- menu wrapper --> 16 <!-- menu wrapper -->
17 <div class="intro-startup"> 17 <div class="intro-startup">
18 <div class="bounce-board-wrp"> 18 <div class="bounce-board-wrp">
19 <div class="inner-wrp-bc"> 19 <div class="inner-wrp-bc">
20 <div class="bc-top-head"> 20 <div class="bc-top-head">
21 <span class="bc-head"> 21 <span class="bc-head">
22 <img src="../assets/images/bounce-icon.svg" /> Bounce Board 22 <img src="../assets/images/bounce-icon.svg" /> Bounce Board
23 </span> 23 </span>
24 <div class="action-sort"> 24 <div class="action-sort">
25 <span class="sort-by">SORT BY</span> <div class="btn-group"> 25 <span class="sort-by">SORT BY</span> <div class="btn-group">
26 <button type="button" class="bc-sort-list dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 26 <button type="button" class="bc-sort-list dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
27 BEST 27 BEST
28 </button> 28 </button>
29 <div class="dropdown-menu"> 29 <div class="dropdown-menu">
30 <a class="dropdown-item" href="#">BEST 1</a> 30 <a class="dropdown-item" href="#">BEST 1</a>
31 <a class="dropdown-item" href="#">BEST 2</a> 31 <a class="dropdown-item" href="#">BEST 2</a>
32 <a class="dropdown-item" href="#">BEST 3</a> 32 <a class="dropdown-item" href="#">BEST 3</a>
33 </div> 33 </div>
34 </div> 34 </div>
35 </div><!-- action sort --> 35 </div><!-- action sort -->
36 </div><!-- top head --> 36 </div><!-- top head -->
37 <div class="bounce-board-body"> 37 <div class="bounce-board-body">
38 <div class="bc-empty">Empty State</div> 38 <div class="bc-empty">Empty State</div>
39 </div><!-- bounce board body --> 39 </div><!-- bounce board body -->
40 </div> 40 </div>
41 </div><!-- bounceboard wrp --> 41 </div><!-- bounceboard wrp -->
42 <div class="single-mobileInsight"> 42 <div class="single-mobileInsight">
43 <img src="../assets/images/slide.png" class="slide-img" /> 43 <img src="../assets/images/slide.png" class="slide-img" />
44 <div class="single-left-Insight-comments"> 44 <div class="single-left-Insight-comments">
45 <img src="../assets/images/author-thoughts.svg" class="author-thoughts" /> 45 <img src="../assets/images/author-thoughts.svg" class="author-thoughts" />
46 <div class="single-author-li-comments"> 46 <div class="single-author-li-comments">
47 <div class="a-intro-comments custom-c-style"> 47 <div class="a-intro-comments custom-c-style">
48 <p>I wonder what the difference between โ€œ <strong>Dunzo Assistant </strong>โ€ and โ€œ<strong>Pickup and Drop </strong>โ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow</p> 48 <p>I wonder what the difference between โ€œ <strong>Dunzo Assistant </strong>โ€ and โ€œ<strong>Pickup and Drop </strong>โ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow</p>
49 <ul class="rly-comment-set"> 49 <ul class="rly-comment-set">
50 <li><img src="../assets/images/color-heart.svg" /> <a href="#">4</a></li> 50 <li><img src="../assets/images/color-heart.svg" /> <a href="#">4</a></li>
51 <li><img src="../assets/images/rply.svg" /> <a href="#">Reply</a></li> 51 <li><img src="../assets/images/rply.svg" /> <a href="#">Reply</a></li>
52 </ul> 52 </ul>
53 </div><!-- comments box --> 53 </div><!-- comments box -->
54 </div><!-- single author comments --> 54 </div><!-- single author comments -->
55 <div class="single-author-li-comments"> 55 <div class="single-author-li-comments">
56 <div class="a-intro-comments custom-c-style"> 56 <div class="a-intro-comments custom-c-style">
57 <p>I wonder what the difference between โ€œ <strong>Dunzo Assistant </strong>โ€ and โ€œ<strong>Pickup and Drop </strong>โ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow</p> 57 <p>I wonder what the difference between โ€œ <strong>Dunzo Assistant </strong>โ€ and โ€œ<strong>Pickup and Drop </strong>โ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow</p>
58 <ul class="rly-comment-set"> 58 <ul class="rly-comment-set">
59 <li><img src="../assets/images/color-heart.svg" /> <a href="#">4</a></li> 59 <li><img src="../assets/images/color-heart.svg" /> <a href="#">4</a></li>
60 <li><img src="../assets/images/rply.svg" /> <a href="#">Reply</a></li> 60 <li><img src="../assets/images/rply.svg" /> <a href="#">Reply</a></li>
61 </ul> 61 </ul>
62 </div><!-- comments box --> 62 </div><!-- comments box -->
63 </div><!-- single author comments --> 63 </div><!-- single author comments -->
64 </div><!-- single mobile Left insight --> 64 </div><!-- single mobile Left insight -->
65 <div class="c-product-insight-wrp "> 65 <div class="c-product-insight-wrp ">
66 <div class="single-author-li-comments "> 66 <div class="single-author-li-comments ">
67 <div class="a-intro-comments custom-selected-style"> 67 <div class="a-intro-comments custom-selected-style">
68 <img src="../assets/images/rect.svg" class="rect" /> 68 <img src="../assets/images/rect.svg" class="rect" />
69 <div class="top-wrp"> 69 <div class="top-wrp">
70 PRODUCT Insight <a href="#"><img src="../assets/images/link-red.svg" /></a> 70 PRODUCT Insight <a href="#"><img src="../assets/images/link-red.svg" /></a>
71 </div> 71 </div>
72 <div class="top-head">Decide on using multiple call to action vs single call to action depending on the stage of the user journey</div> 72 <div class="top-head">Decide on using multiple call to action vs single call to action depending on the stage of the user journey</div>
73 <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in the product. 73 <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in the product.
74 <br><br> 74 <br><br>
75 When the user is already onboarded and is in the <strong> engage stage </strong>, it may be better to use a single CTA for each use case in order to <strong> avoid ambiguity.</strong> 75 When the user is already onboarded and is in the <strong> engage stage </strong>, it may be better to use a single CTA for each use case in order to <strong> avoid ambiguity.</strong>
76 </p> 76 </p>
77 <div class="footer"> 77 <div class="footer">
78 <a href="#" class="cit-16">16 Citations</a> 78 <a href="#" class="cit-16">16 Citations</a>
79 <a href="#" class="ft-share"><img src="../assets/images/reply-red.svg" /> Share from library</a> 79 <a href="#" class="ft-share"><img src="../assets/images/reply-red.svg" /> Share from library</a>
80 </div><!-- footer --> 80 </div><!-- footer -->
81 81
82 </div><!-- comments box --> 82 </div><!-- comments box -->
83 </div><!-- single author comments --> 83 </div><!-- single author comments -->
84 84
85 </div><!-- single mobile Right insight --> 85 </div><!-- single mobile Right insight -->
86 </div><!-- Single Mobile Insight --> 86 </div><!-- Single Mobile Insight -->
87 <div class="footer-nav"> 87 <div class="footer-nav">
88 <div class="footer-top"> 88 <div class="footer-top">
89 <div class="row"> 89 <div class="row">
90 <div class="col-6 col-sm-7 col-md-7 col-lg-6 "> 90 <div class="col-6 col-sm-7 col-md-7 col-lg-6 ">
91 <div class="row h-100p"> 91 <div class="row h-100p">
92 <div class="col-4 col-sm-5 col-md-4 col-lg-4 col-xl-4"> 92 <div class="col-4 col-sm-5 col-md-4 col-lg-4 col-xl-4">
93 <ul class="top-intro-bt"> 93 <ul class="top-intro-bt">
94 <li><a href="#"><img src="../assets/images/skip-prev.svg"> Prev</a></li> 94 <li><a href="#"><img src="../assets/images/skip-prev.svg"> Prev</a></li>
95 <li><a href="#"><img src="../assets/images/skip-next.svg"> Skip to the next slide</a></li> 95 <li><a href="#"><img src="../assets/images/skip-next.svg"> Skip to the next slide</a></li>
96 </ul> 96 </ul>
97 </div> 97 </div>
98 98
99 </div> 99 </div>
100 </div> 100 </div>
101 </div> 101 </div>
102 </div><!-- footer top --> 102 </div><!-- footer top -->
103 <div class="footer-bottom"> 103 <div class="footer-bottom">
104 <ul> 104 <ul>
105 <li class=""></li> 105 <li class=""></li>
106 <li></li> 106 <li></li>
107 </ul> 107 </ul>
108 </div><!-- footer top --> 108 </div><!-- footer top -->
109 </div><!-- footer --> 109 </div><!-- footer -->
110 110
111 </div> 111 </div>
112 <!-- body wrapper --> 112 <!-- body wrapper -->
113 </div> 113 </div>
114 <!-- main wrapper --> 114 <!-- main wrapper -->
115 </main> 115 </main>
116 </template> 116 </template>
117 117
118 <script> 118 <script>
119 import Vue from "vue"; 119 import Vue from "vue";
120 import router from "../router"; 120 import router from "../router";
121 121
122 export default { 122 export default {
123 name: "ReadingFlowBounceBoard", 123 name: "ReadingFlowBounceBoard",
124 124
125 data() { 125 data() {
126 return {}; 126 return {};
127 }, 127 },
128 mounted() {}, 128 mounted() {},
129 methods: { 129 methods: {
130 goToLogin() { 130 goToLogin() {
131 this.$router.push("/"); 131 this.$router.push("/");
132 }, 132 },
133 goToSignUp() { 133 goToSignUp() {
134 this.$router.push("/signup"); 134 this.$router.push("/signup");
135 }, 135 },
136 136
137 }, 137 },
138 }; 138 };
139 </script> 139 </script>
140 140
src/components/ReadingFlowBounceBoard_chat.vue
1 <template>
2 <main class="landing-page">
3
4 <div class="container-fluid episode-intro">
5 <nav class="navbar navbar-expand-sm spotLight-nav">
6 <a class="navbar-brand" href="#"><img src="../assets/images/logo.png"></a>
7 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample03" aria-controls="navbarsExample03" aria-expanded="false" aria-label="Toggle navigation">
8 <span class="navbar-toggler-icon"></span>
9 <span class="navbar-toggler-icon"></span>
10 <span class="navbar-toggler-icon"></span>
11 </button>
12 <div class="user-profile-photo insights-profile">
13 <a href="#"><img src="../assets/images/user.png"></a>
14 </div>
15 </nav>
16 <!-- menu wrapper -->
17 <div class="intro-startup">
18 <div class="bounce-board-wrp">
19 <div class="inner-wrp-bc">
20 <div class="bc-top-head">
21 <span class="bc-head">
22 <img src="../assets/images/bounce-icon.svg" /> Bounce Board
23 </span>
24 <div class="action-sort">
25 <span class="sort-by">SORT BY</span> <div class="btn-group">
26 <button type="button" class="bc-sort-list dropdown-toggle" @click="best_sort" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
27 BEST
28 </button>
29 <div class="dropdown-menu short_by">
30 <a class="dropdown-item" href="#">BEST 1</a>
31 <a class="dropdown-item" href="#">BEST 2</a>
32 <a class="dropdown-item" href="#">BEST 3</a>
33 </div>
34 </div>
35 </div><!-- action sort -->
36 </div><!-- top head -->
37 <div class="bounce-board-body">
38 <ul class="bounced-user-comments">
39 <li class="bc_border">
40 <div class="lbord"></div><!-- border -->
41 <div class="parent-full-width parent_bg">
42 <div class="full-width">
43 <div class="b-user-head"><img src="../assets/images/b-user1.png" />
44 <span class="head-content">wanderingirl </span>
45 <ul>
46 <li> <span></span><img src="../assets/images/u-info-icon.png" />6pts</li>
47 <li> <span></span>3days ago</li>
48 <li> <span class="au">Author</span></li>
49 </ul>
50
51
52 </div><!-- header -->
53 <p>I wonder what the difference between โ€œDunzo Assistantโ€ and โ€œPickup and Dropโ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow...</p>
54 <div class="joined_wrapper">
55 <ul class="joined-info info_bc_spc">
56 <li> <img src="../assets/images/purple-heart.png"> </li>
57 <li> <a href="#"> 4</a> </li>
58 <li class="comment-spc"> <img src="../assets/images/purple-comment.png"> </li>
59 <li> <a href="#"> 6</a> </li>
60 </ul>
61 <div class="add_rply">
62 <input type="text" placeholder="Add your reply" />
63 </div><!-- rly form -->
64 </div><!-- joined wrapper -->
65 </div><!-- full width -->
66 </div><!-- parent -->
67 <div class="child-full-width">
68 <div class="full-width">
69 <div class="b-user-head"><img src="../assets/images/b-user1.png" />
70 <span class="head-content">Onenoisyboi </span>
71 <ul>
72 <li> <span></span><img src="../assets/images/u-info-icon.png" />6pts</li>
73 <li> <span></span>3days ago</li>
74 <li> <span class="red">Mod</span></li>
75 </ul>
76
77
78 </div><!-- header -->
79 <p>I really liked the palette of the icons dunzo has they dont match with my jeans</p>
80 <div class="joined_wrapper">
81 <ul class="joined-info info_bc_spc">
82 <li> <img src="../assets/images/purple-heart.png"> </li>
83 <li> <a href="#"> 4</a> </li>
84 <li class="comment-spc"> <img src="../assets/images/purple-comment.png"> </li>
85 <li> <a href="#"> 6</a> </li>
86 </ul>
87 <div class="add_rply">
88 <input type="text" placeholder="Add your reply" />
89 </div><!-- rly form -->
90 </div><!-- joined wrapper -->
91 </div><!-- full width -->
92 </div><!-- child wrapper -->
93 </li>
94
95 </ul><!-- all user comments -->
96 <ul class="bounced-user-comments">
97 <li class="bc_border">
98 <div class="bc_brd_l"></div><!-- border -->
99 <div class="parent-full-width ">
100 <div class="full-width">
101 <div class="b-user-head"><img src="../assets/images/b-user1.png" />
102 <span class="head-content">wanderingirl </span>
103 <ul>
104 <li> <span></span><img src="../assets/images/u-info-icon.png" />6pts</li>
105 <li> <span></span>3days ago</li>
106
107 </ul>
108
109
110 </div><!-- header -->
111 <p>I wonder what the difference between โ€œDunzo Assistantโ€ and โ€œPickup and Dropโ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow...</p>
112 <div class="joined_wrapper">
113 <ul class="joined-info info_bc_spc">
114 <li> <img src="../assets/images/purple-heart.png"> </li>
115 <li> <a href="#"> 4</a> </li>
116 <li class="comment-spc"> <img src="../assets/images/purple-comment.png"> </li>
117 <li> <a href="#"> 6</a> </li>
118 </ul>
119 <div class="add_rply">
120 <input type="text" placeholder="Add your reply" />
121 </div><!-- rly form -->
122 </div><!-- joined wrapper -->
123 </div><!-- full width -->
124 </div><!-- parent -->
125 <div class="child-full-width">
126 <div class="full-width">
127 <div class="b-user-head"><img src="../assets/images/b-user1.png" />
128 <span class="head-content">Onenoisyboi </span>
129 <ul>
130 <li> <span></span><img src="../assets/images/u-info-icon.png" />6pts</li>
131 <li> <span></span>3days ago</li>
132
133 </ul>
134
135
136 </div><!-- header -->
137 <p>I really liked the palette of the icons dunzo has they dont match with my jeans</p>
138 <div class="joined_wrapper">
139 <ul class="joined-info info_bc_spc">
140 <li> <img src="../assets/images/purple-heart.png"> </li>
141 <li> <a href="#"> 4</a> </li>
142 <li class="comment-spc"> <img src="../assets/images/purple-comment.png"> </li>
143 <li> <a href="#"> 6</a> </li>
144 </ul>
145 <div class="add_rply">
146 <input type="text" placeholder="Add your reply" />
147 </div><!-- rly form -->
148 </div><!-- joined wrapper -->
149 </div><!-- full width -->
150 </div><!-- child wrapper -->
151 <div class="child-full-width">
152 <div class="full-width">
153 <div class="b-user-head"><img src="../assets/images/b-user1.png" />
154 <span class="head-content">Onenoisyboi </span>
155 <ul>
156 <li> <span></span><img src="../assets/images/u-info-icon.png" />6pts</li>
157 <li> <span></span>3days ago</li>
158
159 </ul>
160
161
162 </div><!-- header -->
163 <p>I really liked the palette of the icons dunzo has they dont match with my jeans</p>
164 <div class="joined_wrapper">
165 <ul class="joined-info info_bc_spc">
166 <li> <img src="../assets/images/purple-heart.png"> </li>
167 <li> <a href="#"> 4</a> </li>
168 <li class="comment-spc"> <img src="../assets/images/purple-comment.png"> </li>
169 <li> <a href="#"> 6</a> </li>
170 </ul>
171 <div class="add_rply">
172 <input type="text" placeholder="Add your reply" />
173 </div><!-- rly form -->
174 </div><!-- joined wrapper -->
175 </div><!-- full width -->
176 </div><!-- child wrapper -->
177 </li>
178
179 </ul><!-- all user comments -->
180 </div><!-- bounce board body -->
181 <div class="comments-footer">
182 <textarea></textarea>
183 <div class="comments-footer-wrp">
184 <a href="#" class="add_comments_chat"><img src="../assets/images/add-comment.svg" /> Comment</a>
185 </div>
186 </div><!-- comments footer -->
187 </div>
188 </div><!-- bounceboard wrp -->
189 <div class="single-mobileInsight">
190 <img src="../assets/images/slide.png" class="slide-img" />
191 <div class="single-left-Insight-comments">
192 <img src="../assets/images/author-thoughts.svg" class="author-thoughts" />
193 <div class="single-author-li-comments">
194 <div class="a-intro-comments custom-c-style">
195 <p>I wonder what the difference between โ€œ <strong>Dunzo Assistant </strong>โ€ and โ€œ<strong>Pickup and Drop </strong>โ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow</p>
196 <ul class="rly-comment-set">
197 <li><img src="../assets/images/color-heart.svg" /> <a href="#">4</a></li>
198 <li><img src="../assets/images/rply.svg" /> <a href="#">Reply</a></li>
199 </ul>
200 </div><!-- comments box -->
201 </div><!-- single author comments -->
202 <div class="single-author-li-comments">
203 <div class="a-intro-comments custom-c-style">
204 <p>I wonder what the difference between โ€œ <strong>Dunzo Assistant </strong>โ€ and โ€œ<strong>Pickup and Drop </strong>โ€ are. If they are the same, there are two โ€œcall to actionsโ€ for the same workflow</p>
205 <ul class="rly-comment-set">
206 <li><img src="../assets/images/color-heart.svg" /> <a href="#">4</a></li>
207 <li><img src="../assets/images/rply.svg" /> <a href="#">Reply</a></li>
208 </ul>
209 </div><!-- comments box -->
210 </div><!-- single author comments -->
211 </div><!-- single mobile Left insight -->
212 <div class="c-product-insight-wrp ">
213 <div class="single-author-li-comments ">
214 <div class="a-intro-comments custom-selected-style">
215 <img src="../assets/images/rect.svg" class="rect" />
216 <div class="top-wrp">
217 PRODUCT Insight <a href="#"><img src="../assets/images/link-red.svg" /></a>
218 </div>
219 <div class="top-head">Decide on using multiple call to action vs single call to action depending on the stage of the user journey</div>
220 <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in the product.
221 <br><br>
222 When the user is already onboarded and is in the <strong> engage stage </strong>, it may be better to use a single CTA for each use case in order to <strong> avoid ambiguity.</strong>
223 </p>
224 <div class="footer">
225 <a href="#" class="cit-16">16 Citations</a>
226 <a href="#" class="ft-share"><img src="../assets/images/reply-red.svg" /> Share from library</a>
227 </div><!-- footer -->
228
229 </div><!-- comments box -->
230 </div><!-- single author comments -->
231
232 </div><!-- single mobile Right insight -->
233 </div><!-- Single Mobile Insight -->
234 <div class="footer-nav">
235 <div class="footer-top">
236 <div class="row">
237 <div class="col-6 col-sm-7 col-md-7 col-lg-6 ">
238 <div class="row h-100p">
239 <div class="col-4 col-sm-5 col-md-4 col-lg-4 col-xl-4">
240 <ul class="top-intro-bt">
241 <li><a href="#"><img src="../assets/images/skip-prev.svg"> Prev</a></li>
242 <li><a href="#"><img src="../assets/images/skip-next.svg"> Skip to the next slide</a></li>
243 </ul>
244 </div>
245
246 </div>
247 </div>
248 </div>
249 </div><!-- footer top -->
250 <div class="footer-bottom">
251 <ul>
252 <li class=""></li>
253 <li></li>
254 </ul>
255 </div><!-- footer top -->
256 </div><!-- footer -->
257
258 </div>
259 <!-- body wrapper -->
260 </div>
261 <!-- main wrapper -->
262 </main>
263 </template>
264
265 <script>
266 import Vue from "vue";
267 import router from "../router";
268
269 export default {
270 name: "ReadingFlowBounceBoard_chat",
271
272 data() {
273 return {};
274 },
275 mounted() {},
276 methods: {
277 goToLogin() {
278 this.$router.push("/");
279 },
280 goToSignUp() {
281 this.$router.push("/signup");
282 },
283 best_sort(){
284 $(".short_by").toggle();
285 },
286 },
287 };
288 </script>
289
src/router/index.js
1 import Vue from 'vue' 1 import Vue from 'vue'
2 import Router from 'vue-router' 2 import Router from 'vue-router'
3 import { authGuard } from "../auth/authGuard" 3 import { authGuard } from "../auth/authGuard"
4 import LandingPage from '@/components/LandingPage' 4 import LandingPage from '@/components/LandingPage'
5 import SignUp from '@/components/SignUp' 5 import SignUp from '@/components/SignUp'
6 import Reset from '@/components/Reset' 6 import Reset from '@/components/Reset'
7 import Profile from '@/components/Profile' 7 import Profile from '@/components/Profile'
8 import welcome from '@/components/welcome' 8 import welcome from '@/components/welcome'
9 import Intermediate from '@/components/Intermediate' 9 import Intermediate from '@/components/Intermediate'
10 import Insight from '@/components/Insight' 10 import Insight from '@/components/Insight'
11 import ProductInsight from '@/components/ProductInsight' 11 import ProductInsight from '@/components/ProductInsight'
12 import EpisodeIntro from '@/components/EpisodeIntro' 12 import EpisodeIntro from '@/components/EpisodeIntro'
13 import AuthorIntro from '@/components/AuthorIntro' 13 import AuthorIntro from '@/components/AuthorIntro'
14 import AuthorReadingNow from '@/components/AuthorReadingNow' 14 import AuthorReadingNow from '@/components/AuthorReadingNow'
15 import SingleAuthor from '@/components/SingleAuthor' 15 import SingleAuthor from '@/components/SingleAuthor'
16 import Outro from '@/components/Outro' 16 import Outro from '@/components/Outro'
17 import SingleMobileInsight from '@/components/SingleMobileInsight' 17 import SingleMobileInsight from '@/components/SingleMobileInsight'
18 import TwoScreenWithoutInsight from '@/components/TwoScreenWithoutInsight' 18 import TwoScreenWithoutInsight from '@/components/TwoScreenWithoutInsight'
19 import SingleMobileScreenInsightOne from '@/components/SingleMobileScreenInsightOne' 19 import SingleMobileScreenInsightOne from '@/components/SingleMobileScreenInsightOne'
20 import SingleWebScreenInsightOne from '@/components/SingleWebScreenInsightOne' 20 import SingleWebScreenInsightOne from '@/components/SingleWebScreenInsightOne'
21 import SingleScreengrabOneInsight from '@/components/SingleScreengrabOneInsight' 21 import SingleScreengrabOneInsight from '@/components/SingleScreengrabOneInsight'
22 import TwoScreenWithInsight from '@/components/TwoScreenWithInsight' 22 import TwoScreenWithInsight from '@/components/TwoScreenWithInsight'
23 import TwoScreengrabWithComments from '@/components/TwoScreengrabWithComments' 23 import TwoScreengrabWithComments from '@/components/TwoScreengrabWithComments'
24 import TwoWebScreenWithInsight from '@/components/TwoWebScreenWithInsight' 24 import TwoWebScreenWithInsight from '@/components/TwoWebScreenWithInsight'
25 import NoScreenshotSingleAuthor from '@/components/NoScreenshotSingleAuthor' 25 import NoScreenshotSingleAuthor from '@/components/NoScreenshotSingleAuthor'
26 import TwoAuthor from '@/components/TwoAuthor' 26 import TwoAuthor from '@/components/TwoAuthor'
27 import TwoAuthorDesktop from '@/components/TwoAuthorDesktop' 27 import TwoAuthorDesktop from '@/components/TwoAuthorDesktop'
28 import TwoAuthorReadingNow from '@/components/TwoAuthorReadingNow' 28 import TwoAuthorReadingNow from '@/components/TwoAuthorReadingNow'
29 import SingleMobileScreenChatComments from '@/components/SingleMobileScreenChatComments' 29 import SingleMobileScreenChatComments from '@/components/SingleMobileScreenChatComments'
30 import TwoScreensWithTwoAuthor from '@/components/TwoScreensWithTwoAuthor' 30 import TwoScreensWithTwoAuthor from '@/components/TwoScreensWithTwoAuthor'
31 import NoScreenshotTwoAuthor from '@/components/NoScreenshotTwoAuthor' 31 import NoScreenshotTwoAuthor from '@/components/NoScreenshotTwoAuthor'
32 import ToAddYourComment from '@/components/ToAddYourComment' 32 import ToAddYourComment from '@/components/ToAddYourComment'
33 import ReadingFlowBounceBoard from '@/components/ReadingFlowBounceBoard' 33 import ReadingFlowBounceBoard from '@/components/ReadingFlowBounceBoard'
34 import Otp from '@/components/Otp' 34 import ReadingFlowBounceBoard_chat from '@/components/ReadingFlowBounceBoard_chat'
35 import ChangePassword from '@/components/ChangePassword' 35 import Otp from '@/components/Otp'
36 36 import ChangePassword from '@/components/ChangePassword'
37 import router from '../router' 37
38 Vue.use(Router) 38 import router from '../router'
39 39 Vue.use(Router)
40 export default new Router({ 40
41 mode: 'history', 41 export default new Router({
42 routes: [{ 42 mode: 'history',
43 path: '/', 43 routes: [{
44 name: 'LandingPage', 44 path: '/',
45 component: LandingPage, 45 name: 'LandingPage',
46 // beforeEnter: function(to, from, next) { 46 component: LandingPage,
47 // var userdata = localStorage.getItem('spotlight_usertoken') 47 // beforeEnter: function(to, from, next) {
48 // if (userdata) { 48 // var userdata = localStorage.getItem('spotlight_usertoken')
49 // router.push({ name: 'Welcome' }) 49 // if (userdata) {
50 // } 50 // router.push({ name: 'Welcome' })
51 // next() 51 // }
52 // } 52 // next()
53 }, 53 // }
54 { 54 },
55 path: '/signup', 55 {
56 name: 'SignUp', 56 path: '/signup',
57 component: SignUp, 57 name: 'SignUp',
58 }, 58 component: SignUp,
59 { 59 },
60 path: '/intermediate', 60 {
61 name: 'Intermediate', 61 path: '/intermediate',
62 component: Intermediate 62 name: 'Intermediate',
63 }, 63 component: Intermediate
64 { 64 },
65 path: '/reset', 65 {
66 name: 'Reset', 66 path: '/reset',
67 component: Reset, 67 name: 'Reset',
68 }, 68 component: Reset,
69 { 69 },
70 path: '/profile', 70 {
71 name: 'Profile', 71 path: '/profile',
72 component: Profile, 72 name: 'Profile',
73 }, 73 component: Profile,
74 { 74 },
75 path: '/insight', 75 {
76 name: 'Insight', 76 path: '/insight',
77 component: Insight, 77 name: 'Insight',
78 }, 78 component: Insight,
79 { 79 },
80 path: '/product-insight', 80 {
81 name: 'ProductInsight', 81 path: '/product-insight',
82 component: ProductInsight, 82 name: 'ProductInsight',
83 }, 83 component: ProductInsight,
84 { 84 },
85 path: '/episode-intro', 85 {
86 name: 'EpisodeIntro', 86 path: '/episode-intro',
87 component: EpisodeIntro, 87 name: 'EpisodeIntro',
88 }, 88 component: EpisodeIntro,
89 , 89 },
90 { 90 ,
91 path: '/author-intro', 91 {
92 name: 'AuthorIntro', 92 path: '/author-intro',
93 component: AuthorIntro, 93 name: 'AuthorIntro',
94 }, 94 component: AuthorIntro,
95 { 95 },
96 path: '/author-reading-now', 96 {
97 name: 'AuthorReadingNow', 97 path: '/author-reading-now',
98 component: AuthorReadingNow, 98 name: 'AuthorReadingNow',
99 }, 99 component: AuthorReadingNow,
100 { 100 },
101 path: '/single-author', 101 {
102 name: 'SingleAuthor', 102 path: '/single-author',
103 component: SingleAuthor, 103 name: 'SingleAuthor',
104 }, 104 component: SingleAuthor,
105 { 105 },
106 path: '/outro', 106 {
107 name: 'Outro', 107 path: '/outro',
108 component: Outro, 108 name: 'Outro',
109 }, 109 component: Outro,
110 { 110 },
111 path: '/single-mobile-insight', 111 {
112 name: 'SingleMobileInsight', 112 path: '/single-mobile-insight',
113 component: SingleMobileInsight, 113 name: 'SingleMobileInsight',
114 }, 114 component: SingleMobileInsight,
115 { 115 },
116 path: '/two-screen-without-insight', 116 {
117 name: 'TwoScreenWithoutInsight', 117 path: '/two-screen-without-insight',
118 component: TwoScreenWithoutInsight, 118 name: 'TwoScreenWithoutInsight',
119 }, 119 component: TwoScreenWithoutInsight,
120 { 120 },
121 path: '/single-m-screen-insight-one', 121 {
122 name: 'SingleMobileScreenInsightOne', 122 path: '/single-m-screen-insight-one',
123 component: SingleMobileScreenInsightOne, 123 name: 'SingleMobileScreenInsightOne',
124 }, 124 component: SingleMobileScreenInsightOne,
125 { 125 },
126 path: '/single-web-screen-insight-one', 126 {
127 name: 'SingleWebScreenInsightOne', 127 path: '/single-web-screen-insight-one',
128 component: SingleWebScreenInsightOne, 128 name: 'SingleWebScreenInsightOne',
129 }, 129 component: SingleWebScreenInsightOne,
130 { 130 },
131 path: '/single-screengrab-one-insight', 131 {
132 name: 'SingleScreengrabOneInsight', 132 path: '/single-screengrab-one-insight',
133 component: SingleScreengrabOneInsight, 133 name: 'SingleScreengrabOneInsight',
134 }, 134 component: SingleScreengrabOneInsight,
135 { 135 },
136 path: '/two-screen-with-insight', 136 {
137 name: 'TwoScreenWithInsight', 137 path: '/two-screen-with-insight',
138 component: TwoScreenWithInsight, 138 name: 'TwoScreenWithInsight',
139 }, 139 component: TwoScreenWithInsight,
140 { 140 },
141 path: '/two-screengrab-with-comments', 141 {
142 name: 'TwoScreengrabWithComments', 142 path: '/two-screengrab-with-comments',
143 component: TwoScreengrabWithComments, 143 name: 'TwoScreengrabWithComments',
144 }, 144 component: TwoScreengrabWithComments,
145 { 145 },
146 path: '/two-webscreen-with-insight', 146 {
147 name: 'TwoWebScreenWithInsight', 147 path: '/two-webscreen-with-insight',
148 component: TwoWebScreenWithInsight, 148 name: 'TwoWebScreenWithInsight',
149 }, 149 component: TwoWebScreenWithInsight,
150 { 150 },
151 path: '/noscreenshot-single-author', 151 {
152 name: 'NoScreenshotSingleAuthor', 152 path: '/noscreenshot-single-author',
153 component: NoScreenshotSingleAuthor, 153 name: 'NoScreenshotSingleAuthor',
154 }, 154 component: NoScreenshotSingleAuthor,
155 { 155 },
156 path: '/two-author-intro', 156 {
157 name: 'TwoAuthor', 157 path: '/two-author-intro',
158 component: TwoAuthor, 158 name: 'TwoAuthor',
159 }, 159 component: TwoAuthor,
160 { 160 },
161 path: '/two-author-desktop', 161 {
162 name: 'TwoAuthorDesktop', 162 path: '/two-author-desktop',
163 component: TwoAuthorDesktop, 163 name: 'TwoAuthorDesktop',
164 }, 164 component: TwoAuthorDesktop,
165 { 165 },
166 path: '/two-author-reading-now', 166 {
167 name: 'TwoAuthorReadingNow', 167 path: '/two-author-reading-now',
168 component: TwoAuthorReadingNow, 168 name: 'TwoAuthorReadingNow',
169 }, 169 component: TwoAuthorReadingNow,
170 { 170 },
171 path: '/single-mobile-screen-chat-comments', 171 {
172 name: 'SingleMobileScreenChatComments', 172 path: '/single-mobile-screen-chat-comments',
173 component: SingleMobileScreenChatComments, 173 name: 'SingleMobileScreenChatComments',
174 }, 174 component: SingleMobileScreenChatComments,
175 { 175 },
176 path: '/two-screen-with-two-author', 176 {
177 name: 'TwoScreensWithTwoAuthor', 177 path: '/two-screen-with-two-author',
178 component: TwoScreensWithTwoAuthor, 178 name: 'TwoScreensWithTwoAuthor',
179 }, 179 component: TwoScreensWithTwoAuthor,
180 { 180 },
181 path: '/no-screenshot-two-author', 181 {
182 name: 'NoScreenshotTwoAuthor', 182 path: '/no-screenshot-two-author',
183 component: NoScreenshotTwoAuthor, 183 name: 'NoScreenshotTwoAuthor',
184 }, 184 component: NoScreenshotTwoAuthor,
185 { 185 },
186 path: '/to-add-your-comment', 186 {
187 name: 'ToAddYourComment', 187 path: '/to-add-your-comment',
188 component: ToAddYourComment, 188 name: 'ToAddYourComment',
189 }, 189 component: ToAddYourComment,
190 { 190 },
191 path: '/reading-flow-bounce-board', 191 {
192 name: 'ReadingFlowBounceBoard', 192 path: '/reading-flow-bounce-board',
193 component: ReadingFlowBounceBoard, 193 name: 'ReadingFlowBounceBoard',
194 }, 194 component: ReadingFlowBounceBoard,
195 { 195 },
196 path: '/otp/:flag', 196 {
197 name: 'Otp', 197 path: '/reading-flow-bounce-board-chat',
198 component: Otp, 198 name: 'ReadingFlowBounceBoard_chat',
199 }, 199 component: ReadingFlowBounceBoard_chat,
200 { 200 },
201 path: '/changepassword', 201 {
202 name: 'ChangePassword', 202 path: '/otp/:flag',
203 component: ChangePassword, 203 name: 'Otp',
204 } 204 component: Otp,
205 205 },
206 206 {
207 207 path: '/changepassword',
208 ], 208 name: 'ChangePassword',
209 scrollBehavior(to, from, savedPosition) { 209 component: ChangePassword,
210 this.seen = false 210 }
211 return { x: 0, y: 0 } 211
212 } 212
213
214 ],
215 scrollBehavior(to, from, savedPosition) {
216 this.seen = false
217 return { x: 0, y: 0 }
218 }
213 }) 219 })