Ajax Loader
HTML
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
3
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
4
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
5
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
6
<head>
7
 
8
  <!-- Basic Page Needs
9
  ================================================== -->
10
  <meta charset="utf-8">
11
  <title>Simply 404</title>
12
  <meta name="description" content="">
13
  <meta name="author" content="">
14
  <meta name="viewport" content="width=device-width">
15
 
16
  <!-- Mobile Specific Metas
17
  ================================================== -->
18
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
19
 
20
  <!-- CSS
21
  ================================================== -->
22
 
23
  <!--[if lt IE 9]>
24
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
25
  <![endif]-->
26
 
27
  <!-- Fonts
28
  ================================================== -->
29
  <link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400' rel='stylesheet' type='text/css'>
30
  <link href='http://fonts.googleapis.com/css?family=Changa+One' rel='stylesheet' type='text/css'>
31
</head>
32
<body>
33
<div class="comingcontainer">
34
    <div class="checkbacksoon">
35
    <p>
36
      <span class="go3d">4</span>
37
      <span class="go3d">0</span>
38
      <span class="go3d">4</span>
39
      
40
    </p>
41
        
42
        <p class="error">
43
      Looks like you have taken a wrong turn. Don't worry, it happens to the best of us. <br >
44
          The links below will help you get back on the right path.<br />
45
          Download this theme at <a href="http://fwpolice.com/coded/simply-404/">The Fireworks Police</a>.
46
        </p>
47
        
48
        <nav>
49
            <ul>
50
                <li><a href="#">Home</a></li>
51
                <li><a href="#">About</a></li>
52
                <li><a href="#">Gallery</a></li>
53
                <li><a href="#">Blog</a></li>
54
                <li><a href="#">Support</a></li>
55
            </ul>
56
        </nav>
57
    
58
  </div>
59
</div>
60
 
61
</body>
62
</html>
 
CSS
/* ==================================================
1
/* ==================================================
2
* Theme: Simply 404
3
* Author: The Fireworks Police
4
* Website: www.fwpolice.com
5
================================================== */
6
 
7
/*------------------------------------------------*/
8
/*-----------------[RESET]------------------------*/
9
/*------------------------------------------------*/
10
 
11
/* http://meyerweb.com/eric/tools/css/reset/ */
12
/* v1.0 | 20080212 */
13
 
14
html, body, div, span, applet, object, iframe,
15
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
16
a, abbr, acronym, address, big, cite, code,
17
del, dfn, em, font, img, ins, kbd, q, s, samp,
18
small, strike, strong, sub, sup, tt, var,
19
b, u, i, center,
20
dl, dt, dd, ol, ul, li,
21
fieldset, form, label, legend { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
22
 
23
body { line-height: 1; }
24
ol, ul { list-style: none; }
25
blockquote, q { quotes: none; }
26
 
27
blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }
28
 
29
/* remember to define focus styles! */
30
:focus { outline: 0; }
31
 
32
/* remember to highlight inserts somehow! */
33
ins { text-decoration: none; }
34
del { text-decoration: line-through; }
35
 
36
/* tables still need 'cellspacing="0"' in the markup */
37
table { border-collapse: collapse; border-spacing: 0; }
38
 
39
 
40
/*------------------------------------------------*/
41
/*-----------------[BASIC STYLES]-----------------*/
42
/*------------------------------------------------*/
43
 
44
html, body, .comingcontainer{ height: 100%; margin: 0; padding: 0; overflow: hidden; }
45
 
46
body { font-family: 'Open Sans', sans-serif; font-size: 14px; color: #3c3c3c; 
47
  background: #eee url(data:image/png;base64,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);
48
 
49
}
50
 
51
@keyframes go3d {
52
  0% { text-shadow: 0px 0px 2px #686868; }
53
  100% {  
54
    /***** 3D TRANSFORMATION *****/
55
    text-shadow: 0px 0px 2px #686868,
56
                   0px 1px 1px #ddd,
57
                   0px 2px 1px #d6d6d6,
58
                   0px 3px 1px #ccc,
59
                   0px 4px 1px #c5c5c5,
60
                   0px 5px 1px #c1c1c1,
61
                   0px 6px 1px #bbb,
62
                   0px 7px 1px #777,
63
                   0px 8px 3px rgba(100, 100, 100, 0.4),
64
                   0px 9px 5px rgba(100, 100, 100, 0.1),
65
                   0px 10px 7px rgba(100, 100, 100, 0.15),
66
                   0px 11px 9px rgba(100, 100, 100, 0.2),
67
                   0px 12px 11px rgba(100, 100, 100, 0.25),
68
                   0px 13px 15px rgba(100, 100, 100, 0.3);  }
69
}
70
 
71
@-webkit-keyframes go3d {
72
  0% { text-shadow: 0px 0px 2px #686868; }
73
  100% {  
74
    /***** 3D TRANSFORMATION *****/
75
    text-shadow: 0px 0px 2px #686868,
76
                   0px 1px 1px #ddd,
77
                   0px 2px 1px #d6d6d6,
78
                   0px 3px 1px #ccc,
79
                   0px 4px 1px #c5c5c5,
80
                   0px 5px 1px #c1c1c1,
81
                   0px 6px 1px #bbb,
82
                   0px 7px 1px #777,
83
                   0px 8px 3px rgba(100, 100, 100, 0.4),
84
                   0px 9px 5px rgba(100, 100, 100, 0.1),
85
                   0px 10px 7px rgba(100, 100, 100, 0.15),
86
                   0px 11px 9px rgba(100, 100, 100, 0.2),
87
                   0px 12px 11px rgba(100, 100, 100, 0.25),
88
                   0px 13px 15px rgba(100, 100, 100, 0.3);  }
89
}
90
 
91
@-moz-keyframes go3d {
92
  0% { text-shadow: 0px 0px 2px #686868; }
93
  100% {  
94
    /***** 3D TRANSFORMATION *****/
95
    text-shadow: 0px 0px 2px #686868,
96
                   0px 1px 1px #ddd,
97
                   0px 2px 1px #d6d6d6,
98
                   0px 3px 1px #ccc,
99
                   0px 4px 1px #c5c5c5,
100
                   0px 5px 1px #c1c1c1,
101
                   0px 6px 1px #bbb,
102
                   0px 7px 1px #777,
103
                   0px 8px 3px rgba(100, 100, 100, 0.4),
104
                   0px 9px 5px rgba(100, 100, 100, 0.1),
105
                   0px 10px 7px rgba(100, 100, 100, 0.15),
106
                   0px 11px 9px rgba(100, 100, 100, 0.2),
107
                   0px 12px 11px rgba(100, 100, 100, 0.25),
108
                   0px 13px 15px rgba(100, 100, 100, 0.3);  }
109
}
110
 
111
@-ms-keyframes go3d {
112
  0% { text-shadow: 0px 0px 2px #686868; }
113
  100% {  
114
    /***** 3D TRANSFORMATION *****/
115
    text-shadow: 0px 0px 2px #686868,
116
                   0px 1px 1px #ddd,
117
                   0px 2px 1px #d6d6d6,
118
                   0px 3px 1px #ccc,
119
                   0px 4px 1px #c5c5c5,
120
                   0px 5px 1px #c1c1c1,
121
                   0px 6px 1px #bbb,
122
                   0px 7px 1px #777,
123
                   0px 8px 3px rgba(100, 100, 100, 0.4),
124
                   0px 9px 5px rgba(100, 100, 100, 0.1),
125
                   0px 10px 7px rgba(100, 100, 100, 0.15),
126
                   0px 11px 9px rgba(100, 100, 100, 0.2),
127
                   0px 12px 11px rgba(100, 100, 100, 0.25),
128
                   0px 13px 15px rgba(100, 100, 100, 0.3);  }
129
}
130
 
131
@-o-keyframes go3d {
132
  0% { text-shadow: 0px 0px 2px #686868; }
133
  100% {  
134
    /***** 3D TRANSFORMATION *****/
135
    text-shadow: 0px 0px 2px #686868,
136
                   0px 1px 1px #ddd,
137
                   0px 2px 1px #d6d6d6,
138
                   0px 3px 1px #ccc,
139
                   0px 4px 1px #c5c5c5,
140
                   0px 5px 1px #c1c1c1,
141
                   0px 6px 1px #bbb,
142
                   0px 7px 1px #777,
143
                   0px 8px 3px rgba(100, 100, 100, 0.4),
144
                   0px 9px 5px rgba(100, 100, 100, 0.1),
145
                   0px 10px 7px rgba(100, 100, 100, 0.15),
146
                   0px 11px 9px rgba(100, 100, 100, 0.2),
147
                   0px 12px 11px rgba(100, 100, 100, 0.25),
148
                   0px 13px 15px rgba(100, 100, 100, 0.3);  }
149
}
150
 
151
.go3d {
152
  -webkit-animation: go3d 2s;
153
  -moz-animation: go3d 2s;
154
  -ms-animation: go3d 2s;
155
  -o-animation: go3d 2s;
156
  animation: go3d 2s;
157
}
158
 
159
.comingcontainer{
160
  width: 100%;
161
  box-shadow: -10px -10px 0 0 #222 inset, 10px 10px 0 0px #222 inset;
162
}
163
 
164
.checkbacksoon {
165
  width: auto;
166
  height: 100%;
167
  padding-top: 13%;
168
}
169
 
170
.checkbacksoon p {
171
  text-shadow: none;
172
  font-weight: normal;
173
  color: #666;
174
  font-family: 'Open Sans', sans-serif; 
175
  display: block;
176
  margin: auto;
177
  text-align:center;
178
  text-shadow: 0px 1px 0px #ffffff;
179
}
180
 
181
 
182
.checkbacksoon p span {
183
  color:#fff;
184
  font-family: 'Changa One', cursive;
185
  font-size: 200px;
186
  line-height: 220px;
187
  letter-spacing: 1px;
188
  
189
  cursor:pointer;
190
  
191
  -webkit-transition: all 0.1s linear;
192
  -moz-transition: all 0.1s linear;
193
  -o-transition: all 0.1s linear;
194
  -ms-transition: all 0.1s linear;
195
  transition: all 0.1s linear;
196
  
197
  /***** 3D TRANSFORMATION *****/
198
    text-shadow: 0px 0px 2px #686868,
199
                   0px 1px 1px #ddd,
200
                   0px 2px 1px #d6d6d6,
201
                   0px 3px 1px #ccc,
202
                   0px 4px 1px #c5c5c5,
203
                   0px 5px 1px #c1c1c1,
204
                   0px 6px 1px #bbb,
205
                   0px 7px 1px #777,
206
                   0px 8px 3px rgba(100, 100, 100, 0.4),
207
                   0px 9px 5px rgba(100, 100, 100, 0.1),
208
                   0px 10px 7px rgba(100, 100, 100, 0.15),
209
                   0px 11px 9px rgba(100, 100, 100, 0.2),
210
                   0px 12px 11px rgba(100, 100, 100, 0.25),
211
                   0px 13px 15px rgba(100, 100, 100, 0.3);  
212
}
213
                   
214
.checkbacksoon p span:hover {
215
  text-shadow: 0px 0px 2px #686868;
216
  
217
  -webkit-transition: all 0.1s linear;
218
  -moz-transition: all 0.1s linear;
219
  -o-transition: all 0.1s linear;
220
  -ms-transition: all 0.1s linear;
221
  transition: all 0.1s linear;
222
}
223
 
224
.error { 
225
  font-size: 16px;
226
    width: 700px;
227
    max-width: 90%;
228
    line-height: 2em;
229
    letter-spacing: 1px;
230
}
231
 
232
.error a { 
233
  text-decoration: none;
234
  color: #000;
235
}
236
 
237
.error a:hover { 
238
  color: #FF7F00;
239
}
240
 
241
/* #Navigation
242
================================================== */
243
 
244
nav {
245
  width: 100%;
246
    position: absolute;
247
    bottom: 10%;
248
    margin-top: 20px;
249
  min-height: 50px;
250
  background-color: #FFFFFF;
251
  -moz-box-shadow:0px 2px 3px rgba(204,204,204,0.65);
252
  -webkit-box-shadow:0px 2px 3px rgba(204,204,204,0.65);
253
  box-shadow:0px 2px 3px rgba(204,204,204,0.65);
254
  -ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#a6cccccc,Positive=true)";
255
  filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#a6cccccc,Positive=true);
256
}
257
 
258
nav ul {
259
  margin: 0;
260
  text-align: center;
261
}
262
 
263
nav ul li {
264
  display: inline;
265
}
266
 
267
nav ul li:last-child {
268
  margin-right: 0;
269
}
270
 
271
nav ul li a {
272
  font-family: 'Open Sans', san-serif;
273
  font-size: 13px;
274
  color: #666666;
275
  text-transform: uppercase;
276
  padding: 0 10px;
277
  text-decoration: none;
278
  border-width:6px 6px 6px 6px;
279
  margin: 0 15px;
280
    line-height: 50px;
281
  
282
  -webkit-transition: all 0.2s linear;
283
  -moz-transition: all 0.2s linear;
284
  -o-transition: all 0.2s linear;
285
  -ms-transition: all 0.2s linear;
286
  transition: all 0.2s linear;
287
}
288
 
289
nav ul li a:hover, nav ul li a.selected {
290
  color: #FF7F00;
291
  text-decoration: none;
292
  border-width: 6px 6px 6px 6px;
293
  
294
  -webkit-transition: all 0.2s linear;
295
  -moz-transition: all 0.2s linear;
296
  -o-transition: all 0.2s linear;
297
  -ms-transition: all 0.2s linear;
298
  transition: all 0.2s linear;
299
}
300
 
301
nav ul li a:active {
302
  color: #e00000;
303
}
304
 
305
nav ul li {
306
    position: relative;
307
}
308
 
309
nav ul li:hover > ul {
310
    visibility: visible;
311
}
312
 
313
nav ul li ul {
314
    visibility: hidden;
315
    position: absolute;
316
    left: auto;
317
    right: -100px;
318
    top: 23px;
319
    width: 200px;
320
    
321
    background-color: #FFF;
322
    text-align: left;
323
    margin-top: 0;
324
    padding: 0 10px 5px;
325
    
326
    
327
    -moz-box-shadow:0px 2px 3px rgba(204,204,204,0.65);
328
  -webkit-box-shadow:0px 2px 3px rgba(204,204,204,0.65);
329
  box-shadow:0px 2px 3px rgba(204,204,204,0.65);
330
  -ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#a6cccccc,Positive=true)";
331
  filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#a6cccccc,Positive=true);
332
}
333
 
334
nav ul li ul li {
335
    width: auto;
336
    display: block !important;
337
}
338
 
339
nav ul li ul li a {
340
  text-decoration: none;
341
  border: none;
342
    height: 30px;
343
    line-height: 30px;
344
    width: 180px;
345
    display: block !important;
346
  
347
  -webkit-transition: all 0.2s linear;
348
  -moz-transition: all 0.2s linear;
349
  -o-transition: all 0.2s linear;
350
  -ms-transition: all 0.2s linear;
351
  transition: all 0.2s linear;
352
}
353
 
354
nav ul li ul li a:hover {
355
  border: none;
356
    background-color: #f9f9f9;
357
  
358
  -webkit-transition: all 0.2s linear;
359
  -moz-transition: all 0.2s linear;
360
  -o-transition: all 0.2s linear;
361
  -ms-transition: all 0.2s linear;
362
  transition: all 0.2s linear;
363
}
364
 
365
nav ul li ul li a:hover:before {
366
    content: "»";
367
    margin-right: 5px;
368
}
369
    
370
.dropdown-menu {
371
  border: 1px solid #DDDDDD;
372
  margin-top: 10px;
373
}
374
 
375
.dropdown-menu ul li {
376
  padding: 0;
377
  margin-left: 0;
378
}
379
 
380
 
381
/* #Media Queries
382
================================================== */
383
 
384
/* Smaller than standard 960 (devices and browsers) */
385
@media only screen and (max-width: 1200px) {
386
 
387
}
388
@media only screen and (max-width: 959px) {
389
 
390
}
391
 
392
/* Tablet Portrait size to standard 960 (devices and browsers) */
393
@media only screen and (min-width: 768px) and (max-width: 959px) {
394
 
395
}
396
 
397
/* All Mobile Sizes (devices and browser) */
398
@media only screen and (max-width: 767px) {
399
 
400
}
401
 
402
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
403
@media only screen and (min-width: 480px) and (max-width: 767px) {
404
    .checkbacksoon p span { font-size: 150px; line-height: 160px; }
405
}
406
 
407
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
408
@media only screen and (max-width: 479px) {
409
    .checkbacksoon p span { font-size: 150px; line-height: 160px; }
410
}
 

Simply 404

CSSDeck G+