| OLD | NEW |
| 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| 2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
| 3 * found in the LICENSE file. */ | 3 * found in the LICENSE file. */ |
| 4 | 4 |
| 5 @font-face { |
| 6 font-family: 'Roboto2'; |
| 7 font-weight: 400; |
| 8 src: local('Roboto'), local('Roboto2-Regular'); |
| 9 } |
| 10 |
| 5 html { | 11 html { |
| 6 height: 100%; | 12 height: 100%; |
| 7 width: 100%; | 13 width: 100%; |
| 8 } | 14 } |
| 9 | 15 |
| 10 body { | 16 body { |
| 11 -webkit-align-items: center; | 17 -webkit-align-items: center; |
| 12 -webkit-flex-direction: column; | 18 -webkit-flex-direction: column; |
| 13 background-color: #f4f4f4; | 19 background-color: #fafafa; |
| 14 box-sizing: border-box; | 20 box-sizing: border-box; |
| 15 display: -webkit-flex; | 21 display: -webkit-flex; |
| 16 font-family: Droid Sans; | 22 font-family: 'Roboto2', sans-serif; |
| 17 height: 100%; | 23 height: 100%; |
| 18 margin: 0 auto; | 24 margin: 0 auto; |
| 19 max-width: 600px; | 25 max-width: 600px; |
| 20 padding: 20px; | 26 padding: 20px; |
| 21 width: 100%; | 27 width: 100%; |
| 22 } | 28 } |
| 23 | 29 |
| 24 a { | 30 a { |
| 25 color: rgb(51, 181, 229); | 31 color: rgb(51, 181, 229); |
| 26 } | 32 } |
| 27 | 33 |
| 28 .spacing { | 34 .spacing { |
| 29 -webkit-flex: 1; | 35 -webkit-flex: 1; |
| 30 } | 36 } |
| 31 | 37 |
| 32 #logo { | 38 #logo { |
| 33 -webkit-flex-shrink: 1; | 39 -webkit-flex-shrink: 1; |
| 34 background-position: center; | 40 background-position: center; |
| 35 background-repeat: no-repeat; | 41 background-repeat: no-repeat; |
| 36 background-size: contain; | 42 background-size: contain; |
| 37 min-height: 60px; | 43 min-height: 60px; |
| 38 width: 100%; | 44 width: 100%; |
| 39 } | 45 } |
| 40 | 46 |
| 41 #take-a-tour { | 47 #take-a-tour { |
| 42 -webkit-flex: none; | 48 -webkit-flex: none; |
| 43 background: linear-gradient(to bottom, #f5f5f5, #f1f1f1); | 49 background-color: rgb(66, 133, 244); |
| 44 border: 1px solid #ccc; | |
| 45 border-radius: 2px; | 50 border-radius: 2px; |
| 46 box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08), | 51 color: white; |
| 47 inset 0 0 2px rgba(255, 255, 255, 0.6); | |
| 48 color: rgb(73, 73, 74); | |
| 49 display: block; | 52 display: block; |
| 50 font-size: 20px; | 53 font-size: 18px; |
| 51 font-weight: bold; | 54 font-weight: medium; |
| 52 margin: 20px auto 0; | 55 margin: 20px auto 0; |
| 53 max-width: 400px; | 56 max-width: 320px; |
| 54 padding: 11px 0; | 57 padding: 15px 0; |
| 55 text-align: center; | 58 text-align: center; |
| 56 text-decoration: none; | 59 text-decoration: none; |
| 60 text-transform: uppercase; |
| 57 width: 100%; | 61 width: 100%; |
| 58 } | 62 } |
| 59 | 63 |
| 60 #take-a-tour:active { | |
| 61 border: 1px solid #a1a1a1; | |
| 62 box-shadow: inset 0 5px 15px rgba(100, 100, 100, 0.20); | |
| 63 } | |
| 64 | |
| 65 .footer { | 64 .footer { |
| 66 -webkit-flex: none; | 65 -webkit-flex: none; |
| 67 color: #646464; | 66 color: #646464; |
| 68 font-size: 1.3em; | 67 font-size: 1.3em; |
| 69 margin-top: 20px; | 68 margin-top: 20px; |
| 70 text-align: center; | 69 text-align: center; |
| 71 } | 70 } |
| 72 | 71 |
| 73 /* Logos */ | 72 /* Logos */ |
| 74 @media only screen { | 73 @media only screen { |
| (...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 107 @media only screen and (min-height: 601px) { | 106 @media only screen and (min-height: 601px) { |
| 108 body { | 107 body { |
| 109 padding: 100px 20px; | 108 padding: 100px 20px; |
| 110 } | 109 } |
| 111 | 110 |
| 112 #take-a-tour, | 111 #take-a-tour, |
| 113 #footer { | 112 #footer { |
| 114 margin-top: 60px; | 113 margin-top: 60px; |
| 115 } | 114 } |
| 116 } | 115 } |
| OLD | NEW |