<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>404</title>
  <meta name="keywords" content="Hexo,404,Design">
  <meta name="description" content="Tribute Forrest Gump">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <style>
    html,figure {
      margin: 0;
      padding: 0;
      overflow-x: hidden;
    }
    body{
      margin: 20px;
      overflow: hidden;
    }
    h1,h3{
      width: 100%;
      text-align: center;
    }
    .forrestgump img{
      width: 50rem;
      margin-left: 50%;
      transform: translateX(-50%);
    }
    @media screen and (max-width: 768px){
      .forrestgump img{
      width: 100%;
    }
  </style>
</head>
<body>
<div class="notfound">
  <a class="notfound-link" href="/">
    <img width="30" src="data:image/svg+xml;base64,PHN2ZyB0PSIxNTYyODQyNjI3NDA5IiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcC1pZD0iNTIxNDgiIHdpZHRoPSI4MDAiIGhlaWdodD0iODAwIj48cGF0aCBkPSJNMTk0LjYgNDc5LjFoNzQ5LjF2NTcuNkgxODYuNEw1MjggODc4LjMgNDg3LjMgOTE5IDEyMSA1NTIuNyA4MC4zIDUxMmw0MDctNDA3IDQwLjcgNDAuN3oiIGZpbGw9IiIgcC1pZD0iNTIxNDkiLz48L3N2Zz4=">
  </a>
  <figure class="forrestgump">
    <figcaption>
      <h1 style="color: #6b0b0c;">404<br>Not Found!</h1>
      <h3 style="color: #14206a;">Life was like a journey on the sea, you never know what you're going to get.</h3>
    </figcaption>
    <img src="/images/404.jpg">
  </figure>
</div>
</body>
</html>