Home | History | Annotate | Download | only in css
      1 /*
      2  * The default style sheet used to render HTML.
      3  *
      4  * Copyright (C) 2000 Lars Knoll (knoll (at) kde.org)
      5  * Copyright (C) 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011 Apple Inc. All rights reserved.
      6  *
      7  * This library is free software; you can redistribute it and/or
      8  * modify it under the terms of the GNU Library General Public
      9  * License as published by the Free Software Foundation; either
     10  * version 2 of the License, or (at your option) any later version.
     11  *
     12  * This library is distributed in the hope that it will be useful,
     13  * but WITHOUT ANY WARRANTY; without even the implied warranty of
     14  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
     15  * Library General Public License for more details.
     16  *
     17  * You should have received a copy of the GNU Library General Public License
     18  * along with this library; see the file COPYING.LIB.  If not, write to
     19  * the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
     20  * Boston, MA 02110-1301, USA.
     21  *
     22  */
     23 
     24 @namespace "http://www.w3.org/1999/xhtml";
     25 
     26 html {
     27     display: block
     28 }
     29 
     30 /* children of the <head> element all have display:none */
     31 head {
     32     display: none
     33 }
     34 
     35 meta {
     36     display: none
     37 }
     38 
     39 title {
     40     display: none
     41 }
     42 
     43 link {
     44     display: none
     45 }
     46 
     47 style {
     48     display: none
     49 }
     50 
     51 script {
     52     display: none
     53 }
     54 
     55 /* generic block-level elements */
     56 
     57 body {
     58     display: block;
     59     margin: 8px
     60 }
     61 
     62 body:-webkit-full-page-media {
     63     background-color: rgb(0, 0, 0)
     64 }
     65 
     66 p {
     67     display: block;
     68     -webkit-margin-before: 1__qem;
     69     -webkit-margin-after: 1__qem;
     70     -webkit-margin-start: 0;
     71     -webkit-margin-end: 0;
     72 }
     73 
     74 div {
     75     display: block
     76 }
     77 
     78 layer {
     79     display: block
     80 }
     81 
     82 article, aside, footer, header, hgroup, main, nav, section {
     83     display: block
     84 }
     85 
     86 marquee {
     87     display: inline-block;
     88 }
     89 
     90 address {
     91     display: block
     92 }
     93 
     94 blockquote {
     95     display: block;
     96     -webkit-margin-before: 1__qem;
     97     -webkit-margin-after: 1em;
     98     -webkit-margin-start: 40px;
     99     -webkit-margin-end: 40px;
    100 }
    101 
    102 figcaption {
    103     display: block
    104 }
    105 
    106 figure {
    107     display: block;
    108     -webkit-margin-before: 1em;
    109     -webkit-margin-after: 1em;
    110     -webkit-margin-start: 40px;
    111     -webkit-margin-end: 40px;
    112 }
    113 
    114 q {
    115     display: inline
    116 }
    117 
    118 q:before {
    119     content: open-quote;
    120 }
    121 
    122 q:after {
    123     content: close-quote;
    124 }
    125 
    126 center {
    127     display: block;
    128     /* special centering to be able to emulate the html4/netscape behaviour */
    129     text-align: -webkit-center
    130 }
    131 
    132 hr {
    133     display: block;
    134     -webkit-margin-before: 0.5em;
    135     -webkit-margin-after: 0.5em;
    136     -webkit-margin-start: auto;
    137     -webkit-margin-end: auto;
    138     border-style: inset;
    139     border-width: 1px
    140 }
    141 
    142 map {
    143     display: inline
    144 }
    145 
    146 video {
    147     object-fit: contain;
    148 }
    149 
    150 /* heading elements */
    151 
    152 h1 {
    153     display: block;
    154     font-size: 2em;
    155     -webkit-margin-before: 0.67__qem;
    156     -webkit-margin-after: 0.67em;
    157     -webkit-margin-start: 0;
    158     -webkit-margin-end: 0;
    159     font-weight: bold
    160 }
    161 
    162 :-webkit-any(article,aside,nav,section) h1 {
    163     font-size: 1.5em;
    164     -webkit-margin-before: 0.83__qem;
    165     -webkit-margin-after: 0.83em;
    166 }
    167 
    168 :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) h1 {
    169     font-size: 1.17em;
    170     -webkit-margin-before: 1__qem;
    171     -webkit-margin-after: 1em;
    172 }
    173 
    174 :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) h1 {
    175     font-size: 1.00em;
    176     -webkit-margin-before: 1.33__qem;
    177     -webkit-margin-after: 1.33em;
    178 }
    179 
    180 :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) h1 {
    181     font-size: .83em;
    182     -webkit-margin-before: 1.67__qem;
    183     -webkit-margin-after: 1.67em;
    184 }
    185 
    186 :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) :-webkit-any(article,aside,nav,section) h1 {
    187     font-size: .67em;
    188     -webkit-margin-before: 2.33__qem;
    189     -webkit-margin-after: 2.33em;
    190 }
    191 
    192 h2 {
    193     display: block;
    194     font-size: 1.5em;
    195     -webkit-margin-before: 0.83__qem;
    196     -webkit-margin-after: 0.83em;
    197     -webkit-margin-start: 0;
    198     -webkit-margin-end: 0;
    199     font-weight: bold
    200 }
    201 
    202 h3 {
    203     display: block;
    204     font-size: 1.17em;
    205     -webkit-margin-before: 1__qem;
    206     -webkit-margin-after: 1em;
    207     -webkit-margin-start: 0;
    208     -webkit-margin-end: 0;
    209     font-weight: bold
    210 }
    211 
    212 h4 {
    213     display: block;
    214     -webkit-margin-before: 1.33__qem;
    215     -webkit-margin-after: 1.33em;
    216     -webkit-margin-start: 0;
    217     -webkit-margin-end: 0;
    218     font-weight: bold
    219 }
    220 
    221 h5 {
    222     display: block;
    223     font-size: .83em;
    224     -webkit-margin-before: 1.67__qem;
    225     -webkit-margin-after: 1.67em;
    226     -webkit-margin-start: 0;
    227     -webkit-margin-end: 0;
    228     font-weight: bold
    229 }
    230 
    231 h6 {
    232     display: block;
    233     font-size: .67em;
    234     -webkit-margin-before: 2.33__qem;
    235     -webkit-margin-after: 2.33em;
    236     -webkit-margin-start: 0;
    237     -webkit-margin-end: 0;
    238     font-weight: bold
    239 }
    240 
    241 /* tables */
    242 
    243 table {
    244     display: table;
    245     border-collapse: separate;
    246     border-spacing: 2px;
    247     border-color: gray
    248 }
    249 
    250 thead {
    251     display: table-header-group;
    252     vertical-align: middle;
    253     border-color: inherit
    254 }
    255 
    256 tbody {
    257     display: table-row-group;
    258     vertical-align: middle;
    259     border-color: inherit
    260 }
    261 
    262 tfoot {
    263     display: table-footer-group;
    264     vertical-align: middle;
    265     border-color: inherit
    266 }
    267 
    268 /* for tables without table section elements (can happen with XHTML or dynamically created tables) */
    269 table > tr {
    270     vertical-align: middle;
    271 }
    272 
    273 col {
    274     display: table-column
    275 }
    276 
    277 colgroup {
    278     display: table-column-group
    279 }
    280 
    281 tr {
    282     display: table-row;
    283     vertical-align: inherit;
    284     border-color: inherit
    285 }
    286 
    287 td, th {
    288     display: table-cell;
    289     vertical-align: inherit
    290 }
    291 
    292 th {
    293     font-weight: bold
    294 }
    295 
    296 caption {
    297     display: table-caption;
    298     text-align: -webkit-center
    299 }
    300 
    301 /* lists */
    302 
    303 ul, menu, dir {
    304     display: block;
    305     list-style-type: disc;
    306     -webkit-margin-before: 1__qem;
    307     -webkit-margin-after: 1em;
    308     -webkit-margin-start: 0;
    309     -webkit-margin-end: 0;
    310     -webkit-padding-start: 40px
    311 }
    312 
    313 ol {
    314     display: block;
    315     list-style-type: decimal;
    316     -webkit-margin-before: 1__qem;
    317     -webkit-margin-after: 1em;
    318     -webkit-margin-start: 0;
    319     -webkit-margin-end: 0;
    320     -webkit-padding-start: 40px
    321 }
    322 
    323 li {
    324     display: list-item;
    325     text-align: -webkit-match-parent;
    326 }
    327 
    328 ul ul, ol ul {
    329     list-style-type: circle
    330 }
    331 
    332 ol ol ul, ol ul ul, ul ol ul, ul ul ul {
    333     list-style-type: square
    334 }
    335 
    336 dd {
    337     display: block;
    338     -webkit-margin-start: 40px
    339 }
    340 
    341 dl {
    342     display: block;
    343     -webkit-margin-before: 1__qem;
    344     -webkit-margin-after: 1em;
    345     -webkit-margin-start: 0;
    346     -webkit-margin-end: 0;
    347 }
    348 
    349 dt {
    350     display: block
    351 }
    352 
    353 ol ul, ul ol, ul ul, ol ol {
    354     -webkit-margin-before: 0;
    355     -webkit-margin-after: 0
    356 }
    357 
    358 /* form elements */
    359 
    360 form {
    361     display: block;
    362     margin-top: 0__qem;
    363 }
    364 
    365 label {
    366     cursor: default;
    367 }
    368 
    369 legend {
    370     display: block;
    371     -webkit-padding-start: 2px;
    372     -webkit-padding-end: 2px;
    373     border: none
    374 }
    375 
    376 fieldset {
    377     display: block;
    378     -webkit-margin-start: 2px;
    379     -webkit-margin-end: 2px;
    380     -webkit-padding-before: 0.35em;
    381     -webkit-padding-start: 0.75em;
    382     -webkit-padding-end: 0.75em;
    383     -webkit-padding-after: 0.625em;
    384     border: 2px groove ThreeDFace;
    385     min-width: -webkit-min-content;
    386 }
    387 
    388 button {
    389     -webkit-appearance: button;
    390 }
    391 
    392 /* Form controls don't go vertical. */
    393 input, textarea, keygen, select, button, meter, progress {
    394     -webkit-writing-mode: horizontal-tb !important;
    395 }
    396 
    397 input, textarea, keygen, select, button {
    398     margin: 0__qem;
    399     font: -webkit-small-control;
    400     color: initial;
    401     letter-spacing: normal;
    402     word-spacing: normal;
    403     line-height: normal;
    404     text-transform: none;
    405     text-indent: 0;
    406     text-shadow: none;
    407     display: inline-block;
    408     text-align: start;
    409 }
    410 
    411 input[type="hidden" i] {
    412     display: none
    413 }
    414 
    415 input, input[type="password" i], input[type="search" i] {
    416     -webkit-appearance: textfield;
    417     padding: 1px;
    418     background-color: white;
    419     border: 2px inset;
    420     -webkit-rtl-ordering: logical;
    421     -webkit-user-select: text;
    422     cursor: auto;
    423 }
    424 
    425 input[type="search" i] {
    426     -webkit-appearance: searchfield;
    427     box-sizing: border-box;
    428 }
    429 
    430 input::-webkit-textfield-decoration-container {
    431     display: flex;
    432     align-items: center;
    433     -webkit-user-modify: read-only !important;
    434     content: none !important;
    435 }
    436 
    437 input[type="search" i]::-webkit-textfield-decoration-container {
    438     direction: ltr;
    439 }
    440 
    441 input::-webkit-clear-button {
    442     -webkit-appearance: searchfield-cancel-button;
    443     display: inline-block;
    444     flex: none;
    445     -webkit-user-modify: read-only !important;
    446     -webkit-margin-start: 2px;
    447     opacity: 0;
    448     pionter-events: none;
    449 }
    450 
    451 input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-clear-button {
    452     opacity: 1;
    453     pointer-events: auto;
    454 }
    455 
    456 input[type="search" i]::-webkit-search-cancel-button {
    457     -webkit-appearance: searchfield-cancel-button;
    458     display: block;
    459     flex: none;
    460     -webkit-user-modify: read-only !important;
    461     -webkit-margin-start: 1px;
    462     opacity: 0;
    463     pointer-events: none;
    464 }
    465 
    466 input[type="search" i]:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-search-cancel-button {
    467     opacity: 1;
    468     pointer-events: auto;
    469 }
    470 
    471 input[type="search" i]::-webkit-search-decoration {
    472     -webkit-appearance: searchfield-decoration;
    473     display: block;
    474     flex: none;
    475     -webkit-user-modify: read-only !important;
    476     -webkit-align-self: flex-start;
    477     margin: auto 0;
    478 }
    479 
    480 input[type="search" i]::-webkit-search-results-decoration {
    481     -webkit-appearance: searchfield-results-decoration;
    482     display: block;
    483     flex: none;
    484     -webkit-user-modify: read-only !important;
    485     -webkit-align-self: flex-start;
    486     margin: auto 0;
    487 }
    488 
    489 input::-webkit-inner-spin-button {
    490     -webkit-appearance: inner-spin-button;
    491     display: inline-block;
    492     cursor: default;
    493     flex: none;
    494     align-self: stretch;
    495     -webkit-user-select: none;
    496     -webkit-user-modify: read-only !important;
    497     opacity: 0;
    498     pointer-events: none;
    499 }
    500 
    501 input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-inner-spin-button {
    502     opacity: 1;
    503     pointer-events: auto;
    504 }
    505 
    506 keygen, select {
    507     border-radius: 5px;
    508 }
    509 
    510 keygen::-webkit-keygen-select {
    511     margin: 0px;
    512 }
    513 
    514 textarea {
    515     -webkit-appearance: textarea;
    516     background-color: white;
    517     border: 1px solid;
    518     -webkit-rtl-ordering: logical;
    519     -webkit-user-select: text;
    520     flex-direction: column;
    521     resize: auto;
    522     cursor: auto;
    523     padding: 2px;
    524     white-space: pre-wrap;
    525     word-wrap: break-word;
    526 }
    527 
    528 ::-webkit-input-placeholder {
    529     -webkit-text-security: none;
    530     color: darkGray;
    531     display: block !important;
    532     pointer-events: none !important;
    533 }
    534 
    535 input::-webkit-input-placeholder {
    536     white-space: pre;
    537     word-wrap: normal;
    538     overflow: hidden;
    539     -webkit-user-modify: read-only !important;
    540 }
    541 
    542 input[type="password" i] {
    543     -webkit-text-security: disc !important;
    544 }
    545 
    546 input[type="hidden" i], input[type="image" i], input[type="file" i] {
    547     -webkit-appearance: initial;
    548     padding: initial;
    549     background-color: initial;
    550     border: initial;
    551 }
    552 
    553 input[type="file" i] {
    554     align-items: baseline;
    555     color: inherit;
    556     text-align: start !important;
    557 }
    558 
    559 input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    560     background-color: #FAFFBD !important;
    561     background-image:none !important;
    562     color: #000000 !important;
    563 }
    564 
    565 input[type="radio" i], input[type="checkbox" i] {
    566     margin: 3px 0.5ex;
    567     padding: initial;
    568     background-color: initial;
    569     border: initial;
    570 }
    571 
    572 input[type="button" i], input[type="submit" i], input[type="reset" i] {
    573     -webkit-appearance: push-button;
    574     -webkit-user-select: none;
    575     white-space: pre
    576 }
    577 
    578 input[type="file" i]::-webkit-file-upload-button {
    579     -webkit-appearance: push-button;
    580     -webkit-user-modify: read-only !important;
    581     white-space: nowrap;
    582     margin: 0;
    583     font-size: inherit;
    584 }
    585 
    586 input[type="button" i], input[type="submit" i], input[type="reset" i], input[type="file" i]::-webkit-file-upload-button, button {
    587     align-items: flex-start;
    588     text-align: center;
    589     cursor: default;
    590     color: ButtonText;
    591     padding: 2px 6px 3px 6px;
    592     border: 2px outset ButtonFace;
    593     background-color: ButtonFace;
    594     box-sizing: border-box
    595 }
    596 
    597 input[type="range" i] {
    598     -webkit-appearance: slider-horizontal;
    599     padding: initial;
    600     border: initial;
    601     margin: 2px;
    602     color: #909090;
    603 }
    604 
    605 input[type="range" i]::-webkit-slider-container, input[type="range" i]::-webkit-media-slider-container {
    606     flex: 1;
    607     box-sizing: border-box;
    608     -webkit-user-modify: read-only !important;
    609     display: flex;
    610     -webkit-align-contents: center;
    611 }
    612 
    613 input[type="range" i]::-webkit-slider-runnable-track {
    614     flex: 1;
    615     -webkit-align-self: center;
    616 
    617     box-sizing: border-box;
    618     -webkit-user-modify: read-only !important;
    619     display: block;
    620 }
    621 
    622 input[type="range" i]::-webkit-slider-thumb, input[type="range" i]::-webkit-media-slider-thumb {
    623     -webkit-appearance: sliderthumb-horizontal;
    624     box-sizing: border-box;
    625     -webkit-user-modify: read-only !important;
    626     display: block;
    627 }
    628 
    629 input[type="button" i]:disabled, input[type="submit" i]:disabled, input[type="reset" i]:disabled,
    630 input[type="file" i]:disabled::-webkit-file-upload-button, button:disabled,
    631 select:disabled, keygen:disabled, optgroup:disabled, option:disabled,
    632 select[disabled]>option {
    633     color: GrayText
    634 }
    635 
    636 input[type="button" i]:active, input[type="submit" i]:active, input[type="reset" i]:active, input[type="file" i]:active::-webkit-file-upload-button, button:active {
    637     border-style: inset
    638 }
    639 
    640 input[type="button" i]:active:disabled, input[type="submit" i]:active:disabled, input[type="reset" i]:active:disabled, input[type="file" i]:active:disabled::-webkit-file-upload-button, button:active:disabled {
    641     border-style: outset
    642 }
    643 
    644 option:-internal-spatial-navigation-focus {
    645     outline: black dashed 1px;
    646     outline-offset: -1px;
    647 }
    648 
    649 datalist {
    650     display: none
    651 }
    652 
    653 area {
    654     display: inline
    655 }
    656 
    657 param {
    658     display: none
    659 }
    660 
    661 input[type="checkbox" i] {
    662     -webkit-appearance: checkbox;
    663     box-sizing: border-box;
    664 }
    665 
    666 input[type="radio" i] {
    667     -webkit-appearance: radio;
    668     box-sizing: border-box;
    669 }
    670 
    671 input[type="color" i] {
    672     -webkit-appearance: square-button;
    673     width: 44px;
    674     height: 23px;
    675     background-color: ButtonFace;
    676     /* Same as native_theme_base. */
    677     border: 1px #a9a9a9 solid;
    678     padding: 1px 2px;
    679 }
    680 
    681 input[type="color" i]::-webkit-color-swatch-wrapper {
    682     display:flex;
    683     padding: 4px 2px;
    684     box-sizing: border-box;
    685     -webkit-user-modify: read-only !important;
    686     width: 100%;
    687     height: 100%
    688 }
    689 
    690 input[type="color" i]::-webkit-color-swatch {
    691     background-color: #000000;
    692     border: 1px solid #777777;
    693     flex: 1;
    694     -webkit-user-modify: read-only !important;
    695 }
    696 
    697 input[type="color" i][list] {
    698     -webkit-appearance: menulist;
    699     width: 88px;
    700     height: 23px
    701 }
    702 
    703 input[type="color" i][list]::-webkit-color-swatch-wrapper {
    704     padding-left: 8px;
    705     padding-right: 24px;
    706 }
    707 
    708 input[type="color" i][list]::-webkit-color-swatch {
    709     border-color: #000000;
    710 }
    711 
    712 input::-webkit-calendar-picker-indicator {
    713     display: inline-block;
    714     width: 0.66em;
    715     height: 0.66em;
    716     padding: 0.17em 0.34em;
    717     -webkit-user-modify: read-only !important;
    718     opacity: 0;
    719     pointer-events: none;
    720 }
    721 
    722 input::-webkit-calendar-picker-indicator:hover {
    723     background-color: #eee;
    724 }
    725 
    726 input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-calendar-picker-indicator,
    727 input::-webkit-calendar-picker-indicator:focus {
    728     opacity: 1;
    729     pointer-events: auto;
    730 }
    731 
    732 input[type="date" i]:disabled::-webkit-clear-button,
    733 input[type="date" i]:disabled::-webkit-inner-spin-button,
    734 input[type="datetime-local" i]:disabled::-webkit-clear-button,
    735 input[type="datetime-local" i]:disabled::-webkit-inner-spin-button,
    736 input[type="month" i]:disabled::-webkit-clear-button,
    737 input[type="month" i]:disabled::-webkit-inner-spin-button,
    738 input[type="week" i]:disabled::-webkit-clear-button,
    739 input[type="week" i]:disabled::-webkit-inner-spin-button,
    740 input:disabled::-webkit-calendar-picker-indicator,
    741 input[type="date" i][readonly]::-webkit-clear-button,
    742 input[type="date" i][readonly]::-webkit-inner-spin-button,
    743 input[type="datetime-local" i][readonly]::-webkit-clear-button,
    744 input[type="datetime-local" i][readonly]::-webkit-inner-spin-button,
    745 input[type="month" i][readonly]::-webkit-clear-button,
    746 input[type="month" i][readonly]::-webkit-inner-spin-button,
    747 input[type="week" i][readonly]::-webkit-clear-button,
    748 input[type="week" i][readonly]::-webkit-inner-spin-button,
    749 input[readonly]::-webkit-calendar-picker-indicator {
    750     visibility: hidden;
    751 }
    752 
    753 select {
    754     -webkit-appearance: menulist;
    755     box-sizing: border-box;
    756     align-items: center;
    757     border: 1px solid;
    758     white-space: pre;
    759     -webkit-rtl-ordering: logical;
    760     color: black;
    761     background-color: white;
    762     cursor: default;
    763 }
    764 
    765 select:-internal-list-box {
    766     -webkit-appearance: listbox;
    767     align-items: flex-start;
    768     border: 1px inset gray;
    769     border-radius: initial;
    770     overflow-x: hidden;
    771     overflow-y: scroll;
    772     vertical-align: text-bottom;
    773     -webkit-user-select: none;
    774     white-space: nowrap;
    775 }
    776 
    777 optgroup {
    778     font-weight: bolder;
    779     display: block;
    780 }
    781 
    782 option {
    783     font-weight: normal;
    784     display: block;
    785     padding: 0 2px 1px 2px;
    786     white-space: pre;
    787     min-height: 1.2em;
    788 }
    789 
    790 select:-internal-list-box option,
    791 select:-internal-list-box optgroup {
    792     line-height: initial !important;
    793 }
    794 
    795 select:-internal-list-box:focus option:checked {
    796     background-color: -internal-active-list-box-selection !important;
    797     color: -internal-active-list-box-selection-text !important;
    798 }
    799 
    800 select:-internal-list-box option:checked {
    801     background-color: -internal-inactive-list-box-selection !important;
    802     color: -internal-inactive-list-box-selection-text !important;
    803 }
    804 
    805 select:-internal-list-box:disabled option:checked,
    806 select:-internal-list-box option:checked:disabled {
    807     color: gray !important;
    808 }
    809 
    810 
    811 output {
    812     display: inline;
    813 }
    814 
    815 /* meter */
    816 
    817 meter {
    818     -webkit-appearance: meter;
    819     box-sizing: border-box;
    820     display: inline-block;
    821     height: 1em;
    822     width: 5em;
    823     vertical-align: -0.2em;
    824 }
    825 
    826 meter::-webkit-meter-inner-element {
    827     -webkit-appearance: inherit;
    828     box-sizing: inherit;
    829     -webkit-user-modify: read-only !important;
    830     height: 100%;
    831     width: 100%;
    832 }
    833 
    834 meter::-webkit-meter-bar {
    835     background: linear-gradient(to bottom, #ddd, #eee 20%, #ccc 45%, #ccc 55%, #ddd);
    836     height: 100%;
    837     width: 100%;
    838     -webkit-user-modify: read-only !important;
    839     box-sizing: border-box;
    840 }
    841 
    842 meter::-webkit-meter-optimum-value {
    843     background: linear-gradient(to bottom, #ad7, #cea 20%, #7a3 45%, #7a3 55%, #ad7);
    844     height: 100%;
    845     -webkit-user-modify: read-only !important;
    846     box-sizing: border-box;
    847 }
    848 
    849 meter::-webkit-meter-suboptimum-value {
    850     background: linear-gradient(to bottom, #fe7, #ffc 20%, #db3 45%, #db3 55%, #fe7);
    851     height: 100%;
    852     -webkit-user-modify: read-only !important;
    853     box-sizing: border-box;
    854 }
    855 
    856 meter::-webkit-meter-even-less-good-value {
    857     background: linear-gradient(to bottom, #f77, #fcc 20%, #d44 45%, #d44 55%, #f77);
    858     height: 100%;
    859     -webkit-user-modify: read-only !important;
    860     box-sizing: border-box;
    861 }
    862 
    863 /* progress */
    864 
    865 progress {
    866     -webkit-appearance: progress-bar;
    867     box-sizing: border-box;
    868     display: inline-block;
    869     height: 1em;
    870     width: 10em;
    871     vertical-align: -0.2em;
    872 }
    873 
    874 progress::-webkit-progress-inner-element {
    875     -webkit-appearance: inherit;
    876     box-sizing: inherit;
    877     -webkit-user-modify: read-only;
    878     height: 100%;
    879     width: 100%;
    880 }
    881 
    882 progress::-webkit-progress-bar {
    883     background-color: gray;
    884     height: 100%;
    885     width: 100%;
    886     -webkit-user-modify: read-only !important;
    887     box-sizing: border-box;
    888 }
    889 
    890 progress::-webkit-progress-value {
    891     background-color: green;
    892     height: 100%;
    893     width: 50%; /* should be removed later */
    894     -webkit-user-modify: read-only !important;
    895     box-sizing: border-box;
    896 }
    897 
    898 /* inline elements */
    899 
    900 u, ins {
    901     text-decoration: underline
    902 }
    903 
    904 strong, b {
    905     font-weight: bold
    906 }
    907 
    908 i, cite, em, var, address, dfn {
    909     font-style: italic
    910 }
    911 
    912 tt, code, kbd, samp {
    913     font-family: monospace
    914 }
    915 
    916 pre, xmp, plaintext, listing {
    917     display: block;
    918     font-family: monospace;
    919     white-space: pre;
    920     margin: 1__qem 0
    921 }
    922 
    923 mark {
    924     background-color: yellow;
    925     color: black
    926 }
    927 
    928 big {
    929     font-size: larger
    930 }
    931 
    932 small {
    933     font-size: smaller
    934 }
    935 
    936 s, strike, del {
    937     text-decoration: line-through
    938 }
    939 
    940 sub {
    941     vertical-align: sub;
    942     font-size: smaller
    943 }
    944 
    945 sup {
    946     vertical-align: super;
    947     font-size: smaller
    948 }
    949 
    950 nobr {
    951     white-space: nowrap
    952 }
    953 
    954 /* states */
    955 
    956 :focus {
    957     outline: auto 5px -webkit-focus-ring-color
    958 }
    959 
    960 /* Read-only text fields do not show a focus ring but do still receive focus */
    961 html:focus, body:focus, input[readonly]:focus {
    962     outline: none
    963 }
    964 
    965 applet:focus, embed:focus, iframe:focus, object:focus {
    966     outline: none
    967 }
    968 
    969 input:focus, textarea:focus, keygen:focus, select:focus {
    970     outline-offset: -2px
    971 }
    972 
    973 input[type="button" i]:focus,
    974 input[type="checkbox" i]:focus,
    975 input[type="file" i]:focus,
    976 input[type="hidden" i]:focus,
    977 input[type="image" i]:focus,
    978 input[type="radio" i]:focus,
    979 input[type="reset" i]:focus,
    980 input[type="search" i]:focus,
    981 input[type="submit" i]:focus,
    982 input[type="file" i]:focus::-webkit-file-upload-button {
    983     outline-offset: 0
    984 }
    985 
    986 a:-webkit-any-link {
    987     color: -webkit-link;
    988     text-decoration: underline;
    989     cursor: auto;
    990 }
    991 
    992 a:-webkit-any-link:active {
    993     color: -webkit-activelink
    994 }
    995 
    996 /* HTML5 ruby elements */
    997 
    998 ruby, rt {
    999     text-indent: 0; /* blocks used for ruby rendering should not trigger this */
   1000 }
   1001 
   1002 rt {
   1003     line-height: normal;
   1004     -webkit-text-emphasis: none;
   1005 }
   1006 
   1007 ruby > rt {
   1008     display: block;
   1009     font-size: 50%;
   1010     text-align: start;
   1011 }
   1012 
   1013 ruby > rp {
   1014     display: none;
   1015 }
   1016 
   1017 /* other elements */
   1018 
   1019 noframes {
   1020     display: none
   1021 }
   1022 
   1023 frameset, frame {
   1024     display: block
   1025 }
   1026 
   1027 frameset {
   1028     border-color: inherit
   1029 }
   1030 
   1031 iframe {
   1032     border: 2px inset
   1033 }
   1034 
   1035 details {
   1036     display: block
   1037 }
   1038 
   1039 summary {
   1040     display: block
   1041 }
   1042 
   1043 summary::-webkit-details-marker {
   1044     display: inline-block;
   1045     width: 0.66em;
   1046     height: 0.66em;
   1047     -webkit-margin-end: 0.4em;
   1048 }
   1049 
   1050 template {
   1051     display: none
   1052 }
   1053 
   1054 bdi, output {
   1055     unicode-bidi: -webkit-isolate;
   1056 }
   1057 
   1058 bdo {
   1059     unicode-bidi: bidi-override;
   1060 }
   1061 
   1062 textarea[dir=auto i] {
   1063     unicode-bidi: -webkit-plaintext;
   1064 }
   1065 
   1066 dialog:not([open]) {
   1067     display: none
   1068 }
   1069 
   1070 dialog {
   1071     position: absolute;
   1072     left: 0;
   1073     right: 0;
   1074     width: -webkit-fit-content;
   1075     height: -webkit-fit-content;
   1076     margin: auto;
   1077     border: solid;
   1078     padding: 1em;
   1079     background: white;
   1080     color: black
   1081 }
   1082 
   1083 dialog::backdrop {
   1084     position: fixed;
   1085     top: 0;
   1086     right: 0;
   1087     bottom: 0;
   1088     left: 0;
   1089     background: rgba(0,0,0,0.1)
   1090 }
   1091 
   1092 /* page */
   1093 
   1094 @page {
   1095     /* FIXME: Define the right default values for page properties. */
   1096     size: auto;
   1097     margin: auto;
   1098     padding: 0px;
   1099     border-width: 0px;
   1100 }
   1101 
   1102 /* noscript is handled internally, as it depends on settings. */
   1103 
   1104