Init.
This commit is contained in:
Vendored
+375
@@ -0,0 +1,375 @@
|
||||
/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
|
||||
|
||||
/* ==========================================================================
|
||||
HTML5 display definitions
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Corrects `block` display not defined in IE 8/9.
|
||||
*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects `inline-block` display not defined in IE 8/9.
|
||||
*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Prevents modern browsers from displaying `audio` without controls.
|
||||
* Remove excess height in iOS 5 devices.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling for `hidden` attribute not present in IE 8/9.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Base
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Sets default font family to sans-serif.
|
||||
* 2. Prevents iOS text size adjust after orientation change, without disabling
|
||||
* user zoom.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes default margin.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Links
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses `outline` inconsistency between Chrome and other browsers.
|
||||
*/
|
||||
|
||||
a:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
* Improves readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Typography
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses `h1` font sizes within `section` and `article` in Firefox 4+,
|
||||
* Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in IE 8/9, Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in Safari 5 and Chrome.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in IE 8/9.
|
||||
*/
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Corrects font family set oddly in Safari 5 and Chrome.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, serif;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
* Improves readability of pre-formatted text in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sets consistent quote types.
|
||||
*/
|
||||
|
||||
q {
|
||||
quotes: "\201C" "\201D" "\2018" "\2019";
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses inconsistent and variable font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Prevents `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Removes border when inside `a` element in IE 8/9.
|
||||
*/
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects overflow displayed oddly in IE 9.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Figures
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses margin not present in IE 8/9 and Safari 5.
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Forms
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Define consistent border, margin, and padding.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Corrects color not being inherited in IE 8/9.
|
||||
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
*/
|
||||
|
||||
legend {
|
||||
border: 0; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Corrects font family not being inherited in all browsers.
|
||||
* 2. Corrects font size not being inherited in all browsers.
|
||||
* 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 2 */
|
||||
margin: 0; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||
* the UA stylesheet.
|
||||
*/
|
||||
|
||||
button,
|
||||
input {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
* and `video` controls.
|
||||
* 2. Corrects inability to style clickable `input` types in iOS.
|
||||
* 3. Improves usability and consistency of cursor style between image-type
|
||||
* `input` and others.
|
||||
*/
|
||||
|
||||
button,
|
||||
html input[type="button"], /* 1 */
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
cursor: pointer; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
|
||||
button[disabled],
|
||||
input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Addresses box sizing set to `content-box` in IE 8/9.
|
||||
* 2. Removes excess padding in IE 8/9.
|
||||
*/
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
|
||||
* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
|
||||
* (include `-moz` to future-proof).
|
||||
*/
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box; /* 2 */
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes inner padding and search cancel button in Safari 5 and Chrome
|
||||
* on OS X.
|
||||
*/
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes inner padding and border in Firefox 4+.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Removes default vertical scrollbar in IE 8/9.
|
||||
* 2. Improves readability and alignment in all browsers.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto; /* 1 */
|
||||
vertical-align: top; /* 2 */
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Tables
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Remove most spacing between table cells.
|
||||
*/
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
@@ -0,0 +1,375 @@
|
||||
/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
|
||||
|
||||
/* ==========================================================================
|
||||
HTML5 display definitions
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Corrects `block` display not defined in IE 8/9.
|
||||
*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects `inline-block` display not defined in IE 8/9.
|
||||
*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Prevents modern browsers from displaying `audio` without controls.
|
||||
* Remove excess height in iOS 5 devices.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling for `hidden` attribute not present in IE 8/9.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Base
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Sets default font family to sans-serif.
|
||||
* 2. Prevents iOS text size adjust after orientation change, without disabling
|
||||
* user zoom.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes default margin.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Links
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses `outline` inconsistency between Chrome and other browsers.
|
||||
*/
|
||||
|
||||
a:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
* Improves readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Typography
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses `h1` font sizes within `section` and `article` in Firefox 4+,
|
||||
* Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in IE 8/9, Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in Safari 5 and Chrome.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in IE 8/9.
|
||||
*/
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Corrects font family set oddly in Safari 5 and Chrome.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, serif;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
* Improves readability of pre-formatted text in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sets consistent quote types.
|
||||
*/
|
||||
|
||||
q {
|
||||
quotes: "\201C" "\201D" "\2018" "\2019";
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses inconsistent and variable font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Prevents `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Removes border when inside `a` element in IE 8/9.
|
||||
*/
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects overflow displayed oddly in IE 9.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Figures
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses margin not present in IE 8/9 and Safari 5.
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Forms
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Define consistent border, margin, and padding.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Corrects color not being inherited in IE 8/9.
|
||||
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
*/
|
||||
|
||||
legend {
|
||||
border: 0; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Corrects font family not being inherited in all browsers.
|
||||
* 2. Corrects font size not being inherited in all browsers.
|
||||
* 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 2 */
|
||||
margin: 0; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||
* the UA stylesheet.
|
||||
*/
|
||||
|
||||
button,
|
||||
input {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
* and `video` controls.
|
||||
* 2. Corrects inability to style clickable `input` types in iOS.
|
||||
* 3. Improves usability and consistency of cursor style between image-type
|
||||
* `input` and others.
|
||||
*/
|
||||
|
||||
button,
|
||||
html input[type="button"], /* 1 */
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
cursor: pointer; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
|
||||
button[disabled],
|
||||
input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Addresses box sizing set to `content-box` in IE 8/9.
|
||||
* 2. Removes excess padding in IE 8/9.
|
||||
*/
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
|
||||
* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
|
||||
* (include `-moz` to future-proof).
|
||||
*/
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box; /* 2 */
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes inner padding and search cancel button in Safari 5 and Chrome
|
||||
* on OS X.
|
||||
*/
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes inner padding and border in Firefox 4+.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Removes default vertical scrollbar in IE 8/9.
|
||||
* 2. Improves readability and alignment in all browsers.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto; /* 1 */
|
||||
vertical-align: top; /* 2 */
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Tables
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Remove most spacing between table cells.
|
||||
*/
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
@@ -0,0 +1,141 @@
|
||||
/* Contdonwn */
|
||||
|
||||
body {
|
||||
background: #222 url('../images/bg.gif') repeat;
|
||||
color: #fff;
|
||||
-moz-text-shadow: 0 -1px 0 #000;
|
||||
-webkit-text-shadow: 0 -1px 0 #000;
|
||||
text-shadow: 0 -1px 0 #000;
|
||||
font-family: 'Helvetica Neue','Helvetica','Arial', sans-serif;
|
||||
}
|
||||
|
||||
.bg-gradient {
|
||||
position: fixed;
|
||||
width: 1000px;
|
||||
height: 1000px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: -1;
|
||||
margin: -500px 0 0 -500px;
|
||||
background: url('../images/bg-gradient.png') no-repeat center;
|
||||
}
|
||||
|
||||
.container {
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
width: 800px;
|
||||
height: 400px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin: -200px 0 0 -400px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
margin: 0;
|
||||
color: #eee;
|
||||
-moz-text-shadow: 0 3px 3px #000000;
|
||||
-webkit-text-shadow: 0 3px 3px #000000;
|
||||
text-shadow: 0 3px 3px #000000;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 60px;
|
||||
margin: 0 0 10px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#CDT {
|
||||
font-size: 60px;
|
||||
color: #eee;
|
||||
margin: 70px 0 100px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#CDT .number-wrapper {
|
||||
margin: 10px;
|
||||
-moz-box-shadow: 0 5px 8px #000000;
|
||||
-webkit-box-shadow: 0 5px 8px #000000;
|
||||
box-shadow: 0 5px 8px #000000;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#CDT .number {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
background: #000;
|
||||
background-image: linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -o-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -moz-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -webkit-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -ms-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
-webkit-border-top-right-radius: 7px;
|
||||
-webkit-border-bottom-right-radius: 0;
|
||||
-webkit-border-bottom-left-radius: 0;
|
||||
-webkit-border-top-left-radius: 0;
|
||||
-moz-border-radius-topright: 7px;
|
||||
-moz-border-radius-bottomright: 0;
|
||||
-moz-border-radius-bottomleft: 0;
|
||||
-moz-border-radius-topleft: 0;
|
||||
border-top-right-radius: 7px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
-webkit-border-radius: 7px;
|
||||
-moz-border-radius: 7px;
|
||||
border-radius: 7px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
padding: 0 12px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
text-align: center;
|
||||
border: 1px solid #555;
|
||||
-moz-box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.2);
|
||||
-webkit-box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.2);
|
||||
box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.2);
|
||||
-moz-text-shadow: 0 3px 3px #000000;
|
||||
-webkit-text-shadow: 0 3px 3px #000000;
|
||||
text-shadow: 0 3px 3px #000000;
|
||||
}
|
||||
|
||||
#CDT .line {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
top: 52%;
|
||||
left: 0;
|
||||
background: #000;
|
||||
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
|
||||
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.caption {
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
bottom: -30px;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
footer p {
|
||||
margin: .5em 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
@@ -0,0 +1,141 @@
|
||||
/* Contdonwn */
|
||||
|
||||
body {
|
||||
background: #222 url('../images/bg.gif') repeat;
|
||||
color: #fff;
|
||||
-moz-text-shadow: 0 -1px 0 #000;
|
||||
-webkit-text-shadow: 0 -1px 0 #000;
|
||||
text-shadow: 0 -1px 0 #000;
|
||||
font-family: 'Helvetica Neue','Helvetica','Arial', sans-serif;
|
||||
}
|
||||
|
||||
.bg-gradient {
|
||||
position: fixed;
|
||||
width: 1000px;
|
||||
height: 1000px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: -1;
|
||||
margin: -500px 0 0 -500px;
|
||||
background: url('../images/bg-gradient.png') no-repeat center;
|
||||
}
|
||||
|
||||
.container {
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
width: 800px;
|
||||
height: 400px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin: -200px 0 0 -400px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
margin: 0;
|
||||
color: #eee;
|
||||
-moz-text-shadow: 0 3px 3px #000000;
|
||||
-webkit-text-shadow: 0 3px 3px #000000;
|
||||
text-shadow: 0 3px 3px #000000;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 60px;
|
||||
margin: 0 0 10px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#CDT {
|
||||
font-size: 60px;
|
||||
color: #eee;
|
||||
margin: 70px 0 100px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#CDT .number-wrapper {
|
||||
margin: 10px;
|
||||
-moz-box-shadow: 0 5px 8px #000000;
|
||||
-webkit-box-shadow: 0 5px 8px #000000;
|
||||
box-shadow: 0 5px 8px #000000;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#CDT .number {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
background: #000;
|
||||
background-image: linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -o-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -moz-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -webkit-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
background-image: -ms-linear-gradient(bottom, #000000 2%, #3c3c3c 50%, #000000 100%);
|
||||
-webkit-border-top-right-radius: 7px;
|
||||
-webkit-border-bottom-right-radius: 0;
|
||||
-webkit-border-bottom-left-radius: 0;
|
||||
-webkit-border-top-left-radius: 0;
|
||||
-moz-border-radius-topright: 7px;
|
||||
-moz-border-radius-bottomright: 0;
|
||||
-moz-border-radius-bottomleft: 0;
|
||||
-moz-border-radius-topleft: 0;
|
||||
border-top-right-radius: 7px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
-webkit-border-radius: 7px;
|
||||
-moz-border-radius: 7px;
|
||||
border-radius: 7px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
padding: 0 12px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
text-align: center;
|
||||
border: 1px solid #555;
|
||||
-moz-box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.2);
|
||||
-webkit-box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.2);
|
||||
box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.2);
|
||||
-moz-text-shadow: 0 3px 3px #000000;
|
||||
-webkit-text-shadow: 0 3px 3px #000000;
|
||||
text-shadow: 0 3px 3px #000000;
|
||||
}
|
||||
|
||||
#CDT .line {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
top: 52%;
|
||||
left: 0;
|
||||
background: #000;
|
||||
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
|
||||
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.caption {
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
bottom: -30px;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
footer p {
|
||||
margin: .5em 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 118 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 162 B |
@@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 Countdown</title>
|
||||
<link rel="stylesheet" media="screen" href="css/normalize123.css" />
|
||||
<link rel="stylesheet" media="screen" href="css/style123.css" />
|
||||
<script src="js/countdown.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="bg-gradient"></div>
|
||||
<div class="container">
|
||||
<h1>Îæèäàéòå!</h1>
|
||||
<h2>Äî íà÷àëà áîÿ:</h2>
|
||||
<div id="CDT"></div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,91 @@
|
||||
<!DOCTYPE html>
|
||||
<style>
|
||||
.preloader {
|
||||
/* written in CSS 3.0 */
|
||||
opacity: 0;
|
||||
font-size: 36px;
|
||||
|
||||
-webkit-transition: 0.2s all;
|
||||
-khtml-transition: 0.2s all;
|
||||
-moz-transition: 0.2s all;
|
||||
-ms-transition: 0.2s all;
|
||||
-o-transition: 0.2s all;
|
||||
transition: 0.2s all;
|
||||
|
||||
-webkit-transform: scale( 0.1 );
|
||||
-moz-transform: scale( 0.1 );
|
||||
-ms-transform: scale( 0.1 );
|
||||
-o-transform: scale( 0.1 );
|
||||
transform: scale( 0.1 );
|
||||
}
|
||||
.preloader.show {
|
||||
opacity: 1;
|
||||
|
||||
-webkit-transition: 0.2s opacity;
|
||||
-moz-transition: 0.2s opacity;
|
||||
-ms-transition: 0.2s opacity;
|
||||
-o-transition: 0.2s opacity;
|
||||
transition: 0.2s opacity;
|
||||
|
||||
-webkit-transform: scale( 1 );
|
||||
-khtml-transform: scale( 1 );
|
||||
-moz-transform: scale( 1 );
|
||||
-ms-transform: scale( 1 );
|
||||
-o-transform: scale( 1 );
|
||||
transform: scale( 1 );
|
||||
}
|
||||
</style>
|
||||
<html>
|
||||
<head>
|
||||
<script>
|
||||
$(function() {
|
||||
$.ajax({
|
||||
url: 'http://code.jquery.com/jquery-latest.js',
|
||||
dataType: 'script',
|
||||
beforeSend: function(evt) {
|
||||
if ( ! $('.preloader').is('.show') ) $('.preloader').addClass('show');
|
||||
},
|
||||
complete: function(jqXHR, textStatus) {
|
||||
// disable either here or at the end
|
||||
$('.preloader').removeClass('show');
|
||||
|
||||
// handle error and success
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="preloader">
|
||||
<h1>Loading...</h1>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<?
|
||||
// echo "<body onload=\"myWindow5(body);\">";
|
||||
// echo "<script>myWindow5(div);</script>";
|
||||
//sleep(5);
|
||||
//echo "<script>myWindow2();</script>";
|
||||
?>
|
||||
<style>
|
||||
#ifr {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border: 0;
|
||||
height: 100%;
|
||||
|
||||
width: 500px; /*àáû êàêîå*/
|
||||
#background-color: green; /*ïðîñòî, ÷òîáû ðàçìåð áûëî âèäíî*/
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
function myWindow2() {
|
||||
var raz = window.document.querySelector('iframe[src^="https://new-combats.com/timer/index.html"]'); // óäàëèòü ñîçäàííûé â ðîäèòåëå iframe
|
||||
raz.parentNode.removeChild(raz);
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,42 @@
|
||||
function CountdownTimer(elm,tl,mes){
|
||||
this.initialize.apply(this,arguments);
|
||||
}
|
||||
CountdownTimer.prototype={
|
||||
initialize:function(elm,tl,mes) {
|
||||
this.elem = document.getElementById(elm);
|
||||
this.tl = tl;
|
||||
this.mes = mes;
|
||||
},countDown:function(){
|
||||
var timer='';
|
||||
//var today=new Date();
|
||||
var today=new Date();
|
||||
var sec=Math.floor(((this.tl-today)%(24*60*60*1000))/1000)%60%60;
|
||||
var me=this;
|
||||
|
||||
if( ( this.tl - today ) > 0 ){
|
||||
// timer += '<span class="number-wrapper"><div class="line"></div><div class="caption">DAYS</div><span class="number day">'+day+'</span></span>';
|
||||
// timer += '<span class="number-wrapper"><div class="line"></div><div class="caption">HOURS</div><span class="number hour">'+hour+'</span></span>';
|
||||
// <span class="number-wrapper"><div class="line"></div><div class="caption">MINS</div><span class="number min">'+this.addZero(min)+'</span></span><span class="number-wrapper"><div class="line"></div>
|
||||
timer += '<span class="number-wrapper"><div class="caption"></div><span class="number sec">'+this.addZero(sec)+'</span></span>';
|
||||
this.elem.innerHTML = timer;
|
||||
tid = setTimeout( function(){me.countDown();},10 );
|
||||
}else{
|
||||
this.elem.innerHTML = this.mes;
|
||||
return;
|
||||
}
|
||||
},addZero:function(num){ return ('0'+num).slice(-2); }
|
||||
}
|
||||
function CDT(){
|
||||
|
||||
// Set countdown limit
|
||||
var tl = new Date(Date.now()+20000);
|
||||
|
||||
//var tl = new Date('2020/01/01 00:00:00');
|
||||
|
||||
// You can add time's up message here
|
||||
var timer = new CountdownTimer('CDT',tl,'<span class="number-wrapper"><div class="line"></div><span class="number end">Ñòàðòóåì!</span></span>');
|
||||
timer.countDown();
|
||||
}
|
||||
window.onload=function(){
|
||||
CDT();
|
||||
}
|
||||
Reference in New Issue
Block a user