-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
275 lines (275 loc) · 13.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
<!DOCTYPE html><!-- Last Published: Mon Jun 12 2023 12:36:30 GMT+0000 (Coordinated Universal Time) -->
<html data-wf-page="64480b1e1e4f0760aff14420" data-wf-site="64480b1d1e4f07f01af1441c" lang="de">
<head>
<meta charset="utf-8">
<title>Teala Turner</title>
<meta content="width=device-width, initial-scale=1" name="viewport">
<link href="css/normalize.css" rel="stylesheet" type="text/css">
<link href="css/webflow.css" rel="stylesheet" type="text/css">
<link href="css/teala-turner.webflow.css" rel="stylesheet" type="text/css">
<script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script>
<link href="images/favicon.svg" rel="shortcut icon" type="image/x-icon">
<link href="images/webclip.svg" rel="apple-touch-icon">
</head>
<body>
<div class="global-styles w-embed">
<style>
/* Make text look crisper and more legible in all browsers */
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
/* Focus state style for keyboard navigation for the focusable elements */
*[tabindex]:focus-visible,
input[type="file"]:focus-visible {
outline: 0.125rem solid #4d65ff;
outline-offset: 0.125rem;
}
/* Get rid of top margin on first element in any rich text element */
.w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child {
margin-top: 0 !important;
}
/* Get rid of bottom margin on last element in any rich text element */
.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {
margin-bottom: 0 !important;
}
/* Prevent all click and hover interaction with an element */
.pointer-events-off {
pointer-events: none;
}
/* Enables all click and hover interaction with an element */
.pointer-events-on {
pointer-events: auto;
}
/* Create a class of .div-square which maintains a 1:1 dimension of a div */
.div-square::after {
content: "";
display: block;
padding-bottom: 100%;
}
/* Make sure containers never lose their center alignment */
.container-medium,.container-small, .container-large {
margin-right: auto !important;
margin-left: auto !important;
}
/*
Make the following elements inherit typography styles from the parent and not have hardcoded values.
Important: You will not be able to style for example "All Links" in Designer with this CSS applied.
Uncomment this CSS to use it in the project. Leave this message for future hand-off.
*/
/*
a,
.w-input,
.w-select,
.w-tab-link,
.w-nav-link,
.w-dropdown-btn,
.w-dropdown-toggle,
.w-dropdown-link {
color: inherit;
text-decoration: inherit;
font-size: inherit;
}
*/
/* Apply "..." after 3 lines of text */
.text-style-3lines {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
/* Apply "..." after 2 lines of text */
.text-style-2lines {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
/* Adds inline flex display */
.display-inlineflex {
display: inline-flex;
}
/* These classes are never overwritten */
.hide {
display: none !important;
}
@media screen and (max-width: 991px) {
.hide, .hide-tablet {
display: none !important;
}
}
@media screen and (max-width: 767px) {
.hide-mobile-landscape{
display: none !important;
}
}
@media screen and (max-width: 479px) {
.hide-mobile{
display: none !important;
}
}
.margin-0 {
margin: 0rem !important;
}
.padding-0 {
padding: 0rem !important;
}
.spacing-clean {
padding: 0rem !important;
margin: 0rem !important;
}
.margin-top {
margin-right: 0rem !important;
margin-bottom: 0rem !important;
margin-left: 0rem !important;
}
.padding-top {
padding-right: 0rem !important;
padding-bottom: 0rem !important;
padding-left: 0rem !important;
}
.margin-right {
margin-top: 0rem !important;
margin-bottom: 0rem !important;
margin-left: 0rem !important;
}
.padding-right {
padding-top: 0rem !important;
padding-bottom: 0rem !important;
padding-left: 0rem !important;
}
.margin-bottom {
margin-top: 0rem !important;
margin-right: 0rem !important;
margin-left: 0rem !important;
}
.padding-bottom {
padding-top: 0rem !important;
padding-right: 0rem !important;
padding-left: 0rem !important;
}
.margin-left {
margin-top: 0rem !important;
margin-right: 0rem !important;
margin-bottom: 0rem !important;
}
.padding-left {
padding-top: 0rem !important;
padding-right: 0rem !important;
padding-bottom: 0rem !important;
}
.margin-horizontal {
margin-top: 0rem !important;
margin-bottom: 0rem !important;
}
.padding-horizontal {
padding-top: 0rem !important;
padding-bottom: 0rem !important;
}
.margin-vertical {
margin-right: 0rem !important;
margin-left: 0rem !important;
}
.padding-vertical {
padding-right: 0rem !important;
padding-left: 0rem !important;
}
</style>
</div>
<div data-animation="default" data-collapse="small" data-duration="400" data-easing="ease" data-easing2="ease" role="banner" class="navbar w-nav">
<div class="padding-global">
<div class="container-xlarge">
<div class="nav_wrapper"><img src="images/teal_navigation-background.svg" loading="lazy" alt="" class="nav_background">
<a href="index.html" aria-current="page" class="nav_brand w-nav-brand w--current">
<div class="nav_brand_text">Teala Turner</div>
</a>
<nav role="navigation" class="nav_menu w-nav-menu">
<a href="#https://twitter.com/TealaTurner" target="_blank" class="nav_menu_link is-twitter w-inline-block">
<div class="nav_menu_link_twitter_wrapper"><img src="images/teal_twitter-icon.svg" loading="lazy" alt="" class="nav_twitter-icon">
<div class="nav_menu_link_twitter_text">Twitter</div>
</div>
</a>
<a href="kontakt.html" class="nav_menu_link is-contact w-inline-block">
<div class="nav_menu_link_kontakt_wrapper"><img src="images/teal_mail-icon.svg" loading="lazy" alt="" class="nav_mail-icon">
<div class="nav_menu_link_kontakt_text">Kontakt</div>
</div>
</a>
</nav>
<div class="menu_button w-nav-button">
<div class="menu_icon">Menü</div>
</div>
</div>
</div>
</div>
</div>
<div class="background-bubbles"><img src="images/background_bobble-left.svg" loading="lazy" data-w-id="20dd95de-d23c-a7fa-556d-9d1ce62a190b" alt="" class="background_bubble-left"><img src="images/background_bobble-right.svg" loading="lazy" alt="" class="background_bubble-right"><img src="images/background_bobble-middle.svg" loading="lazy" data-w-id="20dd95de-d23c-a7fa-556d-9d1ce62a190d" alt="" class="background_bubble-middle"></div>
<main class="page-wrapper">
<div class="main-wrapper">
<div class="padding-global">
<section class="section_homepage">
<div class="container-large">
<article class="section_homepage-grid">
<div id="w-node-_04de7f64-3f99-4116-01d2-52977c098919-aff14420" class="section_homepage_grid-left">
<figure class="section_homepage_image_wrapper"><img src="images/teala_image.png" loading="lazy" sizes="(max-width: 479px) 33vw, (max-width: 767px) 160px, (max-width: 991px) 31vw, 303.9875183105469px" srcset="images/teala_image-p-500.png 500w, images/teala_image.png 600w" alt="Eine Illustration von Teala, der Person hinter dieser Seite." class="section_homepage_image">
<div class="heading-style-h4">Das bin ich - die blauen Haare sind mir angeboren<br></div>
</figure>
<div class="padding-bottom padding-large"></div>
<h2 class="subheading">Hallo Du!<br></h2>
<div class="padding-bottom padding-medium"></div>
<div class="text-size-medium">Herzlich willkommen auf meiner Seite!</div>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-medium"><em class="text-paragraph-part">Ich bin Teala und meine Mission auf dieser Seite ist es, über </em><strong class="text-paragraph-part"><em class="text-weight-bold">Teal</em></strong><em class="text-paragraph-part"> und andere Themen der </em><strong class="text-paragraph-part"><em class="text-weight-bold">New Work</em></strong><em class="text-paragraph-part"> zu berichten. Das möchte ich so tun, dass sich jede*r daran orientieren kann - egal, ob man schon lange auf der Reise ist oder gerade erst aufbrechen möchte.<br></em></p>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-medium"><em class="text-paragraph-part">Neben dieser wichtigen Mission spiele ich außerdem ein bisschen Spion auf der Arbeit und werde Euch Einblicke geben, was sich bei </em>
<a href="https://www.gebruederheitz.de/" target="_blank" class="text-paragraph-part"><strong class="text-paragraph-part"><em class="text-style-link is-black">/gebrüderheitz</em></strong></a><em class="text-paragraph-part"> und natürlich auch auf deren Teal-Reise so tut! </em>
</p>
</div>
<div id="w-node-_64dbdb2a-bd1c-8cb3-a067-7c71c7f83911-aff14420" class="section_homepage_grid-right">
<h1 class="contactpage_heading">Hier geht's weiter mit Teal und New Work!</h1>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-medium">Hier ein kleiner Wegweiser zu einigen Teal-Themen (und natürlich auch zu mir) auf meiner Seite. Klick Dich rein und lass mich danach gerne wissen, was Du dazu denkst!</p>
<div class="padding-bottom padding-medium"></div>
<h2 class="subheading">Was genau ist Teal?<br></h2>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-regular">Wenn Dir Teal und die ganze Geschichte mit Frederic Laloux' <em class="text-paragraph-part">Reinventing Organizations</em> noch nicht so viel sagt, bist du <a href="https://www.reinventingorganizations.com/" target="_blank" class="text-paragraph-part"><strong class="text-style-link is-black">hier</strong></a> genau richtig!</p>
<div class="padding-bottom padding-medium"></div>
<h2 class="subheading">Wo finde ich mehr Infos zu Teal und New Work?<br></h2>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-regular">Sehr gute Frage! Dafür habe ich Dir eine kleine Literatursammlung zusammengestellt mit Büchern, Podcasts, Blogs, ... Schau mal <a href="literatursammlung.html" class="text-paragraph-part"><strong class="text-style-link is-black">hier</strong></a> rein!</p>
<div class="padding-bottom padding-medium"></div>
<h2 class="subheading">Wer bist Du überhaupt?<br></h2>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-regular">Ich bin Teala, arbeite für die Webagentur <a href="https://www.gebruederheitz.de/" target="_blank" class="text-paragraph-part"><strong class="text-style-link is-black">/gebrüderheitz</strong></a> und mag Teal. :) Mehr zu mir findest du <a href="uber-teala-turner.html" class="text-paragraph-part"><strong class="text-style-link is-black">hier</strong></a>!</p>
<div class="padding-bottom padding-medium"></div>
<h2 class="subheading">Und was ist die Geschichte mit /gebrüderheitz?<br></h2>
<div class="padding-bottom padding-medium"></div>
<p class="text-size-regular">Unsere Hintergrundgeschichte und wie es zu dieser Seite gekommen ist, kannst du <a href="https://teala-turner.de/teala-und-/gh" class="text-paragraph-part"><strong class="text-style-link is-black">hier</strong></a> nachlesen.</p>
</div>
</article>
</div>
</section>
<div class="padding-bottom padding-large"></div>
<footer class="section-footer">
<div class="container-xlarge">
<div class="footer_wrapper">
<div class="footer_family-link">
<div class="footer_text">Ich bin ein Teil der </div>
<a href="https://www.gebruederheitz.de/" target="_blank" class="footer_text">/gebrüderheitz-Familie.</a>
</div>
<div class="footer_impressum-link">
<a href="https://www.gebruederheitz.de/impressum" target="_blank" class="footer_text">Impressum</a>
<div class="footer_text">/</div>
<a href="https://www.gebruederheitz.de/datenschutzerklaerung" target="_blank" class="footer_text">Datenschutz</a>
</div>
</div>
</div>
</footer>
</div>
</div>
</main>
<script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=64480b1d1e4f07f01af1441c" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="js/webflow.js" type="text/javascript"></script>
</body>
</html>