/
404.html
111 lines (98 loc) · 4.3 KB
/
404.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
<title>404</title>
<style type="text/css">
/* RESET
--------------------------------------------------------------------------------------- */
html{background: #f7f5f5 url(../images/paper.jpg) repeat;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin: 0;padding: 0;}table{border-collapse:collapse;border-spacing: 0;}fieldset,img{border: 0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border: 0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;overflow:hidden;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit; resize: none;outline:none;}legend{color:#000;}
body {font-family:"helvetica neue",arial,sans-serif;font-size:10px;color:#211922;}table{font-size:inherit;}pre,code,kbd,samp,tt{font-family:monospace;line-height:100%;}em{font-style:italic;}strong{font-weight:bold;}
/* FOUNDATION
--------------------------------------------------------------------------------------- */
h1 {margin: 32px 0 11px; font-size: 3em;}
h2 {padding: 0 0 8px; font-size: 2.5em;}
h1, h2 {letter-spacing: -0.0125em; font-weight: bold;}
p {margin: 0 0 .8em; line-height: 1.35em;}
a {font-weight: bold; color: #221919; text-decoration: none; outline: none;}
a:hover {color: #cb2027; text-decoration: underline;}
textarea, input {padding: 5px; line-height: 1em; color: #8c7e7e; background: #fcf9f9; border: 1px solid; border-color: #ddd #e1dfdf #d1cdcd; box-shadow: inset 0 0 2px rgba(255,255,255,0.75); -moz-box-shadow: inset 0 0 2px rgba(255,255,255,0.75); -webkit-box-shadow: inset 0 0 2px rgba(255,255,255,0.75);}
textarea:focus, input:focus {background-color: #fff; box-shadow: inset 0 1px 1px rgba(34,29,29,0.1); -moz-box-shadow: inset 0 1px 1px rgba(34,29,29,0.1); -webkit-box-shadow: inset 0 1px 1px rgba(34,29,29,0.1);}
body {
font-size: 24px;
color: #B7AEB4;
}
body a.link,
body h1,
body p {
-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;
}
#wrapper {
text-align: center;
margin: 100px auto;
width: 594px;
}
a.link {
text-shadow: 0px 1px 2px white;
font-weight: 600;
color: #cb2027;
opacity: 0;
}
h1 {
text-shadow: 0px 1px 2px white;
font-size: 24px;
opacity: 0;
}
img {
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
height: 202px;
width: 199px;
opacity: 0;
}
p {
text-shadow: 0px 1px 2px white;
font-weight: normal;
font-weight: 200;
opacity: 0;
}
.fade {
opacity: 1;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
#wrapper {
margin: 40px auto;
text-align: center;
width: 280px;
}
}
</style>
<script src="/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$('document').ready(function() {
if (!$.browser.msie) {
$('img').addClass('fade').delay(800).queue(function(next) {
$('h1, p').addClass('fade');
$('a.link').css('opacity', 1);
next();
});
} else {
$('img, h1, p').addClass('fade');
$('a.link').css('opacity', 1);
}
});
</script>
</head>
<body>
<div id="wrapper">
<a href="/"><img src="/images/404_icon.png"></a>
<div>
<h1>Oops!</h1>
<p>The page you're looking for could not be found.</p>
<a class="link" href="/" onclick="history.go(-1)">Go back?</a>
</div>
</div>
</body>
</html>