diff --git a/browser/base/content/aboutaccounts/main.css b/browser/base/content/aboutaccounts/main.css index a40e5562658a..b0226d4c4754 100644 --- a/browser/base/content/aboutaccounts/main.css +++ b/browser/base/content/aboutaccounts/main.css @@ -1,152 +1,152 @@ -*, -*:before, -*:after { - box-sizing: border-box; -} - -html { - background-color: #F2F2F2; - height: 100%; -} - -body { - color: #424f59; - font-family: "Clear Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 14px; - height: 100%; -} - -a { - color: #0095dd; - cursor: pointer; /* Use the correct cursor for anchors without an href */ -} - -a:active { - outline: none; -} - -a:focus { - outline: 1px dotted #0095dd; -} - - -a.no-underline { - text-decoration: none; -} - -#stage { - background:#fff; - border-radius: 5px; - box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25); - margin: 0 auto; - min-height: 300px; - padding: 60px 40px 40px 40px; - position: relative; - text-align: center; - top: 80px; - width: 420px; -} - -header h1 -{ - font-family: "Fira Sans", Helvetica, Arial, sans-serif; - font-size: 24px; - font-weight: 200; - line-height: 1em; - margin: 0 0 32px 0; -} - -.description { - font-size: 18px; -} - -.button-row { - margin-top: 45px; - margin-bottom:20px; -} - -.button-row button, -.button-row a.button { - background: #0095dd; - border: none; - border-radius: 5px; - color: #FFFFFF; - cursor: pointer; - font-family: "Clear Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 24px; - padding: 15px 0; - transition-duration: 150ms; - transition-property: background-color; - width: 100%; -} - -.button-row a.button { - display: inline-block; - text-decoration: none; -} - -.button-row a.button:active, -.button-row a.button:hover, -.button-row a.button:focus, -.button-row button:active, -.button-row button:hover, -.button-row button:focus { - background: #08c; -} - - -.graphic-sync-intro { - background-image: url(images/graphic_sync_intro.png); - background-repeat: no-repeat; - background-size: 150px 195px; - height: 195px; - margin: 0 auto; - overflow: hidden; - text-indent: 100%; - white-space: nowrap; - width: 150px; -} - -.description, -.button-row { - margin-top: 30px; -} - -.links { - margin: 20px 0; -} - -@media only screen and (max-width: 500px) { - html { - background: #fff; - } - - #stage { - box-shadow: none; - margin: 30px auto 0 auto; - min-height: none; - min-width: 320px; - padding: 0 10px; - width: 100%; - } - - .button-row { - margin-top: 20px; - } - - .button-row button, - .button-row a.button { - padding: 10px 0; - } - -} - -/* Retina */ -@media -only screen and (min-device-pixel-ratio: 2), -only screen and ( min-resolution: 192dpi), -only screen and ( min-resolution: 2dppx) { - .graphic-sync-intro { - background-image: url(images/graphic_sync_intro@2x.png); - } -} +*, +*:before, +*:after { + box-sizing: border-box; +} + +html { + background-color: #F2F2F2; + height: 100%; +} + +body { + color: #424f59; + font-family: "Clear Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 14px; + height: 100%; +} + +a { + color: #0095dd; + cursor: pointer; /* Use the correct cursor for anchors without an href */ +} + +a:active { + outline: none; +} + +a:focus { + outline: 1px dotted #0095dd; +} + + +a.no-underline { + text-decoration: none; +} + +#stage { + background:#fff; + border-radius: 5px; + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25); + margin: 0 auto; + min-height: 300px; + padding: 60px 40px 40px 40px; + position: relative; + text-align: center; + top: 80px; + width: 420px; +} + +header h1 +{ + font-family: "Fira Sans", Helvetica, Arial, sans-serif; + font-size: 24px; + font-weight: 200; + line-height: 1em; + margin: 0 0 32px 0; +} + +.description { + font-size: 18px; +} + +.button-row { + margin-top: 45px; + margin-bottom:20px; +} + +.button-row button, +.button-row a.button { + background: #0095dd; + border: none; + border-radius: 5px; + color: #FFFFFF; + cursor: pointer; + font-family: "Clear Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 24px; + padding: 15px 0; + transition-duration: 150ms; + transition-property: background-color; + width: 100%; +} + +.button-row a.button { + display: inline-block; + text-decoration: none; +} + +.button-row a.button:active, +.button-row a.button:hover, +.button-row a.button:focus, +.button-row button:active, +.button-row button:hover, +.button-row button:focus { + background: #08c; +} + + +.graphic-sync-intro { + background-image: url(images/graphic_sync_intro.png); + background-repeat: no-repeat; + background-size: 150px 195px; + height: 195px; + margin: 0 auto; + overflow: hidden; + text-indent: 100%; + white-space: nowrap; + width: 150px; +} + +.description, +.button-row { + margin-top: 30px; +} + +.links { + margin: 20px 0; +} + +@media only screen and (max-width: 500px) { + html { + background: #fff; + } + + #stage { + box-shadow: none; + margin: 30px auto 0 auto; + min-height: none; + min-width: 320px; + padding: 0 10px; + width: 100%; + } + + .button-row { + margin-top: 20px; + } + + .button-row button, + .button-row a.button { + padding: 10px 0; + } + +} + +/* Retina */ +@media +only screen and (min-device-pixel-ratio: 2), +only screen and ( min-resolution: 192dpi), +only screen and ( min-resolution: 2dppx) { + .graphic-sync-intro { + background-image: url(images/graphic_sync_intro@2x.png); + } +}