| 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 .maxthon-only {display: none;} | 7 .maxthon-only {display: none;} |
| 8 .maxthon .maxthon-only {display: block;} | 8 .maxthon .maxthon-only {display: block;} |
| 9 | 9 |
| 10 #content, | 10 #content, |
| (...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 66 #hero-download-video | 66 #hero-download-video |
| 67 { | 67 { |
| 68 display: block; | 68 display: block; |
| 69 } | 69 } |
| 70 } | 70 } |
| 71 | 71 |
| 72 /****************************************************************************** | 72 /****************************************************************************** |
| 73 * #media | 73 * #media |
| 74 *****************************************************************************/ | 74 *****************************************************************************/ |
| 75 | 75 |
| 76 #media-section { clear: both; } | 76 #media-section |
| 77 | 77 { |
| 78 #media-header h2, | 78 clear: both; |
| 79 #media-list | 79 text-align: center; |
| 80 { | |
| 81 margin: 0; | |
| 82 } | 80 } |
| 83 | 81 |
| 84 #media-header | 82 #media-header |
| 85 { | 83 { |
| 86 margin-bottom: 2em; | 84 margin-bottom: 1em; |
| 87 } | 85 } |
| 88 | 86 |
| 89 #media-header h2 | 87 #media-header h2 |
| 90 { | 88 { |
| 91 font-size: 1em; | 89 font-size: 1em; |
| 92 font-weight: normal; | 90 font-weight: normal; |
| 93 text-transform: uppercase; | 91 text-transform: uppercase; |
| 92 } |
| 93 |
| 94 #media-header h2, |
| 95 #media-list |
| 96 { |
| 97 margin: 0; |
| 94 } | 98 } |
| 95 | 99 |
| 96 #media-list li | 100 #media-list li |
| 97 { | 101 { |
| 98 display: inline-block; | 102 display: inline-block; |
| 99 } | 103 } |
| 100 | 104 |
| 101 #media-list img | 105 #media-list img |
| 102 { | 106 { |
| 103 max-width: 10em; | 107 max-width: 10em; |
| (...skipping 26 matching lines...) Expand all Loading... |
| 130 border-radius: 50%; | 134 border-radius: 50%; |
| 131 background-color: #000; | 135 background-color: #000; |
| 132 background-image: url(../img/external-icon.png); | 136 background-image: url(../img/external-icon.png); |
| 133 background-image: linear-gradient(transparent, transparent), | 137 background-image: linear-gradient(transparent, transparent), |
| 134 url(../img/external-icon.svg); | 138 url(../img/external-icon.svg); |
| 135 background-repeat: no-repeat; | 139 background-repeat: no-repeat; |
| 136 background-position: center; | 140 background-position: center; |
| 137 background-size: 1em; | 141 background-size: 1em; |
| 138 } | 142 } |
| 139 | 143 |
| 140 @media (min-width: 992px) | 144 @media (min-width: 1024px) |
| 141 { | 145 { |
| 142 #media-header small | 146 #media |
| 143 { | 147 { |
| 144 display: none; | |
| 145 } | |
| 146 | |
| 147 #media-list | |
| 148 { | |
| 149 display: table; | |
| 150 width: 100%; | |
| 151 } | |
| 152 | |
| 153 #media-list li | |
| 154 { | |
| 155 display: table-cell; | |
| 156 vertical-align: middle; | |
| 157 } | |
| 158 | |
| 159 #media-list img | |
| 160 { | |
| 161 margin: 0 2em; | |
| 162 } | |
| 163 } | |
| 164 | |
| 165 @media (min-width: 768px) | |
| 166 { | |
| 167 #media { | |
| 168 display: table; | 148 display: table; |
| 169 width: 100%; | 149 width: 100%; |
| 170 } | 150 } |
| 171 | 151 |
| 172 #media-header, | 152 #media-header, |
| 173 #media-list | 153 #media-list |
| 174 { | 154 { |
| 175 display: table-cell; | 155 display: table-cell; |
| 176 vertical-align: middle; | 156 vertical-align: middle; |
| 177 width: auto; | 157 width: auto; |
| 178 } | 158 } |
| 179 | 159 |
| 180 #media-header | 160 #media-header |
| 181 { | 161 { |
| 182 margin-bottom: 0; | 162 margin-bottom: 0; |
| 163 } |
| 164 |
| 165 #media-header small |
| 166 { |
| 167 display: none; |
| 183 } | 168 } |
| 184 | 169 |
| 185 #media-list { direction: rtl; } | 170 #media-list { direction: rtl; } |
| 186 [dir="rtl"] #media-list { direction: ltr; } | 171 [dir="rtl"] #media-list { direction: ltr; } |
| 187 | 172 |
| 188 @supports (display: flex) | 173 @supports (display: flex) |
| 189 { | 174 { |
| 190 #media-list | 175 #media-list |
| 191 { | 176 { |
| 192 display: flex; | 177 display: flex; |
| 193 justify-content: space-between; | 178 justify-content: space-between; |
| 194 align-items: center; | 179 align-items: center; |
| 195 } | 180 } |
| 196 } | 181 } |
| 197 | 182 |
| 183 #media-list |
| 184 { |
| 185 display: table; |
| 186 width: 100%; |
| 187 } |
| 188 |
| 189 #media-list li |
| 190 { |
| 191 display: table-cell; |
| 192 vertical-align: middle; |
| 193 } |
| 194 |
| 195 #media-list img |
| 196 { |
| 197 margin: 0 2em; |
| 198 } |
| 198 } | 199 } |
| 199 | 200 |
| 200 /****************************************************************************** | 201 /****************************************************************************** |
| 201 * #abb-notification | 202 * #abb-notification |
| 202 *****************************************************************************/ | 203 *****************************************************************************/ |
| 203 | 204 |
| 204 #abb-notification | 205 #abb-notification |
| 205 { | 206 { |
| 206 padding: 3em 0; | 207 padding: 3em 0; |
| 207 } | 208 } |
| (...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 255 padding-right: 2em; | 256 padding-right: 2em; |
| 256 } | 257 } |
| 257 } | 258 } |
| 258 | 259 |
| 259 /****************************************************************************** | 260 /****************************************************************************** |
| 260 * #footnote | 261 * #footnote |
| 261 *****************************************************************************/ | 262 *****************************************************************************/ |
| 262 | 263 |
| 263 #footnote | 264 #footnote |
| 264 { | 265 { |
| 265 margin-top: 20px; | 266 padding-top: 3em; |
| 266 text-align: start; | 267 padding-bottom: 2em; |
| 268 font-size: 13px; |
| 267 color: #7d7d7d; | 269 color: #7d7d7d; |
| 268 } | 270 } |
| 269 | |
| 270 #footnote, | |
| 271 #footnote li, | |
| 272 #footnote a, | |
| 273 #footnote strong | |
| 274 { | |
| 275 font-size: 11px; | |
| 276 } | |
| 277 | |
| 278 #footnote li | |
| 279 { | |
| 280 padding-bottom: 5px; | |
| 281 } | |
| 282 | |
| 283 #footnote li:first-child | |
| 284 { | |
| 285 padding-top: 5px; | |
| 286 } | |
| 287 | |
| 288 #footnote ul | |
| 289 { | |
| 290 margin: 0px; | |
| 291 padding: 0px 30px; | |
| 292 } | |
| 293 | |
| 294 @media(max-width: 767px) | |
| 295 { | |
| 296 #footnote | |
| 297 { | |
| 298 padding: 0px 20px; | |
| 299 } | |
| 300 } | |
| LEFT | RIGHT |