PageSourceSearch

https://portfolio-sh23.webflow.io/about

html portfolio-sh23.webflow.io collected 2026-10-03 13:36:43 UTC 55,604 bytes, 499 lines download raw bytes

1<!DOCTYPE html><!-- Last Published: Sun Dec 10 2023 22:09:32 GMT+0000 (Coordinated Universal Time) --><html data-wf-domain="portfolio-sh23.webflow.io" data-wf-page="64afe45a2daaf57d982d6f66" data-wf-site="64653ddbdd2b114ca9c5d299" lang="de"><head><meta charset="utf-8"/><link href="https://assets-global.website-files.com" rel="preconnect" crossorigin="anonymous"/><title>About Steffen Hirth, UI/UX Designer &amp; Webflow Expert.</title><link rel="alternate" hrefLang="x-default" href="https://portfolio-sh23.webflow.io/about"/><link rel="alternate" hrefLang="de" href="https://portfolio-sh23.webflow.io/about"/><link rel="alternate" hrefLang="en" href="https://portfolio-sh23.webflow.io/en/about"/><meta content="A german digital designer and Webflow professional partner with a skill set that ranges from conceptual thinking to creating and developing high-quality designs." name="description"/><meta content="About Steffen Hirth, UI/UX Designer &amp; Webflow Expert." property="og:title"/><meta content="A german digital designer and Webflow professional partner with a skill set that ranges from conceptual thinking to creating and developing high-quality designs." property="og:description"/><meta content="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/649f0cb1eeff5a9fa315d4a6_Open%20Graph%20Image%402x.png" property="og:image"/><meta content="About Steffen Hirth, UI/UX Designer &amp; Webflow Expert." name="twitter:title"/><meta content="A german digital designer and Webflow professional partner with a skill set that ranges from conceptual thinking to creating and developing high-quality designs." name="twitter:description"/><meta content="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/649f0cb1eeff5a9fa315d4a6_Open%20Graph%20Image%402x.png" name="twitter:image"/><meta property="og:type" content="website"/><meta content="summary_large_image" name="twitter:card"/><meta content="width=device-width, initial-scale=1" name="viewport"/><link href="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/css/portfolio-sh23.21445c631.min.css" rel="stylesheet" type="text/css"/><style>@media (max-width:479px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="f6398f08-e114-37a7-1d95-d2526dc8ed56"] {height:3.7rem;}}</style>
1<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>
1<link href="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/6491e04513fcd6b8e5387733_32.png" rel="shortcut icon" type="image/x-icon"/><link href="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/6491e04a52ac2b535a9f35cd_256.png" rel="apple-touch-icon"/><style>
2* {
3  -webkit-font-smoothing: antialiased;
4}
5
6.menu_link {
7	pointer-events: none;  
8}
9  
10.fixed {
11  position: fixed;
12  top: 0;
13  left: 0;
14}
15  
16.active-flip-item {z-index: 2;}
17  
18</style>
19
20<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
21<script async src="https://cdn.splitbee.io/sb.js"></script>
21<!-- [Cards Stacking Animation -->
22<style>
23	.card-container-inner {
24  	position: relative;
25  }
26  
27  .card-container-inner .card {
28  	left: 0;
29  	position: absolute;
30    top: 0;
31    -webkit-transition: 0.3s;
32    transition: 0.3s;
33    -webkit-transform-origin: top;
34    transform-origin: top;
35  }
36  
37  .card-container-inner .card:nth-child(1) {
38  	position: relative;
39    z-index: 10;
40    -webkit-transform: translateY(0px) scale(1);
41    transform: scale(1);
42    opacity: 1;
43  }
44  
45  .card-container-inner .card:nth-child(2) {
46  	position: absolute;
47    transform: translateY(-15px) scale(0.97);
48    z-index: 9;
49    opacity: 0.8;
50  }
51  
52  .card-container-inner .card:nth-child(3) {
53  	position: absolute;
54    transform: translateY(-30px) scale(0.94);
55    z-index: 8;
56    opacity: 0.6;
57  }
58  
59  .card-container-inner .card:nth-child(4) {
60  	position: absolute;
61    transform: translateY(-45px) scale(0.91);
62    z-index: 7;
63    opacity: 0.4;
64  }
65  
66  .card-container-inner .card:nth-child(5) {
67  	position: absolute;
68    transform: translateY(-60px) scale(0.88);
69    z-index: 6;
70    opacity: 0.2;
71  }
72</style></head><body><div class="page-content"><div class="page-wrapper"><div class="global-styles w-embed"><style>
73
74/* START: Font size settings (customize them at https://wizardry-technique.webflow.io/)*/
75body {
76 font-size: 1.1111111111111112vw;
77}
78
79/* Select Color */
80::selection {color: #ec5c29; background: #202126;}
81
82/* Max Font Size */
83@media screen and (min-width:1440px) {
84 body {font-size: 16px;}
85}
86/* Container Max Width */
87.container {
88  max-width: 1440px;
89}
90/* Min Font Size */
91@media screen and (max-width:991px) {
92 body {font-size: 11.011111111111111px;}
93}
94/* END: Font size settings */
95
96
97.dsg-table>:last-child {
98	border-bottom: 0px;
99}
100
101/* Prevents hover states and clicks on elements */
102.non-clickable {
103	pointer-events: none;
104}
105
106/* Enables hover states and clicks on elements */
107.clickable {
108  pointer-events: auto;
109}
110
111/* Aspect ratios for image wrappers */
112.aspect-ratio-1-1 {
113	aspect-ratio:  1 / 1;
114}
115.aspect-ratio-2-1 {
116	aspect-ratio:  2 / 1;
117}
118.aspect-ratio-4-3 {
119	aspect-ratio:  4 / 3;
120}
121.aspect-ratio-16-9 {
122	aspect-ratio:  16 / 9;
123}
124.aspect-ratio-3-4 {
125	aspect-ratio:  3 / 4;
126}
127
128/* Reset for links and buttons */
129a {
130	color: inherit;
131	text-decoration: inherit;
132	font-size: inherit;
133}
134
135/* Removes top margin on first element in rich text fields*/
136.w-richtext>:first-child {
137	margin-top: 0;
138}
139
140/* Removes bottom margin on last element in rich text fields*/
141.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {
142	margin-bottom: 0;
143}
144
145/*Cuts text off after 3 lines and adds "..." */
146.is-txt-cut-3lines {
147	overflow: hidden;
148	display: -webkit-box;
149  -webkit-box-orient: vertical;
150	-webkit-line-clamp: 3;
151}
152
153/*Cuts text off after 2 lines and adds "..." */
154.is-txt-cut-2lines {
155	overflow: hidden;
156	display: -webkit-box;
157  -webkit-box-orient: vertical;
158	-webkit-line-clamp: 2;
159}
160
161select {
162    appearance: none !important;
163    -webkit-appearance: none !important;
164    -moz-appearance: none !important;
165  }
166
167.project_link {
168	isolation: isolate;
169}
170
171</style></div><div id="w-node-_9a9dbff4-3152-b2dd-7c55-40245d26fae2-5d26fae2" data-animation="default" data-collapse="medium" data-duration="400" data-easing="ease" data-easing2="ease" role="banner" class="dsg-navbar w-nav"><div class="container-col-12 w-container"><div class="dsg-nav_wrapper"><a href="/" class="dsg-brand-link w-nav-brand"><div class="logo-bar"><div class="logo-txt">Steffen Hirth</div></div><div class="rotate-wrap"><div class="rotatingtext">UI/UX Designer</div><div class="rotatingtext">Webflow Developer</div><div class="rotatingtext">NoCode Tech Lead</div><div class="rotatingtext">Digital Designer</div></div><div class="w-embed"><style>
172.rotatingtext {
173	transform: translate3d(0, 16px, 0);
174	animation: rotate 10s infinite;
175	transition-timing-function: cubic-bezier(0.2,0.5,0.3,1)
176}
177
178.rotatingtext:nth-of-type(2) {
179  animation-delay: 2.5s;
180}
181
182.rotatingtext:nth-of-type(3) {
183  animation-delay: 5s;
184}
185
186.rotatingtext:nth-of-type(4) {
187  animation-delay: 7.5s;
188}
189
190@keyframes rotate {
191/* Text is positioned below the wrap */
1920% {
193		transform: translate3d(0, 16px, 0);
194  }
195
196/* Move text up and make it visible */
1972.5% {
198		transform: translate3d(0, 0, 0);
199  } 
200
201/* Between 2.5% and 25%, nothing changes (text is visible) */
20225% {
203		transform: translate3d(0, 0, 0);
204  }  
205
206/* Move text up and out of the wrap */
20727.5% {
208    transform: translate3d(0, -16px, 0);
209  }
210
211/* Between 27.5% and 99%, nothing changes (text is invisible) */
21299.9999% {
213    transform: translate3d(0, -16px, 0);
214  }
215
216/* Move text to it's original position (loop starts over) */
217100% {
218    transform: translate3d(0, 16px, 0);
219  }  
220}
221</style></div></a><nav role="navigation" class="dsg-nav_menu w-nav-menu"><div class="menu_wrap"><div class="menu"><a href="/" class="menu_link w-inline-block"><p class="menu_link-text">Start</p></a><link rel="prefetch" href="/"/><a href="/cases" class="menu_link w-inline-block"><p class="menu_link-text">Cases</p><div class="menu_link-bg"></div></a><link rel="prefetch" href="/cases"/><a href="/about" aria-current="page" class="menu_link w-inline-block w--current"><p class="menu_link-text">Über mich</p><div class="menu_link-bg"></div></a><link rel="prefetch" href="/about"/><div class="menu_shape"><div class="menu_shape-bg"></div></div></div></div><a href="#contact" class="btn-prm--med w-button">Kontakt</a><div class="w-locales-list"><div role="list" class="locales-list w-locales-items"><div role="listitem" class="locale w-locales-item"><a hreflang="de" href="/about" aria-current="page" class="ls-link w--current">de</a></div><div role="listitem" class="locale w-locales-item"><a hreflang="en" href="/en/about" class="ls-link">en</a></div></div></div></nav><div data-w-id="9a9dbff4-3152-b2dd-7c55-40245d26faf1" class="dsg-menu-button w-nav-button"><div data-is-ix2-target="1" class="menu-animation" data-w-id="2f35357e-7743-f624-08c1-9993aeae8a47" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/649ea697c96242034515b321_5145-menu-open-and-close.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="2.3333333333333335" data-duration="0" data-loading="eager" data-ix2-initial-state="0"></div></div></div></div></div><main style="-webkit-transform:translate3d(0, -5em, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, -5em, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, -5em, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, -5em, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);filter:blur(5px);opacity:0" class="main-wrapper"><header class="hero-section"><div class="is-pad-tb-152 is-mb-64"><div class="container-col-12 w-container"><div class="w-layout-grid grid--6-6 is-home-hero"><div id="w-node-_75fbfe96-be2a-a489-12e2-9f0767d5b935-67d5b931" class="about_headline-wrap"><p data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b936" class="is-txt-subheadline is-about">Design &amp; Webflow Entwicklung</p><div class="is-margin-b-24"><div data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b939" class="row-1"><h2 data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b93a" class="is-display">Digital Designer &amp;</h2></div><div data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b93c" class="row-2"><h2 data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b93d" class="is-display is-row-2">Webflow </h2><div data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b93f" class="about-im-wrap"><div data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b940" class="about-hero-img"></div></div><h2 data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b941" class="is-display is-row-2">Entwickler</h2></div><div data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b943" class="row-3"><h2 data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b944" class="is-display is-row-3">für deinen digitalen Erfolg!</h2></div></div></div><div id="w-node-_75fbfe96-be2a-a489-12e2-9f0767d5b946-67d5b931" class="about_headline-wrap"><p data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b947" class="is-txt-large">Ich bin Digitaldesigner und Webflow-Experte mit spezialisierung auf Design und Entwicklung von hochwertigen Web Lösungen.</p></div>
221<div id="w-node-_75fbfe96-be2a-a489-12e2-9f0767d5b949-67d5b931" data-w-id="75fbfe96-be2a-a489-12e2-9f0767d5b949" class="button-wrap"><div data-w-id="8dc1bb22-7f65-cd45-7b4b-43f0c9d35def" class="btn-wrap"><div data-w-id="1820ebb6-18d6-0ce6-2f7c-50901ad4f2ca" class="btn-primary-blk"><a href="#contact" class="btn-outer w-inline-block"><div class="glow-border"></div><div class="btn-inner"><div class="btn-text">Jetzt anfragen</div><div class="glow-inner"></div></div></a><div class="btn-icon-wrap"><img src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/649752fcc6b765c5925a8ad5_arrow-right.svg" loading="lazy" alt="" class="icon btn-icon"/></div></div></div></div></div></div></div></header><div class="services-about_section"><section class="services-about_section"><div class="service-scroll-section"><div tr-marquee-scrolldirection="true" tr-marquee-element="component" class="marquee-text_component"><div class="marquee-text_wrapper"><div tr-marquee-element="panel" class="marquee-text_panel"><div class="marquee-text_text">Leistungen - Leistungen - Leistungen - Leistungen -</div></div><div tr-marquee-element="panel" class="marquee-text_panel"><div class="marquee-text_text">Leistungen - Leistungen - Leistungen - Leistungen -</div></div></div></div><div tr-marquee-reverse="true" tr-marquee-element="component" tr-marquee-scrolldirection="true" class="marquee-text_component is-2"><div class="marquee-text_wrapper is-2"><div tr-marquee-element="panel" class="marquee-text_panel"><div class="marquee-text_text">Services - Services - Services - Services - </div></div><div tr-marquee-element="panel" class="marquee-text_panel"><div class="marquee-text_text">Leistungen - Leistungen - Leistungen - Leistungen -</div></div></div></div></div><div class="container-col-10 is-services w-container"><div class="services-content-wrap"><div class="w-layout-grid grid--6-6 is-services"><div id="w-node-d4376536-9f1c-04ff-255b-3f7fc9726765-982d6f66" class="services-wrap _1"><div class="is-pad-b-16"><h1 class="is-h5">Beratung</h1></div><p class="is-txt-small">Ausgefeilte Strategie trifft auf perfektes Design und leistungsstarke Technologie - die perfekte Kombination für ein erfolgreiches Web-Erlebnis.<br/>‍</p></div><div id="w-node-_20ee9361-ebf4-7822-3c0e-e5a833a78aa4-982d6f66" class="services-wrap"><div class="is-pad-b-16"><h1 class="is-h5">UI/UX &amp; Digital Design</h1></div><p class="is-txt-small">Design und Funktionalität werden individuell gestaltet, ohne die Benutzerfreundlichkeit zu beeinträchtigen. Meine Websites sind so konzipiert, dass sie Unternehmen helfen, sich abzuheben und mit Ihnen zu wachsen.</p></div><div id="w-node-eade9d4e-62e6-71b4-136c-b2506eb550ed-982d6f66" class="services-wrap"><div class="is-pad-b-16"><h1 class="is-h5">Webflow Entwicklung</h1></div><p class="is-txt-small">Hochwertige Webflow-Entwicklung für digitale Erlebnisse wie B2B Websites, Saas-Anwendungen, Landing Pages, Microsites und andere einzigartige Storytelling-Sites.</p></div><div id="w-node-e201ed1f-0dbd-fda5-981a-f2c40c1f838b-982d6f66" class="services-wrap"><div class="is-pad-b-16"><h1 class="is-h5">Support</h1></div><p class="is-txt-small">Laufende Unterstützung bei der Gestaltung und Entwicklung Ihrer Website. Halten Sie Ihre Website auf dem neuesten Stand und richten Sie sie an Ihren Unternehmenszielen aus.</p></div><a id="w-node-_952b3814-f2c8-41f6-30c4-afbae07a0021-982d6f66" href="https://webflow.com/@steffen-hirth" class="webflow-experts-link w-inline-block"><div id="w-node-_71fa00cb-a56e-9083-351c-348bbfcf3907-982d6f66" class="webflow-expert-wrap"><div class="webflow-partner-logo-wrap"><div class="webflow-logo w-embed">
221<svg width="16" height="11" viewBox="0 0 16 11" fill="none" xmlns="http://www.w3.org/2000/svg">
222<path d="M11.8679 3.22184C11.8679 3.22184 10.5706 7.26343 10.4649 7.59705C10.4264 7.2539 9.47507 0 9.47507 0C7.26486 0 6.08288 1.56326 5.45826 3.2123C5.45826 3.2123 3.88228 7.26343 3.74775 7.60659C3.73814 7.29203 3.50751 3.25997 3.50751 3.25997C3.37297 1.23917 1.50871 0.00953192 0 0.00953192L1.82583 11C4.14174 10.9905 5.39099 9.43674 6.04444 7.78769C6.04444 7.78769 7.43784 4.21317 7.4955 4.05113C7.50511 4.20364 8.49489 11 8.49489 11C10.8204 11 12.0697 9.54159 12.7423 7.94974L16 0.00953192C13.7033 0.00953192 12.4925 1.56326 11.8679 3.22184Z" fill="currentColor"/>
223</svg></div><div class="is-txt-xsmall">Official Webflow Experte</div></div><div class="is-experts-text">Entwickelt Websites seit 2016</div></div></a></div></div></div></section></div><div class="services-section"><div class="is-pad-tb-96"><div class="container-col-12 w-container"><div class="is-margin-b-24"><div class="_2columns01_content-wrap"><div class="w-layout-grid grid--6-6 is-services"><div id="w-node-_11c7bf43-05a7-3afa-ee0c-e77d3d845f1e-982d6f66" class="is-margin-b-24"><div class="_3columns01_headline-wrap"><p class="is-txt-subheadline">Grundwerte</p><div class="is-pad-b-24"><h2 class="is-h3">Drei wesentliche Elemente für jedes Projekt.</h2></div><div class="is-pad-b-24"><p class="is-txt-small">Vertrauen, Transparenz und Termintreue sind die Eckpfeiler meiner Arbeit. Ich setze auf offene Kommunikation und enge Zusammenarbeit mit meinen Kunden, um ihre Visionen zu verwirklichen.</p></div><div class="button-wrap"><div data-w-id="8dc1bb22-7f65-cd45-7b4b-43f0c9d35def" class="btn-wrap"><div data-w-id="1820ebb6-18d6-0ce6-2f7c-50901ad4f2ca" class="btn-primary-blk"><a href="#contact" class="btn-outer w-inline-block"><div class="glow-border"></div><div class="btn-inner"><div class="btn-text">Jetzt anfragen</div><div class="glow-inner"></div></div></a><div class="btn-icon-wrap"><img src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/649752fcc6b765c5925a8ad5_arrow-right.svg" loading="lazy" alt="" class="icon btn-icon"/></div></div></div></div></div></div><div id="w-node-_365fff0c-2ccd-42c1-36b9-1ebfdc4d02d9-982d6f66" class="card-container"><div class="slider-arrow-wrap"><a id="card-slider-up" href="#" class="arrow-link w-inline-block"><div class="icon up-arrow w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
224<path fill-rule="evenodd" clip-rule="evenodd" d="M7.48047 13.4805V3.49519H8.98047V13.4805H7.48047Z" fill="currentColor"/>
225<path fill-rule="evenodd" clip-rule="evenodd" d="M3.45703 6.54297L7.34612 2.65388H9.11389L13.003 6.54297L11.9423 7.60363L8.23 3.89132L4.51769 7.60363L3.45703 6.54297Z" fill="currentColor"/>
226</svg></div></a><a id="card-slider-down" href="#" class="arrow-link w-inline-block"><div class="icon up-arrow w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
227<path fill-rule="evenodd" clip-rule="evenodd" d="M8.51953 2.51953L8.51953 12.5048L7.01953 12.5048L7.01953 2.51953L8.51953 2.51953Z" fill="currentColor"/>
228<path fill-rule="evenodd" clip-rule="evenodd" d="M12.543 9.45703L8.65388 13.3461L6.88611 13.3461L2.99703 9.45703L4.05769 8.39637L7.77 12.1087L11.4823 8.39637L12.543 9.45703Z" fill="currentColor"/>
229</svg></div></a></div><div id="w-node-_491c9f8f-8a1d-e153-cf0c-d7a8ec44361c-982d6f66" class="card-container-inner"><div id="w-node-_466eda80-a94d-7958-9baa-8d5d0445643b-982d6f66" data-w-id="466eda80-a94d-7958-9baa-8d5d0445643b" class="card"><div class="is-pad-b-16"></div><div class="is-pad-b-16"><p class="is-txt-xlarge is-txt-black-100">Vertrauen und Transparenz.<br/></p></div><p class="is-txt-small">Um eine hervorragende Arbeit zu leisten, müssen meine Kunden darauf vertrauen können, dass ich mich wirklich für ihre Interessen einsetze. Ich biete vollständige Transparenz bei meinen Prozessen, der Entscheidungsfindung und den von mir erzielten Ergebnissen.</p></div><div data-w-id="4e495d4f-1920-ddad-6dd0-4a5017ce74e0" class="card"><div class="is-pad-b-16"></div><div class="is-pad-b-16"><p class="is-txt-xlarge is-txt-black-100">Gestalten mit Verstand.<br/></p></div><p class="is-txt-small">Meine kreativen Entscheidungen beruhen auf bewährten Verfahren, Erfahrung, Forschung und einem umfassenden Verständnis der Ziele.</p></div><div data-w-id="790cf741-f7df-b381-0eeb-aa92fec8c483" class="card"><div class="is-pad-b-16"></div><div class="is-pad-b-16"><p class="is-txt-xlarge is-txt-black-100">Pünktlich liefern.<br/></p></div><p class="is-txt-small">Ich lege Wert darauf, pünktlich zu sein und die festgelegten Meilensteine zu erreichen. Falls etwas dazwischen kommt - immer klar kommunizieren!</p></div></div></div></div></div></div></div></div></div><div class="services-section"><div class="is-pad-tb-96 is-stories"><div class="container-col-12 w-container"><div id="w-node-e5102a0f-677f-4e77-bb61-f9f7b35ff388-982d6f66" class="is-margin-b-24"><div class="storie-content-wrap"><div class="w-layout-grid grid--6-6 is-stories"><div class="_3columns01_headline-wrap"><p class="is-txt-subheadline-white">Einblicke</p><div class="is-pad-b-24"><h2 class="is-h3 is-txt-white-100">Ein kleiner Blick hinter die Kulissen.</h2></div><div class="is-pad-b-24"><p class="is-txt-small is-txt-white-150">Wenn ich nicht gerade vor meinem Computer sitze, fahre ich Fahrrad, koche oder lese Bücher zum Thema Wirtschaft und Weiterentwicklung. <br/><br/>Folgen mir für weitere Einblicke:</p></div><div class="insights-links-wrap"><div class="social-link-wrap"><a href="https://www.linkedin.com/in/steffen-hirth/" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">linkedin</div></a><a href="https://twitter.com/Steffen_Hirth" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">X (twitter)</div></a><a href="https://www.instagram.com/steffen.hirth/" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">instagram</div></a></div></div></div><div class="storie-wrap"><div class="tab-wrapper"><div class="cc-stories-slide w-embed"><style>
230.tab-image {
231 border-top-left-radius: 1em;
232  border-top-right-radius: 1em;
233}
234</style></div><div data-current="Tab 1" data-easing="ease" data-duration-in="0" data-duration-out="0" class="tabs-demo-function w-tabs"><div class="tabs-menu-demo w-tab-menu"><a data-w-tab="Tab 1" class="tab-button-demo w-inline-block w-tab-link w--current"><div class="timer-line-demo"></div></a><a data-w-tab="Tab 2" class="tab-button-demo w-inline-block w-tab-link"><div class="timer-line-demo"></div></a><a data-w-tab="Tab 3" class="tab-button-demo w-inline-block w-tab-link"><div class="timer-line-demo"></div></a><a data-w-tab="Tab 4" class="tab-button-demo w-inline-block w-tab-link"><div class="timer-line-demo"></div></a><a data-w-tab="Tab 5" class="tab-button-demo w-inline-block w-tab-link"><div class="timer-line-demo"></div></a><a data-w-tab="Tab 6" class="tab-button-demo w-inline-block w-tab-link"><div class="timer-line-demo"></div></a></div><div class="tabs-content-demo w-tab-content"><div data-w-tab="Tab 1" class="tab-pane-demo w-tab-pane w--tab-active"><img sizes="(max-width: 479px) 69vw, (max-width: 767px) 330.328125px, (max-width: 991px) 75vw, 69vw" srcset="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/648076950a92ccf749854398_storie-1-p-500.jpg 500w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/648076950a92ccf749854398_storie-1.jpg 920w" alt="Workspace Image" src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/648076950a92ccf749854398_storie-1.jpg" loading="eager" class="tab-image"/></div><div data-w-tab="Tab 2" class="tab-pane-demo w-tab-pane"><img sizes="(max-width: 479px) 69vw, (max-width: 767px) 330.328125px, (max-width: 991px) 75vw, 69vw" srcset="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/6496dfe9c6b765c5924217d1_storie-milow%20(1)-p-500.jpg 500w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/6496dfe9c6b765c5924217d1_storie-milow%20(1).jpg 681w" alt="Milow dog image" src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/6496dfe9c6b765c5924217d1_storie-milow%20(1).jpg" loading="eager" class="tab-image"/></div><div data-w-tab="Tab 3" class="tab-pane-demo w-tab-pane"><img sizes="(max-width: 479px) 69vw, (max-width: 767px) 330.328125px, (max-width: 991px) 75vw, 69vw" srcset="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/64807d680c4bfc697c0b139e_storie-3%20(1)-p-500.jpg 500w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/64807d680c4bfc697c0b139e_storie-3%20(1)-p-800.jpg 800w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/64807d680c4bfc697c0b139e_storie-3%20(1)-p-1080.jpg 1080w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/64807d680c4bfc697c0b139e_storie-3%20(1).jpg 1380w" alt="Afterwork drink" src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807d680c4bfc697c0b139e_storie-3%20(1).jpg" loading="eager" class="tab-image _3"/></div><div data-w-tab="Tab 4" class="tab-pane-demo w-tab-pane"><div data-poster-url="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807a225f5d06bb86ce99bd_IMG_4638-poster-00001.jpg" data-video-urls="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807a225f5d06bb86ce99bd_IMG_4638-transcode.mp4,https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807a225f5d06bb86ce99bd_IMG_4638-transcode.webm" data-autoplay="true" data-loop="true" data-wf-ignore="true" class="tab-image w-background-video w-background-video-atom"><video id="1dade013-f2a1-a2c4-0663-cb2566dbe558-video" autoplay="" loop="" style="background-image:url(&quot;https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807a225f5d06bb86ce99bd_IMG_4638-poster-00001.jpg&quot;)" muted="" playsinline="" data-wf-ignore="true" data-object-fit="cover"><source src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807a225f5d06bb86ce99bd_IMG_4638-transcode.mp4" data-wf-ignore="true"/><source src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807a225f5d06bb86ce99bd_IMG_4638-transcode.webm" data-wf-ignore="true"/></video></div></div><div data-w-tab="Tab 5" class="tab-pane-demo w-tab-pane"><img sizes="(max-width: 479px) 69vw, (max-width: 767px) 330.328125px, (max-width: 991px) 75vw, 69vw" srcset="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/6480739d10bd504af0063215_DTS_Passion_Economy_Daniel_Faro%25CC%2580_4744-p-500.jpg 500w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/6480739d10bd504af0063215_DTS_Passion_Economy_Daniel_Faro%25CC%2580_4744-p-800.jpg 800w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/6480739d10bd504af0063215_DTS_Passion_Economy_Daniel_Faro%25CC%2580_4744-p-1080.jpg 1080w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/6480739d10bd504af0063215_DTS_Passion_Economy_Daniel_Faro%CC%80_4744.jpg 1280w" src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/6480739d10bd504af0063215_DTS_Passion_Economy_Daniel_Faro%CC%80_4744.jpg" loading="eager" alt="" class="tab-image"/></div><div data-w-tab="Tab 6" class="tab-pane-demo w-tab-pane"><img sizes="(max-width: 479px) 69vw, (max-width: 767px) 330.328125px, (max-width: 991px) 75vw, 69vw" srcset="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/64807ae8b8a3cdbd6ba268f3_storie-2%20(1)-p-500.jpg 500w, https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/64807ae8b8a3cdbd6ba268f3_storie-2%20(1).jpg 908w" alt="Work zoom in 
234image" src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/64807ae8b8a3cdbd6ba268f3_storie-2%20(1).jpg" loading="eager" class="tab-image"/></div></div></div><a href="#" class="arrow-2 tab_next w-inline-block"></a><a href="#" class="arrow-2 tab_previous w-inline-block"></a></div></div></div><img src="https://cdn.prod.website-files.com/64653ddbdd2b114ca9c5d299/6491d74ea98e101ce6b78fed_bg-element-light.svg" loading="lazy" alt="" class="storie-bg-img non-clickable"/></div></div></div></div></div><div class="notes-section"><div class="is-pad-t-96"><div class="container-col-12 w-container"><div id="w-node-_05c52913-d662-8a53-15dd-c4b2afe58949-982d6f66" class="is-margin-b-24"><div class="testimonial-content_wrap"><div class="w-layout-grid grid--6-6 is-notes"><div id="w-node-_05c52913-d662-8a53-15dd-c4b2afe5894c-982d6f66" class="is-margin-b-24"><div class="_3columns01_headline-wrap"><p class="is-txt-subheadline">Testimonials</p><div class="is-pad-b-24"><h2 class="is-h3">Anmerkungen von Freunden und Kunden.</h2></div><div class="is-pad-b-24"><p class="is-txt-small">Was Freunde und Partner über mich, meinen Prozess und unsere Zusammenarbeit sagen.</p></div></div></div><div id="w-node-_05c52913-d662-8a53-15dd-c4b2afe58955-982d6f66" class="notes-wrap"><div class="pattern-bg"></div><div class="note-wrap-1 _1"><div class="note-profile"><div class="icon case-icon w-embed"><svg width="20" height="19" viewBox="0 0 20 19" fill="none" xmlns="http://www.w3.org/2000/svg">
235<path d="M9.69784 18.7519C3.83343 18.7351 0 14.6063 0 9.35789C0 4.13486 3.84913 0 9.73384 0C15.5815 0 19.3937 4.13486 19.3937 9.35789C19.3937 9.36435 19.3937 9.37081 19.3937 9.37727L16.3957 9.3779C16.3957 9.37123 16.3957 9.36456 16.3957 9.35789C16.3957 5.62193 14.0641 2.53895 9.73384 2.53895C5.36657 2.53895 3.03489 5.62193 3.03489 9.35789C3.03489 13.1197 5.35375 16.196 9.69784 16.2129V18.7519Z" fill="#202126"/>
236<path d="M19.3946 18.794V12.3828H16.3963V16.2621H12.2969V18.7946L19.3946 18.794Z" fill="#202126"/>
237</svg></div></div><p class="is-txt-xsmall">&quot;Die Zusammenarbeit mit Steffen, unserem Webflow-Freelancer, war eine lohnende Erfahrung. Seine klare Kommunikation und seine innovativen Ideen haben unsere Erwartungen stets übertroffen und die Entwicklung der Website zu einem echten Vergnügen gemacht. Steffen liefert nicht nur eine Dienstleistung, er ist ein Partner. <strong class="is-txt-black-125">Patrick Kilian</strong></p></div><div class="note-wrap-2 _2"><div class="note-profile toby"><div class="icon case-icon w-embed"><svg width="17" height="19" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
238<path d="M12.321 12.9493L15.5288 16.2449C14.2606 17.5562 12.6419 18.4509 10.8781 18.8159C9.11428 19.1808 7.28469 18.9993 5.62137 18.2946C3.95801 17.5899 2.5358 16.3936 1.53503 14.8574C0.534253 13.3212 0 11.5143 0 9.66577C0 7.81721 0.534253 6.01032 1.53503 4.47413C2.5358 2.93793 3.95801 1.74164 5.62137 1.03692C7.28469 0.332201 9.11428 0.150794 10.8781 0.515698C12.6419 0.880602 14.2606 1.77538 15.5288 3.0866L12.321 6.38228C11.6876 5.72497 10.8783 5.27587 9.9959 5.09202C9.11357 4.90817 8.19791 4.99786 7.36529 5.34971C6.53261 5.70156 5.82052 6.29969 5.3194 7.06816C4.81827 7.83666 4.55072 8.74077 4.55072 9.66577C4.55072 10.5908 4.81827 11.4949 5.3194 12.2634C5.82052 13.0319 6.53261 13.63 7.36529 13.9818C8.19791 14.3337 9.11357 14.4234 9.9959 14.2395C10.8783 14.0557 11.6876 13.6066 12.321 12.9493Z" fill="#202126"/>
239<path d="M14.6518 12.0808C15.9491 12.0808 17.0008 11.0002 17.0008 9.66731C17.0008 8.33445 15.9491 7.25391 14.6518 7.25391C13.3545 7.25391 12.3027 8.33445 12.3027 9.66731C12.3027 11.0002 13.3545 12.0808 14.6518 12.0808Z" fill="#202126"/>
240</svg></div></div><p class="is-txt-xsmall">&quot;Mit Steffen haben wir einen zuverlässigen Webflow-Entwickler gefunden, der Webseiten strukturiert, zielgerichtet und zeitnah umsetzt. Dabei behält er immer ein Auge für Design, um Projekte nicht nur technisch, sondern auch optisch zum Strahlen zu bringen.&quot; <span class="is-txt-black-125">Tobias Linden</span></p></div><div class="note-wrap-5 _5"><div class="note-profile new-partner"><div class="icon case-icon w-embed">
240<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
241<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="#202126"/>
242<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="#202126"/>
243</svg></div></div><p class="is-txt-xsmall">You wanna become a friend and partner? <a href="mailto:[email protected]" class="is-text-link">Contact me</a><br/></p></div><div class="note-wrap-3 _3"><div class="note-profile justin"><div class="icon case-icon w-embed"><svg width="17" height="19" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
244<path fill-rule="evenodd" clip-rule="evenodd" d="M7.93831 6.91665H9.0605V9.96021e-08L7.93831 0V6.91665ZM5.9838 8.71631L6.55959 7.71651L0.575792 4.25308L0 5.25288L5.9838 8.71631ZM16.4242 14.7586L17 13.7588L11.0162 10.2954L10.4404 11.2952L16.4242 14.7586ZM9.0605 19H7.93831V12.0833H9.0605V19ZM0.575911 14.7585L0.000121993 13.7587L5.9839 10.2953L6.55969 11.2951L0.575911 14.7585ZM10.4393 7.7164L11.015 8.71621L16.9988 5.25278L16.423 4.25297L10.4393 7.7164Z" fill="#202126"/>
245</svg></div></div><p class="is-txt-xsmall">&quot;Für jeden, der einen Webflow-Experten sucht, können wir Steffen nicht genug empfehlen. Deshalb ist er unser Ansprechpartner bei smalltribe für jedes Webflow-Projekt!&quot; <strong class="is-txt-black-125">Justin Schüler</strong><br/></p></div><div class="note-wrap-4 _4"><div class="note-profile bernd"><div class="is-txt-medium is-txt-black-100">BV</div></div><p class="is-txt-xsmall">&quot;... sein ganzheitlicher Ansatz hat mich voll überzeugt. Werte wie Zuverlässigkeit, Pünktlichkeit und Offenheit sind für ihn in der Zusammenarbeit eine Selbstverständlichkeit...&quot; <strong class="is-txt-black-125">Bernd Vollmer</strong></p></div></div></div></div></div></div></div></div><div class="notes-section"><div class="is-pad-tb-96"><div class="container-col-6 w-container"><div id="w-node-_8951c727-6fbf-8279-3a34-d62dbc77dae9-982d6f66" class="is-margin-b-24"><div class="testimonial-content_wrap"><div id="w-node-_8951c727-6fbf-8279-3a34-d62dbc77daec-982d6f66" class="is-margin-b-24"><div class="faq_headline-wrap"><div class="is-pad-b-24"><h2 class="is-h3-faq">Dinge, die ich oft gefragt werade.</h2></div></div></div><div id="w-node-f6398f08-e114-37a7-1d95-d2526dc8ed55-982d6f66" data-current="Tab 1" data-easing="ease-out-quint" data-duration-in="400" data-duration-out="400" class="tabs w-tabs"><div data-w-id="f6398f08-e114-37a7-1d95-d2526dc8ed56" class="tabs-menu-wrapper w-tab-menu"><a data-w-tab="Tab 1" class="tabs-nav-item _03 w-inline-block w-tab-link w--current"><div class="tabs-nav-text">Leistungen &amp; Tools</div></a><a data-w-tab="Tab 2" class="tabs-nav-item _03 w-inline-block w-tab-link"><div class="tabs-nav-text">Preise &amp; Prozess</div></a></div><div class="tabs-content-wrapper w-tab-content"><div data-w-tab="Tab 1" class="tab-content-item w-tab-pane w--tab-active"><div class="tab-content-inner"><div class="accordion-wrapper"><div class="accordion-item"><div id="q3" class="accordion-item-trigger"><div class="icon accordion-icon w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
246<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
247<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
248</svg></div><h3 class="accordion-heading">Welche spezifischen Dienstleistungen bietest du an?</h3></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">Ich habe mich auf hochwertiges Website-Design und -Entwicklung spezialisiert und verwende benutzerdefinierte Co
248de-Integrationen, um die Interaktivität für den Benutzer zu erhöhen. Jedes Projekt, egal wie groß oder klein, beinhaltet auch eine individuelle Beratung.</p></div></div><div class="accordion-item"><div id="q3" class="accordion-item-trigger"><div class="icon accordion-icon w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
249<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
250<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
251</svg></div><h4 class="accordion-heading">Mit welchem CMS arbeitest du?</h4></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">Ich verwende Webflow ausschließlich für Webentwicklungsprojekte, da es branchenführende Stärken in de
251n Bereichen Codeanpassung, SEO, Hosting, Performance und Designautonomie aufweist.<br/></p></div></div><div class="accordion-item is-last"><div id="q3" class="accordion-item-trigger"><div class="icon accordion-icon w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
252<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
253<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
254</svg></div><h4 class="accordion-heading">Welchen Tools verwenden Sie?</h4></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">Strategie und Design mit Figma. Entwicklung mit Webflow. Laufende Aktualisierungen, Walkthroughs und Schulungen mit Loom. Projektkommunikation über Slack und Projektmanagement mit Notion.</p></div></div><div class="accordion-item"><div id="q3" class="accordion-item-trigger"><div class="icon accordion-icon w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
255<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
256<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
257</svg></div><h4 class="accordion-heading">Ich hätte nur das Design und brauche die Entwicklung?</h4></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">Ich biete auch Migrationen von Figma zu Webflow oder von Wordpress zu Webflow an und setze eure sauber gestalteten Layouts um, pixelgenau und responsive für alle Geräte.</p></div></div></div></div></div><div data-w-tab="Tab 2" class="tab-content-item w-tab-pane"><div class="tab-content-inner"><div id="w-node-_59745cab-b57a-f1bc-e09d-b5a5dae6dc9c-982d6f66" class="accordion-wrapper"><div class="accordion-item"><div id="q3" class="accordion-item-trigger"><div class="icon accordion-icon w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
258<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
259<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
260</svg></div><h4 class="accordion-heading">How much does a project cost?<br/></h4></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">Normally project costs vary depending on size, time frame and complexity. My current minimum engagement fee is 5000€, with most projects ranging from 6000-15,000€. For other independent creative services, I charge 360€/680€ per half/full day.<br/></p></div></div><div class="accordion-item"><div id="q3" class="accordion-item-trigger"><div class="icon accordion-icon w-embed"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
261<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
262<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
263</svg></div><h4 class="accordion-heading">How long does a project take?</h4></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">The duration of projects varies, but most of my work so far has taken between 1,5 weeks and 3 months.<br/></p></div></div><div class="accordion-item"><div id="q1" class="accordion-item-trigger"><div class="icon accordion-icon w-embed">
263<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
264<path fill-rule="evenodd" clip-rule="evenodd" d="M6.18934 7.25L6.9394 8.00006L6.18945 8.75L2.25 8.75V7.25H6.18934ZM9.81066 8.75L13.75 8.75V7.25H9.81077L9.06072 8.00006L9.81066 8.75Z" fill="currentColor"/>
265<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 6.18945L8.75 2.25H7.25V6.18934L8.00006 6.9394L8.75 6.18945ZM8.75 9.81066L8.00006 9.06072L7.25 9.81077V13.75H8.75L8.75 9.81066Z" fill="currentColor"/>
266</svg></div><h4 class="accordion-heading">How does payment work for a project?</h4></div><div class="accordion-item-content"><p class="is-txt-small is-accordion">I stick to the industry standard of 50% upfront and 50% after a successful handover and launch.<br/></p></div></div></div></div></div></div></div></div></div></div></div></div><div id="contact" class="cta-section"><div class="is-pad-tb-96"><div class="container-col-12 w-container"><div class="w-layout-grid grid--6-6 is-contact"><div id="w-node-_2df54b07-8b3e-2977-1db7-e58bc56752b8-c56752b4" class="contact_content-wrap"><div class="is-margin-b-24"><p class="is-txt-subheadline">Kontakt</p><h2 class="is-h3">Bereit für ein gemeinsames Projekt?</h2></div><div class="contact-wrap"><div class="is-txt-small">Ortszeit:<br/><span data-clock="CET" class="text-span">00:00:00</span>, CET</div></div></div><div id="w-node-_2df54b07-8b3e-2977-1db7-e58bc56752c9-c56752b4" class="form-wrapper w-form"><form id="wf-form-Portfolio-Formular" name="wf-form-Portfolio-Formular" data-name="Portfolio Formular" method="get" class="form" data-wf-page-id="64afe45a2daaf57d982d6f66" data-wf-element-id="2df54b07-8b3e-2977-1db7-e58bc56752ca"><div class="form-field-row"><div class="form-field-wrapper"><label for="Vorname-2" class="form-label">Name</label><input class="form-input w-input" maxlength="256" name="Vorname-2" data-name="Vorname 2" placeholder="John Doe" type="text" id="Vorname-2" required=""/></div><div class="form-field-wrapper"><label for="E-Mail-2" class="form-label">E-Mail</label><input class="form-input w-input" maxlength="256" name="E-Mail-2" data-name="E Mail 2" placeholder="[email protected]" type="email" id="E-Mail-2" required=""/></div></div><div class="form-field-row"><div class="form-field-wrapper"><label for="Budget-3" class="form-label">Budge in €</label><select id="Budget-3" name="Budget-3" data-name="Budget 3" required="" class="form-input is-select-input w-select"><option value="&lt;10k">5 - 10.000 €</option><option value="10-20k">10 - 20.000 €</option><option value="20-50k">20.000 € +</option></select></div><div class="form-field-wrapper"><label for="Leistung-2" class="form-label">Leistungen</label><select id="Leistung-2" name="Leistung-2" data-name="Leistung 2" required="" class="form-input is-select-input w-select"><option value="Design/ Dev Consulting">Design / Dev Beratung</option><option value="UI/UX Design">UI/UX Design</option><option value="Webflow Entwicklung">Webflow Entwicklung</option><option value="Webflow Retainer">Webflow Retainer</option></select></div></div><div class="form-field-wrapper"><label for="ber-das-Projekt" class="form-label">Projektbeschreibung</label><textarea id="ber-das-Projekt" name="ber-das-Projekt" maxlength="5000" data-name="Über das Projekt" placeholder="Hey Steffen, kannst du uns bei ... unterstützen? Die Ziele und Zeitplan sind ... und das ist mein figma Link zum Design: ..." required="" class="form-input is-text-area w-input"></textarea></div><div class="form-field-wrapper"><label class="w-checkbox form-checkbox"><div class="w-checkbox-input w-checkbox-input--inputType-custom form-checkbox-icon"></div><input id="Checkbox-2" type="checkbox" name="Checkbox-2" data-name="Checkbox 2" required="" style="opacity:0;position:absolute;z-index:-1"/><span for="Checkbox-2" class="form-checkbox-label w-form-label">Ich bin mit den <a href="/privacy" class="link-2">Datenschutzbestimmungen </a>einverstanden.</span></label></div><div class="submit-btn-wrap"><input type="submit" data-wait="Einen Moment..." class="btn--prm-med is-form-submit w-button" value="Anfrage absenden.   "/><div class="contact-form-mail-wrap"><p class="is-txt-xsmall is-txt-white-125">E-Mail bevorzugt?</p><div class="is-txt-xsmall"><a href="mailto:[email protected]" class="link-3">[email protected]</a></div></div></div></form><div class="form-message-success w-form-done"><div class="success-message">Thank you!</div><p class="is-txt-medium is-txt-small">I will get back to you within the next 24 hours!</p></div><div class="form-message-error w-form-fail"><div>Oops! Something went wrong while submitting the form. Please try again</div></div></div></div></div></div><div class="contact-form-bg"></div></div><footer class="footer-section"><div class="is-pad-tb-56"><div class="container-col-12 w-container"><div class="w-layout-grid grid--4-4-4"><div id="w-node-_395f15ad-7f52-92c4-e1dd-108e4f807d55-4f807d51" class="is-margin-b-16"><div class="is-txt-xsmall"><a href="mailto:[email protected]?subject=Projektanfrage">[email protected]</a></div></div><div id="w-node-_395f15ad-7f52-92c4-e1dd-108e4f807d59-4f807d51" class="card04"><div class="is-margin-b-16"><div class="footer-link-wrap"><div class="is-txt-xsmall">Folge mir</div><a href="https://dribbble.com/steffenhirth" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">dribbble</div></a><a href="https://www.linkedin.com/in/steffen-hirth/" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">linkedin</div></a><a href="https://twitter.com/Steffen_Hirth" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">twitter</div></a><a href="https://www.instagram.com/steffen.hirth/" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">instagram</div></a></div></div></div></div><div class="w-layout-grid grid--4-4-4 is-footer"><div id="w-node-_395f15ad-7f52-92c4-e1dd-108e4f807d6b-4f807d51" class="footer_branding"><div class="is-margin-b-16"><div class="is-txt-xsmall is-txt-white-125">Version 2.1</div></div></div><div id="w-node-_395f15ad-7f52-92c4-e1dd-108e4f807d6f-4f807d51" class="card04"><div class="is-margin-b-16"><div class="footer-link-wrap"><a href="/terms" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">Impressum</div></a><a href="/privacy" class="dsg_footer-link w-inline-block"><div class="is-txt-xsmall">Datenschutz</div></a></div></div></div></div></div></div></footer></main></div></div>
266<script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=64653ddbdd2b114ca9c5d299" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
266<script src="https://assets-global.website-files.com/64653ddbdd2b114ca9c5d299/js/portfolio-sh23.b3138bf18.js" type="text/javascript"></script>
266<script>
267let duration = 400;
268let menuShape = $(".menu_shape");
269let menuShapeBG = $(".menu_shape-bg");
270let menuLink = $(".menu_link");
271let currentLink = $(".menu_link.w--current");
272
273// On page load
274moveShape(currentLink);
275$(".menu_link-bg").css("opacity", "0");
276menuShape.css("opacity", "1");
277menuLink.css("pointer-events", "auto");
278
279// On click
280menuLink.on("click", function (e) {
281  // Page url
282  e.preventDefault();
283  setTimeout(() => {
284    window.location = $(this).attr("href");
285  }, duration);
286  // menuShapeBG Stretch
287  if ($(this).index() > currentLink.index()) {
288    menuShape.css("justify-content", "flex-end");
289  }
290  if (currentLink.index() !== $(this).index()) {
291    menuShapeBG.css("transition", `width ${duration / 2}ms`);
292    menuShapeBG.css("width", "140%");
293    setTimeout(() => {
294      menuShapeBG.css("width", "100%");
295    }, duration / 2);
296  }
297  // menuShape move
298  menuShape.css("transition", `all ${duration}ms`);
299  moveShape($(this));
300});
301
302// Snap
303function moveShape(target) {
304  let linkWidth = target.innerWidth();
305  let linkOffset = target.offset().left;
306  let menuOffset = $(".menu").offset().left;
307  let leftPosition = linkOffset - menuOffset;
308  menuShape.css("left", leftPosition);
309  menuShape.css("width", linkWidth);
310}
311
312// Resize
313window.addEventListener("resize", function () {
314  moveShape(currentLink);
315});
316
317// Back button safari
318window.onpageshow = function (event) {
319  if (event.persisted) {
320    window.location.reload();
321  }
322};
323  
324</script>
324
325
326<script>
327  $('.menu_link').click(function (e) {
328    e.preventDefault(); // prevent default anchor behavior
329    var goTo = this.getAttribute("href"); // store anchor href
330    setTimeout(function(){
331      window.location = goTo;
332    },600); // the duration of the "load out" animation in milliseconds
333  });
334</script>
334
335
336
337<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/gsap.min.js"></script>
vendor: 1 bytes, line 337
337
338<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/ScrollTrigger.min.js"></script>
vendor: 1 bytes, line 338
338
339<script>
340// MARQUEE POWER-UP
341window.addEventListener("DOMContentLoaded", (event) => {
342  // attribute value checker
343  function attr(defaultVal, attrVal) {
344    const defaultValType = typeof defaultVal;
345    if (typeof attrVal !== "string" || attrVal.trim() === "") return defaultVal;
346    if (attrVal === "true" && defaultValType === "boolean") return true;
347    if (attrVal === "false" && defaultValType === "boolean") return false;
348    if (isNaN(attrVal) && defaultValType === "string") return attrVal;
349    if (!isNaN(attrVal) && defaultValType === "number") return +attrVal;
350    return defaultVal;
351  }
352  // marquee component
353  $("[tr-marquee-element='component']").each(function (index) {
354    let componentEl = $(this),
355      panelEl = componentEl.find("[tr-marquee-element='panel']"),
356      triggerHoverEl = componentEl.find("[tr-marquee-element='triggerhover']"),
357      triggerClickEl = componentEl.find("[tr-marquee-element='triggerclick']");
358    let speedSetting = attr(100, componentEl.attr("tr-marquee-speed")),
359      verticalSetting = attr(false, componentEl.attr("tr-marquee-vertical")),
360      reverseSetting = attr(false, componentEl.attr("tr-marquee-reverse")),
361      scrollDirectionSetting = attr(false, componentEl.attr("tr-marquee-scrolldirection")),
362      scrollScrubSetting = attr(false, componentEl.attr("tr-marquee-scrollscrub")),
363      moveDistanceSetting = -100,
364      timeScaleSetting = 1,
365      pausedStateSetting = false;
366    if (reverseSetting) moveDistanceSetting = 100;
367    let marqueeTimeline = gsap.timeline({ repeat: -1, onReverseComplete: () => marqueeTimeline.progress(1) });
368    if (verticalSetting) {
369      speedSetting = panelEl.first().height() / speedSetting;
370      marqueeTimeline.fromTo(panelEl, { yPercent: 0 }, { yPercent: moveDistanceSetting, ease: "none", duration: speedSetting });
371    } else {
372      speedSetting = panelEl.first().width() / speedSetting;
373      marqueeTimeline.fromTo(panelEl, { xPercent: 0 }, { xPercent: moveDistanceSetting, ease: "none", duration: speedSetting });
374    }
375    let scrubObject = { value: 1 };
376    ScrollTrigger.create({
377      trigger: "body",
378      start: "top top",
379      end: "bottom bottom",
380      onUpdate: (self) => {
381        if (!pausedStateSetting) {
382          if (scrollDirectionSetting && timeScaleSetting !== self.direction) {
383            timeScaleSetting = self.direction;
384            marqueeTimeline.timeScale(self.direction);
385          }
386          if (scrollScrubSetting) {
387            let v = self.getVelocity() * 0.006;
388            v = gsap.utils.clamp(-60, 60, v);
389            let scrubTimeline = gsap.timeline({ onUpdate: () => marqueeTimeline.timeScale(scrubObject.value) });
390            scrubTimeline.fromTo(scrubObject, { value: v }, { value: timeScaleSetting, duration: 0.5 });
391          }
392        }
393      }
394    });
395    function pauseMarquee(isPausing) {
396      pausedStateSetting = isPausing;
397      let pauseObject = { value: 1 };
398      let pauseTimeline = gsap.timeline({ onUpdate: () => marqueeTimeline.timeScale(pauseObject.value) });
399      if (isPausing) {
400        pauseTimeline.fromTo(pauseObject, { value: timeScaleSetting }, { value: 0, duration: 0.5 });
401        triggerClickEl.addClass("is-paused");
402      } else {
403        pauseTimeline.fromTo(pauseObject, { value: 0 }, { value: timeScaleSetting, duration: 0.5 });
404        triggerClickEl.removeClass("is-paused");
405      }
406    }
407    if (window.matchMedia("(pointer: fine)").matches) {
408      triggerHoverEl.on("mouseenter", () => pauseMarquee(true));
409      triggerHoverEl.on("mouseleave", () => pauseMarquee(false));
410    }
411    triggerClickEl.on("click", function () {
412      !$(this).hasClass("is-paused") ? pauseMarquee(true) : pauseMarquee(false);
413    });
414  });
415});
416</script>
416
417<!-- [Cards Stacking Animation -->
418<script>
419	$('.card-container #card-slider-down').click(function() {
420    $('.card:first-child').css({
421      "opacity": "0",
422      "transform": "translateY(20px) scale(1.02)"
423    })
424    setTimeout(() => {
425      $('.card:first-child').remove()
426      .insertAfter($(".card:last", $('.card:first-child').parent()))
427      .removeAttr('style')
428    }, 100);
429  });
430  
431	$('.card-container #card-slider-up').click(function() {
432  	$('.card:last-child').remove()
433    	.insertBefore($(".card:first", $('.card:last-child').parent()))
434  });
435  
436  function resizeCardContainer() {
437  	let max_height = 0;
438    $('.card-container-inner .card').each(function() {
439      var height = this.getBoundingClientRect().height
440      max_height = Math.max(max_height, height)
441    });
442    $('.card-container-inner').height(max_height)
443  }
444
445  $(window).on('load', resizeCardContainer())
446  $(window).resize(function() {
447   	resizeCardContainer()
448 });
449</script>
449
450
451<script>
452var Webflow = Webflow || [];
453Webflow.push(function() {
454// Fix for Safari
455if (navigator.userAgent.includes("Safari")) {
456document.querySelectorAll(".tab-button-demo").forEach((t)=>(t.focus=function(){const x=window.scrollX,y=window.scrollY;const f=()=>{setTimeout(()=>window.scrollTo(x,y),1);t.removeEventListener("focus",f)};t.addEventListener("focus",f);HTMLElement.prototype.focus.apply(this,arguments)}));
457		}
458
459function nextTab(){
460  $('.tab_next').trigger("click");
461}
462
463var loop = setInterval(nextTab,5000);
464
465  $('.tab-wrapper').on('click', '.tab_previous, .tab_next', function() {
466    clearInterval(loop);
467    var direction = $(this).hasClass('tab_previous') ? -1 : 1;
468    var tablinks = $(this).parent().find('.w-tab-menu');
469    var index = tablinks.find('.w--current').index() + direction;
470    index = index >= tablinks.children().length ? 0 : index;
471    tablinks.find('.w-tab-link').eq(index).trigger('click');
472    loop = setInterval(nextTab,5000);
473  });
474
475});
476</script>
476
477
478<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
478
479    
479<script>
480      $(function() {
481        $(".note-wrap-1, .note-wrap-2, .note-wrap-3, .note-wrap-4").draggable({
482        });
483      });
484    </script>
484
485    
486<!-- Import via script src, call the class-->
487<script src="https://kmn2x.csb.app/clock.js"></script>
487
488
489
490<!-- Import via script src, call the class-->
491<script src="https://kmn2x.csb.app/clock.js"></script>
491
492
493<script>
494
495new Clock(); // defaults to the first data-clock in the DOM with EST timezone
496
497new Clock({ selector: "data-clock", hasSeconds: false }); // here in the attribute UTC is set plus an offset
498
499</script>
499</body></html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.