-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path404.html
1 lines (1 loc) · 4.3 KB
/
404.html
1
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"><meta name="title" content="Wesley Black"><link rel="canonical" href="https://wesleyblack.ca"><meta property="og:type" content="website"><meta property="og:url" content="https://wesleyblack.github.io/portfolio/"><meta property="og:title" content="Wesley Black — Graphic Design and Web"><meta property="og:description" content="Wesley Black is a Graphic Designer based in Halifax, NS. He is a recent graduate of the NSCC Graphic Design program. In his free time he enjoys cooking and learning new things."><meta property="og:image" content="images/gradients/meta-image.jpg"><meta property="twitter:card" content="summary_large_image"><meta property="twitter:url" content="https://wesleyblack.github.io/portfolio/"><meta property="twitter:title" content="Wesley Black — Graphic Design and Web"><meta property="twitter:description" content="Wesley Black is a Graphic Designer based in Halifax, NS. He is a recent graduate of the NSCC Graphic Design program. In his free time he enjoys cooking and learning new things."><meta property="twitter:image" content="images/gradients/meta-image.jpg"><title>404 | Wesley Black</title><link rel="icon" type="image/png" href="images/icons/16.png" sizes="16x16"><link rel="icon" type="image/png" href="images/icons/32.png" sizes="32x32"><link rel="icon" type="image/png" href="images/icons/192.png" sizes="192x192"><link rel="stylesheet" href="style/style.css"><style>h1{position:relative;animation:glitch1 5s infinite;z-index:3}h1:nth-child(2){position:absolute;left:0;top:0;color:#47c7f0;animation:glitch2 5s infinite;z-index:1}h1:nth-child(3){position:absolute;left:0;top:0;color:#e459a0;animation:glitch3 5s infinite;z-index:2}h4 a{animation:glitch1 5s infinite}@keyframes glitch1{0%{transform:none;opacity:1}3.15%{transform:skew(-0.5deg,-0.9deg);opacity:0.75}4.5%{transform:none;opacity:1}12.15%{transform:none;opacity:1}13.5%{transform:skew(0.8deg,-0.1deg);opacity:0.75}15.75%{transform:none;opacity:1}22.5%{transform:none;opacity:1}23.4%{transform:none;opacity:1}24.75%{transform:skew(-1deg,0.2deg);opacity:0.75}32.4%{transform:none;opacity:1}33.75%{transform:skew(0.4deg,1deg);opacity:0.75}45%{transform:none;opacity:1}100%{transform:none;opacity:1}}@keyframes glitch2{0%{transform:none;opacity:0.25}3.15%{transform:translate(-2px,-3px);opacity:0.5}4.5%{transform:none;opacity:0.25}12.15%{transform:none;opacity:0.25}13.5%{transform:translate(-5px,-2px);opacity:0.5}15.75%{transform:none;opacity:0.25}22.5%{transform:none;opacity:0.25}23.4%{transform:none;opacity:0.25}24.75%{transform:translate(-5px,-1px);opacity:0.5}32.4%{transform:none;opacity:0.25}33.75%{transform:translate(-2px,-6px);opacity:0.5}45%{transform:none;opacity:0.25}100%{transform:none;opacity:0.25}}@keyframes glitch3{0%{transform:none;opacity:0.25}3.15%{transform:translate(2px,3px);opacity:0.5}4.5%{transform:none;opacity:0.25}12.15%{transform:none;opacity:0.25}13.5%{transform:translate(5px,2px);opacity:0.5}15.75%{transform:none;opacity:0.25}22.5%{transform:none;opacity:0.25}23.4%{transform:none;opacity:0.25}24.75%{transform:translate(5px,1px);opacity:0.5}32.4%{transform:none;opacity:0.25}33.75%{transform:translate(2px,6px);opacity:0.5}45%{transform:none;opacity:0.25}100%{transform:none;opacity:0.25}}</style><link href="https://fonts.googleapis.com/css2?family=Heebo:wght@300;700&family=Roboto:wght@100&display=swap" rel="stylesheet"></head><body><div id="wrapper"> <nav><div class="side-nav" id="side-nav"><div onclick="toggleMenu()" class="toggle-menu" id="toggle-menu"> <img src="images/icons/menu.svg" alt="Menu" class="menu-button hover pointer" id="menu-button"> <img src="images/icons/close.svg" alt="Close" class="menu-close hover pointer" id="menu-close"></div> <a href="/" class="nav-icon"> <img src="images/icons/logo.svg" alt="Logo" class="nav-logo"> </a><div class="links" id="links"> <a href="/">Home</a> <a href="/about">About</a> <a href="/portfolio">Portfolio</a> <a href="/contact">Contact</a></div></div> </nav><div class="split-text" id="split-text"><div><h1>404</h1><h1>404</h1><h1>404</h1></div><h4>Sorry, it looks like you are in the wrong place. <br> While you are here you should check out some of my <a href="/portfolio">work</a></h4></div></div> <script type="text/javascript" src="scripts/menu.js"></script> </body></html>