<!DOCTYPE html>
<html lang="en">
<head>

  <!-- Page Information
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <meta charset="utf-8">
  <title>LittleLink</title>
  <meta name="description" content="">
  <meta name="author" content="">

  <!-- Mobile Specific Metas
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- FONT
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600,800&display=swap" rel="stylesheet">

  <!-- CSS
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/skeleton-light.css">
  <link rel="stylesheet" href="css/brands.css">

  <!-- Favicon
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <link rel="icon" type="image/png" href="images/avatar.png">

</head>
<body>

  <!-- Primary Page Layout
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <div class="container">
    <div class="row">
      <div class="column" style="margin-top: 10%">
        <!-- Your Image Here -->
        <img src="images/avatar.png" srcset="images/avatar@2x.png 2x">

        <!-- Your Name -->
        <h1>LittleLink</h1>

        <!-- Short Bio -->
        <p>LittleLink is an open source DIY alternative to services like <a href="https://linktr.ee">Linktree</a> and <a href="https://many.link">many.link</a>. LittleLink was built using <a href="http://www.getskeleton.com">Skeleton</a>, a dead simple, responsive boilerplate — we’ve just created some branded buttons and stripped out the things you won't need. 😊</p>
        
        <!-- Replace # with your profile URL. Delete whatever you don't need & create your own brand styles in css/brands.css -->  


        <!-- Github -->
        <a class="button button-github" href="#"><img class="icon" src="icons/github.svg">Github</a>
          <br>
        
        <!-- Twitter -->
        <a class="button button-twitter" href="#"><img class="icon" src="icons/twitter.svg">Twitter</a>
          <br>

        <!-- Instagram -->
        <a class="button button-instagram" href="#"><img class="icon" src="icons/instagram.svg">Instagram</a>
          <br>

        <!-- Facebook -->
        <a class="button button-facebook" href="#"><img class="icon" src="icons/facebook.svg">Facebook</a>
          <br>

        <!-- LinkedIn -->
        <a class="button button-linkedin" href="#"><img class="icon" src="icons/linkedin.svg">LinkedIn</a>
          <br>

        <!-- YouTube -->
        <a class="button button-youtube" href="#"><img class="icon" src="icons/youtube.svg">YouTube</a>
          <br> 

        <!-- Snapchat -->
        <a class="button button-snapchat" href="#"><img class="icon" src="icons/snapchat.svg">Snapchat</a>
          <br>

        <!-- Spotify -->
        <a class="button button-spotify" href="#"><img class="icon" src="icons/spotify.svg">Spotify</a>
          <br>      
          
        <!-- Reddit -->
        <a class="button button-reddit" href="#"><img class="icon" src="icons/reddit.svg">Reddit</a>
          <br>   
          
         <!-- Rocketseat -->
         <a class="button button-rocketseat" href="#"><img class="icon" src="icons/rocketseat.svg">Rocketseat</a>
         <br>   

        <!-- Medium -->
        <a class="button button-medium" href="#"><img class="icon" src="icons/medium.svg">Medium</a>
          <br> 

        <!-- Pinterest -->
        <a class="button button-pinterest" href="#"><img class="icon" src="icons/pinterest.svg">Pinterest</a>
          <br>

        <!-- SoundCloud -->
        <a class="button button-soundcloud" href="#"><img class="icon" src="icons/soundcloud.svg">SoundCloud</a>
          <br>        
         
        <!-- Spectrum -->
        <a class="button button-spectrum" href="#"><img class="icon" src="icons/spectrum.svg">Spectrum</a>
          <br>          

        <!-- Figma -->
        <a class="button button-figma" href="#"><img class="icon" src="icons/figma.svg">Figma</a>
          <br>

        <!-- Kit -->
        <a class="button button-kit" href="#"><img class="icon" src="icons/kit.svg">Kit</a>
          <br>          

        <!-- Telegram -->
        <a class="button button-telegram" href="#"><img class="icon" src="icons/telegram.svg">Telegram</a>
          <br>          

        <!-- Tumblr -->
        <a class="button button-tumblr" href="#"><img class="icon" src="icons/tumblr.svg">Tumblr</a>
          <br>

        <!-- Steam -->
        <a class="button button-steam" href="#"><img class="icon" src="icons/steam.svg">Steam</a>
          <br>

        <!-- Discord -->
        <a class="button button-discord" href="#"><img class="icon" src="icons/discord.svg">Discord</a>
          <br>

        <!-- Twitch -->
        <a class="button button-twitch" href="#"><img class="icon" src="icons/twitch.svg">Twitch</a>
          <br>

        <!-- Mixer -->
        <a class="button button-mixer" href="#"><img class="icon" src="icons/mixer.svg">Mixer</a>
          <br>
          <br>
        <p>Build your own by forking <a href="https://littlelink.io">LittleLink</a>.</p>
          
      </div>
    </div>
  </div>

<!-- End Document
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
</body>
</html>