| author | Eugen Sawin <sawine@me73.com> |
| Mon, 20 Feb 2012 15:10:53 +0100 | |
| changeset 0 | a2f88c3bd824 |
| child 1 | 962dd7efaa05 |
| permissions | -rw-r--r-- |
| sawine@0 | 1 |
@font-face {
|
| sawine@0 | 2 |
font-family: TitilliumText1; |
| sawine@0 | 3 |
src: url(fonts/TitilliumText22L001-webfont.woff); |
| sawine@0 | 4 |
} |
| sawine@0 | 5 |
|
| sawine@0 | 6 |
@font-face {
|
| sawine@0 | 7 |
font-family: TitilliumText2; |
| sawine@0 | 8 |
src: url(fonts/TitilliumText22L002-webfont.woff); |
| sawine@0 | 9 |
} |
| sawine@0 | 10 |
|
| sawine@0 | 11 |
@font-face {
|
| sawine@0 | 12 |
font-family: TitilliumText3; |
| sawine@0 | 13 |
src: url(fonts/TitilliumText22L003-webfont.woff); |
| sawine@0 | 14 |
} |
| sawine@0 | 15 |
|
| sawine@0 | 16 |
@font-face {
|
| sawine@0 | 17 |
font-family: CPMonoBold; |
| sawine@0 | 18 |
src: url(fonts/CPMono_v07_Bold-webfont.woff); |
| sawine@0 | 19 |
} |
| sawine@0 | 20 |
|
| sawine@0 | 21 |
body {
|
| sawine@0 | 22 |
font-family: Helvetica Neue, Arial, Helvetica, 'Liberation Sans', FreeSans, sans-serif; |
| sawine@0 | 23 |
padding: 0px; |
| sawine@0 | 24 |
text-align: center; |
| sawine@0 | 25 |
background-color: #222; |
| sawine@0 | 26 |
color: #ddd; |
| sawine@0 | 27 |
border-style: none; |
| sawine@0 | 28 |
} |
| sawine@0 | 29 |
|
| sawine@0 | 30 |
#wrap {
|
| sawine@0 | 31 |
margin: 0px auto 0px auto; |
| sawine@0 | 32 |
width: 400px; |
| sawine@0 | 33 |
text-transform: uppercase; |
| sawine@0 | 34 |
} |
| sawine@0 | 35 |
|
| sawine@0 | 36 |
#title-area {
|
| sawine@0 | 37 |
margin-top: 8%; |
| sawine@0 | 38 |
color: #328EB5; |
| sawine@0 | 39 |
font-size: 3em; |
| sawine@0 | 40 |
font-family: TitilliumText1; |
| sawine@0 | 41 |
} |
| sawine@0 | 42 |
|
| sawine@0 | 43 |
#compare-area {
|
| sawine@0 | 44 |
margin-top: 8%; |
| sawine@0 | 45 |
height: 6em; |
| sawine@0 | 46 |
font-size: 1.3em; |
| sawine@0 | 47 |
font-weight: bold; |
| sawine@0 | 48 |
} |
| sawine@0 | 49 |
|
| sawine@0 | 50 |
#compare-area #compare-left {
|
| sawine@0 | 51 |
position: relative; |
| sawine@0 | 52 |
height: 100%; |
| sawine@0 | 53 |
padding-top: 5em; |
| sawine@0 | 54 |
right: 51%; |
| sawine@0 | 55 |
text-align: right; |
| sawine@0 | 56 |
background-color: #111; |
| sawine@0 | 57 |
} |
| sawine@0 | 58 |
|
| sawine@0 | 59 |
#compare-area #compare-right {
|
| sawine@0 | 60 |
position: relative; |
| sawine@0 | 61 |
height: 100%; |
| sawine@0 | 62 |
padding-top: 5em; |
| sawine@0 | 63 |
top: -11em; |
| sawine@0 | 64 |
left: 51%; |
| sawine@0 | 65 |
text-align: left; |
| sawine@0 | 66 |
background-color: #111; |
| sawine@0 | 67 |
} |
| sawine@0 | 68 |
|
| sawine@0 | 69 |
#result-area {
|
| sawine@0 | 70 |
margin-top: 30%; |
| sawine@0 | 71 |
height: 3em; |
| sawine@0 | 72 |
font-weight: bold; |
| sawine@0 | 73 |
} |
| sawine@0 | 74 |
|
| sawine@0 | 75 |
#result-area #result-left {
|
| sawine@0 | 76 |
position: relative; |
| sawine@0 | 77 |
height: 44px; |
| sawine@0 | 78 |
padding-top: 28px; |
| sawine@0 | 79 |
right: 51%; |
| sawine@0 | 80 |
width: 61.5%; |
| sawine@0 | 81 |
text-align: right; |
| sawine@0 | 82 |
background-color: #151515; |
| sawine@0 | 83 |
color: #222; |
| sawine@0 | 84 |
} |
| sawine@0 | 85 |
|
| sawine@0 | 86 |
#result-area #result-left-rating {
|
| sawine@0 | 87 |
position: relative; |
| sawine@0 | 88 |
height: 40px; |
| sawine@0 | 89 |
padding-top: 26px; |
| sawine@0 | 90 |
top: -72px; |
| sawine@0 | 91 |
left: 30%; |
| sawine@0 | 92 |
width: 18%; |
| sawine@0 | 93 |
background-color: #3d910e; |
| sawine@0 | 94 |
color: #222; |
| sawine@0 | 95 |
font-family: CPMonoBold; |
| sawine@0 | 96 |
border: solid 3px #151515; |
| sawine@0 | 97 |
} |
| sawine@0 | 98 |
|
| sawine@0 | 99 |
#result-area #result-right-rating {
|
| sawine@0 | 100 |
position: relative; |
| sawine@0 | 101 |
height: 40px; |
| sawine@0 | 102 |
padding-top: 26px; |
| sawine@0 | 103 |
top: -144px; |
| sawine@0 | 104 |
left: 51%; |
| sawine@0 | 105 |
width: 18%; |
| sawine@0 | 106 |
background-color: #AC4810; |
| sawine@0 | 107 |
color: #222; |
| sawine@0 | 108 |
font-family: CPMonoBold; |
| sawine@0 | 109 |
border: solid 3px #151515; |
| sawine@0 | 110 |
} |
| sawine@0 | 111 |
|
| sawine@0 | 112 |
#result-area #result-right {
|
| sawine@0 | 113 |
position: relative; |
| sawine@0 | 114 |
height: 44px; |
| sawine@0 | 115 |
padding-top: 28px; |
| sawine@0 | 116 |
top: -216px; |
| sawine@0 | 117 |
left: 69.5%; |
| sawine@0 | 118 |
width: 61.5%; |
| sawine@0 | 119 |
text-align: left; |
| sawine@0 | 120 |
background-color: #151515; |
| sawine@0 | 121 |
color: #222; |
| sawine@0 | 122 |
} |
| sawine@0 | 123 |
|
| sawine@0 | 124 |
.hover-backlight:hover {
|
| sawine@0 | 125 |
color: #5ad715; |
| sawine@0 | 126 |
background-color: #0a0a0a ! important; |
| sawine@0 | 127 |
} |
| sawine@0 | 128 |
|
| sawine@0 | 129 |
.padding-left {
|
| sawine@0 | 130 |
padding-left: 5em; |
| sawine@0 | 131 |
} |
| sawine@0 | 132 |
|
| sawine@0 | 133 |
.padding-right {
|
| sawine@0 | 134 |
padding-right: 5em; |
| sawine@0 | 135 |
} |
| sawine@0 | 136 |
|
| sawine@0 | 137 |
a:link {
|
| sawine@0 | 138 |
color: #ddd; |
| sawine@0 | 139 |
text-decoration: none; |
| sawine@0 | 140 |
} |