-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
585 lines (521 loc) · 25.1 KB
/
index.html
File metadata and controls
585 lines (521 loc) · 25.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Transitions Guide: 15 Mindset Shifts & Actions for Navigating Change</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
line-height: 1.6;
color: #333;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
min-height: 100vh;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 40px 20px;
background: white;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
border-radius: 10px;
margin-top: 20px;
margin-bottom: 40px;
}
.header {
text-align: center;
margin-bottom: 50px;
padding-bottom: 30px;
border-bottom: 3px solid #e8f4f8;
position: relative;
}
.brand-header {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 30px;
gap: 15px;
}
.logo {
width: 40px;
height: 40px;
background: #1e3a8a;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
color: white;
font-size: 16px;
}
.brand-text {
font-size: 1.1em;
color: #1e3a8a;
font-weight: 600;
}
.title {
font-size: 2.5em;
color: #2c3e50;
margin-bottom: 15px;
font-weight: 300;
}
.subtitle {
font-size: 1.2em;
color: #7f8c8d;
font-style: italic;
margin-bottom: 20px;
}
.intro {
font-size: 1.1em;
color: #34495e;
text-align: center;
max-width: 600px;
margin: 0 auto;
padding: 20px;
background: #f8f9fa;
border-radius: 8px;
border-left: 4px solid #3498db;
}
.section {
margin-bottom: 50px;
}
.section-header {
display: flex;
align-items: center;
margin-bottom: 25px;
padding-bottom: 15px;
border-bottom: 2px solid #ecf0f1;
}
.section-icon {
font-size: 2em;
margin-right: 15px;
}
.section-title {
font-size: 1.8em;
color: #2c3e50;
font-weight: 400;
}
.section-overview {
font-size: 1.1em;
color: #5d6d7e;
margin-bottom: 30px;
padding: 15px;
background: #f7f9fc;
border-radius: 6px;
border-left: 3px solid #3498db;
}
.item {
margin-bottom: 35px;
padding: 25px;
background: #fdfdfd;
border-radius: 8px;
border: 1px solid #e8e8e8;
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.item-number {
display: inline-block;
width: 30px;
height: 30px;
background: #3498db;
color: white;
text-align: center;
line-height: 30px;
border-radius: 50%;
font-weight: bold;
margin-bottom: 15px;
}
.item-title {
font-size: 1.3em;
color: #2c3e50;
margin-bottom: 15px;
font-weight: 500;
}
.mindset-shift {
font-size: 1.1em;
color: #34495e;
margin-bottom: 20px;
padding: 15px;
background: #eef7ff;
border-radius: 6px;
border-left: 4px solid #3498db;
}
.action-insight {
background: #e8f8f5;
padding: 20px;
border-radius: 8px;
border-left: 4px solid #27ae60;
margin-top: 15px;
}
.action-label {
font-weight: bold;
color: #27ae60;
margin-bottom: 8px;
font-size: 1.1em;
}
.action-text {
color: #2c3e50;
font-size: 1.05em;
}
.quote-highlight {
font-style: italic;
color: #7f8c8d;
font-size: 1.05em;
margin-bottom: 10px;
}
.closing {
text-align: center;
margin-top: 60px;
padding: 40px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 10px;
}
.closing h2 {
font-size: 2em;
margin-bottom: 20px;
font-weight: 300;
}
.closing p {
font-size: 1.2em;
line-height: 1.8;
max-width: 600px;
margin: 0 auto;
}
.divider {
text-align: center;
margin: 40px 0;
font-size: 1.5em;
color: #bdc3c7;
}
.footer {
text-align: center;
margin-top: 40px;
padding-top: 30px;
border-top: 2px solid #ecf0f1;
color: #7f8c8d;
font-size: 0.9em;
}
@media print {
body {
background: white !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
.container {
box-shadow: none !important;
margin: 0 !important;
padding: 20px !important;
}
.section {
page-break-inside: avoid;
break-inside: avoid;
}
.section-header {
page-break-after: avoid;
break-after: avoid;
}
.item {
page-break-inside: avoid;
break-inside: avoid;
margin-bottom: 25px !important;
}
.item-number {
background: #3498db !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
.closing {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
page-break-before: always !important;
break-before: always !important;
}
.mindset-shift {
background: #eef7ff !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
.action-insight {
background: #e8f8f5 !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
}
@media (max-width: 768px) {
.container {
margin: 10px;
padding: 20px;
}
.title {
font-size: 2em;
}
.section-header {
flex-direction: column;
text-align: center;
}
.section-icon {
margin-right: 0;
margin-bottom: 10px;
}
}
</style>
</head>
<body>
<div class="container">
<div class="header">
<div class="brand-header">
<div class="logo">mP</div>
<div class="brand-text">mPath Services</div>
</div>
<h1 class="title">Transitions Guide</h1>
<p class="subtitle">15 Mindset Shifts & Actions for Navigating Change</p>
<div class="intro">
<p>Change is the only constant in life, yet navigating it with grace and intention is a skill we can develop. This guide offers practical wisdom distilled from moments of reflection—each insight paired with an actionable step you can take today. Whether you're facing a major life transition or simply seeking to grow, these mindset shifts will help you move forward with confidence and clarity.</p>
</div>
</div>
<!-- Section 1: Mindset & Self-Talk -->
<div class="section">
<div class="section-header">
<div class="section-icon">💬</div>
<h2 class="section-title">Mindset & Self-Talk</h2>
</div>
<div class="section-overview">
The voice in your head is your most constant companion. How you speak to yourself shapes not only your internal world but how you show up in the external one. These insights focus on transforming your inner dialogue into a source of strength and encouragement.
</div>
<div class="item">
<div class="item-number">1</div>
<h3 class="item-title">Who's Winning—Your Inner Critic or Inner Cheerleader?</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Your inner voice has tremendous power to either propel you forward or hold you back. The key is recognizing that you have a choice in which voice gets to be loudest—and then intentionally amplifying the one that serves you.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Build inner encouragement with intention — you become what you repeatedly tell yourself.</div>
</div>
</div>
<div class="item">
<div class="item-number">2</div>
<h3 class="item-title">Your Words Shape Your World</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> The relationship you have with yourself sets the template for all other relationships. When you speak to yourself with respect and kindness, you signal to others how you expect to be treated, creating a ripple effect in all your interactions.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Choose your inner dialogue with care; it sets the tone for how others perceive and treat you.</div>
</div>
</div>
</div>
<!-- Section 2: Growth & Learning -->
<div class="section">
<div class="section-header">
<div class="section-icon">🧗♀️</div>
<h2 class="section-title">Growth & Learning</h2>
</div>
<div class="section-overview">
Growth requires courage—the courage to be imperfect, to try new things, and to embrace the discomfort that comes with expansion. These mindset shifts help you reframe challenges as opportunities and view mistakes as stepping stones rather than roadblocks.
</div>
<div class="item">
<div class="item-number">3</div>
<h3 class="item-title">The Courage to Be a Beginner</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Excellence is born from a willingness to be terrible at something first. Every expert was once a beginner who had the courage to start badly and improve gradually. Embracing the beginner's mindset opens doors to endless possibilities.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Give yourself permission to be a beginner. Mastery only follows humility.</div>
</div>
</div>
<div class="item">
<div class="item-number">4</div>
<h3 class="item-title">Regret or Mistakes—Which Would You Rather Live With?</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Mistakes are evidence of trying, learning, and growing. They're temporary setbacks that teach valuable lessons. Regret, however, is the permanent ache of opportunities not taken and dreams not pursued. One leads to wisdom; the other to wonder about what might have been.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Make the move. It's better to trip forward than to stay frozen in fear.</div>
</div>
</div>
</div>
<!-- Section 3: Perspective & Mindfulness -->
<div class="section">
<div class="section-header">
<div class="section-icon">🧘♀️</div>
<h2 class="section-title">Perspective & Mindfulness</h2>
</div>
<div class="section-overview">
How we see situations determines how we respond to them. These insights focus on cultivating clarity through stillness and learning to consciously choose the lens through which we view our experiences, transforming challenges into opportunities for growth.
</div>
<div class="item">
<div class="item-number">5</div>
<h3 class="item-title">Finding Clarity in Stillness</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> In our busy, noisy world, we often seek answers through more action and information. But true clarity comes from the opposite direction—from creating space for quiet reflection. Like muddy water that clears when left undisturbed, our minds reveal their wisdom when we give them permission to be still.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Stillness is strength. Quiet moments hold answers you've been chasing loudly.</div>
</div>
</div>
<div class="item">
<div class="item-number">6</div>
<h3 class="item-title">The Perspective Paintbrush</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> While we can't control what happens to us, we have complete control over how we interpret and respond to events. Your perspective is a creative tool that can transform any situation from a problem into a possibility, from an ending into a beginning.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Reframe your story. You can't control the canvas, but you can choose your palette.</div>
</div>
</div>
</div>
<!-- Section 4: Effort & Showing Up -->
<div class="section">
<div class="section-header">
<div class="section-icon">🚶♀️</div>
<h2 class="section-title">Effort & Showing Up</h2>
</div>
<div class="section-overview">
Success isn't about perfection—it's about persistence. These mindset shifts help you understand that showing up consistently, even when you don't feel ready, is often the difference between dreams and reality. Your effort is always within your control.
</div>
<div class="item">
<div class="item-number">7</div>
<h3 class="item-title">Just Show Up (Yes, Even When You Don't Want To)</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> The gap between intention and action is where most dreams die. But here's the secret: you don't need to feel ready, motivated, or perfect to begin. You just need to show up. Momentum builds from movement, not from waiting for the right moment.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Be consistent, not perfect. Success often starts with simply being present.</div>
</div>
</div>
<div class="item">
<div class="item-number">8</div>
<h3 class="item-title">When Effort Is All You've Got — That's Enough</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Outcomes are influenced by countless factors beyond your control, but your effort is entirely yours. When you focus on giving your best rather than achieving specific results, you free yourself from the anxiety of what you can't control and find peace in what you can.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Focus on what's in your hands. Let go of results and honor your input.</div>
</div>
</div>
</div>
<!-- Section 5: Personal Growth & Change -->
<div class="section">
<div class="section-header">
<div class="section-icon">🌱</div>
<h2 class="section-title">Personal Growth & Change</h2>
</div>
<div class="section-overview">
True transformation happens from the inside out. These insights focus on self-acceptance, letting go of what no longer serves you, and embracing the ongoing process of becoming who you're meant to be. Growth isn't about perfection—it's about progress and self-compassion.
</div>
<div class="item">
<div class="item-number">9</div>
<h3 class="item-title">Catching Up with Yourself</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> In the rush to meet external demands and expectations, we often lose touch with our own needs, dreams, and well-being. Regular self-connection isn't selfish—it's essential. You can't pour from an empty cup or navigate change without knowing where you currently stand.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Check in with yourself. You deserve to be part of your own to-do list.</div>
</div>
</div>
<div class="item">
<div class="item-number">10</div>
<h3 class="item-title">The Magic of Acceptance</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Fighting against parts of yourself creates internal conflict and wastes valuable energy. Acceptance doesn't mean resignation—it means acknowledging all aspects of who you are with compassion, which paradoxically creates space for positive change and growth.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Embrace your whole self — not just the polished parts.</div>
</div>
</div>
<div class="item">
<div class="item-number">11</div>
<h3 class="item-title">Weed Out Doubt, Plant Belief</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Your mind is like a garden—whatever you consistently nurture will flourish. Doubt, fear, and negative self-talk are weeds that choke out possibility. Belief, hope, and positive thinking are seeds that, when tended regularly, bloom into reality.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Tend to your mental environment. What you water will grow.</div>
</div>
</div>
<div class="item">
<div class="item-number">12</div>
<h3 class="item-title">A New Day, A New Chance</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Transformation doesn't require dramatic overhauls or perfect conditions. Each day offers a fresh opportunity to make slightly better choices, to be a little kinder to yourself, or to take one small step toward your goals. Small, consistent improvements compound into remarkable change.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">You don't need a grand reinvention — just a 1% upgrade.</div>
</div>
</div>
<div class="item">
<div class="item-number">13</div>
<h3 class="item-title">The Art of Letting Go</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Life isn't just about acquiring and accumulating—it's also about releasing and creating space. Letting go of outdated beliefs, toxic relationships, or unfulfilling commitments isn't loss; it's liberation. You make room for what truly matters when you release what doesn't.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Letting go is a gift. Make room for what you truly want.</div>
</div>
</div>
</div>
<!-- Section 6: Milestones & Momentum -->
<div class="section">
<div class="section-header">
<div class="section-icon">🪩</div>
<h2 class="section-title">Milestones & Momentum</h2>
</div>
<div class="section-overview">
Celebrating progress and taking meaningful action are essential parts of any transformation journey. These insights remind us to acknowledge how far we've come while having the courage to keep moving forward into new possibilities.
</div>
<div class="item">
<div class="item-number">14</div>
<h3 class="item-title">Celebrating Your Journey</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> Progress is often invisible until we pause to look back and see how far we've traveled. Celebrating milestones—whether big or small—isn't about ego; it's about acknowledging the consistency, creativity, and courage it took to get there. Recognition fuels further growth.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Honor your consistency and creative spirit. Every step forward deserves recognition.</div>
</div>
</div>
<div class="item">
<div class="item-number">15</div>
<h3 class="item-title">Taking the Leap</h3>
<div class="mindset-shift">
<strong>The Shift:</strong> There comes a moment when all the planning, preparing, and thinking must give way to doing. True transformation happens when we stop being spectators of our own lives and start participating fully. The leap isn't about having all the answers—it's about trusting yourself to figure them out as you go.
</div>
<div class="action-insight">
<div class="action-label">✨ Try This:</div>
<div class="action-text">Practice what you preach. Take the leap you've been encouraging others to take.</div>
</div>
</div>
</div>
<div class="divider">✦ ✦ ✦</div>
<div class="closing">
<h2>Embrace the Journey</h2>
<p>Change isn't something that happens to you—it's something you actively participate in. Every transition, whether chosen or unexpected, offers an opportunity to discover new strengths, develop greater resilience, and align more closely with who you're becoming.</p>
<br>
<p>Remember: You don't need to be perfect to start, but you do need to start to discover your perfection. Trust the process, be patient with yourself, and celebrate every step forward, no matter how small.</p>
<br>
<p><strong>Your transformation begins with your next choice. What will it be?</strong></p>
</div>
<div class="footer">
<p>© 2025 mPath Services. All rights reserved.</p>
</div>
</div>
</body>
</html>