<!DOCTYPE html>
<html>
  <head>
    <title>Fahad Ibnay Heylaal</title>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.0/css/bulma.min.css" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

    <style>
    @import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,800');

    html,
    body {
      height: 100%;
    }

    section.hero {
      background: #4568DC;
      background: -webkit-linear-gradient(to left, #4568DC , #B06AB3);
      background: linear-gradient(to left, #4568DC , #B06AB3);
    }

    .avatar img {
      width: 120px;
      border-radius: 50%;
      border: 3px solid #444;
    }

    .info {
      color: #eee;
      font-family: 'Montserrat', sans-serif;
    }
    .info .name {
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 3px;
      font-size: 24px;
      margin-top: 15px;
    }
    .info .location {
      font-weight: 600;
      font-size: 14px;
      margin-top: 15px;
    }

    .social-links { font-size: 18px; margin-top: 20px; }
    .social-links a { padding: 3px; }
    .social-links i { border-radius: 4px; }
    .social-links .twitter .fa { background-color: #4da7de; }
    .social-links .github .fa { background-color: #222; }
    .social-links .google-plus .fa { background-color: #dd4b39; }
    .social-links .facebook .fa { background-color: #3e5b98; }
    .social-links .linkedin .fa { background-color: #3371b7; }
    .social-links .medium .fa { background-color: #02b875; }
    </style>
  </head>

  <body>
    <section class="hero is-fullheight">
      <div class="hero-body">
        <div class="container has-text-centered">
          <div class="title">
            <div class="content">
              <div class="avatar">
                <img alt="fahad19" src="https://avatars0.githubusercontent.com/u/20046?v=3&s=400" />
              </div>

              <div class="info">
                <div class="name">Fahad Ibnay Heylaal</div>

                <div class="location">Amsterdam, The Netherlands</div>
              </div>

              <div class="social-links">
                <a href="https://twitter.com/fahad19" title="Twitter" class="twitter">
                  <span class="fa-stack fa-lg">
                    <i class="fa fa-twitter fa-stack-1x fa-inverse"></i>
                  </span>
                </a>

                <a href="http://www.linkedin.com/in/fahad19" title="LinkedIn" class="linkedin">
                  <span class="fa-stack fa-lg">
                    <i class="fa fa-linkedin fa-stack-1x fa-inverse"></i>
                  </span>
                </a>

                <a href="https://github.com/fahad19" title="GitHub" class="github">
                  <span class="fa-stack fa-lg">
                    <i class="fa fa-github fa-stack-1x fa-inverse"></i>
                  </span>
                </a>

                <!--<a href="#" class="facebook">
                  <span class="fa-stack fa-lg">
                    <i class="fa fa-facebook fa-stack-1x fa-inverse"></i>
                  </span>
                </a>-->

                <a href="https://medium.com/@fahad19" title="Medium" class="medium">
                  <span class="fa-stack fa-lg">
                    <i class="fa fa-medium fa-stack-1x fa-inverse"></i>
                  </span>
                </a>

                <a href="https://plus.google.com/+FahadIbnayHeylaal" title="Google+" class="google-plus">
                  <span class="fa-stack fa-lg">
                    <i class="fa fa-google-plus fa-stack-1x fa-inverse"></i>
                  </span>
                </a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

    <script>
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

      ga('create', 'UA-47493443-1', 'auto');
      ga('send', 'pageview');

    </script>
  </body>
</html>


