<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">

    <link rel="stylesheet" href="style.css">
    <link rel="icon" href="favicon.png" type="image/x-icon">
    <title>Felix Pankratz</title>
  </head>
<body>
    <center>
		<div class="headline">
			<h1>Felix Pankratz</h1>
		</div>
        <nav class="navbar navbar-expand-sm navbar-inverse">

          <!-- Links -->
          <ul class="navbar-nav">
            <li class="nav-item active">
              <a class="nav-link" href="https://felixpankratz.de">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="https://felixpankratz.de/projects.html">Projects</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="https://felixpankratz.de/chat/">Chat</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="https://felixpankratz.de/ez/index.php">Monitoring</a>
            </li>
            <li class="nav-item" >
              <a class="nav-link" href="https://felixpankratz.de/disclaimer.html">Disclaimer</a>
            </li>
          </ul>

        </nav>
		<img style="border:5px solid #136D9E;border-radius: 75px" src="portrait.png" alt="portrait" height="150" width="150">
		<div class="bio">
			<h2> Overview </h2>
			<p>Welcome to my homepage. I'm a system administrator/software developer in training, living in Germany.
			I graduated highschool in 2015, at the Markgrälfer Gymnasium Müllheim. My skills include knowledge of JavaScript, Delphi, and a bit of webdev. In my spare time I enjoy making hardware projects with Arduino-like devices, aswell as tinkering around with this very server.
			</p>
		</div>
		<div class="linklist">
			<h2> Links </h2>
			<a href="http://github.com/panki27">My GitHub Page</a>
		</div>
		<br/>
		<div class="social">
			<h2> Find me on social media: </h2>
			<p> 
				<a href="https://www.facebook.com/felix.pankratz">Facebook</a> | <a href="https://www.instagram.com/panki27/">Instagram</a>  
			</p>
		</div>
	</center>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
  </body>
  <footer>
		<div class="footer">
			<p> (c) 2018 Felix Pankratz | <a href="mailto:mail@felixpankratz.de">Contact</a> </p>
		</div>
  </footer>
</html>