| /* Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| * Use of this source code is governed by a BSD-style license that can be |
| * found in the LICENSE file. */ |
| |
| html.loading [jsdisplay] { |
| display: none; |
| } |
| |
| [hidden] { |
| display: none !important; |
| } |
| |
| body { |
| background: url('images/stripe.png') rgb(140, 0, 0); |
| margin: 0; |
| } |
| |
| .box { |
| -webkit-border-radius: 5px; |
| -webkit-box-shadow: 3px 3px 8px rgb(140, 0, 0); |
| background-color: white; |
| color: rgb(75, 75, 77); |
| margin: 40px auto; |
| padding: 40px; |
| text-align: start; |
| width: 700px; |
| } |
| |
| .float { |
| float: right; |
| } |
| |
| html[dir='rtl'] .float { |
| float: left; |
| } |
| |
| .icon { |
| margin-top: 23px; |
| } |
| |
| .clear { |
| clear: both; |
| } |
| |
| #logo { |
| content: -webkit-image-set( |
| url('../../../app/theme/%DISTRIBUTION%/product_logo_name_48.png') 1x, |
| url('../../../app/theme/%DISTRIBUTION%/product_logo_name_96.png') 2x); |
| max-width: 100%; |
| } |
| |
| #headline { |
| -webkit-margin-end: 260px; |
| color: #333; |
| font-size: 22px; |
| font-weight: bold; |
| margin-top: 20px; |
| } |
| |
| .main { |
| -webkit-margin-end: 260px; |
| font-size: 16px; |
| line-height: 22px; |
| margin-bottom: 21px; |
| margin-top: 14px; |
| } |
| |
| .advanced { |
| -webkit-margin-start: 10px; |
| display: inline-block; |
| font-size: 13px; |
| } |
| |
| footer { |
| font-size: 13px; |
| margin-top: 50px; |
| } |
| |
| #learn-more-link { |
| display: inline-block; |
| font-size: 13px; |
| } |
| |
| #privacy-link { |
| display: inline-block; |
| } |
| |
| .submission { |
| -webkit-margin-end: 5px; |
| margin-bottom: 15px; |
| padding: 0; |
| } |
| |
| button { |
| -webkit-box-shadow: inset 0 1px 0 0 rgb(129, 169, 243), |
| 0 1px 2px rgba(0, 0, 0, .2); |
| background: -webkit-linear-gradient(rgb(112, 154, 241), |
| rgb(108, 148, 240) 44%, rgb(95, 132, 238)); |
| border: 1px solid rgb(53, 116, 203); |
| border-radius: 3px; |
| color: white; |
| cursor: pointer; |
| display: inline-block; |
| font-size: 14px; |
| font-weight: bold; |
| line-height: 1; |
| padding: 11px 38px 10px 38px; |
| text-align: center; |
| text-decoration: none; |
| text-shadow: 0 -1px 0 rgb(72, 101, 228); |
| } |
| |
| button:hover, |
| button:focus { |
| -webkit-box-shadow: inset 0 1px 0 0 rgb(129, 169, 243), |
| 0 1px 2px rgba(0, 0, 0, .3); |
| background: -webkit-linear-gradient(rgb(165, 188, 245), |
| rgb(108, 148, 240) 70%, rgb(95, 132, 238)); |
| border: 1px solid rgb(53, 116, 203); |
| } |
| |
| button:active { |
| -webkit-box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 0, .1); |
| background: -webkit-linear-gradient(rgb(112, 154, 241), |
| rgb(108, 148, 240) 44%, rgb(95, 132, 238)); |
| border: 1px solid rgb(53, 116, 203); |
| } |
| |
| a { |
| color: rgb(17, 84, 204); |
| } |
| |
| a:link, |
| a:visited { |
| text-decoration: none; |
| } |
| |
| a:hover, |
| a:active { |
| text-decoration: underline; |
| } |
| |
| .checkbox { |
| margin-top: 11px; |
| position: relative; |
| } |
| |
| .checkbox input { |
| -webkit-margin-start: 1px; |
| margin-top: 3px; |
| position: absolute; |
| } |
| |
| .checkbox span { |
| -webkit-margin-start: 21px; |
| display: inline-block; |
| } |
| |
| /* When the window is 860px or smaller, switch to dynamically scaling the |
| * contents. The text is also allowed to flow around the icon rather than |
| * staying in a separate column. The percentage values below are derived so |
| * that at 860px everything is the same size as the static values above, and |
| * then scales down smoothly from there. */ |
| @media screen and (max-width: 860px) { |
| .box { |
| margin: 4.6%; |
| padding: 4.6%; |
| width: 81.6%; |
| } |
| .icon { |
| -webkit-margin-start: 2%; |
| margin-bottom: 2%; |
| max-width: 33%; |
| } |
| #headline, |
| .main { |
| -webkit-margin-end: 0; |
| } |
| } |