chore: Update .htaccess to block access to .git directory and add cus…

…tom 404 page

.htaccess

@@ -1,3 +1,4 @@
-# Block access to .git directory
-RedirectMatch 404 /\.git
-Options -Indexes
+# Block access to .git directory
+RedirectMatch 404 /\.git
+Options -Indexes
+ErrorDocument 404 /404/index.html

404/.gitignore

@@ -0,0 +1,7 @@
+.DS_Store
+.svn
+log/*.log
+tmp/**
+dist
+netmag_files
+netmag.html

404/LICENSE

@@ -0,0 +1,19 @@
+Copyright (C) 2011 Hakim El Hattab, http://hakim.se
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

404/README.md

@@ -0,0 +1,11 @@
+# 404
+
+This 404 page was created for netmagazine.com. 
+
+[Check out the demo](http://hakim.se/experiments/html5/404) or see how it looked in context on [netmagazine.com](http://hakim.se/experiments/html5/404/netmag.html).
+
+# License
+
+MIT licensed
+
+Copyright (C) 2011 Hakim El Hattab, http://hakim.se

404/css/404.css

@@ -0,0 +1,25 @@
+#fof {
+	margin: 20px 0 120px;
+	text-align: center;
+}
+
+#fof div {
+	position: fixed;
+	width: 100%;
+	height: 100%;
+	top: 0;
+	left: 0;
+
+	background: #000;
+}
+
+#fof canvas,
+#fof img {
+	position: relative;
+	width: 960px;
+	height: 480px;
+	margin-bottom: 20px;
+	z-index: 1;
+
+	background: #000;
+}

404/css/main.css

@@ -0,0 +1,68 @@
+/**
+ * @author Hakim El Hattab
+ */
+
+
+/*********************************************
+ * GLOBAL STYLES
+ *********************************************/
+
+html, body {
+	width: 100%;
+	height: 100%;
+	overflow: hidden;
+
+	background: #000;
+	color: #000;
+
+	font-family: 'Molengo', Arial, Helvetica, sans-serif;
+}
+
+
+/*********************************************
+ * EXPERIMENTS HEADER
+ *********************************************/
+
+a {
+	color: rgb(220,200,150);
+}
+
+header {
+	padding: 10px 0;
+	z-index: 999;
+
+	height: 20px;
+	width: 100%;
+
+	background: rgba(0,0,0,0.7);
+}
+
+header>div {
+	float: right;
+	margin-right: 10px;
+}
+
+header div.facebook-button {
+	top: 1px;
+}
+
+header a {
+	float: left;
+	font-size: 14px;
+	color: #eee;
+	margin-left: 10px;
+}
+
+/*********************************************
+ * CONTENTS
+ *********************************************/
+
+#fof {
+	margin-top: 40px;
+	text-align: center;
+}
+
+
+
+
+

404/css/reset.css

@@ -0,0 +1,57 @@
+/* http://meyerweb.com/eric/tools/css/reset/ 
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed, 
+figure, figcaption, footer, header, hgroup, 
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure, 
+footer, header, hgroup, menu, nav, section {
+	display: block;
+}
+body {
+	line-height: 1;
+}
+ol, ul {
+	list-style: none;
+}
+blockquote, q {
+	quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+	content: '';
+	content: none;
+}
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+
+
+/* HTML5BP:
+   These selection declarations have to be separate.
+   No text-shadow: twitter.com/miketaylr/status/12228805301
+   Also: hot pink. */
+::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
+::selection { background:#FF5E99; color:#fff; text-shadow: none; }
+

404/index.html

@@ -0,0 +1,21 @@
+<!doctype html>  
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+
+		<title>404</title>
+
+		<link rel="stylesheet" href="css/reset.css">
+		<link rel="stylesheet" href="css/404.css">
+		<link rel="stylesheet" href="css/main.css">
+
+	<body>
+		<div id="fof">
+			<div></div>
+			<canvas></canvas>
+		</div>
+
+		<script src="js/404.js"></script>
+
+	</body>
+</html>