<html lang="de">
<head>
    <title>Sven Moderow</title>
	<meta name="robots" content="index,follow">
	<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
	<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
	<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
	<link rel="manifest" href="/site.webmanifest">
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Rock+Salt&display=swap">
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.1/css/brands.min.css">
    	<style nonce="12031978">
		
		* {
		  margin: 0;
		  padding: 0;
		  font-size: inherit;
		  color: inherit;
		  box-sizing: inherit;
		  -webkit-font-smoothing: antialiased;
		}

		html {
		  box-sizing: border-box;
		}

		body {
		  background-color: #ecf0f1;
		  min-width: 300px;
		  font-family: "Open Sans", sans-serif;
		  font-size: 16px;
		}

		a {
		  text-decoration: none;
		}
				
		i.fa-brands {
			font-style: normal;
		}
		
		.social-btns {
		  height: 90px;
		  margin: 180px auto 90px auto;
		  text-align: center;
		}
		
		.social-btns .btn,
		.social-btns .btn:before,
		.social-btns .btn .fa-brands {
		  transition: all 0.35s;
		  transition-timing-function: cubic-bezier(0.31, -0.105, 0.43, 1.59);
		}
		
		.social-btns .btn:before {
		  top: 90%;
		  left: -110%;
		}
		
		.social-btns .btn .fa-brands {
		  transform: scale(0.8);
		}
		
		.social-btns .btn.facebook:before {
		  background-color: #3b5998;
		}
		
		.social-btns .btn.facebook .fa-brands {
		  color: #3b5998;
		}
		
		.social-btns .btn.twitter:before {
		  background-color: #3cf;
		}
		
		.social-btns .btn.twitter .fa-brands {
		  color: #3cf;
		}
		
		.social-btns .btn.steam:before {
		  background-color: #171a21;
		}
		
		.social-btns .btn.steam .fa-brands {
		  color: #171a21;
		}
		
		.social-btns .btn.github:before {
		  background-color: #24292f;
		}
		
		.social-btns .btn.github .fa-brands {
		  color: #000;
		}
		
		.social-btns .btn.instagram:before {
		  background-color: #E1306C;
		}
		
		.social-btns .btn.instagram .fa-brands {
		  color: #E1306C;
		}
		
		.social-btns .btn.linkedin:before {
		  background-color: #0a66c2;
		}
		
		.social-btns .btn.linkedin .fa-brands {
		  color: #0a66c2;
		}
		
		.social-btns .btn.xing:before {
		  background-color: rgb(6, 152, 160);
		}
		
		.social-btns .btn.xing .fa-brands {
		  color: rgb(6, 152, 160);
		}
		
		.social-btns .btn.xbox:before {
		  background-color: #107c10;
		}
		
		.social-btns .btn.xbox .fa-brands {
		  color: #107c10;
		}
		
		.social-btns .btn:focus:before,
		.social-btns .btn:hover:before {
		  top: -10%;
		  left: -10%;
		}
		
		.social-btns .btn:focus .fa-brands,
		.social-btns .btn:hover .fa-brands {
		  color: #fff;
		  transform: scale(1);
		}
		
		.social-btns .btn {
		  display: inline-block;
		  background-color: #fff;
		  width: 90px;
		  height: 90px;
		  line-height: 90px;
		  margin: 10px;
		  text-align: center;
		  position: relative;
		  overflow: hidden;
		  border-radius: 28%;
		  box-shadow: 0 5px 15px -5px rgba(0,0,0,0.1);
		  opacity: 0.99;
		}
		
		.social-btns .btn:before {
		  content: '';
		  width: 120%;
		  height: 120%;
		  position: absolute;
		  transform: rotate(45deg);
		  z-index: -1;
		}
		
		.social-btns .btn .fa-brands {
		  font-size: 38px;
		  vertical-align: middle;
		}
		
		.me {
		  height: 256px;
		  margin: 64px auto 128px auto;
		  text-align: center;
		}
		
		.me .portrait img {
			height: 100%;
			max-height: 256px;
			width: auto;
			background-color: #fff;
			border-radius: 28%;
			box-shadow: 0 5px 15px -5px rgba(0,0,0,0.1);
		}
		
		.me .name,
		.me .text {
			font-family: 'Rock Salt', cursive;
		}
		
		.me .name {
			font-size: 32px;
		}
		
		.me .text {
			font-size: 21px;
		}

	        .contact {
			margin: 180px auto 90px auto;
		}
    	</style>
</head>

<body>
	<div class="me">
		<div class="portrait">
			<img src="/me.png" />
		</div>
		<div class="name">
			Sven Moderow
		</div>
		<div class="text">
			kann hier gefunden werden:
		</div>
	</div>
	<div class="social-btns">
		<a class="btn linkedin" href="https://www.linkedin.com/in/sven-moderow/"><i class="fa-brands fa-linkedin-in"></i></a>
		<a class="btn xing" href="https://www.xing.com/profile/Sven_Moderow/cv"><i class="fa-brands fa-xing"></i></a>
		<a class="btn github" href="https://github.com/DarthSonic"><i class="fa-brands fa-github"></i></a>
		<a class="btn facebook" href="https://www.facebook.com/SvenModerow"><i class="fa-brands fa-facebook-f"></i></a>
		<a class="btn instagram" href="https://www.instagram.com/svenm_123/"><i class="fa-brands fa-instagram"></i></a>
		<a class="btn steam" href="https://steamcommunity.com/id/DarthSonic/"><i class="fa-brands fa-steam"></i></a>
		<a class="btn xbox" href="http://live.xbox.com/Profile?DarthSonic"><i class="fa-brands fa-xbox"></i></a>
	</div>
	<div class="contact">
		<div data-tf-live="01J08TXWY79R0W3YHHHB49S14N"></div><script src="//embed.typeform.com/next/embed.js"></script>
	</div>
</body>
</html>
