| LEFT | RIGHT |
| 1 /****************************************************************************** | 1 /****************************************************************************** |
| 2 * Temparary styles | 2 * Temparary styles |
| 3 *****************************************************************************/ | 3 *****************************************************************************/ |
| 4 | 4 |
| 5 .avoid-wrap {display: inline-block;} | 5 .avoid-wrap {display: inline-block;} |
| 6 .small {font-size: smaller;} | 6 .small {font-size: smaller;} |
| 7 | 7 |
| 8 /****************************************************************************** | 8 /****************************************************************************** |
| 9 * Browser-based styles | 9 * Browser-based styles |
| 10 *****************************************************************************/ | 10 *****************************************************************************/ |
| (...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 68 /* Spacing is provided by the hero-download section */ | 68 /* Spacing is provided by the hero-download section */ |
| 69 margin-top: 0; | 69 margin-top: 0; |
| 70 } | 70 } |
| 71 | 71 |
| 72 @media (min-width: 576px) | 72 @media (min-width: 576px) |
| 73 { | 73 { |
| 74 /* force break without <br> on large screens */ | 74 /* force break without <br> on large screens */ |
| 75 #hero-download h1 .avoid-wrap:first-of-type | 75 #hero-download h1 .avoid-wrap:first-of-type |
| 76 { | 76 { |
| 77 display: block; | 77 display: block; |
| 78 } | |
| 79 } | |
| 80 | |
| 81 #hero-download-tos | |
| 82 { | |
| 83 margin-bottom: 0.5em; | |
| 84 } | |
| 85 | |
| 86 #hero-download-alternate | |
| 87 { | |
| 88 font-size: smaller; | |
| 89 } | |
| 90 | |
| 91 #hero-download-button | |
| 92 { | |
| 93 display: inline-block; | |
| 94 min-width: 250px; | |
| 95 /* stretch full-width <= small tablets */ | |
| 96 width: 100%; | |
| 97 /* 0.2em taller than normal buttons */ | |
| 98 padding-top: 0.8em; | |
| 99 padding-bottom: 0.8em; | |
| 100 color: #fff; | |
| 101 background-color: #3D9C4F; | |
| 102 } | |
| 103 | |
| 104 #hero-download-button:hover, | |
| 105 #hero-download-button:focus | |
| 106 { | |
| 107 background-color: #258333; | |
| 108 } | |
| 109 | |
| 110 @media (min-width: 576px) | |
| 111 { | |
| 112 #hero-download-button | |
| 113 { | |
| 114 /* force auto-width >= small tablets */ | |
| 115 width: auto; | |
| 116 } | 78 } |
| 117 } | 79 } |
| 118 | 80 |
| 119 #hero-download-video | 81 #hero-download-video |
| 120 { | 82 { |
| 121 /* add space above on phones & tablets */ | 83 /* add space above on phones & tablets */ |
| 122 margin-top: 2em; | 84 margin-top: 2em; |
| 123 /* prevent default full-width on small tablets */ | 85 /* prevent default full-width on small tablets */ |
| 124 max-width: 550px; | 86 max-width: 550px; |
| 125 } | 87 } |
| (...skipping 226 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 352 * #footnote | 314 * #footnote |
| 353 *****************************************************************************/ | 315 *****************************************************************************/ |
| 354 | 316 |
| 355 #footnote | 317 #footnote |
| 356 { | 318 { |
| 357 padding-top: 3em; | 319 padding-top: 3em; |
| 358 padding-bottom: 2em; | 320 padding-bottom: 2em; |
| 359 font-size: 13px; | 321 font-size: 13px; |
| 360 color: #7d7d7d; | 322 color: #7d7d7d; |
| 361 } | 323 } |
| LEFT | RIGHT |