2025-07-06 00:07:14 +02:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="de">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
|
<title>Elias Kohout</title>
|
|
|
|
|
|
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
|
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
|
|
|
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&display=swap" rel="stylesheet">
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
html, body {
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
height: 100%;
|
|
|
|
|
background: #000;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
font-family: 'Geist Mono', sans-serif;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.background {
|
|
|
|
|
position: fixed;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
top: 0;
|
|
|
|
|
left: 0;
|
|
|
|
|
z-index: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
svg {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
filter: blur(1px) brightness(1.2);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.flow-path {
|
|
|
|
|
fill: none;
|
|
|
|
|
stroke: white;
|
|
|
|
|
stroke-width: 1;
|
|
|
|
|
stroke-opacity: 0.20;
|
|
|
|
|
stroke-dasharray: 1500;
|
|
|
|
|
stroke-dashoffset: 0;
|
|
|
|
|
animation: flow 12s ease-in-out infinite alternate;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.glow {
|
|
|
|
|
stroke-opacity: 0.12;
|
|
|
|
|
filter: url(#glow);
|
|
|
|
|
animation-duration: 18s;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.flow-path:nth-child(3n) {
|
|
|
|
|
animation-delay: 2s;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.flow-path:nth-child(4n) {
|
|
|
|
|
animation-delay: 4s;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@keyframes flow {
|
|
|
|
|
0% {
|
|
|
|
|
stroke-dashoffset: 0;
|
|
|
|
|
}
|
|
|
|
|
100% {
|
|
|
|
|
stroke-dashoffset: 3000;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.centered {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 50%;
|
|
|
|
|
left: 50%;
|
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
|
text-align: center;
|
|
|
|
|
z-index: 1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.centered h1 {
|
|
|
|
|
font-size: 3.5rem;
|
|
|
|
|
margin-bottom: 1.5rem;
|
|
|
|
|
letter-spacing: 4px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.centered nav {
|
|
|
|
|
text-align: center;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.centered nav a {
|
|
|
|
|
display: block;
|
|
|
|
|
margin: 0.3rem 0;
|
|
|
|
|
color: #ccc;
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
font-size: 1.1rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.centered nav a:hover {
|
|
|
|
|
color: #ff3c3c;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div class="background">
|
|
|
|
|
<svg viewBox="0 0 1600 1200" preserveAspectRatio="xMidYMid slice">
|
|
|
|
|
<defs>
|
|
|
|
|
<filter id="glow">
|
|
|
|
|
<feGaussianBlur stdDeviation="6" result="blur" />
|
|
|
|
|
<feMerge>
|
|
|
|
|
<feMergeNode in="blur"/>
|
|
|
|
|
<feMergeNode in="SourceGraphic"/>
|
|
|
|
|
</feMerge>
|
|
|
|
|
</filter>
|
|
|
|
|
</defs>
|
|
|
|
|
|
|
|
|
|
<path class="flow-path glow" d="M0,600 Q400,100 800,600 T1600,600" />
|
|
|
|
|
<path class="flow-path" d="M0,500 Q400,200 800,500 T1600,500" />
|
|
|
|
|
<path class="flow-path glow" d="M0,700 Q400,400 800,700 T1600,700" />
|
|
|
|
|
<path class="flow-path" d="M0,300 Q400,0 800,300 T1600,300" />
|
|
|
|
|
<path class="flow-path glow" d="M0,900 Q400,800 800,900 T1600,900" />
|
|
|
|
|
<path class="flow-path" d="M0,1000 Q400,1000 800,1000 T1600,1000" />
|
|
|
|
|
<path class="flow-path glow" d="M0,1100 Q400,1200 800,1100 T1600,1100" />
|
|
|
|
|
<path class="flow-path" d="M0,200 Q400,400 800,200 T1600,200" />
|
|
|
|
|
<path class="flow-path glow" d="M0,100 Q400,300 800,100 T1600,100" />
|
|
|
|
|
</svg>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<main class="centered">
|
|
|
|
|
<h1>Elias Kohout</h1>
|
|
|
|
|
<nav>
|
|
|
|
|
<a href="https://e.eliaskohout.de">[e]lement web</a>
|
|
|
|
|
<a href="https://g.eliaskohout.de">[g]itea</a>
|
|
|
|
|
<a href="https://gr.eliaskohout.de">[gr]afana</a>
|
|
|
|
|
<a href="https://n.eliaskohout.de">[n]tfy</a>
|
2025-07-06 11:40:31 +02:00
|
|
|
<a href="https://o.eliaskohout.de">[o]pen webui</a>
|
2025-07-06 00:07:14 +02:00
|
|
|
<a href="https://p.eliaskohout.de">[p]ocket id</a>
|
|
|
|
|
<a href="https://r.eliaskohout.de">[r]ezepte</a>
|
|
|
|
|
<a href="https://s.eliaskohout.de">[s]ynapse</a>
|
|
|
|
|
</nav>
|
|
|
|
|
</main>
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|
|
