Wed, 31 Dec 2014 06:55:46 +0100
Added tag TORBROWSER_REPLICA for changeset 6474c204b198
michael@0 | 1 | *, |
michael@0 | 2 | *:before, |
michael@0 | 3 | *:after { |
michael@0 | 4 | box-sizing: border-box; |
michael@0 | 5 | } |
michael@0 | 6 | |
michael@0 | 7 | html { |
michael@0 | 8 | background-color: #F2F2F2; |
michael@0 | 9 | height: 100%; |
michael@0 | 10 | } |
michael@0 | 11 | |
michael@0 | 12 | body { |
michael@0 | 13 | color: #424f59; |
michael@0 | 14 | font: message-box; |
michael@0 | 15 | font-size: 14px; |
michael@0 | 16 | height: 100%; |
michael@0 | 17 | } |
michael@0 | 18 | |
michael@0 | 19 | a { |
michael@0 | 20 | color: #0095dd; |
michael@0 | 21 | cursor: pointer; /* Use the correct cursor for anchors without an href */ |
michael@0 | 22 | } |
michael@0 | 23 | |
michael@0 | 24 | a:active { |
michael@0 | 25 | outline: none; |
michael@0 | 26 | } |
michael@0 | 27 | |
michael@0 | 28 | a:focus { |
michael@0 | 29 | outline: 1px dotted #0095dd; |
michael@0 | 30 | } |
michael@0 | 31 | |
michael@0 | 32 | |
michael@0 | 33 | a.no-underline { |
michael@0 | 34 | text-decoration: none; |
michael@0 | 35 | } |
michael@0 | 36 | |
michael@0 | 37 | #stage { |
michael@0 | 38 | background:#fff; |
michael@0 | 39 | border-radius: 5px; |
michael@0 | 40 | box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25); |
michael@0 | 41 | margin: 0 auto; |
michael@0 | 42 | min-height: 300px; |
michael@0 | 43 | padding: 60px 40px 40px 40px; |
michael@0 | 44 | position: relative; |
michael@0 | 45 | text-align: center; |
michael@0 | 46 | top: 80px; |
michael@0 | 47 | width: 420px; |
michael@0 | 48 | } |
michael@0 | 49 | |
michael@0 | 50 | header h1 |
michael@0 | 51 | { |
michael@0 | 52 | font-size: 24px; |
michael@0 | 53 | font-weight: 200; |
michael@0 | 54 | line-height: 1em; |
michael@0 | 55 | margin: 0 0 32px 0; |
michael@0 | 56 | } |
michael@0 | 57 | |
michael@0 | 58 | .description { |
michael@0 | 59 | font-size: 18px; |
michael@0 | 60 | } |
michael@0 | 61 | |
michael@0 | 62 | .button-row { |
michael@0 | 63 | margin-top: 45px; |
michael@0 | 64 | margin-bottom:20px; |
michael@0 | 65 | } |
michael@0 | 66 | |
michael@0 | 67 | .button-row button, |
michael@0 | 68 | .button-row a.button { |
michael@0 | 69 | background: #0095dd; |
michael@0 | 70 | border: none; |
michael@0 | 71 | border-radius: 5px; |
michael@0 | 72 | color: #FFFFFF; |
michael@0 | 73 | cursor: pointer; |
michael@0 | 74 | font-size: 24px; |
michael@0 | 75 | padding: 15px 0; |
michael@0 | 76 | transition-duration: 150ms; |
michael@0 | 77 | transition-property: background-color; |
michael@0 | 78 | width: 100%; |
michael@0 | 79 | } |
michael@0 | 80 | |
michael@0 | 81 | .button-row a.button { |
michael@0 | 82 | display: inline-block; |
michael@0 | 83 | text-decoration: none; |
michael@0 | 84 | } |
michael@0 | 85 | |
michael@0 | 86 | .button-row a.button:active, |
michael@0 | 87 | .button-row a.button:hover, |
michael@0 | 88 | .button-row a.button:focus, |
michael@0 | 89 | .button-row button:active, |
michael@0 | 90 | .button-row button:hover, |
michael@0 | 91 | .button-row button:focus { |
michael@0 | 92 | background: #08c; |
michael@0 | 93 | } |
michael@0 | 94 | |
michael@0 | 95 | |
michael@0 | 96 | .graphic-sync-intro { |
michael@0 | 97 | background-image: url(images/graphic_sync_intro.png); |
michael@0 | 98 | background-repeat: no-repeat; |
michael@0 | 99 | background-size: 150px 195px; |
michael@0 | 100 | height: 195px; |
michael@0 | 101 | margin: 0 auto; |
michael@0 | 102 | overflow: hidden; |
michael@0 | 103 | text-indent: 100%; |
michael@0 | 104 | white-space: nowrap; |
michael@0 | 105 | width: 150px; |
michael@0 | 106 | } |
michael@0 | 107 | |
michael@0 | 108 | .description, |
michael@0 | 109 | .button-row { |
michael@0 | 110 | margin-top: 30px; |
michael@0 | 111 | } |
michael@0 | 112 | |
michael@0 | 113 | .links { |
michael@0 | 114 | margin: 20px 0; |
michael@0 | 115 | } |
michael@0 | 116 | |
michael@0 | 117 | @media only screen and (max-width: 500px) { |
michael@0 | 118 | html { |
michael@0 | 119 | background: #fff; |
michael@0 | 120 | } |
michael@0 | 121 | |
michael@0 | 122 | #stage { |
michael@0 | 123 | box-shadow: none; |
michael@0 | 124 | margin: 30px auto 0 auto; |
michael@0 | 125 | min-height: none; |
michael@0 | 126 | min-width: 320px; |
michael@0 | 127 | padding: 0 10px; |
michael@0 | 128 | width: 100%; |
michael@0 | 129 | } |
michael@0 | 130 | |
michael@0 | 131 | .button-row { |
michael@0 | 132 | margin-top: 20px; |
michael@0 | 133 | } |
michael@0 | 134 | |
michael@0 | 135 | .button-row button, |
michael@0 | 136 | .button-row a.button { |
michael@0 | 137 | padding: 10px 0; |
michael@0 | 138 | } |
michael@0 | 139 | |
michael@0 | 140 | } |
michael@0 | 141 | |
michael@0 | 142 | /* Retina */ |
michael@0 | 143 | @media |
michael@0 | 144 | only screen and (min-device-pixel-ratio: 2), |
michael@0 | 145 | only screen and ( min-resolution: 192dpi), |
michael@0 | 146 | only screen and ( min-resolution: 2dppx) { |
michael@0 | 147 | .graphic-sync-intro { |
michael@0 | 148 | background-image: url(images/graphic_sync_intro@2x.png); |
michael@0 | 149 | } |
michael@0 | 150 | } |