Cryptofantasy-site/index.html

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

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="cryptofantasy">
  <meta name="author" content="jwinterm">
  <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico" >
  <title>Cryptofantasy</title>
  <!-- Bootstrap Core CSS -->
  <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!-- Custom Fonts -->
  <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
  <link href='https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
  <!-- Plugin CSS -->
  <link href="vendor/magnific-popup/magnific-popup.css" rel="stylesheet">
  <!-- Theme CSS -->
  <link href="css/creative.css" rel="stylesheet">
  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>

<body id="page-top">
  <nav id="mainNav" class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
      <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="sr-only">Toggle navigation</span> Menu <i class="fa fa-bars"></i>
        </button>
        <a class="navbar-brand page-scroll" href="#page-top">Cryptofantasy</a>
      </div>
      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav navbar-right">
          <li>
            <a class="page-scroll" href="#about">About</a>
          </li>
          <li>
            <a class="page-scroll" href="#services">Services</a>
          </li>
          <li>
            <a class="page-scroll" href="#portfolio">Portfolio</a>
          </li>
          <li>
            <a class="page-scroll" href="#contact">Contact</a>
          </li>
        </ul>
      </div>
      <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
  </nav>

  <header>
    <div class="header-content">
      <div class="header-content-inner">
        <h1 id="homeHeading">Cryptofantasy</h1>
        <hr>
        <h3>Or how I learned to stop worrying and love the alts!</h3>
        <a href="#about" class="btn btn-primary btn-xl page-scroll">Find Out More</a>
      </div>
    </div>
  </header>

  <section class="bg-primary" id="about">
    <div class="container">
      <div class="row">
        <div class="col-lg-8 col-lg-offset-2 text-center">
          <h2 class="section-heading">We've got what you need!</h2>
          <hr class="light">
          <p class="text-faded">Start learning about cryptocurrencies today! Weekly articles on news, notes, and technical discussion, an online work-in-progress book you can contribute to, and a cryptocurrency based game with real crypto prizes!</p>
          <a href="#services" class="page-scroll btn btn-default btn-xl sr-button">Get Started!</a>
        </div>
      </div>
    </div>
  </section>

  <section id="services">
    <div class="container">
      <div class="row">
        <div class="col-lg-12 text-center">
          <h2 class="section-heading">At Your Service</h2>
          <hr class="primary">
        </div>
      </div>
    </div>
    <div class="container">
      <div class="row">
        <div class="col-lg-3 col-md-6 text-center">
          <div class="service-box">
            <a class="page-scroll" href="#portfolio"><i class="fa fa-4x fa-bitcoin text-primary sr-icons"></i></a>
            <h3>Portfolio</h3>
            <p class="text-muted">Coins I hold with a short intro about each.</p>
          </div>
        </div>
        <div class="col-lg-3 col-md-6 text-center">
          <div class="service-box">
            <a href="./walletgen.html"><i class="fa fa-4x fa-qrcode text-primary sr-icons"></i></a>
            <h3>Paper Wallets</h3>
            <p class="text-muted">You can generate paper wallets for coins listed on this site here.</p>
          </div>
        </div>
        <div class="col-lg-3 col-md-6 text-center">
          <div class="service-box">
            <a href="./news.html"><i class="fa fa-4x fa-newspaper-o text-primary sr-icons"></i></a>
            <h3>Up to Date</h3>
            <p class="text-muted">News and opinion pieces on the latest developments in the cryptosphere.</p>
          </div>
        </div>
        <div class="col-lg-3 col-md-6 text-center">
          <div class="service-box">
            <a href="./games.html"><i class="fa fa-4x fa-gamepad text-primary sr-icons"></i></a>
            <h3>Made for fun</h3>
            <p class="text-muted">Crypto-based games to play here and elsewhere.</p>
          </div>
        </div>
      </div>
    </div>
  </section>

  <section class="no-padding" id="portfolio">
    <div class="container">
      <div class="row">
        <div class="col-lg-12 text-center">
          <h2 class="section-heading">Coin Portfolio</h2>
          <hr class="primary">
        </div>
      </div>
    </div>
    <div class="container-fluid">
      <div class="row no-gutter">
        <div class="col-lg-3 col-sm-3">
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/bitcoin.html" class="portfolio-box">
            <img src="img/portfolio/Bitcoin.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Bitcoin
                </div>
                <div class="project-name">
                  Ol' Grandaddy
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/monero.html" class="portfolio-box">
            <img src="img/portfolio/Monero.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Monero
                </div>
                <div class="project-name">
                  The Dark Horse
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/vertcoin.html" class="portfolio-box">
            <img src="img/portfolio/Vertcoin.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Vertcoin
                </div>
                <div class="project-name">
                  Mean Green
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/aeon.html" class="portfolio-box">
            <img src="img/portfolio/Aeon.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Aeon
                </div>
                <div class="project-name">
                  It's a Lifestyle
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/litecoin.html" class="portfolio-box">
            <img src="img/portfolio/Litecoin.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Litecoin
                </div>
                <div class="project-name">
                  Something Something Silver
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/decred.html" class="portfolio-box">
            <img src="img/portfolio/Decred.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Decred
                </div>
                <div class="project-name">
                  Future Overlords
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-3 col-sm-3">
        </div>
      </div>
    </div>
    <div class="container-fluid">
      <div class="row no-gutter">
        <div class="col-lg-3 col-sm-3">
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/myriad.html" class="portfolio-box">
            <img src="img/portfolio/Myriad.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Myriad
                </div>
                <div class="project-name">
                  A Coin for Everyone
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/groestlcoin.html" class="portfolio-box">
            <img src="img/portfolio/Groestlcoin.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Groestlcoin
                </div>
                <div class="project-name">
                  It's What's for Dinner
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/byteball.html" class="portfolio-box">
            <img src="img/portfolio/Byteball.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Byteball
                </div>
                <div class="project-name">
                  Moondrop
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/pepecash.html" class="portfolio-box">
            <img src="img/portfolio/Pepecash.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Pepecash
                </div>
                <div class="project-name">
                  Rare Pepes on the Blockchain
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/unitus.html" class="portfolio-box">
            <img src="img/portfolio/Unitus.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Unitus
                </div>
                <div class="project-name">
                  E Pluribus Unum
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-1 col-sm-1">
          <a href="portfolio/nyancoin.html" class="portfolio-box">
            <img src="img/portfolio/Nyancoin.png" class="img-responsive" alt="">
            <div class="portfolio-box-caption">
              <div class="portfolio-box-caption-content">
                <div class="project-category text-faded">
                  Nyancoin
                </div>
                <div class="project-name">
                  Poptart Cat
                </div>
              </div>
            </div>
          </a>
        </div>
        <div class="col-lg-3 col-sm-3">
        </div>
      </div>
    </div>
  </section>

  <aside class="bg-white">
  </aside>

  <aside class="bg-dark">
    <div class="container text-center">
      <div class="call-to-action">
        <h2></h2>
        <a href="" class="btn btn-default btn-xl sr-button">Does nothing!</a>
      </div>
    </div>
  </aside>

  <section id="contact">
    <div class="container">
      <div class="row">
        <div class="col-lg-8 col-lg-offset-2 text-center">
          <h2 class="section-heading">Let's Get In Touch!</h2>
          <hr class="primary">
          <p>You can ping me at any of the places below.</p>
        </div>
        <div class="col-lg-2 col-lg-offset-2 text-center">
          <a href="https://www.reddit.com/user/jwinterm/">
            <i class="fa fa-reddit fa-3x sr-contact"></i>
            <p>/u/jwinterm</p>
          </a>
        </div>
        <div class="col-lg-2 text-center">
          <a href="https://bitcointalk.org/index.php?action=profile;u=223368;sa=summary">
            <i class="fa fa-btc fa-3x sr-contact"></i>
            <p>bitcointalk.org</p>
          </a>
        </div>
        <div class="col-lg-2 text-center">
          <a href="https://twitter.com/jwgealt">
            <i class="fa fa-twitter fa-3x sr-contact"></i>
            <p>@jwgealt</p>
          </a>
        </div>
        <div class="col-lg-2 text-center">
          <a href="mailto:jwinterm@tutanota.com">
            <i class="fa fa-envelope-o fa-3x sr-contact"></i>
            <p>jwinterm@tutanota.com</p>
          </a>
        </div>
      </div>
    </div>
  </section>

  <!-- jQuery -->
  <script src="vendor/jquery/jquery.min.js"></script>
  <!-- Bootstrap Core JavaScript -->
  <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
  <!-- Plugin JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
  <script src="vendor/scrollreveal/scrollreveal.min.js"></script>
  <script src="vendor/magnific-popup/jquery.magnific-popup.min.js"></script>
  <!-- Theme JavaScript -->
  <script src="js/creative.min.js"></script>
</body>

</html>